<!DOCTYPE html> 
 | 
<html lang="en"> 
 | 
<head> 
 | 
    <meta charset="UTF-8"> 
 | 
    <meta name="viewport" content="width=device-width, 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> 
 | 
        .layui-input-block { 
 | 
            margin-left: 60px; 
 | 
        } 
 | 
        main { 
 | 
            height: 200px; 
 | 
        } 
 | 
        /* 状态 */ 
 | 
        #status { 
 | 
            padding-left: 2px; 
 | 
            line-height: 30px; 
 | 
        } 
 | 
        .status-0 { 
 | 
            color: orange; 
 | 
        } 
 | 
        .status-1 { 
 | 
            color: red; 
 | 
        } 
 | 
        .status-2 { 
 | 
            color: red; 
 | 
        } 
 | 
        .status-3 { 
 | 
            color: green; 
 | 
        } 
 | 
        /* 客户 */ 
 | 
        #custName { 
 | 
            padding-left: 2px; 
 | 
            line-height: 30px; 
 | 
            font-size: 14px; 
 | 
        } 
 | 
        /* 主体 */ 
 | 
        main { 
 | 
            border: 1px solid gainsboro; 
 | 
            text-align: center; 
 | 
            padding-bottom: 15px; 
 | 
        } 
 | 
        main hr { 
 | 
            width: 80%; 
 | 
            margin: 5px 0; 
 | 
            display: inline-block 
 | 
        } 
 | 
        .pakout-item { 
 | 
            padding: 10px; 
 | 
        } 
 | 
        .item-header { 
 | 
            text-align: left; 
 | 
            padding-left: 20px 
 | 
        } 
 | 
        .item-content { 
 | 
            padding: 15px 
 | 
        } 
 | 
    </style> 
 | 
</head> 
 | 
<body> 
 | 
<!-- 头部 --> 
 | 
<header> 
 | 
    <div class="layui-input-inline"> 
 | 
        <label class="layui-form-label" style="width: 84px">单据编号</label> 
 | 
        <input class="layui-input" type="text" id="docNum" onkeyup="findNum(this)" placeholder="扫码 / 输入" autocomplete="off"> 
 | 
    </div> 
 | 
    <div class="layui-input-inline" style="width: 100%"> 
 | 
        <label class="layui-form-label" style="width: 84px">状态</label> 
 | 
        <label id="status" class="layui-form-label status-0">未知</label> 
 | 
    </div> 
 | 
    <div class="layui-input-inline" style="width: 100%"> 
 | 
        <label class="layui-form-label" style="width: 84px; padding-top: 0">客户</label> 
 | 
        <label id="custName" class="layui-form-label" style="padding-top: 0">-</label> 
 | 
    </div> 
 | 
</header> 
 | 
  
 | 
<!-- 主体 --> 
 | 
<main id="pakout-box"> 
 | 
  
 | 
</main> 
 | 
<!-- 尾部 --> 
 | 
<footer> 
 | 
    <div class="layui-btn-container"> 
 | 
        <button id="reset" type="button" class="layui-btn layui-btn-primary" onclick="reset()">重置</button> 
 | 
        <button id="confirm" type="button" class="layui-btn layui-btn-normal" onclick="pakoutConfirm()" style="margin-left: 20px">拣货确认</button> 
 | 
        <button id="tips1" style="outline: none;color: white;border-color: white; position: absolute;right: 0;bottom: 0;"></button> 
 | 
    </div> 
 | 
</footer> 
 | 
</body> 
 | 
