From a973040ec6b1d92b1440132d77fe41072585c1a0 Mon Sep 17 00:00:00 2001
From: Mila <Mila@pollex.com.tw>
Date: 星期六, 22 一月 2022 11:40:46 +0800
Subject: [PATCH] fixed TODO#134578 約訪通知 : 預計約訪時段不可選擇過去時間
---
PAMapp/components/Ui/UiTimePicker.vue | 69 ++++++++++++++++++++++++++++++----
1 files changed, 61 insertions(+), 8 deletions(-)
diff --git a/PAMapp/components/Ui/UiTimePicker.vue b/PAMapp/components/Ui/UiTimePicker.vue
index 6803eae..b661e00 100644
--- a/PAMapp/components/Ui/UiTimePicker.vue
+++ b/PAMapp/components/Ui/UiTimePicker.vue
@@ -19,14 +19,17 @@
@Component
export default class UiTimePicker extends Vue {
timeValue = '';
- pickerOptions = {
- start: '09:00',
- step: '00:15',
- end: '21:00'
- }
@Prop()
defaultValue!: string;
+
+ @Prop({default: ''})
+ changeDate!: Date | string;
+
+ @Prop()
+ isPastDateDisabled!: boolean;
+
+ ///////////////////////////////////////////////////////////////////////
@Emit('changeTime')
changeTime() {
@@ -36,11 +39,61 @@
@Watch('defaultValue', {immediate: true})
updateDefault() {
if (this.defaultValue) {
- const hours = new Date(this.defaultValue).getHours();
- const minutes = new Date(this.defaultValue).getMinutes();
- this.timeValue = `${hours < 10 ? '0' + hours : hours}:${minutes < 10 ? '0' + minutes : minutes}`;
+ const defaultDate = new Date(this.defaultValue);
+ this.timeValue = this.formatTimeString(defaultDate);
this.changeTime();
}
}
+
+ ///////////////////////////////////////////////////////////////////////
+
+ get pickerOptions() {
+ let minTime = '';
+ const currentDate = new Date();
+
+ if (this.isPastDateDisabled && this.changeDate && this.isPickedToday(currentDate)) {
+ minTime = this.formatTimeString(currentDate);
+ this.isPickedDisableTime(currentDate, minTime);
+ }
+
+ return {
+ start: '09:00',
+ step: '00:15',
+ end: '21:00',
+ minTime: minTime
+ }
+ }
+
+ private isPickedDisableTime(currentDate: Date, minTime: string) {
+ const currentTime = this.getTimeValue(currentDate, minTime);
+ const pickedTime = this.getTimeValue(currentDate, this.timeValue);
+ if (pickedTime < currentTime) {
+ this.timeValue = '';
+ this.changeTime();
+ }
+ }
+
+ private isPickedToday(currentDate: Date) {
+ const pickedDate = new Date(this.changeDate);
+ const today = this.formatDateString(currentDate);
+ const picked = this.formatDateString(pickedDate);
+ return today === picked;
+ }
+
+ private getTimeValue(date: Date, time: string) {
+ const hour = time.split(':')[0];
+ const minute = time.split(':')[1];
+ return date.setHours(+hour, +minute);
+ }
+
+ private formatDateString(date: Date) {
+ return `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`;
+ }
+
+ private formatTimeString(date: Date) {
+ const hours = date.getHours();
+ const minutes = date.getMinutes();
+ return `${hours < 10 ? '0' + hours : hours}:${minutes < 10 ? '0' + minutes : minutes}`;
+ }
}
</script>
\ No newline at end of file
--
Gitblit v1.8.0