From af9645a99b82e84ab8238a88d406a44cb54aa8f5 Mon Sep 17 00:00:00 2001 From: "surendar.m@watermelon.us" Date: Thu, 30 Mar 2023 18:34:46 +0530 Subject: [PATCH] slot --- .../booking-summary.component.scss | 3 + .../centers-list.component.scss | 4 + .../consultants-list.component.html | 131 +++++++++--------- .../consultants-list.component.scss | 9 +- .../consultants/consultants-list.component.ts | 79 ++--------- .../customer-info.component.html | 4 +- .../customer-info.component.scss | 6 +- .../doctor-profile.component.scss | 3 + ng-seed/src/app/end-user/end-user.module.ts | 5 +- ng-seed/src/app/end-user/end-user.service.ts | 2 +- .../end-user/payment/payment.component.scss | 5 +- .../search-category.component.scss | 3 + .../service-list.component.html | 4 +- .../service-list.component.scss | 6 +- .../service-list.component.ts | 28 +--- .../slot-booking-details.component.html | 93 +++---------- .../slot-booking-details.component.scss | 21 ++- .../slot-booking-details.component.ts | 88 ++++++++++-- .../end-user/summary/summary.component.scss | 11 +- 19 files changed, 242 insertions(+), 263 deletions(-) diff --git a/ng-seed/src/app/end-user/booking-summary/booking-summary.component.scss b/ng-seed/src/app/end-user/booking-summary/booking-summary.component.scss index 7140c56..74fcb71 100644 --- a/ng-seed/src/app/end-user/booking-summary/booking-summary.component.scss +++ b/ng-seed/src/app/end-user/booking-summary/booking-summary.component.scss @@ -10,4 +10,7 @@ mat-toolbar{ background-color: #227f6e; color:#fff; +} +::ng-deep body{ + background-color: #f7f8f5 !important; } \ No newline at end of file diff --git a/ng-seed/src/app/end-user/business-centers/centers-list.component.scss b/ng-seed/src/app/end-user/business-centers/centers-list.component.scss index 9830e8e..e783c32 100644 --- a/ng-seed/src/app/end-user/business-centers/centers-list.component.scss +++ b/ng-seed/src/app/end-user/business-centers/centers-list.component.scss @@ -117,4 +117,8 @@ $black_60: rgba(0, 0, 0, 0.6); mat-icon{ color: #979797; font-size: 16px; +} + +::ng-deep body{ + background-color: #f7f8f5 !important; } \ No newline at end of file diff --git a/ng-seed/src/app/end-user/consultants/consultants-list.component.html b/ng-seed/src/app/end-user/consultants/consultants-list.component.html index b95827e..217f1b6 100644 --- a/ng-seed/src/app/end-user/consultants/consultants-list.component.html +++ b/ng-seed/src/app/end-user/consultants/consultants-list.component.html @@ -2,72 +2,73 @@ Appointment
-
-
-

Practitioner List

-
-
- - Search practitioner - - search - -
-
-
-
-
-
-
-
-
- Online Doctor Consultation - Medical Oncology - +
+
+
+
+

Practitioner List

+
+
+ + Search practitioner + + search + +
+
+
+
+
+
+
+
+ Online Doctor Consultation - Medical Oncology + +
+
+
+
+ user list image +
+
+
+
+
{{consultant.userName}}
+ {{consultant.practitionerInfos[0].designtion + || "ENT" }}
+ {{consultant.practitionerInfos[0].exp || null}}
+ {{consultant.practitionerInfos[0].qualification || null}}
+ Starts at ₹ {{consultant.practitionerInfos[0].fees || 100}}
+
+
+ + transcribe + {{consultant.practitionerInfos[0].languages || ""}} + + + location_on + {{consultant.city}} + + + access_time + {{consultant.time}} + + +
-
-
-
- user list image -
-
-
-
-
{{consultant.userName}}
- {{consultant.practitionerInfos[0].designtion - || "ENT" }}
- {{consultant.practitionerInfos[0].exp || null}}
- {{consultant.practitionerInfos[0].qualification || null}}
- Starts at ₹ {{consultant.practitionerInfos[0].fees || 100}}
-
-
- - transcribe - {{consultant.practitionerInfos[0].languages || ""}} - - - location_on - {{consultant.city}} - - - access_time - {{consultant.time}} - -
- - -
-
-
-
-
- -
-
+
+
+
+
+ +
+
+ -
+
\ No newline at end of file diff --git a/ng-seed/src/app/end-user/consultants/consultants-list.component.scss b/ng-seed/src/app/end-user/consultants/consultants-list.component.scss index a62395d..91791f2 100644 --- a/ng-seed/src/app/end-user/consultants/consultants-list.component.scss +++ b/ng-seed/src/app/end-user/consultants/consultants-list.component.scss @@ -7,7 +7,7 @@ $color_red_orange_approx: #4caf50; $black_60: rgba(0, 0, 0, 0.6); .consultant-content { padding: 0rem 0.5rem 1rem; - padding-bottom: 4rem; + // padding-bottom: 4rem; } .flexRow{ display: flex !important; @@ -20,6 +20,7 @@ $black_60: rgba(0, 0, 0, 0.6); height: calc(100vh - 105px); } .consultant-list-card { + border-radius: 10px; background: $white; box-shadow: 0 2px 6px $black_10; transition: all 0.3s ease-in-out 0s; @@ -151,4 +152,8 @@ mat-toolbar{ .btn-red{ margin: 0rem; } - } \ No newline at end of file + } + + ::ng-deep body{ + background-color: #f7f8f5 !important; +} \ No newline at end of file diff --git a/ng-seed/src/app/end-user/consultants/consultants-list.component.ts b/ng-seed/src/app/end-user/consultants/consultants-list.component.ts index 4d1e038..501ac03 100644 --- a/ng-seed/src/app/end-user/consultants/consultants-list.component.ts +++ b/ng-seed/src/app/end-user/consultants/consultants-list.component.ts @@ -42,76 +42,17 @@ export class ConsultantsListComponent implements OnInit { )) ); this.consultants = result; - // this.consultants = [{ - // name: 'Dr. Suganya', - // specialist: 'ENT', - // year: '1 YRS EXP', - // qualification: 'MBBS, MS', - // payment: '800', - // language: 'TAMIL, ENGILSH', - // city: 'Apollo Hospital Chennai', - // image:'assets/images/face1.jpg', - // time: 'Available in 3 mins', - // img:'assets/images/stethoscope.png' + console.log(this.consultants) + let workinghrs = [] + this.consultants.forEach(element => { + console.log(element) + element.practitionerInfos.forEach(e => { + workinghrs.push(e) + }); - // },{ - // name: 'Dr. Indhu Mathi', - // specialist: 'ORTHOPAEDICS', - // year: '2 YRS EXP', - // qualification: 'MBBS, MS', - // payment: '800', - // language: 'TAMIL, ENGILSH', - // city: 'Apollo Hospital Chennai', - // image:'assets/images/face2.jpg', - // time: 'Available in 4 mins', - // img:'assets/images/stethoscope.png' - // },{ - // name: 'Dr. Gaurav Kumar', - // specialist: 'BREAST SURGERY', - // year: '3 YRS EXP', - // qualification: 'MBBS, MS', - // payment: '800', - // language: 'TAMIL, ENGILSH', - // city: 'Apollo Hospital Chennai', - // image:'assets/images/face3.jpg', - // time: 'Available in 5 mins', - // img:'assets/images/stethoscope.png' - // },{ - // name: 'Dr. Saloni Sinha', - // specialist: 'CARDIOLOGY', - // year: '4 YRS EXP', - // qualification: 'MBBS, MS', - // payment: '800', - // language: 'TAMIL, ENGILSH', - // city: 'Apollo Hospital Chennai', - // image:'assets/images/face4.jpg', - // time: 'Available in 6 mins', - // img:'assets/images/stethoscope.png' - // },{ - // name: 'Dr. Padmaja', - // specialist: 'DIABETOLOGY', - // year: '5 YRS EXP', - // qualification: 'MBBS, MS', - // payment: '800', - // language: 'TAMIL, ENGILSH', - // city: 'Apollo Hospital Chennai', - // image:'assets/images/face5.jpg', - // time: 'Available in 7 mins', - // img:'assets/images/stethoscope.png' - // },{ - // name: 'Dr. Pradeep ', - // specialist: 'ENDOCRINOLOGY', - // year: '6 YRS EXP', - // qualification: 'MBBS, MS', - // payment: '800', - // language: 'TAMIL, ENGILSH', - // city: 'Apollo Hospital Chennai', - // image:'assets/images/face6.jpg', - // time: 'Available in 8 mins', - // img:'assets/images/stethoscope.png' - // } - // ]; - + }); + console.log(workinghrs) + localStorage.setItem('workingHrs',workinghrs[0].workingHours) } goToSlotBooking(param){ diff --git a/ng-seed/src/app/end-user/customer-info/customer-info.component.html b/ng-seed/src/app/end-user/customer-info/customer-info.component.html index 0bf4651..e44cde4 100644 --- a/ng-seed/src/app/end-user/customer-info/customer-info.component.html +++ b/ng-seed/src/app/end-user/customer-info/customer-info.component.html @@ -4,7 +4,7 @@ Appointment
-
+

Customer Information

@@ -82,7 +82,7 @@
-
+
diff --git a/ng-seed/src/app/end-user/customer-info/customer-info.component.scss b/ng-seed/src/app/end-user/customer-info/customer-info.component.scss index a696767..fb64575 100644 --- a/ng-seed/src/app/end-user/customer-info/customer-info.component.scss +++ b/ng-seed/src/app/end-user/customer-info/customer-info.component.scss @@ -29,4 +29,8 @@ mat-toolbar{ max-width: 100%!important; margin-top: -6rem; } - } \ No newline at end of file + } + + ::ng-deep body{ + background-color: #f7f8f5 !important; +} \ No newline at end of file diff --git a/ng-seed/src/app/end-user/doctor-profile/doctor-profile.component.scss b/ng-seed/src/app/end-user/doctor-profile/doctor-profile.component.scss index 7c6db42..a9b481b 100644 --- a/ng-seed/src/app/end-user/doctor-profile/doctor-profile.component.scss +++ b/ng-seed/src/app/end-user/doctor-profile/doctor-profile.component.scss @@ -121,4 +121,7 @@ h5{ .media-prof{ margin-top: 18rem; } +} +::ng-deep body{ + background-color: #f7f8f5 !important; } \ No newline at end of file diff --git a/ng-seed/src/app/end-user/end-user.module.ts b/ng-seed/src/app/end-user/end-user.module.ts index 87f9dbf..49254e8 100644 --- a/ng-seed/src/app/end-user/end-user.module.ts +++ b/ng-seed/src/app/end-user/end-user.module.ts @@ -1,5 +1,5 @@ import { NgModule } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { CommonModule, DatePipe } from '@angular/common'; import { EndUserRoutingModule } from './end-user-routing.module'; import { DemoMaterialModule } from 'app/shared/demo.module'; @@ -36,7 +36,8 @@ import { DoctorProfileComponent } from './doctor-profile/doctor-profile.componen SharedModule ], providers:[ - EndUserService + EndUserService, + DatePipe ] }) export class EndUserModule { } 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 abe3293..104db2a 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 { console.log('IN') - return this._http.get(this.apiUrl + "getServicesDetails",{}) + return this._http.post(this.apiUrl + "getServicesDetails",{}) // .pipe( // catchError(this.handleError('role', [])) // ) diff --git a/ng-seed/src/app/end-user/payment/payment.component.scss b/ng-seed/src/app/end-user/payment/payment.component.scss index eb8f824..eec15df 100644 --- a/ng-seed/src/app/end-user/payment/payment.component.scss +++ b/ng-seed/src/app/end-user/payment/payment.component.scss @@ -27,4 +27,7 @@ mat-toolbar{ max-width: 100%!important; margin-top: -6rem; } - } \ No newline at end of file + } + ::ng-deep body{ + background-color: #f7f8f5 !important; +} \ No newline at end of file diff --git a/ng-seed/src/app/end-user/search-category/search-category.component.scss b/ng-seed/src/app/end-user/search-category/search-category.component.scss index 9ee4b58..092570f 100644 --- a/ng-seed/src/app/end-user/search-category/search-category.component.scss +++ b/ng-seed/src/app/end-user/search-category/search-category.component.scss @@ -361,4 +361,7 @@ $black_60: rgba(0, 0, 0, 0.6); ::ng-deep .mat-form-field-appearance-fill .mat-form-field-flex { background-color: #fff0 !important; } +} +::ng-deep body{ + background-color: #f7f8f5 !important; } \ No newline at end of file diff --git a/ng-seed/src/app/end-user/service-list-details/service-list.component.html b/ng-seed/src/app/end-user/service-list-details/service-list.component.html index c11602c..d933e82 100644 --- a/ng-seed/src/app/end-user/service-list-details/service-list.component.html +++ b/ng-seed/src/app/end-user/service-list-details/service-list.component.html @@ -19,7 +19,7 @@
-
+
@@ -27,7 +27,7 @@
- {{serviceListDetails.servicesName}} + {{serviceListDetails.servicesName}} diff --git a/ng-seed/src/app/end-user/service-list-details/service-list.component.scss b/ng-seed/src/app/end-user/service-list-details/service-list.component.scss index 7b2b232..3b79368 100644 --- a/ng-seed/src/app/end-user/service-list-details/service-list.component.scss +++ b/ng-seed/src/app/end-user/service-list-details/service-list.component.scss @@ -153,4 +153,8 @@ footer { footer { position: fixed; } - } \ No newline at end of file + } + + ::ng-deep body{ + background-color: #f7f8f5 !important; +} \ No newline at end of file diff --git a/ng-seed/src/app/end-user/service-list-details/service-list.component.ts b/ng-seed/src/app/end-user/service-list-details/service-list.component.ts index 9e45d1f..bd9f40c 100644 --- a/ng-seed/src/app/end-user/service-list-details/service-list.component.ts +++ b/ng-seed/src/app/end-user/service-list-details/service-list.component.ts @@ -65,7 +65,7 @@ export class ServiceListComponent implements OnInit { this.enduser.getcusServicesMapDetails(params).subscribe(res => { if (res.status == 200) { console.log(res) - this.full_data = res['data'] + this.full_data = res['data'] let tmp =[]; localStorage.setItem('cusServiceData',JSON.stringify(res['data'])) res['data'].forEach(element => { @@ -74,7 +74,6 @@ export class ServiceListComponent implements OnInit { this.servicesList_array.push(e) }); - }); console.log(tmp, this.servicesList_array) this.servicesList_array @@ -91,27 +90,10 @@ export class ServiceListComponent implements OnInit { } }); //this._pd.getTabStatusPdDetails(this.tabStatus) - 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._api.getServicesListDetails().subscribe(res => { + // if (res.status == 200) { + // } + // }); } confirmBox(event,element){ 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 191b0b9..7b7fa91 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 @@ -8,86 +8,35 @@

Slot Availability

-
Date & Time: {{selected | date:'mediumDate'}}
+
Date & Time: {{chooseDate | date:'mediumDate'}} - {{slotTime}}
-
-
+
+ + + Choose a date + + + + +
-
-
- - - - - - - - - - - - -
- - - - - - - - - - - - - - - - -
- - - - - - - - - - - - - - - - -
- - - - - - - - - - - - - - - - - -
+
+ + + + +
+ + +
diff --git a/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.scss b/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.scss index f7162a7..85659d1 100644 --- a/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.scss +++ b/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.scss @@ -24,11 +24,7 @@ margin-left: -3rem!important; color: $white; border: 1px solid $color_red_orange_approx; float: right; -} -h6{ - color: #0087ba; - font-weight: 600; -} +} .primary{ background-color: #658F9B; color: white; @@ -64,6 +60,7 @@ h6{ } .card-mat{ max-width: 66%; + padding: 1rem !important; } @media only screen and (max-width: 600px) { h3{ @@ -86,4 +83,16 @@ h6{ .img-set{ margin-right: 2rem; } - } \ No newline at end of file + } + ::ng-deep body{ + background-color: #f7f8f5 !important; +} +.dateTime{ + margin:0 !important; + color: #0087ba; + font-weight: 600; +} +.datecolor{ + color: black !important; + font-weight: 500 !important; +} \ No newline at end of file diff --git a/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.ts b/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.ts index 12310c4..ea7bd95 100644 --- a/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.ts +++ b/ng-seed/src/app/end-user/slot-booking/slot-booking-details.component.ts @@ -1,13 +1,20 @@ +import { DatePipe } from '@angular/common'; import { Component, OnInit } from '@angular/core'; import { FormControl, FormGroup, Validators } from '@angular/forms'; import { Router } from '@angular/router'; +import * as moment from 'moment'; @Component({ selector: 'app-slot-booking-details', templateUrl: './slot-booking-details.component.html', - styleUrls: ['./slot-booking-details.component.scss'] + styleUrls: ['./slot-booking-details.component.scss'], + providers:[DatePipe] }) export class SlotBookingDetailsComponent implements OnInit { + minDate: Date; + maxDate: Date; + chooseDate:Date | null; + slotTime:any; form: FormGroup; local_data:any; element: HTMLElement; @@ -28,22 +35,80 @@ export class SlotBookingDetailsComponent implements OnInit { {workspace: 'test 2'}, {workspace: 'test 3'}, ]; - constructor(private router:Router,) { } + workingHours: any; + getHours: any; + constructor(private router:Router,private datepipe:DatePipe) { + // Set the minimum to January 1st 20 years in the past and December 31st a year in the future. + const currentYear:any = new Date(); + console.log(currentYear) + this.minDate = currentYear + this.maxDate = new Date(currentYear + 5); + // this.maxDate = new Date(currentYear + 1, 11, 31); + console.log(this.maxDate) + this.workingHours = localStorage.getItem('workingHrs') + let formatDate = this.datepipe.transform(new Date(),'EEEE') + let findDate = formatDate.toLowerCase() + console.log(findDate) + console.log(JSON.parse(this.workingHours)) + this.workingHours = JSON.parse(this.workingHours) + + this.workingHours.forEach((value,index) => { + console.log(value[findDate],index) + if(value[findDate] != undefined){ + this.getHours = value[findDate]['hours'] + console.log(this.getHours[0]) + } + //value.filter(val => findDate == val.) + // for(const [key,value1] of Object.entries(value)) { + // console.log(key,value1) + // } + }); + let getDuration = JSON.parse(localStorage.getItem('servicedetails')) + console.log(getDuration.duration) + + const startTime = moment(this.getHours[0].startTime); + const endTime = moment(this.getHours[0].endTime); + + // Define the interval duration in minutes + const intervalDurationInMinutes = 30; + + // Define an array to store the intervals + const intervals = []; + + // Iterate over the time range and split it into intervals + let currentIntervalStartTime = startTime; + while (currentIntervalStartTime < endTime) { + // Calculate the end time of the interval + const currentIntervalEndTime = moment.min(currentIntervalStartTime.clone().add(intervalDurationInMinutes, 'minutes'), endTime); + + // Add the interval to the array + intervals.push({ + startTime: currentIntervalStartTime.toDate(), + endTime: currentIntervalEndTime.toDate(), + }); + + // Move to the next interval + currentIntervalStartTime = currentIntervalEndTime; + } + + // Output the intervals + console.log(intervals); + + // const timeSlices = splitTime(this.getHours[0].startTime,this.getHours[0].endTime,getDuration.duration); + + + } ngOnInit(): void { this.form = new FormGroup({ - workspace: new FormControl('', [Validators.required]), }); - - + let service = localStorage.getItem("servicedetails") let serviceDetails = JSON.parse(service) - console.log(serviceDetails) - - -// this.form.controls['note'].setValue('Sample') + console.log(serviceDetails) + // this.form.controls['note'].setValue('Sample') this.form.patchValue(this.local_data) } // submit(){ @@ -53,10 +118,9 @@ export class SlotBookingDetailsComponent implements OnInit { toggleActive(event:any,param:any){ // debugger; // event.preventDefault(); - + this.slotTime = param if(this.element !== undefined){ - this.element.style.backgroundColor = "#658f9b"; - + this.element.style.backgroundColor = "#658f9b"; } var target = event.currentTarget; target.style.backgroundColor = "#0c8f00"; diff --git a/ng-seed/src/app/end-user/summary/summary.component.scss b/ng-seed/src/app/end-user/summary/summary.component.scss index 97fb7df..75a1091 100644 --- a/ng-seed/src/app/end-user/summary/summary.component.scss +++ b/ng-seed/src/app/end-user/summary/summary.component.scss @@ -5,9 +5,9 @@ border-radius: 0.5rem; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); background-color: #fff; - width: 100%; - height: 100%; - max-width: 28.5%!important; + // width: 100%; + // height: 100%; + // max-width: 28.5%!important; } .header { padding: 0rem 0.5rem 0rem 0.5rem; @@ -59,4 +59,7 @@ h6{ // margin-top: 5rem!important; // // display: none!important; // } -// } \ No newline at end of file +// } +::ng-deep body{ + background-color: #f7f8f5 !important; +} \ No newline at end of file