保誠-保戶業務員媒合平台
jack
2023-08-08 54e0b9707bb34259dfccbe0c792b50e12b267e13
PAMapp/components/DateTimePicker.vue
@@ -2,18 +2,42 @@
<template>
    <div class="dateTime">
        <UiDatePicker @changeDate="changeDateTime($event, 'date')"></UiDatePicker>
        <UiTimePicker @changeTime="changeDateTime($event, 'time')"></UiTimePicker>
        <UiDatePicker
            @changeDate="changeDateTime($event, 'date')"
            :disabledBeforeSpecificDate="disabledBeforeSpecificDate"
            :isPastDateDisabled="isPastDateDisabled"
            :isFutureDateDisabled="isFutureDateDisabled"
            :defaultValue="defaultValue"
        ></UiDatePicker>
        <UiTimePicker
            @changeTime="changeDateTime($event, 'time')"
            :defaultValue="defaultValue"
            :isPastDateDisabled="isPastDateDisabled"
            :isFutureDateDisabled="isFutureDateDisabled"
            :changeDate="changeDate"
        ></UiTimePicker>
    </div>
</template>
<script lang="ts">
import { Component, Emit, Vue } from "nuxt-property-decorator";
import { Component, Emit, Prop, Vue, Watch } from "nuxt-property-decorator";
@Component
export default class DateTimePicker extends Vue {
    changeDate!: Date;
    changeDate: Date | string = '';
    changeTime!: string;
    @Prop()
    defaultValue!: string;
    @Prop()
    isPastDateDisabled!: boolean;
    @Prop()
    isFutureDateDisabled!: boolean;
    @Prop()
    disabledBeforeSpecificDate?: string;
    @Emit('changeDateTime')
    changeDateTime(event, type) {
@@ -24,12 +48,14 @@
            this.changeTime = event;
        }
        if (this.changeDate && this.changeTime) {
            const timeArray = this.changeTime.split(':');
            const interViewTime = this.changeDate.setHours(+timeArray[0], +timeArray[1]);
            const hour = this.changeTime.split(':')[0];
            const minute = this.changeTime.split(':')[1];
            const interViewTime = new Date(this.changeDate).setHours(+hour, +minute);
            return new Date(interViewTime);
        }
        return '';
    }
}
</script>
@@ -40,4 +66,4 @@
    justify-content: space-between;
    font-size: 20px;
}
</style>
</style>