blame | 历史 | 补丁 | 提交 | 提交对比 | ignore whitespace
binxie
2023-06-26 d3e4451e36fbe25da4427bccd4e6b41aefd473c8 
 force-app/main/default/pages/QISPDF.page


@@ -1,31 +1,52 @@


<apex:page controller="QISPDFController" showHeader="false" sidebar="false" renderAs="pdf" action="{!init}" applyHtmlTag="false">


<!-- <apex:page controller="QISPDFController" showHeader="false" sidebar="false" action="{!init}" applyHtmlTag="false"> -->


<!-- <apex:page controller="QISPDFController" showHeader="false" sidebar="false" renderAs="pdf" action="{!init}" applyHtmlTag="false"> -->


<apex:page controller="QISPDFController" showHeader="false" sidebar="false" action="{!init}" applyHtmlTag="false" lightningStylesheets="true" >


<html>


    <head>


        <style>


        @page {


            size: A4 portrait;


            margin: 5mm 12mm 5mm 12mm;


            @page {


                size: A4 portrait;


                margin: 5mm 12mm 5mm 12mm;


                


    /*             @bottom-center { */


    /*                 content: counter(page) " / " counter(pages); */


    /*             } */


            }


            


/*             @bottom-center { */


/*                 content: counter(page) " / " counter(pages); */


/*             } */


        }


        


        table {border-collapse: collapse;}


        


