shippingCombination.html 13.9 KB
<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<style>
    .table-striped-left{
        width: 49%;
        /*margin-right: 4px;*/
    }
    .table-striped-right{
        /*right: -10px;*/
        width: 49%;
        float: right;
    }
    .info_text{
        float: right;
    }
    .info_text li{
        font-size: 16px;
    }
    .info_text li span{
        font-size: 20px;
        font-weight: bold;
        color: rgb(28,132,198);
    }
</style>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 select-info">
            <form id="dept-form">
                <div class="select-list">
                    <ul>
                        <li>
                            出库单号:<input type="text" id="code" name="deptName" th:value="${code}"/>
                        </li>
                        <li>
                            <a class="btn btn-primary btn-rounded btn-sm" id="list-btn"><i class="fa fa-search"></i>&nbsp;加载</a>
                        </li>
                    </ul>
                    <ul class="info_text">
                        <li>物料总数:<span id="shipment_length"></span></li>
                        <li>总单据数量:<span id="qty_length"></span></li>
                        <li>已收货数量:<span id="qtyCompleted_length"></span></li>
                    </ul>
                </div>
            </form>
        </div>
        <div class="col-sm-12 select-info table-striped-left" style="padding-top: 20px;">
            <table id="bootstrap-table" data-mobile-responsive="true" class="table table-bordered  table-hover"></table>
        </div>
        <div class="col-sm-12 select-info table-striped-right">
            <table id="bootstrap-table1" data-mobile-responsive="true" class="table table-bordered table-hover"></table>
        </div>
    </div>
