This commit is contained in:
cwchen 2024-11-09 20:19:16 +08:00
parent 6c72a30b0e
commit c828c1a0d2
8 changed files with 735 additions and 10 deletions

View File

@ -0,0 +1,60 @@
body {
margin: 0;
padding: 0;
height: 99%;
}
.layout {
display: flex;
align-items: center;
justify-content: center;
}
#main-box {
width: 100%;
height: 100%;
background-color: #fff;
border-radius: 5px;
}
#basic-box {
width: 100%;
}
.title {
width: 100%;
height: 30px;
justify-content: start;
padding: 0 0 0 20px;
box-sizing: border-box;
}
.title p {
font-size: 14px;
font-weight: bold;
}
.classTable {
width: 98%;
margin: 0 1% 0 1%;
table-layout: fixed;
text-align: center;
border-collapse: collapse;
border-spacing: 1px;
box-sizing: border-box;
}
.classTable tr td,
.classTable tr th {
height: 50px;
box-sizing: border-box;
border: 1px solid #ddd;
padding: 10px 20px;
text-align: left;
}
.classTable tr:nth-child(odd) {
background-color: #f2f2f2;
}

BIN
images/img_icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 657 B

View File

@ -186,6 +186,7 @@ function initTable() {
},
},
{
field: "remarks",
title: "备注",
width: '10%',
align: "center",

View File

@ -1 +1,340 @@
console.log(decodeURIComponent(getUrlParam('obj')));
let objParam = JSON.parse(JSON.parse(decodeURIComponent(getUrlParam('obj'))));
let id = getUrlParam('id'); // 批次ID
let form, table, element, tableIns, layer;
let pageNum = 1;
layui.use(["form", "table", 'element', 'layer'], function () {
form = layui.form;
table = layui.table;
element = layui.element;
layer = layui.layer;
getOutDetails();
initTable();
});
// 基本信息和附件文档接口
function getOutDetails() {
let params = {
encryptedData: JSON.stringify({
'proId': objParam.proId,
'id':id
})
};
let url = dataUrl + 'backstage/planOut/getOutDetails';
ajaxRequest(url, "POST", params, true, function () {
}, function (result) {
console.error(result);
if (result.code === 200) {
setBasicValue(result.data);
setFileTable(result.data.fileList);
}else{
setBasicValue(null);
setFileTable(null);
}
}, function (xhr, status, error) {
errorFn(xhr, status, error)
}, null);
}
function setBasicValue(obj) {
if(obj){
$('#userName').html(obj.userName); parseInt();
$('#createDay').html(obj.createDay + '<a style="margin:0 5px;color:#409EFF;cursor: pointer;" onclick=\'viewGs('+JSON.stringify(obj)+')\'>查看概述</a>');
$('#remark').html(obj.remarks);
}
}
// 附件文档赋值
function setFileTable(fileList) {
$('#file-table tbody tr:not(:first)').remove();
let html = '';
if (fileList && fileList.length > 0) {
$.each(fileList, function (index, item) {
html += '<tr>' +
'<td>' + handleFileType(item.fileName) + item.fileName + '</td>' +
'<td><img src="../../../images/user_head_icon.png" width="20px" height="20px">' + item.createName + '</td>' +
'<td>' + item.createTime + '</td>' +
'<td><a style="margin:0 5px;color:#409EFF;cursor: pointer;" onclick=\'viewFile('+JSON.stringify(item)+')\'>预览</a>' +
'<a style="margin:0 5px;color:#409EFF;cursor: pointer;" onclick=\'downLoadFile('+JSON.stringify(item)+')\'>下载</a>' +
'</td>' +
'</tr>';
})
} else {
html = '<tr><td colspan="4">暂无数据</td></tr>';
}
$('#file-table tbody').after(html);
}
// 处理文件类型
function handleFileType(value) {
value = value.toLowerCase();
let src = '';
if (value.indexOf('docx') > -1 || value.indexOf('doc') > -1) {
src = '../../../images/docx.png'
} else if (value.indexOf('xls') > -1 || value.indexOf('xlsx') > -1) {
src = '../../../images/xlsx.png'
} else if (value.indexOf('pdf') > -1) {
src = '../../../images/pdf.png'
} else if (value.indexOf('png') > -1 || value.indexOf('jpg') > -1 || value.indexOf('jpeg') > -1) {
src = '../../../images/img_icon.png'
}
return '<img width="20px" height="20px" src = "' + src + '" style="margin:0 5px;">'
}
// 查询/重置
function queryTable(type) {
if (type === 1) {
reloadTable(1);
} else if (type === 2) {
$('#name').val('');
$('#module').val('');
layui.form.render();
reloadTable(1);
}
}
// 刷新页面数据
function reloadData() {
reloadData(pageNum);
}
// 重载表格
function reloadTable(pageNum) {
table.reload("currentTableId", {
page: {
curr: pageNum ? pageNum : 1,
},
where: {
encryptedData: JSON.stringify({
'name': $('#name').val(),
'module': $('#module').val(),
'proId': objParam.proId,
'id':id
}),
},
},
);
}
// 初始化表格
function initTable() {
tableIns = table.render({
elem: "#currentTableId",
id: 'currentTableId',
headers: {
authorization: sessionStorage.getItem("gz-token"),
},
height: "full",
url: dataUrl + "backstage/planOut/getOutDetailList",
where: {
encryptedData: JSON.stringify({
'name': $('#name').val(),
'module': $('#module').val(),
'proId': objParam.proId,
'id':id
}),
},
request: {
pageName: 'pageNum',
limitName: 'pageSize'
},
parseData: function (res) { // res 即为原始返回的数据
return {
"code": 0, // 解析接口状态
"msg": '获取成功', // 解析提示文本
"count": res.total, // 解析数据长度
"data": res.list // 解析数据列表
};
},
cols: [
[
{
width: '5%',
title: "序号",
align: "center",
templet: function (d) {
return d.LAY_NUM;
},
},
{
field: "type",
width: '10%',
title: "物机类型 ",
unresize: true,
align: "center",
},
{
field: "name",
width: '20%',
title: "物机名称",
unresize: true,
align: "center",
},
{
field: "module",
title: "规格",
width: '10%',
unresize: true,
align: "center",
},
{
field: "unit",
title: "单位",
width: '10%',
unresize: true,
align: "center",
},
{
field: "needNum",
title: "需要量",
width: '10%',
unresize: true,
align: "center",
templet: function (d) {
return setNumColor(d.needNum, 1);
},
},
{
field: "fhNum",
width: '10%',
title: "本次发货量",
unresize: true,
align: "center",
templet: function (d) {
return setNumColor(d.fhNum, 2);
},
},
{
field: "tzNum",
width: '10%',
title: "不发货量",
unresize: true,
align: "center",
templet: function (d) {
return setNumColor(d.tzNum, 3);
},
},
{
field: "remarks",
title: "备注",
width: '15%',
align: "center",
unresize: true,
},
],
],
limits: [10, 15, 20, 25, 50, 100],
limit: 10,
page: true,
done: function (res, curr, count) {
pageNum = tableIns.config.page.curr;
element.render();
table.resize("currentTableId");
},
});
}
// 设置字体加粗
function setFontBold(value) {
return '<span style="font-weight:bold">' + value + "</span>";
}
function setNumColor(value, type) { // 1.需要量 2.本次发货量 3.不发货量
if (type === 1) {
color = '#66b1ff';
} else if (type === 2) {
color = '#19be6b';
} else if (type === 3) {
if (value > 0) {
color = '#d9001b';
} else {
color = '#ccc';
}
}
return '<span style="color:' + color + ';font-weight:bold;">' + value + "</span>";
}
// 导出
function exportExcel() {
let encryptedData = JSON.stringify({
'proName': $('#proName').val(),
'status': $('#status').val()
});
let url = dataUrl + "backstage/planOut/exportExcel?encryptedData=" + encryptedData;
exportExcelUtil(url, '机具公司发货数据');
}
// 打印
function print() {
Print('#body', {
onStart: function () {
console.log('onStart', new Date())
},
onEnd: function () {
console.log('onEnd', new Date())
}
})
}
// 查看概述
function viewGs(obj) {
layer.open({
type: 1,
shade: false, // 不显示遮罩
content: '<div style="padding: 1%;">'+obj.details+'</div>',
title:'<h3 style="color: #F56C6C;">'+obj.createDay+'发货概述:</h3>',
btn: ['复制文字', '关闭'],
area: ['60%', '50%'],
move:false,
btnAlign: 'c', // 按钮居中显示
btn1: function () {
exeCommandCopyText(obj.gs);
},
btn2: function () {
layer.close();
},
});
}
// 复制文字
function exeCommandCopyText(text) {
try {
const t = document.createElement('textarea')
t.nodeValue = text
t.value = text
document.body.appendChild(t)
t.select()
document.execCommand('copy');
document.body.removeChild(t)
layer.msg('复制成功',{icon:1});
} catch (e) {
console.log(e)
layer.msg('复制失败',{icon:2});
}
}
// 预览文件
function viewFile(obj) {
let fileName = obj.fileName.toLowerCase();
if(fileName.indexOf('png') || fileName.indexOf('jpg')|| fileName.indexOf('jpeg')){
layer.photos({
shade:0.5,
photos: {
"title": "图片预览",
"start": 0,
"data": [
{
"alt": "layer",
"pid": 1,
"src": "../../../images/captcha.jpg",
}
]
}
});
}
}
// 下载文件
function downLoadFile(obj) {
alert('下载');
}

View File

@ -33,10 +33,10 @@ function getShipmentBatch(list) {
$.each(list, function (index, item) {
dataList.push({ name: '第' +numToChinese(index + 1)+ '批', id: item.id, tiem: item.createDay })
});
dataList.push({ name: '待发货', id: '' })
dataList.push({ name: '待发货', id: '0' })
} else {
dataList.push({ name: '全部', id: '' })
dataList.push({ name: '待发货', id: '' })
dataList.push({ name: '待发货', id: '0' })
}
$.each(dataList, function (index, item) {
if (item.name === '待发货') {

View File

@ -1 +1,203 @@
console.log(decodeURIComponent(getUrlParam('obj')));
let objParam = JSON.parse(JSON.parse(decodeURIComponent(getUrlParam('obj'))));
let form, table, element, tableIns, layer;
let pageNum = 1;
layui.use(["form", "table", 'element', 'layer'], function () {
form = layui.form;
table = layui.table;
element = layui.element;
layer = layui.layer;
initTable();
});
// 查询/重置
function queryTable(type) {
if (type === 1) {
reloadTable(1);
} else if (type === 2) {
$('#name').val('');
$('#module').val('');
layui.form.render();
reloadTable(1);
}
}
// 刷新页面数据
function reloadData() {
reloadData(pageNum);
}
// 重载表格
function reloadTable(pageNum) {
table.reload("currentTableId", {
page: {
curr: pageNum ? pageNum : 1,
},
where: {
encryptedData: JSON.stringify({
'name': $('#name').val(),
'module': $('#module').val(),
'proId': objParam.proId,
}),
},
},
);
}
// 初始化表格
function initTable() {
tableIns = table.render({
elem: "#currentTableId",
id: 'currentTableId',
headers: {
authorization: sessionStorage.getItem("gz-token"),
},
height: "full",
url: dataUrl + "backstage/planOut/getDfhList",
where: {
encryptedData: JSON.stringify({
'name': $('#name').val(),
'module': $('#module').val(),
'proId': objParam.proId
}),
},
request: {
pageName: 'pageNum',
limitName: 'pageSize'
},
parseData: function (res) { // res 即为原始返回的数据
return {
"code": 0, // 解析接口状态
"msg": '获取成功', // 解析提示文本
"count": res.total, // 解析数据长度
"data": res.list // 解析数据列表
};
},
cols: [
[
{
width: '9.9%',
title: "序号",
align: "center",
templet: function (d) {
return d.LAY_NUM;
},
},
{
field: "type",
width: '15%',
title: "物机类型 ",
unresize: true,
align: "center",
},
{
field: "name",
width: '20%',
title: "物机名称",
unresize: true,
align: "center",
},
{
field: "module",
title: "规格",
width: '15%',
unresize: true,
align: "center",
},
{
field: "unit",
title: "单位",
width: '10%',
unresize: true,
align: "center",
},
{
field: "needNum",
title: "需要量",
width: '10%',
unresize: true,
align: "center",
templet: function (d) {
return setNumColor(d.needNum, 1);
},
},
{
field: "fhNum",
width: '10%',
title: "已发货量",
unresize: true,
align: "center",
templet: function (d) {
return setNumColor(d.fhNum, 2);
},
},
{
field: "tzNum",
width: '10%',
title: "未发货量",
unresize: true,
align: "center",
templet: function (d) {
return setNumColor(d.tzNum, 3);
},
},
],
],
limits: [10, 15, 20, 25, 50, 100],
limit: 10,
page: true,
done: function (res, curr, count) {
pageNum = tableIns.config.page.curr;
element.render();
table.resize("currentTableId");
},
});
}
// 设置字体加粗
function setFontBold(value) {
return '<span style="font-weight:bold">' + value + "</span>";
}
function setNumColor(value, type) { // 1.需要量 2.本次发货量 3.不发货量
if (type === 1) {
color = '#66b1ff';
} else if (type === 2) {
color = '#19be6b';
} else if (type === 3) {
if (value > 0) {
color = '#d9001b';
} else {
color = '#ccc';
}
}
return '<span style="color:' + color + ';font-weight:bold;">' + value + "</span>";
}
// 导出
function exportExcel() {
let encryptedData = JSON.stringify({
'proName': $('#proName').val(),
'status': $('#status').val()
});
let url = dataUrl + "backstage/planOut/exportExcel?encryptedData=" + encryptedData;
exportExcelUtil(url, '机具公司发货数据');
}
// 打印
function print() {
Print('#body', {
onStart: function () {
console.log('onStart', new Date())
},
onEnd: function () {
console.log('onEnd', new Date())
}
})
}
// 下载文件
function downLoadFile(obj) {
alert('下载');
}

View File

@ -8,12 +8,95 @@
<link rel="stylesheet" href="../../../lib/layui-v2.9.18/layui/css/layui.css" media="all">
<link rel="stylesheet" href="../../../css/font.css" media="all">
<link rel="stylesheet" href="../../../css/public.css" media="all">
<link rel="stylesheet" href="../../../css/demandPlan/delivery_detail_list.css" media="all">
<link rel="stylesheet" href="../../../css/demandPlan/delivery_batch_list.css" media="all">
</head>
<body>
<div id="main-box">
发货详情-批次
<div id="basic-box">
<div class="title layout">
<span style="font-weight:700;text-decoration:none;color:#409EFF;"></span>
<p>基本信息</p>
</div>
<div id="basic-table">
<table class="classTable">
<tr>
<th>发货人</th>
<th>发货日期</th>
</tr>
<tr>
<td id="userName"></td>
<td id="createDay"></td>
</tr>
<tr>
<th colspan="2">备注</th>
</tr>
<tr>
<td colspan="2" id="remark"></td>
</tr>
</table>
</div>
</div>
<div id="file-box">
<div class="title layout">
<span style="font-weight:700;text-decoration:none;color:#409EFF;"></span>
<p>附件文档</p>
</div>
<div id="file-table-box">
<table class="classTable" id="file-table">
<tr>
<th>文件名</th>
<th>上传人员</th>
<th>上传时间</th>
<th>操作</th>
</tr>
</table>
</div>
</div>
<div id="fhjj-box">
<div class="title layout">
<span style="font-weight:700;text-decoration:none;color:#409EFF;"></span>
<p>发货机具明细</p>
</div>
<div class="layuimini-container">
<div class="layuimini-main">
<fieldset class="table-search-fieldset">
<legend>搜索信息</legend>
<div style="margin: 10px 10px 10px 10px">
<form class="layui-form layui-form-pane" action="#" onsubmit="return false;">
<div class="layui-form-item">
<div class="layui-inline">
<div class="layui-input-inline" style="width: 300px;">
<input type="text" name="name" id="name" autocomplete="off"
class="layui-input" lay-affix="clear" placeholder="输入物机名称" maxlength="30">
</div>
</div>
<div class="layui-inline">
<div class="layui-input-inline" style="width: 300px;">
<input type="text" name="module" id="module" autocomplete="off"
class="layui-input" lay-affix="clear" placeholder="输入规格" maxlength="30">
</div>
</div>
<div class="layui-inline">
<button class="layui-btn layui-bg-blue" onclick="queryTable(1)"><i
class="layui-icon"></i> 搜 索</button>
<button class="layui-btn layui-btn-primary" onclick="queryTable(2)"><i
class="layui-icon layui-icon-refresh"></i> 重 置</button>
<button class="layui-btn layui-btn-primary" onclick="exportExcel()"><i
class="layui-icon layui-icon-download-circle"></i> 下 载</button>
<button class="layui-btn layui-btn-primary" onclick="print()"><i
class="layui-icon layui-icon-print"></i> 打 印</button>
</div>
</div>
</form>
</div>
</fieldset>
<div class="table-box" table-responsive style="z-index: 1;">
<table class="layui-hide" id="currentTableId" lay-filter="currentTableId2"></table>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="../../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>

View File

@ -8,12 +8,52 @@
<link rel="stylesheet" href="../../../lib/layui-v2.9.18/layui/css/layui.css" media="all">
<link rel="stylesheet" href="../../../css/font.css" media="all">
<link rel="stylesheet" href="../../../css/public.css" media="all">
<link rel="stylesheet" href="../../../css/demandPlan/delivery_detail_list.css" media="all">
</head>
<style>
body {
margin: 0;
padding: 0;
height: 100%;
}
</style>
<body>
<div id="main-box">
<p>待发货</p>
<div class="layuimini-container">
<div class="layuimini-main">
<fieldset class="table-search-fieldset">
<legend>搜索信息</legend>
<div style="margin: 10px 10px 10px 10px">
<form class="layui-form layui-form-pane" action="#" onsubmit="return false;">
<div class="layui-form-item">
<div class="layui-inline">
<div class="layui-input-inline" style="width: 300px;">
<input type="text" name="name" id="name" autocomplete="off"
class="layui-input" lay-affix="clear" placeholder="输入物机名称" maxlength="30">
</div>
</div>
<div class="layui-inline">
<div class="layui-input-inline" style="width: 300px;">
<input type="text" name="module" id="module" autocomplete="off"
class="layui-input" lay-affix="clear" placeholder="输入规格" maxlength="30">
</div>
</div>
<div class="layui-inline">
<button class="layui-btn layui-bg-blue" onclick="queryTable(1)"><i
class="layui-icon"></i> 搜 索</button>
<button class="layui-btn layui-btn-primary" onclick="queryTable(2)"><i
class="layui-icon layui-icon-refresh"></i> 重 置</button>
<button class="layui-btn layui-btn-primary" onclick="exportExcel()"><i
class="layui-icon layui-icon-download-circle"></i> 下 载</button>
<button class="layui-btn layui-btn-primary" onclick="print()"><i
class="layui-icon layui-icon-print"></i> 打 印</button>
</div>
</div>
</form>
</div>
</fieldset>
<div class="table-box" table-responsive style="z-index: 1;">
<table class="layui-hide" id="currentTableId" lay-filter="currentTableId2"></table>
</div>
</div>
</div>
</body>
<script src="../../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>