From 34a7e21b3508ac0f5f011d958210fdb7176d726b Mon Sep 17 00:00:00 2001
From: Fixiaobai <fixiaobai@163.com>
Date: 星期六, 09 九月 2023 11:54:05 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.22:9001/r/lims-before
---
src/views/experiment/checkTheReport/index.vue | 590 +++++++++++++++++++++++++++++++++-------------------------
1 files changed, 333 insertions(+), 257 deletions(-)
diff --git a/src/views/experiment/checkTheReport/index.vue b/src/views/experiment/checkTheReport/index.vue
index 2a92de3..b522540 100644
--- a/src/views/experiment/checkTheReport/index.vue
+++ b/src/views/experiment/checkTheReport/index.vue
@@ -1,268 +1,344 @@
<template>
- <div class="content-main">
- <div class="top-bar">
- <el-form ref="form" :inline="true">
- <el-form-item class="sermargin">
- <el-input
- v-model="input"
- class="input-form"
- placeholder="璇风洿鎺ヨ緭鍏ユ牱寮忕紪鍙�/鎶ュ憡鍗曞彿/鏍峰搧缂栧彿/杩涜鎼滅储鎴栦笅鎷夐�夋嫨杩涜缁勫悎鏌ヨ"
- @keyup.enter.native="getData"
- />
- </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-dropdown>
- <span class="el-dropdown-link">
- 楂樼骇鎼滅储<i class="el-icon-arrow-down el-icon--right"></i>
- </span>
- <el-dropdown-menu slot="dropdown">
- <el-dropdown-item>楂樼骇鎼滅储</el-dropdown-item>
- </el-dropdown-menu>
- </el-dropdown>
- </el-form>
- <el-form>
- <el-button 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-group>
-
- <el-checkbox v-model="checked" style="margin-left: 20px"
- >浠呯湅鎴戠殑</el-checkbox
- >
- </div>
- </div>
- <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" style="margin-top: 10px;">
+ <el-form-item label="鏍峰搧缂栧彿:">
+ <el-input size="small" v-model="searchData.sample_code" class="input-form" placeholder="璇疯緭鍏ユ牱鍝佺紪鍙�"
+ @keyup.enter.native="getData" />
+ </el-form-item>
+ <el-form-item label="鎶ュ憡鍗曞彿:">
+ <el-input size="small" v-model="searchData.reportCode" class="input-form" placeholder="璇疯緭鍏ユ姤鍛婂崟鍙�" />
+ </el-form-item>
+ <el-form-item label="鐢宠鍗曞彿:">
+ <el-input size="small" v-model="searchData.application_code" class="input-form" placeholder="璇疯緭鍏ョ敵璇峰崟鍙�" />
+ </el-form-item>
+ <el-form-item>
+ <el-button size="small" type="primary" @click="getData()">鏌ヨ</el-button>
+ <el-button size="small" type="primary" plain @click="resetData()">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ <el-form style="margin-top: 10px;">
+ <el-button size="small" @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-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" height="200" :max-height="800" :cell-style="{ textAlign: 'left' }" :header-cell-style="{
border: '0px',
background: '#f5f7fa',
color: '#606266',
boxShadow: 'inset 0 1px 0 #ebeef5',
- textAlign: 'center',
- }"
- :data="reportTable"
- 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="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="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
- ? "寰呭鏍�"
- : scope.row.status == 2
- ? "浠ｇ瀛�"
- : "宸插畬鎴�"
- }}</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="handleClick(scope.row)"
- >棰勮</el-button
- >
- <el-button type="text" size="small">鎵撳嵃</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>
- </div>
+ textAlign: 'left',
+ }" :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
+ ? "寰呯瀛�" : "宸插畬鎴�"
+ }}
+ </el-tag>
+ </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 } from "@/api/experiment/checkTheReport";
-export default {
- data() {
- return {
- input: "",
- checkStatus: undefined,
- reportTable: [],
- page: 1,
- total: 0,
- pageSize: 10,
- checked: true,
- };
- },
- created() {
- this.getData();
- },
- methods: {
- // 鐘舵�佹寜閽�
- 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.input = undefined;
- this.page = 1;
- this.pageSize = 10;
- this.checkStatus = undefined;
- this.getData();
- },
- // 鏌ヨ鍒楄〃
- async getData() {
- const params = {
- page: this.page,
- pageSize: this.pageSize,
- name: this.input ? this.input : undefined,
- status: this.checkStatus ? this.checkStatus : undefined,
- };
- const { data } = await selectAllReport(params);
- this.reportTable = data.row;
- this.total = data.total;
- },
- },
-};
+ 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: [],
+ page: 1,
+ total: 0,
+ pageSize: 10,
+ checked: true,
+ dialogVisible: false,
+ dialogPdfVisible: false,
+ selectedRows: []
+ };
+ },
+ created() {
+ this.getData();
+ },
+ mounted() {},
+ components: {
+ Preview,
+ TestReport
+ },
+ methods: {
+ async queryReportByRCode(code,name) {
+ const resp = await getReportData({
+ code: code
+ });
+ this.reportData = resp.data;
+ this.reportData.preparerName = name;
+ this.dialogVisible = true;
+ console.log(this.reportData);
+ },
+ //鏌ョ湅鎶ュ憡鎸夐挳
+ previewFun(row) {
+ this.reportType = row.type;
+ this.queryReportByRCode(row.reportCode,row.name);
+
+ },
+ handleSelectionChange(selection) {
+ this.selectedRows = selection;
+ },
+ // 鎵归噺瀵煎嚭鎶ュ憡
+ exportToPDF() {
+ this.dialogPdfVisible = true;
+ },
+ // 纭瀵煎嚭妯℃�佹
+ confirmExport() {
+ this.selectedRows.forEach(async row => {
+ const element = document.getElementById('printFinished');
+ console.log(element)
+ // 璁剧疆TestReport缁勪欢鐨剅eportData灞炴�т负褰撳墠琛岀殑鎶ュ憡鏁版嵁
+ 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: 700px;
- }
- .el-dropdown-link {
- cursor: pointer;
- color: #409eff;
- }
- .el-icon-arrow-down {
- font-size: 12px;
- }
-}
-.library-table {
- 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;
- }
- }
-}
-</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 {
+ height: 60vh;
+ padding: 0px 20px;
+ margin-top: 0px;
+ flex: 1;
+ background: #fff;
+ display: flex;
+ flex-direction: column;
+ .el-table{
+ overflow: scroll;
+ }
+ >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>
\ No newline at end of file
--
Gitblit v1.9.3