From 809f8b1279bf84f28bccabc4f95a8eba6c22a24d Mon Sep 17 00:00:00 2001 From: Fixiaobai <fixiaobai@163.com> Date: 星期二, 29 八月 2023 10:30:04 +0800 Subject: [PATCH] 放行委托新增 --- src/views/experiment/checkTheReport/index.vue | 335 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 331 insertions(+), 4 deletions(-) diff --git a/src/views/experiment/checkTheReport/index.vue b/src/views/experiment/checkTheReport/index.vue index d08ff60..dce2174 100644 --- a/src/views/experiment/checkTheReport/index.vue +++ b/src/views/experiment/checkTheReport/index.vue @@ -1,13 +1,340 @@ <template> - <div>妫�娴嬫姤鍛�</div> + <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 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="printDiv" :reportData="reportData" v-if="reportType===0"></preview> + <div v-else>鎴愬搧妫�娴嬫姤鍛�</div> + </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" + 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">{{ + scope.row.status == 0 + ? "寰呮彁浜�" + : scope.row.status == 1 + ? "寰呭鏍�" + : scope.row.status == 2 + ? "浠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> + </div> </template> <script> +import { selectAllReport,getReportData } from "@/api/experiment/checkTheReport"; +import Preview from "@/components/experiment/checkTheReport/index.vue"; +import PrintJS from 'print-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, + }; + }, + created() { + this.getData(); + }, + mounted(){ + }, + components:{ + Preview + }, + 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); + }, + //鎵撳嵃鎸夐挳 + printFun(){ + this.dialogVisible = false; + PrintJS({ + printable: "printDiv", + 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; + }, + }, +}; </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> -- Gitblit v1.9.3