<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('商品出入库单')" />
</head>
<body class="gray-bg">
     <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="formInventoryOrder">
                    <div class="select-list">
                        <ul>
                            <li>
                                <label>出入库：</label>
                                <input type="text" name="ioFlag" th:placeholder="出入库标记"/>
                            </li>
                            <li>
                                <label>原因：</label>
                                <input type="text" name="ioType" th:placeholder="出入库原因"/>
                            </li>
                            <li>
                                <label>入库商户：</label>
                                <input type="text" class="merchantSelect" id="inMercName" th:placeholder="入库商户ID"/>
                                <input type="hidden" id="inMercId" name="inId"/>
                            </li>
                            <li>
                                <label>出库商户：</label>
                                <input type="text" class="merchantSelect" id="outMercName" th:placeholder="出库商户ID"/>
                                <input type="hidden" id="outMercId" name="inId"/>
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search('formInventoryOrder', 'prodInventoryOrder-table')"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset('formInventoryOrder', 'prodInventoryOrder-table')"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>

            <div class="btn-group-sm" id="toolbar" role="group">
                <a class="btn btn-success" onclick="$.operate.add()" shiro:hasPermission="master:merchant:add">
                    <i class="fa fa-plus"></i> 添加
                </a>
            </div>
            <div class="col-sm-12 select-table table-striped">
                <table id="prodInventoryOrder-table"></table>
            </div>
        </div>
    </div>
    <th:block th:include="include :: footer" />
    <!-- 商户选择请求区域 -->
    <script id="selectMerchantDiv" type="text/template">
        <div>
            <div class="col-sm-12 search-collapse">
                <form id="formSelectMerchant">
                    <div class="select-list" style="margin-left: 20px;">
                        <ul>
                            <li>
                                <label>商户名称：</label>
                            </li>
                            <li>
                                <input type="text" class="form-control" name="mercName"/>
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search('formSelectMerchant', 'merchant-table')"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset('formSelectMerchant', 'merchant-table')"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>
            <div class="col-sm-11 select-table table-striped">
                <table id="merchant-table"></table>
            </div>
            <form id="formSelectMerchantProd">
                <input type="hidden" id="showMerchantProdList" />
            </form>
            <div class="col-sm-11 select-table table-striped" id="merchant-prod-div" style="display: none;">
                <table id="merchant-prod-table"></table>
            </div>
        </div>
    </script>
    <script th:inline="javascript">
        var editFlag = [[${@permission.hasPermi('business:prodInventory:edit')}]];
        var prefix = ctx + "business/prodInventory";
        var shelfFlags = [[${@dict.getType('shelf_flag')}]];
        var billTypeFlags = [[${@dict.getType('inventory_bill_type')}]];
        var billReasonFlags = [[${@dict.getType('inventory_bill_reason')}]];

        $(function() {
            var options = {
                id: "prodInventoryOrder-table",
                formId: "formInventoryOrder",
                url: prefix + "/inventoryOrder/list",
                createUrl: prefix + "/inventoryOrder/add",
                updateUrl: prefix + "/inventoryOrder/edit/{id}",
                modalName: "商品库存",
                columns: [
                {
                    field: 'ioFlag',
                    title: '出入库标记',
                    formatter: function (value, row, index) {
                        return $.table.selectDictLabel(billTypeFlags, value);
                    }
                },
                {
                    field: 'ioType',
                    title: '出入库原因',
                    formatter: function (value, row, index) {
                        return $.table.selectDictLabel(billReasonFlags, value);
                    }
                },
                {
                    field: 'stockInName',
                    title: '入库商户'
                },
                {
                    field: 'stockOutName',
                    title: '出库商户'
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function(value, row, index) {
                        var actions = [];
                        if (row.prodCount === 0) {
                            actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="$.operate.edit(' + row.inventoryOrderId + ')"><i class="fa fa-edit"></i>编辑</a>');
                        }
                        return actions.join('');
                    }
                }]
            };
            $.table.init(options);
        });

        $(".merchantSelect").click(function() {
            var controlNameObjId = $(this).attr("id");
            var controlIdObjId = controlNameObjId.replace("Name", "Id");
            var content = $('#selectMerchantDiv').html();
            layer.open({
                type: 1,
                fix: false,
                maxmin: false,
                shade: 0.3,
                area: ['800px', '690px'],
                title: '选择商户',
                // 弹层外区域关闭
                shadeClose: true,
                success: function(layero, index) {
                    var merchantOptions = {
                        id: "merchant-table",
                        formId: "formSelectMerchant",
                        url: ctx + "master/merchant/list",
                        modalName: "选择商户",
                        showSearch: false,
                        showColumns: false,
                        showRefresh: false,
                        showExport: false,
                        showToggle: false,
                        singleSelect: true,
                        clickToSelect: true,
                        pageSize: 10,
                        pageList: [10,20,50],
                        columns: [
                            {
                                checkbox: true,
                            },
                            {
                                field: 'mercName',
                                title: '商户名称'
                            },
                            {
                                field: 'contact',
                                title: '联系人'
                            },
                            {
                                field: 'mail',
                                title: '联系信箱'
                            },
                            {
                                field: 'mobile',
                                title: '手机号'
                            }
                        ]
                    };
                    $.table.init(merchantOptions);
                },
                content: content,
                btn: ['<i class="fa fa-check"></i> 确定', '<i class="fa fa-remove"></i> 关闭'],
                btn1: function() {
                    var selectedMercId;
                    var selectedMercName;
                    $.map($("#" + table.options.id).bootstrapTable('getSelections'), function (row) {
                        selectedMercId = $.common.getItemField(row, "mercId");
                        selectedMercName =  $.common.getItemField(row, "mercName");
                    });
                    $("#" + controlNameObjId).val(selectedMercName);
                    $("#" + controlIdObjId).val(selectedMercId);
                    layer.closeAll();
                }
            });
        })
    </script>
</body>
</html>