/*         td {padding: 0px 0px 0px 0px;} */


        td.title {text-align: center; font-weight: bold; background-color: #BDBDBD;}


        td.middle {text-align: center; font-size:120%; font-weight: bold;}


        td.label {padding-left: 10px;}


        


            table {border-collapse: collapse;}


            


    /*         td {padding: 0px 0px 0px 0px;} */


            td.title {text-align: center; font-weight: bold; background-color: #BDBDBD;}


            td.middle {text-align: center; font-size:120%; font-weight: bold;}


            td.label {padding-left: 10px;}




            /* 20220221 PI改造 by 徐亮 start */


            body{margin: 0 auto;


            width: 780px;}


            .title1{height: 30px;}


            .title2{height: 110px;}


            /* 20220221 PI改造 by 徐亮 end */


            




        </style>


        <!-- 20220221 PI改造 by 徐亮 start  -->


        <apex:includeScript value="{! URLFOR($Resource.AWSService, 'AWSService.js') }" />


        <apex:includeScript value="{!URLFOR($Resource.connection20)}"/>


        <apex:stylesheet value="{!URLFOR($Resource.blockUIcss)}"/>


        <apex:includeScript value="{!URLFOR($Resource.jquery183minjs)}"/>


        <apex:includeScript value="{!URLFOR($Resource.PleaseWaitDialog)}"/>


        <apex:includeScript value="{!URLFOR($Resource.jspdf)}"/>


        <apex:includeScript value="{!URLFOR($Resource.html2canvas)}"/>




        <!-- 20220221 PI改造 by 徐亮 end  -->


    </head>


    


    <body style="font-family: Arial Unicode MS;">


<body style="font-family: MS Gothic;">


    <div id="pdf-wrapper">


        <div class="pdf-page">


            


        <table width="100%" border="0">


            <tr>


                <td width="15%">


                <td width="25%">


                    <!-- <apex:image value="{!$Resource.swmLOGO}" /> -->


                    <table width="100%" border="1" cellspacing="0" style="border-color: red;">


                        <tr><td colspan="2" style="font-size: 6px; font-weight: bold; color: red; text-align: center; padding: 0px 0px 0px 0px;">OLYMPUS</td></tr>


@@ -47,7 +68,7 @@


            </tr>


        </table>


        <div style="height:3px;"></div>


        <table width="100%" border="1" cellspacing="2" style="font-size: 8pt;">


        <table width="100%" border="0" cellspacing="2" style="font-size: 8pt;">


            <tr>


                <td>


                    <table width="100%" border="1" cellspacing="0">


@@ -60,8 +81,8 @@


                        <tr>


                            <td class="label" height="23px">机器号/批号</td>


                            <td class="middle">{!qr.lot_or_serial__c}</td>


<!--                             <td class="label">OCM管理号码</td> -->


<!--                             <td class="middle">{!qr.OCM_control_no__c}</td> -->


    <!--                             <td class="label">OCM管理号码</td> -->


    <!--                             <td class="middle">{!qr.OCM_control_no__c}</td> -->


                        </tr>


                        <tr >


                            <td class="label" height="23px">问题现象</td>


@@ -102,13 +123,13 @@


                            <td width="25%" class="label" height="23px">提交者上司</td>


                            <td width="25%" class="middle">{!usr.Manager.Name}</td>


                            <td width="10%" class="label">电话号码</td>


                            <td colspan="2" class="middle">{!qr.Caller_phone__c}</td>


                            <td colspan="2" class="middle" id="Caller_phone__c">{!qr.Caller_phone__c}</td>


                        </tr>


                        <tr>


                            <td width="25%" class="label" height="23px">提交日期</td>


                            <td width="25%" class="middle"><apex:outputField value="{!qr.QIS_Submit_day__c}" /></td>


                            <td width="10%" class="label">联系人</td>


                            <td colspan="2" class="middle">{!qr.Responsible_Person_HP__c}</td>


                            <td colspan="2" class="middle" id="Responsible_Person_HP__c">{!qr.Responsible_Person_HP__c}</td>


                        </tr>


                    </table>


                </td>


@@ -161,10 +182,10 @@


                            </apex:outputPanel>内


                                &nbsp;&nbsp;&nbsp;&nbsp;


                                <apex:outputPanel layout="none"


                                 rendered="{!if(Not(inGuarantee) && Not(outOfGuarantee) , 'true', 'false')}"


                                 >&#10004;</apex:outputPanel>


                                    rendered="{!if(Not(inGuarantee) && Not(outOfGuarantee) , 'true', 'false')}"


                                    >&#10004;</apex:outputPanel>


                                <apex:outputPanel layout="none" 


                               


                                


                                rendered="{!if(inGuarantee || outOfGuarantee , 'true', 'false')}"


                                >&#9633;</apex:outputPanel>外


                            </td>


@@ -203,7 +224,7 @@


                            <td colspan="3" class="middle">{!qr.Set_usage_product__c}</td>


                        </tr>


                        <tr>


                            <td colspan="4" style="height:18px; padding-top: 0px; padding-bottom: 0px; padding-left: 10px;">问题内容描述</td>


                            <td colspan="4" style="height:18px; padding-top: 0px; padding-bottom: 0px; padding-left: 10px;border-bottom: none;border-bottom: none;">问题内容描述</td>


                        </tr>


                        <tr>


                            <td colspan="4" style="height:40px; border-top-color: white; font-size:120%; font-weight: bold; vertical-align: top;"><c:PDFWbr targetStr="{!qr.problem_detail__c}" /></td>


@@ -240,13 +261,13 @@


                            <td colspan="13" class="title">OCSM服务本部</td>


                        </tr>


                        <tr>


                            <td colspan="13" style="height:18px; padding-top: 0px; padding-bottom: 0px; padding-left: 10px;">检测/分析情况详述</td>


                            <td colspan="13" style="height:18px; padding-top: 0px; padding-bottom: 0px; padding-left: 10px;border-bottom: none;">检测/分析情况详述</td>


                        </tr>


                        <tr>


                            <td colspan="13" style="height:42px; border-top-color: white; font-size:120%; font-weight: bold; vertical-align: top;"><c:PDFWbr targetStr="{!qr.QIS_Reply_Comment__c}" /></td>


                        </tr>


                        <tr>


                            <td colspan="13" style="height:18px; padding-top: 0px; padding-bottom: 0px; padding-left: 10px;">原因</td>


                            <td colspan="13" style="height:18px; padding-top: 0px; padding-bottom: 0px; padding-left: 10px;border-bottom: none;">原因</td>


                        </tr>


                        <tr>


                            <td colspan="13" style="height:42px; border-top-color: white; font-size:120%; font-weight: bold; vertical-align: top;"><c:PDFWbr targetStr="{!qr.Reason_bloken__c}" /></td>


@@ -279,28 +300,28 @@


                            </td>


                        </tr>


                        <tr>


<!--                             <td colspan="4" style="text-align: center;" height="23px">现品收到日</td> -->


<!--                             <td colspan="4" style="text-align: center;">确认日</td> -->


    <!--                             <td colspan="4" style="text-align: center;" height="23px">现品收到日</td> -->


    <!--                             <td colspan="4" style="text-align: center;">确认日</td> -->


                            <td colspan="3" style="text-align: center;" height="23px">现品收到日</td>


                            <td colspan="3" style="text-align: center;">CDS日</td>


                            <td colspan="3" style="text-align: center;">检查日</td>


                            <td colspan="4" style="text-align: center;">确认日</td>


                        </tr>


                        <tr>


<!--                             <td colspan="4" class="middle" style="height:30px;"><apex:outputField value="{!qr.OCM_RC_RecievedDate__c}" /></td> -->


<!--                             <td colspan="4" class="middle"><apex:outputField value="{!qr.QIS_Reply_day__c}" /></td> -->


    <!--                             <td colspan="4" class="middle" style="height:30px;"><apex:outputField value="{!qr.OCM_RC_RecievedDate__c}" /></td> -->


    <!--                             <td colspan="4" class="middle"><apex:outputField value="{!qr.QIS_Reply_day__c}" /></td> -->


                            <td colspan="3" class="middle" style="height:30px;"><apex:outputField value="{!qr.OCM_RC_RecievedDate__c}" /></td>


                            <td colspan="3" class="middle"><apex:outputField value="{!qr.CDS_date__c}" /></td>


                            <td colspan="3" class="middle"><apex:outputField value="{!qr.RC_inspection_date__c}" /></td>


                            <td colspan="4" class="middle"><apex:outputField value="{!qr.QIS_Reply_day__c}" /></td>


                        </tr>


                        <tr>


<!--                             <td style="text-align: center; height:40px;">确认者</td> -->


<!--                             <td colspan="2" width="24%" class="middle">{!qr.RC__r.Alias__c}</td> -->


<!--                             <td style="text-align: center; color: #D8D8D8">盖章</td> -->


<!--                             <td style="text-align: center;">确认者</td> -->


<!--                             <td colspan="2" width="24%" class="middle">{!qr.RC_manager__r.Alias__c}</td> -->


<!--                             <td style="text-align: center; color: #D8D8D8">盖章</td> -->


    <!--                             <td style="text-align: center; height:40px;">确认者</td> -->


    <!--                             <td colspan="2" width="24%" class="middle">{!qr.RC__r.Alias__c}</td> -->


    <!--                             <td style="text-align: center; color: #D8D8D8">盖章</td> -->


    <!--                             <td style="text-align: center;">确认者</td> -->


    <!--                             <td colspan="2" width="24%" class="middle">{!qr.RC_manager__r.Alias__c}</td> -->


    <!--                             <td style="text-align: center; color: #D8D8D8">盖章</td> -->


                            <td width="6%" style="height:40px;">确认者</td>


                            <td width="13%" class="middle">{!qr.RC__r.Alias__c}</td>


                            <td width="6%" style="text-align: center; color: #D8D8D8">盖章</td>


@@ -324,7 +345,7 @@


                            <td colspan="10" class="title">OSH 医疗品质保障部</td>


                        </tr>


                        <tr>


                            <td colspan="9" style="height:18px; padding-top: 0px; padding-bottom: 0px; padding-left: 10px;">检测/分析情况详述<br/></td>


                            <td colspan="9" style="height:18px; padding-top: 0px; padding-bottom: 0px; padding-left: 10px;border-bottom: none;">检测/分析情况详述<br/></td>


                            <td style="text-align: center;">质量判定</td>


                        </tr>


                        <tr>


@@ -368,7 +389,7 @@


                            <td width="6%" style="text-align: center; color: #D8D8D8">盖章</td>


                            <td width="6%">负责人</td>


                            <td width="13%" class="middle">{!qr.OSH_Manager__r.Alias__c}


<!--                                 {!IF(Isblank(qr.OSH_Manager__r.BuchangApprovalManager__c), qr.OSH_Manager__r.Alias__c, qr.OSH_Manager__r.BuchangApprovalManager__r.Alias__c)} -->


    <!--                                 {!IF(Isblank(qr.OSH_Manager__r.BuchangApprovalManager__c), qr.OSH_Manager__r.Alias__c, qr.OSH_Manager__r.BuchangApprovalManager__r.Alias__c)} -->


                            </td>


                            <td width="6%" style="text-align: center; color: #D8D8D8">盖章</td>


                            <td width="25%" class="middle">{!qr.QIS_no_for_m_BC__c}</td>


@@ -378,11 +399,14 @@


            </tr>


        </table>


        


        <div style="page-break-after: always;"></div>


        


        </div>


        <div style="page-break-after: always;"></div>


        <div class="pdf-page">


            


        <table width="100%" border="0">


            <tr>


                <td width="15%">


                <td width="25%">


                    <table width="100%" border="1" cellspacing="0" style="border-color: red;">


                        <tr><td colspan="2" style="font-size: 6px; font-weight: bold; color: red; text-align: center; padding: 0px 0px 0px 0px;">OLYMPUS</td></tr>


                        <tr>


@@ -403,7 +427,7 @@


            </tr>


        </table>


        <div style="height:3px;"></div>


        <table width="100%" border="1" cellspacing="2" style="font-size: 8pt;">


        <table width="100%" border="0" cellspacing="2" style="font-size: 8pt;">


            <tr>


                <td>


                    <table width="100%" border="1" cellspacing="0">


@@ -416,8 +440,8 @@


                        <tr>


                            <td class="label" height="23px">机器号/批号</td>


                            <td class="middle">{!qr.lot_or_serial__c}</td>


<!--                             <td class="label">OCM管理号码</td> -->


<!--                             <td class="middle">{!qr.OCM_control_no__c}</td> -->


    <!--                             <td class="label">OCM管理号码</td> -->


    <!--                             <td class="middle">{!qr.OCM_control_no__c}</td> -->


                        </tr>


                        <tr >


                            <td class="label" height="23px">问题现象</td>


@@ -432,34 +456,188 @@


        <br/>


        <table width="100%" border="1" cellspacing="2" style="font-size: 8pt;">


            <tr>


                <td>


                    <table width="100%" border="1" cellspacing="0">


                        <tr><td style="height:300px; text-align: center;"><apex:image value="{!qr.Photo_1_Text__c}" width="80%" rendered="{!NOT(ISBLANK(qr.Photo_1_Text__c))}" /></td></tr>


                <td style="width:50%">


                    <table width="100%" border="0" cellspacing="0">


                        <tr><td style="height:300px; text-align: center;"><apex:image id="Photo_1_Text" value="{!Photo_1_Text}" width="80%" rendered="{!NOT(ISBLANK(qr.Photo_1_Text__c))}" /></td></tr>


                        <tr><td style="height:40px;"></td></tr>


                    </table>


                </td>


                <td style="border-left-color: white;">


                    <table width="100%" border="1" cellspacing="0">


                        <tr><td style="height:300px; text-align: center;"><apex:image value="{!qr.Photo_2_Text__c}" width="80%" rendered="{!NOT(ISBLANK(qr.Photo_2_Text__c))}" /></td></tr>


                    <table width="100%" border="0" cellspacing="0">


                        <tr><td style="height:300px; text-align: center;"><apex:image value="{!Photo_2_Text}" width="80%" rendered="{!NOT(ISBLANK(qr.Photo_2_Text__c))}" /></td></tr>


                        <tr><td style="height:40px;"></td></tr>


                    </table>


                </td>


            </tr>


            <tr>


                <td style="border-top-color: white;">


                    <table width="100%" border="1" cellspacing="0">


                        <tr><td style="height:300px; text-align: center;"><apex:image value="{!qr.Photo_3_Text__c}" width="80%" rendered="{!NOT(ISBLANK(qr.Photo_3_Text__c))}" /></td></tr>


                    <table width="100%" border="0" cellspacing="0">


                        <tr><td style="height:300px; text-align: center;"><apex:image value="{!Photo_3_Text}" width="80%" rendered="{!NOT(ISBLANK(qr.Photo_3_Text__c))}" /></td></tr>


                        <tr><td style="height:40px;"></td></tr>


                    </table>


                </td>


                <td style="border-left-color: white; border-top-color: white;">


                    <table width="100%" border="1" cellspacing="0">


                        <tr><td style="height:300px; text-align: center;"><apex:image value="{!qr.Photo_4_Text__c}" width="80%" rendered="{!NOT(ISBLANK(qr.Photo_4_Text__c))}" /></td></tr>


                    <table width="100%" border="0" cellspacing="0">


                        <tr><td style="height:300px; text-align: center;"><apex:image value="{!Photo_4_Text}" width="80%" rendered="{!NOT(ISBLANK(qr.Photo_4_Text__c))}" /></td></tr>


                        <tr><td style="height:40px;"></td></tr>


                    </table>


                </td>


            </tr>


        </table>


    </body>


        </div>


        


    </div>


</body>




<!-- 20220221 PI改造 by 徐亮 start  -->


<script>


    AWSService.sfSessionId = '{!GETSESSIONID()}';


    var staticResources = JSON.parse('{!staticResource}');


    var staticResourceFile = JSON.parse('{!staticResourceFile}');


    function Fun(pdf) {




        var form = jQuery("<form method='post'></form>");


        jQuery(document.body).append(form);


        let href = window.location.href


        let arr = href.split('/')


        form.attr({ "action": staticResourceFile.viewUnifiedContactUrl + "?from=" + encodeURIComponent(href) + "&fileName=" + encodeURIComponent(arr[arr.length - 1].split('?')[0]) });


        // form.attr({"action":"http://127.0.0.1:8080/a/d?from="+encodeURIComponent(window.location.href)});


        let input = jQuery("<input type='hidden'/>");


        input.attr({ "name": "base64Str" });


        input.val(pdf.output('datauristring').substr(28));


        form.append(input);


        form.submit();




        // jQuery("body > *").each(function(){


        //  jQuery(this).css('display','none');


        // })


        // jQuery("body").append('<embed style="position:absolute; left: 0; top: 0;" width="100%" height="100%" src="'+pdf.output('datauristring')+'" type="application/pdf"/>')




    }




    let id = "pdf-wrapper";


    var target = document.getElementById(id);


    // 把imageDta转换成url


        // page_height：一页的高度


        function ImageDataToUrl(img_data,page_height){


            let cvs = document.createElement("CANVAS");


            cvs.width = img_data.width;


            cvs.height = page_height;


            var ctx= cvs.getContext("2d");


            ctx.fillStyle="white";


            ctx.fillRect(0,0,cvs.width,cvs.height);// 填充canvas所有区域为白色


            ctx.putImageData(img_data,0,0);


            return cvs.toDataURL('image/jpeg', 1.0);


        }


        function jsPdfDownload() {


    


            let jtargets = jQuery("#pdf-wrapper .pdf-page");


            let j_arr = new Array(jtargets.length + 1).join(0).split('').map(function () { return false });


            let landscape = false;


            let pw = 595.28;


            let ph = 841.89;


            const marginw = 40;


            const marginh = 40;


    


            let orientation = '';


            if (landscape) {


                pw += ph; ph = pw - ph; pw = pw - ph;


                orientation = 'l';


            }


            var pdf = new jsPDF(orientation, 'pt', 'a4');// 第一个参数填字母l，注意不是数字1，为横向pdf


            jtargets.each(function (i, e) {


                e.style.background = "#FFFFFF";


            })


    


            let rei = 0;


            let recursion = null;


            recursion = function (i) {


                if (i >= jtargets.length) {


                    Fun(pdf);


                    return;


                }


                e = jtargets[i];


                html2canvas(e, {


                    scale: 2,


                    onrendered: function (canvas) {


                        /**


                        本方法需要做几个事情


                        1.需要把canvas的内容分页显示到pdf的页中


                        2.canvas的宽高需要和pdf的宽高进行映射


                        3.截取到的内容需要放进一页宽高的canvas里面，并对其余区域刷白


                        */


                        var ctx = canvas.getContext("2d");


                        let canvas_max_page_num = 9;


                        let canvas_current_page_num = 0;


                        var contentWidth = canvas.width;


                        var contentHeight = canvas.height;


    


                        


                        //未生成pdf的html页面高度


                        var leftHeight = contentHeight;


                        //页面偏移


                        var position = 0;


                        


                        //a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高


                        var outputWidth = pw - 2 * marginw;//595.28//左右边距20


                        let rate = outputWidth / 780;//输出宽度和内容宽度的比例


                        var outputHeight = ph - 2 * marginh;//左右边距20


                        let onePdfPageInCanvasHeight = contentWidth/outputWidth*outputHeight;//一页pdf在canvas中的高度;


                        //var pageData = canvas.toDataURL('image/jpeg', 1.0);


                        var pageData = null;


                        var imgData = null;


                        


                        var captureHeight = null;// 截取的当前canvas页的高度


                        


                        let j = i;


                        while(position < contentHeight){


                            


                            if (j++) {


                                pdf.addPage();


                            }




                            if(position+onePdfPageInCanvasHeight>contentHeight){


                                captureHeight = contentHeight-position;


                            }else{


                                captureHeight = onePdfPageInCanvasHeight;


                            }


    


                            imgData = ctx.getImageData(0,position,contentWidth,captureHeight);


                            pageData = ImageDataToUrl(imgData,onePdfPageInCanvasHeight);


                            pdf.addImage(pageData, 'JPEG', marginw, marginh, outputWidth, outputHeight);//左右边距20,被输出的图片会被拉伸为outputWidth，outputHeight的宽高


                            canvas_current_page_num++;


                            position += onePdfPageInCanvasHeight;


                            if (canvas_max_page_num > 0 && canvas_current_page_num >= canvas_max_page_num) {


                                break;


                            }


                        }


    


                        recursion(i + 1);


                    }


                })


            };


            recursion(rei);


    


    


    


        }


    


        //blockme();


        document.body.onload = function(){


            


            AWSService.query(staticResources.queryUrl, '{!qr.AWS_Data_Id__c}', function(data){


                //unblockUI();


                document.getElementById("Responsible_Person_HP__c").innerHTML = data.object.responsiblePersonHP;


                document.getElementById("Caller_phone__c").innerHTML = data.object.callerPhone;


                if(confirm("PDF已加载完毕，是否显示？")){


                    jsPdfDownload(); 


                }


            }, staticResources.token);


        }


        


        


    


</script>


<!-- 20220221 PI改造 by 徐亮 end  -->


</html>


</apex:page>