@using WX.CRM.WebHelper
@{
    ViewBag.Title = "bas_salesDepartment";
    Layout = "~/Views/Shared/_content.cshtml";
}
<script src="/Scripts/jquery.easyui.min.js" type="text/javascript"></script>
<link href="/Content/themes/blue/easyui.css" rel="stylesheet" />
<link href="/Content/Site.css" rel="stylesheet" />
<script src="/Scripts/common.js"></script>
<link href="/Content/data_grid_list.css" rel="stylesheet" />
<script src="/Scripts/op/jquery.rewrite.js"></script>
<div class="layui-fluid" style="padding-left:0px;padding-top:10px;">


    <style>
        .self-table-click td {
            background-color: #f3ebbc;
        }
    </style>
    <div class="layui-card" id="topcard" style="width:100%;padding-top:10px;">
        <div class="layui-card-header layui-self-header">
            <div style="float:left;position:relative;">
                发票列表
            </div>
            <div style="float:right;position:relative;">
                @Html.Action("ToolBarNew", "Control", new
                {
                    tool = ViewBag.ToolBar as ToolBar
                })
            </div>
            <div class="hrclass" style="position:relative;float: left;"></div>
        </div>
        <div class="layui-card-body " id="contentBody">
            <form class="layui-form selftopwhere" id="myform">
                <div class="layui-form-item">
                    事业部：
                    @if (ViewBag.DeptList != null)
                    {
                        <div class="layui-inline">
                            <select name="channel" style="width:170px">
                                @{ var allchannel = string.Empty; var ch = string.Empty; }
                                @foreach (var item in ViewBag.DeptList as List<SelectListItem>)
                                {
                                    if (!string.IsNullOrWhiteSpace(item.Value))
                                    {
                                        allchannel += item.Value + "|";
                                    }
                                }
                                @*@{ if (!string.IsNullOrEmpty(allchannel)) { ch = allchannel.Remove(allchannel.LastIndexOf("|"), 1); } }*@
                                @{ if (!string.IsNullOrEmpty(allchannel)) { ch = allchannel.Remove(allchannel.LastIndexOf("|"), 1); } }
                                <option value="@ch">请选择</option>
                                @foreach (var item in ViewBag.DeptList as List<SelectListItem>)
                                {
                                    <option value="@item.Value" selected="@item.Selected">@item.Text</option>
                                }
                            </select>
                        </div>
                    }
                    客户id：
                    <div class="layui-inline">
                        <input type="text" name="resid" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                    抬头名称：
                    <div class="layui-inline">
                        <input type="text" name="invoicetitle" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                    申请时间：
                    <div class="layui-inline">
                        <input class="layui-input" placeholder="开始日" name="startctime" id="startctime" style="width:120px;">
                    </div>
                    <div class="layui-inline">
                        <input class="layui-input" placeholder="截止日" name="endctime" id="endctime" style="width:120px;">
                    </div>
                    发票类型：<div class="layui-inline">
                        <select name="invoicetype" style="height:35px;">
                            <option value="">请选择</option>
                            <option value="1">个人电子普票</option>
                            <option value="2">个人企业普票</option>
                            <option value="3">增值税专用发票</option>
                        </select>
                    </div>
                    发票状态：<div class="layui-inline">
                        <select name="invoicestatus" style="height:35px;">
                            <option value="10">请选择</option>
                            <option value="-2">驳回</option>
                            <option value="-1">未开票</option>
                            <option value="0">开票中</option>
                            <option value="1">已开票</option>
                            <option value="2">已作废</option>
                        </select>
                    </div>
                    开票时间：
                    <div class="layui-inline">
                        <input class="layui-input" placeholder="开始日" name="startinvoicedate" id="startinvoicedate" style="width:120px;">
                    </div>
                    <div class="layui-inline">
                        <input class="layui-input" placeholder="截止日" name="endinvoicedate" id="endinvoicedate" style="width:120px;">
                    </div>
                    <input class="layui-btn layui-btn-sm layui-btn-ok" data-method="search" type="button" value="查询" />
                </div>
            </form>
            <table class="layui-hide" id="tabl1" lay-filter="tabl1"></table>
        </div>
    </div>

