LAYUI使用动态表格时,给列追加template,自定义当前列的图标、背景色等

LAYUI使用动态表格时,给列追加template,自定义当前列的图标、背景色等

让STATUS针对不同状态时有个不同的背景色

table.render({
		elem: '#getdata',
		url: '/index.php?s=/index/user/borrower_list',
		page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档
			layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
			//,curr: 5 //设定初始在第 5 页
			,
			groups: 1 //只显示 1 个连续页码
			,
			first: false //不显示首页
			,
			last: false //不显示尾页

		},
		done: function (res, curr, count) {
			console.log(res);
			if (res.status == 200) {
				$("#getdata")
					.css('display', 'block');
				$("#empty")
					.css('display', 'none');
			} else {
				$("#getdata")
					.css('display', 'none');
				$("#empty")
					.css('display', 'block');
			}
			$(".layui-laypage-count")
				.html('ALL ' + count + ' ');

		},
		toolbar: '#toolbarDemo' //开启头部工具栏,并为其绑定左侧模板
		,
		defaultToolbar: ['filter', 'exports', 'print'],
		title: 'export_data',
		cols: [
			[{
				type: 'checkbox',
				fixed: 'left'
			},
			{
				field: 'borrower_id',
				width: 80,
				title: 'ID',
				sort: true
			}, {
				field: 'borrower_truename',
				width: 120,
				title: 'NAME'
			}, {
				field: 'borrower_phone',
				width: 100,
				title: 'PHONE'
			}, {
				field: 'borrower_email',
				width: 120,
				title: 'EMAIL'
			}, {
				field: 'borrower_purpose',
				title: 'PURPOSE',
				minWidth: 150
			}, {
				field: 'borrower_status_text',
				width: 100,
				title: 'STATUS',
				sort: true,
				templet: function(d){
					console.log(d);
					if 	(d.borrower_status == '1') {
						return '<span class="layui-badge layui-bg-orange">' + d.borrower_status_text+'</span>';
					} else if (d.borrower_status == '2') {
						return '<span class="layui-badge layui-bg-green">' + d.borrower_status_text+'</span>';
					} else if (d.borrower_status == '3') {
						return '<span class="layui-badge layui-bg-blue">' + d.borrower_status_text+'</span>';
					} 
				  }
				
			}, {
				field: 'borrower_addtime',
				width: 170,
				title: 'TIME',
				sort: true
			}, {
				fixed: 'right',
				title: 'ACTION',
				toolbar: '#barDemo',
				width: 150
			}
				//, { field: 'borrower_addip', width: 100, title: 'IP', sort: true }


			]
		]

	});

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

乐畅

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值