~lichunping/lims-before.git

Merge branch 'master' of http://192.168.110.209:9001/r/lims-before

zouyu

2023-09-01 234e8f7af3e93f78e5384b64e26c2f23c659bfcc

Merge branch 'master' of http://192.168.110.209:9001/r/lims-before

已修改7个文件

	src/components/experiment/checkTheReport/index.vue	341 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/components/experiment/template_testReport/index.vue	1341 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/views/experiment/checkTheReport/index.vue	701 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/views/experiment/inspectionApplication/Viewdetails/index.vue	10 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/views/experiment/inspectionApplication/index.vue	31 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/views/experiment/planAssignments/plan.vue	10 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/views/experiment/reportAuditing/index.vue	3 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史

 src/components/experiment/checkTheReport/index.vue

@@ -1,167 +1,184 @@
<template>
    <div class="preview-main">
        <div class="logo">
            <img :src="logoSrc" />
        </div>
        <div class="center">
            <h1>原材料检测报告</h1>
            <table height="30px">
                <tr>
                    <td>材料名称</td>
                    <td colspan="5">{{reportData.name}}</td>
                </tr>
                <tr>
                    <td>规格型号</td>
                    <td colspan="2">
                        {{reportData.specifications.split("-")[1]}}
                    </td>
                    <td>材料厂家</td>
                    <td colspan="2">{{reportData.supplier}}</td>
                </tr>
                <tr>
                    <td>材料编号</td>
                    <td colspan="2">{{reportData.imCode}}</td>
                    <td>检测编号</td>
                    <td colspan="2">{{reportData.insCode}}</td>
                </tr>
                <tr>
                    <td>检测依据</td>
                    <td colspan="2">
                        {{reportData.specifications.split("-")[0]}}
                    </td>
                    <td>检测类别</td>
                    <td colspan="2">原材料</td>
                </tr>
                <tr>
                    <td>序号</td>
                    <td>检验项目</td>
                    <td>单位</td>
                    <td>标准要求</td>
                    <td>检测结果</td>
                    <td>单项判断</td>
                </tr>
                <tr v-for="(item,index) in arr" :key="index">
                    <td>{{index+1}}</td>
                    <td>{{item.ipName}}</td>
                    <td>{{item.unit}}</td>
                    <td>{{item.required}}</td>
                    <td>{{item.testValue}}</td>
                    <td >
                        {{isIfState(item.testState) }}
                    </td>
                </tr>
                <tr>
                    <td colspan="6">检验结论：{{reportData.type == 1 ? "合格" : "不合格"}}</td>
                </tr>
                <tr>
                    <td colspan="6">
                        注：“√”表示该项目合格，“×”表示该项目不合格，“—”表示该项目不要求检测。
                    </td>
                </tr>
            </table>
            <el-row class="date-group">
                <p>检测、日期：<span>{{reportData.createTime}}</span></p>
                <p>审核、日期：<span>{{reportData.checkTime}}</span></p>
            </el-row>
            <p class="footer">
                <span>编号：</span><span>{{reportData.rcode}}  </span>
                <span>发行日期：</span><span>{{now}}  </span>
                <span>保存期限：</span><span>长期</span>
            </p>
        </div>
    </div>
    <div class="preview-main">
        <div class="logo">
            <img :src="logoSrc" />
        </div>
        <div class="center">
            <h1>原材料检测报告</h1>
            <table height="30px">
                <tr>
                    <td>材料名称</td>
                    <td colspan="5">{{reportData.name}}</td>
                </tr>
                <tr>
                    <td>规格型号</td>
                    <td colspan="2">
                        {{reportData.length==0?null:reportData.specifications.split("-")[1]}}
                    </td>
                    <td>材料厂家</td>
                    <td colspan="2">{{reportData.supplier}}</td>
                </tr>
                <tr>
                    <td>材料编号</td>
                    <td colspan="2">{{reportData.imCode}}</td>
                    <td>检测编号</td>
                    <td colspan="2">{{reportData.insCode}}</td>
                </tr>
                <tr>
                    <td>检测依据</td>
                    <td colspan="2">
                        {{reportData.length==0?null:reportData.specifications.split("-")[0]}}
                    </td>
                    <td>检测类别</td>
                    <td colspan="2">原材料</td>
                </tr>
                <tr>
                    <td>序号</td>
                    <td>检验项目</td>
                    <td>单位</td>
                    <td>标准要求</td>
                    <td>检测结果</td>
                    <td>单项判断</td>
                </tr>
                <tr v-for="(item,index) in arr" :key="index">
                    <td>{{index+1}}</td>
                    <td>{{item.ipName}}</td>
                    <td>{{item.unit}}</td>
                    <td>{{item.required}}</td>
                    <td>{{item.testValue}}</td>
                    <td>
                        {{isIfState(item.testState) }}
                    </td>
                </tr>
                <tr>
                    <td colspan="6">检验结论：{{reportData.type == 1 ? "合格" : "不合格"}}</td>
                </tr>
                <tr>
                    <td colspan="6">
                        注：“√”表示该项目合格，“×”表示该项目不合格，“—”表示该项目不要求检测。
                    </td>
                </tr>
            </table>
            <el-row class="date-group">
                <p>检测、日期：<span>{{reportData.createTime}}</span></p>
                <p>审核、日期：<span>{{reportData.checkTime}}</span></p>
            </el-row>
            <p class="footer">
                <span>编号：</span><span>{{reportData.rcode}} </span>
                <span>发行日期：</span><span>{{now}} </span>
                <span>保存期限：</span><span>长期</span>
            </p>
        </div>
    </div>
</template>
<script>
export default({
    name: 'Preview',
    data() {
        return {
            logoSrc : require("@/assets/404_images/logo.png"),    
            now: new Date().toLocaleDateString(),
            arr: []
        }
    },
    mounted(){
        this.arr = this.reportData.products;
        if(this.reportData.products.length < 10){
            let size = this.reportData.products.length; 
            let num=10-size
            for(let i=0;i< num;i++){
                this.arr.push({
                    code: null,
                    ipName: "",
                    required: "",
                    testState: null,
                    testValue: "",
                    unit: ""})
            }
        }
    },
    methods:{
        formatDate(val){
            var dt = new Date(val);
            let year = dt.getFullYear();
            let month = (dt.getMonth() + 1).toString().padStart(2,'0');
            let date = dt.getDate().toString().padStart(2,'0');
            return `${year}-${month}-${date}`;
        },
        isIfState(val){
            if(val===1)return "√"
            else if(val===null || val=== undefined) return null
            else return "X"
        }
    },
    props:["reportData"]
})
    export default ({
        name: 'Preview',
        data() {
            return {
                logoSrc: require("@/assets/404_images/logo.png"),
                now: new Date().toLocaleDateString(),
                arr: []
            }
        },
        mounted() {
            this.arr = this.reportData.products;
            if(this.reportData.length>0){
                if (this.reportData.products.length < 10) {
                    let size = this.reportData.products.length;
                    let num = 10 - size
                    for (let i = 0; i < num; i++) {
                        this.arr.push({
                            code: null,
                            ipName: "",
                            required: "",
                            testState: null,
                            testValue: "",
                            unit: ""
                        })
                    }
                }
            }
        },
        methods: {
            formatDate(val) {
                var dt = new Date(val);
                let year = dt.getFullYear();
                let month = (dt.getMonth() + 1).toString().padStart(2, '0');
                let date = dt.getDate().toString().padStart(2, '0');
                return `${year}-${month}-${date}`;
            },
            isIfState(val) {
                if (val === 1) return "√"
                else if (val === null || val === undefined) return null
                else return "X"
            }
        },
        props: ["reportData"]
    })
</script>
<style scoped lang="scss">
     .preview-main{
        margin: 0;
        padding: 0;
        width:90%;
        margin-left: 5%;
        .logo{
            img{
                width: 150px;
                height: 60px;
            }
        }
        .center{
            width: 100%;
            h1{
                width:100%;
                font-family: "微软雅黑" !important;
                text-align: center;
            }
            table{
                width:100%;
                border-collapse: collapse;
                font-size: 18px;
            }
            table,tr,th,td{
                border: 2px solid black;
            }
            tr,td,th{
                padding: 15px 10px;
            }
            .date-group{
                width: 90%;
                margin-left: 5%;
                p{
                    width: 50%;
                    float: left;
                    text-align: center;
                    padding: 50px 0px;
                    font-size: 18px;
                }
            }
            .footer{
                width:90%;
                margin-left: 5%;
                color: lightgray; 
                text-align: center;
                margin-top: 300px;
            }
        }
     }
</style>
    .preview-main {
        margin: 0;
        padding: 0;
        width: 90%;
        margin-left: 5%;

        .logo {
            img {
                width: 150px;
                height: 60px;
            }
        }

        .center {
            width: 100%;

            h1 {
                width: 100%;
                font-family: "微软雅黑" !important;
                text-align: center;
            }

            table {
                width: 100%;
                border-collapse: collapse;
                font-size: 18px;
            }

            table,
            tr,
            th,
            td {
                border: 2px solid black;
            }

            tr,
            td,
            th {
                padding: 15px 10px;
            }

            .date-group {
                width: 90%;
                margin-left: 5%;

                p {
                    width: 50%;
                    float: left;
                    text-align: center;
                    padding: 50px 0px;
                    font-size: 18px;
                }
            }

            .footer {
                width: 90%;
                margin-left: 5%;
                color: lightgray;
                text-align: center;
                margin-top: 300px;
            }
        }
    }
</style>

 src/components/experiment/template_testReport/index.vue