</div>
<div th:include="include :: footer"></div>
<script th:inline="javascript">
    var addFlag = [[${@permission.hasPermi('shipment:shippingCombination:add')}]];
    var cancelFlag = [[${@permission.hasPermi('shipment:shippingCombination:cancel')}]];
    var taskType=[[${@dict.getType('taskType')}]];
    var containerHeaderStatus = [[${@dict.getType('shipmentContainerHeaderStatus')}]]
    var inventoryStatus = [[${@dict.getType('inventoryStatus')}]]

    var prefix = ctx + "shipment/shippingCombination";

    $(function() {
        var list_select=function(code) {
            $("#bootstrap-table1").bootstrapTable('removeAll');
            $("#bootstrap-table").bootstrapTable('removeAll');
            // console.log(code);
            $.ajax({
                url: prefix + "/listShipmentDetail?code="+code,
                type: 'get',
                // datatype: 'json',
                // data: {
                //     code: code
                // },
                success: function (value) {
                    // console.log(value);
                    // $("#bootstrap-table1").bootstrapTable('removeAll');
                    // $("#bootstrap-table").bootstrapTable('removeAll');
                    var qty_shipment=0;
                    var qtyCompleted_shipment=0;
                    for (var i=0;i<value.data.length;i++){
                            if(value.data[i].qty!=value.data[i].qtyCompleted){
                                $("#bootstrap-table").bootstrapTable('insertRow',{index:0,row:{id:value.data[i].id,
                                        name:value.data[i].name,
                                        receiptId:value.data[i].receiptId,
                                        receiptCode:value.data[i].receiptCode,
                                        materialCode:value.data[i].materialCode,
                                        materialName:value.data[i].materialName,
                                        specification:value.data[i].specification,
                                        qty:value.data[i].qty,
                                        qtyCompleted:value.data[i].qtyCompleted,
                                        inventoryStatus:value.data[i].inventoryStatus,
                                        unit:value.data[i].unit}});
                            }
                        qty_shipment = qty_shipment + value.data[i].qty;
                        qtyCompleted_shipment = qtyCompleted_shipment + value.data[i].qtyCompleted;
                    }
                    $("#shipment_length").text(value.data.length);
                    $("#qty_length").text(qty_shipment);
                    $("#qtyCompleted_length").text(qtyCompleted_shipment);
                }
            });
            $.ajax({
                url: prefix + "/listCombinationDetail?code="+code,
                type: 'get',
                // datatype: 'json',
                // data: {
                //     code: code
                // },
                success: function (value) {
                    // console.log(value);
                    // $("#bootstrap-table1").bootstrapTable('removeAll');
                    // $("#bootstrap-table").bootstrapTable('removeAll');
                    for (var i=0;i<value.data.length;i++){

                            $("#bootstrap-table1").bootstrapTable('insertRow',{index:0,
                                row:{
                                    id:value.data[i].id,
                                    headId:value.data[i].headId,
                                    containerCode:value.data[i].containerCode,
                                    locationCode:value.data[i].locationCode,
                                    status:value.data[i].status,
                                    materialName:value.data[i].materialName,
                                    shipmentCode:value.data[i].shipmentCode,
                                    taskType:value.data[i].taskType,
                                    shipmentDetailId:value.data[i].shipmentDetailId,
                                    materialCode:value.data[i].materialCode,
                                    qty:value.data[i].qty,
                                    userName:value.data[i].userName
                            }});
                    }
                }
            })
        };
        $("#list-btn").click(function () {
            list_select($("#code").val());
        })
        var temp =$("#code").val()
        if(temp!=""&&temp!=undefined){
            $("#list-btn").click();
        }
    });
    $("#bootstrap-table").bootstrapTable({
        // url: prefix + "/list",
        createUrl: prefix + "/add",
        updateUrl: prefix + "/edit/{id}",
        removeUrl: prefix + "/remove",
        contentType: "application/x-www-form-urlencoded",
        // search: true, //搜索
        // showRefresh: true,//刷新
        // showToggle:true, //视图切换
        clickToSelect: true,
        // showColumns:true, //列选择
        // detailView:true,
        // showExport: true, //导出
        // exportDataType: "all", //导出类型basic', 'all', 'selected'.当前页、所有数据、选中数据
        modalName: "入库组盘头",
        columns: [
            {
                field : 'id',
                title : '明细id'
            },
            {
                field : 'materialCode',
                title : '物料编码'
            },
            {
                field:"materialName",
                title:"名称"
            },
            {
                field:'specification',
                title:"物料规格"
            },
            {
                field : 'qty',
                title : '单据数量'
            },
            {
                field : 'qtyCompleted',
                title : '已出数量'
            },
            {
                field : 'inventoryStatus',
                title : '库存状态',
                formatter: function(value, row, index) {
                    return $.table.selectDictLabel(inventoryStatus, value);
                },
            },
            {
                field : 'unit',
                title : '单位'
            },
            {
                field:'work',
                title: '操作',
                align: 'center',
                events: "operateEvents",
                formatter: function(value, row, index) {
                    var actions = [];
                    actions.push('<a id="qty" class="btn btn-success btn-xs ' + addFlag + '" href="#"  onclick=""><i class="fa fa-edit"></i>组盘</a>');
                    // actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="#" onclick="$.operate.remove(\'' + row.id + '\')"><i class="fa fa-remove"></i>删除</a>');
                    return actions.join('');
                }
            }]
    });

    $("#bootstrap-table1").bootstrapTable({
        // url: prefix + "/list",
        createUrl: prefix + "/add",
        updateUrl: prefix + "/edit/{id}",
        removeUrl: prefix + "/remove",
        // search: true, //搜索
        showRefresh: true, //刷新
        showToggle:true, //视图切换
        clickToSelect: true,
        showColumns:true, //列选择
        // detailView:true,
        showExport: true, //导出
        exportDataType: "all",  //导出类型basic', 'all', 'selected'.当前页、所有数据、选中数据
        modalName: "入库组盘头",
        iconSize: "outline",
        toolbar: "#toolbar",
        contentType: "application/x-www-form-urlencoded",
        columns: [
            {
                field : 'containerCode',
                title : '容器编号'
            },
            {
                field : 'locationCode',
                title : '库位编号'
            },
            {
                field : 'shipmentCode',
                title : '出库单号'
            },
            {
                field : 'materialCode',
                title : '物料编码'
            },
            {
                field:"materialName",
                title:"名称"
            },
            {
                field : 'taskType',
                title : '预期任务类型',
                formatter: function(value, row, index) {
                    return $.table.selectDictLabel(taskType, value);
                },
            },
            {
                field : 'qty',
                title : '配盘数量'
            },
            {
                field : 'status',
                title : '状态',
                formatter: function(value, row, index) {
                    return $.table.selectDictLabel(containerHeaderStatus, value);
                },
            },

            {
                field : 'headId',
                title : '容器Id'
            },
            {
                field : 'id',
                title : '容器明细Id'
            },
            {
                field : 'shipmentDetailId',
                title : '出库单明细Id'
            },
            {
                field : 'userName',
                title : '操作人'
            },
            {
                title: '操作',
                align: 'center',
                events:'operateEvents',
                formatter: function(value, row, index) {
                    var actions = [];
                    if (row.status == 0) {
                        actions.push('<a id="cancel" class="btn btn-success btn-xs ' + cancelFlag + '" href="#" onclick="cancelCombination(\'' + row.id + '\')"><i class="fa fa-edit"></i>取消</a> ');
                    }
                    return actions.join('');
                }
            }
        ]
    });

    window.operateEvents = {
        'click #qty': function (e, value, row, index) {
            // console.log(JSON.stringify(row));
            var url = prefix + '/combination?';
            jQuery.each(row, function(key, val) {
                url = url + key + "=" + encodeURI(val) + "&";
            });
            // var url=urll.replace("{id}",row.id);
            var modalName="出库组盘头";
            // $.get(url,function(data){open(modalName,data)})
            open("添加"+modalName,url);
        }
    };

    function cancelCombination(id) {
        $.ajax({
            cache : true,
                type : "post",
                url : prefix + "/cancelCombination",
                dataType: "json",
                contentType:"application/json;charset=utf-8",
                data:JSON.stringify([id]),
            async : false,
                error : function(request) {
                $.modal.alertError("请求失败!");
            },
            success : function(data) {
                if(data.code=="200"){
                    $.modal.alertSuccess("成功");
                    $("#list-btn").click();
                }else{
                    $.modal.alertError(data.msg)
                }
            }
        })
    }
    function open(title, url, width, height){
        if (navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i)) {
            width = 'auto';
            height = 'auto';
        }
        if (title==null){
            title = false;
        }
        if (url==null){
            url="404.html";
        }
        if ($.common.isEmpty(width)) {
            width = 800;
            // width = ($(window).width() - 100);
        }
        if ($.common.isEmpty(height)) {
            height = ($(window).height() - 50);
        }
        layer.open({
            type: 2,
            area: [width + 'px', height + 'px'],
            fix: false,
            //不固定
            maxmin: true,
            shade: 0.3,
            title: title,
            content: url
            // shadeClose: true, //点击遮罩关闭层
        })
    }
    function shipping_refresh() {
        var shipment_code = localStorage.getItem("shipment_code");
        $("#code").val(shipment_code);
        $("#list-btn").click();
        // list_select(shipment_code);
        // list_receiptInfo(shipment_code);
        localStorage.removeItem("shipment_code");
    }
    shipping_refresh();
</script>
</body>
</html>