@{
    ViewBag.Title = "用户签约";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@using Core.Web.WebHelper
<style>
    .layui-btn-reset {
        background: #999999;
    }
</style>

<div class="x-body">
    <div class="layui-btn-group" style="padding-bottom:10px;">
        @Html.Action("ToolBar", "Home",
               new
                    {
                   area = "",
                   rightcode = (ViewBag.rightCode as string),
                   otherToolBars = new ToolBar[]
                    {
                        new  Core.Web.WebHelper.ToolBar(ToolBarConfig.CONST_Other1, "审核", "layui-btn-normal","",true)
                    }
               })
    </div>
    <div class="demoTable" id="mytoolbar">
        @*客户id：
        <div class="layui-inline">
            <input type="text" name="txt_resid" placeholder="请输入" autocomplete="off" class="layui-input">
        </div>*@
        客户id：
        <div class="layui-inline">
            <input type="text" name="txt_UMID" placeholder="请输入" autocomplete="off" class="layui-input">
        </div>
        客户姓名：
        <div class="layui-inline">
            <input type="text" name="txt_username" placeholder="请输入" autocomplete="off" class="layui-input">
        </div>
        用户名：
        <div class="layui-inline">
            <input type="text" name="txt_softusername" placeholder="请输入" autocomplete="off" class="layui-input">
        </div>
        订单号：
        <div class="layui-inline">
            <input type="text" name="txt_orderids" placeholder="请输入" autocomplete="off" class="layui-input">
        </div>
        协议编号:
        <div class="layui-inline">
            <input type="text" name="txt_protocolno" placeholder="请输入" autocomplete="off" class="layui-input">
        </div>
        事业部：
        <div class="layui-inline">
            <div id="selectChannel" style="width: 200px"></div>
        </div>
        协议状态：
        <div class="layui-inline">
            <select name="slt_status" style="height:35px;">
                <option value="">全部</option>
                <option value="0">未签订</option>
                <option value="1">已签订</option>
                <option value="9">已确认</option>
                <option value="-1">驳回</option>
            </select>
        </div>

        提交人：
        <div class="layui-inline">
            <input type="text" name="txt_subname" placeholder="请输入" autocomplete="off" class="layui-input">
        </div>
        提交日期：
        <div class="layui-inline">
            <input class="layui-input" placeholder="开始日" name="txt_subsdate" id="subsdate" style="width:150px;" autocomplete="off" lay-key="1">
        </div>
        <div class="layui-inline">
            <input class="layui-input" placeholder="截止日" name="txt_subedate" id="subedate" style="width:150px;" autocomplete="off" lay-key="2">
        </div>
        审核人：
        <div class="layui-inline">
            <input type="text" name="txt_verifyname" placeholder="请输入" autocomplete="off" class="layui-input">
        </div>
        审核日期：
        <div class="layui-inline">
            <input class="layui-input" placeholder="开始日" name="txt_verifysdate" id="verifysdate" style="width:150px;" autocomplete="off" lay-key="1">
        </div>
        <div class="layui-inline">
            <input class="layui-input" placeholder="截止日" name="txt_verifyedate" id="verifyedate" style="width:150px;" autocomplete="off" lay-key="2">
        </div>
        <button class="layui-btn" data-type="reload">搜索</button>
        <button class="layui-btn layui-btn-reset" id="reset" type="reset">清空</button>
    </div>
    <table class="layui-hide" id="tabl1" lay-filter="tabl1"></table>
    <iframe id="BillOpen" width="0" height="0" scrolling="no" frameborder="0" style="display:none;"></iframe>
</div>
<script src="~/Scripts/layui_ext/xm-select/xm-select.js"></script>
<script>
    var selectRow = {};
    var table;
    layui.use('laydate', function () {
        var laydate = layui.laydate;
        laydate.render({ elem: '#subsdate' });
        laydate.render({ elem: '#subedate' });
        laydate.render({ elem: '#verifysdate' });
        laydate.render({ elem: '#verifyedate' });
    });
    layui.use('table', function () {
        table = layui.table;
        table.render({
            id: 'testReload',//列表别名ID
            elem: '#tabl1',//表ID
            url: '/ElderlyInvestment/GetHtmlList',
            method: 'POST',
            cols: [[
                { field: 'PROTOCOLNO', width: 150, title: '协议编号' }
                , { field: 'CompanyName', width: 150, title: '事业部' }
                , { field: 'UMID', width: 300, title: '客户id' }
                , { field: 'USERNAME', title: '客户姓名' }
                , { field: 'USERID', title: '用户名' }
                , { field: 'Orderid', title: '订单' }
                , { field: 'PROTOCOLTYPENAME', title: '协议' }
                , { field: 'STATUSNAME', title: '协议状态', templet:'#statusTpl' }
                , { field: 'NOTE', title: '备注' }
                , { field: 'CREATER', title: '创建人' }
                , { field: 'CTIME', title: '创建时间', sort: true }
                , { field: 'REVIEWER', title: '审核人'  }
                , { field: 'AUDITTIME', title: '审核时间', sort: true }
            ]]
            , page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip', 'refresh'] //自定义分页布局
                //,curr: 5 //设定初始在第 5 页
                , groups: 5 //只显示 1 个连续页码

            }
        });
        //监听行单击事件
        table.on('row(tabl1)', function (obj) {
            var data = obj.data;
            obj.tr.addClass('self-table-click').siblings().removeClass('self-table-click');
            selectRow = data;
        });


        var active = {
            edit: function () {
                if (selectRow.ID === "undefined" || selectRow.ID == null) {
                    layer.alert("请先选中一条记录！", { title: '提示' });
                    return;
                }
                if (selectRow.STATUS !== 0) {
                    layer.alert("该协议状态不是未签订，无法被编辑", { title: '提示' });
                    return;
                }
                winindex = layer.open({
                    title: '编辑协议',
                    type: 2,
                    content: 'Edit2?id=' + selectRow.ID,
                    area: ['550px', '760px']
                });
            },
            other1: function () {
                if (selectRow.ID === "undefined" || selectRow.ID == null) {
                    layer.alert("请先选中一条记录！", { title: '提示' });
                    return;
                }
                winindex = layer.open({
                    title: '审核协议',
                    type: 2,
                    content: 'Aduit?id=' + selectRow.ID,
                    area: ['550px', '760px']
                });
            }, add: function () {
                winindex = layer.open({
                    title: '添加客户协议',
                    type: 2,
                    content: 'Add',
                    area: ['550px', '550px']
                });
            }, export: function () {
                var param = GetParams("mytoolbar");
                var params = $.param(param);
                debugger
                $("#BillOpen").attr("src", "/ElderlyInvestment/Export?" + params);
            }, delete: function () {
                if (selectRow.ID === "undefined" || selectRow.ID == null) {
                    layer.alert("请先选中一条记录！", { title: '提示' });
                    return;
                }
                layer.confirm('是否确认删除该风险确认书？', { icon: 3, title: '删除选中协议' }, function (index1) {
                    $.ajax({
                        type: "POST",
                        url: "/ElderlyInvestment/Delete",
                        data: { id: selectRow.ID },
                        dataType: "json",
                        success: function (da) {
                            if (da.s) {
                                layer.msg(da.m, { icon: 1 });
                                table.reload('testReload', {
                                    page: {
                                        curr: 1 //重新从第 1 页开始
                                    }
                                });
                            } else {
                                layer.msg(da.m, { icon: 2 });
                            }
                            
                        },
                        error: function () {
                            layer.msg('操作失败！', { icon: 2 });
                        }
                    });
                });
            }
        };

        $('.layui-btn-group .layui-btn').on('click', function () {
            var othis = $(this), method = othis.data('method');
            active[method] ? active[method].call(this, othis) : '';
        });
        $('.demoTable .layui-btn[data-type="reload"]').on('click', function (data) {
            var type = $(this).data('type');
            //var demoReload = $('#demoReload');
            var param = GetParams("mytoolbar");
            table.reload('testReload', {
                page: {
                    curr: 1 //重新从第 1 页开始
                },
                where: GetParams("mytoolbar")
            });
        });
        $('.demoTable .layui-btn[type="reset"]').on('click', function (data) {
            $(".demoTable input").val('');
            $(".demoTable select").val('');
        });
        $('#reset').on('click', function () {
            selectChannel.reset();
            allChannel.forEach(function (item) {
                item.selected = false;
            })
            selectChannel = xmSelect.render(optionsChannel);
            selectChannel.update({ data: allChannel });
        })
    });
    function Closed() {
        layer.close(winindex);
    }
    function TableReload() {
        selectRow = {};
        table.reload('testReload', {
            page: {
                curr: 1 //重新从第 1 页开始
            }
        });
    }
    var optionsChannel = {
        el: '#selectChannel',
        name: 'txt_channel',//表单的name属性
        layVerify: '',
        tips: '请选择事业部',
        toolbar: {//工具条,全选,清空,反选,自定义
            show: true,
            list: [
                'CLEAR'
            ]
        },
        data: []
    };
    var selectChannel = xmSelect.render(optionsChannel);
    var allChannel = @Html.Raw(ViewBag.AllChannel);
    selectChannel.update({ data: allChannel });
</script>
<script type="text/html" id="priceTpl">
    {{# if(d.PRICE == 0) {}}
    <span></span>
    {{# } else { }}
<span>{{d.PRICE}}</span>
    {{# } }}
</script>
<script type="text/html" id="statusTpl">
    {{# if(d.STATUS == -1) {}}
    <span style="color:red"> {{d.STATUSNAME}}</span>
    {{# } else if(d.STATUS == 9) { }}
    <span style="color:green">{{d.STATUSNAME}}</span>
    {{# } else if(d.STATUS == 1) {}}
    <span style="color:orange">{{d.STATUSNAME}}</span>
    {{# } else { }}
    <span>{{d.STATUSNAME}}</span>
    {{# } }}
</script>