From dd2d2ec09a0b6d9a602cea5f7c5caf41b0396286 Mon Sep 17 00:00:00 2001 From: Tomas <tomasysh@gmail.com> Date: 星期一, 31 七月 2023 08:26:27 +0800 Subject: [PATCH] Merge branch '2023_CR2' of https://dev.pollex.com.tw:8443/r/pcalife/PAM into 2023_CR2 --- PAMapp/components/Ui/UiDatePicker.vue | 51 ++++++++++++++++++++++++++++++++++++++++++++++++--- 1 files changed, 48 insertions(+), 3 deletions(-) diff --git a/PAMapp/components/Ui/UiDatePicker.vue b/PAMapp/components/Ui/UiDatePicker.vue index 8752761..890c5ec 100644 --- a/PAMapp/components/Ui/UiDatePicker.vue +++ b/PAMapp/components/Ui/UiDatePicker.vue @@ -5,16 +5,18 @@ v-model="dateValue" :clearable="false" type="date" + :editable="false" format="yyyy/MM/dd" placeholder="������" - prefix-icon="icon-down" + prefix-icon="icon-down down-icon" + :picker-options="pickerOptions" @change="changeDate" > </el-date-picker> </template> <script lang="ts"> -import { Component, Emit, Prop, Vue, Watch } from "nuxt-property-decorator"; +import { Component, Emit, Prop, PropSync, Vue, Watch } from "nuxt-property-decorator"; @Component export default class UiDatePicker extends Vue { @@ -22,6 +24,15 @@ @Prop() defaultValue!: string; + + @Prop({default: false}) + isPastDateDisabled!: boolean; + + @Prop({default: false}) + isFutureDateDisabled!: boolean; + + @Prop() + disabledBeforeSpecificDate?: string; @Emit('changeDate') changeDate() { @@ -35,5 +46,39 @@ this.changeDate(); } } + + get pickerOptions() { + const date = new Date(); + const currentDate = `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`; + + if (!!this.disabledBeforeSpecificDate) { + const compareDate = new Date(this.disabledBeforeSpecificDate); + return { + disabledDate(time: Date) { + const pickedDate = `${time.getFullYear()}/${time.getMonth() + 1}/${time.getDate()}`; + return new Date(pickedDate).getTime() < compareDate.getTime(); + } + } + } + + if (this.isPastDateDisabled) { + return { + disabledDate(time: Date) { + const pickedDate = `${time.getFullYear()}/${time.getMonth() + 1}/${time.getDate()}`; + return new Date(pickedDate).getTime() < new Date(currentDate).getTime(); + } + } + } + + if (this.isFutureDateDisabled) { + return { + disabledDate(time: Date) { + const pickedDate = `${time.getFullYear()}/${time.getMonth() + 1}/${time.getDate()}`; + return new Date(pickedDate).getTime() > new Date(currentDate).getTime(); + } + } + } + } + } -</script> \ No newline at end of file +</script> -- Gitblit v1.8.0