| <!DOCTYPE html> | 
| <html lang="en"> | 
| <head> | 
|     <meta charset="UTF-8"> | 
|     <meta name="viewport" content="width=device-width, target-densitydpi=high-dpi, initial-scale=1.0, user-scalable=no"/> | 
|     <title>浙江中扬储存设备有限公司</title> | 
|     <script type="text/javascript" src="../../static/js/common.js" charset="utf-8"></script> | 
|     <style> | 
|         * { | 
|             font-size: 12px; | 
|         } | 
|         html { | 
|             background-color: #fff; | 
|         } | 
|   | 
|         .mat-msg { | 
|             overflow-y: scroll; | 
|             margin-top: 10px; | 
|             height: 115px; | 
|             background-color: #fff; | 
|             border-radius: 5px; | 
|             border: 1px solid #c2c2c2; | 
|         } | 
|         #mat-msg-table { | 
|             font-size: 12px; | 
|             border-collapse: collapse; | 
|             margin: 0 auto; | 
|             text-align: center; | 
|         } | 
|         #tthead { | 
|             padding-top: 4px; | 
|             background-color: #ececec; | 
|             height: 18px; | 
|         } | 
|         #tthead span { | 
|             border-right: 1px solid #b3b3b3; | 
|             float: left; | 
|             width: 24%; | 
|         } | 
|         #ttbody { | 
|             padding-top: 4px; | 
|         } | 
|         #ttbody div { | 
|             content: ""; | 
|             clear: both; | 
|             display: table; | 
|         } | 
|         #ttbody span { | 
|             border-right: 1px solid #b3b3b3; | 
|             float: left; | 
|             width: 22%; | 
|             overflow:hidden; | 
|             white-space:nowrap; | 
|             text-overflow:ellipsis; | 
|         } | 
|   | 
|         #btn-con { | 
|             padding-left: 10px; | 
|             position: absolute; | 
|             bottom: 10px; | 
|             width: 100%; | 
|         } | 
|         #btn-con button { | 
|             display: inline-block; | 
|             vertical-align: middle; | 
|         } | 
|         #tips { | 
|             font-size: 12px; | 
|             margin-top: 2px; | 
|             margin-left: 10px; | 
|             display: inline-block; | 
|             vertical-align: middle; | 
|             width: 90px; | 
|             overflow:hidden; | 
|             white-space:nowrap; | 
|             text-overflow:ellipsis; | 
|         } | 
|   | 
|         /* 详情 */ | 
|         .form-box { | 
|             margin-top: 10px; | 
|             padding: 15px 0 10px 0; | 
|             text-align: center; | 
|             border: 1px solid #BBBBBB; | 
|         } | 
|   | 
|         .form-item { | 
|             margin-bottom: 5px; | 
|         } | 
|         .form-box span { | 
|         } | 
|         .form-box input { | 
|             overflow:hidden; | 
|             white-space:nowrap; | 
|             text-overflow:ellipsis; | 
|         } | 
|         .form-count button { | 
|             width: 25px; | 
|             height: 20px; | 
|         } | 
|         .form-count input { | 
|             margin: 0 7px; | 
|             width: 40px; | 
|         } | 
|         .form-btn-con { | 
|             margin-top: 10px; | 
|         } | 
|         .form-btn-con button { | 
|             padding: 4px 0; | 
|             height: 25px; | 
|             margin: 0 15px; | 
|         } | 
|     </style> | 
| </head> | 
| <body> | 
| <button onclick="help()" style="padding: 0 3px; position: absolute; top: 0%; right: 0%">?</button> | 
| <div> | 
|     <span>条码</span> | 
|     <input type="text" id="code"> | 
| </div> | 
| <div> | 
|     <span>物料</span> | 
|     <input type="text" id="matNo" onkeyup="find(this)" autocomplete="off"> | 
|     <button onclick="find()">查询</button> | 
| </div> | 
|   | 
| <div class="mat-msg" id="mat-msg-id"> | 
|     <div id="mat-msg-table"> | 
|         <div id="tthead"> | 
|             <span>编码</span> | 
|             <span>名称</span> | 
|             <span>单位</span> | 
|             <span>数量</span> | 
|         </div> | 
|         <div id="ttbody"> | 
|         </div> | 
|     </div> | 
| </div> | 
|   | 
| <div id="btn-con"> | 
|     <button style="margin-right: 20px" onclick="reset()">重置</button> | 
|     <button id="comb" onclick="comb()">组托</button> | 
|     <span id="tips"></span> | 
| </div> | 
|   | 
| <!-- 详情 --> | 
| <div class="form-box" id="mat-detail"> | 
|     <div class="form-item form-count"> | 
|         <span style="margin-right: 10px">数量</span> | 
|         <button onclick="reduce()">-</button><input id="count" type="number" style="text-align: center"><button onclick="add()">+</button> | 
|     </div> | 
|     <div class="form-item"> | 
|         <span>名称</span> | 
|         <input id="matName" type="text" disabled="disabled" style="background-color: #ececec;color: #000"> | 
|     </div> | 
|     <div class="form-item"> | 
|         <span>单位</span> | 
|         <input id="str1" type="text" disabled="disabled" style="background-color: #ececec;color: #000; text-align: center;"> | 
|     </div> | 
|     <div class="form-item form-btn-con"> | 
|         <button id="confirm" onclick="confirm()">提取</button> | 
|         <button id="cancel" onclick="cancel()" style="background-color: #fff">取消</button> | 
|     </div> | 
| </div> | 
|   | 
|   | 
| </body> | 
| <script> | 
|   | 
|     var matMsgTableBlankRows = 0;   // 空白行数 | 
|     var matData = []; // 表格数据 | 
|     var code = document.getElementById("code") | 
|     var matNo = document.getElementById("matNo") | 
|     var matMsg = document.getElementById("mat-msg-id"); | 
|     var matMsgTable = document.getElementById("mat-msg-table"); | 
|     var tthead = document.getElementById("tthead"); | 
|     var ttbody = document.getElementById("ttbody"); | 
|     var btnCon = document.getElementById("btn-con"); | 
|     var tipDom = document.getElementById("tips"); | 
|     var combBtn = document.getElementById("comb"); | 
|   | 
|     var matDetail = document.getElementById("mat-detail"); | 
|     var matName = document.getElementById("matName"); | 
|     var str1 = document.getElementById("str1"); | 
|     var count = document.getElementById("count"); | 
|     var confirmBtn = document.getElementById("confirm"); | 
|   | 
|     matDetail.style.display = 'none'; | 
|     var initMatCount = 1; | 
|     window.onload = function(){matMsg.focus();} | 
|   | 
|     // 查询物流 | 
|     function find(el) { | 
|         httpRequest({ | 
|             httpUrl: baseUrl + "/matCode/auth", | 
|             type: 'post', | 
|             headers: [{token: getCookie('token')}], | 
|             data: { | 
|                 id: matNo.value | 
|             }, | 
|         }, function (res) { | 
|             if (res.code === 200) { | 
|                 if (res.data != null) { | 
|                     // 样式 | 
|                     matMsg.style.display = 'none'; | 
|                     btnCon.style.display = 'none'; | 
|                     matDetail.style.display = 'block'; | 
|                     // 填充数据 | 
|                     matName.value = res.data.matName; | 
|                     str1.value = res.data.str1; | 
|   | 
|                     // count.focus(); | 
|                     count.value = initMatCount; | 
|                     confirmBtn.focus(); | 
|                 } else { | 
|                     matMsg.style.display = 'block'; | 
|                     btnCon.style.display = 'block'; | 
|                     matDetail.style.display = 'none'; | 
|                 } | 
|             } else if (res.code === 403) { | 
|                 window.location.href = baseUrl + "/pda/ce"; | 
|             } else { | 
|                 tips(res.msg, true) | 
|             } | 
|         }) | 
|     } | 
|   | 
|     // 组托 | 
|     function comb() { | 
|         var barcode = code.value; | 
|         if (isEmpty(barcode)) { | 
|             tips("请输入托盘条码", true); | 
|             // document.getElementById("code").focus(); | 
|             return; | 
|         } | 
|         if (barcode.length !== 8) { | 
|             tips("条码必须为8位", true); | 
|             // document.getElementById("code").focus(); | 
|             return; | 
|         } | 
|         if (matData.length === 0) { | 
|             tips("请提取物料", true); | 
|             return; | 
|         } | 
|         httpRequest({ | 
|             httpUrl: baseUrl+"/mobile/comb/auth", | 
|             type: 'post', | 
|             headers: [ | 
|                 {token: getCookie('token')} | 
|                 ,{'Content-type':'application/json;charset=UTF-8',} | 
|                 ], | 
|             data: JSON.stringify({ | 
|                 barcode: barcode, | 
|                 combMats: matData | 
|             }) , | 
|         }, function (res) { | 
|             if (res.code === 200) { | 
|                 reset(); | 
|                 tips("组托成功") | 
|             } else if (res.code === 403) { | 
|                 window.location.href = baseUrl + "/pda/ce"; | 
|             } else { | 
|                 tips(res.msg, true) | 
|             } | 
|         }) | 
|     } | 
|   | 
|     // initCrnMsgTable(); | 
|     function initCrnMsgTable(row) { | 
|         var line; | 
|         if (row === undefined){ | 
|             var one = 15; | 
|             var total = matMsg.offsetHeight; | 
|             var count = total / one; | 
|             count = parseInt(count) - 1; | 
|             matMsgTableBlankRows = count; | 
|             line = count; | 
|         } else { | 
|             line = row; | 
|         } | 
|         var html = ""; | 
|         for (var i = 0; i < line; i ++){ | 
|             html += " <div>\n" + | 
|                 "       <span></span>\n" + | 
|                 "       <span></span>\n" + | 
|                 "       <span></span>\n" + | 
|                 "       <span></span>\n" + | 
|                 "     </div>\n"; | 
|         } | 
|         ttbody.innerHTML = html; | 
|     } | 
|   | 
|     // 添加表格数据 | 
|     function addTableData(data) { | 
|         if (isEmpty(data.matName)){ | 
|             tips("提取失败"); | 
|             return; | 
|         } | 
|         var toPush = true; | 
|         for (var j=0;j<matData.length;j++){ | 
|             if (data.matNo === matData[j].matNo) { | 
|                 matData[j].count = Number(matData[j].count) + Number(data.count); | 
|                 toPush  = false; | 
|             } | 
|         } | 
|         if (toPush) { | 
|             matData.push(data); | 
|         } | 
|         var html = ""; | 
|         for (var i=0;i<matData.length;i++) { | 
|             html += " <div class='table-data'>\n" + | 
|                 "       <span>" + matData[i].matNo + "</span>\n" + | 
|                 "       <span>" + matData[i].matName + "</span>\n" + | 
|                 "       <span>" + matData[i].str1 + "</span>\n" + | 
|                 "       <span>" + matData[i].count + "</span>\n" + | 
|                 "     </div>\n"; | 
|         } | 
|   | 
|         ttbody.innerHTML = html; | 
|     } | 
|   | 
|     // 重置 | 
|     function reset() { | 
|         code.value = ""; | 
|         matNo.value = ""; | 
|         cancel(); | 
|         while(ttbody.hasChildNodes()) { | 
|             ttbody.removeChild(ttbody.firstChild); | 
|   | 
|         } | 
|     } | 
|   | 
|     /** | 
|      * 提示信息 | 
|      * @param msg 提示内容 | 
|      * @param warn true:红色字体 | 
|      */ | 
|     function tips(msg, warn) { | 
|         tipDom.innerText = msg; | 
|         if (warn) { | 
|             tipDom.style.color = "red"; | 
|         } else { | 
|             tipDom.style.color = "#000"; | 
|         } | 
|     } | 
|   | 
|     /** | 
|      * 详情 | 
|      */ | 
|     // 提取 | 
|     function confirm() { | 
|         addTableData({ | 
|             matNo: matNo.value, | 
|             matName: matName.value, | 
|             str1: str1.value, | 
|             count: count.value | 
|         }) | 
|         cancel(); | 
|         tips("提取成功"); | 
|     } | 
|     // 取消 | 
|     function cancel() { | 
|         matNo.value = ""; | 
|         matName.value = ""; | 
|         str1.value = ""; | 
|         count.value = initMatCount; | 
|         matMsg.style.display = 'block'; | 
|         btnCon.style.display = 'block'; | 
|         matDetail.style.display = 'none'; | 
|         tips(""); | 
|     } | 
|   | 
|     function add() { | 
|         count.value = Number(count.value) + 1; | 
|     } | 
|     function reduce() { | 
|         if (count.value <= initMatCount) { | 
|             return; | 
|         } | 
|         count.value = count.value - 1; | 
|     } | 
|   | 
|     //获取 cookie | 
|     function getCookie(objName){//获取指定名称的cookie的值 | 
|         //多个cookie 保存的时候是以 ;空格  分开的 | 
|         var arrStr = document.cookie.split("; "); | 
|         for (var i = 0; i < arrStr.length; i++) { | 
|             var temp = arrStr[i].split("="); | 
|             if (temp[0] === objName){ | 
|                 return decodeURIComponent(temp[1]); | 
|             }else{ | 
|                 return ""; | 
|             } | 
|   | 
|         } | 
|     } | 
|   | 
|     function httpRequest(paramObj,fun,errFun) { | 
|         var xmlhttp = null; | 
|         /*创建XMLHttpRequest对象, | 
|          *老版本的 Internet Explorer(IE5 和 IE6)使用 ActiveX 对象:new ActiveXObject("Microsoft.XMLHTTP") | 
|          * */ | 
|         if(window.XMLHttpRequest) { | 
|             xmlhttp = new XMLHttpRequest(); | 
|         }else if(window.ActiveXObject) { | 
|             xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); | 
|         } | 
|         /*判断是否支持请求*/ | 
|         if(xmlhttp == null) { | 
|             alert('你的浏览器不支持XMLHttp'); | 
|             return; | 
|         } | 
|         /*请求方式,并且转换为大写*/ | 
|         var httpType = (paramObj.type || 'GET').toUpperCase(); | 
|         /*数据类型*/ | 
|         var dataType = paramObj.dataType || 'json'; | 
|         /*请求接口*/ | 
|         var httpUrl = paramObj.httpUrl || ''; | 
|         /*是否异步请求*/ | 
|         var async = paramObj.async || true; | 
|         /*请求头参数*/ | 
|         var headerData = paramObj.headers || []; | 
|         /*请求参数--post请求参数格式为:foo=bar&lorem=ipsum*/ | 
|         var paramData = paramObj.data || []; | 
|         var requestData = ''; | 
|         for(var name in paramData) { | 
|             requestData += name + '='+ paramData[name] + '&'; | 
|         } | 
|         requestData = requestData === '' ? '' : requestData.substring(0,requestData.length - 1); | 
|         /*请求接收*/ | 
|         xmlhttp.onreadystatechange = function() { | 
|             if(xmlhttp.readyState === 4 && xmlhttp.status === 200) { | 
|                 /*成功回调函数*/ | 
|                 fun(JSON.parse(xmlhttp.responseText)); | 
|             }else{ | 
|                 /*失败回调函数*/ | 
|                 errFun; | 
|             } | 
|         } | 
|   | 
|         /*接口连接,先判断连接类型是post还是get*/ | 
|         if(httpType === 'GET') { | 
|             xmlhttp.open("GET",httpUrl,async); | 
|             xmlhttp.send(null); | 
|         }else if(httpType === 'POST'){ | 
|             xmlhttp.open("POST",httpUrl,async); | 
|             //发送合适的请求头信息 | 
|             var defaultContentType = true; | 
|             for (var i=0;i<headerData.length;i++) { | 
|                 for(var key in headerData[i]) { | 
|                     if (key === "Content-type") { | 
|                         defaultContentType = false; | 
|                     } | 
|                     xmlhttp.setRequestHeader(key, headerData[i][key]); | 
|                 } | 
|             } | 
|             if (defaultContentType) { | 
|                 xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | 
|             } | 
|             xmlhttp.send(defaultContentType?requestData:paramData); | 
|         } | 
|     } | 
|   | 
|     document.onkeyup = function (e) { | 
|         if (window.event)//如果window.event对象存在,就以此事件对象为准 | 
|             e = window.event; | 
|         var key = e.charCode || e.keyCode; | 
|         if (key === 112) { | 
|             code.focus(); | 
|         } else if (key === 113) { | 
|             matNo.focus(); | 
|         } else if (key === 114) { | 
|             combBtn.focus(); | 
|         } else if (key === 13) { | 
|             confirmBtn.focus(); | 
|         } | 
|     } | 
|   | 
|     document.onkeydown = function (e) { | 
|         if (window.event)//如果window.event对象存在,就以此事件对象为准 | 
|             e = window.event; | 
|         var key = e.charCode || e.keyCode; | 
|         if (key === 114) { | 
|             comb() | 
|         } | 
|     } | 
|   | 
|     function help() { | 
|         window.alert("① 按F1输入条码\n" + | 
|             "② 按F2输入物料号,按ENTER查询,选择数量后提取\n" + | 
|             "③ 按F3开始组托\n" + | 
|             "其它:按F5刷新页面"); | 
|     } | 
| </script> | 
| </html> |