| | |
| | | } |
| | | |
| | | .btnShow { |
| | | width: auto; |
| | | height: auto; |
| | | cursor: pointer; |
| | | width: 20px; |
| | | height: 15px; |
| | | |
| | | } |
| | | .btnShow1 { |
| | | width: 20px; |
| | |
| | | <body> |
| | | <div class="layui-fluid" style="height: 96%;width: 99%;"> |
| | | <div class="layui-row layui-col-space15" style="width: auto;height: 100%;"> |
| | | <!-- 上 --> |
| | | <!-- 顶--> |
| | | <div class="layui-col-md" style="width: auto;height: 10%;"> |
| | | <div class="layui-card" style="width: auto;height: 100%;"> |
| | | <div class="layui-card-body"> |
| | |
| | | <label class="layui-form-label">楼层</label> |
| | | <div class="layui-input-inline"> |
| | | <select name="Row" id="Row" lay-filter="SelectRow"> |
| | | <option value="1" selected>一楼</option> |
| | | <option value="4" selected>四楼</option> |
| | | <option value="3">三楼</option> |
| | | </select> |
| | | </div> |
| | | </div> |
| | | <!-- <div class="layui-inline"> |
| | | <label class="layui-form-label">深度</label> |
| | | <div class="layui-input-inline"> |
| | | <select name="Depth" id="Depth" lay-filter="SelectDepth"> |
| | | <option value="01" selected>深度1</option> |
| | | <option value="02" id="shendu2">深度2</option> |
| | | </select> |
| | | </div> |
| | | </div> --> |
| | | |
| | | <div class="layui-inline"> |
| | | <!-- 储位图例 --> |
| | | <table style="margin:0 auto;"> |
| | |
| | | </div> |
| | | </div> |
| | | <!-- 上 --> |
| | | <div class="layui-col-md" style="width: auto;height: 44%;"> |
| | | <div class="layui-col-md" style="width: auto;height: 24%;"> |
| | | <div class="layui-row layui-col-space15" style="width: auto;height: 100%;"> |
| | | <!-- 一、三楼上左B01、B11 --> |
| | | <div class="layui-col-md6 divOneS" id="divOne"> |
| | | <!-- 空 --> |
| | | <div class="layui-col-md1" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="a"></p> |
| | | <p></p> |
| | | <table class="container" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | <!-- 粉筛间 --> |
| | | <div class="layui-col-md1 " id="divOne" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="a4">B01 粉筛间区</p> |
| | | <table class="container" id="tabOne" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 一楼上中左B02 三楼上中B12 --> |
| | | <div class="layui-col-md6 divOneS" id="divTwo"> |
| | | <!-- 一步制粒1--> |
| | | <div class="layui-col-md2 " id="divTwo" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="b"></p> |
| | | <p id="b4">一步制粒1</p> |
| | | <table class="container" id="tabTwe" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 一楼上中右B03 --> |
| | | <div class="layui-col-md6 divOneS" id="divThree"> |
| | | <!-- 一步制粒2 --> |
| | | <div class="layui-col-md2 " id="divThree" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="c"></p> |
| | | <table class="container" id="tabThree" style="width: 100%;height: 90%;"></table> |
| | | <p id="c4">一步制粒2</p> |
| | | <table class="" id="tabThree" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 一、三楼上右B04、B13 --> |
| | | <div class="layui-col-md6 divOneS" id="divFour"> |
| | | <!-- 一步制粒3 --> |
| | | <div class="layui-col-md2 " id="divFour" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="d"></p> |
| | | <p id="d4">一步制粒3</p> |
| | | <table class="container" id="tabfour" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 空 --> |
| | | <div class="layui-col-md4 " id="divFour" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="e4"></p> |
| | | <table class="container" id="tabfive" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | </div> |
| | | <!-- 中 --> |
| | | <div class="layui-col-md" style="width: auto;height: 39%;"> |
| | | <div class="layui-row layui-col-space15" style="width: auto;height: 100%;"> |
| | | <!-- 空 --> |
| | | <div class="layui-col-md1" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p></p> |
| | | <table class="container" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | <!-- 预混间 --> |
| | | <div class="layui-col-md1 " id="divOne" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="a4"> 预混间区</p> |
| | | <table class="container" id="tabOne" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | <!-- 空 --> |
| | | <div class="layui-col-md1 " id="divOne" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="a4"> </p> |
| | | <table class="container" id="tabOne" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | <!-- 中间站--> |
| | | <div class="layui-col-md4 " id="divTwo" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="b4">中间站</p> |
| | | <table class="container" id="tabTwe" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 一步制粒2 --> |
| | | <div class="layui-col-md2 " id="divThree" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="c4">总混1</p> |
| | | <table class="" id="tabThree" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 一步制粒3 --> |
| | | <div class="layui-col-md2 " id="divFour" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="d4">总混2</p> |
| | | <table class="container" id="tabfour" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 空 --> |
| | | <div class="layui-col-md4 " id="divFour" style="height: 100%;"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="e4"></p> |
| | | <table class="container" id="tabfive" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <!-- 下 --> |
| | | <div class="layui-col-md" style="width: auto;height: 44%;"> |
| | | <div class="layui-col-md" style="width: auto;height: 24%;"> |
| | | <div class="layui-row layui-col-space15" style="width: auto;height: 100%;"> |
| | | <!-- 一、三楼下左B05、B14 --> |
| | | <div class="layui-col-md6 divOneX" id="divFive"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="e"></p> |
| | | <table class="container" id="tabfive" style="width: 100%;height: 90%;"></table> |
| | | <p id="f"></p> |
| | | <table class="container" id="tabfive2" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 一楼下中B06 --> |
| | | <div class="layui-col-md6 divOneX" id="divSix"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="f"></p> |
| | | <p id="g"></p> |
| | | <table class="container" id="tabSix" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | |
| | | <!-- 一、三下右B07、B15 --> |
| | | <div class="layui-col-md6 divOneX" id="divSeven"> |
| | | <div class="layui-card" style="height: 100%;"> |
| | | <p id="j"></p> |
| | | <p id="h"></p> |
| | | <table class="container" id="tabSeven" style="width: 100%;height: 90%;"></table> |
| | | </div> |
| | | </div> |
| | |
| | | var xianga = ""; |
| | | var xiangb = ""; |
| | | |
| | | var ones = 'layui-col-md6 divOneS'; |
| | | var onex = 'layui-col-md6 divOneX'; |
| | | var threes = 'layui-col-md6 divThreeS'; |
| | | var threex = 'layui-col-md6 divThreeX'; |
| | | var ones = ' divOneS'; |
| | | var onex = ' divOneX'; |
| | | var threes = 'divThreeS'; |
| | | var threex = 'divThreeX'; |
| | | var divOne=document.getElementById('divOne'); |
| | | var divTwo=document.getElementById('divTwo'); |
| | | var divThree=document.getElementById('divThree'); |
| | |
| | | var divFive=document.getElementById('divFive'); |
| | | var divSix=document.getElementById('divSix'); |
| | | var divSeven=document.getElementById('divSeven'); |
| | | divOne.className=ones; |
| | | divTwo.className=ones; |
| | | divThree.className=ones; |
| | | divFour.className=ones; |
| | | divFive.className=onex; |
| | | divSix.className=onex; |
| | | divSeven.className=onex; |
| | | // divOne.className=ones; |
| | | // divTwo.className=ones; |
| | | // divThree.className=ones; |
| | | // divFour.className=ones; |
| | | // divFive.className=onex; |
| | | // divSix.className=onex; |
| | | // divSeven.className=onex; |
| | | |
| | | //获取仓库下拉框信息 |
| | | synData(IP + "/Sys/GetWarehouseDic", {}, 'get', function (res) { |
| | |
| | | } |
| | | GetSlotVm($("#WareHouseNo").val(), $("#Row").val()); |
| | | }); |
| | | |
| | | // // 深度查询事件 |
| | | // form.on('select(SelectDepth)', function (data) { |
| | | // GetSlotVm($("#WareHouseNo").val(), $("#RoadwayNo").val(), $("#Row").val(), $("#Depth").val()); |
| | | // }); |
| | | |
| | | |
| | | |
| | | //获取数据渲染库位图 |
| | | function GetSlotVm(houseNo, row) { |
| | | var param = { |
| | |
| | | sendData(IP + "/Sys/GetFlatLibraryLegend", param, 'get', function (res) { |
| | | console.log(res) |
| | | if (res.code == 0) { |
| | | |
| | | $("#a").html(""); |
| | | $("#b").html(""); |
| | | $("#c").html(""); |
| | | $("#d").html(""); |
| | | $("#e").html(""); |
| | | $("#f").html(""); |
| | | $("#j").html(""); |
| | | |
| | | |
| | | $("#tabOne").html(""); |
| | | $("#tabTwe").html(""); |
| | | $("#tabThree").html(""); |
| | | $("#tabfour").html(""); |
| | | $("#tabfive").html(""); |
| | | $("#tabSix").html(""); |
| | | $("#tabSeven").html(""); |
| | | // $("#tabSix").html(""); |
| | | // $("#tabSeven").html(""); |
| | | |
| | | |
| | | var html1 = '<tr>'; |
| | |
| | | var html6 = '<tr>'; |
| | | var html7 = '<tr>'; |
| | | |
| | | // //判断一楼或三楼 |
| | | if($("#Row").val() == "1") |
| | | { |
| | | /* |
| | | |
| | | B01 1楼收货接驳区 |
| | | B02 1楼发货接驳区 |
| | | B03 1楼退货缓存区 |
| | | B04 1楼抽样缓存区 |
| | | B05 1楼换托贴标区 |
| | | B06 1楼包材暂存间 |
| | | B07 1楼车间供料区 |
| | | |
| | | B11 3楼托盘组缓存区 |
| | | B12 3楼原辅料缓存区 |
| | | B13 3楼空托盘收集区 |
| | | B14 3楼称重复验区 |
| | | B15 3楼拣货拼托区 |
| | | */ |
| | | // 一楼 |
| | | $("#a").append("B01 1楼收货接驳区"); |
| | | $("#b").append("B02 1楼发货接驳区"); |
| | | $("#c").append("B03 1楼退货缓存区"); |
| | | $("#d").append("B04 1楼抽样缓存区"); |
| | | $("#e").append("B05 1楼换托贴标区"); |
| | | $("#f").append("B06 1楼包材暂存间"); |
| | | $("#j").append("B07 1楼车间供料区"); |
| | | } |
| | | else if($("#Row").val() == "3") |
| | | { |
| | | $("#a").append("B14 3楼称重复验区"); |
| | | $("#b").append("B13 3楼空托盘收集区"); |
| | | $("#d").append("B15 3楼拣货拼托区"); |
| | | $("#e").append("B11 3楼托盘组缓存区"); |
| | | $("#j").append("B12 3楼原辅料缓存区"); |
| | | } |
| | | |
| | | var list = res.data; |
| | | var B06 = 0; |
| | | var B07 = 0; |
| | |
| | | list.forEach(item => { |
| | | |
| | | //判断一楼或三楼 |
| | | if($("#Row").val() == "1") |
| | | if($("#Row").val() == "4") |
| | | { |
| | | // 一楼 |
| | | /* |
| | | B01 tabOne html1 |
| | | B02 tabTwe html2 |
| | | B03 tabThree html3 |
| | | B04 tabfour html4 |
| | | B05 tabfive html5 |
| | | B06 tabSix html6 |
| | | B07 tabSeven html7 |
| | | */ |
| | | |
| | | //判断各个区域 |
| | | if(item.AreaNo == "B01") |
| | | { |
| | |
| | | html1 += '<td><button value=' + item.LocatNo + ' class="btnShow five" style="width: 100%;height: 100%;" ></button></td>' |
| | | } |
| | | } else { |
| | | // console.log(i, a); |
| | | html1 += '<td></td>' |
| | | } |
| | | |
| | |
| | | html2 += '<tr></tr>' |
| | | } |
| | | } |
| | | else if(item.AreaNo == "B03") |
| | | else if(item.AreaNo == "C12") |
| | | { |
| | | console.log(item); |
| | | //4排4列 |
| | | if (item != undefined) { |
| | | //判断储位标识是否为0 |
| | | if(item.Flag != '0') |
| | | { |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow filg" style="width: 100%;height: 100%;" ></button></td>' |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow filg" ></button></td>' |
| | | } |
| | | //空储位 0 |
| | | else if (item.Status == 0) { |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow zero" style="width: 100%;height: 100%;" ></button></td>' |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow zero" ></button></td>' |
| | | } |
| | | //有物品 1 |
| | | else if (item.Status == 1) { |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow one" style="width: 100%;height: 100%;" ></button></td>' |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow one" ></button></td>' |
| | | } |
| | | //入库中 2 |
| | | else if (item.Status == 2) { |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow two" style="width: 100%;height: 100%;" ></button></td>' |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow two" ></button></td>' |
| | | } |
| | | //出库中 3 |
| | | else if (item.Status == 3) { |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow three" style="width: 100%;height: 100%;" ></button></td>' |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow three" ></button></td>' |
| | | } |
| | | //移入中 4 |
| | | else if (item.Status == 4) { |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow four" style="width: 100%;height: 100%;" ></button></td>' |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow four" ></button></td>' |
| | | } |
| | | //移出中 5 |
| | | else if (item.Status == 5) { |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow five" style="width: 100%;height: 100%;" ></button></td>' |
| | | html3 += '<td><button value=' + item.LocatNo + ' class="btnShow five" ></button></td>' |
| | | } |
| | | } else { |
| | | // console.log(i, a); |
| | |
| | | } |
| | | else if(item.AreaNo == "B04") |
| | | { |
| | | |
| | | if (item != undefined) { |
| | | //判断储位标识是否为0 |
| | | if(item.Flag != '0') |
| | |
| | | html7 += '</tr>'; |
| | | $("#tabOne").append(html1); |
| | | $("#tabTwe").append(html2); |
| | | console.log(html3) |
| | | $("#tabThree").append(html3); |
| | | $("#tabfour").append(html4); |
| | | $("#tabfive").append(html5); |