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 9fe4215..fe3be01 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
@@ -37,7 +37,7 @@
                         </ng-container>
                      <ng-container matColumnDef="time">
                         <th mat-header-cell *matHeaderCellDef class="font-color">Appointment Time </th>
-                        <td mat-cell *matCellDef="let element"> <div class="label">{{element.appoinmentSlots   }}</div>  </td>
+                        <td mat-cell *matCellDef="let element"><br> <div class="label">{{element.appoinmentSlots   }}</div>  </td>
                      </ng-container>
                  
                
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 2c87f65..51c5666 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
@@ -63,8 +63,18 @@ export class AppoinmentsListComponent implements OnInit {
     this._app.getAppoinmentsListDetails().subscribe(res => {
           if (res.status == 200) {
             this.appoinmentsList = res.data; 
+            let user_role = localStorage.getItem('user_role');
+            if(user_role == 'PRACTITIONER'){
+            let id = localStorage.getItem('user_id')
+            console.log(id)
+            this.appoinmentsList
         console.log(this.appoinmentsList)
-           
+        
+        let filter = this.appoinmentsList.filter(arr=>{return arr["ServicesMapDetail.userId"]
+          == id}) 
+        console.log(filter)
+        this.appoinmentsList = filter
+            }
           }
           else{
           
diff --git a/ng-seed/src/app/appoinment/business/business-list/business-list.component.ts b/ng-seed/src/app/appoinment/business/business-list/business-list.component.ts
index a2bb14f..8b93e29 100644
--- a/ng-seed/src/app/appoinment/business/business-list/business-list.component.ts
+++ b/ng-seed/src/app/appoinment/business/business-list/business-list.component.ts
@@ -160,7 +160,19 @@ export class BusinessListComponent implements OnInit {
      
     // var d = this.customersList.length+1
     console.log(formValue[0])
-     this._bus.addFormDetails(formValue[0]).subscribe(res => {
+    
+    const  formData:FormData  = new FormData();
+  formData.append('image', formValue[0].logo);
+  // formData.append('busId', JSON.stringify(formValue[0].busName));
+  // formData.append('busName', JSON.stringify(formValue[0].busName));
+ 
+  // formData.append('address', JSON.stringify(formValue[0].address));
+  // formData.append('state', JSON.stringify(formValue[0].state));
+  // formData.append('city', JSON.stringify(formValue[0].city));
+  // formData.append('email', JSON.stringify(formValue[0].email));
+  // formData.append('contactNo', JSON.stringify(formValue[0].contactNo));
+console.log(formData)
+     this._bus.addFormDetails(formData).subscribe(res => {
       if (res.status == 200) {
         // this.customersList = res.data;
         this.getBusinessList()
diff --git a/ng-seed/src/app/appoinment/business/business-service/business.service.ts b/ng-seed/src/app/appoinment/business/business-service/business.service.ts
index 77d638f..03a2154 100644
--- a/ng-seed/src/app/appoinment/business/business-service/business.service.ts
+++ b/ng-seed/src/app/appoinment/business/business-service/business.service.ts
@@ -19,7 +19,7 @@ export class BusinessService {
     )
   }
 
-  addFormDetails(addParams): Observable<any> {
+  addFormDetails(addParams:any): Observable<any> {
     return this._http.post(this.apiUrl + 'createBusinessDetails', addParams)
         // .pipe(
         // catchError(this.handleError('role', []))
diff --git a/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.html b/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.html
new file mode 100644
index 0000000..4bcf0ee
--- /dev/null
+++ b/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.html
@@ -0,0 +1,28 @@
+<!-- <mat-card class="settings-panel" > -->
+    <h5 mat-dialog-title>
+       <strong>Assign Service</strong> 
+       <button mat-icon-button  type="button" matTooltip="Close" class="button" matTooltipPosition="above" (click)="closeDialog()">
+          <mat-icon>close</mat-icon>
+       </button>
+    </h5> 
+      <form [formGroup]="form" (ngSubmit)="submit()">
+         <ng-scrollbar class="scrollHV">
+            <div mat-dialog-content class="my-table">
+               <mat-form-field  appearance="outline" class="mat-pane">
+                  <mat-label>Duration</mat-label>
+                  <input placeholder="Duration" type="number" matInput  formControlName="duration">
+                  <mat-error *ngIf="myError('duration', 'required')">Duration is required</mat-error>
+               </mat-form-field>          
+               <mat-form-field  appearance="outline" class="mat-pane">
+                  <mat-label>Fees</mat-label>
+                  <input placeholder="Fees" matInput type="number" formControlName="fees">
+                  <mat-error *ngIf="myError('fees', 'required')">Fees is required</mat-error>
+               </mat-form-field>
+            </div>
+          </ng-scrollbar>
+          <div mat-dialog-actions>
+            <button mat-button type="submit" class="mat-green" mat-raised-button >Submit</button>
+            <button mat-button (click)="closeDialog()" >Cancel</button>
+          </div>
+      </form>
+<!-- </mat-card> -->
\ No newline at end of file
diff --git a/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.scss b/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.scss
new file mode 100644
index 0000000..ad079c5
--- /dev/null
+++ b/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.scss
@@ -0,0 +1,62 @@
+// ::ng-deep .cdk-overlay-pane{
+//     width: 60%!important;
+// }
+.mat-pane{
+    width: 20rem;
+}
+.button{
+    // float: right; 
+    margin-bottom: 1rem;
+    background-color: #ffff;
+    margin-top: -1rem;
+    // margin-left: 6rem;
+    float: right;
+}
+::ng-deep .mat-card.settings-panel {
+     position: inherit; 
+     bottom: 0px; 
+     right: 0px; 
+     width: 350px; 
+    z-index: 9;
+     top: 58px; 
+}
+
+::ng-deep body .mat-card {
+    box-shadow:none!important; 
+}
+
+// @include media-breakpoint-down(lg) {
+//     padding-top: 150px;
+//     }
+//     @include media-breakpoint-down(md) {
+//      padding-top: 100px;
+//     }
+//     @include media-breakpoint-down(sm) {
+//      padding-top: 100px;
+//     }
+
+
+// @media only screen and (max-width: 600px) {
+//     .cdk-overlay-pane{
+//         width: 90%!important;
+//     }
+// }
+
+@media (max-width: 959px){
+    .cdk-overlay-pane{
+        width: 90%!important;
+    }
+}
+::ng-deep .mat-dialog-content {
+    max-height: 170vh !important;
+    overflow: hidden!important;
+}
+::ng-deep .mat-dialog-container{
+    overflow: hidden!important;
+}
+.scrollHV {
+    height: calc(100vh - 150px);
+}
+:ng-deep .ng-scroll-viewport-wrapper{
+    right: -25px !important;
+}
\ No newline at end of file
diff --git a/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.spec.ts b/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.spec.ts
new file mode 100644
index 0000000..4dc5688
--- /dev/null
+++ b/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AssignServiceComponent } from './assign-service.component';
+
+describe('AssignServiceComponent', () => {
+  let component: AssignServiceComponent;
+  let fixture: ComponentFixture<AssignServiceComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ AssignServiceComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AssignServiceComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.ts b/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.ts
new file mode 100644
index 0000000..0eccf3f
--- /dev/null
+++ b/ng-seed/src/app/appoinment/consultant-setting/assign-service/assign-service.component.ts
@@ -0,0 +1,55 @@
+import { Component, Inject, OnInit, Optional } from '@angular/core';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+
+@Component({
+  selector: 'app-assign-service',
+  templateUrl: './assign-service.component.html',
+  styleUrls: ['./assign-service.component.scss']
+})
+export class AssignServiceComponent implements OnInit {
+  form: FormGroup;
+  local_data: any;
+
+  constructor(public dialogRef: MatDialogRef<AssignServiceComponent>,@Optional() @Inject(MAT_DIALOG_DATA) public data) {
+      console.log(data)
+      this.local_data = data
+      this.local_data.duration = this.local_data.durationNew     
+      
+     }
+
+  ngOnInit(): void {
+    this.form = new FormGroup({
+      duration: new FormControl('', [Validators.required]),
+      fees: new FormControl('', [Validators.required])
+      });
+      
+       this.form.patchValue(this.local_data)
+  }
+
+  public myError = (controlName: string, errorName: string) =>{
+    return this.form.controls[controlName].hasError(errorName);
+    }
+
+  closeDialog(){
+    this.dialogRef.close();
+  }
+
+  submit(){
+      console.log(this.form.value)
+      let user_id = localStorage.getItem('user_id')
+      let details:any = {
+        durationNew: this.form.value.duration,
+        fees:this.form.value.fees,
+        busId:this.local_data.busId,
+        userId: user_id,
+        serviceId:this.local_data.serviceId
+      }
+      if(this.local_data.hasOwnProperty('id')){
+        details.id =this.local_data.id
+      } 
+      
+    this.dialogRef.close(details);
+  }
+
+}
diff --git a/ng-seed/src/app/appoinment/consultant-setting/consultant-service/consultant.service.ts b/ng-seed/src/app/appoinment/consultant-setting/consultant-service/consultant.service.ts
index d14ce17..31f3c68 100644
--- a/ng-seed/src/app/appoinment/consultant-setting/consultant-service/consultant.service.ts
+++ b/ng-seed/src/app/appoinment/consultant-setting/consultant-service/consultant.service.ts
@@ -13,18 +13,23 @@ export class ConsultantService {
   constructor(private _http: HttpClient) { }
 
   getUsersListDetails(id): Observable<any> {  
-    console.log('IN')
     return this._http.post(this.apiUrl + 'getPractitionerInfo', {id:id})
-          // .pipe(
-          // catchError(this.handleError('role', []))
-          // )
   }
+  
   getServicesListDetails(userId,busId): Observable<any> {  
-    console.log('IN')
     return this._http.post(this.apiUrl + 'getServicesMapDetails', {busId:busId, userId:userId})
-          // .pipe(
-          // catchError(this.handleError('role', []))
-          // )
+  }
+
+  getAssignedDetails(busId:any): Observable<any>{
+    return this._http.post(this.apiUrl + 'getServicesDetails', {busId:busId})
+  }
+
+  getServiceCheckedDetails(params): Observable<any>{
+    return this._http.post(this.apiUrl + 'AlterServicesMap', params) 
+  }
+
+  createDurationFeesDetails(params): Observable<any>{
+    return this._http.post(this.apiUrl + 'CreateDuration', params) 
   }
 
   handleError(arg0: string, arg1: undefined[]): (err: any, caught: Observable<any>) => import("rxjs").ObservableInput<any> {
diff --git a/ng-seed/src/app/appoinment/consultant-setting/consultant-setting.module.ts b/ng-seed/src/app/appoinment/consultant-setting/consultant-setting.module.ts
index 66e4dd7..d1899bf 100644
--- a/ng-seed/src/app/appoinment/consultant-setting/consultant-setting.module.ts
+++ b/ng-seed/src/app/appoinment/consultant-setting/consultant-setting.module.ts
@@ -7,19 +7,25 @@ import { DemoMaterialModule } from 'app/shared/demo.module';
 import { NgScrollbarModule } from 'ngx-scrollbar';
 import { EditWorkingHoursComponent } from './edit-working-hours/edit-working-hours.component';
 import { ExtraWorkingHoursComponent } from './extra-working-hours/extra-working-hours.component';
+import { AssignServiceComponent } from './assign-service/assign-service.component';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { MatFormFieldModule } from '@angular/material/form-field';
 
 
 @NgModule({
   declarations: [
     ConsultantSettingComponent,
     EditWorkingHoursComponent,
-    ExtraWorkingHoursComponent
+    ExtraWorkingHoursComponent,
+    AssignServiceComponent
   ],
   imports: [
     CommonModule,
     ConsultantSettingRoutingModule,
     DemoMaterialModule,
-    NgScrollbarModule
+    NgScrollbarModule,
+    MatSidenavModule,
+    MatFormFieldModule,
   ]
 })
 export class ConsultantSettingModule { }
diff --git a/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.html b/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.html
index b1472d9..a45b4a4 100644
--- a/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.html
+++ b/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.html
@@ -8,7 +8,7 @@
    </div>
 </div> -->
 
-<mat-tab-group [@.disabled]="true">
+<mat-tab-group [@.disabled]="true" (selectedTabChange)="tabClick($event)">
 
     <mat-tab>
        <ng-template mat-tab-label>
@@ -19,6 +19,10 @@
           <span class="staff-title">
           Profile
           </span>
+          <button mat-icon-button matTooltip="Edit"  *ngIf="isEditable == false" (click)="edit_table(isEditable)" fileName="customers"><mat-icon >edit</mat-icon></button>
+          <!-- <button mat-icon-button  *ngIf="table[0].statement == statement_item && table[0].statement != 'Cash Flow Statement'" color="accent" matTooltip="Edit" matTooltipPosition="right" (click)="editandcancel(true,table[0].section)" ><mat-icon>edit</mat-icon></button> -->
+          <button mat-icon-button  color="accent"  *ngIf="isEditable == true"  (click)="edit_table(isEditable)" matTooltip="Cancel" matTooltipPosition="right"  ><mat-icon>cancel_presentation</mat-icon></button>
+          <button mat-icon-button  color="accent"  *ngIf="isEditable == true"  matTooltip="Submit" matTooltipPosition="right"  ><mat-icon>done</mat-icon></button>
        </div>
        <ng-scrollbar class="scrollHV">
           <div mat-dialog-content class="my-table" >
@@ -26,6 +30,7 @@
              <div class="form-group label-container">
                 <label>Name <span class="line">-</span></label>
                 <a style="padding: 10px;">{{usersList.userName}}</a>
+              
              </div>
              <div class="form-group label-container">
                 <label>Email Address <span style="margin-left: 2.7rem;">-</span></label>
@@ -41,32 +46,67 @@
             </div>
             <div class="form-group label-container">
                <label>Gender <span style="margin-left: 5.5rem;">-</span></label>
-               <a style="padding: 10px;">{{practitionerdetails.gender}}</a>
+               <a  *ngIf="isEditable == false" style="padding: 10px;">{{practitionerdetails.gender}}</a>
+               <mat-form-field class="example-full-width"  *ngIf="isEditable == true">
+                  <mat-label>Gender</mat-label>
+                  <input type="text" matInput   placeholder="Gender">
+                
+                </mat-form-field>
             </div>
             <div class="form-group label-container">
                <label>Date of Birth <span style="margin-left: 3.5rem;">-</span></label>
-               <a style="padding: 10px;">{{practitionerdetails.dob}}</a>
+               <a style="padding: 10px;"  *ngIf="isEditable == false">{{practitionerdetails.dob}}</a>
+               <mat-form-field class="example-full-width"  *ngIf="isEditable == true">
+                  <mat-label>Date of Birth</mat-label>
+                  <input type="text" matInput   placeholder="Date of Birth">
+                
+                </mat-form-field>
             </div>
             <div class="form-group label-container">
                <label>Languages <span style="margin-left: 4rem;">-</span></label>
-               <a style="padding: 10px;">{{practitionerdetails.languages}}</a>
+               <a style="padding: 10px;"  *ngIf="isEditable == false">{{practitionerdetails.languages}}</a>
+               <mat-form-field class="example-full-width"  *ngIf="isEditable == true">
+                  <mat-label>Languages</mat-label>
+                  <input type="text" matInput   placeholder="Languages">
+                
+                </mat-form-field>
             </div>
             <div class="form-group label-container">
                <label>Qualification <span style="margin-left: 4rem;">-</span></label>
-               <a style="padding: 10px;">{{practitionerdetails.qualification}}</a>
+               <a style="padding: 10px;"  *ngIf="isEditable == false">{{practitionerdetails.qualification}}</a>
+               <mat-form-field class="example-full-width"  *ngIf="isEditable == true">
+                  <mat-label>Qualification</mat-label>
+                  <input type="text" matInput   placeholder="Qualification">
+                
+                </mat-form-field>
             </div>
             <div class="form-group label-container">
                <label>Designation <span style="margin-left: 3.7rem;">-</span></label>
-               <a style="padding: 10px;">{{practitionerdetails.designtion}}</a>
+               <a style="padding: 10px;"  *ngIf="isEditable == false">{{practitionerdetails.designtion}}</a>
+               <mat-form-field class="example-full-width"  *ngIf="isEditable == true">
+                  <mat-label>Designation</mat-label>
+                  <input type="text" matInput   placeholder="Designation">
+                
+                </mat-form-field>
             </div>
             <div class="form-group label-container">
                <label>Experience <span style="margin-left: 4rem;">-</span></label>
-               <a style="padding: 10px;">{{practitionerdetails.exp}}</a>
+               <a style="padding: 10px;"  *ngIf="isEditable == false">{{practitionerdetails.exp}}</a>
+               <mat-form-field class="example-full-width"  *ngIf="isEditable == true">
+                  <mat-label>Experience</mat-label>
+                  <input type="text" matInput   placeholder="Experience">
+                
+                </mat-form-field>
             </div>
-            <div class="form-group label-container">
+            <!-- <div class="form-group label-container">
                <label>Fees <span style="margin-left: 6.7rem;">-</span></label>
                <a style="padding: 10px;">{{practitionerdetails.fees}}</a>
-            </div>
+               <mat-form-field class="example-full-width">
+                  <mat-label>Email</mat-label>
+                  <input type="email" matInput   placeholder="Ex. pat@example.com">
+                
+                </mat-form-field>
+            </div> -->
             <!-- <div class="form-group label-container">
               <label>WorkingHours <span style="margin-left: 6.7rem;">-</span></label>
               <a style="padding: 10px;">{{practitionerdetails.workingHours}}</a>
@@ -276,27 +316,49 @@
        <ng-template mat-tab-label>
          <i class="material-icons icons">&#xe7fb;</i>   Assigned Services
        </ng-template>
-       <div class="staff">
+       <div class="staff assignService" >
           <span class="staff-title">
           Define Your Services
           </span>
-          <!-- <mat-form-field  appearance="outline"  class="mat-pane">
-            <mat-label>Role</mat-label>
-            <mat-select placeholder="Select Role" formControlName="assiendservice" required>
-              <mat-option>--</mat-option>
-              <mat-option *ngFor="let details of servicesList_array" [value]="details.servicesName">
-                  {{details.servicesName}}
+          <mat-form-field  appearance="outline" style="width: 45%;" class="mat-pane">
+            <mat-label>Assign Service</mat-label>
+            <mat-select placeholder="Select Role" [(ngModel)]="assignService" multiple required> 
+               <!-- <ng-scrollbar class="scrollHV"> -->
+              <mat-option (onSelectionChange)="getValues($event,details)" *ngFor="let details of servicesList"  [value]="details.servicesName">
+               <div class="card-comment-widget">
+                  <mat-list>
+                  <mat-list-item>
+                     <img class="img-responsive img-circle"  src="https://prodaphstorage.blob.core.windows.net/specialties/bdf0cf0d-754e-4254-aaf7-fdc7aedd7c35.jpg" alt="Online Doctor Consultation - Allergist and Clinical Immunologist" width="30" height="30" alt="user list image">
+                     <h6 mat-line>{{details.servicesName}}</h6>
+                     <!-- <div class="comment-time">
+                        Oct-11,17
+                     </div> -->
+                  </mat-list-item>
+                  <!-- <span> <img src="assets/images/userpic.png" class="rad-full" width="30" height="30" alt=""></span> -->
+                 </mat-list>
+                 </div> 
               </mat-option>
+            <!-- </ng-scrollbar> -->
             </mat-select>
-          <mat-error *ngIf="myError('businessselect', 'required')">role is required</mat-error> 
-          </mat-form-field> -->
+          <!-- <mat-error *ngIf="myError('businessselect', 'required')">role is required</mat-error>  -->
+          </mat-form-field>
        </div>
-       <mat-card class="mb-2 example-card d-flex" *ngFor="let details of servicesList_array">
-         <input id="color-toggle" type="checkbox" class="checkbox"> 
-         <mat-card-title-group>   
-         <mat-card-title class="service-info">{{details.servicesName}}</mat-card-title>
-         <mat-card-title class="info">{{details.duration}} Minutes</mat-card-title>    
-     </mat-card-title-group>
+       <mat-card class="p-1" *ngFor="let details of servicesList_array;let i = index">
+         <div fxLayout="row" class="flexCard">
+            <div  fxFlex.xs="10" fxFlex.sm="10" fxFlex.md="10" fxFlex.lg="10" fxFlex.xl="10">
+               <img mat-list-avatar src="https://prodaphstorage.blob.core.windows.net/specialties/bdf0cf0d-754e-4254-aaf7-fdc7aedd7c35.jpg" width="50" height="50" >
+            </div>
+            <div  fxFlex.xs="70" fxFlex.sm="70" fxFlex.md="70" fxFlex.lg="70" fxFlex.xl="70"> 
+                  <div class="service-info">{{details.servicesName}}</div>
+                  <div class="service-info2">{{servicesList_data[i].duration.length>0 ? servicesList_data[i].duration[0].durationNew : details.duration}} Mins | <span class="indianSymbol">{{servicesList_data[i].duration.length>0 ? servicesList_data[i].duration[0].fees : 0}}</span></div> 
+                  <div class="info" (click)="asignService(details,i)">+ Customize the price and duration of a service.</div>
+            </div>
+            <div  fxFlex.xs="15" fxFlex.sm="15" fxFlex.md="15" fxFlex.lg="15" fxFlex.xl="15" fxLayoutAlign="center center"> 
+               <span style="color: green;">Active</span>
+            </div>
+        </div> 
+        
+         
      </mat-card>
     </mat-tab>
 
diff --git a/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.scss b/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.scss
index 08e59bd..4c49255 100644
--- a/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.scss
+++ b/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.scss
@@ -343,21 +343,28 @@ margin-bottom: 10rem;
   margin-left: 1rem;
 }
 .service-info{
-  line-height: 3rem!important;
+  // line-height: 3rem!important;
   font-size: 14px!important;
   font-weight: 500!important;
+  color: #2f2c2c;
+}
+.service-info2{
+  // line-height: 3rem!important;
+  font-size: 12px!important;
+  font-weight: 500!important;
   color: #5F5F5F;
 }
 .info{
   font-size: 12px!important;
   font-weight: 500;
   color: rgba(2,71,91,.6);
-  padding: 0 0 10px;
+  // padding: 0 0 10px;
   max-height: 38px;
   display: -webkit-box;
   overflow: hidden;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
+  cursor: pointer;
 }
 ::ng-deep .mat-card .mat-card-title:nth-child(2) {
   margin-top: -33px!important;
@@ -382,3 +389,22 @@ margin-bottom: 10rem;
 //   color: #4C4C4C;
 //   text-align: center;
 // }
+.assignService{
+  .scrollHV {
+    height: calc(100vh - 461px) !important;
+  }
+}
+::ng-deep .mat-select-panel .mat-option{
+  height: 5em !important;
+}
+// css example
+.indianSymbol {
+  content: "\20B9";
+}
+
+.p-1{
+  padding: 1rem !important;
+  .flexCard{
+    display: contents !important;
+  }
+}
diff --git a/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.ts b/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.ts
index 91f3c65..877c73a 100644
--- a/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.ts
+++ b/ng-seed/src/app/appoinment/consultant-setting/consultant-setting/consultant-setting.component.ts
@@ -5,6 +5,7 @@ import { MatDialog } from '@angular/material/dialog';
 import { MatTableDataSource } from '@angular/material/table';
 import { ApiServiceService } from 'app/appoinment/service-list-details/service-api-services/api-service.service';
 import { environment } from 'environments/environment';
+import { AssignServiceComponent } from '../assign-service/assign-service.component';
 import { ConsultantService } from '../consultant-service/consultant.service';
 import { EditWorkingHoursComponent } from '../edit-working-hours/edit-working-hours.component';
 import { ExtraWorkingHoursComponent } from '../extra-working-hours/extra-working-hours.component';
@@ -15,6 +16,7 @@ import { ExtraWorkingHoursComponent } from '../extra-working-hours/extra-working
   styleUrls: ['./consultant-setting.component.scss']
 })
 export class ConsultantSettingComponent implements OnInit {
+  assignService:any = []
   registerForm: FormGroup;
   submitted = false;
   selected = 'Assign New Services';
@@ -27,12 +29,15 @@ export class ConsultantSettingComponent implements OnInit {
     status: 'Active',
   },
  ];
- 
+ isEditable:any = false;
  public usersList:any = new MatTableDataSource();
  public servicesList:any = new MatTableDataSource();
   practitionerdetails: any;
   servicesList_array: any = [];
  apiUrl:any;
+  serviceCheckedData: number;
+  checkedArray: any[];
+  servicesList_data: any=[];
  constructor(private formBuilder: FormBuilder, public dialog: MatDialog, public _con:ConsultantService, private fb: FormBuilder, public _api:ConsultantService,private locationStrategy: LocationStrategy) {}
 
  
@@ -53,92 +58,33 @@ export class ConsultantSettingComponent implements OnInit {
   
 }
 
-getUsersList() {
-  //this._pd.getTabStatusPdDetails(this.tabStatus)
-  let id = localStorage.getItem('user_id')
-  console.log(id)
-  this._con.getUsersListDetails(id).subscribe(res => {
-        if (res.status == 200) {
-          this.usersList = res.data[0]; 
-          console.log(this.usersList)
-          this.practitionerdetails = this.usersList['practitionerInfos'][0]
-          console.log(this.practitionerdetails)
-          this.apiUrl = 'http://localhost:4200/customer/business/'+this.usersList.randStr
-          this.getServicesList(this.usersList.id,this.usersList.busId)
-          // this.dataSource = res.data.length;
-          // console.log(this.dataSource)
-          // this.dataSource.data = this.usersList;
-          // console.log(this.dataSource.data)
-          // this.recordStatus=false;
-        }
-        else{
-          // this.usersList=[];
-          // this.dataSource = null;
-          // this.recordStatus=true;
-        }
-      }
-      ,error => {
-        // this.errorMessage.push(error);
-        // this.notifier.notify('error', 'Something Went Wrong Try Again.! \t\"' + (error.error_type == 2 ? error.error_status + ' ( ' + error.error_text + ' ) '  : ' ( ' + error.error_text + ' ) ') +'\" Error Occur.!');
-        // alert(error.html_format);
-      });
-}
-getServicesList(id,busId) {
-  //this._pd.getTabStatusPdDetails(this.tabStatus)
-  this._api.getServicesListDetails(id,busId).subscribe(res => {
-        if (res.status == 200) {
-          this.servicesList = res.data;
-          res['data'].forEach(element => {
-            // tmp.push(element.service)
-             element.service.forEach(e => {
-               this.servicesList_array.push(e)
-             });  
-           });
-           console.log(this.servicesList_array)
-          // console.log(this.servicesList)
-          // this.dataSource = res.data.length;
-          // console.log(this.dataSource)
-          // this.dataSource.data = this.servicesList;
-          // console.log(this.dataSource.data)
-          // this.recordStatus=false;
-        }
-        else{
-          // this.servicesList=[];
-          // this.dataSource = null;
-          // this.recordStatus=true;
-        }
-      }
-      ,error => {
-        // this.errorMessage.push(error);
-        // this.notifier.notify('error', 'Something Went Wrong Try Again.! \t\"' + (error.error_type == 2 ? error.error_status + ' ( ' + error.error_text + ' ) '  : ' ( ' + error.error_text + ' ) ') +'\" Error Occur.!');
-        // alert(error.html_format);
-      });
-}
-get f() {
-  return this.registerForm.controls;
-}
-onSubmit() {
-  this.submitted = true;
-  if (this.registerForm.invalid) {
-    return;
+  public myError = (controlName: string, errorName: string) =>{
+    return this.registerForm.controls[controlName].hasError(errorName);
+    }
+
+  tabClick(tab) {
+    console.log(tab.index);
+    if(tab.index == '2'){
+      this.getServicesList(this.usersList.id,this.usersList.busId)
+      // this.getAssignedList(this.usersList.busId)
+    }
+    
+  }
+
+edit_table(param){
+  
+   
+  
+  if (param == true) {
+    this.isEditable = false;
+  } else {
+    console.log('status', );
+    this.isEditable = true
+  //  localStorage.setItem('row_item',JSON.stringify(tableArr))
+    console.log( this.isEditable);
+   // this.isEditable = status;
+   // this.isEditable_month = tableArr.months;
   }
- console.log(JSON.stringify(this.registerForm.value, null, 2));
-}
-openDialog(action,obj) {
-  obj.action = action;
-  const dialogRef = this.dialog.open(EditWorkingHoursComponent, {
-    width: '48%',
-    height: '100%',
-    // maxWidth: '38vw',
-    position: { right: '0' },
-    data:obj
-  });
-  // dialogRef.afterClosed().subscribe(result => {
-  //   if(result != undefined){
-  //     console.log(result)
-  //     this.formAddUpdateAndDelete(result,result.data)
-  //   }      
-  // });
 }
 
 workingDialog(action,obj) {
@@ -157,6 +103,165 @@ workingDialog(action,obj) {
   //   }      
   // });
 }
+  getUsersList() {
+    //this._pd.getTabStatusPdDetails(this.tabStatus)
+    let id = localStorage.getItem('user_id')
+    console.log(id)
+    this._con.getUsersListDetails(id).subscribe(res => {
+          if (res.status == 200) {
+            this.usersList = res.data[0]; 
+            console.log(this.usersList)
+            this.practitionerdetails = this.usersList['practitionerInfos'][0]
+            console.log(this.practitionerdetails)
+            this.apiUrl = 'http://localhost:4200/customer/business/'+this.usersList.randStr
+            
+          } 
+        } );
+  }
+  getAssignedList(busId) { 
+    this._api.getAssignedDetails(busId).subscribe(res => {
+      console.log(res)
+          if (res.status == 200) {
+            this.servicesList = res.data;  
+          } 
+        } );
+  }
+
+  getServicesList(id,busId) {
+    this.servicesList_array = []
+    //this._pd.getTabStatusPdDetails(this.tabStatus)
+    this._api.getServicesListDetails(id,busId).subscribe(res => {
+          if (res.status == 200) {
+            this.servicesList_data = res.data;
+            res['data'].forEach(element => {
+              // tmp.push(element.service)
+              element.service.forEach(e => {
+                console.log(e)
+                this.servicesList_array.push(e)
+                this.assignService.push(e.servicesName)
+              });  
+            });
+            console.log(this.servicesList_array) 
+                     
+            this.getAssignedList(this.usersList.busId)
+          } 
+        } );
+        // this.assignService = this.checkedArray  
+  }
+
+  get f() {
+    return this.registerForm.controls;
+  }
+
+  onSubmit() {
+    this.submitted = true;
+    if (this.registerForm.invalid) {
+      return;
+    }
+  console.log(JSON.stringify(this.registerForm.value, null, 2));
+  }
+
+  openDialog(action,obj) {
+    obj.action = action;
+    const dialogRef = this.dialog.open(EditWorkingHoursComponent, {
+      width: '48%',
+      height: '100%',
+      // maxWidth: '38vw',
+      position: { right: '0' },
+      data:obj
+    });
+    // dialogRef.afterClosed().subscribe(result => {
+    //   if(result != undefined){
+    //     console.log(result)
+    //     this.formAddUpdateAndDelete(result,result.data)
+    //   }      
+    // });
+  }
+
+  workingDialog(action,obj) {
+    obj.action = action;
+    const dialogRef = this.dialog.open(ExtraWorkingHoursComponent, {
+      width: '48%',
+      height: '100%',
+      // maxWidth: '38vw',
+      position: { right: '0' },
+      data:obj
+    });
+    // dialogRef.afterClosed().subscribe(result => {
+    //   if(result != undefined){
+    //     console.log(result)
+    //     this.formAddUpdateAndDelete(result,result.data)
+    //   }      
+    // });
+  }
+
+    asignService(param,index){ 
+      console.log(param) 
+      console.log(index,this.servicesList_data)    
+      if(this.servicesList_data[index].duration.length>0){
+        param = this.servicesList_data[index].duration[0]
+      }
+        const dialogRef = this.dialog.open(AssignServiceComponent, {
+          width: '30%',
+          height: '100%',
+          // maxWidth: '38vw',
+          position: { right: '0' }, 
+          data:param
+        });
+        dialogRef.afterClosed().subscribe(result => {
+          console.log(result)
+          if(result instanceof Object){
+            this.createDurationFees(result)
+          }            
+        });
+    }
+
+    createDurationFees(param){
+      this._api.createDurationFeesDetails(param).subscribe(res => {
+        if (res.status == 200) {
+          console.log(res)
+          // this.checkedList = res.data; 
+        } 
+      } );
+    }
+
+    getValues(event: {
+      isUserInput: any;
+      source: { value: any; selected: any };
+    },details) {
+      console.log(event,details,this.assignService)
+      if (event.isUserInput) {
+        if (event.source.selected === true) {
+          console.log('1',event.source.value)
+          this.serviceCheckedData = 1
+          this.getCheckedService(details)
+        } else {
+          console.log('2',event.source.value)
+          this.serviceCheckedData = 0
+          this.getCheckedService(details)
+        }
+      }
+
+    }
+
+  //   AlterServicesMap
+  // methoad post
+  // param = {serviceId:"",userId:"",busId:"",active:1}
+    getCheckedService(params){
+      console.log(params)
+      let userid = localStorage.getItem('user_id')
+      let data = {serviceId:params.serviceId,userId:userid,busId:params.busId,active:this.serviceCheckedData}
+      console.log(data)
+      this._api.getServiceCheckedDetails(data).subscribe(res => {
+        if (res.status == 200) {
+          console.log(res)
+          // this.checkedList = res.data; 
+          this.getServicesList(this.usersList.id,this.usersList.busId)  
+        } 
+      } );
+    }
+
+
 
 
 }
diff --git a/ng-seed/src/app/appoinment/consultant-setting/edit-working-hours/edit-working-hours.component.html b/ng-seed/src/app/appoinment/consultant-setting/edit-working-hours/edit-working-hours.component.html
index 6a77c47..85f6709 100644
--- a/ng-seed/src/app/appoinment/consultant-setting/edit-working-hours/edit-working-hours.component.html
+++ b/ng-seed/src/app/appoinment/consultant-setting/edit-working-hours/edit-working-hours.component.html
@@ -15,10 +15,10 @@
            <div [formGroupName]="i" class="container">
               <div class="dis-flexs">
                  <div class="label-name" formControlName="day">
-                    <input id="color-toggle" type="checkbox" >
+                    <input id="color-toggle" type="checkbox" *ngIf="i == 0">
                     <span class="labelname checkbox-default-blue checked" 
                     [value]="day">
-                    <label>Sunday</label>
+                    <label *ngIf="i == 0">Sunday</label>
                     </span>
                  </div>
                  <mat-form-field appearance="outline">
@@ -81,575 +81,439 @@
            </button> -->
      </div>
   </form>
-  <form [formGroup]="dynamicForm">
-    <div formArrayName="filters">
-       <div *ngFor="let filter of filtersFormArray.controls; let i = index;">
-          <div [formGroupName]="i" class="container">
-             <div class="dis-flexs">
-                <div class="label-name" formControlName="day">
-                   <input id="color-toggle" type="checkbox" >
-                   <span class="labelname checkbox-default-blue checked" 
-                   [value]="day">
-                   <label>Monday</label>
-                   </span>
-                </div>
-                <mat-form-field appearance="outline">
-                   <mat-select 
-                      placeholder="Select Time"
-                      formControlName="filterType">
-                      <mat-option 
-                      *ngFor="let filterType of filterTypes" 
-                      [value]="filterType">
-                      {{ filterType }}
-                      </mat-option>
-                   </mat-select>
-                </mat-form-field>
-                <mat-form-field appearance="outline" class="margin-lft">
-                   <mat-select 
-                   (selectionChange)="selectedAPIChanged(i)"
-                   placeholder="Select Time"
-                   #apiField
-                   formControlName="apiType">
-                   <mat-option 
-                   *ngFor="let apiType of apiTypes"
-                   [value]="apiType">
-                   {{ apiType }}
-                   </mat-option>
-                   </mat-select>
-                </mat-form-field>
-                <mat-icon  class="deleteRow"
-                (click)="addFilterToFiltersFormArray()">
-                add
-             </mat-icon>
-                <mat-icon  class="deleteRow"
-                   (click)="removeFilterFromFiltersFormArray(i)">
-                   delete
-                </mat-icon>
-             </div>
-          </div>
-       </div>
-    </div>
- </form>
- <form [formGroup]="dynamicForm">
-  <div formArrayName="filters">
-     <div *ngFor="let filter of filtersFormArray.controls; let i = index;">
-        <div [formGroupName]="i" class="container">
-           <div class="dis-flexs">
-              <div class="label-name" formControlName="day">
-                 <input id="color-toggle" type="checkbox" >
-                 <span class="labelname checkbox-default-blue checked" 
-                 [value]="day">
-                 <label>Tuesday</label>
-                 </span>
-              </div>
-              <mat-form-field appearance="outline">
-                 <mat-select 
-                    placeholder="Select Time"
-                    formControlName="filterType">
-                    <mat-option 
-                    *ngFor="let filterType of filterTypes" 
-                    [value]="filterType">
-                    {{ filterType }}
-                    </mat-option>
-                 </mat-select>
-              </mat-form-field>
-              <mat-form-field appearance="outline" class="margin-lft">
-                 <mat-select 
-                 (selectionChange)="selectedAPIChanged(i)"
-                 placeholder="Select Time"
-                 #apiField
-                 formControlName="apiType">
-                 <mat-option 
-                 *ngFor="let apiType of apiTypes"
-                 [value]="apiType">
-                 {{ apiType }}
-                 </mat-option>
-                 </mat-select>
-              </mat-form-field>
-              <mat-icon  class="deleteRow"
-              (click)="addFilterToFiltersFormArray()">
-              add
-           </mat-icon>
-              <mat-icon  class="deleteRow"
-                 (click)="removeFilterFromFiltersFormArray(i)">
-                 delete
-              </mat-icon>
-           </div>
-        </div>
-     </div>
-
-  </div>
-</form>
-<form [formGroup]="dynamicForm">
-  <div formArrayName="filters">
-     <div *ngFor="let filter of filtersFormArray.controls; let i = index;">
-        <div [formGroupName]="i" class="container">
-           <div class="dis-flexs">
-              <div class="label-name" formControlName="day">
-                 <input id="color-toggle" type="checkbox" >
-                 <span class="labelname checkbox-default-blue checked" 
-                 [value]="day">
-                 <label>Wednesday</label>
-                 </span>
-              </div>
-              <mat-form-field appearance="outline">
-                 <mat-select 
-                    placeholder="Select Time"
-                    formControlName="filterType">
-                    <mat-option 
-                    *ngFor="let filterType of filterTypes" 
-                    [value]="filterType">
-                    {{ filterType }}
-                    </mat-option>
-                 </mat-select>
-              </mat-form-field>
-              <mat-form-field appearance="outline" class="margin-lft">
-                 <mat-select 
-                 (selectionChange)="selectedAPIChanged(i)"
-                 placeholder="Select Time"
-                 #apiField
-                 formControlName="apiType">
-                 <mat-option 
-                 *ngFor="let apiType of apiTypes"
-                 [value]="apiType">
-                 {{ apiType }}
-                 </mat-option>
-                 </mat-select>
-              </mat-form-field>
-              <mat-icon  class="deleteRow"
-              (click)="addFilterToFiltersFormArray()">
-              add
-           </mat-icon>
-              <mat-icon  class="deleteRow"
-                 (click)="removeFilterFromFiltersFormArray(i)">
-                 delete
-              </mat-icon>
-           </div>
-        </div>
-     </div>
-  </div>
-</form>
-<form [formGroup]="dynamicForm">
-  <div formArrayName="filters">
-     <div *ngFor="let filter of filtersFormArray.controls; let i = index;">
-        <div [formGroupName]="i" class="container">
-           <div class="dis-flexs">
-              <div class="label-name" formControlName="day">
-                 <input id="color-toggle" type="checkbox" >
-                 <span class="labelname checkbox-default-blue checked" 
-                 [value]="day">
-                 <label>Thursday</label>
-                 </span>
-              </div>
-              <mat-form-field appearance="outline">
-                 <mat-select 
-                    placeholder="Select Time"
-                    formControlName="filterType">
-                    <mat-option 
-                    *ngFor="let filterType of filterTypes" 
-                    [value]="filterType">
-                    {{ filterType }}
-                    </mat-option>
-                 </mat-select>
-              </mat-form-field>
-              <mat-form-field appearance="outline" class="margin-lft">
-                 <mat-select 
-                 (selectionChange)="selectedAPIChanged(i)"
-                 placeholder="Select Time"
-                 #apiField
-                 formControlName="apiType">
-                 <mat-option 
-                 *ngFor="let apiType of apiTypes"
-                 [value]="apiType">
-                 {{ apiType }}
-                 </mat-option>
-                 </mat-select>
-              </mat-form-field>
-              <mat-icon  class="deleteRow"
-              (click)="addFilterToFiltersFormArray()">
-              add
-           </mat-icon>
-              <mat-icon  class="deleteRow"
-                 (click)="removeFilterFromFiltersFormArray(i)">
-                 delete
-              </mat-icon>
-           </div>
-        </div>
-     </div>
-  </div>
-</form>
-<form [formGroup]="dynamicForm">
-  <div formArrayName="filters">
-     <div *ngFor="let filter of filtersFormArray.controls; let i = index;">
-        <div [formGroupName]="i" class="container">
-           <div class="dis-flexs">
-              <div class="label-name" formControlName="day">
-                 <input id="color-toggle" type="checkbox" >
-                 <span class="labelname checkbox-default-blue checked" 
-                 [value]="day">
-                 <label>Friday</label>
-                 </span>
-              </div>
-              <mat-form-field appearance="outline">
-                 <mat-select 
-                    placeholder="Select Time"
-                    formControlName="filterType">
-                    <mat-option 
-                    *ngFor="let filterType of filterTypes" 
-                    [value]="filterType">
-                    {{ filterType }}
-                    </mat-option>
-                 </mat-select>
-              </mat-form-field>
-              <mat-form-field appearance="outline" class="margin-lft">
-                 <mat-select 
-                 (selectionChange)="selectedAPIChanged(i)"
-                 placeholder="Select Time"
-                 #apiField
-                 formControlName="apiType">
-                 <mat-option 
-                 *ngFor="let apiType of apiTypes"
-                 [value]="apiType">
-                 {{ apiType }}
-                 </mat-option>
-                 </mat-select>
-              </mat-form-field>
-              <mat-icon  class="deleteRow"
-              (click)="addFilterToFiltersFormArray()">
-              add
-           </mat-icon>
-              <mat-icon  class="deleteRow"
-                 (click)="removeFilterFromFiltersFormArray(i)">
-                 delete
-              </mat-icon>
-           </div>
-        </div>
-     </div>
-  </div>
-</form>
-<form [formGroup]="dynamicForm">
-  <div formArrayName="filters">
-     <div *ngFor="let filter of filtersFormArray.controls; let i = index;">
-        <div [formGroupName]="i" class="container">
-           <div class="dis-flexs">
-              <div class="label-name" formControlName="day">
-                 <input id="color-toggle" type="checkbox" >
-                 <span class="labelname checkbox-default-blue checked" 
-                 [value]="day">
-                 <label>Saturday</label>
-                 </span>
-              </div>
-              <mat-form-field appearance="outline">
-                 <mat-select 
-                    placeholder="Select Time"
-                    formControlName="filterType">
-                    <mat-option 
-                    *ngFor="let filterType of filterTypes" 
-                    [value]="filterType">
-                    {{ filterType }}
-                    </mat-option>
-                 </mat-select>
-              </mat-form-field>
-              <mat-form-field appearance="outline" class="margin-lft">
-                 <mat-select 
-                 (selectionChange)="selectedAPIChanged(i)"
-                 placeholder="Select Time"
-                 #apiField
-                 formControlName="apiType">
-                 <mat-option 
-                 *ngFor="let apiType of apiTypes"
-                 [value]="apiType">
-                 {{ apiType }}
-                 </mat-option>
-                 </mat-select>
-              </mat-form-field>
-              <mat-icon  class="deleteRow"
-              (click)="addFilterToFiltersFormArray()">
-              add
-           </mat-icon>
-              <mat-icon  class="deleteRow"
-                 (click)="removeFilterFromFiltersFormArray(i)">
-                 delete
-              </mat-icon>
-           </div>
-        </div>
-     </div>
-  </div>
-</form>
-  <!-- <div day="Sunday" class="label-container">
-     <div class="label-name">
-      <input id="color-toggle" type="checkbox" >
-        <span class="labelname checkbox-default-blue checked">
-        <label>Sunday</label>
-        </span>
-     </div>
-     <div class="dis-flex" *ngFor="let row of rows; let i = index">
-        <div class="dis-flex"  [(ngModel)]="row.noQuestion" >
-          <div class="content-container">
-              <div class="content-area">
-                <form [formGroup]="datainputForm" (ngSubmit)="onSubmit()" novalidate>
-                  <section class="form-block">
-                    <div class="form-group dis-flex">
-                      <div class="select pr-1 ml-1">
-                        <select formControlName="dropDownTest" (change)="onSelectChange()" id="dropDownTestId" class="selectBox select-drop-box ">
-                         <option *ngFor="let dropDownTestx of timing" [ngValue]="dropDownTestx" [disabled]="dropDownTestx === 'vmnic2'">
-                            {{ dropDownTestx }}
-                          </option>
-                        </select>
-                      </div>
-                      <div class="select pr-2">
-                          <select formControlName="dropDownTests" (change)="onSelectChange()" id="dropDownTestIds" class="selectBox select-drop-box ">
-                           <option *ngFor="let dropDownTestxs of timing" [ngValue]="dropDownTestxs" [disabled]="dropDownTestxs === 'vmnic2'">
-                              {{ dropDownTestxs }}
-                            </option>
-                          </select>
-                        </div>
-                    </div>
-                  </section>
-                </form>
-              </div>
+  <form [formGroup]="dynamicForm2">
+   <div formArrayName="filters2">
+      <div *ngFor="let filter of filtersFormArray2.controls; let i = index;">
+         <div [formGroupName]="i" class="container">
+            <div class="dis-flexs">
+               <div class="label-name" formControlName="day">
+                  <input id="color-toggle" type="checkbox" *ngIf="i == 0">
+                  <span class="labelname checkbox-default-blue checked" 
+                  [value]="day">
+                  <label *ngIf="i == 0">Monday</label>
+                  </span>
+               </div>
+               <mat-form-field appearance="outline">
+                  <mat-select 
+                     placeholder="Select Time"
+                     formControlName="filterType">
+                     <mat-option 
+                     *ngFor="let filterType of filterTypes" 
+                     [value]="filterType">
+                     {{ filterType }}
+                     </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               <mat-form-field appearance="outline" class="margin-lft">
+                  <mat-select 
+                  (selectionChange)="selectedAPIChanged(i)"
+                  placeholder="Select Time"
+                  #apiField
+                  formControlName="apiType">
+                  <mat-option 
+                  *ngFor="let apiType of apiTypes"
+                  [value]="apiType">
+                  {{ apiType }}
+                  </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               
+               <!-- <mat-form-field  appearance="outline"
+                  *ngIf="filter.get('value')">
+                  <input 
+                    matInput 
+                    formControlName="value" 
+                    [placeholder]="apiField.value">
+                  </mat-form-field> -->
+               <mat-icon  class="deleteRow"
+               (click)="addFilterToFiltersFormArray2()">
+               add
+            </mat-icon>
+               <mat-icon  class="deleteRow"
+                  (click)="removeFilterFromFiltersFormArray2(i)">
+                  delete
+               </mat-icon>
             </div>
-           <span class="addbreak" (click)="addNewRow()">+</span>
-           <span class="deleteRow" (click)="deleteRow(i)"><i class="fa fa-trash"></i></span>
-        </div>
-     <div  class="applyToAll">Apply To All</div>
-     </div>
-     </div>
-     <div day="Monday" class="label-container">
-      <div class="label-name">
-       <input id="color-toggle" type="checkbox" >
-         <span class="labelname checkbox-default-blue checked">
-         <label>Monday</label>
-         </span>
-      </div>
-      <div class="dis-flex" *ngFor="let row of rows; let i = index">
-        <div class="dis-flex" [(ngModel)]="row.noQuestion">
-           <div class="content-container">
-               <div class="content-area">
-                <form [formGroup]="datainputForm" (ngSubmit)="onSubmit()" novalidate>
-                  <section class="form-block">
-                    <div class="form-group dis-flex">
-                      <div class="select pr-1 ml-1">
-                        <select formControlName="dropDownTest" (change)="onSelectChange()" id="dropDownTestId" class="selectBox select-drop-box ">
-                         <option *ngFor="let dropDownTestx of timing" [ngValue]="dropDownTestx" [disabled]="dropDownTestx === 'vmnic2'">
-                            {{ dropDownTestx }}
-                          </option>
-                        </select>
-                      </div>
-                      <div class="select pr-2">
-                          <select formControlName="dropDownTests" (change)="onSelectChange()" id="dropDownTestIds" class="selectBox select-drop-box ">
-                           <option *ngFor="let dropDownTestxs of timing" [ngValue]="dropDownTestxs" [disabled]="dropDownTestxs === 'vmnic2'">
-                              {{ dropDownTestxs }}
-                            </option>
-                          </select>
-                        </div>
-                    </div>
-                  </section>
-                </form>
-               </div>
-             </div>
-            <span class="addbreak" (click)="addNewRow()">+</span>
-            <span class="deleteRow" (click)="deleteRow(i)"><i class="fa fa-trash"></i></span>
          </div>
-      <div  class="applyToAll addbreak">Apply To All</div>
-     </div>
-     </div>
-     <div day="Tuesday" class="label-container">
-      <div class="label-name">
-       <input id="color-toggle" type="checkbox" >
-         <span class="labelname checkbox-default-blue checked">
-         <label>Tuesday</label>
-         </span>
       </div>
-      <div class="dis-flex" *ngFor="let row of rows; let i = index">
-        <div class="dis-flex" [(ngModel)]="row.noQuestion">
-           <div class="content-container">
-               <div class="content-area">
-                <form [formGroup]="datainputForm" (ngSubmit)="onSubmit()" novalidate>
-                  <section class="form-block">
-                    <div class="form-group dis-flex">
-                      <div class="select pr-1 ml-1">
-                        <select formControlName="dropDownTest" (change)="onSelectChange()" id="dropDownTestId" class="selectBox select-drop-box ">
-                         <option *ngFor="let dropDownTestx of timing" [ngValue]="dropDownTestx" [disabled]="dropDownTestx === 'vmnic2'">
-                            {{ dropDownTestx }}
-                          </option>
-                        </select>
-                      </div>
-                      <div class="select pr-2">
-                          <select formControlName="dropDownTests" (change)="onSelectChange()" id="dropDownTestIds" class="selectBox select-drop-box ">
-                           <option *ngFor="let dropDownTestxs of timing" [ngValue]="dropDownTestxs" [disabled]="dropDownTestxs === 'vmnic2'">
-                              {{ dropDownTestxs }}
-                            </option>
-                          </select>
-                        </div>
-                    </div>
-                  </section>
-                </form>
+      <!-- <button 
+         mat-raised-button 
+         color="primary" 
+         type="button" 
+         (click)="addFilterToFiltersFormArray()">
+      Add row
+      </button> -->
+      <!-- <button 
+         class="save" 
+         mat-stroked-button 
+         color="primary" 
+         [disabled]="dynamicForm.invalid || filtersFormArray.controls.length < 1"
+         (click)="save()">
+         Save
+         </button> -->
+   </div>
+</form>
+<form [formGroup]="dynamicForm3">
+   <div formArrayName="filters3">
+      <div *ngFor="let filter of filtersFormArray3.controls; let i = index;">
+         <div [formGroupName]="i" class="container">
+            <div class="dis-flexs" >
+               <div class="label-name" formControlName="day" >
+                  <input id="color-toggle" type="checkbox" *ngIf="i == 0">
+                  <span class="labelname checkbox-default-blue checked" 
+                  [value]="day">
+                  <label *ngIf="i == 0">Tuesday</label>
+                  </span>
                </div>
-             </div>
-            <span class="addbreak" (click)="addNewRow()">+</span>
-            <span class="deleteRow" (click)="deleteRow(i)"><i class="fa fa-trash"></i></span>
+               <mat-form-field appearance="outline">
+                  <mat-select 
+                     placeholder="Select Time"
+                     formControlName="filterType">
+                     <mat-option 
+                     *ngFor="let filterType of filterTypes" 
+                     [value]="filterType">
+                     {{ filterType }}
+                     </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               <mat-form-field appearance="outline" class="margin-lft">
+                  <mat-select 
+                  (selectionChange)="selectedAPIChanged(i)"
+                  placeholder="Select Time"
+                  #apiField
+                  formControlName="apiType">
+                  <mat-option 
+                  *ngFor="let apiType of apiTypes"
+                  [value]="apiType">
+                  {{ apiType }}
+                  </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               
+               <!-- <mat-form-field  appearance="outline"
+                  *ngIf="filter.get('value')">
+                  <input 
+                    matInput 
+                    formControlName="value" 
+                    [placeholder]="apiField.value">
+                  </mat-form-field> -->
+               <mat-icon  class="deleteRow"
+               (click)="addFilterToFiltersFormArray3()">
+               add
+            </mat-icon>
+               <mat-icon  class="deleteRow"
+                  (click)="removeFilterFromFiltersFormArray3(i)">
+                  delete
+               </mat-icon>
+            </div>
          </div>
-      <div  class="applyToAll addbreak">Apply To All</div>
-     </div>
-     </div>
-     <div day="Wednesday" class="label-container">
-      <div class="label-name">
-       <input id="color-toggle" type="checkbox" >
-         <span class="labelname checkbox-default-blue checked">
-         <label>Wednesday</label>
-         </span>
       </div>
-      <div class="dis-flex" *ngFor="let row of rows; let i = index">
-        <div class="dis-flex" [(ngModel)]="row.noQuestion">
-           <div class="content-container">
-               <div class="content-area">
-                <form [formGroup]="datainputForm" (ngSubmit)="onSubmit()" novalidate>
-                  <section class="form-block">
-                    <div class="form-group dis-flex">
-                      <div class="select pr-1 ml-1">
-                        <select formControlName="dropDownTest" (change)="onSelectChange()" id="dropDownTestId" class="selectBox select-drop-box ">
-                         <option *ngFor="let dropDownTestx of timing" [ngValue]="dropDownTestx" [disabled]="dropDownTestx === 'vmnic2'">
-                            {{ dropDownTestx }}
-                          </option>
-                        </select>
-                      </div>
-                      <div class="select pr-2">
-                          <select formControlName="dropDownTests" (change)="onSelectChange()" id="dropDownTestIds" class="selectBox select-drop-box ">
-                           <option *ngFor="let dropDownTestxs of timing" [ngValue]="dropDownTestxs" [disabled]="dropDownTestxs === 'vmnic2'">
-                              {{ dropDownTestxs }}
-                            </option>
-                          </select>
-                        </div>
-                    </div>
-                  </section>
-                </form>
+      <!-- <button 
+         mat-raised-button 
+         color="primary" 
+         type="button" 
+         (click)="addFilterToFiltersFormArray()">
+      Add row
+      </button> -->
+      <!-- <button 
+         class="save" 
+         mat-stroked-button 
+         color="primary" 
+         [disabled]="dynamicForm.invalid || filtersFormArray.controls.length < 1"
+         (click)="save()">
+         Save
+         </button> -->
+   </div>
+</form>
+<form [formGroup]="dynamicForm4">
+   <div formArrayName="filters4">
+      <div *ngFor="let filter of filtersFormArray4.controls; let i = index;">
+         <div [formGroupName]="i" class="container">
+            <div class="dis-flexs">
+               <div class="label-name" formControlName="day">
+                  <input id="color-toggle" type="checkbox" *ngIf="i == 0" >
+                  <span class="labelname checkbox-default-blue checked" 
+                  [value]="day">
+                  <label *ngIf="i == 0">Wednesday</label>
+                  </span>
                </div>
-             </div>
-            <span class="addbreak" (click)="addNewRow()">+</span>
-            <span class="deleteRow" (click)="deleteRow(i)"><i class="fa fa-trash"></i></span>
+               <mat-form-field appearance="outline">
+                  <mat-select 
+                     placeholder="Select Time"
+                     formControlName="filterType">
+                     <mat-option 
+                     *ngFor="let filterType of filterTypes" 
+                     [value]="filterType">
+                     {{ filterType }}
+                     </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               <mat-form-field appearance="outline" class="margin-lft">
+                  <mat-select 
+                  (selectionChange)="selectedAPIChanged(i)"
+                  placeholder="Select Time"
+                  #apiField
+                  formControlName="apiType">
+                  <mat-option 
+                  *ngFor="let apiType of apiTypes"
+                  [value]="apiType">
+                  {{ apiType }}
+                  </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               
+               <!-- <mat-form-field  appearance="outline"
+                  *ngIf="filter.get('value')">
+                  <input 
+                    matInput 
+                    formControlName="value" 
+                    [placeholder]="apiField.value">
+                  </mat-form-field> -->
+               <mat-icon  class="deleteRow"
+               (click)="addFilterToFiltersFormArray4()">
+               add
+            </mat-icon>
+               <mat-icon  class="deleteRow"
+                  (click)="removeFilterFromFiltersFormArray4(i)">
+                  delete
+               </mat-icon>
+            </div>
          </div>
-      <div  class="applyToAll addbreak">Apply To All</div>
-     </div>
-     </div>
-     <div day="Thursday" class="label-container">
-      <div class="label-name">
-       <input id="color-toggle" type="checkbox" >
-         <span class="labelname checkbox-default-blue checked">
-         <label>Thursday</label>
-         </span>
       </div>
-      <div class="dis-flex" *ngFor="let row of rows; let i = index">
-        <div class="dis-flex" [(ngModel)]="row.noQuestion">
-           <div class="content-container">
-               <div class="content-area">
-                <form [formGroup]="datainputForm" (ngSubmit)="onSubmit()" novalidate>
-                  <section class="form-block">
-                    <div class="form-group dis-flex">
-                      <div class="select pr-1 ml-1">
-                        <select formControlName="dropDownTest" (change)="onSelectChange()" id="dropDownTestId" class="selectBox select-drop-box ">
-                         <option *ngFor="let dropDownTestx of timing" [ngValue]="dropDownTestx" [disabled]="dropDownTestx === 'vmnic2'">
-                            {{ dropDownTestx }}
-                          </option>
-                        </select>
-                      </div>
-                      <div class="select pr-2">
-                          <select formControlName="dropDownTests" (change)="onSelectChange()" id="dropDownTestIds" class="selectBox select-drop-box ">
-                           <option *ngFor="let dropDownTestxs of timing" [ngValue]="dropDownTestxs" [disabled]="dropDownTestxs === 'vmnic2'">
-                              {{ dropDownTestxs }}
-                            </option>
-                          </select>
-                        </div>
-                    </div>
-                  </section>
-                </form>
+      <!-- <button 
+         mat-raised-button 
+         color="primary" 
+         type="button" 
+         (click)="addFilterToFiltersFormArray()">
+      Add row
+      </button> -->
+      <!-- <button 
+         class="save" 
+         mat-stroked-button 
+         color="primary" 
+         [disabled]="dynamicForm.invalid || filtersFormArray.controls.length < 1"
+         (click)="save()">
+         Save
+         </button> -->
+   </div>
+</form>
+<form [formGroup]="dynamicForm5">
+   <div formArrayName="filters5">
+      <div *ngFor="let filter of filtersFormArray5.controls; let i = index;">
+         <div [formGroupName]="i" class="container">
+            <div class="dis-flexs">
+               <div class="label-name" formControlName="day">
+                  <input id="color-toggle" type="checkbox" *ngIf="i == 0">
+                  <span class="labelname checkbox-default-blue checked" 
+                  [value]="day">
+                  <label *ngIf="i == 0">ThursDay</label>
+                  </span>
                </div>
-             </div>
-            <span class="addbreak" (click)="addNewRow()">+</span>
-            <span class="deleteRow" (click)="deleteRow(i)"><i class="fa fa-trash"></i></span>
+               <mat-form-field appearance="outline">
+                  <mat-select 
+                     placeholder="Select Time"
+                     formControlName="filterType">
+                     <mat-option 
+                     *ngFor="let filterType of filterTypes" 
+                     [value]="filterType">
+                     {{ filterType }}
+                     </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               <mat-form-field appearance="outline" class="margin-lft">
+                  <mat-select 
+                  (selectionChange)="selectedAPIChanged(i)"
+                  placeholder="Select Time"
+                  #apiField
+                  formControlName="apiType">
+                  <mat-option 
+                  *ngFor="let apiType of apiTypes"
+                  [value]="apiType">
+                  {{ apiType }}
+                  </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               
+               <!-- <mat-form-field  appearance="outline"
+                  *ngIf="filter.get('value')">
+                  <input 
+                    matInput 
+                    formControlName="value" 
+                    [placeholder]="apiField.value">
+                  </mat-form-field> -->
+               <mat-icon  class="deleteRow"
+               (click)="addFilterToFiltersFormArray5()">
+               add
+            </mat-icon>
+               <mat-icon  class="deleteRow"
+                  (click)="removeFilterFromFiltersFormArray5(i)">
+                  delete
+               </mat-icon>
+            </div>
          </div>
-      <div  class="applyToAll addbreak">Apply To All</div>
-     </div>
-     </div>
-     <div day="Friday" class="label-container">
-      <div class="label-name">
-       <input id="color-toggle" type="checkbox" >
-         <span class="labelname checkbox-default-blue checked">
-         <label>Friday</label>
-         </span>
       </div>
-      <div class="dis-flex" *ngFor="let row of rows; let i = index">
-        <div class="dis-flex" [(ngModel)]="row.noQuestion">
-           <div class="content-container">
-               <div class="content-area">
-                <form [formGroup]="datainputForm" (ngSubmit)="onSubmit()" novalidate>
-                  <section class="form-block">
-                    <div class="form-group dis-flex">
-                      <div class="select pr-1 ml-1">
-                        <select formControlName="dropDownTest" (change)="onSelectChange()" id="dropDownTestId" class="selectBox select-drop-box ">
-                         <option *ngFor="let dropDownTestx of timing" [ngValue]="dropDownTestx" [disabled]="dropDownTestx === 'vmnic2'">
-                            {{ dropDownTestx }}
-                          </option>
-                        </select>
-                      </div>
-                      <div class="select pr-2">
-                          <select formControlName="dropDownTests" (change)="onSelectChange()" id="dropDownTestIds" class="selectBox select-drop-box ">
-                           <option *ngFor="let dropDownTestxs of timing" [ngValue]="dropDownTestxs" [disabled]="dropDownTestxs === 'vmnic2'">
-                              {{ dropDownTestxs }}
-                            </option>
-                          </select>
-                        </div>
-                    </div>
-                  </section>
-                </form>
+      <!-- <button 
+         mat-raised-button 
+         color="primary" 
+         type="button" 
+         (click)="addFilterToFiltersFormArray()">
+      Add row
+      </button> -->
+      <!-- <button 
+         class="save" 
+         mat-stroked-button 
+         color="primary" 
+         [disabled]="dynamicForm.invalid || filtersFormArray.controls.length < 1"
+         (click)="save()">
+         Save
+         </button> -->
+   </div>
+</form>
+<form [formGroup]="dynamicForm6">
+   <div formArrayName="filters6">
+      <div *ngFor="let filter of filtersFormArray6.controls; let i = index;">
+         <div [formGroupName]="i" class="container">
+            <div class="dis-flexs">
+               <div class="label-name" formControlName="day">
+                  <input id="color-toggle" type="checkbox" *ngIf="i == 0">
+                  <span class="labelname checkbox-default-blue checked" 
+                  [value]="day">
+                  <label *ngIf="i == 0">Friday</label>
+                  </span>
                </div>
-             </div>
-            <span class="addbreak" (click)="addNewRow()">+</span>
-            <span class="deleteRow" (click)="deleteRow(i)"><i class="fa fa-trash"></i></span>
+               <mat-form-field appearance="outline">
+                  <mat-select 
+                     placeholder="Select Time"
+                     formControlName="filterType">
+                     <mat-option 
+                     *ngFor="let filterType of filterTypes" 
+                     [value]="filterType">
+                     {{ filterType }}
+                     </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               <mat-form-field appearance="outline" class="margin-lft">
+                  <mat-select 
+                  (selectionChange)="selectedAPIChanged(i)"
+                  placeholder="Select Time"
+                  #apiField
+                  formControlName="apiType">
+                  <mat-option 
+                  *ngFor="let apiType of apiTypes"
+                  [value]="apiType">
+                  {{ apiType }}
+                  </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               
+               <!-- <mat-form-field  appearance="outline"
+                  *ngIf="filter.get('value')">
+                  <input 
+                    matInput 
+                    formControlName="value" 
+                    [placeholder]="apiField.value">
+                  </mat-form-field> -->
+               <mat-icon  class="deleteRow"
+               (click)="addFilterToFiltersFormArray6()">
+               add
+            </mat-icon>
+               <mat-icon  class="deleteRow"
+                  (click)="removeFilterFromFiltersFormArray6(i)">
+                  delete
+               </mat-icon>
+            </div>
          </div>
-      <div  class="applyToAll addbreak">Apply To All</div>
-     </div>
-     </div>
-     <div day="Saturday" class="label-container">
-      <div class="label-name">
-       <input id="color-toggle" type="checkbox" >
-         <span class="labelname checkbox-default-blue checked">
-         <label>Saturday</label>
-         </span>
       </div>
-      <div class="dis-flex" *ngFor="let row of rows; let i = index">
-        <div class="dis-flex" [(ngModel)]="row.noQuestion">
-           <div class="content-container">
-               <div class="content-area">
-               <form [formGroup]="datainputForm" (ngSubmit)="onSubmit()" novalidate>
-                  <section class="form-block">
-                    <div class="form-group dis-flex">
-                      <div class="select pr-1 ml-1">
-                        <select formControlName="dropDownTest" (change)="onSelectChange()" id="dropDownTestId" class="selectBox select-drop-box ">
-                         <option *ngFor="let dropDownTestx of timing" [ngValue]="dropDownTestx" [disabled]="dropDownTestx === 'vmnic2'">
-                            {{ dropDownTestx }}
-                          </option>
-                        </select>
-                      </div>
-                      <div class="select pr-2">
-                          <select formControlName="dropDownTests" (change)="onSelectChange()" id="dropDownTestIds" class="selectBox select-drop-box ">
-                           <option *ngFor="let dropDownTestxs of timing" [ngValue]="dropDownTestxs" [disabled]="dropDownTestxs === 'vmnic2'">
-                              {{ dropDownTestxs }}
-                            </option>
-                          </select>
-                        </div>
-                    </div>
-                  </section>
-                </form>
+      <!-- <button 
+         mat-raised-button 
+         color="primary" 
+         type="button" 
+         (click)="addFilterToFiltersFormArray()">
+      Add row
+      </button> -->
+      <!-- <button 
+         class="save" 
+         mat-stroked-button 
+         color="primary" 
+         [disabled]="dynamicForm.invalid || filtersFormArray.controls.length < 1"
+         (click)="save()">
+         Save
+         </button> -->
+   </div>
+</form>
+<form [formGroup]="dynamicForm7">
+   <div formArrayName="filters7">
+      <div *ngFor="let filter of filtersFormArray7.controls; let i = index;">
+         <div [formGroupName]="i" class="container">
+            <div class="dis-flexs">
+               <div class="label-name" formControlName="day">
+                  <input id="color-toggle" type="checkbox" (change)="showOptions($event)" *ngIf="i == 0">
+                  <span class="labelname checkbox-default-blue checked" 
+                  [value]="day">
+                  <label *ngIf="i == 0">Saturday</label>
+                  </span>
                </div>
-             </div>
-            <span class="addbreak" (click)="addNewRow()">+</span>
-            <span class="deleteRow" (click)="deleteRow(i)"><i class="fa fa-trash"></i></span>
+               <mat-form-field appearance="outline">
+                  <mat-select 
+                     placeholder="Select Time"
+                     formControlName="filterType">
+                     <mat-option 
+                     *ngFor="let filterType of filterTypes" 
+                     [value]="filterType">
+                     {{ filterType }}
+                     </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               <mat-form-field appearance="outline" class="margin-lft">
+                  <mat-select 
+                  (selectionChange)="selectedAPIChanged(i)"
+                  placeholder="Select Time"
+                  #apiField
+                  formControlName="apiType">
+                  <mat-option 
+                  *ngFor="let apiType of apiTypes"
+                  [value]="apiType">
+                  {{ apiType }}
+                  </mat-option>
+                  </mat-select>
+               </mat-form-field>
+               
+               <!-- <mat-form-field  appearance="outline"
+                  *ngIf="filter.get('value')">
+                  <input 
+                    matInput 
+                    formControlName="value" 
+                    [placeholder]="apiField.value">
+                  </mat-form-field> -->
+               <mat-icon  class="deleteRow"
+               (click)="addFilterToFiltersFormArray7()">
+               add
+            </mat-icon>
+               <mat-icon  class="deleteRow"
+                  (click)="removeFilterFromFiltersFormArray7(i)">
+                  delete
+               </mat-icon>
+            </div>
          </div>
-      <div  class="applyToAll addbreak">Apply To All</div>
-     </div>
-     </div> -->
-  <!-- </ng-scrollbar> -->
+      </div>
+      <!-- <button 
+         mat-raised-button 
+         color="primary" 
+         type="button" 
+         (click)="addFilterToFiltersFormArray()">
+      Add row
+      </button> -->
+      <!-- <button 
+         class="save" 
+         mat-stroked-button 
+         color="primary" 
+         [disabled]="dynamicForm.invalid || filtersFormArray.controls.length < 1"
+         (click)="save()">
+         Save
+         </button> -->
+   </div>
+</form>
+   
   <div class="popup-button mb-2">
      <span class="buttons cancel" (click)="close()">Cancel</span>
      <span   (click)="save()" class="buttons add">Save</span>
diff --git a/ng-seed/src/app/appoinment/consultant-setting/edit-working-hours/edit-working-hours.component.ts b/ng-seed/src/app/appoinment/consultant-setting/edit-working-hours/edit-working-hours.component.ts
index a4256d1..8e5fb2c 100644
--- a/ng-seed/src/app/appoinment/consultant-setting/edit-working-hours/edit-working-hours.component.ts
+++ b/ng-seed/src/app/appoinment/consultant-setting/edit-working-hours/edit-working-hours.component.ts
@@ -22,6 +22,12 @@ export class EditWorkingHoursComponent implements OnInit {
   ];
 
   dynamicForm: FormGroup;
+  dynamicForm2: FormGroup;
+  dynamicForm3: FormGroup;
+  dynamicForm4: FormGroup;
+  dynamicForm5: FormGroup;
+  dynamicForm6: FormGroup;
+  dynamicForm7: FormGroup;
   // rows = [{noQuestion : 0}];
   datainputForm: FormGroup;
   // timing: any[] = ['09:00am','09:30am','10:00am','10:30am','11:00am','11:30am','12:00am','12:30am','01:00pm','01:00pm','01:30pm', '02:00pm', '02:30pm', '03:00pm', '03:30pm', '04:00pm', '04:30pm', '05:00pm', '05:30pm', '06:00pm', '06:30pm', '07:00pm', '07:30pm', '08:00pm','08:30pm', '09:00pm',]
@@ -50,20 +56,129 @@ ngOnInit(): void {
   this.dynamicForm = this.fb.group({
     filters: this.fb.array([])
   });
+  this.dynamicForm2 = this.fb.group({
+    filters2: this.fb.array([])
+  });
+  this.dynamicForm3 = this.fb.group({
+    filters3: this.fb.array([])
+  });
+  this.dynamicForm4 = this.fb.group({
+    filters4: this.fb.array([])
+  });
+  this.dynamicForm5 = this.fb.group({
+    filters5: this.fb.array([])
+  });
+  this.dynamicForm6 = this.fb.group({
+    filters6: this.fb.array([])
+  });
+  this.dynamicForm7 = this.fb.group({
+    filters7: this.fb.array([])
+  });
   this.seedFiltersFormArray();
+   this.seedFiltersFormArray2();
+  this.seedFiltersFormArray3();
+  this.seedFiltersFormArray4();
+  this.seedFiltersFormArray5();
+  this.seedFiltersFormArray6();
+  this.seedFiltersFormArray7();
+
 }
 
 
 seedFiltersFormArray() {
   this.seedData.forEach(seedDatum => {
+    console.log(seedDatum)
     const formGroup = this.createFilterGroup();
     if (seedDatum.apiType) {
       formGroup.addControl('value', this.getFormControl());
     }
+    seedDatum.day = 'sunday'
+
     formGroup.patchValue(seedDatum);
     this.filtersFormArray.push(formGroup);
+ 
+ 
   });
 }
+seedFiltersFormArray2() {
+  this.seedData.forEach(seedDatum => {
+    const formGroup = this.createFilterGroup();
+    if (seedDatum.apiType) {
+      formGroup.addControl('value', this.getFormControl());
+    }
+    seedDatum.day = 'monday'
+    formGroup.patchValue(seedDatum);
+    this.filtersFormArray2.push(formGroup);
+ 
+ 
+  });
+}
+seedFiltersFormArray3() {
+  this.seedData.forEach(seedDatum => {
+    const formGroup = this.createFilterGroup();
+    if (seedDatum.apiType) {
+      formGroup.addControl('value', this.getFormControl());
+    }
+    seedDatum.day = 'tuesday'
+    formGroup.patchValue(seedDatum);
+    this.filtersFormArray3.push(formGroup);
+ 
+ 
+  });
+}
+seedFiltersFormArray4() {
+  this.seedData.forEach(seedDatum => {
+    const formGroup = this.createFilterGroup();
+    if (seedDatum.apiType) {
+      formGroup.addControl('value', this.getFormControl());
+    }
+    seedDatum.day = 'wednesday'
+    formGroup.patchValue(seedDatum);
+    this.filtersFormArray4.push(formGroup);
+ 
+ 
+  });
+}
+seedFiltersFormArray5() {
+  this.seedData.forEach(seedDatum => {
+    const formGroup = this.createFilterGroup();
+    if (seedDatum.apiType) {
+      formGroup.addControl('value', this.getFormControl());
+    }
+    seedDatum.day = 'thursday'
+    formGroup.patchValue(seedDatum);
+    this.filtersFormArray5.push(formGroup);
+ 
+ 
+  });
+}
+seedFiltersFormArray6() {
+  this.seedData.forEach(seedDatum => {
+    const formGroup = this.createFilterGroup();
+    if (seedDatum.apiType) {
+      formGroup.addControl('value', this.getFormControl());
+    }
+    seedDatum.day = 'friday'
+    formGroup.patchValue(seedDatum);
+    this.filtersFormArray6.push(formGroup);
+ 
+ 
+  });
+}
+seedFiltersFormArray7() {
+  this.seedData.forEach(seedDatum => {
+    const formGroup = this.createFilterGroup();
+    if (seedDatum.apiType) {
+      formGroup.addControl('value', this.getFormControl());
+    }
+    seedDatum.day = 'saturday'
+    formGroup.patchValue(seedDatum);
+    this.filtersFormArray7.push(formGroup);
+ 
+ 
+  });
+}
+ 
 
 createFilterGroup() {
   return this.fb.group({
@@ -72,15 +187,58 @@ createFilterGroup() {
     day: []
   });
 }
+createFilterGroup2() {
+  return this.fb.group({
+    filterType: [],
+    apiType: [],
+    day: []
+  });
+}
 
 addFilterToFiltersFormArray() {
   this.filtersFormArray.push(this.createFilterGroup());
 }
+addFilterToFiltersFormArray2() {
+  this.filtersFormArray2.push(this.createFilterGroup2());
+}
+addFilterToFiltersFormArray3() {
+  this.filtersFormArray3.push(this.createFilterGroup());
+}
+addFilterToFiltersFormArray4() {
+  this.filtersFormArray4.push(this.createFilterGroup());
+}
+addFilterToFiltersFormArray5() {
+  this.filtersFormArray5.push(this.createFilterGroup());
+}
+addFilterToFiltersFormArray6() {
+  this.filtersFormArray6.push(this.createFilterGroup());
+}
+addFilterToFiltersFormArray7() {
+  this.filtersFormArray7.push(this.createFilterGroup());
+}
 
 removeFilterFromFiltersFormArray(index) {
   this.filtersFormArray.removeAt(index);
 }
-
+removeFilterFromFiltersFormArray2(index) {
+  this.filtersFormArray2.removeAt(index);
+}
+removeFilterFromFiltersFormArray3(index) {
+  this.filtersFormArray3.removeAt(index);
+}
+removeFilterFromFiltersFormArray4(index) {
+  this.filtersFormArray4.removeAt(index);
+}
+removeFilterFromFiltersFormArray5(index) {
+  this.filtersFormArray5.removeAt(index);
+}
+removeFilterFromFiltersFormArray6(index) {
+  this.filtersFormArray6.removeAt(index);
+}
+removeFilterFromFiltersFormArray7(index) {
+  this.filtersFormArray7.removeAt(index);
+}
+ 
 selectedAPIChanged(i) {
   this.getFilterGroupAtIndex(i).addControl('value', this.getFormControl());
 }
@@ -90,12 +248,34 @@ getFormControl() {
 }
 
 save() {
-  console.log(this.dynamicForm.value);
+
+  let tmp = [this.dynamicForm.value,this.dynamicForm2.value,this.dynamicForm3.value,this.dynamicForm4.value,this.dynamicForm5.value,this.dynamicForm6.value,this.dynamicForm7.value]
+  console.log(tmp);
+  
+ 
 }
 
 get filtersFormArray() {
   return (<FormArray>this.dynamicForm.get('filters'));
 }
+get filtersFormArray2() {
+  return (<FormArray>this.dynamicForm2.get('filters2'));
+}
+get filtersFormArray3() {
+  return (<FormArray>this.dynamicForm3.get('filters3'));
+}
+get filtersFormArray4() {
+  return (<FormArray>this.dynamicForm4.get('filters4'));
+}
+get filtersFormArray5() {
+  return (<FormArray>this.dynamicForm5.get('filters5'));
+}
+get filtersFormArray6() {
+  return (<FormArray>this.dynamicForm6.get('filters6'));
+}
+get filtersFormArray7() {
+  return (<FormArray>this.dynamicForm7.get('filters7'));
+}
 
 getFilterGroupAtIndex(index) {
   return (<FormGroup>this.filtersFormArray.at(index));
@@ -121,4 +301,6 @@ getFilterGroupAtIndex(index) {
   onSubmit() {
     console.log(this.datainputForm.value);
   }
+  showOptions(event:any): void {
+    console.log(event.checked);}
 }
diff --git a/ng-seed/src/app/appoinment/customers/customers-list/customers-list.component.ts b/ng-seed/src/app/appoinment/customers/customers-list/customers-list.component.ts
index 9d34fc5..93d3661 100644
--- a/ng-seed/src/app/appoinment/customers/customers-list/customers-list.component.ts
+++ b/ng-seed/src/app/appoinment/customers/customers-list/customers-list.component.ts
@@ -2,6 +2,7 @@ import { Component, OnInit, ViewChild } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { MatPaginator, PageEvent } from '@angular/material/paginator';
 import { MatTable, MatTableDataSource } from '@angular/material/table';
+import { AppointmentsService } from 'app/appoinment/appoinments/appointments-service/appointments.service';
 import Swal from 'sweetalert2';
 import { AddCustomersComponent } from '../add-customers/add-customers.component';
 import { CustomersService } from '../customers-service/customers.service';
@@ -50,8 +51,9 @@ export class CustomersListComponent implements OnInit {
   // pageSize = 10;
   // pageEvent: PageEvent;
   addFormData: any;
-
-  constructor(public dialog: MatDialog,public _cus:CustomersService) { }
+  appoinmentsList:any =[];
+  appoinmentsIds:any = [];
+  constructor(public dialog: MatDialog,public _cus:CustomersService,public _app:AppointmentsService) { }
 
   ngOnInit(): void {
     // console.log('IN')
@@ -61,10 +63,47 @@ export class CustomersListComponent implements OnInit {
 
   getCustomersList() {
     //this._pd.getTabStatusPdDetails(this.tabStatus)
+    let user_role = localStorage.getItem('user_role');
+    if(user_role == 'PRACTITIONER'){
+    this._app.getAppoinmentsListDetails().subscribe(res => {
+      if (res.status == 200) {
+   this.appoinmentsList = res.data; 
+        let id = localStorage.getItem('user_id')
+        console.log(id)
+       
+    console.log(this.appoinmentsList)
+    
+    let filter = this.appoinmentsList.filter(arr=>{return arr["ServicesMapDetail.userId"]
+      == id}) 
+    console.log(filter)
+    filter.forEach(element => {
+      this.appoinmentsIds.push( element.customer[0].id)
+
+      
+    });
+       
+      }
+      else{
+      
+      }
+    })
+  }
     this._cus.getCustomersListDetails().subscribe(res => {
           if (res.status == 200) {
             this.customersList = res.data; 
-            // console.log(this.customersList)
+             console.log(this.customersList,this.appoinmentsIds)
+             let user_role = localStorage.getItem('user_role');
+             if(user_role == 'PRACTITIONER'){
+
+          
+             const activeIds = this.appoinmentsIds
+            const serviceList =  this.customersList
+
+            const result = serviceList.filter(({id}) => activeIds.includes(id));
+            console.log(result)
+            this.customersList = result
+          }
+
             // this.dataSource = res.data.length;
             // console.log(this.dataSource)
             // this.dataSource.data = this.customersList;
diff --git a/ng-seed/src/app/appoinment/service-list-details/service-api-services/api-service.service.ts b/ng-seed/src/app/appoinment/service-list-details/service-api-services/api-service.service.ts
index 7a43b7b..2f27a68 100644
--- a/ng-seed/src/app/appoinment/service-list-details/service-api-services/api-service.service.ts
+++ b/ng-seed/src/app/appoinment/service-list-details/service-api-services/api-service.service.ts
@@ -14,7 +14,7 @@ export class ApiServiceService {
 
   getServicesListDetails(): Observable<any> {  
     console.log('IN')
-      return this._http.get<any[]>(this.apiUrl + "getServicesDetails ")
+      return this._http.post<any[]>(this.apiUrl + "getServicesDetails",{})
           // .pipe(
           // catchError(this.handleError('role', []))
           // )
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 c2653ec..a57da35 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
@@ -31,7 +31,7 @@
                    
                     <ng-container matColumnDef="duration">
                       <th mat-header-cell *matHeaderCellDef class="font-color"> Duration </th>
-                      <td mat-cell *matCellDef="let element"> {{element.duration}} </td>
+                      <td mat-cell *matCellDef="let element"> {{element.duration}} Mins </td>
                     </ng-container> 
                     
                     <ng-container matColumnDef="action">
diff --git a/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.ts b/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.ts
index 05f58c3..771838e 100644
--- a/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.ts
+++ b/ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.ts
@@ -44,29 +44,12 @@ export class ServiceListComponent implements OnInit {
     this.getServicesList()
   }
 
-  getServicesList() {
-    //this._pd.getTabStatusPdDetails(this.tabStatus)
+  getServicesList() { 
     this._api.getServicesListDetails().subscribe(res => {
           if (res.status == 200) {
-            this.servicesList = res.data; 
-            // console.log(this.servicesList)
-            // this.dataSource = res.data.length;
-            // console.log(this.dataSource)
-            // this.dataSource.data = this.servicesList;
-            // console.log(this.dataSource.data)
-            // this.recordStatus=false;
-          }
-          else{
-            // this.servicesList=[];
-            // this.dataSource = null;
-            // this.recordStatus=true;
-          }
-        }
-        ,error => {
-          // this.errorMessage.push(error);
-          // this.notifier.notify('error', 'Something Went Wrong Try Again.! \t\"' + (error.error_type == 2 ? error.error_status + ' ( ' + error.error_text + ' ) '  : ' ( ' + error.error_text + ' ) ') +'\" Error Occur.!');
-          // alert(error.html_format);
-        });
+            this.servicesList = res.data;  
+          } 
+        } );
   }
 
   confirmBox(event,element){  
diff --git a/ng-seed/src/app/end-user/end-user.service.ts b/ng-seed/src/app/end-user/end-user.service.ts
index 770cb59..abe3293 100644
--- a/ng-seed/src/app/end-user/end-user.service.ts
+++ b/ng-seed/src/app/end-user/end-user.service.ts
@@ -15,7 +15,7 @@ private apiUrl = environment.apiEndpoint;
 
   getServicesListDetails(): Observable<any> {  
     console.log('IN')
-      return this._http.get<any[]>(this.apiUrl + "getServicesDetails ")
+      return this._http.get<any[]>(this.apiUrl + "getServicesDetails",{})
           // .pipe(
           // catchError(this.handleError('role', []))
           // )
diff --git a/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.html b/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.html
index 62e88f8..191b0b9 100644
--- a/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.html
+++ b/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.html
@@ -95,4 +95,4 @@
     <div  fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="50" fxFlex.lg="50" fxFlex.xl="50" class="m-gap p-gap flx" fxLayoutAlign="end center">
        <app-summary></app-summary>
     </div>
- </div>
\ No newline at end of file
+ </div>