mula
/
unis_sip
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(table): 优化表格布局和功能 

- 设置表格列宽，优化表格布局
- 添加固定列功能，提高表格滚动体验
- 更新折扣输入格式，支持更精确的数值
- 调整表格样式，提升可读性
master
chenhao 2025-07-04 09:25:00 +08:00
parent 99c496e9a8
commit c8a5ee7930
8 changed files with 82 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ruoyi-admin/src/main/resources/templates/include.html
View File

@ -17,6 +17,7 @@
<!-- 通用JS --> <!-- 通用JS -->
<div th:fragment="footer"> <div th:fragment="footer">
<script th:inline="javascript"> var ctx = [[@{/}]]; var lockscreen = [[${session.lockscreen}]]; if(lockscreen){window.top.location=ctx+"lockscreen";} </script> <script th:inline="javascript"> var ctx = [[@{/}]]; var lockscreen = [[${session.lockscreen}]]; if(lockscreen){window.top.location=ctx+"lockscreen";} </script>
<a id="scroll-up" href="javascript:;" class="btn btn-sm display"><i class="fa fa-angle-double-up"></i></a> <a id="scroll-up" href="javascript:;" class="btn btn-sm display"><i class="fa fa-angle-double-up"></i></a>
<script th:src="@{/js/jquery.min.js?v=3.6.3}"></script> <script th:src="@{/js/jquery.min.js?v=3.6.3}"></script>
@ -39,6 +40,7 @@
<script th:src="@{/ruoyi/js/common.js?v=4.8.0}"></script> <script th:src="@{/ruoyi/js/common.js?v=4.8.0}"></script>
<script th:src="@{/ruoyi/js/ry-ui.js?v=4.8.0}"></script> <script th:src="@{/ruoyi/js/ry-ui.js?v=4.8.0}"></script>
<script th:src="@{/ajax/libs/bootstrap-table/extensions/columns/bootstrap-table-fixed-columns.js?v=1.22.6}"></script>
</div> </div>
<!--layui库--> <!--layui库-->
<div th:fragment="layui"> <div th:fragment="layui">

2
ruoyi-admin/src/main/resources/templates/layout/product-list.html
View File

@ -173,7 +173,7 @@
</td> </td>
<td> <td>
<input value="${data.guidanceDiscount || ''}" name="softwareProjectProductInfoList[${length}].guidanceDiscount" readonly type="hidden" class="form-control guidanceDiscount" > <input value="${data.guidanceDiscount || ''}" name="softwareProjectProductInfoList[${length}].guidanceDiscount" readonly type="hidden" class="form-control guidanceDiscount" >
<label style="display: flex;align-items: center"><input style="width: calc(100% - 10px);" value="${data.guidanceDiscountFormat || ''}" readonly required type="number" min="0" max="100" step="0.1" class="form-control guidance-discount-format" required>% <label style="display: flex;align-items: center"><input style="width: calc(100% - 10px);" value="${data.guidanceDiscountFormat || ''}" readonly required type="number" min="0" max="100" step="0.01" class="form-control guidance-discount-format" required>%
</label> </label>
</td> </td>
<td><input value="${data.discount || ''}" name="softwareProjectProductInfoList[${length}].discount" type="hidden" class="form-control discount" required> <td><input value="${data.discount || ''}" name="softwareProjectProductInfoList[${length}].discount" type="hidden" class="form-control discount" required>

16
ruoyi-admin/src/main/resources/templates/manage/delivery/delivery.html
View File

@ -3,6 +3,11 @@
<head> <head>
<th:block th:include="include :: header('发货记录列表')" /> <th:block th:include="include :: header('发货记录列表')" />
</head> </head>
<style>
.bootstrap-table table {
table-layout: fixed;
}
</style>
<body class="gray-bg"> <body class="gray-bg">
<div class="container-div"> <div class="container-div">
<div class="row"> <div class="row">
@ -92,6 +97,8 @@
removeUrl: prefix + "/remove", removeUrl: prefix + "/remove",
exportUrl: prefix + "/export", exportUrl: prefix + "/export",
modalName: "发货记录", modalName: "发货记录",
fixedColumns: true,
fixedRightNumber: 1,
columns: [{ columns: [{
checkbox: true checkbox: true
}, },
@ -101,11 +108,13 @@
visible: false visible: false
}, },
{ {
width: 150,
field: 'orderCode', field: 'orderCode',
title: '合同编号', title: '合同编号',
}, },
{ {
width: 260,
field: 'orderName', field: 'orderName',
title: '合同名称', title: '合同名称',
formatter:function (value,row){ formatter:function (value,row){
@ -113,10 +122,12 @@
}, },
}, },
{ {
width: 100,
field: 'deliveryCode', field: 'deliveryCode',
title: '发货单号' title: '发货单号'
}, },
{ {
width: 100,
field: 'total', field: 'total',
title: '发货数量', title: '发货数量',
escape:true, escape:true,
@ -129,10 +140,12 @@
} }
}, },
{ {
width: 100,
field: 'deliveryDate', field: 'deliveryDate',
title: '发货日期' title: '发货日期'
}, },
{ {
width: 100,
field: 'deliveryType', field: 'deliveryType',
title: '发货方式', title: '发货方式',
formatter: function(value, row, index) { formatter: function(value, row, index) {
@ -140,6 +153,7 @@
} }
}, },
{ {
width: 100,
field: 'deliveryStatus', field: 'deliveryStatus',
title: '发货状态', title: '发货状态',
formatter: function(value, row, index) { formatter: function(value, row, index) {
@ -147,10 +161,12 @@
} }
}, },
{ {
width: 100,
field: 'createByName', field: 'createByName',
title: '创建人' title: '创建人'
}, },
{ {
width: 190,
title: '操作', title: '操作',
align: 'center', align: 'center',
formatter: function(value, row, index) { formatter: function(value, row, index) {

16
ruoyi-admin/src/main/resources/templates/manage/order/order.html
View File

@ -7,6 +7,9 @@
.select-list li p, .select-list li label:not(.radio-box){ .select-list li p, .select-list li label:not(.radio-box){
width: 95px; width: 95px;
} }
.bootstrap-table table {
table-layout: fixed;
}
</style> </style>
<body class="gray-bg"> <body class="gray-bg">
<div class="container-div"> <div class="container-div">
@ -79,6 +82,8 @@
removeUrl: prefix + "/remove", removeUrl: prefix + "/remove",
exportUrl: prefix + "/export", exportUrl: prefix + "/export",
modalName: "合同档案", modalName: "合同档案",
fixedColumns: true,
fixedRightNumber:1,
columns: [{ columns: [{
checkbox: true checkbox: true
}, },
@ -88,26 +93,32 @@
visible: false visible: false
}, },
{ {
width:150,
field: 'orderCode', field: 'orderCode',
title: '合同编号' title: '合同编号'
}, },
{ {
width:80,
field: 'versionCode', field: 'versionCode',
title: '版本号' title: '版本号'
}, },
{ {
width:260,
field: 'orderName', field: 'orderName',
title: '合同名称' title: '合同名称'
}, },
{ {
width:100,
field: 'projectCode', field: 'projectCode',
title: '项目编号' title: '项目编号'
}, },
{ {
width:170,
field: 'customerName', field: 'customerName',
title: '最终客户名称' title: '最终客户名称'
}, },
{ {
width:100,
field: 'orderType', field: 'orderType',
title: '合同类型', title: '合同类型',
formatter: function(value, row, index) { formatter: function(value, row, index) {
@ -115,11 +126,13 @@
} }
}, },
{ {
width:100,
field: 'orderDate', field: 'orderDate',
title: '合同签定日期' title: '合同签定日期'
}, },
{ {
field: 'createByName', width:100,
field: 'createByName',
title: '创建人' title: '创建人'
}, },
// { // {
@ -127,6 +140,7 @@
// title: '合同状态' // title: '合同状态'
// }, // },
{ {
width:150,
title: '操作', title: '操作',
align: 'center', align: 'center',
formatter: function(value, row, index) { formatter: function(value, row, index) {

7
ruoyi-admin/src/main/resources/templates/system/agent/agent.html
View File

@ -92,27 +92,32 @@
visible: false visible: false
}, },
{ {
width: 100,
field: 'agentCode', field: 'agentCode',
title: '代表处编码' title: '代表处编码'
}, },
{ {
width: 100,
field: 'agentName', field: 'agentName',
title: '代表处名称' title: '代表处名称'
}, },
{ {
width: 100,
field: 'province', field: 'province',
title: '所在省' title: '所在省'
}, },
{ {
width: 100,
field: 'city', field: 'city',
title: '所在市' title: '所在市'
}, },
{ {
width: 100,
field: 'createAt', field: 'createAt',
title: '创建时间' title: '创建时间'
}, },
{ {
width: '200', width: '150',
title: '操作', title: '操作',
align: 'center', align: 'center',
formatter: function(value, row, index) { formatter: function(value, row, index) {

11
ruoyi-admin/src/main/resources/templates/system/customer/info.html
View File

@ -9,6 +9,9 @@
} }
.bootstrap-table table { .bootstrap-table table {
table-layout: fixed; table-layout: fixed;
th,td{
word-wrap: break-word;
}
} }
</style> </style>
<body class="gray-bg"> <body class="gray-bg">
@ -115,17 +118,17 @@
title: '最终客户名称' title: '最终客户名称'
}, },
{ {
width:100, width:80,
field: 'customerPostcode', field: 'customerPostcode',
title: '客户邮编' title: '客户邮编'
}, },
{ {
width:100, width:80,
field: 'province', field: 'province',
title: '所在省' title: '所在省'
}, },
{ {
width:100, width:80,
field: 'city', field: 'city',
title: '所在市' title: '所在市'
}, },
@ -152,7 +155,7 @@
{ {
width:100, width:100,
field: 'bgProperty', field: 'bgProperty',
title: '所属行业', title: 'BG',
formatter: (value, row) => { formatter: (value, row) => {
return $.table.selectDictLabel([[${@dict.getType('bg_type')}]], value); return $.table.selectDictLabel([[${@dict.getType('bg_type')}]], value);
} }

17
ruoyi-admin/src/main/resources/templates/system/partner/partner.html
View File

@ -13,6 +13,9 @@
.select-list li p, .select-list li label:not(.radio-box){ .select-list li p, .select-list li label:not(.radio-box){
width: 80px; width: 80px;
} }
.bootstrap-table table {
table-layout: fixed;
}
</style> </style>
<body class="gray-bg"> <body class="gray-bg">
<div class="container-div"> <div class="container-div">
@ -77,7 +80,7 @@
</div> </div>
<th:block th:include="include :: footer" /> <th:block th:include="include :: footer" />
<th:block th:include="include :: jquery-cxselect-js"/> <th:block th:include="include :: jquery-cxselect-js"/>
<th:block th:include="include :: bootstrap-table-fixed-columns-js" />
<script th:inline="javascript"> <script th:inline="javascript">
var editFlag = [[${@permission.hasPermi('system:partner:edit')}]]; var editFlag = [[${@permission.hasPermi('system:partner:edit')}]];
var removeFlag = [[${@permission.hasPermi('system:partner:remove')}]]; var removeFlag = [[${@permission.hasPermi('system:partner:remove')}]];
@ -92,6 +95,8 @@
removeUrl: prefix + "/remove", removeUrl: prefix + "/remove",
exportUrl: prefix + "/export", exportUrl: prefix + "/export",
modalName: "代理商管理", modalName: "代理商管理",
fixedColumns:true,
fixedRightNumber:1,
columns: [{ columns: [{
checkbox: true checkbox: true
}, },
@ -101,34 +106,42 @@
visible: false visible: false
}, },
{ {
width:100,
field: 'partnerCode', field: 'partnerCode',
title: '代理商编码' title: '代理商编码'
}, },
{ {
width: 200,
field: 'partnerName', field: 'partnerName',
title: '代理商名称' title: '代理商名称'
}, },
{ {
width:100,
field: 'province', field: 'province',
title: '省' title: '省'
}, },
{ {
width:100,
field: 'city', field: 'city',
title: '市' title: '市'
}, },
{ {
width:100,
field: 'address', field: 'address',
title: '详细地址' title: '详细地址'
}, },
{ {
width:100,
field: 'contactPerson', field: 'contactPerson',
title: '联系人' title: '联系人'
}, },
{ {
width:100,
field: 'contactPhone', field: 'contactPhone',
title: '联系电话' title: '联系电话'
}, },
{ {
width:100,
field: 'level', field: 'level',
title: '认证级别', title: '认证级别',
formatter: function(value, row, index) { formatter: function(value, row, index) {
@ -136,10 +149,12 @@
} }
}, },
{ {
width:100,
field: 'createAt', field: 'createAt',
title: '创建时间' title: '创建时间'
}, },
{ {
width:150,
title: '操作', title: '操作',
align: 'center', align: 'center',
formatter: function(value, row, index) { formatter: function(value, row, index) {

23
ruoyi-admin/src/main/resources/templates/system/product/product.html
View File

@ -3,6 +3,11 @@
<head> <head>
<th:block th:include="include :: header('产品管理列表')" /> <th:block th:include="include :: header('产品管理列表')" />
</head> </head>
<style>
.bootstrap-table table {
table-layout: fixed;
}
</style>
<body class="gray-bg"> <body class="gray-bg">
<div class="container-div"> <div class="container-div">
<div class="row"> <div class="row">
@ -49,6 +54,7 @@
</div> </div>
</div> </div>
<th:block th:include="include :: footer" /> <th:block th:include="include :: footer" />
<th:block th:include="include :: bootstrap-table-fixed-columns-js" />
<script th:inline="javascript"> <script th:inline="javascript">
var editFlag = [[${@permission.hasPermi('system:product:edit')}]]; var editFlag = [[${@permission.hasPermi('system:product:edit')}]];
var removeFlag = [[${@permission.hasPermi('system:product:remove')}]]; var removeFlag = [[${@permission.hasPermi('system:product:remove')}]];
@ -62,6 +68,8 @@
removeUrl: prefix + "/remove", removeUrl: prefix + "/remove",
exportUrl: prefix + "/export", exportUrl: prefix + "/export",
modalName: "产品管理", modalName: "产品管理",
fixedColumns:true,
fixedRightNumber:1,
columns: [{ columns: [{
checkbox: true checkbox: true
}, },
@ -71,37 +79,44 @@
visible: false visible: false
}, },
{ {
width:100,
field: 'productCode', field: 'productCode',
title: 'BOM编码' title: 'BOM编码'
}, },
{ {width:100,
field: 'hzCode', field: 'hzCode',
title: '上架编码' title: '上架编码'
}, },
{ {
width:100,
field: 'productName', field: 'productName',
title: '产品名称' title: '产品名称'
}, },
{ {
width:100,
field: 'model', field: 'model',
title: '产品型号' title: '产品型号'
}, },
{ {
field: 'cataloguePrice', width:100,
field: 'cataloguePrice',
title: '目录单价' title: '目录单价'
}, },
{ {
field: 'guidanceDiscount', width:100,
field: 'guidanceDiscount',
title: '指导折扣', title: '指导折扣',
formatter: function(value, row, index) { formatter: function(value, row, index) {
return value?(value * 100).toFixed(2) + '%' :'-'; return value?(value * 100).toFixed(2) + '%' :'-';
} }
}, },
{ {
width:100,
field: 'createdAt', field: 'createdAt',
title: '创建时间' title: '创建时间'
}, },
{ {
width:150,
title: '操作', title: '操作',
align: 'center', align: 'center',
formatter: function(value, row, index) { formatter: function(value, row, index) {