|  |  |  | 
|---|
|  |  |  | <meta name="viewport" content="width=device-width, target-densitydpi=high-dpi, initial-scale=1.0, user-scalable=no"/> | 
|---|
|  |  |  | <title>组托</title> | 
|---|
|  |  |  | <link rel="stylesheet" href="../../static/layui/css/layui.css" media="all"> | 
|---|
|  |  |  | <link rel="stylesheet" href="../../static/css/pda.css" media="all"> | 
|---|
|  |  |  | <script type="text/javascript" src="../../static/js/jquery/jquery-3.3.1.min.js"></script> | 
|---|
|  |  |  | <script type="text/javascript" src="../../static/layui/layui.js" charset="utf-8"></script> | 
|---|
|  |  |  | <script type="text/javascript" src="../../static/js/common.js" charset="utf-8"></script> | 
|---|
|  |  |  | <script type="text/javascript" src="../../static/js/cool.js" charset="utf-8"></script> | 
|---|
|  |  |  | <script type="text/javascript" src="../../static/js/handlebars/handlebars-v4.5.3.js"></script> | 
|---|
|  |  |  | <style> | 
|---|
|  |  |  | * { | 
|---|
|  |  |  | font-family: microsoft yahei,serif; | 
|---|
|  |  |  | margin: 0; | 
|---|
|  |  |  | padding: 0; | 
|---|
|  |  |  | box-sizing: border-box; | 
|---|
|  |  |  | -webkit-box-sizing: border-box; | 
|---|
|  |  |  | -moz-box-sizing: border-box; | 
|---|
|  |  |  | font-size: 11px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | html { | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  | background-color: #f1f1f1; | 
|---|
|  |  |  | padding: 5px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | body { | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  | background-color: #fff; | 
|---|
|  |  |  | border-radius: 5px; | 
|---|
|  |  |  | box-shadow: 0 0 3px rgba(0,0,0,.3); | 
|---|
|  |  |  | padding: 5px; | 
|---|
|  |  |  | position: relative; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /* 头部 */ | 
|---|
|  |  |  | header { | 
|---|
|  |  |  | padding: 5px 0; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .layui-form-label { | 
|---|
|  |  |  | width: initial; | 
|---|
|  |  |  | padding: 6px 10px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | #code { | 
|---|
|  |  |  | width: 70%; | 
|---|
|  |  |  | height: 30px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | header button { | 
|---|
|  |  |  | height: 20px; | 
|---|
|  |  |  | width: 70px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /* layer */ | 
|---|
|  |  |  | .layui-layer-title { | 
|---|
|  |  |  | font-size: 11px; | 
|---|
|  |  |  | height: 20px; | 
|---|
|  |  |  | line-height: 20px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /* 主体 */ | 
|---|
|  |  |  | .layui-table, .layui-table-view { | 
|---|
|  |  |  | margin: 0; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .layui-table-view .layui-table td, .layui-table-view .layui-table th { | 
|---|
|  |  |  | padding: 0; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .layui-table-cell { | 
|---|
|  |  |  | padding: 0; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /* 尾部 */ | 
|---|
|  |  |  | footer { | 
|---|
|  |  |  | position: absolute; | 
|---|
|  |  |  | bottom: 5px; | 
|---|
|  |  |  | text-align: center; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .layui-btn-container .layui-btn { | 
|---|
|  |  |  | margin-left: 10px; | 
|---|
|  |  |  | margin-bottom: 2px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  | </head> | 
|---|
|  |  |  | <body> | 
|---|
|  |  |  | <!-- 头部 --> | 
|---|
|  |  |  | <header> | 
|---|
|  |  |  | <div class="layui-input-inline"> | 
|---|
|  |  |  | <label class="layui-form-label">条码</label> | 
|---|
|  |  |  | <input class="layui-input" type="text" id="code" placeholder="扫码/输入" autocomplete="off"> | 
|---|
|  |  |  | <label class="layui-form-label">pack码</label> | 
|---|
|  |  |  | <input class="layui-input" type="number" id="code" onkeyup="findCode(this)" oninput="if(value.length>8)value=value.slice(0,8)" placeholder="扫码 / 输入" autocomplete="off"> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div style="margin: 5px 5px"> | 
|---|
|  |  |  | <button type="button" class="layui-btn layui-btn-normal  layui-btn-xs" onclick="getMat()"><i class="layui-icon">+</i>提取</button> | 
|---|
|  |  |  | <button id="mat-btn" type="button" class="layui-btn layui-btn-normal" onclick="getMat()"><i class="layui-icon">+</i>提取</button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </header> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | 
|---|
|  |  |  | <!-- 尾部 --> | 
|---|
|  |  |  | <footer> | 
|---|
|  |  |  | <div class="layui-btn-container"> | 
|---|
|  |  |  | <button type="button" class="layui-btn  layui-btn-xs">重置</button> | 
|---|
|  |  |  | <button type="button" class="layui-btn layui-btn-normal  layui-btn-xs">组托</button> | 
|---|
|  |  |  | <button type="button" id="reset-btn" class="layui-btn layui-btn-primary" onclick="reset()">重置</button> | 
|---|
|  |  |  | <button type="button" id="comb-btn" class="layui-btn layui-btn-normal " onclick="comb()" style="margin-left: 20px">组托</button> | 
|---|
|  |  |  | <span id="tips"></span> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </footer> | 
|---|
|  |  |  | </body> | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | var tableIns; | 
|---|
|  |  |  | layui.use(['table','laydate', 'form'], function() { | 
|---|
|  |  |  | var table = layui.table; | 
|---|
|  |  |  | var $ = layui.jquery; | 
|---|
|  |  |  | var layer = layui.layer; | 
|---|
|  |  |  | var layDate = layui.laydate; | 
|---|
|  |  |  | var form = layui.form; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | tableIns = table.render({ | 
|---|
|  |  |  | elem: '#chooseData', | 
|---|
|  |  |  | data: [], | 
|---|
|  |  |  | even: true, | 
|---|
|  |  |  | limit: 500, | 
|---|
|  |  |  | cellMinWidth: 50, | 
|---|
|  |  |  | cols: [[ | 
|---|
|  |  |  | {fixed: 'left', field: 'count', title: '数量', align: 'center', edit:'text',  style:'color: blue;font-weight: bold', width:50}, | 
|---|
|  |  |  | {field: 'matNo', align: 'center', title: '物料编码'}, | 
|---|
|  |  |  | {field: 'matName', align: 'center', title: '物料名称'} | 
|---|
|  |  |  | {fixed: 'left', align: 'center', field: 'count', title: '数量', style:'color: blue', width:50}, | 
|---|
|  |  |  | {field: 'matnr', align: 'center', title: '商品编号'}, | 
|---|
|  |  |  | {field: 'maktx', align: 'center', title: '商品名称'} | 
|---|
|  |  |  | ]], | 
|---|
|  |  |  | done: function (res, curr, count) { | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | window.onload = function(){document.getElementById("code").focus();} | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function findCode(el) { | 
|---|
|  |  |  | if (el.value.length === 8) { | 
|---|
|  |  |  | $('#mat-btn').focus(); | 
|---|
|  |  |  | getMat(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | var matCodeLayerIdx; | 
|---|
|  |  |  | function getMat() { | 
|---|
|  |  |  | matCodeLayerIdx = layer.open({ | 
|---|
|  |  |  | type: 2, | 
|---|
|  |  |  | title: '物料', | 
|---|
|  |  |  | title: '提取物料', | 
|---|
|  |  |  | shade: [0.3,'#000'], | 
|---|
|  |  |  | area: ['90%', '90%'], | 
|---|
|  |  |  | area: ['90%', '80%'], | 
|---|
|  |  |  | content: 'matQuery.html', | 
|---|
|  |  |  | success: function(layero, index){ | 
|---|
|  |  |  | $('.layui-layer-title').css('height', '20px').css('line-height', '20px').css('font-size', '12px').css('padding-left', '10px') | 
|---|
|  |  |  | $('.layui-layer-setwin').css("top", '2px').css('right', '3px') | 
|---|
|  |  |  | $('.layui-layer-title').css('font-size', '16px'); | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | end: function () { | 
|---|
|  |  |  | $('#mat-btn').focus(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // 添加表格数据 | 
|---|
|  |  |  | var matData = []; | 
|---|
|  |  |  | function addTableData(data) { | 
|---|
|  |  |  | if (isEmpty(data.maktx)){ | 
|---|
|  |  |  | tips("提取失败", true); | 
|---|
|  |  |  | return; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | let toPush = true; | 
|---|
|  |  |  | for (var j=0;j<matData.length;j++){ | 
|---|
|  |  |  | if (data.matnr === matData[j].matnr) { | 
|---|
|  |  |  | matData[j].count = Number(matData[j].count) + Number(data.count); | 
|---|
|  |  |  | toPush  = false; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (toPush) { | 
|---|
|  |  |  | matData.push(data); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | tips("提取成功"); | 
|---|
|  |  |  | tableIns.reload({data: matData}); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // 重置 | 
|---|
|  |  |  | function reset() { | 
|---|
|  |  |  | $('#code').val(""); | 
|---|
|  |  |  | matData = []; | 
|---|
|  |  |  | tableIns.reload({data: matData}); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // 组托 | 
|---|
|  |  |  | function comb() { | 
|---|
|  |  |  | let barcode = $('#code').val(); | 
|---|
|  |  |  | if (isEmpty(barcode)) { | 
|---|
|  |  |  | tips("托盘pack码为空", true); | 
|---|
|  |  |  | // document.getElementById("code").focus(); | 
|---|
|  |  |  | return; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (barcode.length !== 8) { | 
|---|
|  |  |  | tips("pack码必须为8位", true); | 
|---|
|  |  |  | return; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (matData.length === 0) { | 
|---|
|  |  |  | tips("请提取物料", true); | 
|---|
|  |  |  | return; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | $.ajax({ | 
|---|
|  |  |  | url: baseUrl+"/mobile/comb/auth", | 
|---|
|  |  |  | headers: {'token': localStorage.getItem('token')}, | 
|---|
|  |  |  | data: JSON.stringify({ | 
|---|
|  |  |  | barcode: barcode, | 
|---|
|  |  |  | combMats: matData | 
|---|
|  |  |  | }), | 
|---|
|  |  |  | contentType:'application/json;charset=UTF-8', | 
|---|
|  |  |  | method: 'POST', | 
|---|
|  |  |  | async: false, | 
|---|
|  |  |  | success: function (res) { | 
|---|
|  |  |  | if (res.code === 200) { | 
|---|
|  |  |  | reset(); | 
|---|
|  |  |  | tips("组托成功") | 
|---|
|  |  |  | } else if (res.code === 403) { | 
|---|
|  |  |  | top.location.href = baseUrl + "/pda"; | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | tips(res.msg, true) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 提示信息 | 
|---|
|  |  |  | * @param msg 提示内容 | 
|---|
|  |  |  | * @param warn true:红色字体 | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | function tips(msg, warn) { | 
|---|
|  |  |  | // var tips = $('#tips'); | 
|---|
|  |  |  | // tips.html(msg); | 
|---|
|  |  |  | // tips.css("color", warn?"red":'#666'); | 
|---|
|  |  |  | layer.msg(msg, {icon: warn?2:1}) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | document.onkeyup = function (e) { | 
|---|
|  |  |  | if (window.event)//如果window.event对象存在,就以此事件对象为准 | 
|---|
|  |  |  | e = window.event; | 
|---|
|  |  |  | var key = e.charCode || e.keyCode; | 
|---|
|  |  |  | if (key === 115) { | 
|---|
|  |  |  | $("#comb-btn").focus(); | 
|---|
|  |  |  | comb(); | 
|---|
|  |  |  | } else if (key === 113) { | 
|---|
|  |  |  | $("#code").val(""); | 
|---|
|  |  |  | $("#code").focus(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | </html> | 
|---|
|  |  |  | </html> | 
|---|