From aaabc8f48f05f4a731fc328da1edbc7b888eed2c Mon Sep 17 00:00:00 2001
From: Smart <kamali@watermelon.us>
Date: Fri, 21 Apr 2023 10:10:51 +0530
Subject: [PATCH] ui-fix

---
 .../service-list/service-list.component.html  | 57 +++++++++++++++----
 .../service-list/service-list.component.scss  |  9 +++
 .../user/user-list/user-list.component.html   |  2 +-
 .../user/user-list/user-list.component.scss   |  3 +
 4 files changed, 60 insertions(+), 11 deletions(-)

diff --git a/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.html b/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.html
index 894843e..f670890 100644
--- a/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.html
+++ b/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.html
@@ -15,37 +15,73 @@
                 <mat-expansion-panel-header > -->
                   <!-- <div class="example-container mat-elevation-z8 "> -->
 
-                    <table mat-table [dataSource]="servicesListSource" matSort *ngIf="servicesListLength > 0" class="my-table mat-elevation-z8 len-table">
+                    <table  mat-table  [dataSource]="servicesListSource" #mytable class="my-table mat-elevation-z8 len-table">
+      
+                      <ng-container matColumnDef="serviceId">
+                        <th mat-header-cell *matHeaderCellDef class="font-color mat-no"> S.No</th>
+                        <td mat-cell *matCellDef="let row; let i = index;" class="element-spc"> {{row.serviceId}} </td>
+                      </ng-container>
+
+                      <ng-container matColumnDef="servicesName">
+                        <th mat-header-cell *matHeaderCellDef class="font-color">Service Name </th>
+                        <td mat-cell *matCellDef="let row"> {{row.servicesName}} </td>
+                      </ng-container>
+
+                      <ng-container matColumnDef="duration">
+                        <th mat-header-cell *matHeaderCellDef class="font-color th-mat"> Duration </th>
+                        <td mat-cell *matCellDef="let row"> {{row.duration}} Mins</td>
+                      </ng-container>
+
+                      <ng-container matColumnDef="fees">
+                        <th mat-header-cell *matHeaderCellDef class="font-color th-mat"> Fees </th>
+                        <td mat-cell *matCellDef="let row" class="element-spc"> {{row.fees}} </td>
+                      </ng-container>
+
+                      <ng-container matColumnDef="description">
+                        <th mat-header-cell *matHeaderCellDef class="font-color"> Description </th>
+                        <td mat-cell *matCellDef="let row" class="element-spc"> {{row.description}} </td>
+                      </ng-container>
+
+                      <ng-container matColumnDef="action">
+                        <th mat-header-cell *matHeaderCellDef class="font-color mat-action"> Action </th>
+                        <td mat-cell *matCellDef="let row" class="action-link"> 
+                          <a (click)="openDialog('Update',row)"><span class="material-icons edit-color">edit</span></a> 
+                          <a (click)="confirmBox('Delete',row)"><span class="material-icons edit-color2 delete">delete</span></a> 
+                        </td>
+                      </ng-container>
+
+                      <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
+                     <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+                    </table>
+
+
+                    <!-- <table mat-table [dataSource]="servicesListSource" matSort *ngIf="servicesListLength > 0" class="my-table mat-elevation-z8 len-table">
                   
-                      <!-- ID Column -->
                       <ng-container matColumnDef="serviceId">
                         <mat-header-cell *matHeaderCellDef mat-sort-header> S.No </mat-header-cell>
                         <mat-cell *matCellDef="let row; let i = index;"> {{row.serviceId}} </mat-cell>
                       </ng-container>  
-                  
-                      <!-- Duration Column -->
+
                       <ng-container matColumnDef="servicesName">
                         <mat-header-cell *matHeaderCellDef mat-sort-header> Service Name </mat-header-cell>
                         <mat-cell *matCellDef="let row"> {{row.servicesName}} </mat-cell>
                       </ng-container> 
 
-                       <!-- Description Column -->
                        <ng-container matColumnDef="duration">
                         <mat-header-cell *matHeaderCellDef mat-sort-header> Duration </mat-header-cell>
                         <mat-cell *matCellDef="let row"> {{row.duration}} Mins</mat-cell>
                       </ng-container> 
+
                       <ng-container matColumnDef="fees">
                         <mat-header-cell *matHeaderCellDef mat-sort-header> Fees </mat-header-cell>
                         <mat-cell *matCellDef="let row"> {{row.fees}} </mat-cell>
                       </ng-container> 
-                       <!-- Description Column -->
+
                        <ng-container matColumnDef="description">
                         <mat-header-cell *matHeaderCellDef mat-sort-header> Description </mat-header-cell>
                         <mat-cell *matCellDef="let row"> {{row.description}} </mat-cell>
-                      </ng-container> 
+                      </ng-container>
 
-                  
-                      <!-- Action Column -->
                       <ng-container matColumnDef="action">
                         <mat-header-cell *matHeaderCellDef mat-sort-header> Action </mat-header-cell>
                         <mat-cell *matCellDef="let row">
@@ -58,7 +94,8 @@
                       <mat-row *matRowDef="let row; columns: displayedColumns;">
                       </mat-row>
                       
-                    </table>
+                    </table> -->
+
                     <mat-card *ngIf="isLoading" style="display: flex; justify-content: center; align-items: center">
                       <mat-progress-spinner 
                         color="primary" 
diff --git a/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.scss b/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.scss
index a440109..e10ddeb 100644
--- a/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.scss
+++ b/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.scss
@@ -88,4 +88,13 @@ img {
     /* overflow: auto; */
     overflow-x: hidden;
     overflow-y: auto;
+  }
+  .mat-no{
+    width: 7%; 
+  }
+  .th-mat{
+    width: 15%;
+  }
+  .mat-action{
+    width: 10%; 
   }
\ No newline at end of file
diff --git a/ng-seed/src/app/appoinment/user/user-list/user-list.component.html b/ng-seed/src/app/appoinment/user/user-list/user-list.component.html
index 34a2a8c..1c15b75 100644
--- a/ng-seed/src/app/appoinment/user/user-list/user-list.component.html
+++ b/ng-seed/src/app/appoinment/user/user-list/user-list.component.html
@@ -55,7 +55,7 @@
                       </ng-container>
 
                       <ng-container matColumnDef="busId">
-                        <th mat-header-cell *matHeaderCellDef class="font-color"> Business Name </th>
+                        <th mat-header-cell *matHeaderCellDef class="font-color th-mat"> Business Name </th>
                         <td mat-cell *matCellDef="let element"> {{element.BusinessDetails.length>0 ? element.BusinessDetails[0].busName : null }}</td>
                         
                       </ng-container>
diff --git a/ng-seed/src/app/appoinment/user/user-list/user-list.component.scss b/ng-seed/src/app/appoinment/user/user-list/user-list.component.scss
index 290bcec..a0a34d6 100644
--- a/ng-seed/src/app/appoinment/user/user-list/user-list.component.scss
+++ b/ng-seed/src/app/appoinment/user/user-list/user-list.component.scss
@@ -204,4 +204,7 @@ img {
     overflow: auto;
     max-height: 500px;
   }
+  .th-mat{
+    width: 18%;
+  }
   
\ No newline at end of file