@@ -1,648 +1,709 @@
<template>
  <div class="content-wrapper">
    <div class="content-main">
      <div class="cover">
        <div class="cover-top">
          <div>
            <div style="height: 30px; line-height: 30px;">报告编号:</div>
            <div style="height: 30px; line-height: 30px;">Reference No:</div>
          </div>
        </div>
        <div class="title">
          <h1 style="text-align-last:justify ;">检验报告</h1>
          <h1>Test   Report</h1>
        </div>
        <div class="cover-body">
          <div class="name">
            <div style="width:140px; text-align-last: justify;">
            <div>试样名称</div>
            <span style="font-size: 14px;">Name of Product</span>
            </div>
            <div class="line"> 测试名称</div>
          </div>
          <div class="name">
            <div style="width:140px; text-align-last: justify;">
            <div style="text-align-last: justify;">型号</div>
            <span style="font-size: 14px;">Type and Size</span>
            </div>
            <div class="line"> 测试名称</div>
          </div>
          <div class="name">
            <div style="width:140px; text-align-last: justify;">
            <div>委托单位</div>
            <span style="font-size: 14px;display: block;margin: 10px 45px 0px;">Client</span>
          </div>
            <div class="line"> 测试名称</div>
          </div>
          <div class="name">
            <div style="width:140px; text-align-last: justify;">
            <div>检验类别</div>
            <span style="font-size: 14px;">Kind of Test</span></div>
            <div class="line"> 测试名称</div>
          </div>
        </div>
        <div class="cover-footer">
          <span>江苏中天科技股份有限公司检测中心</span><br>
          <span style="font-size: 14px;">TEST CENTER OF JIANGSU ZHONGTIAN TECHNOLOGY CO.,LTD</span>
        </div>
      </div>
      <div class="pageOne">
        <div class="statement">
          <div><h2>声明</h2></div>
          <div style="text-align-last: center;"><h2 style="font-size: 14px;">Statement</h2></div>
        </div>
        <div class="statement-body">
          <div>
            <span>1.    本检验报告（包括复印件）未加检测专用章一律无效。</span><br>
            <span>This test report (including any duplicates) shall become effective only with pecial chapter for testing on.</span>
          </div>
          <div>
            <span>2.    本检验报告无编写、审核、批准人签章无效。</span><br>
            <span>This test report shall become effective only with the signatures of compiler checker and approver.</span>
          </div>
          <div>
            <span>3.    本检验报告涂改无效。</span><br>
            <span>This test report will be invalid if altered.</span>
          </div>
          <div>
            <span>4.    本检验报告不得部分复印。</span><br>
            <span>This test report mustn’t copy partly.</span>
          </div>
          <div>
            <span>5.    送样委托检验，仅对来样负责。</span><br>
            <span>For the sample submitted by clients, the test result is valid only for these samples.</span>
          </div>
          <div>
            <span>6.    样品及委托单位为委托方自命名。</span><br>
            <span>Samples and consignor name for the principal.</span>
          </div>
          <div>
            <span>7.    本检验报告中英文描述有冲突时，以中文解释为准。</span><br>
            <span>If the Chinese and English version of the test report have any conflict, the Chinese version should be the standard for arbitrament.</span>
          </div>
          <div>
            <span>8.    委托方对本检验报告若有异议，应于样品保存期内向本中心提出，联系电话：0513-84885657</span><br>
            <span>Clients who have any different ideas about this test report, may contract with Test Central within the sample reservation time. Tel: 0513-84885657</span>
          </div>
          <div>
            <span>9.    本中心样品自报告发送日起，一般保存一个月，以备复验。</span><br>
            <span>The sample shall be reserved for one month beginning from the data when this test report is submitted for examine or review.</span>
          </div>
        </div>
        <div class="statement-footer">
          <div class="depart">
            <span>江苏中天科技股份有限公司检测中心</span><br>
            <span>Test Center of Jiangsu Zhongtian Technology Co., LTD</span>
          </div>
          <div class="address">
            <span>地    址：江苏省南通市经济技术开发区新开南路19号</span><br>
            <span>Address: No.19 Xinkai South Road, Nantong Economic and Technological Development Zone, Jiangsu Province</span>
          </div>
          <div class="zipcode">邮政编码Zip Code：226010</div>
          <div class="tel">电    话Tel：0513-89059043</div>
          <div class="email">邮    箱E-mail:：ztttc@chinaztt.com </div>
        </div>
      </div>
      <div class="pageTwo">
        <div class="header" style="line-height: 10px;">
          <div style="width: 350px;margin: 0 auto; text-align-last: justify;">
            <h2 style="font-size: 18px;">江苏中天科技股份有限公司检测中心</h2>
          </div>
          <div style="width: 500px; margin: 0 auto;text-align-last: justify;">
            <h2 style="font-size: 14px;">TEST CENTER OF JIANGSU ZHONGTIAN TECHNOLOGY CO.,LTD</h2>
          </div>
          <div style="width: 120px;margin: 0 auto;text-align-last: justify;">
            <h2 style="font-size: 18px;">检测报告</h2>
          </div>
          <div style="width: 100px; margin: 0 auto;text-align-last: justify;">
            <h2 style="font-size: 14px;">Test Report</h2>
          </div>
        </div>
        <div class="table">
          <div class="table-header">
            <div>
              <span>报告编号：</span><br>
              <span>Reference No：</span>
            </div>
            <div>
              <span>第1页共2页</span><br>
              <span>Page 1 of 2</span>
            </div>
          </div>
          <div class="table-body">
            <table width="100%" border="1" cellspacing="0" style="text-align: center;">
              <tr>
                <td><span>试样名称</span><br>
                <span>Name of product</span></td>
                <td colspan="2"></td>
                <td>
                  <span>规格型号</span><br>
                  <span>Type and size</span>
                </td>
                <td colspan="2"></td>
              </tr>
              <tr>
                <td>
                  <span>样品数量</span><br>
                  <span>Test item</span>
                </td>
                <td colspan="2"></td>
                <td>
                  <span>检验项目</span><br>
                  <span>Test item</span>
                </td>
                <td colspan="2"></td>
              </tr>
              <tr>
                <td>
                  <span>来样方式</span><br>
                  <span>Delivering method</span>
                </td>
                <td colspan="2"></td>
                <td>
                  <span>检验类型</span><br>
                  <span>Type of test</span>
                </td>
                <td colspan="2"></td>
              </tr>
              <tr>
                <td>
                  <span>样品状态</span><br>
                  <span>Sample discription</span>
                </td>
                <td colspan="2"></td>
                <td>
                  <span>生产单位</span><br>
                  <span>Producer</span>
                </td>
                <td colspan="2"></td>
              </tr>
              <tr>
                <td>
                  <span>收样时间</span><br>
                  <span>Received date</span>
                </td>
                <td colspan="2"></td>
                <td>
                  <span>检验日期</span><br>
                  <span>Test date</span>
                </td>
                <td colspan="2"></td>
              </tr>
              <tr>
                <td>
                  <span>委托人</span><br>
                  <span>Consignor</span>
                </td>
                <td colspan="2"></td>
                <td>
                  <span>电话</span><br>
                  <span>Tel</span>
                </td>
                <td colspan="2"></td>
              </tr>
              <tr>
                <td>
                  <span>委托单位</span><br>
                  <span>Client</span>
                </td>
                <td colspan="5"></td>
              </tr>
              <tr>
                <td>
                  <span>委托单位地址</span><br>
                  <span>Address</span>
                </td>
                <td colspan="5"></td>
              </tr>
              <tr>
                <td>
                  <span>检验环境</span><br>
                  <span>Test environment</span>
                </td>
                <td colspan="5"></td>
              </tr>
              <tr>
                <td>
                  <span>检验依据</span><br>
                  <span>Test standard</span>
                </td>
                <td colspan="5"></td>
              </tr>
              <tr>
                <td style="height: 180px;">
                  <span>结论</span><br>
                  <span>Conclusion </span>
                </td>
                <td colspan="5">
                  <div style="height: 120px;"></div>
                  <div style="height: 60px;margin-left: 250px;">
                    <span>（检测报告专用章）</span><br>
                     <span>( SPECIFIC STAMP FOR TEST RTORT) </span><br>                                        
                      <span>签发日期：  年   月   日</span><br>
                      <span>Date of issue: August 23, 2023</span>
                  </div>
                </td>
              </tr>
              <tr>
                <td>
                  <span>备注</span><br>
                  <span>Remark </span>
                </td>
                <td colspan="5"></td>
              </tr>
              <tr>
                <td>
                  <span>编制</span><br>
                  <span>Preparer</span>
                </td>
                <td colspan="2"></td>
                <td>
                  <span>检验</span><br>
                  <span>Tester</span>
                </td>
                <td colspan="2"></td>
              </tr>
              <tr>
                <td>
                  <span>审核</span><br>
                  <span>Checker </span>
                </td>
                <td colspan="2"></td>
                <td>
                  <span>批准</span><br>
                  <span>Approver</span>
                </td>
                <td colspan="2"></td>
              </tr>
            </table>
          </div>
        </div>
      </div>
      <div class="pageThree">
        <div class="header" style="line-height: 10px;">
          <div style="width: 350px;margin: 0 auto; text-align-last: justify;">
            <h2 style="font-size: 18px;">江苏中天科技股份有限公司检测中心</h2>
          </div>
          <div style="width: 500px; margin: 0 auto;text-align-last: justify;">
            <h2 style="font-size: 14px;">TEST CENTER OF JIANGSU ZHONGTIAN TECHNOLOGY CO.,LTD</h2>
          </div>
          <div style="width: 120px;margin: 0 auto;text-align-last: justify;">
            <h2 style="font-size: 18px;">检测报告</h2>
          </div>
          <div style="width: 100px; margin: 0 auto;text-align-last: justify;">
            <h2 style="font-size: 14px;">Test Report</h2>
          </div>
        </div>
        <div class="table">
          <div class="table-header">
            <div>
              <span>报告编号：</span><br>
              <span>Reference No：</span>
            </div>
            <div>
              <span>第2页共2页</span><br>
              <span>Page 2 of 2</span>
            </div>
          </div>
          <div class="table-body">
            <table width="100%" border="1" cellspacing="0" style="text-align: center;">
              <tr>
                <td colspan="4">
                  <span>样品编号</span><br>
                  <span>Sample No</span></td>
                <td colspan="3"></td>
                <td colspan="4">
                  <span>规格型号</span><br>
                  <span>Type</span>
                </td>
                <td colspan="3"></td>
              </tr>
              <tr>
                <td>
                  <span>序号</span><br>
                  <span>No</span>
                </td>
                <td colspan="3">
                  <span>检验项目</span><br>
                  <span>Test item</span>
                </td>
                <td>
                  <span>单位</span><br>
                  <span>Unit</span>
                </td>
                <td colspan="3">
                  <span>标准要求</span><br>
                  <span>Requirement</span>
                </td>
                <td colspan="3">
                  <span>检验结果</span><br>
                  <span>Test result</span>
                </td>
                <td>
                  <span>结论</span><br>
                  <span>Conclusion</span>
                </td>
                </tr>
                <tr>
                  <td>
                    <span></span><br>
                    <span></span>
                  </td>
                  <td colspan="3">
                    <span>样品标识</span><br>
                    <span>Sample labeling</span>
                  </td>
                  <td>
                    <span></span><br>
                    <span>I</span>
                  </td>
                  <td colspan="3">
                    <span></span><br>
                    <span></span>
                  </td>
                  <td colspan="3">
                    <span></span><br>
                    <span></span>
                  </td>
                  <td>
                    <span></span><br>
                    <span></span>
                  </td>
                </tr>
                <tr v-for="item in resultTable" :key="index">
                  <td>
                    <span>{{ item.id }}</span><br>
                  </td>
                  <td colspan="3">
                    <span>{{ item.testitem }}</span><br>
                    <span>{{ item.testitem_engName }}</span>
                  </td>
                  <td>
                    <span>{{ item.unit }}</span>
                  </td>
                  <td colspan="3">
                    <span>{{ item.requirement }}</span><br>
                    <span>{{ item.requirement_eng }}</span>
                  </td>
                  <td colspan="3">
                    <span>{{ item.testresult }}</span><br>
                    <span>{{ item.testresult_engName }}</span>
                  </td>
                  <td>
                    <span>{{ item.conclusion }}</span>
                  </td>
                </tr>
                
            </table>
          </div>
        </div>
      </div>
      <div class="pageFour">
        <div class="page-header" style="display: flex;justify-content: space-between;font-size: 12px;">
          <div>
            <span>报告编号：</span><br>
            <span>Reference No：</span>
          </div>
          <div>
            <span>附页</span><br>
            <span>Appenfix</span>
          </div>
        </div>
        <hr>
        <div class="table">
          <div class="table-header">
            <div style="width: 200px; margin: 0 auto;text-align-last: justify;"><h2>检验设备一览表</h2></div>
            <div style="text-align-last: center;"><h2 style="font-size: 14px;">Equipment List</h2></div>
          </div>
          <div class="table-body">
            <table width="100%" border="1" cellspacing="0" style="text-align: center;">
              <thead>
                  <tr>
                    <td>
                      <span>序号</span><br>
                      <span>No</span>
                    </td>
                    <td colspan="2">
                      <span>设备名称</span><br>
                      <span>Equipment name</span>
                    </td>
                    <td>
                      <span>设备型号</span><br>
                      <span>type</span>
                    </td>
                    <td colspan="2">
                      <span>编号</span><br>
                      <span>Factory number</span>
                    </td>
                    <td colspan="2">
                      <span>校准有效期</span><br>
                      <span>Date of validity</span>
                    </td>
                  </tr>
              </thead>
              <tr v-for="item in table" :key="index">
                <td>
                  <span>{{ item.id }}</span>
                </td>
                <td colspan="2">
                  <span>{{ item.equipment_name }}</span>
                </td>
                <td>
                  <span>{{ item.type }}</span><br>
                </td>
                <td colspan="2">
                  <span>{{ item.factory_number }}</span>
                </td>
                <td colspan="2">
                  <span>{{ item.validity }}</span>
                </td>
              </tr>
                
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
    <div class="content-wrapper">
        <div class="content-main">
            <div class="cover">
                <div class="cover-top">
                    <div>
                        <div style="height: 30px; line-height: 30px;">报告编号：{{reportData.rcode}}</div>
                        <div style="height: 30px; line-height: 30px;">Reference No：{{reportData.rcode}}</div>
                    </div>
                </div>
                <div class="title">
                    <h1 style="text-align-last:justify ;">检验报告</h1>
                    <h1>Test Report</h1>
                </div>
                <div class="cover-body">
                    <div class="name">
                        <div style="width:140px; text-align-last: justify;">
                            <div>试样名称</div>
                            <span style="font-size: 14px;">Name of Product</span>
                        </div>
                        <div class="line"> {{reportData.name}}</div>
                    </div>
                    <div class="name">
                        <div style="width:140px; text-align-last: justify;">
                            <div style="text-align-last: justify;">型号</div>
                            <span style="font-size: 14px;">Type and Size</span>
                        </div>
                        <div class="line"> {{reportData.specifications}}</div>
                    </div>
                    <div class="name">
                        <div style="width:140px; text-align-last: justify;">
                            <div>委托单位</div>
                            <span style="font-size: 14px;display: block;margin: 10px 45px 0px;">Client</span>
                        </div>
                        <div class="line"> {{reportData.supplier}}</div>
                    </div>
                    <div class="name">
                        <div style="width:140px; text-align-last: justify;">
                            <div>检验类别</div>
                            <span style="font-size: 14px;">Kind of Test</span>
                        </div>
                        <div class="line"> {{reportData.type==1?'成品检验':'委托检验'}}</div>
                    </div>
                </div>
                <div class="cover-footer">
                    <span>{{enterprise.name}}</span><br>
                    <span style="font-size: 14px;">{{enterprise.nameEn}}</span>
                </div>
            </div>
            <div class="pageOne">
                <div class="statement">
                    <div>
                        <h2>声明</h2>
                    </div>
                    <div style="text-align-last: center;">
                        <h2 style="font-size: 14px;">Statement</h2>
                    </div>
                </div>
                <div class="statement-body">
                    <div>
                        <span>1. 本检验报告（包括复印件）未加检测专用章一律无效。</span><br>
                        <span>This test report (including any duplicates) shall become effective only with pecial chapter for
                            testing on.</span>
                    </div>
                    <div>
                        <span>2. 本检验报告无编写、审核、批准人签章无效。</span><br>
                        <span>This test report shall become effective only with the signatures of compiler checker and
                            approver.</span>
                    </div>
                    <div>
                        <span>3. 本检验报告涂改无效。</span><br>
                        <span>This test report will be invalid if altered.</span>
                    </div>
                    <div>
                        <span>4. 本检验报告不得部分复印。</span><br>
                        <span>This test report mustn’t copy partly.</span>
                    </div>
                    <div>
                        <span>5. 送样委托检验，仅对来样负责。</span><br>
                        <span>For the sample submitted by clients, the test result is valid only for these samples.</span>
                    </div>
                    <div>
                        <span>6. 样品及委托单位为委托方自命名。</span><br>
                        <span>Samples and consignor name for the principal.</span>
                    </div>
                    <div>
                        <span>7. 本检验报告中英文描述有冲突时，以中文解释为准。</span><br>
                        <span>If the Chinese and English version of the test report have any conflict, the Chinese version should be
                            the standard for arbitrament.</span>
                    </div>
                    <div>
                        <span>8. 委托方对本检验报告若有异议，应于样品保存期内向本中心提出，联系电话：{{enterprise.linkPhone}}</span><br>
                        <span>Clients who have any different ideas about this test report, may contract with Test Central within the
                            sample reservation time. Tel: {{enterprise.linkPhone}}</span>
                    </div>
                    <div>
                        <span>9. 本中心样品自报告发送日起，一般保存一个月，以备复验。</span><br>
                        <span>The sample shall be reserved for one month beginning from the data when this test report is submitted
                            for examine or review.</span>
                    </div>
                </div>
                <div class="statement-footer">
                    <div class="depart">
                        <span>{{enterprise.name}}</span><br>
                        <span>{{enterprise.nameEn}}</span>
                    </div>
                    <div class="address">
                        <span>地 址：{{enterprise.address}}</span><br>
                        <span>Address: {{enterprise.addressEn}}</span>
                    </div>
                    <div class="zipcode">邮政编码Zip Code：{{enterprise.code}}</div>
                    <div class="tel">电 话Tel：{{enterprise.linkPhone}}</div>
                    <div class="email">邮 箱E-mail：{{enterprise.email}}</div>
                </div>
            </div>
            <div class="pageTwo">
                <div class="header" style="line-height: 10px;">
                    <div style="width: 350px;margin: 0 auto; text-align-last: justify;">
                        <h2 style="font-size: 18px;">{{enterprise.name}}</h2>
                    </div>
                    <div style="width: 500px; margin: 0 auto;text-align-last: justify;">
                        <h2 style="font-size: 14px;">{{enterprise.nameEn}}</h2>
                    </div>
                    <div style="width: 120px;margin: 0 auto;text-align-last: justify;">
                        <h2 style="font-size: 18px;">检测报告</h2>
                    </div>
                    <div style="width: 100px; margin: 0 auto;text-align-last: justify;">
                        <h2 style="font-size: 14px;">Test Report</h2>
                    </div>
                </div>
                <div class="table">
                    <div class="table-header">
                        <div>
                            <span>报告编号：{{reportData.rcode}}</span><br>
                            <span>Reference No：{{reportData.rcode}}</span>
                        </div>
                        <div>
                            <span>第1页共2页</span><br>
                            <span>Page 1 of 2</span>
                        </div>
                    </div>
                    <div class="table-body">
                        <table width="100%" border="1" cellspacing="0" style="text-align: center;">
                            <tr>
                                <td><span>试样名称</span><br>
                                    <span>Name of product</span>
                                </td>
                                <td colspan="2">{{reportData.name}}</td>
                                <td>
                                    <span>规格型号</span><br>
                                    <span>Type and size</span>
                                </td>
                                <td colspan="2">{{reportData.specifications}}</td>
                            </tr>
                            <tr>
                                <td>
                                    <span>样品数量</span><br>
                                    <span>Test item</span>
                                </td>
                                <td colspan="2">{{reportData.num}}</td>
                                <td>
                                    <span>检验项目</span><br>
                                    <span>Test item</span>
                                </td>
                                <td colspan="2">{{reData.productNames}}</td>
                            </tr>
                            <tr>
                                <td>
                                    <span>来样方式</span><br>
                                    <span>Delivering method</span>
                                </td>
                                <td colspan="2"></td>
                                <td>
                                    <span>检验类型</span><br>
                                    <span>Type of test</span>
                                </td>
                                <td colspan="2"></td>
                            </tr>
                            <tr>
                                <td>
                                    <span>样品状态</span><br>
                                    <span>Sample discription</span>
                                </td>
                                <td colspan="2"></td>
                                <td>
                                    <span>生产单位</span><br>
                                    <span>Producer</span>
                                </td>
                                <td colspan="2"></td>
                            </tr>
                            <tr>
                                <td>
                                    <span>收样时间</span><br>
                                    <span>Received date</span>
                                </td>
                                <td colspan="2"></td>
                                <td>
                                    <span>检验日期</span><br>
                                    <span>Test date</span>
                                </td>
                                <td colspan="2"></td>
                            </tr>
                            <tr>
                                <td>
                                    <span>委托人</span><br>
                                    <span>Consignor</span>
                                </td>
                                <td colspan="2"></td>
                                <td>
                                    <span>电话</span><br>
                                    <span>Tel</span>
                                </td>
                                <td colspan="2"></td>
                            </tr>
                            <tr>
                                <td>
                                    <span>委托单位</span><br>
                                    <span>Client</span>
                                </td>
                                <td colspan="5"></td>
                            </tr>
                            <tr>
                                <td>
                                    <span>委托单位地址</span><br>
                                    <span>Address</span>
                                </td>
                                <td colspan="5"></td>
                            </tr>
                            <tr>
                                <td>
                                    <span>检验环境</span><br>
                                    <span>Test environment</span>
                                </td>
                                <td colspan="5"></td>
                            </tr>
                            <tr>
                                <td>
                                    <span>检验依据</span><br>
                                    <span>Test standard</span>
                                </td>
                                <td colspan="5"></td>
                            </tr>
                            <tr>
                                <td style="height: 180px;">
                                    <span>结论</span><br>
                                    <span>Conclusion </span>
                                </td>
                                <td colspan="5">
                                    <div style="height: 120px;"></div>
                                    <div style="height: 60px;margin-left: 250px;">
                                        <span>（检测报告专用章）</span><br>
                                        <span>( SPECIFIC STAMP FOR TEST RTORT) </span><br>
                                        <span>签发日期： 年 月 日</span><br>
                                        <span>Date of issue: August 23, 2023</span>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <span>备注</span><br>
                                    <span>Remark </span>
                                </td>
                                <td colspan="5"></td>
                            </tr>
                            <tr>
                                <td>
                                    <span>编制</span><br>
                                    <span>Preparer</span>
                                </td>
                                <td colspan="2"></td>
                                <td>
                                    <span>检验</span><br>
                                    <span>Tester</span>
                                </td>
                                <td colspan="2"></td>
                            </tr>
                            <tr>
                                <td>
                                    <span>审核</span><br>
                                    <span>Checker </span>
                                </td>
                                <td colspan="2"></td>
                                <td>
                                    <span>批准</span><br>
                                    <span>Approver</span>
                                </td>
                                <td colspan="2"></td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
            <div class="pageThree">
                <div class="header" style="line-height: 10px;">
                    <div style="width: 350px;margin: 0 auto; text-align-last: justify;">
                        <h2 style="font-size: 18px;">江苏中天科技股份有限公司检测中心</h2>
                    </div>
                    <div style="width: 500px; margin: 0 auto;text-align-last: justify;">
                        <h2 style="font-size: 14px;">TEST CENTER OF JIANGSU ZHONGTIAN TECHNOLOGY CO.,LTD</h2>
                    </div>
                    <div style="width: 120px;margin: 0 auto;text-align-last: justify;">
                        <h2 style="font-size: 18px;">检测报告</h2>
                    </div>
                    <div style="width: 100px; margin: 0 auto;text-align-last: justify;">
                        <h2 style="font-size: 14px;">Test Report</h2>
                    </div>
                </div>
                <div class="table">
                    <div class="table-header">
                        <div>
                            <span>报告编号：</span><br>
                            <span>Reference No：</span>
                        </div>
                        <div>
                            <span>第2页共2页</span><br>
                            <span>Page 2 of 2</span>
                        </div>
                    </div>
                    <div class="table-body">
                        <table width="100%" border="1" cellspacing="0" style="text-align: center;">
                            <tr>
                                <td colspan="4">
                                    <span>样品编号</span><br>
                                    <span>Sample No</span>
                                </td>
                                <td colspan="3"></td>
                                <td colspan="4">
                                    <span>规格型号</span><br>
                                    <span>Type</span>
                                </td>
                                <td colspan="3"></td>
                            </tr>
                            <tr>
                                <td>
                                    <span>序号</span><br>
                                    <span>No</span>
                                </td>
                                <td colspan="3">
                                    <span>检验项目</span><br>
                                    <span>Test item</span>
                                </td>
                                <td>
                                    <span>单位</span><br>
                                    <span>Unit</span>
                                </td>
                                <td colspan="3">
                                    <span>标准要求</span><br>
                                    <span>Requirement</span>
                                </td>
                                <td colspan="3">
                                    <span>检验结果</span><br>
                                    <span>Test result</span>
                                </td>
                                <td>
                                    <span>结论</span><br>
                                    <span>Conclusion</span>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <span></span><br>
                                    <span></span>
                                </td>
                                <td colspan="3">
                                    <span>样品标识</span><br>
                                    <span>Sample labeling</span>
                                </td>
                                <td>
                                    <span></span><br>
                                    <span>I</span>
                                </td>
                                <td colspan="3">
                                    <span></span><br>
                                    <span></span>
                                </td>
                                <td colspan="3">
                                    <span></span><br>
                                    <span></span>
                                </td>
                                <td>
                                    <span></span><br>
                                    <span></span>
                                </td>
                            </tr>
                            <tr v-for="(item, index) in resultTable" :key="index">
                                <td>
                                    <span>{{ item.id }}</span><br>
                                </td>
                                <td colspan="3">
                                    <span>{{ item.testitem }}</span><br>
                                    <span>{{ item.testitem_engName }}</span>
                                </td>
                                <td>
                                    <span>{{ item.unit }}</span>
                                </td>
                                <td colspan="3">
                                    <span>{{ item.requirement }}</span><br>
                                    <span>{{ item.requirement_eng }}</span>
                                </td>
                                <td colspan="3">
                                    <span>{{ item.testresult }}</span><br>
                                    <span>{{ item.testresult_engName }}</span>
                                </td>
                                <td>
                                    <span>{{ item.conclusion }}</span>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
            <div class="pageFour">
                <div class="page-header" style="display: flex;justify-content: space-between;font-size: 12px;">
                    <div>
                        <span>报告编号：</span><br>
                        <span>Reference No：</span>
                    </div>
                    <div>
                        <span>附页</span><br>
                        <span>Appenfix</span>
                    </div>
                </div>
                <hr>
                <div class="table">
                    <div class="table-header">
                        <div style="width: 200px; margin: 0 auto;text-align-last: justify;">
                            <h2>检验设备一览表</h2>
                        </div>
                        <div style="text-align-last: center;">
                            <h2 style="font-size: 14px;">Equipment List</h2>
                        </div>
                    </div>
                    <div class="table-body">
                        <table width="100%" border="1" cellspacing="0" style="text-align: center;">
                            <thead>
                                <tr>
                                    <td>
                                        <span>序号</span><br>
                                        <span>No</span>
                                    </td>
                                    <td colspan="2">
                                        <span>设备名称</span><br>
                                        <span>Equipment name</span>
                                    </td>
                                    <td>
                                        <span>设备型号</span><br>
                                        <span>type</span>
                                    </td>
                                    <td colspan="2">
                                        <span>编号</span><br>
                                        <span>Factory number</span>
                                    </td>
                                    <td colspan="2">
                                        <span>校准有效期</span><br>
                                        <span>Date of validity</span>
                                    </td>
                                </tr>
                            </thead>
                            <tr v-for="(item, index) in table" :key="index">
                                <td>
                                    <span>{{ item.id }}</span>
                                </td>
                                <td colspan="2">
                                    <span>{{ item.equipment_name }}</span>
                                </td>
                                <td>
                                    <span>{{ item.type }}</span><br>
                                </td>
                                <td colspan="2">
                                    <span>{{ item.factory_number }}</span>
                                </td>
                                <td colspan="2">
                                    <span>{{ item.validity }}</span>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
  name:'TestReport',
  props:["reportData"],
  data(){
    return {
      resultTable:[
        {
          id: '1',
          testitem: '原始拉伸',
          testitem_engName: 'Primitive strength',
          unit: 'MPa',
          requirement: '最小10.0',
          requirement_eng: 'Minimun 10.0',
          testresult: '',
          testitem_engName: ''
        }
      ],
      table:[{
        id: 1,
        equipment_name: '拖拉机',
        type: 1,
        factory_number: 'Akjgfewof',
        validity:'2023.8.25~2023.8.27'
      }]
    }
  }
}
    import {
        get,
        post,
        wpost
    } from "@/api/util/requestUtil.js"
    export default {
        name: 'TestReport',
        props: ["reportData"],
        data() {
            return {
                resultTable: [{
                    id: '1',
                    testitem: '原始拉伸',
                    testitem_engName: 'Primitive strength',
                    unit: 'MPa',
                    requirement: '最小10.0',
                    requirement_eng: 'Minimun 10.0',
                    testresult: '',
                    testitem_engName: ''
                }],
                table: [{
                    id: 1,
                    equipment_name: '拖拉机',
                    type: 1,
                    factory_number: 'Akjgfewof',
                    validity: '2023.8.25~2023.8.27'
                }],
                enterprise: {},
                reData: {
                    productNames: null
                }
            }
        },
        mounted() {
            this.getEnterprise()
            if (Object.keys(this.reportData).length > 0) {
                this.reData.productNames = ''
                this.reportData.products.forEach(a=>{
                    this.reData.productNames += ("," + a.ipName)
                })
                this.reData.productNames = this.reData.productNames.replace(',','')
            }
        },
        methods: {
            getEnterprise() {
                get("/report/getEnterprise").then(res => {
                    this.enterprise = res.data
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
.content-wrapper{
  // background-color: #f0f2f5;
  // width: 100%;
  // height: 100vh;
  // overflow-y: auto;
  .content-main{
    margin: -100px auto;
    width: 90%;
    .cover{
      margin: 80px 0px;
      padding:0px 50px;
      height: 1200px;
      background-color: #fff;
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
      .cover-top{
        display: flex;
        justify-content: end;
        font-size: 20px;
        margin-right: 50px;
        padding-top: 50px;
        // font-weight: bold;
      }
      .title{
        margin-top: 100px;
        padding: 0px 220px;
        text-align: center;
        font-size: 25px;
      }
      .cover-body{
        font-size: 25px;
        margin: 100px 80px;
        .name{
          // background-color: #bfa;
          display: flex;
          justify-content: space-between;
          margin-bottom: 20px;
          .line{
            width: 500px;
            border-bottom: solid 1px black;
            text-align: center;
            // height: 60px;
            line-height: 60px;
          }
        }
      }
      .cover-footer{
        text-align: center;
        margin-top: 200px;
        span{
          font-size: 23px;
          height: 40px;
          line-height: 40px;
        }
      }
    }
    .pageOne{
      margin-top: -50px;
      background-color: #fff;
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
      padding:50px 100px;
      height: 1200px;
      .statement{
        margin: 0 auto;
        width: 100px;
        text-align-last: justify;
      }
      .statement-body{
        line-height: 32px;
        text-align: justify;
        margin: 30px 0px;
        font-size: 12px;
      }
      .statement-footer{
        line-height: 30px;
        font-size: 12px;
      }
    }
    .pageTwo{
      margin-top: 30px;
      background-color: #fff;
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
      padding:50px 60px;
      height: 1200px;
      .table{
        margin-top: 20px;
        .table-header{
          display: flex;
          justify-content: space-between;
          font-size: 14px;
          line-height: 20px;
        }
        .table-body{
          font-size: 12px;
          table td{
            width: 150px;
            height: 52px;
          }
        }
      }
    }
    .pageThree{
      margin-top: 30px;
      background-color: #fff;
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
      padding:50px 60px;
      height: 1200px;
      .table{
        margin-top: 20px;
        .table-header{
          display: flex;
          justify-content: space-between;
          font-size: 14px;
          line-height: 20px;
        }
        .table-body{
          font-size: 12px;
          table td{
            width: 8%;
            height: 52px;
          }
        }
      }
    }
    .pageFour{
      margin-top: 30px;
      background-color: #fff;
      box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
      padding:50px 60px;
      height: 1200px;
      .table{
        margin-top: 50px;
        .table-header{
          line-height: 20px;
        }
        .table-body{
          margin-top: 20px;
          font-size: 12px;
          table td{
            width: 80px;
            height: 52px;
          }
        }
      }
    }
    
  }
}
    .content-wrapper {
        .content-main {
            margin: -100px auto;
            width: 90%;

            .cover {
                margin: 80px 0px;
                padding: 0px 50px;
                height: 1200px;
                background-color: #fff;
                box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);

                .cover-top {
                    display: flex;
                    justify-content: end;
                    font-size: 20px;
                    margin-right: 50px;
                    padding-top: 50px;
                    // font-weight: bold;
                }

                .title {
                    margin-top: 100px;
                    padding: 0px 220px;
                    text-align: center;
                    font-size: 25px;
                }

                .cover-body {
                    font-size: 25px;
                    margin: 100px 80px;

                    .name {
                        // background-color: #bfa;
                        display: flex;
                        justify-content: space-between;
                        margin-bottom: 20px;

                        .line {
                            width: 500px;
                            border-bottom: solid 1px black;
                            text-align: center;
                            // height: 60px;
                            line-height: 60px;
                        }
                    }
                }

                .cover-footer {
                    text-align: center;
                    margin-top: 200px;

                    span {
                        font-size: 23px;
                        height: 40px;
                        line-height: 40px;
                    }
                }
            }

            .pageOne {
                margin-top: -50px;
                background-color: #fff;
                box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
                padding: 50px 100px;
                height: 1200px;

                .statement {
                    margin: 0 auto;
                    width: 100px;
                    text-align-last: justify;
                }

                .statement-body {
                    line-height: 32px;
                    text-align: justify;
                    margin: 30px 0px;
                    font-size: 12px;
                }

                .statement-footer {
                    line-height: 30px;
                    font-size: 12px;
                }
            }

            .pageTwo {
                margin-top: 30px;
                background-color: #fff;
                box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
                padding: 50px 60px;
                height: 1200px;

                .table {
                    margin-top: 20px;

                    .table-header {
                        display: flex;
                        justify-content: space-between;
                        font-size: 14px;
                        line-height: 20px;
                    }

                    .table-body {
                        font-size: 12px;

                        table td {
                            width: 150px;
                            height: 52px;
                        }
                    }
                }
            }

            .pageThree {
                margin-top: 30px;
                background-color: #fff;
                box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
                padding: 50px 60px;
                height: 1200px;

                .table {
                    margin-top: 20px;

                    .table-header {
                        display: flex;
                        justify-content: space-between;
                        font-size: 14px;
                        line-height: 20px;
                    }

                    .table-body {
                        font-size: 12px;

                        table td {
                            width: 8%;
                            height: 52px;
                        }
                    }
                }
            }

            .pageFour {
                margin-top: 30px;
                background-color: #fff;
                box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
                padding: 50px 60px;
                height: 1200px;

                .table {
                    margin-top: 50px;

                    .table-header {
                        line-height: 20px;
                    }

                    .table-body {
                        margin-top: 20px;
                        font-size: 12px;

                        table td {
                            width: 80px;
                            height: 52px;
                        }
                    }
                }
            }

        }
    }
</style>

 src/views/experiment/checkTheReport/index.vue

@@ -1,136 +1,92 @@
<template>
  <div class="content-main">
    <div class="top-bar">
      <el-form ref="form" :inline="true" :model="searchData" label-position="left">
        <el-form-item label="样品编号:">
          <el-input
            v-model="searchData.sample_code"
            class="input-form"
            placeholder="请输入样品编号"
            @keyup.enter.native="getData"
          />
        </el-form-item>
        <el-form-item label="报告单号:">
          <el-input
            v-model="searchData.reportCode"
            class="input-form"
            placeholder="请输入报告单号"
          />
        </el-form-item>
        <el-form-item label="申请单号:">
          <el-input
            v-model="searchData.application_code"
            class="input-form"
            placeholder="请输入申请单号"
          />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="getData()">查询</el-button>
          <el-button type="primary" plain @click="resetData()">重置</el-button>
        </el-form-item>
      </el-form>
      <el-form>
        <el-button @click="exportToPDF" class="rightBtn" type="primary" icon="el-icon-document"
          >导出报告</el-button
        >
      </el-form>
    </div>
    <div class="library-table">
      <div class="table-header">
        <div class="search-bar">
          <el-radio-group v-model="checkStatus" @change="handleRadioChange">
            <el-radio-button>全部</el-radio-button>
            <el-radio-button label="0">待提交</el-radio-button>
            <el-radio-button label="1">待审核</el-radio-button>
            <el-radio-button label="2">待签字</el-radio-button>
            <el-radio-button label="3">已完成</el-radio-button>
          </el-radio-group>

          <el-checkbox v-model="checked" style="margin-left: 20px"
            >仅看我的</el-checkbox
          >
        </div>
      </div>
      <el-dialog
        top="10vh"
        title="报告预览"
        :visible.sync="dialogVisible"
        width="60%">
        <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="printFun()">打印</el-button>
        </span>
        <div class="printStyle">
          <Preview id="printRaw" :reportData="reportData" v-if="reportType===0"></Preview>
          <TestReport ref="testreport" id="printFinished" :reportData="reportData" v-else></TestReport>
        </div>
      </el-dialog>
      <div class="table-box">
        <el-table
          ref="reportTable"
          :max-height="800"
          :cell-style="{ textAlign: 'center' }"
          :header-cell-style="{
    <div class="content-main">
        <div class="top-bar">
            <el-form ref="form" :inline="true" :model="searchData" label-position="left">
                <el-form-item label="样品编号:">
                    <el-input v-model="searchData.sample_code" class="input-form" placeholder="请输入样品编号"
                        @keyup.enter.native="getData" />
                </el-form-item>
                <el-form-item label="报告单号:">
                    <el-input v-model="searchData.reportCode" class="input-form" placeholder="请输入报告单号" />
                </el-form-item>
                <el-form-item label="申请单号:">
                    <el-input v-model="searchData.application_code" class="input-form" placeholder="请输入申请单号" />
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="getData()">查询</el-button>
                    <el-button type="primary" plain @click="resetData()">重置</el-button>
                </el-form-item>
            </el-form>
            <el-form>
                <el-button @click="exportToPDF" class="rightBtn" type="primary" icon="el-icon-document">导出报告</el-button>
            </el-form>
        </div>
        <div class="library-table">
            <div class="table-header">
                <div class="search-bar">
                    <el-radio-group v-model="checkStatus" @change="handleRadioChange">
                        <el-radio-button>全部</el-radio-button>
                        <el-radio-button label="0">待提交</el-radio-button>
                        <el-radio-button label="1">待审核</el-radio-button>
                        <el-radio-button label="2">待签字</el-radio-button>
                        <el-radio-button label="3">已完成</el-radio-button>
                    </el-radio-group>
                    <el-checkbox v-model="checked" style="margin-left: 20px">仅看我的</el-checkbox>
                </div>
            </div>
            <el-dialog top="10vh" title="报告预览" :visible.sync="dialogVisible" width="60%">
                <span slot="footer" class="dialog-footer">
                    <el-button type="primary" @click="printFun()">打印</el-button>
                </span>
                <div class="printStyle" v-if="dialogVisible">
                    <Preview id="printRaw" :reportData="reportData" v-if="reportType===0"></Preview>
                    <TestReport ref="testreport" id="printFinished" :reportData="reportData" v-else></TestReport>
                </div>
            </el-dialog>
            <div class="table-box">
                <el-table ref="reportTable" :max-height="800" :cell-style="{ textAlign: 'center' }" :header-cell-style="{
            border: '0px',
            background: '#f5f7fa',
            color: '#606266',
            boxShadow: 'inset 0 1px 0 #ebeef5',
            textAlign: 'center',
          }"
          :data="reportTable"
          @selection-change="handleSelectionChange"
          style="width: 100%"
        >
          <el-table-column type="selection" label="" min-width="5%" />

          <el-table-column
            prop="materialCode"
            label="样品编号"
            sortable
            min-width="10%"
          >
            <template slot-scope="scope">
              <span style="color: #409eff;">
                  {{ scope.row.materialCode }}
              </span>
            </template></el-table-column
          >
          <el-table-column
            prop="reportCode"
            label="报告单号"
            sortable
            min-width="10%"
          >
            <template slot-scope="scope">
              <span style="color: #409eff;">
                  {{ scope.row.reportCode }}
              </span>
            </template></el-table-column
          >
          <el-table-column
            prop="inspectionCode"
            label="申请单号"
            sortable
            min-width="10%"
          >
            <template slot-scope="scope">
              <span style="color: #409eff;">
                  {{ scope.row.inspectionCode }}
              </span>
            </template></el-table-column
          >
          <el-table-column prop="approver" label="审批人" min-width="8%">
            <template slot-scope="scope">
              <span>
                <el-tag v-if="scope.row.approver!=null && scope.row.approver!=''" type="info" icon="el-icon-user">
                  <i class="el-icon-user">{{ scope.row.approver }}</i>
                </el-tag>
              </span>
            </template>
          </el-table-column>
          <el-table-column prop="status" label="审批状态" min-width="8%">
            <template slot-scope="scope">
              <span>
                <el-tag type="info">{{
          }" :data="reportTable" @selection-change="handleSelectionChange" style="width: 100%">
                    <el-table-column type="selection" min-width="5%" />
                    <el-table-column prop="type" label="报告类型" min-width="5%">
                        <template slot-scope="scope">
                            <el-tag>{{scope.row.type == 0?'原材料报告':scope.row.type==1?'成品报告':'委托报告'}}</el-tag>
                        </template></el-table-column>
                    <el-table-column prop="materialCode" label="样品编号" sortable min-width="10%">
                        <template slot-scope="scope">
                            <span style="color: #409eff;">
                                {{ scope.row.materialCode }}
                            </span>
                        </template></el-table-column>
                    <el-table-column prop="reportCode" label="报告单号" sortable min-width="10%">
                        <template slot-scope="scope">
                            <span style="color: #409eff;">
                                {{ scope.row.reportCode }}
                            </span>
                        </template></el-table-column>
                    <el-table-column prop="inspectionCode" label="申请单号" sortable min-width="10%">
                        <template slot-scope="scope">
                            <span style="color: #409eff;">
                                {{ scope.row.inspectionCode }}
                            </span>
                        </template></el-table-column>
                    <el-table-column prop="approver" label="审批人" min-width="8%">
                        <template slot-scope="scope">
                            <span>
                                <el-tag v-if="scope.row.approver!=null && scope.row.approver!=''" type="info" icon="el-icon-user">
                                    <i class="el-icon-user">{{ scope.row.approver }}</i>
                                </el-tag>
                            </span>
                        </template>
                    </el-table-column>
                    <el-table-column prop="status" label="审批状态" min-width="8%">
                        <template slot-scope="scope">
                            <span>
                                <el-tag type="info">{{
                  scope.row.status == 0
                    ? "待提交"
                    : scope.row.status == 1
@@ -139,264 +95,247 @@
                    ? "代签字"
                    : "已完成"
                }}</el-tag>
              </span>
            </template></el-table-column
          >
          <el-table-column prop="conclusion" label="检验结论" min-width="8%" />
          <el-table-column prop="name" label="编制人" min-width="8%">
            <template slot-scope="scope">
              <span>
                <el-tag type="info" icon="el-icon-user">
                  <i class="el-icon-user">{{ scope.row.name }}</i>
                </el-tag>
              </span>
            </template>
          </el-table-column>
          <el-table-column label="操作" min-width="8%">
            <template slot-scope="scope">
              <el-button
                type="text"
                size="small"
                @click="previewFun(scope.row)"
                >查看报告</el-button
              >
            </template>
          </el-table-column>
        </el-table>
        <!-- 分页器 -->
        <div>
          <el-pagination
            :current-page="page"
            :page-sizes="[10, 20, 30, 40]"
            :page-size="pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
          />
        </div>
      </div>
    </div>
    <Preview ref="preview" id="printRaw" :reportData="reportData" v-show="false"></Preview>
    <TestReport ref="testreport" id="printFinished" :reportData="reportData" v-show="false"></TestReport>
    <el-dialog
      title="导出pdf"
      :visible.sync="dialogPdfVisible"
      width="30%"
      :before-close="handleClose">
      <span>确定开始导出吗？</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogPdfVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirmExport">确 定</el-button>
      </span>
    </el-dialog>
  </div>
                            </span>
                        </template></el-table-column>
                    <el-table-column prop="conclusion" label="检验结论" min-width="8%">
                        <template slot-scope="scope">
                            <span :style="`color: ${scope.row.conclusion=='合格'?'#67c23a':'#f56c6c'}`">{{scope.row.conclusion}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column prop="name" label="编制人" min-width="8%">
                        <template slot-scope="scope">
                            <span>
                                <el-tag type="info" icon="el-icon-user">
                                    <i class="el-icon-user">{{ scope.row.name }}</i>
                                </el-tag>
                            </span>
                        </template>
                    </el-table-column>
                    <el-table-column label="操作" min-width="8%">
                        <template slot-scope="scope">
                            <el-button type="text" size="small" @click="previewFun(scope.row)">查看报告</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <!-- 分页器 -->
                <div>
                    <el-pagination :current-page="page" :page-sizes="[10, 20, 30, 40]" :page-size="pageSize"
                        layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
                        @current-change="handleCurrentChange" />
                </div>
            </div>
        </div>
        <Preview ref="preview" id="printRaw" :reportData="reportData" v-show="false"></Preview>
        <TestReport ref="testreport" id="printFinished" :reportData="reportData" v-show="false"></TestReport>
        <el-dialog title="导出pdf" :visible.sync="dialogPdfVisible" width="30%">
            <span>确定开始导出吗？</span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogPdfVisible = false">取 消</el-button>
                <el-button type="primary" @click="confirmExport">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
import { selectAllReport,getReportData } from "@/api/experiment/checkTheReport";
import Preview from "@/components/experiment/checkTheReport/index.vue";
import TestReport from "@/components/experiment/template_testReport/index.vue"
import PrintJS from 'print-js'
import html2pdf from 'html2pdf.js'
    import {
        selectAllReport,
        getReportData
    } from "@/api/experiment/checkTheReport";
    import Preview from "@/components/experiment/checkTheReport/index.vue";
    import TestReport from "@/components/experiment/template_testReport/index.vue"
    import PrintJS from 'print-js'
    import html2pdf from 'html2pdf.js'

export default {
  data() {
    return {
      reportData: [],
      reportType: 0,
      searchData:{
        sample_code:'',
        reportCode:'',
        application_code: ''
      },
      checkStatus: undefined,
      reportTable: [
        {
          materialCode:'SN23-0517001',
          reportCode: 'SN23-0517001',
          inspectionCode: 'SN23-0517001',
          approver:'黄小明',
          status: '',
          conclusion: 1,
          name: '黄小明'
        },
        {
          materialCode:'SN23-0517001',
          reportCode: 'SN23-0517001',
          inspectionCode: 'SN23-0517001',
          approver:'黄小明',
          status: '',
          conclusion: 1,
          name: '黄小明'
        }
      ],
      page: 1,
      total: 0,
      pageSize: 10,
      checked: true,
      dialogVisible: false,
      dialogPdfVisible: false,
      selectedRows: []
    };
  },
  created() {
    // this.getData();
  },
  mounted(){
  },
  components:{
    Preview,
    TestReport
  },
  methods: {
    async queryReportByRCode(code){
      const resp = await getReportData({code:code});
      this.reportData = resp.data;
      this.dialogVisible = true;
      console.log(this.reportData);
    },
    //查看报告按钮
    previewFun(row){
      console.log(row)
      this.reportType = row.type;
      this.queryReportByRCode(row.reportCode);
    },
    handleSelectionChange(selection){
      this.selectedRows = selection;
    },
    // 批量导出报告
    exportToPDF() {
      this.dialogPdfVisible = true;
    },
    // 确认导出模态框
    confirmExport(){
      this.selectedRows.forEach(async row => {
        const element = document.getElementById('printFinished');
        console.log(element)
        // 设置TestReport组件的reportData属性为当前行的报告数据
        const resp = await getReportData({code:row.reportCode});
        this.$nextTick(() => {
          this.$refs.testreport.reportData = resp.data;
          html2pdf().from(element).save(`exported_${row.reportCode}.pdf`);
        });
      });
      this.dialogPdfVisible = false;
      this.selectedRows = [];
    },
    //打印按钮
    printFun(){
      this.dialogVisible = false;
      PrintJS({
        printable: this.reportType===0 ? "printRaw" : "printFinished",
        type: "html",
        // header: "原材料检测报告",
        targetStyles: ["*"],
        ignoreElements: ["no-ignore"],
      });
    },
    // 状态按钮
    handleRadioChange() {
      this.getData();
    },
    // 每页条数改变时触发 选择一页显示多少行
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.pageSize = val;
      this.getData();
    },
    // 当前页改变时触发 跳转其他页
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.page = val;
      this.getData();
    },
    // 重置按钮
    resetData() {
      this.searchData={
        sample_code:'',
        reportCode:'',
        application_code: ''
      },
      this.page = 1;
      this.pageSize = 10;
      this.checkStatus = undefined;
      this.getData();
    },
    // 查询列表
    async getData() {
      const params = {
        page: this.page,
        pageSize: this.pageSize,
        name: this.searchData.sample_code ? this.searchData.sample_code : undefined,
        status: this.checkStatus ? this.checkStatus : undefined,
      };
      const { data } = await selectAllReport(params);
      this.reportTable = data.row;
      console.log(data.row);
      this.total = data.total;
    },
  },
};
    export default {
        data() {
            return {
                reportData: [],
                reportType: 0,
                searchData: {
                    sample_code: '',
                    reportCode: '',
                    application_code: ''
                },
                checkStatus: undefined,
                reportTable: [],
                page: 1,
                total: 0,
                pageSize: 10,
                checked: true,
                dialogVisible: false,
                dialogPdfVisible: false,
                selectedRows: []
            };
        },
        created() {
            this.getData();
        },
        mounted() {},
        components: {
            Preview,
            TestReport
        },
        methods: {
            async queryReportByRCode(code) {
                const resp = await getReportData({
                    code: code
                });
                this.reportData = resp.data;
                this.dialogVisible = true;
                console.log(this.reportData);
            },
            //查看报告按钮
            previewFun(row) {
                this.reportType = row.type;
                this.queryReportByRCode(row.reportCode);
            },
            handleSelectionChange(selection) {
                this.selectedRows = selection;
            },
            // 批量导出报告
            exportToPDF() {
                this.dialogPdfVisible = true;
            },
            // 确认导出模态框
            confirmExport() {
                this.selectedRows.forEach(async row => {
                    const element = document.getElementById('printFinished');
                    console.log(element)
                    // 设置TestReport组件的reportData属性为当前行的报告数据
                    const resp = await getReportData({
                        code: row.reportCode
                    });
                    this.$nextTick(() => {
                        this.$refs.testreport.reportData = resp.data;
                        html2pdf().from(element).save(`exported_${row.reportCode}.pdf`);
                    });
                });
                this.dialogPdfVisible = false;
                this.selectedRows = [];
            },
            //打印按钮
            printFun() {
                this.dialogVisible = false;
                PrintJS({
                    printable: this.reportType === 0 ? "printRaw" : "printFinished",
                    type: "html",
                    // header: "原材料检测报告",
                    targetStyles: ["*"],
                    ignoreElements: ["no-ignore"],
                });
            },
            // 状态按钮
            handleRadioChange() {
                this.getData();
            },
            // 每页条数改变时触发 选择一页显示多少行
            handleSizeChange(val) {
                this.pageSize = val;
                this.getData();
            },
            // 当前页改变时触发 跳转其他页
            handleCurrentChange(val) {
                this.page = val;
                this.getData();
            },
            // 重置按钮
            resetData() {
                this.searchData = {
                        sample_code: '',
                        reportCode: '',
                        application_code: ''
                    },
                    this.page = 1;
                this.pageSize = 10;
                this.checkStatus = undefined;
                this.getData();
            },
            // 查询列表
            async getData() {
                const params = {
                    page: this.page,
                    pageSize: this.pageSize,
                    name: this.searchData.sample_code ? this.searchData.sample_code : undefined,
                    status: this.checkStatus ? this.checkStatus : undefined,
                };
                const {
                    data
                } = await selectAllReport(params);
                this.reportTable = data.row;
                this.total = data.total;
            },
        },
    };
</script>

<style lang="scss" scoped>
.top-bar {
  margin: -25px -15px;
  background: #fff;
  display: flex;
  justify-content: space-between;
  padding: 5px 24px 0px 24px;
  .input-form {
    width: 250px;
    margin-right: 30px;
  }
  .el-dropdown-link {
    cursor: pointer;
    color: #409eff;
  }
  .el-icon-arrow-down {
    font-size: 12px;
  }
}
.library-table {
  height: 80vh;
  overflow: scroll;
  background-color: #fff;
  flex: 1;
  margin: 0px -15px;
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  .table-header {
    padding: 20px;
    display: flex;
    justify-content: space-between;
    .el-form-item {
      margin-bottom: 30px !important;
    }
  }
  .table-box {
    padding: 0px 20px;
    margin-top: 0px;
    flex: 1;
    background: #fff;
    display: flex;
    flex-direction: column;
    > div:nth-child(2) {
      display: flex;
      justify-content: end;
      margin: 10px 0;
    }
  }
  .printStyle{
    overflow: scroll;
    height:500px;
    .el-button{
      position: absolute;
      top: 10vh;
      left: 90%;
    }
  }
}
</style>
    .top-bar {
        margin: -25px -15px;
        background: #fff;
        display: flex;
        justify-content: space-between;
        padding: 5px 24px 0px 24px;

        .input-form {
            width: 250px;
            margin-right: 30px;
        }

        .el-dropdown-link {
            cursor: pointer;
            color: #409eff;
        }

        .el-icon-arrow-down {
            font-size: 12px;
        }
    }

    .library-table {
        height: 80vh;
        overflow: scroll;
        background-color: #fff;
        flex: 1;
        margin: 0px -15px;
        margin-top: 40px;
        display: flex;
        flex-direction: column;

        .table-header {
            padding: 20px;
            display: flex;
            justify-content: space-between;

            .el-form-item {
                margin-bottom: 30px !important;
            }
        }

        .table-box {
            padding: 0px 20px;
            margin-top: 0px;
            flex: 1;
            background: #fff;
            display: flex;
            flex-direction: column;

            >div:nth-child(2) {
                display: flex;
                justify-content: end;
                margin: 10px 0;
            }
        }

        .printStyle {
            overflow: scroll;
            height: 600px;

            .el-button {
                position: absolute;
                top: 10vh;
                left: 90%;
            }
        }
    }
</style>

 src/views/experiment/inspectionApplication/Viewdetails/index.vue

@@ -86,20 +86,20 @@
                        </el-table-column>
                        <el-table-column prop="required" label="内控值">
                        </el-table-column>
                        <el-table-column prop="userName" label="责任人" width="220px">
                        <el-table-column prop="userId" label="责任人" width="220px">
                            <template slot-scope="scope">
                                <el-select v-model="scope.row.username" slot="append"
                                <el-select v-model="scope.row.userId" slot="append"
                                    @change="(val)=>chooseUseProId(val, scope.row)">
                                    <el-option v-for="(item,indxe) in ZERENren" :key="indxe" :label="item.name"
                                        :value="item.id"></el-option>
                                </el-select>
                            </template>
                        </el-table-column>
                        <el-table-column prop="inspectionMaterialId" label="实验设备" width="220px">
                        <el-table-column prop="instrumentId" label="实验设备" width="300px">
                            <template slot-scope="scope">
                                <el-cascader v-model="scope.row.instrumentName" :options="devices"
                                <el-cascader v-model="scope.row.instrumentId" :options="devices"
                                    :props="{label: 'Name',value: 'Id',children: 'childrenList'}"
                                    @change="(val)=>chooseEquipment(val, scope.row)"></el-cascader>
                                    @change="(val)=>chooseEquipment(val, scope.row)" style="width: 100%;"></el-cascader>
                            </template>
                        </el-table-column>
                    </el-table>

 src/views/experiment/inspectionApplication/index.vue

@@ -45,33 +45,33 @@
                            :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
                            :data="inspectionTable">
                            <el-table-column type="selection" min-width="30px" />
                            <el-table-column prop="icode" label="申请单号" min-width="150px" />
                            <el-table-column prop="type" label="检验类型" min-width="80px">
                            <el-table-column prop="icode" label="申请单号" min-width="160px" />
                            <el-table-column prop="type" label="检验类型" min-width="100px">
                                <template slot-scope="scope">
                                    <div v-if="scope.row.type === 0"><span>原材料检验</span></div>
                                    <div v-if="scope.row.type === 1"><span>委托检验</span></div>
                                    <div v-if="scope.row.type === 2"><span>成品检验</span></div>
                                    <div v-if="scope.row.type === 0"><el-tag type="success">原材料检验</el-tag></div>
                                    <div v-if="scope.row.type === 2"><el-tag>委托检验</el-tag></div>
                                    <div v-if="scope.row.type === 1"><el-tag type="warning">成品检验</el-tag></div>
                                </template>
                            </el-table-column>
                            <el-table-column prop="formTime" label="来料日期" min-width="90px" />
                            <el-table-column prop="supplier" label="供应商名称" min-width="150px" show-overflow-tooltip />
                            <el-table-column prop="mcode" label="原材料编码" min-width="170px" />
                            <el-table-column prop="name" label="原材料名称" min-width="80px" />
                            <el-table-column prop="name" label="原材料名称" min-width="90px" />
                            <el-table-column prop="specifications" label="规格型号" min-width="160px" />
                            <el-table-column prop="unit" label="单位" min-width="50px" />
                            <el-table-column prop="num" label="数量" min-width="50px" />
                            <el-table-column prop="createTime" label="登记日期" min-width="80px" />
                            <el-table-column prop="inspection_status" label="检验结果" min-width="80px">
                            <el-table-column prop="createTime" label="登记日期" min-width="90px" />
                            <el-table-column prop="inspection_status" label="检验结果" min-width="95px">
                                <template slot-scope="scope">
                                    <el-tag class="tag" type="danger" disable-transitions
                                    <el-tag class="tag" effect="dark" type="danger" disable-transitions
                                        v-if="scope.row.inspection_status == 0">不合格</el-tag>
                                    <el-tag class="tag" type="success" disable-transitions
                                    <el-tag class="tag" effect="dark" type="success" disable-transitions
                                        v-else-if="scope.row.inspection_status == 1">合格</el-tag>
                                </template>
                            </el-table-column>
                            <el-table-column prop="userName" label="登记人" min-width="80px" />
                            <el-table-column prop="checkdate" label="检验日期" min-width="160px" />
                            <el-table-column label="操作" min-width="150" fixed="right">
                            <el-table-column prop="checkdate" label="检验日期" min-width="170px" />
                            <el-table-column label="操作" min-width="120" fixed="right">
                                <template slot-scope="scope">
                                    <el-button type="text" size="small" @click="handleClick(scope.row)">查看</el-button>
                                    <el-button type="text" size="small" @click="delInspect(scope.row)">作废</el-button>
@@ -288,7 +288,6 @@
                        </div>
                        <span slot="footer" class="dialog-footer">
                            <el-button @click="checkTypeVisible = false">取 消</el-button>
                            <!-- <el-button type="primary" @click="addInspection">确 定</el-button> -->
                            <el-button type="primary" @click="QUEding">确 定</el-button>
                        </span>
                    </el-dialog>
@@ -304,7 +303,7 @@
                        </el-select>
                    </template>
                </el-card>
                <el-table :data="tableData" style="width: 100%; margin-bottom: 20px" row-key="id" border height="calc(40vh)"
                <el-table :data="tableData" style="width: 100%; margin-bottom: 20px;overflow-y: auto;" row-key="id" border height="40vh"
                    default-expand-all ref="multipleTable" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
                    <el-table-column type="index" width="50px" label="序号"></el-table-column>
                    <el-table-column prop="name" label="项目名称" sortable>
@@ -321,9 +320,9 @@
                </span>
            </el-dialog>
            <!-- 原材料检验模态框 -->
            <el-dialog title="原材料检验" :visible.sync="rawmaterialVisible" width="60%">
            <el-dialog title="原材料检验" :visible.sync="rawmaterialVisible" width="60%" top="100px">
                <div class="table-box">
                    <el-table ref="multipleTable" :max-height="800" :cell-style="{textAlign: 'center'}"
                    <el-table ref="multipleTable" :max-height="600" :cell-style="{textAlign: 'center'}"
                        :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
                        :data="rawMaterialTable" style="width: 100%" @selection-change="handleSelectionChange">
                        <el-table-column type="selection" min-width="10%" />

 src/views/experiment/planAssignments/plan.vue

@@ -106,7 +106,7 @@
                </el-table-column>
                <el-table-column label="操作" width="150">
                    <template slot-scope="scope">
                        <el-button size="mini" type="primary" v-if="isIfReport(scope.row)"
                        <el-button size="mini" :disabled="!isIfReport(scope.row)" type="primary" v-if="scope.row.orderNum == '01'"
                            @click="addReported(scope.row.id)">上报</el-button>
                        <el-button size="mini" type="text" @click="openUpDia(scope.row)"
                            v-if="scope.row.orderNum=='02'">分配</el-button>
@@ -139,7 +139,7 @@
                <el-button @click="upDia = false">取 消</el-button>
            </span>
        </el-dialog>
        <el-dialog title="检验" :visible.sync="upInsDia" width="500px">
        <el-dialog title="检验" :visible.sync="upInsDia" width="600px">
            <div class="body" style="max-height: 50vh;overflow-y: auto;">
                <el-row style="line-height: 46px;">
                    <el-col :span="5" style="font-size: 14px;text-align: right;">申请单编码：</el-col>
@@ -182,7 +182,7 @@
                                    </el-input>
                                </template>
                            </el-table-column>
                            <el-table-column label="操作" width="60">
                            <el-table-column label="操作" width="80">
                                <template slot-scope="scope">
                                    <el-button size="mini" type="text"
                                        @click.native.prevent="deleteRow(scope.$index, upData.testValue)">删除</el-button>
@@ -264,7 +264,7 @@
                row.children.forEach(a => {
                    if (a.testState != null && a.testState != undefined) count++
                })
                return row.testState == undefined && row.orderNum == '01' && count == row
                return row.testState == undefined && count == row
                    .children.length
            },
            openUpDia(row) {
@@ -355,7 +355,7 @@
                    this.upInsDia = false
                    this.selectDataList()
                    this.$confirm(
                        `<p style="line-height: 80px">您的项目(${this.upData.name})检验结果为：<span class="${res.data==1?'ins_state_success':'ins_state_error'}">${res.data==1?'合格':'不合格'}</span></p>`,
                        `<p style="line-height: 80px">您的项目（${this.upData.name}）检验结果为：<span class="${res.data==1?'ins_state_success':'ins_state_error'}">${res.data==1?'合格':'不合格'}</span></p>`,
                        '提交成功', {
                            confirmButtonText: '确定',
                            cancelButtonText: '关闭',

 src/views/experiment/reportAuditing/index.vue

@@ -149,14 +149,11 @@
      pageSize: 8,
      checkskipvisible: false,
      form:{},
      // handleClose:{},
      formLabelWidth: '120px',
      checked:{},
      usertt:[],
      Auditconclusion:{},
      tableRow: {},


    };
  },
  created() {

			@@ -1,167 +1,184 @@
			<template>
			<div class="preview-main">
			<div class="logo">
			<img :src="logoSrc" />
			</div>
			<div class="center">
			<h1>原材料检测报告</h1>
			<table height="30px">
			<tr>
			<td>材料名称</td>
			<td colspan="5">{{reportData.name}}</td>
			</tr>
			<tr>
			<td>规格型号</td>
			<td colspan="2">
			{{reportData.specifications.split("-")[1]}}
			</td>
			<td>材料厂家</td>
			<td colspan="2">{{reportData.supplier}}</td>
			</tr>
			<tr>
			<td>材料编号</td>
			<td colspan="2">{{reportData.imCode}}</td>
			<td>检测编号</td>
			<td colspan="2">{{reportData.insCode}}</td>
			</tr>
			<tr>
			<td>检测依据</td>
			<td colspan="2">
			{{reportData.specifications.split("-")[0]}}
			</td>
			<td>检测类别</td>
			<td colspan="2">原材料</td>
			</tr>
			<tr>
			<td>序号</td>
			<td>检验项目</td>
			<td>单位</td>
			<td>标准要求</td>
			<td>检测结果</td>
			<td>单项判断</td>
			</tr>
			<tr v-for="(item,index) in arr" :key="index">
			<td>{{index+1}}</td>
			<td>{{item.ipName}}</td>
			<td>{{item.unit}}</td>
			<td>{{item.required}}</td>
			<td>{{item.testValue}}</td>
			<td >
			{{isIfState(item.testState) }}
			</td>
			</tr>
			<tr>
			<td colspan="6">检验结论：{{reportData.type == 1 ? "合格" : "不合格"}}</td>
			</tr>
			<tr>
			<td colspan="6">
			注：“√”表示该项目合格，“×”表示该项目不合格，“—”表示该项目不要求检测。
			</td>
			</tr>
			</table>
			<el-row class="date-group">
			<p>检测、日期：<span>{{reportData.createTime}}</span></p>
			<p>审核、日期：<span>{{reportData.checkTime}}</span></p>
			</el-row>
			<p class="footer">
			<span>编号：</span><span>{{reportData.rcode}} </span>
			<span>发行日期：</span><span>{{now}} </span>
			<span>保存期限：</span><span>长期</span>
			</p>
			</div>
			</div>
			<div class="preview-main">
			<div class="logo">
			<img :src="logoSrc" />
			</div>
			<div class="center">
			<h1>原材料检测报告</h1>
			<table height="30px">
			<tr>
			<td>材料名称</td>
			<td colspan="5">{{reportData.name}}</td>
			</tr>
			<tr>
			<td>规格型号</td>
			<td colspan="2">
			{{reportData.length==0?null:reportData.specifications.split("-")[1]}}
			</td>
			<td>材料厂家</td>
			<td colspan="2">{{reportData.supplier}}</td>
			</tr>
			<tr>
			<td>材料编号</td>
			<td colspan="2">{{reportData.imCode}}</td>
			<td>检测编号</td>
			<td colspan="2">{{reportData.insCode}}</td>
			</tr>
			<tr>
			<td>检测依据</td>
			<td colspan="2">
			{{reportData.length==0?null:reportData.specifications.split("-")[0]}}
			</td>
			<td>检测类别</td>
			<td colspan="2">原材料</td>
			</tr>
			<tr>
			<td>序号</td>
			<td>检验项目</td>
			<td>单位</td>
			<td>标准要求</td>
			<td>检测结果</td>
			<td>单项判断</td>
			</tr>
			<tr v-for="(item,index) in arr" :key="index">
			<td>{{index+1}}</td>
			<td>{{item.ipName}}</td>
			<td>{{item.unit}}</td>
			<td>{{item.required}}</td>
			<td>{{item.testValue}}</td>
			<td>
			{{isIfState(item.testState) }}
			</td>
			</tr>
			<tr>
			<td colspan="6">检验结论：{{reportData.type == 1 ? "合格" : "不合格"}}</td>
			</tr>
			<tr>
			<td colspan="6">
			注：“√”表示该项目合格，“×”表示该项目不合格，“—”表示该项目不要求检测。
			</td>
			</tr>
			</table>
			<el-row class="date-group">
			<p>检测、日期：<span>{{reportData.createTime}}</span></p>
			<p>审核、日期：<span>{{reportData.checkTime}}</span></p>
			</el-row>
			<p class="footer">
			<span>编号：</span><span>{{reportData.rcode}} </span>
			<span>发行日期：</span><span>{{now}} </span>
			<span>保存期限：</span><span>长期</span>
			</p>
			</div>
			</div>
			</template>
			<script>
			export default({
			name: 'Preview',
			data() {
			return {
			logoSrc : require("@/assets/404_images/logo.png"),
			now: new Date().toLocaleDateString(),
			arr: []
			}
			},
			mounted(){
			this.arr = this.reportData.products;
			if(this.reportData.products.length < 10){
			let size = this.reportData.products.length;
			let num=10-size
			for(let i=0;i< num;i++){
			this.arr.push({
			code: null,
			ipName: "",
			required: "",
			testState: null,
			testValue: "",
			unit: ""})
			}
			}
			},
			methods:{
			formatDate(val){
			var dt = new Date(val);
			let year = dt.getFullYear();
			let month = (dt.getMonth() + 1).toString().padStart(2,'0');
			let date = dt.getDate().toString().padStart(2,'0');
			return `${year}-${month}-${date}`;
			},
			isIfState(val){
			if(val===1)return "√"
			else if(val===null \|\| val=== undefined) return null
			else return "X"
			}
			},
			props:["reportData"]
			})
			export default ({
			name: 'Preview',
			data() {
			return {
			logoSrc: require("@/assets/404_images/logo.png"),
			now: new Date().toLocaleDateString(),
			arr: []
			}
			},
			mounted() {
			this.arr = this.reportData.products;
			if(this.reportData.length>0){
			if (this.reportData.products.length < 10) {
			let size = this.reportData.products.length;
			let num = 10 - size
			for (let i = 0; i < num; i++) {
			this.arr.push({
			code: null,
			ipName: "",
			required: "",
			testState: null,
			testValue: "",
			unit: ""
			})
			}
			}
			}
			},
			methods: {
			formatDate(val) {
			var dt = new Date(val);
			let year = dt.getFullYear();
			let month = (dt.getMonth() + 1).toString().padStart(2, '0');
			let date = dt.getDate().toString().padStart(2, '0');
			return `${year}-${month}-${date}`;
			},
			isIfState(val) {
			if (val === 1) return "√"
			else if (val === null \|\| val === undefined) return null
			else return "X"
			}
			},
			props: ["reportData"]
			})
			</script>
			<style scoped lang="scss">
			.preview-main{
			margin: 0;
			padding: 0;
			width:90%;
			margin-left: 5%;
			.logo{
			img{
			width: 150px;
			height: 60px;
			}
			}
			.center{
			width: 100%;
			h1{
			width:100%;
			font-family: "微软雅黑" !important;
			text-align: center;
			}
			table{
			width:100%;
			border-collapse: collapse;
			font-size: 18px;
			}
			table,tr,th,td{
			border: 2px solid black;
			}
			tr,td,th{
			padding: 15px 10px;
			}
			.date-group{
			width: 90%;
			margin-left: 5%;
			p{
			width: 50%;
			float: left;
			text-align: center;
			padding: 50px 0px;
			font-size: 18px;
			}
			}
			.footer{
			width:90%;
			margin-left: 5%;
			color: lightgray;
			text-align: center;
			margin-top: 300px;
			}
			}
			}
			</style>
			.preview-main {
			margin: 0;
			padding: 0;
			width: 90%;
			margin-left: 5%;

			.logo {
			img {
			width: 150px;
			height: 60px;
			}
			}

			.center {
			width: 100%;

			h1 {
			width: 100%;
			font-family: "微软雅黑" !important;
			text-align: center;
			}

			table {
			width: 100%;
			border-collapse: collapse;
			font-size: 18px;
			}

			table,
			tr,
			th,
			td {
			border: 2px solid black;
			}

			tr,
			td,
			th {
			padding: 15px 10px;
			}

			.date-group {
			width: 90%;
			margin-left: 5%;

			p {
			width: 50%;
			float: left;
			text-align: center;
			padding: 50px 0px;
			font-size: 18px;
			}
			}

			.footer {
			width: 90%;
			margin-left: 5%;
			color: lightgray;
			text-align: center;
			margin-top: 300px;
			}
			}
			}
			</style>

			@@ -1,136 +1,92 @@
			<template>
			<div class="content-main">
			<div class="top-bar">
			<el-form ref="form" :inline="true" :model="searchData" label-position="left">
			<el-form-item label="样品编号:">
			<el-input
			v-model="searchData.sample_code"
			class="input-form"
			placeholder="请输入样品编号"
			@keyup.enter.native="getData"
			/>
			</el-form-item>
			<el-form-item label="报告单号:">
			<el-input
			v-model="searchData.reportCode"
			class="input-form"
			placeholder="请输入报告单号"
			/>
			</el-form-item>
			<el-form-item label="申请单号:">
			<el-input
			v-model="searchData.application_code"
			class="input-form"
			placeholder="请输入申请单号"
			/>
			</el-form-item>
			<el-form-item>
			<el-button type="primary" @click="getData()">查询</el-button>
			<el-button type="primary" plain @click="resetData()">重置</el-button>
			</el-form-item>
			</el-form>
			<el-form>
			<el-button @click="exportToPDF" class="rightBtn" type="primary" icon="el-icon-document"
			>导出报告</el-button
			>
			</el-form>
			</div>
			<div class="library-table">
			<div class="table-header">
			<div class="search-bar">
			<el-radio-group v-model="checkStatus" @change="handleRadioChange">
			<el-radio-button>全部</el-radio-button>
			<el-radio-button label="0">待提交</el-radio-button>
			<el-radio-button label="1">待审核</el-radio-button>
			<el-radio-button label="2">待签字</el-radio-button>
			<el-radio-button label="3">已完成</el-radio-button>
			</el-radio-group>

			<el-checkbox v-model="checked" style="margin-left: 20px"
			>仅看我的</el-checkbox
			>
			</div>
			</div>
			<el-dialog
			top="10vh"
			title="报告预览"
			:visible.sync="dialogVisible"
			width="60%">
			<span slot="footer" class="dialog-footer">
			<el-button type="primary" @click="printFun()">打印</el-button>
			</span>
			<div class="printStyle">
			<Preview id="printRaw" :reportData="reportData" v-if="reportType===0"></Preview>
			<TestReport ref="testreport" id="printFinished" :reportData="reportData" v-else></TestReport>
			</div>
			</el-dialog>
			<div class="table-box">
			<el-table
			ref="reportTable"
			:max-height="800"
			:cell-style="{ textAlign: 'center' }"
			:header-cell-style="{
			<div class="content-main">
			<div class="top-bar">
			<el-form ref="form" :inline="true" :model="searchData" label-position="left">
			<el-form-item label="样品编号:">
			<el-input v-model="searchData.sample_code" class="input-form" placeholder="请输入样品编号"
			@keyup.enter.native="getData" />
			</el-form-item>
			<el-form-item label="报告单号:">
			<el-input v-model="searchData.reportCode" class="input-form" placeholder="请输入报告单号" />
			</el-form-item>
			<el-form-item label="申请单号:">
			<el-input v-model="searchData.application_code" class="input-form" placeholder="请输入申请单号" />
			</el-form-item>
			<el-form-item>
			<el-button type="primary" @click="getData()">查询</el-button>
			<el-button type="primary" plain @click="resetData()">重置</el-button>
			</el-form-item>
			</el-form>
			<el-form>
			<el-button @click="exportToPDF" class="rightBtn" type="primary" icon="el-icon-document">导出报告</el-button>
			</el-form>
			</div>
			<div class="library-table">
			<div class="table-header">
			<div class="search-bar">
			<el-radio-group v-model="checkStatus" @change="handleRadioChange">
			<el-radio-button>全部</el-radio-button>
			<el-radio-button label="0">待提交</el-radio-button>
			<el-radio-button label="1">待审核</el-radio-button>
			<el-radio-button label="2">待签字</el-radio-button>
			<el-radio-button label="3">已完成</el-radio-button>
			</el-radio-group>
			<el-checkbox v-model="checked" style="margin-left: 20px">仅看我的</el-checkbox>
			</div>
			</div>
			<el-dialog top="10vh" title="报告预览" :visible.sync="dialogVisible" width="60%">
			<span slot="footer" class="dialog-footer">
			<el-button type="primary" @click="printFun()">打印</el-button>
			</span>
			<div class="printStyle" v-if="dialogVisible">
			<Preview id="printRaw" :reportData="reportData" v-if="reportType===0"></Preview>
			<TestReport ref="testreport" id="printFinished" :reportData="reportData" v-else></TestReport>
			</div>
			</el-dialog>
			<div class="table-box">
			<el-table ref="reportTable" :max-height="800" :cell-style="{ textAlign: 'center' }" :header-cell-style="{
			border: '0px',
			background: '#f5f7fa',
			color: '#606266',
			boxShadow: 'inset 0 1px 0 #ebeef5',
			textAlign: 'center',
			}"
			:data="reportTable"
			@selection-change="handleSelectionChange"
			style="width: 100%"
			>
			<el-table-column type="selection" label="" min-width="5%" />

			<el-table-column
			prop="materialCode"
			label="样品编号"
			sortable
			min-width="10%"
			>
			<template slot-scope="scope">
			<span style="color: #409eff;">
			{{ scope.row.materialCode }}
			</span>
			</template></el-table-column
			>
			<el-table-column
			prop="reportCode"
			label="报告单号"
			sortable
			min-width="10%"
			>
			<template slot-scope="scope">
			<span style="color: #409eff;">
			{{ scope.row.reportCode }}
			</span>
			</template></el-table-column
			>
			<el-table-column
			prop="inspectionCode"
			label="申请单号"
			sortable
			min-width="10%"
			>
			<template slot-scope="scope">
			<span style="color: #409eff;">
			{{ scope.row.inspectionCode }}
			</span>
			</template></el-table-column
			>
			<el-table-column prop="approver" label="审批人" min-width="8%">
			<template slot-scope="scope">
			<span>
			<el-tag v-if="scope.row.approver!=null && scope.row.approver!=''" type="info" icon="el-icon-user">
			<i class="el-icon-user">{{ scope.row.approver }}</i>
			</el-tag>
			</span>
			</template>
			</el-table-column>
			<el-table-column prop="status" label="审批状态" min-width="8%">
			<template slot-scope="scope">
			<span>
			<el-tag type="info">{{
			}" :data="reportTable" @selection-change="handleSelectionChange" style="width: 100%">
			<el-table-column type="selection" min-width="5%" />
			<el-table-column prop="type" label="报告类型" min-width="5%">
			<template slot-scope="scope">
			<el-tag>{{scope.row.type == 0?'原材料报告':scope.row.type==1?'成品报告':'委托报告'}}</el-tag>
			</template></el-table-column>
			<el-table-column prop="materialCode" label="样品编号" sortable min-width="10%">
			<template slot-scope="scope">
			<span style="color: #409eff;">
			{{ scope.row.materialCode }}
			</span>
			</template></el-table-column>
			<el-table-column prop="reportCode" label="报告单号" sortable min-width="10%">
			<template slot-scope="scope">
			<span style="color: #409eff;">
			{{ scope.row.reportCode }}
			</span>
			</template></el-table-column>
			<el-table-column prop="inspectionCode" label="申请单号" sortable min-width="10%">
			<template slot-scope="scope">
			<span style="color: #409eff;">
			{{ scope.row.inspectionCode }}
			</span>
			</template></el-table-column>
			<el-table-column prop="approver" label="审批人" min-width="8%">
			<template slot-scope="scope">
			<span>
			<el-tag v-if="scope.row.approver!=null && scope.row.approver!=''" type="info" icon="el-icon-user">
			<i class="el-icon-user">{{ scope.row.approver }}</i>
			</el-tag>
			</span>
			</template>
			</el-table-column>
			<el-table-column prop="status" label="审批状态" min-width="8%">
			<template slot-scope="scope">
			<span>
			<el-tag type="info">{{
			scope.row.status == 0
			? "待提交"
			: scope.row.status == 1
			@@ -139,264 +95,247 @@
			? "代签字"
			: "已完成"
			}}</el-tag>
			</span>
			</template></el-table-column
			>
			<el-table-column prop="conclusion" label="检验结论" min-width="8%" />
			<el-table-column prop="name" label="编制人" min-width="8%">
			<template slot-scope="scope">
			<span>
			<el-tag type="info" icon="el-icon-user">
			<i class="el-icon-user">{{ scope.row.name }}</i>
			</el-tag>
			</span>
			</template>
			</el-table-column>
			<el-table-column label="操作" min-width="8%">
			<template slot-scope="scope">
			<el-button
			type="text"
			size="small"
			@click="previewFun(scope.row)"
			>查看报告</el-button
			>
			</template>
			</el-table-column>
			</el-table>
			<!-- 分页器 -->
			<div>
			<el-pagination
			:current-page="page"
			:page-sizes="[10, 20, 30, 40]"
			:page-size="pageSize"
			layout="total, sizes, prev, pager, next, jumper"
			:total="total"
			@size-change="handleSizeChange"
			@current-change="handleCurrentChange"
			/>
			</div>
			</div>
			</div>
			<Preview ref="preview" id="printRaw" :reportData="reportData" v-show="false"></Preview>
			<TestReport ref="testreport" id="printFinished" :reportData="reportData" v-show="false"></TestReport>
			<el-dialog
			title="导出pdf"
			:visible.sync="dialogPdfVisible"
			width="30%"
			:before-close="handleClose">
			<span>确定开始导出吗？</span>
			<span slot="footer" class="dialog-footer">
			<el-button @click="dialogPdfVisible = false">取消</el-button>
			<el-button type="primary" @click="confirmExport">确定</el-button>
			</span>
			</el-dialog>
			</div>
			</span>
			</template></el-table-column>
			<el-table-column prop="conclusion" label="检验结论" min-width="8%">
			<template slot-scope="scope">
			<span :style="`color: ${scope.row.conclusion=='合格'?'#67c23a':'#f56c6c'}`">{{scope.row.conclusion}}</span>
			</template>
			</el-table-column>
			<el-table-column prop="name" label="编制人" min-width="8%">
			<template slot-scope="scope">
			<span>
			<el-tag type="info" icon="el-icon-user">
			<i class="el-icon-user">{{ scope.row.name }}</i>
			</el-tag>
			</span>
			</template>
			</el-table-column>
			<el-table-column label="操作" min-width="8%">
			<template slot-scope="scope">
			<el-button type="text" size="small" @click="previewFun(scope.row)">查看报告</el-button>
			</template>
			</el-table-column>
			</el-table>
			<!-- 分页器 -->
			<div>
			<el-pagination :current-page="page" :page-sizes="[10, 20, 30, 40]" :page-size="pageSize"
			layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
			@current-change="handleCurrentChange" />
			</div>
			</div>
			</div>
			<Preview ref="preview" id="printRaw" :reportData="reportData" v-show="false"></Preview>
			<TestReport ref="testreport" id="printFinished" :reportData="reportData" v-show="false"></TestReport>
			<el-dialog title="导出pdf" :visible.sync="dialogPdfVisible" width="30%">
			<span>确定开始导出吗？</span>
			<span slot="footer" class="dialog-footer">
			<el-button @click="dialogPdfVisible = false">取消</el-button>
			<el-button type="primary" @click="confirmExport">确定</el-button>
			</span>
			</el-dialog>
			</div>
			</template>

			<script>
			import { selectAllReport,getReportData } from "@/api/experiment/checkTheReport";
			import Preview from "@/components/experiment/checkTheReport/index.vue";
			import TestReport from "@/components/experiment/template_testReport/index.vue"
			import PrintJS from 'print-js'
			import html2pdf from 'html2pdf.js'
			import {
			selectAllReport,
			getReportData
			} from "@/api/experiment/checkTheReport";
			import Preview from "@/components/experiment/checkTheReport/index.vue";
			import TestReport from "@/components/experiment/template_testReport/index.vue"
			import PrintJS from 'print-js'
			import html2pdf from 'html2pdf.js'

			export default {
			data() {
			return {
			reportData: [],
			reportType: 0,
			searchData:{
			sample_code:'',
			reportCode:'',
			application_code: ''
			},
			checkStatus: undefined,
			reportTable: [
			{
			materialCode:'SN23-0517001',
			reportCode: 'SN23-0517001',
			inspectionCode: 'SN23-0517001',
			approver:'黄小明',
			status: '',
			conclusion: 1,
			name: '黄小明'
			},
			{
			materialCode:'SN23-0517001',
			reportCode: 'SN23-0517001',
			inspectionCode: 'SN23-0517001',
			approver:'黄小明',
			status: '',
			conclusion: 1,
			name: '黄小明'
			}
			],
			page: 1,
			total: 0,
			pageSize: 10,
			checked: true,
			dialogVisible: false,
			dialogPdfVisible: false,
			selectedRows: []
			};
			},
			created() {
			// this.getData();
			},
			mounted(){
			},
			components:{
			Preview,
			TestReport
			},
			methods: {
			async queryReportByRCode(code){
			const resp = await getReportData({code:code});
			this.reportData = resp.data;
			this.dialogVisible = true;
			console.log(this.reportData);
			},
			//查看报告按钮
			previewFun(row){
			console.log(row)
			this.reportType = row.type;
			this.queryReportByRCode(row.reportCode);
			},
			handleSelectionChange(selection){
			this.selectedRows = selection;
			},
			// 批量导出报告
			exportToPDF() {
			this.dialogPdfVisible = true;
			},
			// 确认导出模态框
			confirmExport(){
			this.selectedRows.forEach(async row => {
			const element = document.getElementById('printFinished');
			console.log(element)
			// 设置TestReport组件的reportData属性为当前行的报告数据
			const resp = await getReportData({code:row.reportCode});
			this.$nextTick(() => {
			this.$refs.testreport.reportData = resp.data;
			html2pdf().from(element).save(`exported_${row.reportCode}.pdf`);
			});
			});
			this.dialogPdfVisible = false;
			this.selectedRows = [];
			},
			//打印按钮
			printFun(){
			this.dialogVisible = false;
			PrintJS({
			printable: this.reportType===0 ? "printRaw" : "printFinished",
			type: "html",
			// header: "原材料检测报告",
			targetStyles: ["*"],
			ignoreElements: ["no-ignore"],
			});
			},
			// 状态按钮
			handleRadioChange() {
			this.getData();
			},
			// 每页条数改变时触发选择一页显示多少行
			handleSizeChange(val) {
			console.log(`每页 ${val} 条`);
			this.pageSize = val;
			this.getData();
			},
			// 当前页改变时触发跳转其他页
			handleCurrentChange(val) {
			console.log(`当前页: ${val}`);
			this.page = val;
			this.getData();
			},
			// 重置按钮
			resetData() {
			this.searchData={
			sample_code:'',
			reportCode:'',
			application_code: ''
			},
			this.page = 1;
			this.pageSize = 10;
			this.checkStatus = undefined;
			this.getData();
			},
			// 查询列表
			async getData() {
			const params = {
			page: this.page,
			pageSize: this.pageSize,
			name: this.searchData.sample_code ? this.searchData.sample_code : undefined,
			status: this.checkStatus ? this.checkStatus : undefined,
			};
			const { data } = await selectAllReport(params);
			this.reportTable = data.row;
			console.log(data.row);
			this.total = data.total;
			},
			},
			};
			export default {
			data() {
			return {
			reportData: [],
			reportType: 0,
			searchData: {
			sample_code: '',
			reportCode: '',
			application_code: ''
			},
			checkStatus: undefined,
			reportTable: [],
			page: 1,
			total: 0,
			pageSize: 10,
			checked: true,
			dialogVisible: false,
			dialogPdfVisible: false,
			selectedRows: []
			};
			},
			created() {
			this.getData();
			},
			mounted() {},
			components: {
			Preview,
			TestReport
			},
			methods: {
			async queryReportByRCode(code) {
			const resp = await getReportData({
			code: code
			});
			this.reportData = resp.data;
			this.dialogVisible = true;
			console.log(this.reportData);
			},
			//查看报告按钮
			previewFun(row) {
			this.reportType = row.type;
			this.queryReportByRCode(row.reportCode);
			},
			handleSelectionChange(selection) {
			this.selectedRows = selection;
			},
			// 批量导出报告
			exportToPDF() {
			this.dialogPdfVisible = true;
			},
			// 确认导出模态框
			confirmExport() {
			this.selectedRows.forEach(async row => {
			const element = document.getElementById('printFinished');
			console.log(element)
			// 设置TestReport组件的reportData属性为当前行的报告数据
			const resp = await getReportData({
			code: row.reportCode
			});
			this.$nextTick(() => {
			this.$refs.testreport.reportData = resp.data;
			html2pdf().from(element).save(`exported_${row.reportCode}.pdf`);
			});
			});
			this.dialogPdfVisible = false;
			this.selectedRows = [];
			},
			//打印按钮
			printFun() {
			this.dialogVisible = false;
			PrintJS({
			printable: this.reportType === 0 ? "printRaw" : "printFinished",
			type: "html",
			// header: "原材料检测报告",
			targetStyles: ["*"],
			ignoreElements: ["no-ignore"],
			});
			},
			// 状态按钮
			handleRadioChange() {
			this.getData();
			},
			// 每页条数改变时触发选择一页显示多少行
			handleSizeChange(val) {
			this.pageSize = val;
			this.getData();
			},
			// 当前页改变时触发跳转其他页
			handleCurrentChange(val) {
			this.page = val;
			this.getData();
			},
			// 重置按钮
			resetData() {
			this.searchData = {
			sample_code: '',
			reportCode: '',
			application_code: ''
			},
			this.page = 1;
			this.pageSize = 10;
			this.checkStatus = undefined;
			this.getData();
			},
			// 查询列表
			async getData() {
			const params = {
			page: this.page,
			pageSize: this.pageSize,
			name: this.searchData.sample_code ? this.searchData.sample_code : undefined,
			status: this.checkStatus ? this.checkStatus : undefined,
			};
			const {
			data
			} = await selectAllReport(params);
			this.reportTable = data.row;
			this.total = data.total;
			},
			},
			};
			</script>

			<style lang="scss" scoped>
			.top-bar {
			margin: -25px -15px;
			background: #fff;
			display: flex;
			justify-content: space-between;
			padding: 5px 24px 0px 24px;
			.input-form {
			width: 250px;
			margin-right: 30px;
			}
			.el-dropdown-link {
			cursor: pointer;
			color: #409eff;
			}
			.el-icon-arrow-down {
			font-size: 12px;
			}
			}
			.library-table {
			height: 80vh;
			overflow: scroll;
			background-color: #fff;
			flex: 1;
			margin: 0px -15px;
			margin-top: 40px;
			display: flex;
			flex-direction: column;
			.table-header {
			padding: 20px;
			display: flex;
			justify-content: space-between;
			.el-form-item {
			margin-bottom: 30px !important;
			}
			}
			.table-box {
			padding: 0px 20px;
			margin-top: 0px;
			flex: 1;
			background: #fff;
			display: flex;
			flex-direction: column;
			> div:nth-child(2) {
			display: flex;
			justify-content: end;
			margin: 10px 0;
			}
			}
			.printStyle{
			overflow: scroll;
			height:500px;
			.el-button{
			position: absolute;
			top: 10vh;
			left: 90%;
			}
			}
			}
			</style>
			.top-bar {
			margin: -25px -15px;
			background: #fff;
			display: flex;
			justify-content: space-between;
			padding: 5px 24px 0px 24px;

			.input-form {
			width: 250px;
			margin-right: 30px;
			}

			.el-dropdown-link {
			cursor: pointer;
			color: #409eff;
			}

			.el-icon-arrow-down {
			font-size: 12px;
			}
			}

			.library-table {
			height: 80vh;
			overflow: scroll;
			background-color: #fff;
			flex: 1;
			margin: 0px -15px;
			margin-top: 40px;
			display: flex;
			flex-direction: column;

			.table-header {
			padding: 20px;
			display: flex;
			justify-content: space-between;

			.el-form-item {
			margin-bottom: 30px !important;
			}
			}

			.table-box {
			padding: 0px 20px;
			margin-top: 0px;
			flex: 1;
			background: #fff;
			display: flex;
			flex-direction: column;

			>div:nth-child(2) {
			display: flex;
			justify-content: end;
			margin: 10px 0;
			}
			}

			.printStyle {
			overflow: scroll;
			height: 600px;

			.el-button {
			position: absolute;
			top: 10vh;
			left: 90%;
			}
			}
			}
			</style>

			@@ -86,20 +86,20 @@
			</el-table-column>
			<el-table-column prop="required" label="内控值">
			</el-table-column>
			<el-table-column prop="userName" label="责任人" width="220px">
			<el-table-column prop="userId" label="责任人" width="220px">
			<template slot-scope="scope">
			<el-select v-model="scope.row.username" slot="append"
			<el-select v-model="scope.row.userId" slot="append"
			@change="(val)=>chooseUseProId(val, scope.row)">
			<el-option v-for="(item,indxe) in ZERENren" :key="indxe" :label="item.name"
			:value="item.id"></el-option>
			</el-select>
			</template>
			</el-table-column>
			<el-table-column prop="inspectionMaterialId" label="实验设备" width="220px">
			<el-table-column prop="instrumentId" label="实验设备" width="300px">
			<template slot-scope="scope">
			<el-cascader v-model="scope.row.instrumentName" :options="devices"
			<el-cascader v-model="scope.row.instrumentId" :options="devices"
			:props="{label: 'Name',value: 'Id',children: 'childrenList'}"
			@change="(val)=>chooseEquipment(val, scope.row)"></el-cascader>
			@change="(val)=>chooseEquipment(val, scope.row)" style="width: 100%;"></el-cascader>
			</template>
			</el-table-column>
			</el-table>

			@@ -45,33 +45,33 @@
			:header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
			:data="inspectionTable">
			<el-table-column type="selection" min-width="30px" />
			<el-table-column prop="icode" label="申请单号" min-width="150px" />
			<el-table-column prop="type" label="检验类型" min-width="80px">
			<el-table-column prop="icode" label="申请单号" min-width="160px" />
			<el-table-column prop="type" label="检验类型" min-width="100px">
			<template slot-scope="scope">
			<div v-if="scope.row.type === 0"><span>原材料检验</span></div>
			<div v-if="scope.row.type === 1"><span>委托检验</span></div>
			<div v-if="scope.row.type === 2"><span>成品检验</span></div>
			<div v-if="scope.row.type === 0"><el-tag type="success">原材料检验</el-tag></div>
			<div v-if="scope.row.type === 2"><el-tag>委托检验</el-tag></div>
			<div v-if="scope.row.type === 1"><el-tag type="warning">成品检验</el-tag></div>
			</template>
			</el-table-column>
			<el-table-column prop="formTime" label="来料日期" min-width="90px" />
			<el-table-column prop="supplier" label="供应商名称" min-width="150px" show-overflow-tooltip />
			<el-table-column prop="mcode" label="原材料编码" min-width="170px" />
			<el-table-column prop="name" label="原材料名称" min-width="80px" />
			<el-table-column prop="name" label="原材料名称" min-width="90px" />
			<el-table-column prop="specifications" label="规格型号" min-width="160px" />
			<el-table-column prop="unit" label="单位" min-width="50px" />
			<el-table-column prop="num" label="数量" min-width="50px" />
			<el-table-column prop="createTime" label="登记日期" min-width="80px" />
			<el-table-column prop="inspection_status" label="检验结果" min-width="80px">
			<el-table-column prop="createTime" label="登记日期" min-width="90px" />
			<el-table-column prop="inspection_status" label="检验结果" min-width="95px">
			<template slot-scope="scope">
			<el-tag class="tag" type="danger" disable-transitions
			<el-tag class="tag" effect="dark" type="danger" disable-transitions
			v-if="scope.row.inspection_status == 0">不合格</el-tag>
			<el-tag class="tag" type="success" disable-transitions
			<el-tag class="tag" effect="dark" type="success" disable-transitions
			v-else-if="scope.row.inspection_status == 1">合格</el-tag>
			</template>
			</el-table-column>
			<el-table-column prop="userName" label="登记人" min-width="80px" />
			<el-table-column prop="checkdate" label="检验日期" min-width="160px" />
			<el-table-column label="操作" min-width="150" fixed="right">
			<el-table-column prop="checkdate" label="检验日期" min-width="170px" />
			<el-table-column label="操作" min-width="120" fixed="right">
			<template slot-scope="scope">
			<el-button type="text" size="small" @click="handleClick(scope.row)">查看</el-button>
			<el-button type="text" size="small" @click="delInspect(scope.row)">作废</el-button>
			@@ -288,7 +288,6 @@
			</div>
			<span slot="footer" class="dialog-footer">
			<el-button @click="checkTypeVisible = false">取消</el-button>
			<!-- <el-button type="primary" @click="addInspection">确定</el-button> -->
			<el-button type="primary" @click="QUEding">确定</el-button>
			</span>
			</el-dialog>
			@@ -304,7 +303,7 @@
			</el-select>
			</template>
			</el-card>
			<el-table :data="tableData" style="width: 100%; margin-bottom: 20px" row-key="id" border height="calc(40vh)"
			<el-table :data="tableData" style="width: 100%; margin-bottom: 20px;overflow-y: auto;" row-key="id" border height="40vh"
			default-expand-all ref="multipleTable" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
			<el-table-column type="index" width="50px" label="序号"></el-table-column>
			<el-table-column prop="name" label="项目名称" sortable>
			@@ -321,9 +320,9 @@
			</span>
			</el-dialog>
			<!-- 原材料检验模态框 -->
			<el-dialog title="原材料检验" :visible.sync="rawmaterialVisible" width="60%">
			<el-dialog title="原材料检验" :visible.sync="rawmaterialVisible" width="60%" top="100px">
			<div class="table-box">
			<el-table ref="multipleTable" :max-height="800" :cell-style="{textAlign: 'center'}"
			<el-table ref="multipleTable" :max-height="600" :cell-style="{textAlign: 'center'}"
			:header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
			:data="rawMaterialTable" style="width: 100%" @selection-change="handleSelectionChange">
			<el-table-column type="selection" min-width="10%" />

			@@ -106,7 +106,7 @@
			</el-table-column>
			<el-table-column label="操作" width="150">
			<template slot-scope="scope">
			<el-button size="mini" type="primary" v-if="isIfReport(scope.row)"
			<el-button size="mini" :disabled="!isIfReport(scope.row)" type="primary" v-if="scope.row.orderNum == '01'"
			@click="addReported(scope.row.id)">上报</el-button>
			<el-button size="mini" type="text" @click="openUpDia(scope.row)"
			v-if="scope.row.orderNum=='02'">分配</el-button>
			@@ -139,7 +139,7 @@
			<el-button @click="upDia = false">取消</el-button>
			</span>
			</el-dialog>
			<el-dialog title="检验" :visible.sync="upInsDia" width="500px">
			<el-dialog title="检验" :visible.sync="upInsDia" width="600px">
			<div class="body" style="max-height: 50vh;overflow-y: auto;">
			<el-row style="line-height: 46px;">
			<el-col :span="5" style="font-size: 14px;text-align: right;">申请单编码：</el-col>
			@@ -182,7 +182,7 @@
			</el-input>
			</template>
			</el-table-column>
			<el-table-column label="操作" width="60">
			<el-table-column label="操作" width="80">
			<template slot-scope="scope">
			<el-button size="mini" type="text"
			@click.native.prevent="deleteRow(scope.$index, upData.testValue)">删除</el-button>
			@@ -264,7 +264,7 @@
			row.children.forEach(a => {
			if (a.testState != null && a.testState != undefined) count++
			})
			return row.testState == undefined && row.orderNum == '01' && count == row
			return row.testState == undefined && count == row
			.children.length
			},
			openUpDia(row) {
			@@ -355,7 +355,7 @@
			this.upInsDia = false
			this.selectDataList()
			this.$confirm(
			`<p style="line-height: 80px">您的项目(${this.upData.name})检验结果为：<span class="${res.data==1?'ins_state_success':'ins_state_error'}">${res.data==1?'合格':'不合格'}</span></p>`,
			`<p style="line-height: 80px">您的项目（${this.upData.name}）检验结果为：<span class="${res.data==1?'ins_state_success':'ins_state_error'}">${res.data==1?'合格':'不合格'}</span></p>`,
			'提交成功', {
			confirmButtonText: '确定',
			cancelButtonText: '关闭',

			@@ -149,14 +149,11 @@
			pageSize: 8,
			checkskipvisible: false,
			form:{},
			// handleClose:{},
			formLabelWidth: '120px',
			checked:{},
			usertt:[],
			Auditconclusion:{},
			tableRow: {},


			};
			},
			created() {