<!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>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 select-info">
            <div class="col-sm-12 select-info">
                <ul id="myTab" class="nav nav-tabs">
                    <li class="active"><a href="#tabMaster" data-toggle="tab">波次主表</a></li>
                    <li><a href="#tabHeader" data-toggle="tab" onclick="header()">主表</a></li>
                    <li><a href="#tabDetail" data-toggle="tab" onclick="detail()">明细</a></li>
                </ul>
                <div id="myTabContent" class="tab-content">
                    <div class="tab-pane fade in active" id="tabMaster">
                        <div class="col-sm-12 select-info">
                            <form id="waveMaster-form">
                                <div class="select-list">
                                    <ul>
                                        <li>
                                            编码:<input type="text" name="code"/>
                                        </li>
                                        <li>
                                            出库单条件:<input type="text" name="shipmentFilterCode"/>
                                        </li>
                                        <li>
                                            波次流程:<input type="text" name="waveFlowCode"/>
                                        </li>
                                        <!--<li class="time">-->
                                            <!--<label>创建时间: </label>-->
                                            <!--<input type="text" class="time-input" id="startTime" placeholder="开始时间" name="createdBegin"/>-->
                                            <!--<span>-</span>-->
                                            <!--<input type="text" class="time-input" id="endTime" placeholder="结束时间" name="createdEnd"/>-->
                                        <!--</li>-->
                                        <li>
                                            <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                            <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset('waveMaster-form')"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                                            <!--<a class="btn btn-success btn-rounded btn-sm" onclick="$.table.exportExcel()" shiro:hasPermission="system:role:export"><i class="fa fa-download"></i>&nbsp;导出</a>-->
                                        </li>
                                    </ul>
                                </div>
                            </form>
                        </div>

                        <div class="col-sm-12 select-info">
                            <table id="bootstrap-table" data-mobile-responsive="true" class="table table-bordered table-hover"></table>
                        </div>

                        <div class="btn-group hidden-xs" id="toolbar" role="group">
                            <a class="btn btn-outline btn-success btn-rounded" onclick="masterAdd()" shiro:hasPermission="config:waveMaster:add">
                                <i class="fa fa-plus"></i> 新增
                            </a>
                            <a class="btn btn-outline btn-danger btn-rounded" onclick="masterBatRemove()" shiro:hasPermission="config:waveMaster:remove">
                                <i class="fa fa-trash-o"></i> 删除
                            </a>
                        </div>
                    </div>

                    <div class="tab-pane fade" id="tabHeader">
                        <div class="col-sm-12 select-info">
                            <form id="waveFlowHeader-form">
                                <div class="select-list">
                                    <ul>
                                        <li>
                                            编码:<input type="text" name="code"/>
                                        </li>
                                        <li>
                                            出库单条件:<input type="text" name="shipmentFilterCode"/>
                                        </li>
                                        <li>
                                            波次流程:<input type="text" name="waveFlowCode"/>
                                        </li>
                                        <li class="time">
                                            <label>创建时间: </label>
                                            <input type="text" class="time-input" id="waveFlowHeaderStartTime" placeholder="开始时间" name="createdBegin"/>
                                            <span>-</span>
                                            <input type="text" class="time-input" id="waveFlowHeaderEndTime" placeholder="结束时间" name="createdEnd"/>
                                        </li>
                                        <li>
                                            <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                            <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset('waveMaster-form')"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                                            <!--<a class="btn btn-success btn-rounded btn-sm" onclick="$.table.exportExcel()" shiro:hasPermission="system:role:export"><i class="fa fa-download"></i>&nbsp;导出</a>-->
                                        </li>
                                    </ul>
                                </div>
                            </form>
                        </div>
                        <div class="btn-group hidden-xs" id="toolbar1" role="group">
                            <a class="btn btn-outline btn-success btn-rounded" onclick="headerAdd()"
                               shiro:hasPermission="config:waveFlowHeader:add">
                                <i class="fa fa-plus"></i> 新增
                            </a>
                            <a class="btn btn-outline btn-danger btn-rounded" onclick="headerBatRemove()"
                               shiro:hasPermission="config:waveFlowHeader:remove">
                                <i class="fa fa-trash-o"></i> 删除
                            </a>
                        </div>

                        <table id="bootstrap-table1" data-mobile-responsive="true" class="table table-bordered table-hover"></table>

                    </div>

                    <div class="tab-pane fade" id="tabDetail">

                        <div class="btn-group hidden-xs" id="toolbar2" role="group">
                            <a class="btn btn-outline btn-success btn-rounded" onclick="detailAdd()" style="display:none;"
                               id="detailAdd" shiro:hasPermission="config:waveFlowHeader:add">
                                <i class="fa fa-plus"></i> 新增
                            </a>
                            <a class="btn btn-outline btn-danger btn-rounded" onclick="detailBatRemove()"
                               shiro:hasPermission="config:waveFlowHeader:remove">
                                <i class="fa fa-trash-o"></i> 删除
                            </a>
                        </div>

                        <table id="bootstrap-table2" 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 editFlag = [[${@permission.hasPermi('config:waveMaster:edit')}]];
            var removeFlag = [[${@permission.hasPermi('config:waveMaster:remove')}]];
            var prefix = ctx + "config/waveMaster";
            var datas = [[${@dict.getType('sys_normal_disable')}]];
            var code = "";
            var headerId = "";
            var prefix1 = ctx + "config/waveFlowHeader";
            var prefix2 = ctx + "config/waveFlowDetail";
            var editFlag1 = [[${@permission.hasPermi('config:waveFlowHeader:edit')}]];
            var removeFlag1 = [[${@permission.hasPermi('config:waveFlowHeader:remove')}]];

            $(function() {
                $("#bootstrap-table").bootstrapTable({
                    url: prefix + "/list",
                    createUrl: prefix + "/add",
                    updateUrl: prefix + "/edit/{id}",
                    removeUrl: prefix + "/remove",
                    modalName: "波次主表",
                    search: false,
                    showRefresh: true,
                    showColumns: true,
                    showExport: true,
                    smartDisplay:true,
                    iconSize: 'outline',
                    method: "post",
                    toolbar: "#toolbar",
                    columns: [{
                        checkbox: true
                    },
                        {
                            field : 'id',
                            title : 'ID'
                        },
                        {
                            field : 'code',
                            title : '主表名称'
                        },
                        {
                            field : 'sequence',
                            title : '排序'
                        },
                        {
                            field : 'shipmentFilterCode',
                            title : '出库单条件'
                        },
                        {
                            field : 'warehouseCode',
                            title : '仓库编码',
                            visible : false
                        },
                        {
                            field : 'waveFlowCode',
                            title : '波次流程',
                        },
                        {
                            field : 'statusFlowCode',
                            title : '状态流程',
                        },
                        {
                            field : 'shortMode',
                            title : '缺货模式',
                        },
                        {
                            field : 'needReplenishment',
                            title : '是否补货',
                            formatter: function (value, item, index) {
                                if (value==true) {
                                    return '<span class="badge" style="background-color: #00B83F;color: white;width: 36px;">' + ' 是 ' + '</span>';
                                }
                                else if (value==false) {
                                    return '<span class="badge" style="background-color: #ff0000;color: white;width: 36px;">' + ' 否 ' + '</span>';
                                }
                            }
                        },
                        {
                            field : 'maxShipments',
                            title : '订单数限制'
                        },
                        {
                            field : 'maxLines',
                            title : '行数限制数量'
                        },
                        {
                            field : 'defaultWaveCreateSize',
                            title : '默认波次创建数量'
                        },
                        {
                            field : 'shipmentGroupSize',
                            title : '订单分组大小'
                        },
                        {
                            field : 'holdRplnTask',
                            title : '取消波次时保留补货任务',
                            formatter: function (value, item, index) {
                                if (value==true) {
                                    return '<span class="badge" style="background-color: #00B83F;color: white;width: 36px;">' + ' 是 ' + '</span>';
                                }
                                else if (value==false) {
                                    return '<span class="badge" style="background-color: #ff0000;color: white;width: 36px;">' + ' 否 ' + '</span>';
                                }
                            }
                        },
                        {
                            field : 'created',
                            title : '创建时间',
                            visible : false
                        },
                        {
                            field : 'createdBy',
                            title : '创建用户',
                            visible : false
                        },
                        {
                            field : 'lastUpdated',
                            title : '更新时间',
                            visible : false
                        },
                        {
                            field : 'lastUpdatedBy',
                            title : '更新用户',
                            visible : false
                        },
                        {
                            field : 'version',
                            title : '数据版本',
                            visible : false
                        },
                        {
                            field : 'processStamp',
                            title : '处理标记',
                            visible : false
                        },
                        {
                            field : 'userDef1',
                            title : '自定义字段1' ,
                            visible:false
                        },
                        {
                            field : 'userDef2',
                            title : '自定义字段2' ,
                            visible:false
                        },
                        {
                            field : 'userDef3',
                            title : '自定义字段3' ,
                            visible:false
                        },
                        {
                            field : 'userDef4',
                            title : '自定义字段4' ,
                            visible:false
                        },
                        {
                            title: '操作',
                            align: 'center',
                            formatter: function(value, row, index) {
                                var actions = [];
                                actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="#" onclick="masterEdit(\''+row.id+'\')" ><i class="fa fa-edit"></i>编辑</a> ');
                                actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="#" onclick="masterDel(\'' + row.id + '\')" ><i class="fa fa-trash-o"></i>删除</a>');
                                return actions.join('');
                            }
                        }],
                    onDblClickRow: function (row) {
                            headerReg(row.waveFlowCode)
                    }
                });
            });

            $("#bootstrap-table1").bootstrapTable({
                url: prefix1 + "/list",
                createUrl: prefix1 + "/add",
                updateUrl: prefix1 + "/edit/{id}",
                removeUrl: prefix1 + "/remove",
                modalName: "波次流主表",
                search: false,
                sortName: "id",
                sortOrder: "desc",
                toolbar: "#toolbar1",
                onRefresh: function(){
                    loadHeader();
                },
                columns: [{
                    checkbox: true
                },
                    {
                        field : 'id',
                        title : 'id'
                    },
                    {
                        field : 'code',
                        title : '流程名称'
                    },
                    {
                        field : 'version',
                        title : '数据版本',
                        visible : false
                    },
                    {
                        field : 'processStamp',
                        title : '处理标记',
                        visible : false
                    },
                    {
                        field : 'created',
                        title : '创建时间'
                    },
                    {
                        field : 'createdBy',
                        title : '创建用户'
                    },
                    {
                        field : 'lastUpdated',
                        title : '更新时间'
                    },
                    {
                        field : 'lastUpdatedBy',
                        title : '更新用户'
                    },
                    {
                        field : 'userDef1',
                        title : '自定义字段1',
                        visible:false
                    },
                    {
                        field : 'userDef2',
                        title : '自定义字段2'  ,
                        visible:false
                    },
                    {
                        field : 'userDef3',
                        title : '自定义字段3'  ,
                        visible:false
                    },
                    {
                        title: '操作',
                        align: 'center',
                        formatter: function(value, row, index) {
                            var actions = [];
                            actions.push('<a class="btn btn-success btn-xs ' + editFlag1 + '" href="#" onclick="headerEdit(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                            actions.push('<a class="btn btn-danger btn-xs ' + removeFlag1 + '" href="#" onclick="headerRemove(\'' + row.id + '\')"><i class="fa fa-trash-o"></i>删除</a>');
                            return actions.join('');
                        }
                    }],
                onDblClickRow: function (row) {
                    detailReg(row.id)
                }
            });

            $("#bootstrap-table2").bootstrapTable({
                url: prefix + "/list",
                createUrl: prefix + "/add",
                updateUrl: prefix + "/edit/{id}",
                removeUrl: prefix + "/remove",
                modalName: "波次流明细",
                queryParams:function(params) {
                    return {
                        // 传递参数查询参数
                        pageSize:       params.limit,
                        pageNum:        params.offset / params.limit + 1,
                        searchValue:    params.search,
                        orderByColumn:  params.sort,
                        isAsc:          params.order
                    };
                },
                onRefresh: function(){
                    loadDeatil();
                },
                search: false,
                sortName: "id",
                sortOrder: "desc",
                toolbar: "#toolbar2",
                columns: [{
                    checkbox: true
                },
                    {
                        field : 'id',
                        title : 'id'
                    },
                    {
                        field : 'headerId',
                        title : '头表id',
                        visible: false
                    },
                    {
                        field : 'waveFlowCode',
                        title : '波次流程'
                    },
                    {
                        field : 'sequence',
                        title : '序号'
                    },
                    {
                        field : 'waveStepCode',
                        title : '波次步骤'
                    },
                    {
                        field : 'waveStepName',
                        title : '描述'
                    },
                    {
                        field : 'value1',
                        title : '参数1',
                        visible : false
                    },
                    {
                        field : 'value2',
                        title : '参数2',
                        visible : false
                    },
                    {
                        field : 'value3',
                        title : '参数3',
                        visible : false
                    },
                    {
                        field : 'created',
                        title : '创建时间'
                    },
                    {
                        field : 'createdBy',
                        title : '创建用户'
                    },
                    {
                        field : 'lastUpdated',
                        title : '更新时间'
                    },
                    {
                        field : 'lastUpdatedBy',
                        title : '更新用户'
                    },
                    {
                        field : 'userDef1',
                        title : '自定义字段1' ,
                        visible:false
                    },
                    {
                        field : 'userDef2',
                        title : '自定义字段2'  ,
                        visible:false
                    },
                    {
                        field : 'userDef3',
                        title : '自定义字段3'  ,
                        visible:false
                    },
                    {
                        title: '操作',
                        align: 'center',
                        formatter: function(value, row, index) {
                            var actions = [];
                            actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="#" onclick="detailEdit(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                            actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="#" onclick="detailRemove(\'' + row.id + '\')"><i class="fa fa-trash-o"></i>删除</a>');
                            return actions.join('');
                        }
                    }]
            })

            function header() {
                $("#myTab li").removeClass("active");
                $("#tabMaster").removeClass("in active");
                $("#tabDetail").removeClass("in active");
                $("#myTab li:eq(1)").addClass("active");
                $("#tabHeader").addClass("in active");
                loadHeader();
            }

            function detail() {
                $("#myTab li").removeClass("active");
                $("#tabMaster").removeClass("in active");
                $("#tabHeader").removeClass("in active");
                $("#myTab li:eq(2)").addClass("active");
                $("#tabDetail").addClass("in active");
                loadDeatil();
            }

            function loadHeader(){
                $.ajax({
                    url:prefix1+'/list',
                    type:"post",
                    data:{
                        code: code,
                    },
                    success:function (value) {
                        $("#bootstrap-table1").bootstrapTable('load',value.data);
                    }
                });
            }

            function loadDeatil() {
                $.ajax({
                    url:prefix2+'/list',
                    type:"post",
                    data:{
                        headerId: headerId,
                    },
                    success:function (value) {
                        $("#bootstrap-table2").bootstrapTable('load',value.data);
                    }
                });
            }

            function headerReg(waveFlowCode) {
                code = waveFlowCode;
                header();
            }

            function detailReg(rowId){
                headerId = rowId;
                $("#detailAdd").css("display","block");
                detail();
            }

            function masterAdd() {
                var url = prefix+"/add";
                $.modal.open("添加波次主表", url);
            }

            function masterEdit(id) {
                var url = prefix+"/edit/"+id;
                $.modal.open("修改主表",url);
            }

            function masterDel(id) {
                $.modal.confirm("确定删除该条波次主表信息吗?", function() {
                    var url = prefix+"remove";
                    var data = { "ids": id };
                    $.operate.submit(url, "post", "json", data);
                });
            }
            
            function masterBatRemove() {
                var rows = $("#bootstrap-table").bootstrapTable('getSelections');
                if (rows.length == 0) {
                    $.modal.alertWarning("请至少选择一条记录");
                    return;
                }
                $.modal.confirm("确认要删除选中的" + rows.length + "条数据吗?", function() {
                    var url = prefix+"/remove";
                    var ids;
                    $.each(rows, function (i, row) {
                        ids = row.id+",";
                    });
                    var data = { "ids": ids };
                    $.operate.submit(url, "post", "json", data);
                });
            }
            
            function headerAdd() {
                var url = prefix1+"/add";
                $.modal.open("添加主表", url);
            }

            function headerEdit(id){
                var url = prefix1+"/edit/"+id;
                $.modal.open("修改主表", url);
            }

            function headerRemove(id) {
                $.modal.confirm("确定删除该条主表信息吗?", function() {
                    var url = prefix1+"remove";
                    var data = { "ids": id };
                    $.operate.submit(url, "post", "json", data);
                });
            }

            function headerBatRemove() {
                var rows = $("#bootstrap-table1").bootstrapTable('getSelections');
                if (rows.length == 0) {
                    $.modal.alertWarning("请至少选择一条记录");
                    return;
                }
                $.modal.confirm("确认要删除选中的" + rows.length + "条数据吗?", function() {
                    var url = prefix1+"/remove";
                    var ids;
                    $.each(rows, function (i, row) {
                        ids = row.id+",";
                    });
                    var data = { "ids": ids };
                    $.operate.submit(url, "post", "json", data);
                });
            }

            function detailAdd() {
                var url = prefix2+"/add/"+headerId;
                $.modal.open("添加明细", url);
            }

            function detailEdit(id) {
                var url = prefix2+"/edit/"+id;
                $.modal.open("修改明细", url);
            }

            function detailRemove(id) {
                $.modal.confirm("确定删除该条明细信息吗?", function() {
                    var url = prefix2+"remove";
                    var data = { "ids": id };
                    $.operate.submit(url, "post", "json", data);
                });
            }

            function detailBatRemove() {
                var rows = $("#bootstrap-table2").bootstrapTable('getSelections');
                if (rows.length == 0) {
                    $.modal.alertWarning("请至少选择一条记录");
                    return;
                }
                $.modal.confirm("确认要删除选中的" + rows.length + "条数据吗?", function() {
                    var url = prefix2+"/remove";
                    var ids;
                    $.each(rows, function (i, row) {
                        ids = row.id+",";
                    });
                    var data = { "ids": ids };
                    $.operate.submit(url, "post", "json", data);
                });
            }
        </script>
</body>
</html>