Layui table field显示动态倒计时时间差,如何实现。
当出库时间outtime为空时,将接收时间receivetime+6小时-当前实时时间得到动态的倒计时(例如"倒计时:5.5小时")。当出库时间不为空时,用出库时间-接收时间,得到时效。
```java
可参考如下:
layui.use(['table', 'util'], function(){
var table = layui.table;
var laydate = layui.laydate;
var form = layui.form;
var $ = layui.jquery;
var util = layui.util //时间戳转日期格式
var tableIns = table.render({
elem: '#test'
,url: '.ordder.php' //数据接口
,toolbar:'#toolbarDemo'
,loading:true
,height:'full-20'
,skin:''
,size:''
,page: true //开启分页
,cols: [[ //表头
{type: 'checkbox', fixed: 'left',align:'center' ,width:'80'}
,{field: 'id', fixed: 'left',title: 'ID', width:'80', sort: false ,align:'center'}
,{field: 'receivetime', title: '接单时间', width: '150',align:'center'}
,{field: 'outtime', title: '出库时间', width: '150',align:'center'}
,{field: 'shixiao',fixed:'right', title: '时效(H)', width: '80',align:'center', templet: d => {
if (!d.outtime) {
let nowTime = new Date(); // 获取当前时间
let receivetime = new Date((new Date(d.receivetime)).getHours() + 6); // 接收时间receivetime+6小时
let dateDiff = nowTime.getTime() - receivetime.getTime(); // 计算接收时间receivetime+6小时-当前实时时间
let dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000)); // 计算出相差天数
let leave1=dateDiff%(24*3600*1000) //计算天数后剩余的毫秒数
let hours=Math.floor(leave1/(3600*1000))//计算出小时数
hours = dayDiff * 24 + hours;
let leave2=leave1%(3600*1000) //计算小时数后剩余的毫秒数
let minutes=Math.floor(leave2/(60*1000)) // 计算相差分钟数
if (minutes > 30) hours += ".5";
return "倒计时:" + hours
} else {
let outtime = newDate(d.outtime);
let receivetime = new Date(d.receivetime);
let dateDiff = outtime.getTime() - receivetime.getTime(); // 计算接收时间receivetime+6小时-当前实时时间
let dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000)); // 计算出相差天数
let leave1=dateDiff%(24*3600*1000) //计算天数后剩余的毫秒数
let hours=Math.floor(leave1/(3600*1000))//计算出小时数
hours = dayDiff * 24 + hours;
let leave2=leave1%(3600*1000) //计算小时数后剩余的毫秒数
let minutes=Math.floor(leave2/(60*1000)) // 计算相差分钟数
if (minutes > 30) hours += ".5";
return "时效:" + hours
}
}}
//如何利用templet,当出库时间为空时,将接收时间+6小时-当前实时时间得到动态的倒计时(例如5.5小时)。当出库时间不为空时,用出库时间-接收时间,得到时效。
,{fixed: 'right', title: '操作',toolbar: '#operation',align:'center', width: '110'}
]]
,where:{
}
, page: {layout: ['prev', 'page', 'next', 'skip', 'count', 'limit', 'refresh']} //page false
, limits: [50,100,150,200,250,300,350,400,450,500]
, limit: 50 //每页默认显示的数量
});
不知道你这个问题是否已经解决, 如果还没有解决的话: