|
|
@@ -8,32 +8,38 @@
|
|
|
<meta charset="utf-8">
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
<title>补打信息记录</title>
|
|
|
- <meta name="keywords" content="补打记录,信息管理">
|
|
|
+ <meta name="keywords" content="补打信息,记录">
|
|
|
<meta name="description" content="补打信息记录管理页面">
|
|
|
- <!-- 引入Bootstrap CSS -->
|
|
|
- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
|
- <!-- 引入Font Awesome图标 -->
|
|
|
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
|
+ <link href="${ctx}/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
|
|
|
+ <link href="${ctx}/css/font-awesome.css?v=4.4.0" rel="stylesheet">
|
|
|
<link href="${ctx}/css/bootstrap-select.min.css" rel="stylesheet">
|
|
|
<link href="${ctx}/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
|
|
|
<link href="${ctx}/css/animate.css" rel="stylesheet">
|
|
|
<link href="${ctx}/css/style.css?v=4.1.0" rel="stylesheet">
|
|
|
<style>
|
|
|
- .required::before {
|
|
|
- content: '*';
|
|
|
- color: red;
|
|
|
- margin-right: 5px;
|
|
|
+ .row.mb-4 {
|
|
|
+ margin-bottom: 1.5rem;
|
|
|
}
|
|
|
|
|
|
- .form-group {
|
|
|
- margin-bottom: 1.5rem;
|
|
|
+ .form-inline-flex {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ align-items: center;
|
|
|
+ gap: 5px;
|
|
|
}
|
|
|
|
|
|
- .form-container {
|
|
|
- padding: 20px;
|
|
|
- border-radius: 8px;
|
|
|
- box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
|
|
- background-color: #fff;
|
|
|
+ @media (max-width: 768px) {
|
|
|
+ .form-inline-flex {
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: stretch;
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-inline-flex .form-control,
|
|
|
+ .form-inline-flex .btn,
|
|
|
+ .form-inline-flex .selectpicker {
|
|
|
+ width: 100% !important;
|
|
|
+ margin-right: 0 !important;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
|
|
</head>
|
|
|
@@ -54,30 +60,27 @@
|
|
|
<div class="ibox-content">
|
|
|
<div class="row row-lg mb-4">
|
|
|
<div class="col-lg-12">
|
|
|
- <form id="searchForm" class="form-horizontal">
|
|
|
- <div class="row mb-3">
|
|
|
- <div class="col-sm-3">
|
|
|
- <label for="reprintTime" class="form-label">补打时间</label>
|
|
|
- <input type="date" class="form-control" id="reprintTime" name="reprintTime">
|
|
|
- </div>
|
|
|
- <div class="col-sm-3">
|
|
|
- <label for="factoryName" class="form-label">工厂名称</label>
|
|
|
- <input type="text" class="form-control" id="factoryName" name="factoryName" placeholder="请输入工厂名称">
|
|
|
- </div>
|
|
|
- <div class="col-sm-3">
|
|
|
- <label for="productName" class="form-label">产品名称</label>
|
|
|
- <input type="text" class="form-control" id="productName" name="productName" placeholder="请输入产品名称">
|
|
|
- </div>
|
|
|
- <div class="col-sm-3" style="display: flex; align-items: flex-end;">
|
|
|
- <button type="button" id="searchBtn" class="btn btn-success ms-2" onclick="search();return false;">
|
|
|
- <i class="fas fa-search"></i> 查询
|
|
|
- </button>
|
|
|
- <button type="button" id="resetBtn" class="btn btn-secondary ms-2" onclick="reset();return false;">
|
|
|
- <i class="fas fa-sync-alt"></i> 重置
|
|
|
- </button>
|
|
|
- </div>
|
|
|
+ <div class="form-inline-flex">
|
|
|
+ <input type="date" class="form-control" id="reprintTime" name="reprintTime" style="width: 180px; flex-shrink: 0; margin-right: 10px; margin-bottom: 5px;">
|
|
|
+
|
|
|
+ <div style="width: 200px; flex-shrink: 0; margin-right: 10px; margin-bottom: 5px;">
|
|
|
+ <select id="factoryId" class="form-control selectpicker" data-live-search="true" title="请选择工厂">
|
|
|
+ </select>
|
|
|
</div>
|
|
|
- </form>
|
|
|
+
|
|
|
+ <div style="width: 200px; flex-shrink: 0; margin-right: 10px; margin-bottom: 5px;">
|
|
|
+ <select id="productId" class="form-control selectpicker" data-live-search="true" title="请选择产品">
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <button type="button" id="searchBtn" class="btn btn-success"
|
|
|
+ onclick="search();return false;" style="margin-right: 5px; margin-bottom: 5px;">
|
|
|
+ 查询
|
|
|
+ </button>
|
|
|
+ <button type="button" id="resetBtn" class="btn btn-default"
|
|
|
+ onclick="reset();return false;" style="margin-right: 5px; margin-bottom: 5px;">重置
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="row row-lg mt-3">
|
|
|
@@ -91,12 +94,9 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
-<!-- 全局js -->
|
|
|
-<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
|
-<!-- 引入Bootstrap JS -->
|
|
|
-<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
|
+<script src="${ctx}/js/jquery.min.js?v=2.1.4"></script>
|
|
|
+<script src="${ctx}/js/bootstrap.min.js?v=3.3.6"></script>
|
|
|
<script src="${ctx}/js/bootstrap-select.min.js"></script>
|
|
|
-<!-- jQuery Validation plugin javascript-->
|
|
|
<script src="${ctx}/js/plugins/validate/jquery.validate.min.js"></script>
|
|
|
<script src="${ctx}/js/plugins/validate/messages_zh.min.js"></script>
|
|
|
<script src="${ctx}/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
|
|
|
@@ -105,127 +105,184 @@
|
|
|
<script src="${ctx}/js/common.js"></script>
|
|
|
<script src="${ctx}/js/plugins/layer/layer.min.js"></script>
|
|
|
<script src="${ctx}/js/Math.uuid.js"></script>
|
|
|
-<!-- 自定义js -->
|
|
|
<script src="${ctx}/js/content.js?v=1.0.0"></script>
|
|
|
</body>
|
|
|
<script>
|
|
|
var table = null;
|
|
|
-
|
|
|
$(document).ready(function () {
|
|
|
table = $('#table').bootstrapTable("destroy");
|
|
|
initTable();
|
|
|
+ $('.selectpicker').selectpicker({
|
|
|
+ liveSearch: true,
|
|
|
+ size: 5,
|
|
|
+ actionsBox: true,
|
|
|
+ selectedTextFormat: 'count > 2'
|
|
|
+ });
|
|
|
+ initFactorySelect();
|
|
|
+ initProductSelect();
|
|
|
+ // Bind reset button click event
|
|
|
+ $('#resetBtn').on('click', function () {
|
|
|
+ reset();
|
|
|
+ });
|
|
|
});
|
|
|
|
|
|
function queryParams(param) {
|
|
|
- // 获取查询参数
|
|
|
+ // Get search parameters
|
|
|
let reprintTime = $.trim($("#reprintTime").val());
|
|
|
- let factoryName = $.trim($("#factoryName").val());
|
|
|
- let productName = $.trim($("#productName").val());
|
|
|
+ let factoryId = $.trim($("#factoryId").val());
|
|
|
+ let productId = $.trim($("#productId").val());
|
|
|
|
|
|
if (reprintTime) {
|
|
|
param['reprintTime'] = reprintTime;
|
|
|
}
|
|
|
- if (factoryName) {
|
|
|
- param['factoryName'] = factoryName;
|
|
|
+ if (factoryId) {
|
|
|
+ param['factoryId'] = factoryId;
|
|
|
}
|
|
|
- if (productName) {
|
|
|
- param['productName'] = productName;
|
|
|
+ if (productId) {
|
|
|
+ param['sku'] = productId;
|
|
|
}
|
|
|
|
|
|
return param;
|
|
|
}
|
|
|
|
|
|
function search() {
|
|
|
- table = $('#table').bootstrapTable("destroy");
|
|
|
- initTable();
|
|
|
+ table = $('#table').bootstrapTable("refresh");
|
|
|
}
|
|
|
|
|
|
function reset() {
|
|
|
- $("#searchForm")[0].reset();
|
|
|
- table = $('#table').bootstrapTable("destroy");
|
|
|
- initTable();
|
|
|
+ // Reset form
|
|
|
+ $("#reprintTime").val("");
|
|
|
+ $("#factoryId").selectpicker('val', '');
|
|
|
+ $("#productId").selectpicker('val', '');
|
|
|
+
|
|
|
+ // Refresh table
|
|
|
+ table = $('#table').bootstrapTable("refresh");
|
|
|
}
|
|
|
|
|
|
- function initTable() {
|
|
|
- // 模拟数据
|
|
|
- var mockData = generateMockData();
|
|
|
+ // Load factory data (reused from original file)
|
|
|
+ function initFactorySelect() {
|
|
|
+ $.ajax({
|
|
|
+ url: '${ctx}/lineProduct/getFactoryList', // Assuming same endpoint
|
|
|
+ type: 'POST',
|
|
|
+ dataType: 'json',
|
|
|
+ beforeSend: function () {
|
|
|
+ $('#factoryId').prop('disabled', true).selectpicker('refresh');
|
|
|
+ },
|
|
|
+ success: function (res) {
|
|
|
+ $('#factoryId').empty();
|
|
|
+ if (res.data && res.data.length) {
|
|
|
+ res.data.forEach(item => {
|
|
|
+ $('#factoryId').append('<option value="' + item.id + '">' + item.factory_name + '</option>');
|
|
|
+ });
|
|
|
+ }
|
|
|
+ $('#factoryId').selectpicker('refresh');
|
|
|
+ },
|
|
|
+ error: function (xhr) {
|
|
|
+ $('#factoryId').empty().append('<option value="">加载失败</option>');
|
|
|
+ $('#factoryId').selectpicker('refresh');
|
|
|
+ layer.msg('获取工厂数据失败: ' + xhr.statusText);
|
|
|
+ },
|
|
|
+ complete: function () {
|
|
|
+ $('#factoryId').prop('disabled', false).selectpicker('refresh');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
|
|
|
+ // Load product data (reused from original file)
|
|
|
+ function initProductSelect() {
|
|
|
+ $.ajax({
|
|
|
+ url: '${ctx}/itemNew/getItemAll', // Assuming same endpoint
|
|
|
+ type: 'POST',
|
|
|
+ dataType: 'json',
|
|
|
+ beforeSend: function () {
|
|
|
+ $('#productId').prop('disabled', true).selectpicker('refresh');
|
|
|
+ },
|
|
|
+ success: function (res) {
|
|
|
+ $('#productId').empty();
|
|
|
+ if (res.data && res.data.length) {
|
|
|
+ res.data.forEach(item => {
|
|
|
+ $('#productId').append('<option value="' + item.sku + '">' + item.item_name + '</option>');
|
|
|
+ });
|
|
|
+ }
|
|
|
+ $('#productId').selectpicker('refresh');
|
|
|
+ },
|
|
|
+ error: function (xhr) {
|
|
|
+ $('#productId').empty().append('<option value="">加载失败</option>');
|
|
|
+ $('#productId').selectpicker('refresh');
|
|
|
+ layer.msg('获取产品数据失败: ' + xhr.statusText);
|
|
|
+ },
|
|
|
+ complete: function () {
|
|
|
+ $('#productId').prop('disabled', false).selectpicker('refresh');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ function initTable() {
|
|
|
table = $('#table').bootstrapTable({
|
|
|
- data: mockData,
|
|
|
+ url: '${ctx}/prodBatch/getReprintRecord', // ** IMPORTANT: Use the new data endpoint **
|
|
|
method: 'get',
|
|
|
sortable: true,
|
|
|
- toolbar: '#toolbar', //工具按钮用哪个容器
|
|
|
- striped: true, //是否显示行间隔色
|
|
|
- cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
|
|
|
- pagination: true, //是否显示分页(*)
|
|
|
- pageNumber: 1, //初始化加载第一页,默认第一页
|
|
|
- pageSize: 10, //每页的记录行数(*)
|
|
|
- pageList: [10, 25, 50, 100], //可供选择的每页的行数(*)
|
|
|
- queryParamsType: '', //默认值为 'limit' ,在默认情况下 传给服务端的参数为:offset,limit,sort
|
|
|
- // 设置为 '' 在这种情况下传给服务器的参数为:pageSize,pageNumber
|
|
|
- queryParams: queryParams,//前端调用服务时,会默认传递上边提到的参数,如果需要添加自定义参数,可以自定义一个函数返回请求参数
|
|
|
- sidePagination: "client", //客户端分页
|
|
|
+ striped: true,
|
|
|
+ cache: false,
|
|
|
+ pagination: true,
|
|
|
+ pageNumber: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ pageList: [10, 25, 50, 100],
|
|
|
+ queryParamsType: '',
|
|
|
+ queryParams: queryParams,
|
|
|
+ sidePagination: "server",
|
|
|
strictSearch: false,
|
|
|
- minimumCountColumns: 2, //最少允许的列数
|
|
|
- clickToSelect: true, //是否启用点击选中行
|
|
|
+ minimumCountColumns: 2,
|
|
|
+ clickToSelect: true,
|
|
|
searchOnEnterKey: true,
|
|
|
- idField: "id",
|
|
|
- paginationDetailHAlign: 'right', // 将分页详细信息放在右边
|
|
|
+ idField: "id", // Assuming there is a unique ID field
|
|
|
+ responseHandler: function (res) {
|
|
|
+ return {
|
|
|
+ total: res.total,
|
|
|
+ rows: res.records
|
|
|
+ };
|
|
|
+ },
|
|
|
columns: [{
|
|
|
title: '序号',
|
|
|
align: 'center',
|
|
|
formatter: function (value, row, index) {
|
|
|
- // 使用this关键字访问表格实例
|
|
|
var pageNumber = this.pageNumber || 1;
|
|
|
var pageSize = this.pageSize || 10;
|
|
|
return (pageNumber - 1) * pageSize + index + 1;
|
|
|
},
|
|
|
width: "5%"
|
|
|
}, {
|
|
|
- field: 'productionOrder',
|
|
|
- title: '生产单号',
|
|
|
- align: 'center',
|
|
|
- width: "10%"
|
|
|
+ field: 'taskOrderNo',
|
|
|
+ title: '任务单号',
|
|
|
+ align: 'center'
|
|
|
}, {
|
|
|
field: 'factoryName',
|
|
|
title: '工厂名称',
|
|
|
- align: 'center',
|
|
|
- width: "10%"
|
|
|
+ align: 'center'
|
|
|
}, {
|
|
|
- field: 'workshop',
|
|
|
+ field: 'workshopName',
|
|
|
title: '生产车间',
|
|
|
- align: 'center',
|
|
|
- width: "10%"
|
|
|
+ align: 'center'
|
|
|
}, {
|
|
|
field: 'lineName',
|
|
|
title: '产线',
|
|
|
- align: 'center',
|
|
|
- width: "10%"
|
|
|
+ align: 'center'
|
|
|
}, {
|
|
|
field: 'productName',
|
|
|
title: '产品名称',
|
|
|
- align: 'center',
|
|
|
- width: "10%"
|
|
|
- }, {
|
|
|
- field: 'reprintCount',
|
|
|
- title: '补打次数',
|
|
|
- align: 'center',
|
|
|
- width: "8%"
|
|
|
+ align: 'center'
|
|
|
}, {
|
|
|
field: 'boxCode',
|
|
|
title: '箱码',
|
|
|
- align: 'center',
|
|
|
- width: "12%"
|
|
|
+ align: 'center'
|
|
|
}, {
|
|
|
field: 'palletCode',
|
|
|
title: '托码',
|
|
|
- align: 'center',
|
|
|
- width: "12%"
|
|
|
+ align: 'center'
|
|
|
}, {
|
|
|
field: 'reprintTime',
|
|
|
title: '补打时间',
|
|
|
- align: 'center',
|
|
|
- width: "13%"
|
|
|
+ align: 'center'
|
|
|
}],
|
|
|
onLoadSuccess: function (data) {
|
|
|
console.log("数据加载成功", data);
|
|
|
@@ -234,69 +291,6 @@
|
|
|
layer.msg('数据加载失败', {icon: 2});
|
|
|
}
|
|
|
});
|
|
|
-
|
|
|
- // 注释:当后端接口准备好后,可以替换为以下代码调用真实接口
|
|
|
- /*
|
|
|
- table = $('#table').bootstrapTable({
|
|
|
- method: 'get',
|
|
|
- sortable: true,
|
|
|
- toolbar: '#toolbar',
|
|
|
- striped: true,
|
|
|
- cache: false,
|
|
|
- pagination: true,
|
|
|
- pageNumber: 1,
|
|
|
- pageSize: 10,
|
|
|
- pageList: [10, 25, 50, 100],
|
|
|
- url: '${ctx}/reprint/list', // 后端接口URL
|
|
|
- queryParamsType: '',
|
|
|
- queryParams: queryParams,
|
|
|
- sidePagination: "server",
|
|
|
- strictSearch: false,
|
|
|
- minimumCountColumns: 2,
|
|
|
- clickToSelect: true,
|
|
|
- searchOnEnterKey: true,
|
|
|
- idField: "id",
|
|
|
- responseHandler: function (res) {
|
|
|
- return {
|
|
|
- total: res.total,
|
|
|
- rows: res.records
|
|
|
- };
|
|
|
- },
|
|
|
- columns: [// 与上面相同的列定义...]
|
|
|
- });
|
|
|
- */
|
|
|
- }
|
|
|
-
|
|
|
- // 生成模拟数据
|
|
|
- function generateMockData() {
|
|
|
- var factories = ['金华工厂', '杭州工厂', '上海工厂', '苏州工厂', '广州工厂'];
|
|
|
- var workshops = ['第一车间', '第二车间', '第三车间', '第四车间', '第五车间'];
|
|
|
- var lines = ['A线', 'B线', 'C线', 'D线', 'E线'];
|
|
|
- var products = ['食品A', '食品B', '食品C', '食品D', '食品E', '食品F', '食品G'];
|
|
|
- var mockData = [];
|
|
|
-
|
|
|
- for (var i = 1; i <= 50; i++) {
|
|
|
- var date = new Date();
|
|
|
- date.setDate(date.getDate() - Math.floor(Math.random() * 30));
|
|
|
- var formattedDate = date.toISOString().split('T')[0];
|
|
|
- var time = Math.floor(Math.random() * 24) + ':' + (Math.floor(Math.random() * 60) < 10 ? '0' : '') + Math.floor(Math.random() * 60);
|
|
|
- var reprintTime = formattedDate + ' ' + time;
|
|
|
-
|
|
|
- mockData.push({
|
|
|
- id: i,
|
|
|
- productionOrder: 'PO' + Date.now().toString().slice(-6) + i,
|
|
|
- factoryName: factories[Math.floor(Math.random() * factories.length)],
|
|
|
- workshop: workshops[Math.floor(Math.random() * workshops.length)],
|
|
|
- lineName: lines[Math.floor(Math.random() * lines.length)],
|
|
|
- productName: products[Math.floor(Math.random() * products.length)],
|
|
|
- reprintCount: Math.floor(Math.random() * 5) + 1, // 1-5次
|
|
|
- boxCode: 'BOX' + Math.floor(Math.random() * 1000000000),
|
|
|
- palletCode: 'PAL' + Math.floor(Math.random() * 1000000000),
|
|
|
- reprintTime: reprintTime
|
|
|
- });
|
|
|
- }
|
|
|
-
|
|
|
- return mockData;
|
|
|
}
|
|
|
</script>
|
|
|
</html>
|