@model ClientfileauditPage
@{
    ViewBag.Title = "检查客户文件";
    var Company = PS.Config.CompanyFullName;
    var roleList = BaseOUDAL.UserBLL.GetRolesByUserId(User.GetUserId()).Select(o => o.Name);
    bool IsApproval = ViewBag.IsApproval;
    Layout = "~/Views/Shared/_InfoLayout.cshtml";
}
<style>
    .cfatable {
        width: 100% !important;
        text-align: center !important;
        border: dotted !important;
        font-family: monospace !important;
        color: #333333 !important;
        border-width: 1px !important;
        border-color: #666666 !important;
        border-collapse: collapse !important;
    }

        .cfatable th {
            text-align: center !important;
            border: 1px !important;
            padding: 8px !important;
            border-style: solid !important;
            border-color: #666666 !important;
            background-color: #dedede !important;
        }

        .cfatable td {
            border-width: 1px !important;
            padding: 8px !important;
            border-style: solid !important;
            border-color: #666666 !important;
            background-color: #ffffff !important;
        }

    .toolbarDiv {
        float: right;
    }
</style>
<script src="~/Scripts/pdf/html2canvas.js?v=@(HtmlUtil.JsVersion)"></script>
<script src="~/Scripts/pdf/jspdf.js?v=@(HtmlUtil.JsVersion)"></script>
<script type="text/javascript">
    function exportpdf() {
        //window.open("/client/ClientFilesAuditDownload?clientId=" + '@Model.ClientId', '_blank');
        var element = document.getElementById("auditDiv");
        var width = element.offsetWidth+10;
        var height = element.offsetHeight;
        var scale = 2;
        var canvas = document.createElement("canvas");
        // 获取元素相对于视窗的偏移量
        var rect = element.getBoundingClientRect();
        canvas.width = width * scale;
        canvas.height = height * scale;
        var context = canvas.getContext("2d");
        context.scale(scale, scale);

        // 设置context位置, 值为相对于视窗的偏移量的负值, 实现图片复位
        context.translate(-rect.left - 15, -rect.top);  

        // 将canvas的透明背景设置成白色  --解决黑块黑边问题 
        var imageData = context.getImageData(0, 0, canvas.width, canvas.height);
        for (var i = 0; i < imageData.data.length; i += 4) {
            // 当该像素是透明的，则设置成白色   
            if (imageData.data[i + 3] == 0) {
                imageData.data[i] = 255;
                imageData.data[i + 1] = 255;
                imageData.data[i + 2] = 255;
                imageData.data[i + 3] = 255;
            }
        }
        context.putImageData(imageData, 0, 0);  

        html2canvas(document.getElementById("auditDiv"), { 
            canvas: canvas,
            background: "#fff",
            dpi: window.devicePixelRatio,
            onrendered: function (canvas) {
                var contentWidth = canvas.width;
                var contentHeight = canvas.height;
                //一页pdf显示html页面生成的canvas高度;
                var pageHeight = contentWidth / 595.28 * 841.89;
                //未生成pdf的html页面高度
                var leftHeight = contentHeight;
                //pdf页面偏移
                var position = 0;
                //a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
                var imgWidth = 555.28;
                var imgHeight = 555.28 / contentWidth * contentHeight;

                var pageData = canvas.toDataURL('image/jpeg', 1.0);
                //$("#toolbarDiv").append('<a href="' + pageData + '" download="下载的图片">保存图片</a>');
                var pdf = new jsPDF('', 'pt', 'a4');
                //有两个高度需要区分，一个是html页面的实际高度，和生成pdf的页面高度(841.89)
                //当内容未超过pdf一页显示的范围，无需分页
                if (leftHeight < pageHeight) {
                    pdf.addImage(pageData, 'JPEG', 20, 0, imgWidth, imgHeight);
                } else {
                    while (leftHeight > 0) {
                        pdf.addImage(pageData, 'JPEG', 20, position, imgWidth, imgHeight)
                        leftHeight -= pageHeight;
                        position -= 841.89;
                        //避免添加空白页
                        if (leftHeight > 0) {
                            pdf.addPage();
                        }
                    }
                }

                pdf.save('@Model.ClientName' + '_开户资料审查记录.pdf');
            }
        })
    }

    function initaudit() {
        var opt = {
            url: "/client/ClientFilesAuditQuery?d=" + new Date(),
            data: { clientId: '@Model.ClientId' },
            dataType: "json",
            type: "Get",
            success: function (data) {
                $.each(data, function (index, value) {
                    var tcheckBox = $("#cfatable").find("input[data-group='" + value.Group + "'][data-title='" + value.Title + "'][data-role='" + value.OptRoleName + "']");
                    if (tcheckBox.length>0) {
                        tcheckBox.prop("checked", value.IsPass);
                    }  
                }); 


                //选择最后修改人显示
                var auditors = $("#cfatable").find("td[class='Auditor']");
                auditors.each(function () {
                    var roleName = $(this).data("role");
                    var lists = $.grep(data, function (n,i) {
                        return n.OptRoleName === roleName;
                    });
                    if (lists && lists.length>0) {
                        $(this).html(lists[0].OptName);
                    } 
                });  

                var checkArray = new Array();
                var roles = $("#cfatable").find("input[data-role!='']");
                roles.each(function () {
                    var curRole = $(this).data("role");
                    if ($.inArray(curRole, checkArray) < 0) {
                        checkArray.push(curRole);
                    }
                });

                for (cr in checkArray) {
                    var pcount = $("#cfatable").find("input[data-role='" + checkArray[cr] + "']");
                    var dcount = $.grep(data, function (n, i) {
                        return (n.OptRoleName === checkArray[cr]) && (n.IsPass == true);
                    });
                    if (pcount.length -1 == dcount.length) {
                        $("input[class='batchc'][data-role='" + checkArray[cr] + "']").prop("checked", true);
                    }
                } 
            }
        };
        main.ajax(opt);
    }

    function auditclientFileAuditExecBatch() {
        $("input[class='batchc'][type=checkbox]").click(function () {
            var curCBox = $(this);
            var checked = curCBox.is(":checked");

            //寻找该列所有cbx,通过列匹配
            var roleName = curCBox.data("role");
            var subCheckBoxs = $("#cfatable").find("input[data-role='" + roleName + "']");
            var Items = new Array();
            subCheckBoxs.each(function () {
                //获取相关元素
                var scb = $(this);
                if (scb != curCBox) {
                    var group = scb.data('group');
                    var title = scb.data('title');
                    var item = { group: group, title: title, rolename: roleName, checked: checked };
                    Items.push(item);
                }
            });

            if (Items.length>0) {
                var opt = {
                    url: "/client/ClientFileAuditExec?d=" + new Date(),
                    data: { clientId: '@Model.ClientId' , Items: Items },
                    dataType: "Html",
                    type: "Post",
                    success: function (data) { 
                        initaudit();
                        subCheckBoxs.each(function () {
                            var scb = $(this);
                            scb.prop("checked", checked);
                        }); 
                    }
                };
                main.ajax(opt);
            }
        });
    }

    function auditclientFileAuditExec() {
        $("input[class='singlec'][type=checkbox]").click(function () {
            var curCBox = $(this);
            if (curCBox.is(":disabled") == false) {
                var checked = curCBox.is(":checked");
                var clientId = '@Model.ClientId';
                var group = curCBox.data('group');
                var title = curCBox.data('title');
                var roleName = curCBox.data('role');

                var item = { group: group, title: title, rolename: roleName, checked: checked };
                var Items = new Array();
                Items.push(item);
                var opt = {
                    url: "/client/ClientFileAuditExec?d=" + new Date(),
                    data: { clientId: clientId, Items: Items },
                    dataType: "Html",
                    type: "Post",
                    success: function (data) {
                        initaudit();
                        var arrayR = $("#cfatable").find("input[class='singlec'][data-role ='" + roleName+"']");
                        if (checked) {
                            var checkcount = 0;
                            arrayR.each(function () {
                                if ($(this).is(":checked")) {
                                    checkcount = checkcount + 1;
                                }
                            });
                            if (checkcount  == arrayR.length) {
                                $("input[class='batchc'][data-role='" + roleName + "']").prop("checked", true);
                            }
                        }
                        else {
                            $("input[class='batchc'][data-role='" + roleName + "']").prop("checked", false);
                        }
                    }
                };
                main.ajax(opt);

            }
        });
    } 

    $(function () { 
        initaudit(); 
        auditclientFileAuditExec();
        auditclientFileAuditExecBatch();
    });
