From ec3e9c8b3cd8d31359ce0a25e8eb97d84a55a284 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期五, 10 七月 2020 09:10:01 +0800
Subject: [PATCH] #

---
 src/main/webapp/views/pdaCe/index.html |  298 +++++++++++++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 255 insertions(+), 43 deletions(-)

diff --git a/src/main/webapp/views/pdaCe/index.html b/src/main/webapp/views/pdaCe/index.html
index f00e11f..296d1b8 100644
--- a/src/main/webapp/views/pdaCe/index.html
+++ b/src/main/webapp/views/pdaCe/index.html
@@ -12,36 +12,44 @@
         }
 
         .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 {
@@ -64,6 +72,41 @@
             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>
@@ -73,36 +116,55 @@
 </div>
 <div>
     <span>鐗╂枡</span>
-    <input type="text" id="matnr" onkeyup="find(this)" autocomplete="off">
+    <input type="text" id="matNo" onkeyup="find(this)" autocomplete="off">
 </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 onclick="comb()">缁勬墭</button>
     <span id="tips"></span>
 </div>
+
+<!-- 璇︽儏 -->
+<div class="form-box" id="mat-detail">
+    <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-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 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");
@@ -110,36 +172,88 @@
     var btnCon = document.getElementById("btn-con");
     var tipDom = document.getElementById("tips");
 
+    var matDetail = document.getElementById("mat-detail");
+    var matName = document.getElementById("matName");
+    var str1 = document.getElementById("str1");
+    var count = document.getElementById("count");
+
+    matDetail.style.display = 'none';
+    var initMatCount = 1;
+
     // 鏌ヨ鐗╂祦
     function find(el) {
         httpRequest({
             httpUrl: baseUrl + "/matCode/auth",
             type: 'post',
+            headers: [{token: getCookie('token')}],
             data: {
                 id: el.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.value = initMatCount;
                 } 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)
             }
+        })
+    }
 
+    // 缁勬墭
+    function comb() {
+        var barcode = code.value;
+        if (isEmpty(barcode)) {
+            tips("鎵樼洏鏉$爜涓虹┖", true);
+            // document.getElementById("code").focus();
+            return;
+        }
+        if (matData.length === 0) {
+            tips("璇锋彁鍙栫墿鏂�", true);
+            return;
+        }
+        console.log(JSON.stringify({
+            barcode: barcode,
+            combMats: matData
+        }))
+        httpRequest({
+            httpUrl: baseUrl+"/mobile/comb/form",
+            type: 'post',
+            headers: [{token: getCookie('token')}],
+            data: {
+                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 +264,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 +325,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 +402,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 = '';
@@ -229,7 +430,18 @@
         }else if(httpType === 'POST'){
             xmlhttp.open("POST",httpUrl,async);
             //鍙戦�佸悎閫傜殑璇锋眰澶翠俊鎭�
-            xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+            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(requestData);
         }
     }

--
Gitblit v1.9.1