<script> 
 | 
    var pakoutData = []; 
 | 
    window.onload = function(){ 
 | 
        document.getElementById("docNum").focus(); 
 | 
    } 
 | 
  
 | 
    function findNum(el){ 
 | 
        if (isEmpty(el.value)) { 
 | 
            return; 
 | 
        } 
 | 
        $.ajax({ 
 | 
            url: baseUrl + "/work/pakout/get", 
 | 
            headers: {'token': localStorage.getItem('token')}, 
 | 
            data: { 
 | 
                docNumber: el.value 
 | 
            }, 
 | 
            async: false, 
 | 
            method: 'POST', 
 | 
            success: function (res) { 
 | 
                if (res.code === 200) { 
 | 
                    if (res.data != null) { 
 | 
                        $('#pakout-box').html(""); 
 | 
                        pakoutData = []; 
 | 
                        pakoutData = res.data.pakouts; 
 | 
                        if (pakoutData != null) { 
 | 
                            // 头 
 | 
                            $('#status').html(res.data.wrkSts$); 
 | 
                            $('#status').attr("class", "layui-form-label status-" + res.data.wrkSts); 
 | 
                            $('#custName').html(res.data.custName); 
 | 
                            // 主 
 | 
                            var tpl = $("#pakoutDetlTpl").html(); 
 | 
                            var template = Handlebars.compile(tpl); 
 | 
                            var html = template(res.data); 
 | 
                            $('#pakout-box').append(html); 
 | 
                        } 
 | 
                        $('#tips1').focus(); 
 | 
                    } 
 | 
                } else if (res.code === 201) { 
 | 
                } else if (res.code === 403) { 
 | 
                    top.location.href = baseUrl + "/pda"; 
 | 
                } else { 
 | 
                    pakoutData = []; 
 | 
                    tips(res.msg, true); 
 | 
                } 
 | 
            } 
 | 
        }) 
 | 
    } 
 | 
  
 | 
    layui.use(['laydate', 'form'], function() { 
 | 
        var $ = layui.jquery; 
 | 
        var layer = layui.layer; 
 | 
        var form = layui.form; 
 | 
  
 | 
    }); 
 | 
  
 | 
    // 拣货确认 
 | 
    function pakoutConfirm() { 
 | 
        layer.confirm('确认拣货完成?', {shadeClose: true}, function(){ 
 | 
            if (pakoutData == null || pakoutData.length === 0) { 
 | 
                tips("请确认单据编号!", true); 
 | 
                return; 
 | 
            } 
 | 
            var docNum = pakoutData[0].docNum; 
 | 
            if (isEmpty(docNum)) { 
 | 
                tips("请确认单据编号!", true); 
 | 
                return; 
 | 
            } 
 | 
            $.ajax({ 
 | 
                url: baseUrl+"/work/stock/out/confirm", 
 | 
                headers: {'token': localStorage.getItem('token')}, 
 | 
                data: JSON.stringify({ 
 | 
                    number: docNum 
 | 
                }), 
 | 
                contentType:'application/json;charset=UTF-8', 
 | 
                method: 'POST', 
 | 
                success: function (res) { 
 | 
                    if (res.code === 200) { 
 | 
                        reset(); 
 | 
                        tips("拣货成功") 
 | 
                    } else if (res.code === 403) { 
 | 
                        top.location.href = baseUrl + "/pda"; 
 | 
                    } else { 
 | 
                        tips(res.msg, true) 
 | 
                    } 
 | 
                } 
 | 
            }) 
 | 
        }); 
 | 
    } 
 | 
  
 | 
    // 重置 
 | 
    function reset() { 
 | 
        $("#docNum").val(""); 
 | 
        $('#status').html("未知"); 
 | 
        $('#status').attr("class", "layui-form-label status-0"); 
 | 
        $('#custName').html("-"); 
 | 
        $('#pakout-box').html(""); 
 | 
        pakoutData = []; 
 | 
        document.getElementById("docNum").focus(); 
 | 
        layui.form.render('select'); 
 | 
    } 
 | 
  
 | 
    /** 
 | 
     * 提示信息 
 | 
     * @param msg 提示内容 
 | 
     * @param warn true:红色var字体 
 | 
     */ 
 | 
    function tips(msg, warn) { 
 | 
        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) { 
 | 
    //         $("#confirm").focus(); 
 | 
    //         pakoutConfirm(); 
 | 
    //     } else if (key === 113) { 
 | 
    //         $("#docNum").val(""); 
 | 
    //         $("#docNum").focus(); 
 | 
    //     } 
 | 
    // } 
 | 
</script> 
 | 
<script type="text/template" id="pakoutDetlTpl"> 
 | 
    {{#each pakouts}} 
 | 
        <hr> 
 | 
        <div class="pakout-item"> 
 | 
            <div class="item-header"> 
 | 
                {{maktx}} 
 | 
            </div> 
 | 
            <div class="item-content"> 
 | 
                <div style="float: left">{{anfme}}{{unit}}</div> 
 | 
                <div style="float: right">货位:{{locNo}}</div> 
 | 
            </div> 
 | 
        </div> 
 | 
    {{/each}} 
 | 
</script> 
 | 
</html> 
 |