当前位置: 首页 > Web前端 > vue.js

element-uiel-date-picker时间日期组件设置时间日期范围,1

时间:2023-03-31 17:02:26 vue.js

时间日期选择器网络地址into_user_storage_time:'2022-01-1220:05:04',//原时间值new_into_user_storage_time:'时间日期选择器选择时间',//新的日期时间绑定值需要当前时间>newThetimeanddate>原始时间值使用插件"moment":"2.24.0"//时间插件(也可以不用,自己转换时间格式比较麻烦)注意:picker-options的disabledDate只能设置dateRange设置时间范围需要使用selectableRangeHTMLjsdata(){return{pickerOptions:{},//字段:{into_user_storage_time:'',//原始时间值new_into_user_storage_time:'',//新日期时间绑定值}};},watch:{//深度监控字段field:{//设置时间范围handler:function(val){让时间=val.new_into_user_storage_time;//获取-新时间的值-if(time){letoldTime=this.handleData.data.into_user_storage_time.split('');//处理原始时间值letnewTime=time.split('');//处理新的时间值letmoment=this.$moment().format('YYYY-MM-DDHH:mm:ss').split('');//处理当前时间值letselectableRange=oldTime[1]+'-23:59:59';//设置默认可选时间段if(newTime[0]!=oldTime[0]){//如果新时间(当前选择的时间)与原时间不是一天,则全天时间可选selectableRange='00:00:00-23:59:59';}if(moment[0]==newTime[0]){//如果新的时间(当前选中的时间)和当前时间是一天,那么可选时间是从0:00到现在的时间selectableRange='00:00:00-'+时刻[1];}this.$set(//setsetpickerOptions,用于重新渲染页面this.pickerOptions,'selectableRange',selectableRange);}},deep:true}},methods:{getPickerOptions(){//只能设置日期范围lettimeArr=this.handleData.data.into_user_storage_time.split('');//将接收到的数据原始时间值处理成_user_storage_timeletbeforeTime=newDate(timeArr[0]).getTime();//获取原始时间值-日期-时间戳letmoment=this.$moment().format('YYYY-MM-DD');//获取当前日期值moment=newDate(moment).getTime();//获取当前日期值的时间戳letdisabledDate=time=>{//picker-options的参数(设置为日期范围)//禁用日期时间-日期值lettimes=time.getTime()+8*60*60*1000;//默认newDate是08:00出来的,而momentplugin是00:00,所以做了如下处理returntimes时刻;//所有不符合要求的时间都禁用};this.pickerOptions={disabledDate};//最后赋值},handleDefaultTime(){//设置时间日期选择器的默认值,默认当前时间letmoment=this.$moment().format('YYYY-MM-DDHH:mm:ss');//获取当前时间letoldTime=this.$moment(this.handleData.data.into_user_storage_time).format('YYYY-MM-DDHH:mm:ss');//转换原时间值格式if(newDate(oldTime).getTime()>newDate(moment).getTime()){//增加了容错,如果原时间大??于当前时间,默认为初始时间,否则为当前时间时间this.field.new_into_user_storage_time=oldTime;}else{this.field.new_into_user_storage_time=moment;}},},