<!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> 
 |