<!DOCTYPE html>
|
<html>
|
<head>
|
<meta charset="UTF-8" />
|
<meta name="viewport" content="user-scalable=0,width=device-width,initial-scale=1.0" />
|
<!-- <meta name="viewport" content="width=device-width, initial-scale=0.665, minimum-scale=0.5, maximum-scale=2.0, user-scalable=no" /> -->
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
<title>Boxline PDA</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">
|
.layout-bill-info {
|
height: auto;
|
/* background-color: #009E94; */
|
}
|
.layout-tbl-submit {
|
margin-top: 10px;
|
}
|
.out-scatter-num .local-input {
|
width: 40%;
|
height: 25px;
|
float: left;
|
}
|
.out-scatter-num .local-ok button {
|
height: 25px;
|
border: 0;
|
color: #FFFFFF;
|
background-color: #0a93e3;
|
border-radius: 3px;
|
padding: 2px;
|
margin-left: 10px;
|
width: 100%;
|
}
|
.out-scatter-num .layui-form-label {
|
width: 30%;
|
/* background-color: #007BFF; */
|
}
|
.out-scatter-num .layui-input-block {
|
width: 100%;
|
/* background-color: #009E94; */
|
margin-left: 0;
|
}
|
.out-scatter-num .local-ok {
|
width: 20%;
|
height: 25px;
|
float: left;
|
}
|
.layout-tbl-paging {
|
margin-top: 20px;
|
}
|
|
.layout-tab-page {
|
height: auto;
|
}
|
.layui-form-checkbox {
|
margin: auto;
|
/* padding-left: 2px; */
|
/* padding-right: 2px; */
|
}
|
.div-tbl-title {
|
width: 98%;
|
margin: auto;
|
/* background-color: #4476A7; */
|
height: 30px;
|
}
|
.div-tbl-title table {
|
width: 100%;
|
height: 30px;
|
}
|
.layui-form-radio{
|
margin: 0;
|
padding-right: 0;
|
}
|
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="layout-bill" class="layui-form-item layout-dropdownlist" >
|
<label class="layui-form-label">退货入库单：</label>
|
<div class="layui-input-block" id="selectDiv">
|
<select id="bar" lay-filter="getbar" lay-search>
|
<option value=""></option>
|
</select>
|
<img src="/assets/down_arraw.png" >
|
</div>
|
</div>
|
<div id="layout-pallet" class="layui-form-item layout-input">
|
<label class="layui-form-label">出库口：</label>
|
<div class="layui-input-block">
|
<input id="exitDesc" style="border: none;" type="text" lay-verify="stock" disabled placeholder=""
|
autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div id="layout-pallet" class="layui-form-item layout-input">
|
<label class="layui-form-label">托盘条码：</label>
|
<div class="layui-input-block">
|
<input id="STOCKCODE" type="text" lay-verify="stock" placeholder="请扫描托盘条码"
|
autocomplete="off" class="layui-input" style="height:24px">
|
</div>
|
</div>
|
|
<div id="" class="layout-tab-page">
|
|
<div class="layui-form-item layout-dropdownlist" style="margin-top: 10px;">
|
<label class="layui-form-label">物料名称：</label>
|
<div class="layui-input-block" >
|
<select id="goodSelect" lay-filter="goodSelect" lay-search>
|
<option value=""></option>
|
</select>
|
<img src="/assets/down_arraw.png" >
|
</div>
|
</div>
|
<div class="layui-form-item layout-dropdownlist" style="margin-top: 10px;">
|
<label class="layui-form-label">物料批次：</label>
|
<div class="layui-input-block" >
|
<select id="lotNoSelect" lay-filter="lotNoSelect" lay-search>
|
<option value=""></option>
|
</select>
|
<img src="/assets/down_arraw.png" >
|
</div>
|
</div>
|
<div class="layui-form-item layout-input" style="margin-top: 10px;">
|
<label class="layui-form-label">新托盘条码：</label>
|
<div class="layui-input-block">
|
<input id="NEWSTOCKCODE" type="text" lay-verify="stock" placeholder="请扫描新托盘条码"
|
autocomplete="off" class="layui-input" style="height:24px">
|
</div>
|
</div>
|
<table id="outHalf" class="layout-tab-content" border="" cellspacing="" cellpadding="">
|
|
<tr>
|
<td>
|
<div class="layui-form-item out-scatter-num" >
|
<label class="layui-form-label" style="width: 21%;">质检状态：</label>
|
<div class="local-input">
|
<div class="layui-input-block local-input" style="line-height: 28px;">
|
<input type="radio" name="status" value = "1" class="layui-input" checked="checked" style="padding-left:0.1rem;">合格
|
<input type="radio" name="status" value = "2" class="layui-input" style="padding-left:0.1rem;">不合格
|
</div>
|
</div>
|
</div>
|
</td>
|
</tr>
|
<tr id="outScatter">
|
<td>
|
<div id="layout-boxcode" class="layui-form-item out-scatter-num" style="margin-top: 10px;">
|
<label class="layui-form-label" style="width: 21%;">拣货数量：</label>
|
<div id="" class="local-input" >
|
<div class="layui-input-block" >
|
<input id="outScatterQty" type="number" placeholder="请输入拣货数量"
|
autocomplete="off" class="layui-input" style="padding-left:0.1rem;" oninput="value=value.replace(/^(0+)|[^\d]+/g,'')">
|
</div>
|
</div>
|
<div id="" class="local-ok" >
|
<button type="button" lay-submit lay-filter="formPickScatter">确认</button>
|
</div>
|
</div>
|
</td>
|
</tr>
|
</table>
|
<div id="" style="text-align: right;margin-top: 10px;">
|
<div id="" class="cut-line" >
|
<img src="/assets/fengexian.png" >
|
</div>
|
</div>
|
</div>
|
|
</form>
|
</div>
|
|
<div class="layout-tbl-paging" id="" >
|
<div id="" class="div-tbl-title">
|
<table border="0" cellspacing="" cellpadding="" style="height: 30px;">
|
<tr>
|
<td style="height: 30px;line-height: 30px;color: red;width: 50%;">
|
<span id="" style="width: 50%;height: 30px;float: left;">
|
箱子数量
|
</span>
|
<input id="boxNum" type="text" disabled placeholder=""
|
autocomplete="off" style="border: none;float: left; width: 40%;height: 30px; line-height: 30px;background-color: #FFFFFF;">
|
</td>
|
<td style="height: 30px;line-height: 30px;color: red;width: 50%;">
|
<span id="" style="width: 50%;height: 30px;float: left;">
|
待拣箱数
|
</span>
|
<input id="pickingBoxNum" type="text" disabled placeholder=""
|
autocomplete="off" style="border: none; width: 50%;float: left;height: 30px; line-height: 30px; background-color: #FFFFFF;">
|
</td>
|
</tr>
|
</table>
|
</div>
|
<table id="tableBoxList" class="tbl-box-list" border="" cellspacing="" cellpadding="">
|
<tr id="tableHead">
|
<th style="width: 15%;">编码</th>
|
<th style="width: 31%;">名称</th>
|
<th style="width: 22%;">批次</th>
|
<th name="hpicknum" style="width: 12%;">待拣<br>数量</th>
|
<th name="hpickednum" style="width: 12%;">已拣<br>数量</th>
|
<th style="width: 8%;">拣货</th>
|
</tr>
|
<tr id="boxCell" style="display: none;">
|
<td name="goodCode">AG000001</td>
|
<td name="goodName">疫苗名称名称名称</td>
|
<td name="lotNo">30</td>
|
<td name="picknum">30</td>
|
<td name="pickednum">30</td>
|
<td name="check" style="text-align: center;">
|
<!-- <div id="" style="width:100%;margin: auto;"> -->
|
<input type="checkbox" id="cbox2" value="second_checkbox" onclick="return false;" checked="checked" >
|
<!-- </div> -->
|
</td>
|
</tr>
|
</table>
|
|
<!-- 分页 -->
|
<table id="tableBoxPages" class="tbl-box-pages" border="" 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
|
var canPickBox = true
|
$("#STOCKCODE").focus();
|
|
//下拉单据选中后事件
|
form.on('select(getbar)', function(data) {
|
getBar(data.value);
|
updateGoodList();
|
updateLotNoList();
|
GetOutInfo();
|
});
|
|
$("#STOCKCODE").on('input',function(){
|
|
if($("#STOCKCODE").val() == "" || $("#STOCKCODE").val().length<10){
|
return
|
}
|
if ($("#STOCKCODE").val().length>=10) {
|
$("#STOCKCODE").val($("#STOCKCODE").val().substr(-10))
|
}
|
checkPalletStat()
|
})
|
$("#NEWSTOCKCODE").on('input',function(){
|
|
if($("#NEWSTOCKCODE").val() == "" || $("#NEWSTOCKCODE").val().length<10){
|
return
|
}
|
if ($("#NEWSTOCKCODE").val().length>=10) {
|
$("#NEWSTOCKCODE").val($("#NEWSTOCKCODE").val().substr(-10))
|
}
|
})
|
// //点击单据下拉框事件
|
// $("#selectDiv").click(function(){
|
|
// getBar(data.value,$("#wavebar").val());
|
// updateGoodList();
|
// updateLotNoList();
|
// GetOutInfo();
|
// })
|
|
//初始化渲染出库单
|
function updateBillList(){
|
$("#bar").empty()
|
$("#bar").append('<option value =>' + '</option>');
|
form.render('select');
|
|
var param = {
|
lpn:$("#STOCKCODE").val()
|
};
|
|
synData(IP + "/PdaInterface/GetImReturnGoodList",param, 'post', function(res) {
|
|
if (res.code == 1) { //成功
|
|
for (var i = 0; i < res.data.length; i++) {
|
if (i==0) {
|
$("#bar").append('<option value =' + res.data[i] + ' selected>' + res.data[i] + '</option>');
|
} else {
|
$("#bar").append('<option value =' + res.data[i] + '>' + res.data[i] + '</option>');
|
}
|
}
|
form.render('select');
|
} else { //不成功
|
layer.msg(res.msg, {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {});
|
}
|
});
|
}
|
|
//初始化渲染物料
|
function updateGoodList(){
|
$("#goodSelect").empty()
|
$("#goodSelect").append('<option value =>' + '</option>');
|
form.render('select');
|
|
var param = {
|
palNo: $("#STOCKCODE").val(),
|
ordNo: $("#bar").val(),
|
};
|
synData(IP + "/PdaInterface/GetReturnGoodOutGoodInfo", param, 'post', function(res) {
|
console.log("物料"+JSON.stringify(res))
|
if (res.code == 1) { //成功
|
for (var i = 0; i < res.data.length; i++) {
|
if (i==0) {
|
$("#goodSelect").append('<option value =' + res.data[i].GoodCode + ' selected>' + res.data[i].GoodName + '</option>');
|
} else {
|
$("#goodSelect").append('<option value =' + res.data[i].GoodCode + '>' + res.data[i]
|
.GoodName + '</option>');
|
}
|
|
}
|
form.render('select');
|
|
} else { //不成功
|
layer.msg(res.msg, {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {});
|
}
|
});
|
}
|
|
//初始化渲染批次
|
function updateLotNoList(){
|
$("#lotNoSelect").empty()
|
$("#lotNoSelect").append('<option value =>' + '</option>');
|
form.render('select');
|
|
var param = {
|
palNo: $("#STOCKCODE").val(),
|
ordNo: $("#bar").val(),
|
};
|
synData(IP + "/PdaInterface/GetReturnGoodOutLotNoInfo", param, 'post', function(res) {
|
console.log("批次："+JSON.stringify(res))
|
if (res.code == 1) { //成功
|
for (var i = 0; i < res.data.length; i++) {
|
console.log("批次2："+ res.data[i].LotNo)
|
|
if (i == 0) {
|
$("#lotNoSelect").append('<option value =' + res.data[i].LotNo + ' selected>' + res.data[i].LotNo + '</option>');
|
} else {
|
$("#lotNoSelect").append('<option value =' + res.data[i].LotNo + '>' + res.data[i].LotNo + '</option>');
|
}
|
}
|
form.render('select');
|
|
} else { //不成功
|
layer.msg(res.msg, {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {});
|
}
|
});
|
}
|
|
//根据单据获取出库口
|
function getBar(selectedvalue) {
|
if (selectedvalue) {
|
var param = {
|
"orderNo": selectedvalue
|
}
|
synData(IP + "/PdaInterface/GetReturnGoodOutlets", param, 'post', function(res) {
|
console.log("出库口："+JSON.stringify(res))
|
if (res.code == 1) { //成功
|
let data = res.data
|
|
$('#exitDesc').val(data)
|
} else { //不成功
|
layer.msg(res.msg, {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {});
|
}
|
});
|
} else {
|
}
|
}
|
|
function GetOutInfo(){
|
|
let param2 = {
|
"palNo": $("#STOCKCODE").val(),
|
"ordNo": $("#bar").val(),
|
}
|
synData(IP + "/PdaInterface/GetReturnGoodOutInfo", param2, 'post', function(res) {
|
console.log("根据托盘号获取待检货信息 res is "+JSON.stringify(res))
|
if(res.code == 1){
|
tableData = deepCopy(res.data)
|
|
refreshTable(tableData)
|
}else{
|
layer.msg(res.msg, {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {});
|
}
|
});
|
}
|
|
//当托盘条码输入框失去焦点时,检查一下托盘状态 勿删
|
// $("#STOCKCODE").blur(function(){
|
// if($("#STOCKCODE").val() == ""){
|
// return
|
// }
|
// if ($("#STOCKCODE").val().length>=10) {
|
// console.log($("#STOCKCODE").val().substr(-10));
|
// $("#STOCKCODE").val($("#STOCKCODE").val().substr(-10))
|
// }
|
// checkPalletStat()
|
// })
|
//键盘Enter按下事件（检查托盘状态）
|
// $("#STOCKCODE").keydown(function(e) {
|
// if (e.keyCode === 13) {
|
|
// if($("#STOCKCODE").val() == ""){
|
// layer.msg("请输入托盘条码", {
|
// icon: 2,
|
// time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
// });
|
// return
|
// }
|
// console.log("111111111111111")
|
|
// //检查托盘状态
|
// checkPalletStat();
|
// }
|
// });
|
//渲染表格数据
|
function refreshTable(list) {
|
//先清空一下箱子列表
|
let trs = $("#tableBoxList tr")
|
let len = trs.length
|
//console.log("tr 数量 + " + trs.length)
|
for(i=len - 1; i >=2; i--){
|
trs[i].remove();
|
}
|
|
//设置托盘号
|
// $("#palletCode").val($.cookie('stockCode'))
|
|
console.log(list != null);
|
console.log(list );
|
if (list != null && list.length > 0) { //成功
|
$("#boxNum").val(list.length)
|
$("#pickingBoxNum").val(tableData.WholeBoxNum)
|
var arrTrs = new Array()
|
let idx = 0
|
for(var i in list) {
|
// list[i].BoxCode
|
var tr = $("#boxCell").eq(0).clone();
|
tr.appendTo("#tableBoxList");
|
tr.attr('id', list[i].BoxCode)
|
idx++;
|
tr.attr('index', idx)
|
tr.find("td[name='goodCode']").html(list[i].ExportGoodsCode);
|
tr.find("td[name='goodName']").html(list[i].ExportGoodsName);
|
tr.find("td[name='lotNo']").html(list[i].ExportLotNo);
|
tr.find("td[name='picknum']").html(list[i].PickNum);
|
tr.find("td[name='pickednum']").html(list[i].PickedNum);
|
if(list[i].ExportExecuteFlag == "3"){
|
//已拣
|
tr.find("td[name='check']").find('input').attr('checked', 'checked')
|
} else{
|
//未拣
|
//console.log("Status "+list[i].Status)
|
tr.find("td[name='check']").find('input').removeAttr('checked')
|
}
|
|
tr.show();
|
arrTrs[i] = tr
|
}
|
|
//设置分页
|
setPages(1, list.length)
|
|
canPickBox = true
|
} else { //不成功
|
layer.msg("无数据", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {});
|
$("#boxNum").val(0)
|
setPages(1, 0)
|
}
|
// $("#boxCnt").html("当前托盘上的箱子数量："+res.length)
|
}
|
|
//检查托盘状态\根据托盘号获取待检货信息\渲染物料\渲染批次
|
function checkPalletStat(){
|
// var list = tmpBoxs
|
if($("#STOCKCODE").val() == ""){
|
layer.msg("托盘号为空", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {});
|
return
|
}
|
|
var param = {
|
"palNo": $("#STOCKCODE").val()
|
}
|
synData(IP + "/PdaInterface/GetPalnoStatus", param, 'post', function(res) {
|
|
if (res.msg == "有效托盘") { //成功
|
|
$.cookie('stockCode', $("#STOCKCODE").val());
|
|
updateBillList();
|
getBar($("#bar").val());
|
updateGoodList();
|
updateLotNoList();
|
GetOutInfo();
|
|
} else { //不成功
|
layer.msg("无效托盘", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {});
|
}
|
});
|
}
|
//获取选中的物料批次对应的拣货出库ID
|
function getBoxInfoByBoxCode(exportGoodsCode,exportLotNo){
|
let list = tableData
|
for(let i = 0; i < list.length; i++){
|
if(list[i].ExportGoodsCode == exportGoodsCode && list[i].ExportLotNo == exportLotNo){
|
return list[i]
|
}
|
}
|
return null
|
}
|
|
//确认拣货（不是整托）
|
function reqPickScatter(){
|
if($("#BOXCODE").val() == ""){
|
return
|
}
|
let boxinfo = getBoxInfoByBoxCode($("#goodSelect").val(),$("#lotNoSelect").val())
|
|
var param = {
|
"billCode": boxinfo.ExportRemark,
|
"orderId": boxinfo.Id,
|
"pickNum": $('#outScatterQty').val(),
|
"status":$("input[type='radio']:checked").val(),
|
"newStockCode":$('#NEWSTOCKCODE').val()
|
}
|
sendData(IP + "/PdaInterface/SetReturnGoodPickFlag", param, 'post', function(res) {
|
//console.log(res);
|
checkPalletStat()
|
if (res.code == 1) { //成功
|
layer.msg(res.msg, {
|
icon: 1,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {
|
canPickBox = true//回调
|
});
|
} else { //不成功
|
layer.msg(res.msg, {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {
|
canPickBox = true//回调
|
});
|
}
|
});
|
}
|
|
//单拣货（确认按钮）
|
form.on('submit(formPickScatter)', function(data) {
|
// if (!$.cookie('userId')) {
|
// layer.msg('登陆失效，请重新登陆', {
|
// icon: 2,
|
// time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
// }, function() {
|
// location.href = "login.html";
|
// //回调
|
// });
|
// }
|
|
if($('#outScatterQty').val() == ""){
|
layer.msg("请输入拣货数量", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {
|
//回调
|
});
|
return
|
}
|
if($('#NEWSTOCKCODE').val() == ""){
|
layer.msg("请输入新托盘条码", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {
|
//回调
|
});
|
return
|
}
|
if($('#goodSelect').val() == ""){
|
layer.msg("请选择物料", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {
|
//回调
|
});
|
return
|
}
|
if($('#lotNoSelect').val() == ""){
|
layer.msg("请选择批次", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {
|
//回调
|
});
|
return
|
}
|
let boxinfo = getBoxInfoByBoxCode($("#goodSelect").val(),$("#lotNoSelect").val())
|
if(!boxinfo){
|
layer.msg("未查询到物料批次信息", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {
|
//回调
|
});
|
return
|
}
|
let pn = boxinfo.PickNum
|
if($.isPlainObject(boxinfo.PickNum) || pn == 0){
|
pn = boxinfo.Qty
|
}
|
if(!$("#outScatterQty").val()){
|
layer.msg("请输入拣货数量", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {
|
//回调
|
});
|
return
|
}
|
let qty = parseInt($('#outScatterQty').val())
|
if(qty <= 0 || qty > pn){
|
layer.msg("拣货数量需大于0，并且不能超过待拣数量", {
|
icon: 2,
|
time: 2000 //2秒关闭（如果不配置，默认是3秒）
|
}, function() {
|
//回调
|
});
|
return
|
}
|
|
if(canPickBox == false){
|
//console.log("请求未完成，不要重复请求， canPickBox is "+canPickBox)
|
return
|
}
|
|
canPickBox = false
|
|
reqPickScatter()
|
|
return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
|
});
|
// form.verify({
|
// stock: [/^[\S]{6}$/, '托盘条码必须为六位字符']
|
// });
|
|
|
|
|
//主页及重新登录
|
$("#menuImg").click(function(e){
|
//console.log("menuImg")
|
e.stopPropagation()
|
|
if($("#menuList").is(":hidden")){
|
$("#menuList").show()
|
}else{
|
$("#menuList").hide()
|
}
|
})
|
$('body').click(function(){
|
// //console.log("body")
|
$("#menuList").hide()
|
})
|
|
|
//设置分页
|
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")
|
|
// let newTr = table.append("<tr></tr>")
|
// newTr.append("<td class='page-prev'>上一页</td>")
|
$("<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++){
|
// newTr.append("<td class='page-num'>"+ i +"</td>")
|
$("<td class='page-num'>"+ i +"</td>").appendTo("#tableBoxPages tr")
|
}
|
// newTr.append("<td class='page-next'>下一页</td>")
|
$("<td id='nextPage' class='page-next'>下一页</td>").appendTo("#tableBoxPages tr")
|
$("#tableBoxPages tr").eq(0).find("td[id^='nextPage']").click(function(){
|
onClickNextPage()
|
})
|
// pages.show()
|
$("#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
|
}
|
//console.log("startIndex is "+startIndex)
|
//console.log("endIndex is "+endIndex)
|
//startIndex =2
|
//endIndex = 2
|
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){
|
//console.log("需要显示")
|
//显示行
|
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")
|
}
|
}
|
//console.log("totalTrNum is " + totalTrNum)
|
}
|
//上一页按钮被点击
|
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>
|
