iview render Datepicker 起止时间限制
{
title: '开始时间',
key: 'planDateFrom',
minWidth: 120,
sortable: true,
align: 'center',
render: (h, params) => {
return h('DatePicker', {
props: {
value: params.row.planDateFrom,
type: 'datetime',
format:"yyyy-MM-dd HH:mm:ss",
editable: false,
transfer: true,
options: {
disabledDate: (date) => {
if (params.row.planDateTo) {
return date && date.valueOf() > new Date(params.row.planDateTo).valueOf();
};
if (!params.row.planDateFrom) {
return false;
};
}
}
},
style: {
width: '100%'
},
on: {
'on-change': (e) => {
if (e) {
params.row.planDateFrom = e;
this.tableData[params.index] = params.row;
} else {
params.row.planDateFrom = ''; // 必须有各种判断,否则清空时无法解除之前的禁用
this.tableData[params.index] = params.row;
};
}
}
});
}
},
{
title: '结束时间',
key: 'planDateTo',
minWidth: 120,
sortable: true,
align: 'center',
render: (h, params) => {
return h('DatePicker', {
props: {
value: params.row.planDateTo,
type: 'datetime',
format:"yyyy-MM-dd HH:mm:ss",
editable: false,
transfer: true,
options: {
disabledDate: (date) => {
if (params.row.planDateFrom) {
return date && date.valueOf() < new Date(params.row.planDateFrom).valueOf();
}
if (!params.row.planDateTo) { // 不存在时,取消禁用
return false;
};
}
}
},
style: {
width: '100%'
},
on: {
'on-change': (e) => {
if (e) {
params.row.planDateTo = e;
this.tableData[params.index] = params.row;
} else {
params.row.planDateTo = '';
this.tableData[params.index] = params.row;
};
}
}
});
}
},
iview render Datepicker 起止时间限制的更多相关文章
- iview datepicker 选择的时间少一天
使用iview的datepicker时间选择器发现获取的value值是比实际要少一天,严格来说应该是时间格式不一样,datepicker获取的时间是UTC时间格式,也就是:yyyy-MM-ddTHH: ...
- C#根据当前时间获取周,月,季度,年度等时间段的起止时间
最近有个统计分布的需求,需要按统计本周,上周,本月,上月,本季度,上季度,本年度,上年度等时间统计分布趋势,所以这里就涉及到计算周,月,季度,年度等的起止时间了,下面总结一下C#中关于根据当前时间获取 ...
- iview render bug & vue namespace bug
iview render bug https://codepen.io/xgqfrms/pen/gyGjKP https://codepen.io/xgqfrms/full/gyGjKP bug &l ...
- DatePicker日期与时间控件
DatePicker日期与时间控件 一.简介 二.方法 最日常的使用方法了 日期控件DatePicker 时间控件TimePicker 月份从0开始 三.代码实例 效果图: 代码: fry.Activ ...
- 为Redmine的项目加上起止时间
没有时间约束的项目不是好项目. 要给项目配置起止时间,须要用到自己定义属性. 我们须要管理员身份登录.才干够定义自己定义属性. 自己定义属性 看图吧,先是点击页面导航条(最上面那排菜单,有主页.我的工 ...
- vue iview render里面 没有双向绑定 renderHeader 要序列化 反序列 一下
vue iview render里面 没有双向绑定 renderHeader 要序列化 反序列 一下 renderHeader: (h, params) => { return [ h('Rad ...
- iview组件DatePicker type="datetimerange绑定初始默认时间值
使用::value="[this.startTime,this.endTime]",绑定当天时间 如下: <DatePicker type="datetimeran ...
- Ant Design 通过 WeekPicker 获取一周的起止时间
项目中遇到了选择日期获取当前日期一周的周一和周日的日期,如下: 项目使用的是 ant design,所以第一时间想到了 DatePicker 中的 WeekPicker 组件,查询文档得到 WeekP ...
- iView之DatePicker的datetimerange校验
使用DatePicker的type是datetimerange时,处理开始--结束的持续时间校验如下.遇到的问题:时间弹出校验提示,但是程序还是会继续往下走,所以调完校验后,再做判断开始时间是否为tr ...
随机推荐
- Hadoop系列007-HDFS客户端操作
title: Hadoop系列007-HDFS客户端操作 date: 2018-12-6 15:52:55 updated: 2018-12-6 15:52:55 categories: Hadoop ...
- 在macos上基于python2.7安装PyQt5
在python3上面安装PyQt5是十分简单的,可是,在python2.7上安装这个东西,着实让人折腾了一把.要总结一下,年纪大了,记性不好. 首先要安装最新版的Qt和python2,命令如下: br ...
- 【重学计算机】机组D4章:存储系统
1. 存储系统层次结构 主存速度缓慢的原因:主存增速与CPU不同步,执行指令期间多次访问主存 主存容量不足的原因: 存在制约主存容量的技术因素:如由CPU.主板等相关技术指标规定了主存容量 应用对主存 ...
- Locust性能测试学习总结
Locust学习总结分享 简介: Locust是一个用于可扩展的,分布式的,性能测试的,开源的,用Python编写框架/工具,它非常容易使用,也非常好学.它的主要思想就是模拟一群用户将访问你的网站.每 ...
- ubuntu上配置nginx实现反向代理
反向代理 反向代理(Reverse Proxy)方式是指以代理服务器来接受internet上的连接请求,然后将请求转发给内部网络上的服务器,并将从服务器上得到的结果返回给internet上请求连接的客 ...
- Flink从入门到放弃(入门篇2)-本地环境搭建&构建第一个Flink应用
戳更多文章: 1-Flink入门 2-本地环境搭建&构建第一个Flink应用 3-DataSet API 4-DataSteam API 5-集群部署 6-分布式缓存 7-重启策略 8-Fli ...
- 微信公众号开发C#系列-1、微信公众平台注册
微信公众号简介 微信公众号分为服务号.订阅号.企业号,订阅号可以个人申请,服务号和企业号要有企业资质才可以. 我们所说的微信公众号开发主要指的是公众号的账号类型,公众号的账号类型分为订阅号.服务号.企 ...
- git使用教程指南
前言 Git是一个开源的分布式版本控制系统.其核心就在于版本控制. 在实际编码过程中,我们往往会忘记上次对文件的修改内容.若是刚刚修改的还好说,撤销操作即可.但若这是你昨天做的修改并关闭了IDE呢 ...
- 第一册:lesson 119.
原文: A true story. question:Who called out to the thieves in the dark? Do you like stories? I want to ...
- 【spring实战第五版遇到的坑】3.1中的例子报错
按照书中的例子,一直做到第3.1章使用JDBC读写数据时,在提交设计的taco表单时,报了如下的异常信息: Failed to convert property value of type java. ...