<!DOCTYPE html>
|
<html>
|
|
<head>
|
<meta name="viewport" content="user-scalable=0,width=device-width,initial-scale=1.0" />
|
<meta charset="UTF-8" />
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
<title>箱码查询</title>
|
<link rel="stylesheet" href="/layui/css/layui.css" />
|
<link rel="stylesheet" href="/css/style.css" />
|
<script src="/js/adaptive.js"></script>
|
|
<link rel="stylesheet" href="/css/my.css" />
|
<style type="text/css">
|
.layui-form-label {
|
width: 20%;
|
}
|
|
.layui-input-block {
|
width: 80%;
|
margin-left: 20%;
|
}
|
|
.div-tbl-title {
|
width: 98%;
|
margin: auto;
|
/* background-color: #4476A7; */
|
height: 30px;
|
margin-top: 20px;
|
}
|
|
.div-tbl-title table {
|
width: 100%;
|
height: 30px;
|
}
|
|
.div-tbl-title td {
|
width: 50%;
|
height: 30px;
|
line-height: 30px;
|
}
|
|
.div-tbl-title span {
|
float: left;
|
width: 60%;
|
height: 30px;
|
line-height: 30px;
|
}
|
|
.div-tbl-title input {
|
float: left;
|
width: 40%;
|
height: 30px;
|
line-height: 30px;
|
border: none;
|
}
|
|
.layout-tbl-paging {
|
margin-top: 0;
|
}
|
|
.layout-bill-info {
|
height: auto;
|
}
|
|
.btn-ok {
|
border: none;
|
color: #FFFFFF;
|
background-color: #0a93e3;
|
width: 48%;
|
height: 36px;
|
border-radius: 5px;
|
float: left;
|
margin: 0 1%;
|
margin-left: 25%;
|
}
|
|
.btn-ok:active {
|
opacity: 0.8;
|
}
|
|
td {
|
word-break: break-all;
|
word-wrap: break-word;
|
}
|
</style>
|
<link rel="stylesheet" href="/css/adapter.css" />
|
</head>
|
|
<body>
|
<div id="" class="main-content">
|
<div id="" class="layout-title">
|
<table border="" cellspacing="" cellpadding="">
|
<tr>
|
<td class="img-back"><a href="../index.html"><img src="/assets/back.jpg"></a></td>
|
<td class="title-text">箱码查询</td>
|
<td class="title-menu-icon"><img id="menuImg" src="/assets/menu.jpg"></td>
|
</tr>
|
</table>
|
</div>
|
<div id="" class="layout-sub-content">
|
<div id="menuList" class="menu">
|
<ul class="" style="text-align: center;">
|
<li><a href="../index.html">主页</a></li>
|
<li><a href="../login.html">重新登录</a></li>
|
</ul>
|
</div>
|
|
<div id="" class="layout-bill-info">
|
<form class="layui-form" action="" style="height: auto;" >
|
<div id="" class="layui-form-item layout-input" style="margin-top: 5px;">
|
<label class="layui-form-label">外箱条码</label>
|
<div class="layui-input-block">
|
<input id="BoxNo" type="text" placeholder="请扫描箱码" autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div id="" class="layui-form-item layout-input" style="margin-top: 5px;">
|
<label class="layui-form-label">物料编码</label>
|
<div class="layui-input-block">
|
<input id="SkuNo" type="text" autocomplete="off" class="layui-input" style="border: 0px; "
|
disabled>
|
</div>
|
</div>
|
<div id="" class="layui-form-item layout-input" style="margin-top: 5px;">
|
<label class="layui-form-label">物料名称</label>
|
<div class="layui-input-block">
|
<input id="SkuName" type="text" autocomplete="off" class="layui-input" style="border: 0px;"
|
disabled>
|
</div>
|
</div>
|
|
<!-- <table class="layout-tbl-input" border="" cellspacing="" cellpadding="">
|
<tr>
|
<td> -->
|
<div id="" class="layui-form-item layout-input" style="margin-top: 5px;">
|
<label class="layui-form-label" lang>进厂编号：</label>
|
<div class="layui-input-block">
|
<input id="LotNo" type="text" autocomplete="off" class="layui-input" style="border: 0px;"
|
class="layui-input">
|
</div>
|
</div>
|
<!-- </td>
|
|
|
</tr>
|
<tr>
|
<td> -->
|
<div id="" class="layui-form-item layout-input" style="margin-top: 5px;">
|
<label class="layui-form-label" lang>原厂批号：</label>
|
<div class="layui-input-block">
|
<input id="SupplierLot" type="text" autocomplete="off" class="layui-input" style="border: 0px;"
|
class="layui-input">
|
</div>
|
</div>
|
<!-- </td>
|
</tr>
|
<tr>
|
<td> -->
|
<div id="" class="layui-form-item layout-input" style="margin-top: 5px;">
|
<label class="layui-form-label" lang>箱内数量：</label>
|
<div class="layui-input-block">
|
<input id="Qty" type="text" autocomplete="off" class="layui-input" style="border: 0px;"
|
class="layui-input">
|
</div>
|
</div>
|
<!-- </td>
|
</tr>
|
<tr>
|
<td> -->
|
<div id="" class="layui-form-item layout-input" style="margin-top: 5px;">
|
<label class="layui-form-label" lang>质量状态：</label>
|
<div class="layui-input-block">
|
<input id="InspectStatus" type="text" autocomplete="off" class="layui-input" style="border: 0px;"
|
class="layui-input">
|
</div>
|
</div>
|
<!-- </td>
|
</tr>
|
</table> -->
|
|
|
<div id="" class="" style="width: 100%;height: 36px;margin-top: 15px;">
|
<button id="btnQuery" class="btn-ok" type="button">查询</button>
|
</div>
|
</form>
|
</div>
|
|
|
<div id="" class="layout-tbl-paging" style="margin-top: 5px;">
|
<!-- 箱内支信息 -->
|
<table id="tableBoxList" class="tbl-box-list" border="1px">
|
<tr>
|
<th>支码</th>
|
<th>数量</th>
|
</tr>
|
<tr id="boxCell" style="display: none;">
|
<td name="BoxNo">支码</td>
|
<td name="Qty">数量</td>
|
</tr>
|
</table>
|
|
<!-- 分页 -->
|
<table id="tableBoxPages" class="tbl-box-pages" cellspacing="" cellpadding="">
|
<tr>
|
<td class="page-prev">上一页</td>
|
<td class="page-num page-num-select">1</td>
|
<td class="page-num">2</td>
|
<td class="page-num">3</td>
|
<td class="page-num">4</td>
|
<td class="page-num">5</td>
|
<td class="page-next">下一页</td>
|
</tr>
|
</table>
|
|
</div>
|
</div>
|
</div>
|
|
<script src="/js/jquery-3.5.1.min.js"></script>
|
<script src="/layui/layui.js"></script>
|
<script src="/js/public.js"></script>
|
<script src="/js/jquery.cookie.js"></script>
|
<script>
|
layui.use(['form', 'jquery'], function () {
|
var form = layui.form
|
|
//当前分页
|
var curPageIndex = 1
|
var tableData = null
|
|
// 功能列隐藏
|
$("#menuImg").click(function (e) {
|
e.stopPropagation()
|
|
if ($("#menuList").is(":hidden")) {
|
$("#menuList").show()
|
} else {
|
$("#menuList").hide()
|
}
|
})
|
|
$('body').click(function () {
|
$("#menuList").hide()
|
})
|
|
// 清空文本框信息
|
function clear() {
|
$("#BoxNo").val('');
|
$("#SkuNo").val("");
|
$("#SkuName").val("");
|
$("#LotNo").val("");
|
$("#SupplierLot").val("");
|
$("#Qty").val("");
|
$("#InspectStatus").val("");
|
|
// 清空table列表
|
let trs = $("#tableBoxList tr")
|
let len = trs.length
|
for (i = len - 1; i >= 2; i--) {
|
trs[i].remove();
|
}
|
}
|
|
$("#btnQuery").click(function () {
|
if ($('#BoxNo').val() == '') {
|
layer.msg("请扫描外箱条码", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function () { });
|
clear();
|
return
|
}
|
|
// 获取查询参数
|
var param = {
|
BoxNo: $('#BoxNo').val(),
|
};
|
|
// 查询-根据箱码获取详细信息
|
sendData(IP + "/PdaCr/GetBoxQueryList", param, 'get', function (res) {
|
console.log("箱码查询：", res)
|
if (res.code == 0) { //成功
|
clear();
|
$("#BoxNo").val(res.data.BoxNo);
|
$("#SkuNo").val(res.data.SkuNo);
|
$("#SkuName").val(res.data.SkuName);
|
$("#LotNo").val(res.data.LotNo);
|
$("#SupplierLot").val(res.data.SupplierLot);
|
$("#Qty").val(res.data.Qty);
|
$("#InspectStatus").val(res.data.InspectStatus);
|
|
tableData = deepCopy(res.data.InfoList)
|
refreshTable()
|
} else { //不成功
|
layer.msg(res.msg, {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function () {
|
clear();
|
let trs = $("#tableBoxList tr")
|
let len = trs.length
|
for (i = len - 1; i >= 2; i--) {
|
trs[i].remove();
|
}
|
});
|
}
|
});
|
})
|
|
function refreshTable() {
|
//先清空一下箱子列表
|
let trs = $("#tableBoxList tr")
|
let len = trs.length
|
for (i = len - 1; i >= 2; i--) {
|
trs[i].remove();
|
}
|
|
if (tableData.length > 0) { //成功
|
var list = tableData
|
var arrTrs = new Array()
|
let idx = 0
|
for (var i in list) {
|
var tr = $("#boxCell").eq(0).clone();
|
tr.appendTo("#tableBoxList");
|
idx++;
|
tr.attr('index', idx)
|
tr.find("td[name='BoxNo']").html(list[i].BoxNo2);
|
tr.find("td[name='Qty']").html(list[i].Qty2);
|
|
tr.show();
|
arrTrs[i] = tr
|
}
|
|
//设置分页
|
setPages(1, list.length)
|
} else { //不成功
|
// $("#boxNum").val(0)
|
layer.msg("无数据", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function () { });
|
setPages(1, 0)
|
}
|
}
|
|
//设置分页
|
function setPages(pageIndex, boxNum) {
|
if (boxNum <= 0) {
|
//列表为空，隐藏分页页码
|
$("#tableBoxPages").hide()
|
return
|
}
|
|
let pageNum = Math.floor(boxNum / 10);
|
if (boxNum % 10 > 0) {
|
pageNum += 1;
|
}
|
//console.log("pageNum is " + pageNum)
|
|
$("#tableBoxPages").find("tr").remove()
|
let table = $("#tableBoxPages")
|
$("<tr></tr>").appendTo("#tableBoxPages")
|
|
|
$("<td id='prevPage' class='page-prev'>上一页</td>").appendTo("#tableBoxPages tr")
|
$("#tableBoxPages tr").eq(0).find("td[id^='prevPage']").click(function () {
|
onClickPrevPage()
|
})
|
for (i = 1; i < pageNum + 1; i++) {
|
$("<td class='page-num'>" + i + "</td>").appendTo("#tableBoxPages tr")
|
}
|
|
$("<td id='nextPage' class='page-next'>下一页</td>").appendTo("#tableBoxPages tr")
|
$("#tableBoxPages tr").eq(0).find("td[id^='nextPage']").click(function () {
|
onClickNextPage()
|
})
|
|
$("#tableBoxPages").show()
|
|
setCurPage(1)
|
}
|
|
//设置当前分页
|
function setCurPage(pageIndex) {
|
let totalTrNum = $("#tableBoxList tr").length
|
if (totalTrNum <= 2) {
|
//console.log("tableBoxList 为空 totalTrNum: " + totalTrNum)
|
//curPageIndex = 1
|
return
|
}
|
|
let pageNum = getBoxPageNum()
|
if (pageIndex > pageNum) {
|
//console.log("设置的页码超出页数, pageIndex : " + pageIndex)
|
//curPageIndex = 1
|
return
|
}
|
|
let startIndex = (pageIndex - 1) * 10 + 1
|
let n = totalTrNum - startIndex
|
let endIndex = 0
|
if (n > 9) {
|
endIndex = startIndex + 9
|
} else {
|
endIndex = startIndex + n
|
}
|
|
let trs = $("#tableBoxList tr")
|
//console.log("行数 "+trs.length)
|
let d = 0
|
for (let i = 2; i < trs.length; i++) {
|
//console.log("行索引 " + trs.eq(i).attr('index'))
|
let t = trs.eq(i)
|
d = t.attr('index')
|
if (d >= startIndex && d <= endIndex) {
|
t.show()
|
} else {
|
t.hide()
|
}
|
}
|
|
curPageIndex = pageIndex
|
|
let ptr = $("#tableBoxPages tr")
|
for (let i = 1; i < pageNum + 1; i++) {
|
ptr.eq(0).find("td").eq(i).removeClass("page-num-select")
|
if (i == curPageIndex) {
|
ptr.eq(0).find("td").eq(i).addClass("page-num-select")
|
}
|
}
|
}
|
|
function onClickPrevPage() {
|
//console.log("上一页按钮被点击")
|
if (curPageIndex == 1) {
|
return
|
}
|
setCurPage(curPageIndex - 1)
|
}
|
|
function onClickNextPage() {
|
//console.log("下一页按钮被点击")
|
let n = getBoxPageNum()
|
if (curPageIndex == n) {
|
return
|
}
|
setCurPage(curPageIndex + 1)
|
}
|
|
function getBoxPageNum() {
|
let num = $("#tableBoxList tr").length
|
if (num <= 2) {
|
return 0
|
}
|
|
let pageNum = Math.floor(num / 10);
|
if (num % 10 > 0) {
|
pageNum += 1;
|
}
|
|
return pageNum
|
}
|
})
|
</script>
|
</body>
|
|
</html>
|
