写点什么

layui 使用 templet 格式化表格数据

用户头像
关注
发布于: 2021 年 03 月 30 日
layui使用templet格式化表格数据

我们在使用 layui 经常会碰到后台传到前台需要格式化的数据,在表单处需要格式化,此时我们需要怎么做,看下面简单方便。

1.增加 js 格式化时间校验,自动格式化后台传输的时间格式
/---------------------格式化时间开始--------------------------/
//对Date的扩展,将 Date 转化为指定格式的String
//月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符,
//年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字)
//例子:
//(new Date()).Format("yyyy-MM-dd hh:mm:ss.S") ==> 2006-07-02 08:09:04.423
//(new Date()).Format("yyyy-M-d h:m:s.S") ==> 2006-7-2 8:9:4.18
Date.prototype.Format = function (fmt) { //author: meizz
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"h+": this.getHours(), //小时
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt))
fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
for (var k in o)
if (new RegExp("(" + k + ")").test(fmt))
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
return fmt;
}
var date = new Date();
/---------------------格式化时间结束--------------------------/
复制代码
2.在单元格使用函数格式化时间,格式化字段列-创建时间
cols: [[
{ type: 'numbers', title: '序号', width: 50 },
{ type: 'checkbox' },
{ field: 'BILL_NO', title: '单据编码', width: 230, },
{
field: 'BIZ_STATUS', title: '单据状态', templet: function (d) {
return getDictName('COMBIZSTATUS', d.BIZ_STATUS);
}, width: 100,
},
{ field: 'RETURNMSGCODE', title: '状态', width: 100, },
{ field: 'UNIT_NAME', title: '创建组织', width: 100, },
{ field: 'BUSINTYPEITEM_NAME', title: '业务类别', width: 230, },
{ field: 'TITLE', title: '申请单标题', width: 280, },
{ field: 'CREATEBYNAME', title: '创建人姓名', width: 130, },
{
field: 'GMT_CREATE', title: '创建时间', sort: false, templet: function (d) {
date.setTime(d.GMT_CREATE);
return date.Format("yyyy-MM-dd hh:mm:ss");
}, width: 130,
},
{ field: 'RETURN_MSG', title: '传输云超市返回信息', width: 400, },
]],
复制代码
3.格式化创建时间,格式化单据状态直接调用 function 的方法返回对应的显示值,到此格式化数据格式已完成。确实非常简单方便,此格式适用于前端格式化数据,需要的自取



发布于: 2021 年 03 月 30 日阅读数: 12
用户头像

关注

还未添加个人签名 2021.03.26 加入

还未添加个人简介

评论

发布
暂无评论
layui使用templet格式化表格数据