@{
    ViewBag.Title = "AutoOpenOrder";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<style>
    .self-table-click td {
        background-color: #f3ebbc;
    }
</style>
<div class="x-body">
    <div class="layui-btn-group" style="padding-bottom:10px;">
        <button class="layui-btn layui-btn-normal" data-method="add">添加</button>
        <button class="layui-btn layui-btn-normal" id="ordersimport">导入</button>
    </div>
    <div id="mytoolbar">
        是否执行：
        <div class="layui-inline">
            <select name="slt_IsExe" style="height:35px;">
                <option value="">全部</option>
                <option value="1">是</option>
                <option value="0" selected="selected">否</option>
            </select>
        </div>
        状态：
        <div class="layui-inline">
            <select name="slt_IsOk" style="height:35px;">
                <option value="">全部</option>
                <option value="1">成功</option>
                <option value="0">失败</option>
            </select>
        </div>
        订单号：
        <div class="layui-inline">
            <input type="text" name="txt_orderId" placeholder="请输入" autocomplete="off" class="layui-input" style="width:120px;">
        </div>
        添加日期：
        <div class="layui-inline">
            <input class="layui-input" placeholder="开始日" name="txt_stime" id="start" style="width:120px;">
        </div>
        <div class="layui-inline">
            <input class="layui-input" placeholder="截止日" name="txt_etime" id="end" style="width:120px;">
        </div>

        <button class="layui-btn" data-type="reload" id="search">搜索</button>
    </div>

    <table class="layui-hide" id="tabl1" lay-filter="tabl1"></table>
</div>

<div id="ordersDiv" class="layui-form" style="display:none;">
    <textarea placeholder="一行一个订单号" class="layui-textarea" id="ordersArea" rows="30" lay-filter="ordersArea"></textarea>
</div>

<script>
    var selectRow = {};

    layui.use(['table', 'form', 'layer', 'upload', 'laydate'], function () {
        var table = layui.table;
        var form = layui.form;
        var layer = layui.layer;
        var upload = layui.upload;
        var laydate = layui.laydate;

        laydate.render({ elem: '#start' });
        laydate.render({ elem: '#end' });

        var param2 = GetParams("mytoolbar");

        table.render({
            id: 'testReload',//列表别名ID
            elem: '#tabl1',//表ID
            url: '/Order/AutoOpenOrder',
            method: 'POST',
            cols: [[
                { field: 'OrderId', title: '订单ID' }
                , { field: 'SubProductName', title: '产品名称' }
                , { field: 'CTime', title: '添加时间' }
                , { field: 'IsExe', title: '是否执行', templet: function (res) { if (res.IsExe == 1) return "是"; else return "否"; } }
                , { field: 'ETime', title: '执行时间' }
                , {
                    field: 'IsOk', title: '执行结果', templet: "#statusTpl"
                }
                , { field: 'Remark', title: '说明' }
            ]]
            , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip', 'refresh'] //自定义分页布局
                //,curr: 5 //设定初始在第 5 页
                , groups: 5 //只显示 1 个连续页码

            }
            , where: param2
        });

        $('#mytoolbar .layui-btn').on('click', function (data) {
            var param = GetParams("mytoolbar");

            table.reload('testReload', {
                page: {
                    curr: 1 //重新从第 1 页开始
                },
                where: param
            });
        });

        //监听行单击事件
        table.on('row(tabl1)', function (obj) {
            var data = obj.data;
            //console.log(data);
            //标注选中样式
            obj.tr.addClass('self-table-click').siblings().removeClass('self-table-click');

            selectRow = data;
        });

        var active = {
            add: function () {
                layer.open({
                    title: '添加订单ID',
                    type: 1,
                    content: $('#ordersDiv'),
                    area: ['20%', '50%']
                    , btn: ['确定', '取消']
                    , yes: function (index, layero) {
                        var orders = $("#ordersArea").val();
                        if (orders == '') {
                            layer.msg('订单号不能为空！', { icon: 2 });
                            return;
                        }
                        $.r_post('/Order/AutoOpenOrderAdd', { orders }, function (res) {
                            if (res.result) {
                                layer.msg('操作成功！', { icon: 1 }, function () {
                                    parent.layer.closeAll();
                                    parent.$(".layui-laypage-refresh")[0].click();
                                });
                            }
                            else {
                                layer.msg('操作失败！' + result.retmsg, { icon: 2 });
                            }
                        });
                    }
                });
            }
        };

        upload.render({ //允许上传的文件后缀
            elem: '#ordersimport'
            , url: '/Order/AutoOpenOrderImport'
            , accept: 'file' //普通文件
            , exts: 'xls|xlsx|csv' //只允许上传压缩文件
            , size: 100000 //限制文件大小，单位 KB
            , done: function (res) {
                if (res.result) {
                    layer.msg('操作成功！', { icon: 1 }, function () {
                        parent.layer.closeAll();
                        parent.$(".layui-laypage-refresh")[0].click();
                    });
                }
                else {
                    layer.msg('操作失败！' + result.retmsg, { icon: 2 });
                }
            }
        });


        $('.layui-btn-group .layui-btn').on('click', function () {
            var othis = $(this), method = othis.data('method');
            active[method] ? active[method].call(this, othis) : '';
        });

    });

</script>
<script type="text/html" id="statusTpl">
    {{# if(d.IsOk == 1) {}}
    <span style="color:green">成功</span>
    {{# } else if(d.IsOk == 0 && d.IsExe == 1) { }}
    <span style="color:red">失败</span>
    {{# } else { }}
    <span>未执行</span>
    {{# } }}
</script>