Vue-ElmentUI开始日期与结束日期约束

it2024-04-08  48

html:

<tr> <td> <span class="demonstration">开始时间:</span> <el-select v-model="startTime" placeholder="开始时间" > <el-option v-for="starttimeselect in meetingStartResponseVO.timeperiodOutVO.meetingTimePeriodVO" :key="starttimeselect.id" v-bind:label="starttimeselect.startTime" v-bind:value="starttimeselect.id"></el-option> </el-select> </td> </tr> <tr> <td> <span class="demonstration">结束时间:</span> <el-select v-model="endTime" placeholder="结束时间" name="" > <div v-for="endtimeselect in meetingStartResponseVO.timeperiodOutVO.meetingTimePeriodVO" :key="endtimeselect.id "> <el-option v-if="endtimeselect.id<startTime" v-bind:label="endtimeselect.endTime" v-bind:value="endtimeselect.id" disabled></el-option> <el-option v-if="endtimeselect.id>=startTime" v-bind:label="endtimeselect.endTime" v-bind:value="endtimeselect.id" ></el-option> </div> </el-select> </td> </tr>

ts:

data(){ return{ pickerOptionsStart: { disabledDate: (time: any) => { if (this.enddate) { return (time.getTime() > new Date(this.enddate).getTime()) || (time.getTime() < new Date(this.enddate).getTime() - 86400000*365) } } }, pickerOptionsEnd: { disabledDate: (time: any) => { if (this.startdate) { return (time.getTime() < new Date(this.startdate).getTime() - 86400000)|| (time.getTime() > new Date(this.startdate).getTime() + 86400000*365) } } },} }
最新回复(0)