From 98ed6b750009f91e3d7b97a74da12ea7423696cc Mon Sep 17 00:00:00 2001
From: "surendar.m@watermelon.us" <bitbucket@venbainfotech.com>
Date: Fri, 31 Mar 2023 18:05:23 +0530
Subject: [PATCH] appointment table customer info

---
 .../appoinments-list.component.html           | 38 +++++++++----------
 .../appoinments-list.component.ts             | 18 +--------
 2 files changed, 20 insertions(+), 36 deletions(-)

diff --git a/ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.html b/ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.html
index fe3be01..2e1794d 100644
--- a/ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.html
+++ b/ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.html
@@ -18,11 +18,11 @@
                      <table mat-table [dataSource]="appoinmentsList" #mytable class="my-table mat-elevation-z8 len-table">
                           <ng-container matColumnDef="Profile">
                         <th mat-header-cell *matHeaderCellDef class="font-color"> Profile </th>
-                        <td mat-cell *matCellDef="let element" class="element-spc"> <br><img src="assets/images/profile.jpg" />  </td>
+                        <td mat-cell *matCellDef="let element"><img src="assets/images/profile.jpg" />  </td>
                         </ng-container>
                         <ng-container matColumnDef="ClientName">
                            <th mat-header-cell *matHeaderCellDef class="font-color"> Client Name </th>
-                           <td mat-cell *matCellDef="let element"> <br><div class="label">{{element.customer[0].cusName || null  }} </div></td>
+                           <td mat-cell *matCellDef="let element"> {{element.customer[0].cusName || null  }} </td>
 
                         
                         </ng-container>
@@ -30,26 +30,24 @@
                         <th mat-header-cell *matHeaderCellDef class="font-color"> Date & Time </th>
                         <td mat-cell *matCellDef="let element"> {{element.picker}} </td>
                         </ng-container> -->
-                        <ng-container matColumnDef="date">
-                           <th mat-header-cell *matHeaderCellDef class="font-color">Appointment Date</th>
-                           <td mat-cell *matCellDef="let element"> <br><div class="label">{{element.appoinmentDate | date:'dd-MMM-YYYY'  }}</div>
+                        <ng-container matColumnDef="datetime">
+                           <th mat-header-cell *matHeaderCellDef class="font-color">Appointment Date and Time</th>
+                           <td mat-cell *matCellDef="let element">{{element.appoinmentDate | date:'dd-MMM-YYYY'}}, {{element.appoinmentSlots}}
                           </td>
-                        </ng-container>
-                     <ng-container matColumnDef="time">
-                        <th mat-header-cell *matHeaderCellDef class="font-color">Appointment Time </th>
-                        <td mat-cell *matCellDef="let element"><br> <div class="label">{{element.appoinmentSlots   }}</div>  </td>
+                        </ng-container> 
+                         <ng-container matColumnDef="phoneNo">
+                        <th mat-header-cell *matHeaderCellDef class="font-color"> Mobile No </th>
+                        <td mat-cell *matCellDef="let element">{{element.customer[0].phoneNo}} </td>
                      </ng-container>
-                 
-               
-                        <!--  <ng-container matColumnDef="workspace">
-                        <th mat-header-cell *matHeaderCellDef class="font-color"> Workspace </th>
-                        <td mat-cell *matCellDef="let element" class="element-spc"> <br> {{element.workspace}} </td>
-                     </ng-container> -->
-                     <!-- <ng-container matColumnDef="service">
-                        <th mat-header-cell *matHeaderCellDef class="font-color"> Service </th>
-                        <td mat-cell *matCellDef="let element" class="element-spc"> <br><img src="assets/images/1.jpg" /> {{element.service}} </td>
+                      <ng-container matColumnDef="email">
+                        <th mat-header-cell *matHeaderCellDef class="font-color"> Email </th>
+                        <td mat-cell *matCellDef="let element"> {{element.customer[0].email}} </td>
                      </ng-container>
-                     <ng-container matColumnDef="staff">
+                     <ng-container matColumnDef="address">
+                        <th mat-header-cell *matHeaderCellDef class="font-color">Client Address</th>
+                        <td mat-cell *matCellDef="let element">{{element.customer[0].address_1}}, {{element.customer[0].city}}, {{element.customer[0].state}}, {{element.customer[0].pincode }}</td>
+                     </ng-container>
+                     <!--<ng-container matColumnDef="staff">
                         <th mat-header-cell *matHeaderCellDef class="font-color"> Staff </th>
                         <td mat-cell *matCellDef="let element" class="element-spc"> <br><img src="assets/images/2.jpg" /> {{element.staff}} </td>
                      </ng-container>
@@ -63,7 +61,7 @@
                      </ng-container> -->
                      <ng-container matColumnDef="status">
                         <th mat-header-cell *matHeaderCellDef class="font-color"> Status </th>
-                        <td mat-cell *matCellDef="let element">  <br><span style="font-weight: 700;" [ngStyle] = "{'color':element.status == '0'  ? '#4caf50' : '#ffd740'}">{{element.status == 0 ? 'Booked':'Cancelled'}} </span></td>
+                        <td mat-cell *matCellDef="let element"><span style="font-weight: 700;" [ngStyle] = "{'color':element.status == '0'  ? '#4caf50' : '#ffd740'}">{{element.status == 0 ? 'Booked':'Cancelled'}} </span></td>
                      </ng-container>
                      <ng-container matColumnDef="action">
                         <th mat-header-cell *matHeaderCellDef class="font-color"> Action </th>
