appointment table customer info
This commit is contained in:
surendar.m@watermelon.us
parent
130dfa3fd8
commit
98ed6b7500
@ -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>
|
||||
|
||||
@ -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
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user