layui数据表格:时间戳转换为时间格式和添加序号列

<form>
    <input type="button" value="查询" class="btn" id="reloadTable"
	  	   style="width: 50px; height: 25px; cursor: pointer; margin-bottom: 1px;"/>
    <table id="demo" lay-filter="test"></table>
</form>

<script type="text/javascript">

var table=null;
var layer=null;
layui.use(['table','layer'], function(){
	table = layui.table,
	layer = layui.layer;
	table.render({
        elem: '#demo',
        limit: 20,    //每页显示数据条数
        height: 'auto',
        cellMinWidth: 80, //全局定义常规单元格的最小宽度
        size:'sm',
        method:'post',
        url: '',
        where:{
    	     type:$('input[name=type]').val(),
    	     createTime:$('input[name=createTime]').val()
        },
        page: true,
        cols: [[ 
                 {field:'zizeng', width:80, title: '序号',align: 'center',templet:'#zizeng'}
			 {field:'type', title: '', sort: true,align :'center'},
			 {field:'mailno', title: '',align :'center'},
			 {field:'sex', title: '', sort: true,align :'center'},
			 {field:'playmoney',title: '',align :'center'},
			 {field:'sign', title: '',align :'center'},
			 {field:'smomey', title: '', sort: true,align :'center'},
 			 {field: 'createTime', title: '', 
                        templet :function (row){
                               return createTime(row.createTime);
                        }     
              }		
        ]]
    });
    $('#reloadTable').click(function(){
		parent.layer.msg('查询中...', {icon: 16,shade: 0.3,time:700});
		table.reload('demo',{
			page: {
			    curr: 1 
			}
			,where:{
				 type:$('input[name=type]').val(),
    	                     createTime:$('input[name=createTime]').val()
		    }
		});
	}); 
});


//时间转换
function createTime(v){
	var date = new Date(v);
    var y = date.getFullYear();
    var m = date.getMonth()+1;
    m = m<10?'0'+m:m;
    var d = date.getDate();
    d = d<10?("0"+d):d;
    var h = date.getHours();
    h = h<10?("0"+h):h;
    var M = date.getMinutes();
    M = M<10?("0"+M):M;
    var str = y+"-"+m+"-"+d+" "+h+":"+M;
    return str;
}
</script>

//序号自增
<script type="text/html" id="zizeng">
    {{d.LAY_TABLE_INDEX+1}}
</script>

本博客转载自:https://blog.csdn.net/qq_26173219/article/details/79709644

在原博主的基础上,我添加了:序号自增,自主定义每页显示数据数,单元格的最小宽度,数据查询功能。

猜你喜欢

转载自blog.csdn.net/weixin_40106067/article/details/81353580
今日推荐