template alignment

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd2/start-pd2.component.ts

@@ -114,7 +114,7 @@ export class StartPd2Component implements OnInit, OnDestroy {
     // load templates details
     loadTemplates(startID:string,type:number,randomString:string){
     // console.log('start pd component inside - loadTemplates params are,',startID,type,randomString);
-    this._pd.loadPDTemplates(startID,randomString).subscribe(
+    this._pd.loadPDTemplates2(startID,randomString).subscribe(
       data => {
           console.log("after reponse = ",  data);
           console.log("after reponse = ",  data.records.pdmaster_details);

ng6-seed/src/app/personal-discussion/pd-service/pd-triger.service.ts

@@ -383,6 +383,19 @@ export class PdTrigerService {
     //load pd template details
     loadPDTemplates(pdId: string,randomString): Observable<any> {
     
+        let httpParams = new HttpParams().set('pd_id', pdId);
+        httpParams = httpParams.append('random_string',randomString);
+        // console.log('loadFullTemplate api load httpParams are',httpParams);
+        const options = pdId ? { params: httpParams } : {};
+        console.log(options)
+        return this._http.get<any[]>(this.apiUrl + "loadFullTemplate", options)
+        //return this._http.get<any[]>(this.apiUrl + "loadFullTemplateV2", options)
+            .pipe(
+            catchError(this.handleError('operation', []))
+            )
+    }
+    loadPDTemplates2(pdId: string,randomString): Observable<any> {
+    
         let httpParams = new HttpParams().set('pd_id', pdId);
         httpParams = httpParams.append('random_string',randomString);
         // console.log('loadFullTemplate api load httpParams are',httpParams);

ng6-seed/src/app/template2/edit-template/edit-template.component.html

@@ -10,15 +10,15 @@
 </h2>
 <div>
   <mat-card> 
-    <!-- <div fxLayout="row" fxLayout.xs="column" fxLayoutWrap style="padding-top:1%">
+    <div fxLayout="row" fxLayout.xs="column" fxLayoutWrap style="padding-top:1%">
-      <div fxFlex="80%" style="padding-left: 250px;">
+      <div fxFlex="80%" >
-          <mat-card-title><span style="font-size:24px"> Deselective Questions will be Disable</span></mat-card-title>
+          <mat-card-title><span style="font-size:24px">{{section_name}}</span></mat-card-title>
         </div>
         <div fxFlex="20%" style="padding-left: 50px;">
-          <button mat-raised-button mat-icon-button class="hover-icon  " type="button" matTooltip="Close" matTooltipPosition="above"
+          <!-- <button mat-raised-button mat-icon-button class="hover-icon  " type="button" matTooltip="Close" matTooltipPosition="above"
-(click)="loadPdViewCompoent()"><mat-icon>close</mat-icon></button>
+(click)="loadPdViewCompoent()"><mat-icon>close</mat-icon></button> -->
+          </div>
   </div>
-  </div> -->
       <mat-card-content>
        
       
@@ -40,13 +40,13 @@
     
   </div>
  
-      <mat-tree [dataSource]="dataSource" [treeControl]="treeControl">
+      <mat-tree #tree [dataSource]="dataSource" [treeControl]="treeControl" style="padding-left: 80px;">
 
         <mat-tree-node *matTreeNodeDef="let node" matTreeNodeToggle matTreeNodePadding >
           <button mat-icon-button disabled></button>
           <mat-checkbox class="checklist-leaf-node" 
                         [checked]="checklistSelection.isSelected(node)  == false"
-                        (change)="todoLeafItemSelectionToggle(node,checklistSelection.isSelected(node))"><span style="color: red;" [ngStyle] = "{'background-color':checklistSelection.isSelected(node) == true ? 'red' : ''}&&{'text-decoration':checklistSelection.isSelected(node) == true ? 'line-through' : ''}" > <span style='color:black'>{{node.item}}</span></span></mat-checkbox>
+                        (change)="todoLeafItemSelectionToggle(node,checklistSelection.isSelected(node))"><span style="color: red;" [ngStyle] = "{'background-color':checklistSelection.isSelected(node) == true ? 'red' : ''}&&{'text-decoration':checklistSelection.isSelected(node) == true ? 'line-through' : ''}" > <span style='color:black;font-size: 20px;'>{{node.item}}</span></span></mat-checkbox>
         </mat-tree-node>
       
         <mat-tree-node *matTreeNodeDef="let node; when: hasNoContent" matTreeNodePadding>
@@ -66,7 +66,7 @@
           </button>
           <mat-checkbox [checked]="descendantsAllSelected(node) == false"
                         [indeterminate]="descendantsPartiallySelected(node)"
-                        (change)="todoItemSelectionToggle(node,descendantsAllSelected(node))"><span style="color: red;" [ngStyle] = "{'background-color':descendantsAllSelected(node) == true ? 'red' : ''}&&{'text-decoration':descendantsAllSelected(node) == true ? 'line-through' : ''}" > <span style='color:black'>{{node.item}}</span></span></mat-checkbox>
+                        (change)="todoItemSelectionToggle(node,descendantsAllSelected(node))"><span style="color: red;" [ngStyle] = "{'background-color':descendantsAllSelected(node) == true ? 'red' : ''}&&{'text-decoration':descendantsAllSelected(node) == true ? 'line-through' : ''}" > <span style='color:black;font-size: 20px;'>{{node.item}}</span></span></mat-checkbox>
          
         </mat-tree-node>
       </mat-tree>

ng6-seed/src/app/template2/edit-template/edit-template.component.ts

@@ -2,7 +2,7 @@
 
 import {SelectionModel} from '@angular/cdk/collections';
 import {FlatTreeControl} from '@angular/cdk/tree';
-import {Component, Injectable} from '@angular/core';
+import {Component, Injectable, ViewChild} from '@angular/core';
 import {MatTreeFlatDataSource, MatTreeFlattener} from '@angular/material/tree';
 import {BehaviorSubject} from 'rxjs';
 import { MasterService } from '../master.service';
@@ -10,6 +10,7 @@ import { NotifierService } from 'angular-notifier';
 import { ActivatedRoute, Router, Params } from '@angular/router';
 import { FocusTrap } from '@angular/cdk/a11y';
 import { LenderListComponent } from '../lender-list/lender-list.component';
+import { LoaderService } from 'app/shared/loaderService/loader.service';
 /**
  * Node for to-do item
  */
@@ -37,11 +38,13 @@ export class TodoItemFlatNode {
  */
 @Injectable()
 export class ChecklistDatabase {
+  @ViewChild('tree') tree;
   dataChange = new BehaviorSubject<TodoItemNode[]>([]);
   val: any;
   g: any=[];
   checked:any=true;
   myModel = true;
+  section_name: any=[];
   get data(): TodoItemNode[] { return this.dataChange.value; }
 
   constructor( private masterService: MasterService) {
@@ -76,6 +79,8 @@ export class ChecklistDatabase {
     }
    //question_json = JSON.parse(data.json)
     console.log(question_json)
+    console.log(question_json.section_name)
+
   
   //  let dd =  JSON.parse(JSON.stringify(data))
   //   console.log(dd)
@@ -310,10 +315,13 @@ export class ChecklistDatabase {
   styleUrls: ['./edit-template.component.scss'],
   providers: [ChecklistDatabase]
 })
+
 export class EditTemplateComponent {
+ 
   /** Map from flat node to nested node. This helps us finding the nested node to be modified */
   flatNodeMap = new Map<TodoItemFlatNode, TodoItemNode>();
 
+
   /** Map from nested node to flattened node. This helps us to keep the same object for selection */
   nestedNodeMap = new Map<TodoItemNode, TodoItemFlatNode>();
 
@@ -335,9 +343,10 @@ export class EditTemplateComponent {
   result: any[];
   errorMessage: string;
   form_id: any;
+  section_name: any;
 
   constructor(private database: ChecklistDatabase, private masterService: MasterService, private notifier: NotifierService , private route: ActivatedRoute,
-    private router: Router, private LenderListComponent: LenderListComponent,) {
+    private router: Router, private LenderListComponent: LenderListComponent,private loaderService:LoaderService) {
     this.treeFlattener = new MatTreeFlattener(this.transformer, this.getLevel,
       this.isExpandable, this.getChildren);
     this.treeControl = new FlatTreeControl<TodoItemFlatNode>(this.getLevel, this.isExpandable);
@@ -346,10 +355,11 @@ export class EditTemplateComponent {
     database.dataChange.subscribe(data => {
       this.dataSource.data = data;
     });
-
+    this.loaderService.showMatSpinnerDialog("")
     this.masterService.list_3_observable$.subscribe(res=> {
       console.log("nav list 3",res)
     
+      this.section_name =  res.form_name
       this.form_id = res.form_id;
 
       this.val =  JSON.parse(res.json)
@@ -357,6 +367,11 @@ export class EditTemplateComponent {
       
     })
   }
+  // ngOnInit() {
+  //   setTimeout(()=>{   
+  //   this.tree.treeControl.expandAll();
+  //       }, 1000);
+  // }
 getLevel = (node: TodoItemFlatNode) => node.level;
 
   isExpandable = (node: TodoItemFlatNode) => node.expandable;
@@ -365,6 +380,9 @@ getLevel = (node: TodoItemFlatNode) => node.level;
   
   hasChild = (_: number, _nodeData: TodoItemFlatNode) => _nodeData.expandable;
   
+  @ViewChild('tree') tree;
+
+
   hasNoContent = (_: number, _nodeData: TodoItemFlatNode) => _nodeData.item === '';
   
   /**
@@ -391,7 +409,15 @@ getLevel = (node: TodoItemFlatNode) => node.level;
     );
     return descAllSelected;
   }
+  ngAfterViewInit() {
     
+    setTimeout(()=>{   
+      
+      this.tree.treeControl.expandAll();
+      this.loaderService.closeMatSpinnerDialog()
+          }, 500);
+        
+  }
   /** Whether part of the descendants are selected */
   descendantsPartiallySelected(node: TodoItemFlatNode): boolean {
     const descendants = this.treeControl.getDescendants(node);
@@ -744,6 +770,8 @@ getLevel = (node: TodoItemFlatNode) => node.level;
  
           }
           
+
+          
   }
   
 

ng6-seed/src/app/template2/selection-list-view/selection-list-view.component.html

@@ -8,6 +8,7 @@
           (click)="loadPdViewCompoent()"><mat-icon>close</mat-icon></button>            
   </div>
 </h2>
+<ng-container>
 <mat-card class="parent_mat_card">
     <!-- <div fxLayout="row" fxLayout.xs="column" fxLayoutWrap style="padding-top:1%">
         <div fxFlex="80%" style="padding-left: 250px;">
@@ -79,6 +80,5 @@
           <!-- <button matTooltip="Complete Discussion" matTooltipPosition="above" [disabled]="actualQuestions==0 || actualQuestions!=answeredQuestions || currentPDStatus===false" mat-raised-button color="primary" (click)="pdStatusDialogue(pdStatusCheck.COMPLETED,2);"><span>{{currentPDStatus === true ? 'COMPLETE':'COMPLETED' }}</span></button>
   </mat-card-actions> -->
 </mat-card>
-
+</ng-container>
-
 <notifier-container></notifier-container>