From 234e8f7af3e93f78e5384b64e26c2f23c659bfcc Mon Sep 17 00:00:00 2001 From: zouyu <2723363702@qq.com> Date: 星期五, 01 九月 2023 09:12:44 +0800 Subject: [PATCH] Merge branch 'master' of http://192.168.110.209:9001/r/lims-before --- src/views/experiment/checkTheReport/index.vue | 701 ++++++++++++++++++++++++++------------------------------- 1 files changed, 320 insertions(+), 381 deletions(-) diff --git a/src/views/experiment/checkTheReport/index.vue b/src/views/experiment/checkTheReport/index.vue index 253340f..1d97b93 100644 --- a/src/views/experiment/checkTheReport/index.vue +++ b/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 @@ ? "浠g瀛�" : "宸插畬鎴�" }}</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缁勪欢鐨剅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) { - 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缁勪欢鐨剅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: 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> \ No newline at end of file -- Gitblit v1.9.3