From 045e502fa06255c7ebe1ad6bb4ff503825006cbe Mon Sep 17 00:00:00 2001 From: zmc <zmc_li@foxmail.com> Date: 星期二, 14 十一月 2023 14:55:56 +0800 Subject: [PATCH] 去除ts --- src/views/exception/FlightInspection.vue | 921 +++++++++++++++++++++++++++++++-------------------------- 1 files changed, 496 insertions(+), 425 deletions(-) diff --git a/src/views/exception/FlightInspection.vue b/src/views/exception/FlightInspection.vue index 139b4ad..8ea6552 100644 --- a/src/views/exception/FlightInspection.vue +++ b/src/views/exception/FlightInspection.vue @@ -18,7 +18,7 @@ DustLineChart, ButtonClick, AreaAndmonitorType, - AnalysisCard, + AnalysisCard }, data() { return { @@ -48,14 +48,14 @@ // 鏌ヨ鎸夐挳鏃犳暟鎹椂 isNoData: { - exception0:true, - exception1:true, - exception2:true, - exception3:true, - exception4:true, - exception5:true, - exception6:true, - exception7:true, + exception0: true, + exception1: true, + exception2: true, + exception3: true, + exception4: true, + exception5: true, + exception6: true, + exception7: true }, // eslint-disable-next-line no-undef // 瀵硅瘽妗嗘樉绀� @@ -131,8 +131,7 @@ banTouch: 0, // 0浠h〃鍒嗛〉锛�1浠h〃涓嶅垎椤� originClick: 0 - }, - + } } }, setup() { @@ -168,7 +167,7 @@ // } // 澶勪簬琛ㄦ牸鐨勬渶鍚庝竴鏉℃暟鎹� 璁剧疆鈥樹笂涓�鏉♀�欐寜閽笉鍙偣 if (newVaue === 0) { - this.dialog.isPreCantouch = true + this.dialog.isPreCantouch = true //鐢ㄦ埛鍏堢偣浜嗙涓�鏉★紝pre涓簍rue,鐒跺悗鐐瑰嚮鏈�鍚庝竴鏉�,next涓簍rue銆傛鏃朵袱涓寜閽兘琚皝閿� if (this.dialog.isNextCantouch == true) { this.dialog.isNextCantouch = false @@ -202,7 +201,8 @@ }, computed: { exceptionAllNum() { - let sum = this.exception.exception0Num + + let sum = + this.exception.exception0Num + this.exception.exception1Num + this.exception.exception2Num + this.exception.exception3Num + @@ -210,14 +210,15 @@ this.exception.exception5Num + this.exception.exception6Num + this.exception.exception7Num - if(sum == 0){ + if (sum == 0) { return 1 - }else { + } else { return sum } }, - long_time_notchange(){ - let sum = this.exception.exception0Num + + long_time_notchange() { + let sum = + this.exception.exception0Num + this.exception.exception1Num + this.exception.exception2Num + this.exception.exception3Num + @@ -225,116 +226,102 @@ this.exception.exception5Num + this.exception.exception6Num + this.exception.exception7Num - if(sum ==0){ + if (sum == 0) { return 0 - }else{ + } else { return ( - 100 - - (this.exception.exception0Num / - this.exceptionAllNum) * - 100 - - (this.exception.exception1Num / - this.exceptionAllNum) * - 100 - - (this.exception.exception2Num / - this.exceptionAllNum) * - 100 - - (this.exception.exception4Num / - this.exceptionAllNum) * - 100 - - (this.exception.exception5Num / - this.exceptionAllNum) * - 100 - - (this.exception.exception6Num / - this.exceptionAllNum) * - 100 - - (this.exception.exception7Num / - this.exceptionAllNum) * - 100 - ).toFixed(1) + 100 - + (this.exception.exception0Num / this.exceptionAllNum) * 100 - + (this.exception.exception1Num / this.exceptionAllNum) * 100 - + (this.exception.exception2Num / this.exceptionAllNum) * 100 - + (this.exception.exception4Num / this.exceptionAllNum) * 100 - + (this.exception.exception5Num / this.exceptionAllNum) * 100 - + (this.exception.exception6Num / this.exceptionAllNum) * 100 - + (this.exception.exception7Num / this.exceptionAllNum) * 100 + ).toFixed(1) } }, // 绗竴鎺掑崱鐗� - cardRow1(){ + cardRow1() { return [ { - siteName:this.exception.exception4, - exceptionType:'4', - exceptionName:'閲忕骇绐佸彉', - iconSrc:'@/assets/exception/exception4.png', - siteNum:this.exception.exception4.length, - exceptionNum:this.exception.exception4Num, - isNoDataStatus:this.isNoData.exception4 + siteName: this.exception.exception4, + exceptionType: '4', + exceptionName: '閲忕骇绐佸彉', + iconSrc: '@/assets/exception/exception4.png', + siteNum: this.exception.exception4.length, + exceptionNum: this.exception.exception4Num, + isNoDataStatus: this.isNoData.exception4 }, { - siteName:this.exception.exception5, - exceptionType:'5', - exceptionName:'涓磋繎瓒呮爣寮傚父', - iconSrc:'@/assets/exception/exception5.png', - siteNum:this.exception.exception5.length, - exceptionNum:this.exception.exception5Num, - isNoDataStatus:this.isNoData.exception5 + siteName: this.exception.exception5, + exceptionType: '5', + exceptionName: '涓磋繎瓒呮爣寮傚父', + iconSrc: '@/assets/exception/exception5.png', + siteNum: this.exception.exception5.length, + exceptionNum: this.exception.exception5Num, + isNoDataStatus: this.isNoData.exception5 }, { - siteName:this.exception.exception6, - exceptionType:'6', - exceptionName:'鍗曟棩瓒呮爣娆℃暟涓寸晫寮傚父', - iconSrc:'@/assets/exception/exception6.png', - siteNum:this.exception.exception6.length, - exceptionNum:this.exception.exception6Num, - isNoDataStatus:this.isNoData.exception6 + siteName: this.exception.exception6, + exceptionType: '6', + exceptionName: '鍗曟棩瓒呮爣娆℃暟涓寸晫寮傚父', + iconSrc: '@/assets/exception/exception6.png', + siteNum: this.exception.exception6.length, + exceptionNum: this.exception.exception6Num, + isNoDataStatus: this.isNoData.exception6 }, { - siteName:this.exception.exception7, - exceptionType:'7', - exceptionName:'鍙樺寲瓒嬪娍寮傚父', - iconSrc:'@/assets/exception/exception7.png', - siteNum:this.exception.exception7.length, - exceptionNum:this.exception.exception7Num, - isNoDataStatus:this.isNoData.exception7 + siteName: this.exception.exception7, + exceptionType: '7', + exceptionName: '鍙樺寲瓒嬪娍寮傚父', + iconSrc: '@/assets/exception/exception7.png', + siteNum: this.exception.exception7.length, + exceptionNum: this.exception.exception7Num, + isNoDataStatus: this.isNoData.exception7 } ] - }, - cardRow2(){ - return [ - { - siteName:this.exception.exception0, - exceptionType:'0', - exceptionName:'鏁版嵁缂哄け寮傚父', - iconSrc:'@/assets/exception/exception0.png', - siteNum:this.exception.exception0.length, - exceptionNum:this.exception.exception0Num, - isNoDataStatus:this.isNoData.exception0 + }, + cardRow2() { + return [ + { + siteName: this.exception.exception0, + exceptionType: '0', + exceptionName: '鏁版嵁缂哄け寮傚父', + iconSrc: '@/assets/exception/exception0.png', + siteNum: this.exception.exception0.length, + exceptionNum: this.exception.exception0Num, + isNoDataStatus: this.isNoData.exception0 }, { - siteName:this.exception.exception1, - exceptionType:'1', - exceptionName:'鏁版嵁瓒呬綆', - iconSrc:'@/assets/exception/exception1.png', - siteNum:this.exception.exception1.length, - exceptionNum:this.exception.exception1Num, - isNoDataStatus:this.isNoData.exception1 + siteName: this.exception.exception1, + exceptionType: '1', + exceptionName: '鏁版嵁瓒呬綆', + iconSrc: '@/assets/exception/exception1.png', + siteNum: this.exception.exception1.length, + exceptionNum: this.exception.exception1Num, + isNoDataStatus: this.isNoData.exception1 }, { - siteName:this.exception.exception2, - exceptionType:'2', - exceptionName:'瓒呮爣', - iconSrc:'@/assets/exception/exception2.png', - siteNum:this.exception.exception2.length, - exceptionNum:this.exception.exception2Num, - isNoDataStatus:this.isNoData.exception2 + siteName: this.exception.exception2, + exceptionType: '2', + exceptionName: '瓒呮爣', + iconSrc: '@/assets/exception/exception2.png', + siteNum: this.exception.exception2.length, + exceptionNum: this.exception.exception2Num, + isNoDataStatus: this.isNoData.exception2 }, { - siteName:this.exception.exception3, - exceptionType:'3', - exceptionName:'鏁版嵁闀挎椂娈垫棤娉㈠姩', - iconSrc:'@/assets/exception/exception3.png', - siteNum:this.exception.exception3.length, - exceptionNum:this.exception.exception3Num, - isNoDataStatus:this.isNoData.exception3 - }, + siteName: this.exception.exception3, + exceptionType: '3', + exceptionName: '鏁版嵁闀挎椂娈垫棤娉㈠姩', + iconSrc: '@/assets/exception/exception3.png', + siteNum: this.exception.exception3.length, + exceptionNum: this.exception.exception3Num, + isNoDataStatus: this.isNoData.exception3 + } ] - } + } }, mounted() { this.backExceptionDataAWeekAgo() @@ -344,8 +331,8 @@ }, methods: { - getImageUrl(name){ - return new URL(`../../lib/Carousel/assets/${name}`, import.meta.url).href + getImageUrl(name) { + return new URL(`../../lib/Carousel/assets/${name}`, import.meta.url).href }, // 鏀惧洖绔欑偣鎬绘暟閲� getSiteNume() { @@ -457,12 +444,12 @@ case '0': this.dialog.option = { title: { - text: this.tableCurrentRowData.exception, - left: '1%', - textStyle:{ - fontSize:14 - } - }, + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle: { + fontSize: 14 + } + }, tooltip: {}, toolbox: { // 宸ュ叿鏍� @@ -518,12 +505,12 @@ case '2': this.dialog.option = { title: { - text: this.tableCurrentRowData.exception, - left: '1%', - textStyle:{ - fontSize:14 - } - }, + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle: { + fontSize: 14 + } + }, tooltip: {}, toolbox: { // 宸ュ叿鏍� @@ -637,12 +624,12 @@ case '1': this.dialog.option = { title: { - text: this.tableCurrentRowData.exception, - left: '1%', - textStyle:{ - fontSize:14 - } - }, + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle: { + fontSize: 14 + } + }, tooltip: {}, toolbox: { // 宸ュ叿鏍� @@ -736,16 +723,16 @@ } } break - // 鏁版嵁闀挎椂娈垫棤娉㈠姩 + // 鏁版嵁闀挎椂娈垫棤娉㈠姩 case '3': this.dialog.option = { title: { - text: this.tableCurrentRowData.exception, - left: '1%', - textStyle:{ - fontSize:14 - } - }, + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle: { + fontSize: 14 + } + }, tooltip: {}, toolbox: { // 宸ュ叿鏍� @@ -835,12 +822,12 @@ case '7': this.dialog.option = { title: { - text: this.tableCurrentRowData.exception, - left: '1%', - textStyle:{ - fontSize:14 - } - }, + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle: { + fontSize: 14 + } + }, tooltip: {}, toolbox: { // 宸ュ叿鏍� @@ -938,7 +925,7 @@ beforeAndAfterTime[0], beforeAndAfterTime[3] ) - + // 灏嗗紓甯告暟鎹繘琛岄澶勭悊锛岄殢鍚庡皢缁撴灉浣滀负鎶樼嚎鍥剧殑閰嶇疆椤� this.otherExceptionRequest( paramsAllTime, @@ -1045,11 +1032,11 @@ }) .then((result) => { this.exception.exception0 = result.data.data - if(result.data.data.length ==0 ){ - this.isNoData.exception0=true + if (result.data.data.length == 0) { + this.isNoData.exception0 = true return } - this.isNoData.exception0=false + this.isNoData.exception0 = false }) this.$http .get('/dust/sitenamecode', { @@ -1061,11 +1048,11 @@ }) .then((result) => { this.exception.exception1 = result.data.data - if(result.data.data.length == 0 ){ - this.isNoData.exception1=true + if (result.data.data.length == 0) { + this.isNoData.exception1 = true return } - this.isNoData.exception1=false + this.isNoData.exception1 = false }) this.$http .get('/dust/sitenamecode', { @@ -1077,11 +1064,11 @@ }) .then((result) => { this.exception.exception2 = result.data.data - if(result.data.data.length ==0 ){ - this.isNoData.exception2=true + if (result.data.data.length == 0) { + this.isNoData.exception2 = true return } - this.isNoData.exception2=false + this.isNoData.exception2 = false }) this.$http @@ -1094,11 +1081,11 @@ }) .then((result) => { this.exception.exception3 = result.data.data - if(result.data.data.length ==0 ){ - this.isNoData.exception3=true + if (result.data.data.length == 0) { + this.isNoData.exception3 = true return } - this.isNoData.exception3=false + this.isNoData.exception3 = false }) this.$http @@ -1111,11 +1098,11 @@ }) .then((result) => { this.exception.exception4 = result.data.data - if(result.data.data.length ==0 ){ - this.isNoData.exception4=true + if (result.data.data.length == 0) { + this.isNoData.exception4 = true return } - this.isNoData.exception4=false + this.isNoData.exception4 = false }) this.$http .get('/dust/sitenamecode', { @@ -1127,11 +1114,11 @@ }) .then((result) => { this.exception.exception5 = result.data.data - if(result.data.data.length ==0 ){ - this.isNoData.exception5=true + if (result.data.data.length == 0) { + this.isNoData.exception5 = true return } - this.isNoData.exception5=false + this.isNoData.exception5 = false }) this.$http .get('/dust/sitenamecode', { @@ -1143,13 +1130,13 @@ }) .then((result) => { this.exception.exception6 = result.data.data - if(result.data.data.length ==0 ){ - this.isNoData.exception6=true + if (result.data.data.length == 0) { + this.isNoData.exception6 = true return } - this.isNoData.exception6=false + this.isNoData.exception6 = false }) - this.$http + this.$http .get('/dust/sitenamecode', { params: { exceptionType: '7', @@ -1159,13 +1146,12 @@ }) .then((result) => { this.exception.exception7 = result.data.data - if(result.data.data.length ==0 ){ - this.isNoData.exception7=true + if (result.data.data.length == 0) { + this.isNoData.exception7 = true return } - this.isNoData.exception7=false + this.isNoData.exception7 = false }) - /* 寮傚父寮傚父鏁伴噺 */ this.$http @@ -1178,7 +1164,6 @@ }) .then((result) => { this.exception.exception0Num = result.data.data - }) this.$http .get('/dust/exceptionnum', { @@ -1248,7 +1233,7 @@ .then((result) => { this.exception.exception6Num = result.data.data }) - this.$http + this.$http .get('/dust/exceptionnum', { params: { exceptionType: '7', @@ -1259,9 +1244,6 @@ .then((result) => { this.exception.exception7Num = result.data.data }) - - - }, /** @@ -1362,7 +1344,6 @@ this.total = response.data.data.total // 绉婚櫎绌烘暟鎹姸鎬� }) - }, /** @@ -1393,7 +1374,6 @@ } this.isTableShow = true this.total = response.data.data.total - }) }, @@ -1458,188 +1438,285 @@ </script> <template> -<div class="all-container"> - <el-row ref="h1" > - <el-col> - <el-form :inline="true"> - <div class="head-container-text"> - <el-form-item> - <AreaAndmonitorType></AreaAndmonitorType> - </el-form-item> + <div class="all-container"> + <el-row ref="h1"> + <el-col> + <el-form :inline="true"> + <div class="head-container-text"> + <el-form-item> + <AreaAndmonitorType></AreaAndmonitorType> + </el-form-item> - <el-form-item> - <TimeShortCuts - timeType="day" - @submit-time="giveTime" - ></TimeShortCuts> - </el-form-item > + <el-form-item> + <TimeShortCuts timeType="day" @submit-time="giveTime"></TimeShortCuts> + </el-form-item> - <el-form-item> - <ButtonClick - content="椋庨櫓璇勪及" - type="warning" - color="rgb(12,104,165)" - :loading="loading.queryButton" - :havaIcon="false" - @do-search="handleSubmit" - ><img src="@/assets/exception/riskButton.png" height="24" class="img-button"></ButtonClick> - - </el-form-item> - - </div> - - </el-form> - </el-col> - </el-row> - -<!-- 鏃堕棿鎽樿 --> - <el-row class="head-describtion-text" ref="h2"> - <el-row> - <span> 閲戝北鍖� {{ beginTime }} 鈥斺�� {{ endTime }} 鎵皹鐩戞祴寮傚父淇℃伅姹囨��</span> + <el-form-item> + <ButtonClick + content="椋庨櫓璇勪及" + type="warning" + color="rgb(12,104,165)" + :loading="loading.queryButton" + :havaIcon="false" + @do-search="handleSubmit" + ><img src="@/assets/exception/riskButton.png" height="24" class="img-button" + /></ButtonClick> + </el-form-item> + </div> + </el-form> + </el-col> </el-row> - </el-row> - <!-- 寮傚父鍒嗘瀽 --> - <el-row ref="h3"> - <el-col> - <el-card class="card-container"> - <template #header> - <div class="card-header">寮傚父鍒嗘瀽</div> - </template> + <!-- 鏃堕棿鎽樿 --> + <el-row class="head-describtion-text" ref="h2"> + <el-row> + <span> 閲戝北鍖� {{ beginTime }} 鈥斺�� {{ endTime }} 鎵皹鐩戞祴寮傚父淇℃伅姹囨��</span> + </el-row> + </el-row> - <el-row :gutter="20" class="card-row"> - <el-col :span="6"> - <AnalysisCard :site-name="cardRow1[0].siteName" :exception-type="cardRow1[0].exceptionType" :begin-time="beginTime" :end-time="endTime" :exception-name="cardRow1[0].exceptionName" :site-num="cardRow1[0].siteNum" :exception-num="cardRow1[0].exceptionNum" :exception-all-num="exceptionAllNum" :site-num-all="siteTotal" :isNoDataStatus="cardRow1[0].isNoDataStatus" @get-abnormal-data-by-click="getAbnormalDataByClick"> - <img src="@/assets/exception/exception4.png" height="24" width="24"> - </AnalysisCard> - </el-col> - <el-col :span="6"> - <AnalysisCard :site-name="cardRow1[1].siteName" :exception-type="cardRow1[1].exceptionType" :begin-time="beginTime" :end-time="endTime" :exception-name="cardRow1[1].exceptionName" :site-num="cardRow1[1].siteNum" :exception-num="cardRow1[1].exceptionNum" :exception-all-num="exceptionAllNum" :site-num-all="siteTotal" :isNoDataStatus="cardRow1[1].isNoDataStatus" @get-abnormal-data-by-click="getAbnormalDataByClick"> - <img src="@/assets/exception/exception5.png" height="24" width="24"> - </AnalysisCard> - </el-col> - <el-col :span="6"> - <AnalysisCard :site-name="cardRow1[2].siteName" :exception-type="cardRow1[2].exceptionType" :begin-time="beginTime" :end-time="endTime" :exception-name="cardRow1[2].exceptionName" :site-num="cardRow1[2].siteNum" :exception-num="cardRow1[2].exceptionNum" :exception-all-num="exceptionAllNum" :site-num-all="siteTotal" :isNoDataStatus="cardRow1[2].isNoDataStatus" @get-abnormal-data-by-click="getAbnormalDataByClick"> - <img src="@/assets/exception/exception6.png" height="24" width="24"> - </AnalysisCard> - </el-col> - <el-col :span="6"> - <AnalysisCard :site-name="cardRow1[3].siteName" :exception-type="cardRow1[3].exceptionType" :begin-time="beginTime" :end-time="endTime" :exception-name="cardRow1[3].exceptionName" :site-num="cardRow1[3].siteNum" :exception-num="cardRow1[3].exceptionNum" :exception-all-num="exceptionAllNum" :site-num-all="siteTotal" :isNoDataStatus="cardRow1[3].isNoDataStatus" @get-abnormal-data-by-click="getAbnormalDataByClick"> - <img src="@/assets/exception/exception7.png" height="24" width="24"> - </AnalysisCard> - </el-col> - </el-row> - - <el-row :gutter="20"> - <el-col :span="6" > - <AnalysisCard :site-name="cardRow2[0].siteName" :exception-type="cardRow2[0].exceptionType" :begin-time="beginTime" :end-time="endTime" :exception-name="cardRow2[0].exceptionName" :site-num="cardRow2[0].siteNum" :exception-num="cardRow2[0].exceptionNum" :exception-all-num="exceptionAllNum" :site-num-all="siteTotal" :isNoDataStatus="cardRow2[0].isNoDataStatus" @get-abnormal-data-by-click="getAbnormalDataByClick"> - <img src="@/assets/exception/exception0.png" height="24" width="24"> - </AnalysisCard> - </el-col> - <el-col :span="6" > - <AnalysisCard :site-name="cardRow2[1].siteName" :exception-type="cardRow2[1].exceptionType" :begin-time="beginTime" :end-time="endTime" :exception-name="cardRow2[1].exceptionName" :site-num="cardRow2[1].siteNum" :exception-num="cardRow2[1].exceptionNum" :exception-all-num="exceptionAllNum" :site-num-all="siteTotal" :isNoDataStatus="cardRow2[1].isNoDataStatus" @get-abnormal-data-by-click="getAbnormalDataByClick"> - <img src="@/assets/exception/exception1.png" height="24" width="24"> - </AnalysisCard> - </el-col> - <el-col :span="6" > - <AnalysisCard :site-name="cardRow2[2].siteName" :exception-type="cardRow2[2].exceptionType" :begin-time="beginTime" :end-time="endTime" :exception-name="cardRow2[2].exceptionName" :site-num="cardRow2[2].siteNum" :exception-num="cardRow2[2].exceptionNum" :exception-all-num="exceptionAllNum" :site-num-all="siteTotal" :isNoDataStatus="cardRow2[2].isNoDataStatus" @get-abnormal-data-by-click="getAbnormalDataByClick"> - <img src="@/assets/exception/exception2.png" height="24" width="24"> - </AnalysisCard> - </el-col> - <el-col :span="6" > - <AnalysisCard :site-name="cardRow2[3].siteName" :exception-type="cardRow2[3].exceptionType" :begin-time="beginTime" :end-time="endTime" :exception-name="cardRow2[3].exceptionName" :site-num="cardRow2[3].siteNum" :exception-num="cardRow2[3].exceptionNum" :exception-all-num="exceptionAllNum" :site-num-all="siteTotal" :isNoDataStatus="cardRow2[3].isNoDataStatus" @get-abnormal-data-by-click="getAbnormalDataByClick"> - <img src="@/assets/exception/exception3.png" height="24" width="24"> - </AnalysisCard> - </el-col> - - - </el-row> - - </el-card> - </el-col> - </el-row> - - <el-button-group> - <el-button color="#626aef" plain @click="isTableShow=true" v-show="!isTableShow"> - 鏄剧ず寮傚父娓呭崟<el-icon class="i-ep-Arrow"><i-ep-ArrowUp /></el-icon> - </el-button> - <el-button color="#626aef" plain @click="isTableShow=false" v-show="isTableShow"> - 闅愯棌寮傚父娓呭崟<el-icon class="i-ep-Arrow"><i-ep-ArrowDown /></el-icon> - </el-button> - </el-button-group> - - <!-- 琛ㄦ牸 --> - <el-row v-show="isTableShow"> - <el-col> - - <el-table - ref="table" - :data="displayData" - :height="tableHeight" - :highlight-current-row="true" - size="default" - v-loading="loading.tableLoading" - border - > - <el-table-column - type="index" - label="搴忓彿" - width="60px" - align="center" - fixed - :index="indexMethod1" - /> - <el-table-column prop="name" label="绔欑偣鍚嶇О" show-overflow-tooltip /> - <el-table-column prop="mnCode" label="璁惧缂栧彿" align="center" show-overflow-tooltip /> - <el-table-column prop="exception" label="寮傚父绫诲瀷" align="center" show-overflow-tooltip /> - <el-table-column prop="region" label="鍖哄煙" align="center" show-overflow-tooltip /> - <el-table-column prop="beginTime" label="寮�濮嬫椂闂�" align="center" show-overflow-tooltip /> - <el-table-column prop="endTime" label="缁撴潫鏃堕棿" align="center" show-overflow-tooltip /> - <el-table-column prop="typename" label="鍦烘櫙" align="center" width="82" show-overflow-tooltip /> - <el-table-column prop="address" label="鍦板潃" align="center" show-overflow-tooltip /> - <el-table-column prop="dutyCompany" label="杩愮淮鍟�" align="center" show-overflow-tooltip /> - - <el-table-column label="鎿嶄綔" align="center"> - <template #default="{ row }"> - <el-button type="primary" class="table-button" @click="showDialog(row)" - >鏌ョ湅璇︽儏</el-button - > + <!-- 寮傚父鍒嗘瀽 --> + <el-row ref="h3"> + <el-col> + <el-card class="card-container"> + <template #header> + <div class="card-header">寮傚父鍒嗘瀽</div> </template> - </el-table-column> - </el-table> - <el-pagination - ref="h4" - background - layout="total, sizes, prev, pager, next, jumper" - v-model:current-page="currentPage" - v-model:page-size="pageSize" - :total="total" - :page-sizes="[10, 20, 50, 100]" - @size-change="handleSizeChange" - @current-change="handleCurrentChange" - > - </el-pagination> - </el-col> - </el-row> + <el-row :gutter="20" class="card-row"> + <el-col :span="6"> + <AnalysisCard + :site-name="cardRow1[0].siteName" + :exception-type="cardRow1[0].exceptionType" + :begin-time="beginTime" + :end-time="endTime" + :exception-name="cardRow1[0].exceptionName" + :site-num="cardRow1[0].siteNum" + :exception-num="cardRow1[0].exceptionNum" + :exception-all-num="exceptionAllNum" + :site-num-all="siteTotal" + :isNoDataStatus="cardRow1[0].isNoDataStatus" + @get-abnormal-data-by-click="getAbnormalDataByClick" + > + <img src="@/assets/exception/exception4.png" height="24" width="24" /> + </AnalysisCard> + </el-col> + <el-col :span="6"> + <AnalysisCard + :site-name="cardRow1[1].siteName" + :exception-type="cardRow1[1].exceptionType" + :begin-time="beginTime" + :end-time="endTime" + :exception-name="cardRow1[1].exceptionName" + :site-num="cardRow1[1].siteNum" + :exception-num="cardRow1[1].exceptionNum" + :exception-all-num="exceptionAllNum" + :site-num-all="siteTotal" + :isNoDataStatus="cardRow1[1].isNoDataStatus" + @get-abnormal-data-by-click="getAbnormalDataByClick" + > + <img src="@/assets/exception/exception5.png" height="24" width="24" /> + </AnalysisCard> + </el-col> + <el-col :span="6"> + <AnalysisCard + :site-name="cardRow1[2].siteName" + :exception-type="cardRow1[2].exceptionType" + :begin-time="beginTime" + :end-time="endTime" + :exception-name="cardRow1[2].exceptionName" + :site-num="cardRow1[2].siteNum" + :exception-num="cardRow1[2].exceptionNum" + :exception-all-num="exceptionAllNum" + :site-num-all="siteTotal" + :isNoDataStatus="cardRow1[2].isNoDataStatus" + @get-abnormal-data-by-click="getAbnormalDataByClick" + > + <img src="@/assets/exception/exception6.png" height="24" width="24" /> + </AnalysisCard> + </el-col> + <el-col :span="6"> + <AnalysisCard + :site-name="cardRow1[3].siteName" + :exception-type="cardRow1[3].exceptionType" + :begin-time="beginTime" + :end-time="endTime" + :exception-name="cardRow1[3].exceptionName" + :site-num="cardRow1[3].siteNum" + :exception-num="cardRow1[3].exceptionNum" + :exception-all-num="exceptionAllNum" + :site-num-all="siteTotal" + :isNoDataStatus="cardRow1[3].isNoDataStatus" + @get-abnormal-data-by-click="getAbnormalDataByClick" + > + <img src="@/assets/exception/exception7.png" height="24" width="24" /> + </AnalysisCard> + </el-col> + </el-row> - <!-- 瀵硅瘽妗� --> - <el-dialog - class="exception-dialog" - v-model="dialogTableVisible" - draggable - align-center - height="700px" - width="700px" - > - <!-- 澶� --> - <template #header> - <div class="diag-head"> - <div class="diag-head-text"> - <div><span class="diag-head-text1">绔欑偣鍚嶇О锛�</span>{{ tableCurrentRowData.name }}</div> - <div><span class="diag-head-text1">璁惧缂栧彿锛�</span>{{ tableCurrentRowData.mnCode }}</div> - <div><span class="diag-head-text1">杩愮淮鍟嗭細</span>{{ tableCurrentRowData.dutyCompany }}</div> - <!-- <div> + <el-row :gutter="20"> + <el-col :span="6"> + <AnalysisCard + :site-name="cardRow2[0].siteName" + :exception-type="cardRow2[0].exceptionType" + :begin-time="beginTime" + :end-time="endTime" + :exception-name="cardRow2[0].exceptionName" + :site-num="cardRow2[0].siteNum" + :exception-num="cardRow2[0].exceptionNum" + :exception-all-num="exceptionAllNum" + :site-num-all="siteTotal" + :isNoDataStatus="cardRow2[0].isNoDataStatus" + @get-abnormal-data-by-click="getAbnormalDataByClick" + > + <img src="@/assets/exception/exception0.png" height="24" width="24" /> + </AnalysisCard> + </el-col> + <el-col :span="6"> + <AnalysisCard + :site-name="cardRow2[1].siteName" + :exception-type="cardRow2[1].exceptionType" + :begin-time="beginTime" + :end-time="endTime" + :exception-name="cardRow2[1].exceptionName" + :site-num="cardRow2[1].siteNum" + :exception-num="cardRow2[1].exceptionNum" + :exception-all-num="exceptionAllNum" + :site-num-all="siteTotal" + :isNoDataStatus="cardRow2[1].isNoDataStatus" + @get-abnormal-data-by-click="getAbnormalDataByClick" + > + <img src="@/assets/exception/exception1.png" height="24" width="24" /> + </AnalysisCard> + </el-col> + <el-col :span="6"> + <AnalysisCard + :site-name="cardRow2[2].siteName" + :exception-type="cardRow2[2].exceptionType" + :begin-time="beginTime" + :end-time="endTime" + :exception-name="cardRow2[2].exceptionName" + :site-num="cardRow2[2].siteNum" + :exception-num="cardRow2[2].exceptionNum" + :exception-all-num="exceptionAllNum" + :site-num-all="siteTotal" + :isNoDataStatus="cardRow2[2].isNoDataStatus" + @get-abnormal-data-by-click="getAbnormalDataByClick" + > + <img src="@/assets/exception/exception2.png" height="24" width="24" /> + </AnalysisCard> + </el-col> + <el-col :span="6"> + <AnalysisCard + :site-name="cardRow2[3].siteName" + :exception-type="cardRow2[3].exceptionType" + :begin-time="beginTime" + :end-time="endTime" + :exception-name="cardRow2[3].exceptionName" + :site-num="cardRow2[3].siteNum" + :exception-num="cardRow2[3].exceptionNum" + :exception-all-num="exceptionAllNum" + :site-num-all="siteTotal" + :isNoDataStatus="cardRow2[3].isNoDataStatus" + @get-abnormal-data-by-click="getAbnormalDataByClick" + > + <img src="@/assets/exception/exception3.png" height="24" width="24" /> + </AnalysisCard> + </el-col> + </el-row> + </el-card> + </el-col> + </el-row> + + <el-button-group> + <el-button color="#626aef" plain @click="isTableShow = true" v-show="!isTableShow"> + 鏄剧ず寮傚父娓呭崟<el-icon class="i-ep-Arrow"><i-ep-ArrowUp /></el-icon> + </el-button> + <el-button color="#626aef" plain @click="isTableShow = false" v-show="isTableShow"> + 闅愯棌寮傚父娓呭崟<el-icon class="i-ep-Arrow"><i-ep-ArrowDown /></el-icon> + </el-button> + </el-button-group> + + <!-- 琛ㄦ牸 --> + <el-row v-show="isTableShow"> + <el-col> + <el-table + ref="table" + :data="displayData" + :height="tableHeight" + :highlight-current-row="true" + size="default" + v-loading="loading.tableLoading" + border + > + <el-table-column + type="index" + label="搴忓彿" + width="60px" + align="center" + fixed + :index="indexMethod1" + /> + <el-table-column prop="name" label="绔欑偣鍚嶇О" show-overflow-tooltip /> + <el-table-column prop="mnCode" label="璁惧缂栧彿" align="center" show-overflow-tooltip /> + <el-table-column prop="exception" label="寮傚父绫诲瀷" align="center" show-overflow-tooltip /> + <el-table-column prop="region" label="鍖哄煙" align="center" show-overflow-tooltip /> + <el-table-column prop="beginTime" label="寮�濮嬫椂闂�" align="center" show-overflow-tooltip /> + <el-table-column prop="endTime" label="缁撴潫鏃堕棿" align="center" show-overflow-tooltip /> + <el-table-column + prop="typename" + label="鍦烘櫙" + align="center" + width="82" + show-overflow-tooltip + /> + <el-table-column prop="address" label="鍦板潃" align="center" show-overflow-tooltip /> + <el-table-column prop="dutyCompany" label="杩愮淮鍟�" align="center" show-overflow-tooltip /> + + <el-table-column label="鎿嶄綔" align="center"> + <template #default="{ row }"> + <el-button type="primary" class="table-button" @click="showDialog(row)" + >鏌ョ湅璇︽儏</el-button + > + </template> + </el-table-column> + </el-table> + + <el-pagination + ref="h4" + background + layout="total, sizes, prev, pager, next, jumper" + v-model:current-page="currentPage" + v-model:page-size="pageSize" + :total="total" + :page-sizes="[10, 20, 50, 100]" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + > + </el-pagination> + </el-col> + </el-row> + + <!-- 瀵硅瘽妗� --> + <el-dialog + class="exception-dialog" + v-model="dialogTableVisible" + draggable + align-center + height="700px" + width="700px" + > + <!-- 澶� --> + <template #header> + <div class="diag-head"> + <div class="diag-head-text"> + <div><span class="diag-head-text1">绔欑偣鍚嶇О锛�</span>{{ tableCurrentRowData.name }}</div> + <div> + <span class="diag-head-text1">璁惧缂栧彿锛�</span>{{ tableCurrentRowData.mnCode }} + </div> + <div> + <span class="diag-head-text1">杩愮淮鍟嗭細</span>{{ tableCurrentRowData.dutyCompany }} + </div> + <!-- <div> <span class="diag-head-text1">寮傚父绫诲瀷锛�</span> <span v-if="tableCurrentRowData.exceptionType == '0'">鏁版嵁缂哄け寮傚父</span> <span v-else-if="tableCurrentRowData.exceptionType == '1'">鏁版嵁瓒呬綆</span> @@ -1651,13 +1728,13 @@ <span v-else-if="tableCurrentRowData.exceptionType == '7'">婊戝姩骞冲潎鍊煎紓甯�</span> </div> --> - <div> - <span class="diag-head-text1">寮傚父鏃堕棿娈碉細</span>{{ tableCurrentRowData.beginTime }} ~ - {{ tableCurrentRowData.endTime }} + <div> + <span class="diag-head-text1">寮傚父鏃堕棿娈碉細</span>{{ tableCurrentRowData.beginTime }} ~ + {{ tableCurrentRowData.endTime }} + </div> </div> - </div> - <!-- <div class="chart-jump-button"> + <!-- <div class="chart-jump-button"> <el-button type="danger" :loading="loading.preButton" @@ -1673,82 +1750,80 @@ >涓嬫潯寮傚父</el-button > </div> --> - <div class="chart-jump-button"> - <el-button - type="danger" - :loading="loading.preButton" - :disabled="dialog.isPreCantouch || flag.banTouch" - @click="getNextRowData" - >涓婃潯寮傚父</el-button - > - <el-button - type="danger" - :loading="loading.afterButton" - :disabled="dialog.isNextCantouch || flag.banTouch" - @click="getPreviousRowData" - >涓嬫潯寮傚父</el-button - > + <div class="chart-jump-button"> + <el-button + type="danger" + :loading="loading.preButton" + :disabled="dialog.isPreCantouch || flag.banTouch" + @click="getNextRowData" + >涓婃潯寮傚父</el-button + > + <el-button + type="danger" + :loading="loading.afterButton" + :disabled="dialog.isNextCantouch || flag.banTouch" + @click="getPreviousRowData" + >涓嬫潯寮傚父</el-button + > + </div> </div> + </template> - </div> - </template> + <!-- :option="dialog.option" --> - <!-- :option="dialog.option" --> + <!-- 鍥惧舰 --> + <DustLineChart + :option="dialog.option" + :is-open-dialog="dialogTableVisible" + v-loading="loading.lineChart" + ></DustLineChart> - <!-- 鍥惧舰 --> - <DustLineChart - :option="dialog.option" - :is-open-dialog="dialogTableVisible" - v-loading="loading.lineChart" - ></DustLineChart> - - <!-- 琛ㄦ牸 --> - <div> - <el-table :data="dialog.historyData" size="default" height="200" border> - <el-table-column - type="index" - label="搴忓彿" - width="60px" - align="center" - fixed - :index="indexMethod2" - ></el-table-column> - <!-- <el-table-column fixed prop="name" label="绔欑偣鍚嶇О" show-overflow-tooltip /> + <!-- 琛ㄦ牸 --> + <div> + <el-table :data="dialog.historyData" size="default" height="200" border> + <el-table-column + type="index" + label="搴忓彿" + width="60px" + align="center" + fixed + :index="indexMethod2" + ></el-table-column> + <!-- <el-table-column fixed prop="name" label="绔欑偣鍚嶇О" show-overflow-tooltip /> <el-table-column prop="mnCode" label="璁惧缂栧彿" align="center" show-overflow-tooltip /> <el-table-column prop="dutyCompany" label="杩愮淮鍟�" align="center" show-overflow-tooltip /> --> - <el-table-column prop="lst" label="閲囬泦鏃堕棿" align="center" show-overflow-tooltip /> - <el-table-column - prop="dustValue" - label="棰楃矑鐗╂祿搴�(mg/m鲁)" - align="center" - show-overflow-tooltip - /> - </el-table> - </div> - <template #footer> - <el-tag type="success" class="mx-1" effect="dark" round - ><span class="table-line-lable" v-show="tableCurrentRowData.exceptionType == '0'" - >缂哄け鏁版嵁锛� - </span> - <span - v-show=" - tableCurrentRowData.exceptionType == '1' || - tableCurrentRowData.exceptionType == '2' || - tableCurrentRowData.exceptionType == '3' || - tableCurrentRowData.exceptionType == '4' - " - >寮傚父鏁版嵁锛�</span - > - <span class="table-line-num">{{ dialog.exceptionTotal }}鏉�</span> - <span v-show="tableCurrentRowData.exceptionType == '0'"> (閫昏緫璁$畻)</span> - </el-tag> - </template> - </el-dialog> -</div> + <el-table-column prop="lst" label="閲囬泦鏃堕棿" align="center" show-overflow-tooltip /> + <el-table-column + prop="dustValue" + label="棰楃矑鐗╂祿搴�(mg/m鲁)" + align="center" + show-overflow-tooltip + /> + </el-table> + </div> + <template #footer> + <el-tag type="success" class="mx-1" effect="dark" round + ><span class="table-line-lable" v-show="tableCurrentRowData.exceptionType == '0'" + >缂哄け鏁版嵁锛� + </span> + <span + v-show=" + tableCurrentRowData.exceptionType == '1' || + tableCurrentRowData.exceptionType == '2' || + tableCurrentRowData.exceptionType == '3' || + tableCurrentRowData.exceptionType == '4' + " + >寮傚父鏁版嵁锛�</span + > + <span class="table-line-num">{{ dialog.exceptionTotal }}鏉�</span> + <span v-show="tableCurrentRowData.exceptionType == '0'"> (閫昏緫璁$畻)</span> + </el-tag> + </template> + </el-dialog> + </div> </template> <style lang="scss" scoped> - .el-row { margin-left: 10px; } @@ -1761,7 +1836,6 @@ margin-right: 5px; } .head-container-search { - float: right; } @@ -1778,7 +1852,6 @@ /* 鏉′欢鏌ヨ妯″潡缁撴潫 */ /* 寮傚父鍒嗘瀽妯″潡鐨勬牱寮� */ - .card-text1 { /* 榛戜綋鐨勫紓甯稿悕瀛楅儴鍒� */ @@ -1829,7 +1902,7 @@ white-space: nowrap; } .text-blank { - /* 閫楀彿 */ + /* 閫楀彿 */ margin-right: 10px; color: #000000; } @@ -1841,16 +1914,14 @@ /* 闅愯棌琛ㄦ牸鎸夐挳缁勬牱寮� */ .el-button-group { - margin:10px 0px 10px 10px; + margin: 10px 0px 10px 10px; } .i-ep-Arrow { margin-left: 6px; - margin-bottom:2px; + margin-bottom: 2px; font-size: 1.2em; } /* 闅愯棌琛ㄦ牸鎸夐挳缁勬牱寮忕粨鏉� */ - - /* 琛ㄦ牸妯″潡鐨勬牱寮� */ .el-table { -- Gitblit v1.9.3