</script>

<div id="auditDiv" style="background-color:#FFF"><br />
    <h3 style="text-align:center;">@Company <br/>机构场外衍生品客户资料清单(专1)</h3><br /> 
    <table class="cfatable" id="cfatable" style="margin-left:10px;">
        <tr>
            <th>客户名称</th>
            <th style="font-family: fantasy;">@Model.ClientName</th>
            @foreach (var role in Model.RoleColumns)
            {
                //只能操作user包含的角色，没开始审核只能操作提交人
                <th>@role.Name</th>               
            }
        </tr>
        <tbody id="tbodyAuditClientFiles">
            <tr>
                <th colspan="2">客户资料</th>
                @foreach (var role in Model.RoleColumns)
                {
                    <td></td>
                }
            </tr>
            @foreach (var gp in Model.ItemRows)
            {
                <tr>
                    <th rowspan="@gp.Titles.Count">@gp.Group</th>
                    <td>
                        @gp.Titles[0]
                    </td>
                    @foreach (var rc in Model.RoleColumns)
                    {
                        var isdisabled = "";           
                        if (!roleList.Contains(rc.OptName) || !IsApproval)
                        {
                            isdisabled = "disabled";
                        }
                        if(rc.OptName == "提交人" && (CurUser.客户管理.客户新增 && CurUser.客户管理.客户修改))
                        {
                            isdisabled = "";
                        }
                        <td><input class="singlec" @isdisabled type="checkbox" data-group="@gp.Group" data-title="@gp.Titles[0]" data-role="@rc.Name" /></td>
                    }
                </tr>
                foreach (var r in gp.Titles)
                {
                    if (r != gp.Titles[0])
                    {
                        <tr>
                            <td>@r</td>
                            @foreach (var rc in Model.RoleColumns)
                            {
                                var isdisabled = "";
                                if (!roleList.Contains(rc.OptName) || !IsApproval)
                                {
                                    isdisabled = "disabled";
                                }
                                if (rc.OptName == "提交人" && CurUser.客户管理.客户新增)
                                {
                                    isdisabled = "";
                                }
                                <td><input class="singlec" @isdisabled type="checkbox" data-group="@gp.Group" data-title="@r" data-role="@rc.Name" /></td>
                            }
                        </tr>
                    }
                }
            }

            <tr>
                <th colspan="2">全选</th>
                @{
                    foreach (var rc in Model.RoleColumns)
                    {
                        var isdisabled = "";
                        if (!roleList.Contains(rc.OptName) || !IsApproval)                           
                        {
                            isdisabled = "disabled";
                        }
                        if (rc.OptName == "提交人" && CurUser.客户管理.客户新增)
                        {
                            isdisabled = "";
                        }
                        <td><input class="batchc" @isdisabled type="checkbox" data-role="@rc.Name" /></td>
                    }
                }
            </tr>
            <tr>
                <th colspan="2">审批人</th>
                @foreach (var role in Model.RoleColumns)
                {
                    <td class="Auditor" data-role="@role.Name" >/</td>
                }
            </tr>
             
        </tbody>
    </table>
    <div class="toolbarDiv" id="toolbarDiv">
        @MyControls.Btn("下载PDF", "exportpdf();")
        @*@MyControls.Btn("关闭", "layer.closeMe();")*@
    </div>
</div>