From 013ed9283200da41902835f9fd679df13299d436 Mon Sep 17 00:00:00 2001
From: zmc <zmc_li@foxmail.com>
Date: 星期四, 31 八月 2023 12:53:53 +0800
Subject: [PATCH] 扬尘Vue
---
src/views/exception/FlightInspection.vue | 293 +++++++++++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 269 insertions(+), 24 deletions(-)
diff --git a/src/views/exception/FlightInspection.vue b/src/views/exception/FlightInspection.vue
index 61e9267..1e3ac41 100644
--- a/src/views/exception/FlightInspection.vue
+++ b/src/views/exception/FlightInspection.vue
@@ -15,8 +15,11 @@
import dayjs from 'dayjs';
export default {
components: {
+ ExceptionType,
+ InputSearch,
TimeSelectWithShortCuts,
DustExceptionText,
+ DustLineChart,
AreaAndmonitorType
},
data() {
@@ -100,8 +103,6 @@
afterButton: false,
// 鎶樼嚎鍥�
lineChart: false,
- // 寮傚父绔欑偣鍚嶅瓙鏂囨湰
- text:false
},
@@ -1357,11 +1358,24 @@
<el-form-item >
<AreaAndmonitorType ></AreaAndmonitorType>
</el-form-item>
+ <el-form-item>
+ <InputSearch
+ :isNeedDefaultSite="0"
+ @submit-value="(n) => (form.name = n)"
+ @submit-site-Nums="(n) => (siteTotal = n)"
+ >
+ </InputSearch>
+ </el-form-item>
+
+ <el-form-item>
+ <ExceptionType
+ @submit-value="(n) => form.exceptionName = n"
+ ></ExceptionType>
+ </el-form-item>
<el-form-item>
<TimeSelectWithShortCuts @submit-time="giveTime"></TimeSelectWithShortCuts>
</el-form-item>
-
</div>
<div class="head-container-search">
@@ -1431,7 +1445,7 @@
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
- <div class="card-exception-buttom" v-loading="loading.text" >
+ <div class="card-exception-buttom">
<el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
@@ -1439,7 +1453,7 @@
:begin-time="beginTime"
:end-time="endTime"
@submit-exception-data="getAbnormalDataByClick"
- @subloading="(n)=>loading.text=n"
+
v-for="(item, index) in exception.exception4"
:key="item"
>{{ item.name }}
@@ -1498,7 +1512,7 @@
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
- <div class="card-exception-buttom" v-loading="loading.text">
+ <div class="card-exception-buttom">
<el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
@@ -1565,7 +1579,7 @@
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
- <div class="card-exception-buttom" v-loading="loading.text">
+ <div class="card-exception-buttom">
<el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
@@ -1594,7 +1608,7 @@
<!-- 鏍囧ご -->
<div class="card-text1">
<image class="card-header-image"></image>
- <span class="card-header-text">鍙樺寲瓒嬪娍寮傚父</span>
+ <span class="card-header-text">婊戝姩骞冲潎鍊煎紓甯�</span>
</div>
<div class="card-content-text">
@@ -1632,7 +1646,7 @@
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
- <div class="card-exception-buttom" v-loading="loading.text">
+ <div class="card-exception-buttom">
<el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
@@ -1703,7 +1717,7 @@
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
- <div class="card-exception-buttom" v-loading="loading.text">
+ <div class="card-exception-buttom">
<el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
@@ -1731,7 +1745,7 @@
<!-- 鏍囧ご -->
<div class="card-text1">
<image class="card-header-image"></image>
- <span class="card-header-text">鏁版嵁缂哄け寮傚父</span>
+ <span class="card-header-text">鏂數鎴栨柇缃�</span>
</div>
<div class="card-content-text">
@@ -1765,7 +1779,7 @@
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
- <div class="card-exception-buttom" v-loading="loading.text">
+ <div class="card-exception-buttom">
<el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
@@ -1827,7 +1841,7 @@
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
- <div class="card-exception-buttom" v-loading="loading.text">
+ <div class="card-exception-buttom">
<el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
@@ -1958,7 +1972,7 @@
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
- <div class="card-exception-buttom" v-loading="loading.text">
+ <div class="card-exception-buttom">
<el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
@@ -1989,6 +2003,241 @@
</el-col>
</el-row>
+ <el-row>
+ <el-col v-show="!isNoData">
+ <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"
+ 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-empty v-show="isNoData" :image-size="200" />
+
+ <el-dialog v-model="dialogTableVisible" draggable align-center height="300px">
+ <!-- 澶� -->
+ <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>
+ <span v-if="tableCurrentRowData.exceptionType == '0'"
+ >鏂數鎴栨柇缃�</span
+ >
+ <span v-else-if="tableCurrentRowData.exceptionType == '1'"
+ >鏁版嵁瓒呬綆</span
+ >
+ <span v-else-if="tableCurrentRowData.exceptionType == '2'">瓒呮爣</span>
+ <span v-else-if="tableCurrentRowData.exceptionType == '3'"
+ >鏁版嵁闀挎椂闂存棤娉㈠姩</span
+ >
+ <span v-else-if="tableCurrentRowData.exceptionType == '4'"
+ >閲忕骇绐佸彉寮傚父</span
+ > <span v-else-if="tableCurrentRowData.exceptionType == '5'"
+ >涓磋繎瓒呮爣寮傚父</span
+ > <span v-else-if="tableCurrentRowData.exceptionType == '6'"
+ >鍗曟棩瓒呮爣娆℃暟涓寸晫寮傚父</span
+ > <span v-else-if="tableCurrentRowData.exceptionType == '7'"
+ >婊戝姩骞冲潎鍊煎紓甯�</span
+ >
+ </div>
+
+ <div>
+ <span class="diag-head-text1">寮傚父鏃堕棿娈碉細</span
+ >{{ tableCurrentRowData.beginTime }} ~
+ {{ tableCurrentRowData.endTime }}
+ </div>
+ </div>
+
+ <div class="chart-jump-button">
+ <el-button
+ type="danger"
+ :loading="loading.preButton"
+ :disabled="dialog.isPreCantouch || flag.banTouch"
+ @click="getPreviousRowData"
+ >涓婃潯寮傚父</el-button
+ >
+ <el-button
+ type="danger"
+ :loading="loading.afterButton"
+ :disabled="dialog.isNextCantouch || flag.banTouch"
+ @click="getNextRowData"
+ >涓嬫潯寮傚父</el-button
+ >
+ </div>
+ </div>
+ </template>
+
+ <!-- :option="dialog.option" -->
+
+ <!-- 鍥惧舰 -->
+ <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
+ />
+ <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>
</template>
<style lang="scss" scoped>
@@ -2086,6 +2335,7 @@
/* 鏌ョ湅璇︽儏瀵硅瘽妗嗘ā鍧楃殑鏍峰紡 */
:deep(.el-dialog) {
// 瀵硅瘽妗嗛珮搴�
+
}
.diag-head {
// 瀵硅瘽妗嗗ご閮ㄥ尯鍩�
@@ -2113,18 +2363,13 @@
.chart-jump-button {
// 鈥樹笂涓�鏉♀�欙紝鈥樹笅涓�鏉♀�� 鎸夐挳
// border: 1px solid #fdc2db;
- min-height: 30px;
- width: 200px;
- float: right;
+ // min-height: 30px;
+ // width: 200px;
+ // float: right;
+ display: flex;
+ justify-content: right;
}
-.line-chart {
- // 寮傚父鎶樼嚎鍥�
- width: 920px;
- height: 300px;
- margin-bottom: 20px;
- min-width: 600px;
-}
.mx-1 {
position: absolute;
left: 10px;
--
Gitblit v1.9.3