diff --git a/ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.ts b/ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.ts
index 51c5666..8641ec9 100644
--- a/ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.ts
+++ b/ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.ts
@@ -19,20 +19,7 @@ export interface UsersData {
   note: string;
   appoinmentSlots: string;
 }
-const ELEMENT_DATA: UsersData[] = [
-  {busId: 1 , appoinmentSlots: '"start": "09:00",', appoinmentTime: '11:00', booking: '#SA-00001', workspace: 'Sample', service: 'Hospital', staff: 'Kumar.S', customer:'A', paymentStatus:'Free', status: 'Pending', appoinmentDate:'01 Mar 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
-  {busId: 2 ,appoinmentSlots: '"start": "09:00",', appoinmentTime: '12:00', booking: '#SA-00002', workspace: 'Test', service: 'School', staff: 'Devi.k', customer:'B', paymentStatus:'Paid', status: 'Completed', appoinmentDate:'22 Feb 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
-  {busId: 3 ,appoinmentSlots: '"start": "09:00",', appoinmentTime: '13:00', booking: '#SA-00003', workspace: 'Sample', service: 'Sports', staff: 'Kumar.S', customer:'C', paymentStatus:'Free', status: 'Pending', appoinmentDate:'21 Feb 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
-  {busId: 4 ,appoinmentSlots: '"start": "09:00",', appoinmentTime: '14:00', booking: '#SA-00004', workspace: 'Test', service: 'Hospital', staff: 'Devi.k', customer:'A', paymentStatus:'Paid', status: 'Completed', appoinmentDate:'20 Feb 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
-  {busId: 5 ,appoinmentSlots: '"start": "09:00",', appoinmentTime: '15:00', booking: '#SA-00005', workspace: 'Sample', service: 'School', staff: 'Kumar.S', customer:'B', paymentStatus:'Free', status: 'Pending', appoinmentDate:'17 Feb 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
-  {busId: 6 ,appoinmentSlots: '"start": "09:00",', appoinmentTime: '16:00', booking: '#SA-00006', workspace: 'Test', service: 'Sports', staff: 'Devi.k', customer:'C', paymentStatus:'Paid', status: 'Completed', appoinmentDate:'16 Feb 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
-  {busId: 7 ,appoinmentSlots: '"start": "09:00",', appoinmentTime: '17:00', booking: '#SA-00007', workspace: 'Sample', service: 'Hospital', staff: 'Kumar.S', customer:'A', paymentStatus:'Free', status: 'Pending', appoinmentDate:'15 Feb 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
-  {busId: 8 ,appoinmentSlots: '"start": "09:00",', appoinmentTime: '18:00', booking: '#SA-00008', workspace: 'Test', service: 'School', staff: 'Devi.k', customer:'B', paymentStatus:'Paid', status: 'Completed', appoinmentDate:'14 Feb 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
-  {busId: 9 ,appoinmentSlots: '"start": "09:00",', appoinmentTime: '10:00', booking: '#SA-00009', workspace: 'Sample', service: 'Sports', staff: 'Kumar.S', customer:'C', paymentStatus:'Free', status: 'Pending', appoinmentDate:'13 Feb 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
-  {busId: 10 ,appoinmentSlots: '"start": "09:00",', appoinmentTime: '09:00', booking: '#SA-000010', workspace: 'Test', service: 'Hospital', staff: 'Devi.k', customer:'A', paymentStatus:'Paid', status: 'Completed', appoinmentDate:'12 Feb 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
-  {busId: 11 ,appoinmentSlots: '"start": "09:00",', appoinmentTime: '08:00', booking: '#SA-000011', workspace: 'Sample', service: 'School', staff: 'Kumar.S', customer:'B', paymentStatus:'Free', status: 'Pending', appoinmentDate:'11 Feb 2023', note: 'Financial statement footnotes are used as additional information by individuals reading financial statements.'},
 
-];
 @Component({
   selector: 'app-appoinments-list',
   templateUrl: './appoinments-list.component.html',
@@ -41,7 +28,7 @@ const ELEMENT_DATA: UsersData[] = [
 export class AppoinmentsListComponent implements OnInit {
 
   push: any;
-  displayedColumns: string[] = ['Profile', 'ClientName','date','time','status', 'action'];
+  displayedColumns: string[] = ['Profile', 'ClientName','datetime','phoneNo','email','address','status', 'action'];
   // dataSource: any;
   public appoinmentsList:any = new MatTableDataSource();
   // dataSource: any = new MatTableDataSource(ELEMENT_DATA);
@@ -70,8 +57,7 @@ export class AppoinmentsListComponent implements OnInit {
             this.appoinmentsList
         console.log(this.appoinmentsList)
         
-        let filter = this.appoinmentsList.filter(arr=>{return arr["ServicesMapDetail.userId"]
-          == id}) 
+        let filter = this.appoinmentsList.filter(arr=>{return arr["ServicesMapDetail.userId"] == id}) 
         console.log(filter)
         this.appoinmentsList = filter
             }