From 238595017057e4bc67393915140507785f45b195 Mon Sep 17 00:00:00 2001 From: wujian <14790700720@163.com> Date: 星期三, 31 一月 2024 14:24:47 +0800 Subject: [PATCH] add 追溯报表 --- jcdm-ui/src/views/main/cfkb/Instructions/index.vue | 158 ++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 116 insertions(+), 42 deletions(-) diff --git a/jcdm-ui/src/views/main/cfkb/Instructions/index.vue b/jcdm-ui/src/views/main/cfkb/Instructions/index.vue index 7097c32..48a3e91 100644 --- a/jcdm-ui/src/views/main/cfkb/Instructions/index.vue +++ b/jcdm-ui/src/views/main/cfkb/Instructions/index.vue @@ -2,29 +2,32 @@ <div class="app-container"> <el-row :gutter="3"> <el-col :span="6"> - <el-card shadow="always"> - <img style="width: 200px;height: 50px; margin-left: 40px; margin-top: 0px" src="@/assets/logo/jcdm2.png" alt="dark"> - <span style="margin-left: 66px; font-weight: bold">{{currentTime}}</span> + <el-card shadow="always" class="boxSize"> + <div class="centerImg"> + <img style="width: 140px;height: 30px;" src="@/assets/logo/jcdm2.png" alt="dark"> +<!-- <span class="nextLine" style="font-weight: bold">{{currentTime}}</span>--> + </div> + </el-card> </el-col> <el-col :span="3"> - <el-card shadow="always"> - <span class="centerText" style="margin-top: 26px">{{productCode}}</span> + <el-card shadow="always" class="boxSize"> + <span class="centerText" style="height: 60px">{{locationCode}}</span> </el-card> </el-col> <el-col :span="15"> - <el-card shadow="always"> - <span class="centerText">{{locationName}}</span> + <el-card shadow="always" class="boxSize"> + <span class="centerText" >{{locationName}}</span> </el-card> </el-col> </el-row> <el-row :gutter="3" style="margin-top: 5px"> <el-col :span="6"> - <div style="height: 600px;overflow: auto;"> - <div class="container" style="height: 50px;background-color: #00afff;margin-bottom: 10px"> + <div style="height: 550px;overflow: auto;"> + <div class="container" style="height: 50px;background-color: #00afff;margin-bottom: 5px"> <span class="centered">浣滀笟娴佺▼</span> </div> - <div v-for="(item,index) in tableData" :key="item.sort" class="outerDiv" :id="'outerDiv'+index"> + <div v-for="(item,index) in tableData" :key="item.index" class="outerDiv" :id="'outerDiv'+index"> <div class="innerDiv1"> <div class="innerDiv2"> <span class="content_left">{{ index+1 }}</span> @@ -35,51 +38,77 @@ </div> </el-col> <el-col :span="18"> - <el-col :span="20"> - <el-card style="height: 600px" shadow="always"> - <el-row style="height: 100px"> - <span style="color: #31b431;font-size: 30px;font-weight: bold">{{address}}</span> + <el-col :span="18"> + <el-card style="height: 550px" shadow="always"> + <el-row style="height: 60px"> + <span style="color: #31b431;font-size: 20px;font-weight: bold">{{address}}</span> </el-row> - <el-row style="height: 400px"> - <el-image style="height: 390px;width: 960px" :src="src"></el-image> + <el-row style="height: 420px"> + <div class="centerImg"> + <el-image style="height: 400px;width: 400px;" :src="src"></el-image> + </div> + <!-- {{src}}--> </el-row> - <el-row style="height: 100px"> - <el-button type="primary" @click="backClick()" style="height: 50px; width: 130px; font-size: 20px; float: left" icon="el-icon-d-arrow-left">涓婁竴姝�</el-button> - <el-button type="primary" @click="nextStep()" style="height: 50px; width: 130px; font-size: 20px; float: right">涓嬩竴姝�<i class="el-icon-d-arrow-right"></i></el-button> + <el-row style="height: 100%;width: 100%"> + <el-button type="primary" @click="backClick()" style="height: 50%; width: 20%; font-size: 20%; float: left" icon="el-icon-d-arrow-left">涓婁竴姝�</el-button> + <el-button type="primary" @click="nextStep()" style="height: 50%; width: 20%; font-size: 20%; float: right">涓嬩竴姝�<i class="el-icon-d-arrow-right"></i></el-button> </el-row> </el-card> </el-col> - <el-col :span="4"> - <el-card style="height: 600px" shadow="always"> - <el-row style="height: 100px;margin-top: 100px"> - <el-button type="primary" @click="processDocuments()" style="height: 50px; width: 130px; font-size: 20px; float: left" icon="el-icon-folder-opened">宸ヨ壓鏂囦欢</el-button> + <el-col :span="6"> + <el-card style="height: 550px;width: 100%" shadow="always"> + <el-row > + <div class="centerImg" style="height: 30%; margin-top: 60%"> + <el-button type="primary" @click="processDocuments()" style="height: 40%; width: 90%; font-size: 70%; float: left" icon="el-icon-folder-opened">宸ヨ壓鏂囦欢</el-button> + </div> + </el-row> - <el-row style="height: 80px;margin-top: 5px"> - <el-button type="success" @click="changeProducts('2V91')" style="height: 50px; width: 130px; font-size: 20px; float: left" icon="el-icon-s-unfold">2V91</el-button> + <el-row style="height: 30%;margin-top: 40%" class="centerImg"> + <el-button type="info" @click="changeProducts('2V91')" :class="{ 'active': isClickd === '2V91' }" style="height: 40%; width: 80%; font-size: 70%; float: left" icon="el-icon-s-unfold">2V91</el-button> </el-row> - <el-row style="height: 80px;"> - <el-button type="info" @click="changeProducts('191')" style="height: 50px; width: 130px; font-size: 20px; float: left" icon="el-icon-s-unfold">191</el-button> + <el-row style="height: 30%;margin-top: 5%" class="centerImg"> + <el-button type="info" @click="changeProducts('191')" :class="{ 'active': isClickd === '191' }" style="height: 40%; width: 80%; font-size: 70%; float: left" icon="el-icon-s-unfold">191</el-button> </el-row> - <el-row style="height: 80px;"> - <el-button type="info" @click="changeProducts('0JWF')" style="height: 50px; width: 130px; font-size: 20px; float: left" icon="el-icon-s-unfold">0JWF</el-button> + <el-row style="height: 30%;margin-top: 5%" class="centerImg"> + <el-button type="info" @click="changeProducts('0JWF')" :class="{ 'active': isClickd === '0JWF' }" style="height: 40%; width: 80%; font-size: 70%; float: left" icon="el-icon-s-unfold">0JWF</el-button> </el-row> </el-card> </el-col> </el-col> </el-row> + <div> + <el-dialog + title="宸ヨ壓鏂囦欢" + :visible.sync="dialogVisible" + width="70%" + @close="closeMethod" + + > + <div><el-image style="height: 1090px;width: 960px;margin-left: 33px" :src="mainProcessSrc"></el-image></div> + <span slot="footer" class="dialog-footer"> + <el-button type="primary" @click="dialogVisible = false" style="margin-right: 80px">纭� 瀹�</el-button> + </span> + </el-dialog> + </div> </div> + </template> <script> -import {listFormulaChild} from "@/api/main/bs/formulaChild/formulaChild"; +import {getMainProductProcess, getProductProcess} from "@/api/main/bs/formulaChild/formulaChild"; import {listStationConf,getIp} from "@/api/main/sc/stationConf"; export default { name: "index", data() { return { + dialogVisible: false, + mainProcessSrc: '', + mainProcess: [], + isClickd: '', // 鍒濆鍖栦负鏈偣鍑荤姸鎬� + locationCode: "鏈厤缃�", locationName: "鏈厤缃伐浣�", queryParams: { pageNum: 1, @@ -146,7 +175,8 @@ }, mounted() { this.getStationConf() - this.changeProducts(this.productCode) + // this.changeProducts(this.productCode) + // this.changeProducts("2V91") this.getNowTime() // this.autoShow() }, @@ -162,8 +192,16 @@ } listStationConf(queryParams).then(response => { this.locationName = response.rows[0].processesName + this.locationCode = response.rows[0].processesCode + console.log('llllll',this.locationCode) + this.changeProducts("2V91") }); + }); + + }, + closeMethod(){ + this.mainProcessSrc = '' }, //鑾峰彇褰撳墠鏃堕棿 getNowTime () { @@ -194,6 +232,10 @@ setImg(index) { this.address = this.tableData[index].address this.src = this.tableData[index].img + }, + cleanImg(){ + this.address = '' + this.src = '' }, setBg() { if (document.getElementById('outerDiv' + (this.tableData.length - 1)).style.background === 'yellow') { @@ -230,20 +272,31 @@ this.getUpOrDown(1) }, processDocuments(){ - + getMainProductProcess(this.queryParams).then(res => { + this.mainProcess = res.rows + if (res.rows!=null && res.rows.length>0){ + this.mainProcessSrc = res.rows[0].img + } + }) + this.dialogVisible = true }, changeProducts(val){ + console.log("------鏇存崲鍥剧墖",val) + console.log("------鐩綍==============",this.tableData) + console.log("locationCode",this.locationCode) this.productCode = val const _this = this + this.isClickd = val; // 鍒囨崲isClicked鐨勫�� /** 鏌ヨ閰嶆柟閰嶇疆瀛愪俊鎭垪琛� */ this.queryParams.productCode = val; - listFormulaChild(this.queryParams).then(response => { - // this.tableData = []; + this.queryParams.processesCode = this.locationCode + getProductProcess(this.queryParams).then(response => { + this.tableData = []; + this.cleanImg() this.tableData = response.rows; - console.log(response.rows) this.$nextTick(() => { clearInterval(this.intervalId); document.getElementById('outerDiv0').style.background = 'yellow' @@ -266,8 +319,8 @@ width: fit-content; min-width: 102%; /*width: 300px;*/ - height: 50px; - margin-bottom: 10px; + height: 30px; + margin-bottom: 5px; } .innerDiv1 { @@ -295,6 +348,7 @@ white-space: nowrap; padding-left: 5px; padding-right: 5px; + font-size: 20px; } .container { display: flex; @@ -312,14 +366,34 @@ .centerText{ color: black; font-weight: bold; - font-size: 40px; + font-size: 20px; display: flex; justify-content: center; - margin-top: 20px + margin-top: 5px } -::v-deep .el-card__body{ - height: 100px; +.active { + background-color: #31b431; /* 鐐瑰嚮鍚庣殑鑳屾櫙鑹� */ } - +::v-deep .el-dialog { + height: 90%; + overflow-y: auto; +} +::v-deep .el-dialog__footer{ + margin-top: 10px; +} +::v-deep .el-card .is-always-shadow{ + height: 60px; +} +.boxSize{ + height: 60px; +} +.nextLine{ + display: block; +} +.centerImg{ + display: flex; + justify-content: center; + align-items: center; +} </style> -- Gitblit v1.9.3