@model List<Face.Domain.Application.Statistics>
@{
    Layout = "/Views/Shared/_Layout.cshtml";
    var Umodel = Face.Services.CxwUserLoginHelpre.CurrentUser();
}
@*<link href="~/Theme/css/plugins/dataTables/datatables.min.css" rel="stylesheet" />*@
<link href="~/NewFrame/plugins/datatables-bs4/css/dataTables.bootstrap4.min.css" />
<style>
    .statistics > tr > td {
        font-size: 16px;
    }

    center p {
        font-size: 14px;
        color: #808080;
    }

    .business > td, .procurement > td, .life > td, .fixed > td {
        font-size: 14px;
        color: #808080;
    }

    .describe {
        font-size: 13px;
        color: #808080;
    }

    td > strong {
        color: black;
        font-size: 14px;
    }

        td > strong > span {
            font-size: 13px;
            color: #1E90FF;
        }
    .describe p{
        margin-bottom:0px;
    }
</style>



<div class="content-wrapper">
    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12">
                    <div class="card">
                        <div class="ibox-content" style="padding:0px;">

                            @if (Umodel.AdminName == "admin")
                            {
                                <button class="btn btn-xs btn-info" type="button" onclick="clearCache()">更新账单缓存</button>
                            }
                            <div class="ibox-content text-center" id="step1" style="padding:0px;">
                                <div class="p-sm" style="padding:0px;">
                                    <table class="table table-bordered">
                                        <tbody>
                                            <tr>
                                                <td>
                                                    <a href="@Url.Action("JournalList", "CxwJournalLog")">
                                                        <img alt="image" class="img-circle" src="~/Images/Project/008.png">
                                                        <h6 class="m-b-xs"><strong>流水账</strong></h6>
                                                    </a>
                                                </td>

                                                <td>
                                                    <a href="@Url.Action("ReceivableList", "BillingRecords")">
                                                        <img alt="image" class="img-circle" src="~/Images/Project/008.png">
                                                        <h6 class="m-b-xs"><strong>应收账</strong></h6>

                                                    </a>
                                                </td>

                                                <td>
                                                    <a href="@Url.Action("PaymentList", "BillingRecords")">
                                                        <img alt="image" class="img-circle" src="~/Images/Project/008.png">
                                                        <h6 class="m-b-xs"><strong>应付账</strong></h6>

                                                    </a>
                                                </td>

                                                @if (Umodel.AdminName == "admin" || Umodel.AdminName == "文祚平")
                                                {
                                                    <td>
                                                        <a href="@Url.Action("OperationLog", "Jurisdiction")">
                                                            <img alt="image" class="img-circle" src="~/Images/Project/009.png">
                                                            <h6 class="m-b-xs"><strong>操作日志</strong></h6>

                                                        </a>
                                                    </td>
                                                }


                                            </tr>
                                        </tbody>
                                    </table>
                                    <!--交易记录-->
                                    <table class="table table-bordered" id="money">
                                        <tbody>
                                            <tr style="word-wrap:break-word;">
                                                <td>流水盈余<br /><strong style="padding-top:8px;font-size:16px;@(ViewBag.journal>0?"color:green;":"color:red;")">@ViewBag.journal</strong></td>

                                                <td>应收盈余<br /><strong style="padding-top:8px;font-size:16px;@(ViewBag.receivable>0?"color:green;":"color:red;")">@ViewBag.receivable</strong></td>

                                                <td>应付余款<br /><strong style="padding-top:8px;font-size:16px;">@ViewBag.payment</strong></td>
                                            </tr>
                                            <tr>
                                                <td colspan="3">总盈余<br /><strong style="padding-top:8px;font-size:16px;@(ViewBag.Money>0?"color:green;":"color:red;")">@ViewBag.Money</strong></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>

            </div>

                <!--交易统计-->
                <div class="row">

                    <div class="col-12">
                        <div class="card">
                            <div class="ibox-content" style="padding:0px;">
                                <div class="card-body table-responsive p-0">
                                    <table class="table table-sm table-striped table-bordered table-hover" id="editable">
                                        <thead>
                                            <tr>
                                                <th>年月</th>
                                                <th>收入</th>
                                                <th>支出</th>
                                                <th>余额</th>
                                            </tr>
                                        </thead>
                                        <tbody class="statistics">
                                            @for (int i = 0; i < Model.Count; i++)
                                            {
                                                <tr class="gradeX">
                                                    <td class=" sorting_1"><span class="row-details row-details-close" data_id="@i">@Model[i].Date.Value.ToString("yyyy/MM")</span> </td>
                                                    <td>@Model[i].Receivable</td>
                                                    <td>@Model[i].Payment</td>
                                                    <td style=@(Model[i].TotalMoney>0?"color:green;":"color:red;")>@Model[i].TotalMoney</td>
                                                </tr>
                                            }
                                        </tbody>
                                    </table>
                                    <div class="describe">
                                        <!--写描述-->
                                        <p>固定支出：房租,水电、员工工资、员工借支</p>
                                        <p>生活支出：生活费、其他</p>
                                        <p>采购支出：采购(应付)、办公用品、工具设备、生产物料</p>
                                        <p>业务支出：快递费、业务餐费、出差餐补、业务提成、交通费、税务</p>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>

                </div>

            </div>

    </section>
