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 | 339 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 335 insertions(+), 4 deletions(-) diff --git a/src/views/experiment/checkTheReport/index.vue b/src/views/experiment/checkTheReport/index.vue index d08ff60..b522540 100644 --- a/src/views/experiment/checkTheReport/index.vue +++ b/src/views/experiment/checkTheReport/index.vue @@ -1,13 +1,344 @@ <template> - <div>妫�娴嬫姤鍛�</div> + <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: '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> -export default { + 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; -</style> + .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