</div>

<script>
    var selectRow = {};
    var winindex;
    var layer;
    var rowid;
    //注意：选项卡 依赖 element 模块，否则无法进行功能性操作
    layui.use(['laypage', 'layer', 'table', 'laydate', 'form'], function () {
        var form = layui.form;
        var laydate = layui.laydate;
        layer = layui.layer;
        table = layui.table;

        laydate.render({ elem: '#startctime' });
        laydate.render({ elem: '#endctime' });
        laydate.render({ elem: '#startinvoicedate' });
        laydate.render({ elem: '#endinvoicedate' });

        var token = $.cookie("AuthToken");

        var param = $("#myform").serializeFormJSON();
        for (let k in param) {
            if (param[k] == "") {
                delete param[k];
            }
        }
        param.action = "list";

        var tableIns = table.render({
            id: 'listReload'//列表别名ID
            , elem: '#tabl1'
            //, url: '@ViewBag.ApiUrl/InvoiceService.svc/List'
            //, url: 'http://localhost:55047/InvoiceHandler.ashx'
            , url: '@ViewBag.ApiUrl/InvoiceHandler.ashx'
            , headers: { auth: token }
            //, method: 'POST'
            , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            , page: true
            , limit: 30
            , height: "full-160"
            , size: "sm"
            , cols: [[
                { field: 'Channel', title: '渠道号', hide: true }
                , { field: 'DeptName', title: '事业部' }
                , { field: 'CreatorName', title: '申请人' }
                , { field: 'ResId', title: '客户id' }
                , { field: 'CName', title: '客户姓名' }
                , { field: 'Id', title: '发票id' }
                , { field: 'InvoiceTypeName', title: '发票类型' }
                , { field: 'InvoiceTitle', title: '抬头名称' }
                , { field: 'TaxCode', title: '税号' }
                , { field: 'InvoiceStatusName', title: '开票状态', templet: '#InvoiceStatusTpl' }
                , { field: 'InvoicePrice', title: '发票金额' }
                , { field: 'InvoiceDate', title: '开票时间' }
                , { field: 'Ctime', title: '申请时间' }
                , { fixed: 'right', title: '操作', width: 125, minWidth: 125, toolbar: '<div><a class="layui-btn layui-btn-xs" lay-event="edit">详细</a></div>' }
            ]]
            , where: param
        });

        //触发单元格工具事件
        table.on('tool(tabl1)', function (obj) {
            var data = obj.data;
            //console.log(data)
            if (obj.event === 'edit') {
                layer.open({
                    title: '明细',
                    type: 2,
                    area: ['60%', '80%'],
                    content: '/WeiXin/Invoice/Detail?id=' + data.Id
                });
            }
        });

        //监听行单击事件
        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 () {
                var url = "/WeiXin/Invoice/Add";

                layer.open({
                    title: '发票申请',
                    type: 2,
                    maxmin: true,
                    content: url,
                    area: ['80%', '70%']
                });
            },
            search: function () {
                tableIns.config.where = {};
                var param = $("#myform").serializeFormJSON();
                for (let k in param) {
                    if (param[k] == "") {
                        delete param[k];
                    }
                }
                param.action = "list";
                tableIns = table.reload('listReload', {
                    where: param,
                    headers: { auth: token },
                    page: {
                        curr: 1
                    }
                });
            }
        };

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

        });
    });
</script>
<script type="text/html" id="InvoiceStatusTpl">
    {{#  if(d.InvoiceStatus == '-2'){ }}
    <font color="#ffb800">{{d.InvoiceStatusName}}</font>
    {{# } else if(d.InvoiceStatus == '-1'){ }}
    {{d.InvoiceStatusName}}
    {{# } else if(d.InvoiceStatus == '0'){ }}
    <font color="#01aaed">{{d.InvoiceStatusName}}</font>
    {{# } else if(d.InvoiceStatus == '1'){ }}
    <font color="#009688">{{d.InvoiceStatusName}}</font>
    {{# } else if(d.InvoiceStatus == '2'){ }}
    <font color="#ff5722">{{d.InvoiceStatusName}}</font>
    {{# } else { }}
    未知
    {{# } }}
</script>