</div>

<div>
    <div class="ibox float-e-margins" id="orderInfo_Box">

    </div>

    <div class="table-responsive" id="ordersPlannedSpeedBox_Content">
    </div>


    <div class="table-responsive" id="detailsBox_Content">
    </div>
</div>

<style>
    .contact-box.center-version > a img {
        width: 20px;
        height: 20px;
    }
</style>
<script src="~/Theme/js/plugins/dataTables/datatables.min.js"></script>
<script src="~/NewFrame/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js"></script>

<script src="~/CxwPlugin/mobile-detect.min.js"></script>
<script src="~/CxwPlugin/AddCookie.js"></script>
@*<script src="~/Theme/js/bootstrap-table-expandable.js"></script>*@

<script>

    var oTable;
    $(document).ready(function () {

        oTable = $('#editable').dataTable({
            "oLanguage": {
                "oAria": {
                    "sSortAscending": " - click/return to sort ascending",
                    "sSortDescending": " - click/return to sort descending"
                },
                "sLengthMenu": "显示 _MENU_ 记录",
                "sZeroRecords": "对不起，查询不到任何相关数据",
                "sEmptyTable": "未有相关数据",
                "sLoadingRecords": "正在加载数据-请等待...",
                "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录。",
                "sInfoEmpty": "当前显示0到0条，共0条记录",
                "sInfoFiltered": "（数据库中共为 _MAX_ 条记录）",
                "sProcessing": "<img src='../resources/user_share/row_details/select2-spinner.gif'/> 正在加载数据...",
                "sSearch": "模糊查询：",
                "sUrl": "",
                //多语言配置文件，可将oLanguage的设置放在一个txt文件中，例：Javascript/datatable/dtCH.txt
                "oPaginate": {
                    "sFirst": "首页",
                    "sPrevious": " 上一页 ",
                    "sNext": " 下一页 ",
                    "sLast": " 尾页 "
                }
            },
            "bFilter": false,
            "bLengthChange": false,
            "pageLength": 20,
            "order": [
                [0, 'desc']//第一列倒序
            ],
        });



        $('.table').on('click', 'tbody.statistics>tr',
            function () {
                var nTr = $(this)[0];
                var date = $(this).children().children().text();
                if (oTable.fnIsOpen(nTr)) //判断是否已打开
                {
                    /* This row is already open - close it */
                    $(this).children().children().addClass("row-details-close").removeClass("row-details-open");
                    oTable.fnClose(nTr);
                } else {
                    /* Open this row */
                    $(this).children().children().addClass("row-details-open").removeClass("row-details-close");
                    GetConsumeInfo(nTr, date);
                }
            });

    });

    //统计某年月的支出
    function GetConsumeInfo(nTr, date) {
        $.ajax({
            url: "/CxwHome/ConsumeInfo",
            data: { "date": date },
            type: "post",
            success: function (data) {
                var sOut = "";
                //console.log(data);
                //for (var i = 0; i < data.length; i++) {
                //固定支出
                sOut += '<table class="table table-sm table-striped Info " onclick="stopBubbling()" border="0"><tbody>';

                sOut += ' <tr class="fixed"><td style="width:30%;"><strong><span>固定支出:</span><br/>' + data["固定支出"] + '</strong></td>';
                sOut += '<td>(房租水电:<strong>' + (data["Chummage"] == undefined ? 0 : data["Chummage"]) + '</strong>' +
                    ',员工工资:<strong>' + (data["Salary"] == undefined ? 0 : data["Salary"]) + '</strong>' +
                    ',员工借支:<strong>' + (data["Advance"] == undefined ? 0 : data["Advance"]) + '</strong>' + ')</td>';

                sOut += '</tr>';

                //生活支出
                sOut += ' <tr class="life"><td style="width:30%;"><strong><span>生活支出:</span><br/>' + data["生活支出"] + '</strong></td>';
                sOut += '<td>(生活费:<strong>' + (data["Alimony"] == undefined ? 0 : data["Alimony"]) + '</strong>' +
                    ',其他:<strong>' + (data["Rests"] == undefined ? 0 : data["Rests"]) + '</strong>' + ')</td>';
                sOut += '</tr>';

                //采购支出
                sOut += ' <tr class="procurement"><td style="width:30%;"><strong><span>采购支出:</span><br/>' + data["采购支出"] + '</strong></td>';
                sOut += '<td>(采购(应付):<strong>' + (data["procurement"] == undefined ? 0 : data["procurement"]) + '</strong>' +
                    ',办公用品:<strong>' + (data["Office"] == undefined ? 0 : data["Office"]) + '</strong>' +
                    ',工具设备:<strong>' + (data["Tool"] == undefined ? 0 : data["Tool"]) + '</strong>' +
                    ',生产物料:<strong>' + (data["Material"] == undefined ? 0 : data["Material"]) + '</strong>' + ')</td>';
                sOut += '</tr>';

                //业务支出
                sOut += ' <tr class="business"><td style="width:30%;"><strong><span>业务支出:</span><br/>' + data["业务支出"] + '</strong></td>';
                sOut += '<td>(快递费:<strong>' + (data["express"] == undefined ? 0 : data["express"]) + '</strong>' +
                    ',业务餐费:<strong>' + (data["BusinessMeals"] == undefined ? 0 : data["BusinessMeals"]) + '</strong>' +
                    ',出差餐补:<strong>' + (data["MealSubsidy"] == undefined ? 0 : data["MealSubsidy"]) + '</strong>' +
                    ',业务提成:<strong>' + (data["Commission"] == undefined ? 0 : data["Commission"]) + '</strong>' +
                    ',交通费:<strong>' + (data["Fare"] == undefined ? 0 : data["Fare"]) + '</strong>' +
                    ',税务:<strong>' + (data["Tax"] == undefined ? 0 : data["Tax"]) + '</strong>' + ')</td>';
                sOut += '</tr>';
                sOut += '</tbody></table>';


                if (data["未知支出"] != undefined) {
                    sOut += '<center> <p style="width:70%">未知支出：' + data["未知支出"] + '</p></center>';
                }
                //}
                //oTable.fnOpen(nTr, sOut, 'details');
                oTable.fnOpen(nTr, sOut, 'details');
            }

        });
    }

    function stopBubbling() {
        window.event ? window.event.cancelBubble = true : e.stopPropagation();
    }
    //清除缓存
    function clearCache() {
        $.ajax({
            url: "/CxwHome/clearCache",
            type: "post",
            success: function (res) {
                if (res.Status != 200) {
                    $.toastr.error('失败! <br />' + res.Message, {
                        time: 3000,
                        position: 'top-center'
                    });
                } else {
                    $.toastr.success('清除成功', {
                        time: 3000,
                        position: 'top-center'
                    });
                }

            }
        });
    }

</script>