{
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 起止时间限制的更多相关文章

  1. iview datepicker 选择的时间少一天

    使用iview的datepicker时间选择器发现获取的value值是比实际要少一天,严格来说应该是时间格式不一样,datepicker获取的时间是UTC时间格式,也就是:yyyy-MM-ddTHH: ...

  2. C#根据当前时间获取周,月,季度,年度等时间段的起止时间

    最近有个统计分布的需求,需要按统计本周,上周,本月,上月,本季度,上季度,本年度,上年度等时间统计分布趋势,所以这里就涉及到计算周,月,季度,年度等的起止时间了,下面总结一下C#中关于根据当前时间获取 ...

  3. iview render bug & vue namespace bug

    iview render bug https://codepen.io/xgqfrms/pen/gyGjKP https://codepen.io/xgqfrms/full/gyGjKP bug &l ...

  4. DatePicker日期与时间控件

    DatePicker日期与时间控件 一.简介 二.方法 最日常的使用方法了 日期控件DatePicker 时间控件TimePicker 月份从0开始 三.代码实例 效果图: 代码: fry.Activ ...

  5. 为Redmine的项目加上起止时间

    没有时间约束的项目不是好项目. 要给项目配置起止时间,须要用到自己定义属性. 我们须要管理员身份登录.才干够定义自己定义属性. 自己定义属性 看图吧,先是点击页面导航条(最上面那排菜单,有主页.我的工 ...

  6. vue iview render里面 没有双向绑定 renderHeader 要序列化 反序列 一下

    vue iview render里面 没有双向绑定 renderHeader 要序列化 反序列 一下 renderHeader: (h, params) => { return [ h('Rad ...

  7. iview组件DatePicker type="datetimerange绑定初始默认时间值

    使用::value="[this.startTime,this.endTime]",绑定当天时间 如下: <DatePicker type="datetimeran ...

  8. Ant Design 通过 WeekPicker 获取一周的起止时间

    项目中遇到了选择日期获取当前日期一周的周一和周日的日期,如下: 项目使用的是 ant design,所以第一时间想到了 DatePicker 中的 WeekPicker 组件,查询文档得到 WeekP ...

  9. iView之DatePicker的datetimerange校验

    使用DatePicker的type是datetimerange时,处理开始--结束的持续时间校验如下.遇到的问题:时间弹出校验提示,但是程序还是会继续往下走,所以调完校验后,再做判断开始时间是否为tr ...

随机推荐

  1. 栈到CLR

    提起栈想必会听到这样几个关键词:后进先出,先进后出,入栈,出栈. 栈这种数据结构,数组完全可以代替其功能. 但是存在即是真理,其目的就是避免暴漏不必要的操作. 如角色一样,不同的情景或者角色拥有不同的 ...

  2. @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件

    目录 @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件 运行 使用 配置 svg-sprite-loader 调用当前环境下的颜色 props @vue/cl ...

  3. springboot + redis(单机版)

    本次和大家分享的是在springboot集成使用redis,这里使用的是redis的jedis客户端(这里我docker运行的redis,可以参考 docker快速搭建几个常用的第三方服务),如下添加 ...

  4. dmidecode的Python解析

    #!/usr/bin/env python # -*- coding: utf-8 -*- """ 解析dmidecode命令输出结果,返回JSON格式数据 测试服务器D ...

  5. Asp.Net进程外Session(状态服务器Session、数据库Session)

    介绍 我们知道,当浏览器关闭,或者网站重启的时候,会话就结束了.即Seesion就丢失了.(当Web.config配置文件改动,哪怕什么内容都不加,仅仅往配置文件中加一个空格都是改we.config变 ...

  6. word中如何只修改英文的颜色

    替换->更多->使用通配符,查找[a-zA-Z],替换为^&,字体选红色

  7. Python编程从入门到实践笔记——变量和简单数据类型

    Python编程从入门到实践笔记——变量和简单数据类型 #coding=gbk #变量 message_1 = 'aAa fff' message_2 = 'hart' message_3 = &qu ...

  8. GraphQL学习过程应该是这样的

    记录一个从枯燥学习 GraphQL 的过程,到发现项目 Gitter,模仿项目 Github-Trending-API,最后做一个自己的学习项目 Github-Trending-GraphQL. 一开 ...

  9. CAD.NET二次开发 新建图层 删除图层 指定图层颜色以及线形等

    基于浩辰CAD 2019测试 功能实现 直接上代码: [CommandMethod("CreateAndAssignAlayer")] //新建图层 然后添加到图层表里 publi ...

  10. httpclient绕过证书验证进行HTTPS请求

    http请求是我们常用的一种web应用的应用层协议,但是由于它的不安全性,现在正在逐渐向https协议过渡.https协议是在http的基础上进行了隧道加密,加密方式有SSL和TLS两种.当serve ...