From 45d87ae7a3ea22f298d073ee35fd067d7fd72eb4 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@63.com> Date: 星期一, 28 三月 2022 09:35:40 +0800 Subject: [PATCH] # --- src/main/webapp/views/pdaCe/index.html | 358 +++++++++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 308 insertions(+), 50 deletions(-) diff --git a/src/main/webapp/views/pdaCe/index.html b/src/main/webapp/views/pdaCe/index.html index f00e11f..f5c7734 100644 --- a/src/main/webapp/views/pdaCe/index.html +++ b/src/main/webapp/views/pdaCe/index.html @@ -3,45 +3,55 @@ <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> + <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: auto; + 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; } - #mat-msg-table td, #mat-msg-table th { - border: 1px solid #f1f1f1; - color: #666; - height: 15px; - line-height: 15px; + #tthead { + padding-top: 4px; + background-color: #ececec; + height: 18px; } - #mat-msg-table thead th { - background-color: #fff; - width: 400px; - font-weight: normal; + #tthead span { + border-right: 1px solid #b3b3b3; + float: left; + width: 24%; } - #mat-msg-table tr:nth-child(odd) { - background: #fff; + #ttbody { + padding-top: 4px; } - #mat-msg-table tr:nth-child(even) { - background: #fff; + #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 { @@ -56,6 +66,7 @@ } #tips { font-size: 12px; + margin-top: 2px; margin-left: 10px; display: inline-block; vertical-align: middle; @@ -64,82 +75,201 @@ 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="matnr" onkeyup="find(this)" autocomplete="off"> + <input type="text" id="matNo" onkeyup="find(this)" autocomplete="off"> + <button onclick="find()">鏌ヨ</button> </div> -<!-- 鍫嗗灈鏈虹姸鎬� --> <div class="mat-msg" id="mat-msg-id"> - <table id="mat-msg-table"> - <thead id="tthead"> - <tr> - <th>缂栫爜</th> - <th>鍚嶇О</th> - <th>鍗曚綅</th> - <th>鏁伴噺</th> - </tr> - </thead> - <tbody id="ttbody"> - </tbody> - </table> + <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 >缁勬墭</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> - // initCrnMsgTable() + var matMsgTableBlankRows = 0; // 绌虹櫧琛屾暟 + var matData = []; // 琛ㄦ牸鏁版嵁 var code = document.getElementById("code") - var matnr = document.getElementById("matnr") + 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: el.value + 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 { - alert(res.msg); + tips(res.msg, true) } - }) } - initCrnMsgTable(); - // 鍫嗗灈鏈烘暟鎹〃鑾峰彇 ----- 琛ㄤ簩 + // 缁勬墭 + 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 = tthead.offsetHeight; + var one = 15; var total = matMsg.offsetHeight; var count = total / one; count = parseInt(count) - 1; @@ -150,20 +280,54 @@ } var html = ""; for (var i = 0; i < line; i ++){ - html += " <tr>\n" + - " <td>1</td>\n" + - " <td>2</td>\n" + - " <td>3</td>\n" + - " <td>4</td>\n" + - " </tr>\n"; + 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 = ""; - matnr.value = ""; + matNo.value = ""; + cancel(); + while(ttbody.hasChildNodes()) { + ttbody.removeChild(ttbody.firstChild); + + } } /** @@ -177,6 +341,57 @@ 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){//鑾峰彇鎸囧畾鍚嶇О鐨刢ookie鐨勫�� + //澶氫釜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 ""; + } + } } @@ -203,6 +418,8 @@ var httpUrl = paramObj.httpUrl || ''; /*鏄惁寮傛璇锋眰*/ var async = paramObj.async || true; + /*璇锋眰澶村弬鏁�*/ + var headerData = paramObj.headers || []; /*璇锋眰鍙傛暟--post璇锋眰鍙傛暟鏍煎紡涓猴細foo=bar&lorem=ipsum*/ var paramData = paramObj.data || []; var requestData = ''; @@ -210,7 +427,6 @@ requestData += name + '='+ paramData[name] + '&'; } requestData = requestData === '' ? '' : requestData.substring(0,requestData.length - 1); - /*璇锋眰鎺ユ敹*/ xmlhttp.onreadystatechange = function() { if(xmlhttp.readyState === 4 && xmlhttp.status === 200) { @@ -229,9 +445,51 @@ }else if(httpType === 'POST'){ xmlhttp.open("POST",httpUrl,async); //鍙戦�佸悎閫傜殑璇锋眰澶翠俊鎭� - xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); - xmlhttp.send(requestData); + 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("鈶� 鎸塅1杈撳叆鏉$爜\n" + + "鈶� 鎸塅2杈撳叆鍟嗗搧缂栧彿锛屾寜ENTER鏌ヨ锛岄�夋嫨鏁伴噺鍚庢彁鍙朶n" + + "鈶� 鎸塅3寮�濮嬬粍鎵榎n" + + "鍏跺畠锛氭寜F5鍒锋柊椤甸潰"); + } </script> </html> \ No newline at end of file -- Gitblit v1.9.1