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 ...
随机推荐
- NFS的搭建及配置
[root@centos199 conf]# rpm -q nfs-utils rpcbind #查看这两个包是否安装,如未安装则用yum安装nfs-utils-1.2.3-39.el6.x86_64 ...
- redis的list类型!!!!
list类型 list类型是按照插入顺序排序的字符串链表,可在(left)头部和(right)尾部插入值,效率高. list增操作 若插入时,该键不存在,则会创建.若所有元素被移除,该键也会被删除. ...
- 远程window服务器,无法复制粘贴了
1.先检查本机 2.检查服务器 win+R打开输入taskmgr 找到这个进程,结束进程 3.在win+r打开输入rdpclip确认启动,发现可以复制粘贴了.
- vue和mpvue
一.mixins的理解 vue中提供了一种混合机制--mixins,用来更高效的实现组件内容的复用.最开始我一度认为这个和组件好像没啥区别..后来发现错了.下面我们来看看mixins和普通情况 ...
- LeetCode 上最难的链表算法题,没有之一!
题目来源于 LeetCode 第 23 号问题:合并 K 个排序链表. 该题在 LeetCode 官网上有关于链表的问题中标注为最难的一道题目:难度为 Hard ,通过率在链表 Hard 级别目前最低 ...
- OpenCV 初体验
个人博客原文链接 个人掘金链接 本文简单地介绍计算机图形处理的一些基本概念,以及一些有趣的例子和对应的Open CV的代码操作. 顺便说一句,恭喜IG夺冠! 一.图片存储原理 1.颜色空间RGB (1 ...
- eclipse复制粘贴变卡的解决办法
参考这个:https://www.cnblogs.com/o-andy-o/p/4108955.html
- 小程序应用的Python服务器部署高配,依然是腾讯云秒杀阿里云!
上一篇文章,“小程序创业最低配置部署,腾讯云折扣秒杀阿里云!”介绍了小程序项目启动时的最低配置服务器选择,但当项目良好发展时,还是要把服务器配置调整到标准水平,承受住日益增长的流量访问. 随着Pyth ...
- STL源码剖析-vector
STL(Standard Template Library) C++标准模板库,acm选手一定对它不陌生,除了算法,那几乎是“吃饭的家伙了”.我们使用库函数非常方便,且非常高效(相对于自己实现来说). ...
- 结对编程项目总结 by:陈宏伟&刘益
结对编程项目在欢快的国庆假期中也顺利结束了.从最初拿到结对编程项目的思考,再到一步一步实现,中间经历了一个漫长的过程.在我和队友的多次协商下,最终我们还是选择使用基于python来实现这一次结对编程项 ...