refactor(order): 优化订单列表页面布局和样式
-调整表格结构,优化列宽设置 - 移除冗余代码,提高代码可读性- 添加自定义样式,提升页面美观度
This commit is contained in:
parent
a6216a09e1
commit
efbcad2ff5
@ -14,7 +14,6 @@
|
|||||||
{include file='order/index_search'}
|
{include file='order/index_search'}
|
||||||
|
|
||||||
{include file='order/statement'}
|
{include file='order/statement'}
|
||||||
|
|
||||||
<table id="OrderList" data-target-search="form.form-search"></table>
|
<table id="OrderList" data-target-search="form.form-search"></table>
|
||||||
</div>
|
</div>
|
||||||
{/block}
|
{/block}
|
||||||
@ -153,16 +152,11 @@
|
|||||||
// 动态创建 layui.table 表格
|
// 动态创建 layui.table 表格
|
||||||
$('#OrderList').layTable({
|
$('#OrderList').layTable({
|
||||||
|
|
||||||
|
|
||||||
url: '{:sysuri()}',
|
url: '{:sysuri()}',
|
||||||
toolbar: '#toolbarDemo',
|
toolbar: '#toolbarDemo',
|
||||||
|
|
||||||
// console: console.log(),
|
// console: console.log(),
|
||||||
|
|
||||||
where: {set_callback: set_callback},
|
where: {set_callback: set_callback},
|
||||||
// totalRow: true, // 开启合计行
|
// totalRow: true, // 开启合计行
|
||||||
|
|
||||||
|
|
||||||
even: true, height: 'full',
|
even: true, height: 'full',
|
||||||
sort: {field: 'id', type: 'desc'},
|
sort: {field: 'id', type: 'desc'},
|
||||||
// className:'layTab',
|
// className:'layTab',
|
||||||
@ -171,12 +165,12 @@
|
|||||||
limits: [10, 20, 30, 50, 60, 70, 80, 90, 100, 150, 200, 500],
|
limits: [10, 20, 30, 50, 60, 70, 80, 90, 100, 150, 200, 500],
|
||||||
|
|
||||||
cols: [[
|
cols: [[
|
||||||
{checkbox: true, field: 'id', fixed: 'left'},
|
{checkbox: true, field: 'id', fixed: 'left',width: 60},
|
||||||
// {field: 'index', title: '序号', width: 70, sort: true, align: 'center', fixed: 'left',totalRow: '合计:'},
|
// {field: 'index', title: '序号', width: 70, sort: true, align: 'center', fixed: 'left',totalRow: '合计:'},
|
||||||
{field: 'index', title: '序号', width: 70, sort: true, align: 'center', fixed: 'left'},
|
{field: 'index', title: '序号', sort: true, align: 'center', fixed: 'left',width: 60},
|
||||||
|
|
||||||
{
|
{
|
||||||
field: 'minfo', title: '商户', minWidth: 100, fixed: 'left', templet: function (d) {
|
field: 'minfo', title: '商户', fixed: 'left', templet: function (d) {
|
||||||
// console.log(d);
|
// console.log(d);
|
||||||
d.d_msg = '<b>{{d.minfo.name}}</b>( <span class="color-desc">{{d.minfo.id}}</span> )';
|
d.d_msg = '<b>{{d.minfo.name}}</b>( <span class="color-desc">{{d.minfo.id}}</span> )';
|
||||||
if (d.minfo.status === 0) {
|
if (d.minfo.status === 0) {
|
||||||
@ -204,7 +198,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'order', title: '订单号', minWidth: 270, fixed: 'left', templet: function (d) {
|
field: 'order',minWidth:240,title: '订单号',fixed: 'left', templet: function (d) {
|
||||||
d.one = '<span class="layui-badge think-bg-blue">系</span>';
|
d.one = '<span class="layui-badge think-bg-blue">系</span>';
|
||||||
d.green = '<span class="layui-badge layui-bg-green">商</span>';
|
d.green = '<span class="layui-badge layui-bg-green">商</span>';
|
||||||
d.d_msg = '{{-d.one}}<b>{{d.order_id}}</b>';
|
d.d_msg = '{{-d.one}}<b>{{d.order_id}}</b>';
|
||||||
@ -220,7 +214,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'account', title: '充值账号', align: 'center', minWidth: 150, templet: function (d) {
|
field: 'account', title: '充值账号', align: 'center', templet: function (d) {
|
||||||
|
|
||||||
d.d_msg = '<b>{{d.account}}</b>';
|
d.d_msg = '<b>{{d.account}}</b>';
|
||||||
if (d.product_key === 'dhcz' && d.isp > 0) {
|
if (d.product_key === 'dhcz' && d.isp > 0) {
|
||||||
@ -242,7 +236,7 @@
|
|||||||
// {field: 'merchant_order_id', title: '系统订单号', minWidth: 120},
|
// {field: 'merchant_order_id', title: '系统订单号', minWidth: 120},
|
||||||
// {field: 'account', title: '充值账号',},
|
// {field: 'account', title: '充值账号',},
|
||||||
{
|
{
|
||||||
field: 'cash', title: '总面值', align: 'center', minWidth: 120, templet: function (d) {
|
field: 'cash', title: '总面值', align: 'center', templet: function (d) {
|
||||||
|
|
||||||
if (d.cash === '' || d.cash === null || d.cash === undefined) {
|
if (d.cash === '' || d.cash === null || d.cash === undefined) {
|
||||||
d.cash_num = '-';
|
d.cash_num = '-';
|
||||||
@ -328,7 +322,6 @@
|
|||||||
field: 'merchant_callback_msg',
|
field: 'merchant_callback_msg',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
title: '同步结果',
|
title: '同步结果',
|
||||||
width: 100,
|
|
||||||
templet: function (d) {
|
templet: function (d) {
|
||||||
switch (d.merchant_callback_msg) {
|
switch (d.merchant_callback_msg) {
|
||||||
case 'success':
|
case 'success':
|
||||||
@ -344,8 +337,8 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{field: 'msg', title: '充值结果', align: 'center', minWidth: 100},
|
{field: 'msg', title: '充值结果', align: 'center'},
|
||||||
{field: 'right', toolbar: '#toolbar', width: 200, minWidth: 100, title: '操作面板', fixed: 'right'}
|
{field: 'right', toolbar: '#toolbar', width: 200, title: '操作面板', fixed: 'right'}
|
||||||
]],
|
]],
|
||||||
done: function (index, layero) {
|
done: function (index, layero) {
|
||||||
adjustColumnWidth();
|
adjustColumnWidth();
|
||||||
@ -361,6 +354,7 @@
|
|||||||
$(".layui-table-body tr").each(function (index, val) {
|
$(".layui-table-body tr").each(function (index, val) {
|
||||||
$($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height());
|
$($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height());
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// , height: 'full-110'
|
// , height: 'full-110'
|
||||||
@ -667,11 +661,23 @@
|
|||||||
|
|
||||||
|
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
.layui-table {
|
/*.layTab{*/
|
||||||
|
/* width:auto;*/
|
||||||
|
/* ov*/
|
||||||
|
/*}*/
|
||||||
|
/*.layui-table-cell{*/
|
||||||
|
/* width: auto;*/
|
||||||
|
/*}*/
|
||||||
|
/*.layui-table-cell.auto-width {*/
|
||||||
|
/* width: auto !important;*/
|
||||||
|
/*}*/
|
||||||
|
.table-diy-class{
|
||||||
|
border-collapse: collapse;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0.2) 0 4px 8px;
|
||||||
table-layout: auto;
|
table-layout: auto;
|
||||||
|
background-color: white;
|
||||||
|
width: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.color-span {
|
.color-span {
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
padding-left: 8px;
|
padding-left: 8px;
|
||||||
@ -696,6 +702,7 @@
|
|||||||
.color-span-gray {
|
.color-span-gray {
|
||||||
background-color: #666 !important;
|
background-color: #666 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user