From b7b35d8bd8f0ff7fe4e1aa6c69a877551bed81a3 Mon Sep 17 00:00:00 2001
From: zmc <zmc_li@foxmail.com>
Date: 星期三, 30 八月 2023 17:17:58 +0800
Subject: [PATCH] 扬尘Vue
---
src/views/origin_data/DataAccessManagement.vue | 25 +
src/views/exception/FlightInspection.vue | 657 +++++++++++++++++++++++++++++++++++++---
src/views/line_graph/DataRiskModel.vue | 146 +++++---
src/views/setting/SetConfiguration.vue | 32 -
src/views/origin_data/BusinessReport.vue | 25 +
src/views/line_graph/components/DustRadarChart.vue | 2
src/views/line_graph/components/LineChart.vue | 1
src/components/layout/AppAside.vue | 6
src/router/index.ts | 15
9 files changed, 755 insertions(+), 154 deletions(-)
diff --git a/src/components/layout/AppAside.vue b/src/components/layout/AppAside.vue
index 2e89fc8..d8237dd 100644
--- a/src/components/layout/AppAside.vue
+++ b/src/components/layout/AppAside.vue
@@ -60,7 +60,7 @@
<el-sub-menu index="1">
<template #title>
<el-icon><i-ep-Monitor /></el-icon>
- <span class="parent-title">鍒嗛櫓璇勪及</span>
+ <span class="parent-title">椋庨櫓璇勪及</span>
</template>
<el-menu-item index="avgDay" @click="selected = optionClick[0]">
@@ -102,11 +102,11 @@
<el-icon><i-ep-Histogram /></el-icon>
鍘嗗彶鏁版嵁绠＄悊
</el-menu-item>
- <el-menu-item index="1" @click="selected = optionClick[4]">
+ <el-menu-item index="management" @click="selected = optionClick[4]">
<el-icon><i-ep-Histogram /></el-icon>
鏁版嵁鎺ュ叆绠＄悊
</el-menu-item>
- <el-menu-item index="2" @click="selected = optionClick[5]">
+ <el-menu-item index="report" @click="selected = optionClick[5]">
<el-icon><i-ep-Histogram /></el-icon>
涓氬姟鎶ヨ〃
</el-menu-item>
diff --git a/src/router/index.ts b/src/router/index.ts
index dc48367..5d6046c 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -51,6 +51,21 @@
name:'setting',
component: () => import('@/views/setting/SetConfiguration.vue')
},
+
+ // 鏁版嵁鎺ュ叆绠＄悊
+ {
+ path:"/management",
+ name:'management',
+ component: () => import('@/views/origin_data/DataAccessManagement.vue')
+ },
+
+ // 涓氬姟鎶ヨ〃
+ {
+ path:"/report",
+ name:'report',
+ component: () => import('@/views/origin_data/BusinessReport.vue')
+ },
+
],
},
// 鐧婚檰椤甸潰
diff --git a/src/views/exception/FlightInspection.vue b/src/views/exception/FlightInspection.vue
index 25abb94..a64ed4e 100644
--- a/src/views/exception/FlightInspection.vue
+++ b/src/views/exception/FlightInspection.vue
@@ -1,10 +1,11 @@
<script>
import InputSearch from '../../sfc/InputSearch.vue';
import ExceptionType from '../../sfc/ExceptionType.vue';
-import TimeSelect from '../../sfc/TimeSelect.vue';
+import TimeSelectWithShortCuts from '../../sfc/TimeSelectWithShortCuts.vue';
import DustExceptionText from '../../sfc/DustExceptionText.vue';
import { useFetch } from '../../utils/fetch.js';
import { useCommonFunction } from '../../utils/common.js';
+import AreaAndmonitorType from '../../sfc/AreaAndmonitorType.vue'
// 寮傚父鍥惧舰寮傛缁勪欢
const DustLineChart = defineAsyncComponent(() =>
@@ -16,9 +17,10 @@
components: {
ExceptionType,
InputSearch,
- TimeSelect,
+ TimeSelectWithShortCuts,
DustExceptionText,
- DustLineChart
+ DustLineChart,
+ AreaAndmonitorType
},
data() {
return {
@@ -37,7 +39,7 @@
// 琛ㄦ牸灞曠ず鐨勬暟鎹�
displayData: [],
// 琛ㄦ牸楂樺害
- tableHeight: 300,
+ tableHeight: 400,
// 琛ㄦ牸鏁版嵁
// 褰撳墠椤�
currentPage: 1,
@@ -59,12 +61,25 @@
exception2: [],
// 鏁版嵁闀挎椂娈垫棤娉㈠姩
exception3: [],
+ // 閲忕骇绐佸彉寮傚父
+ exception4: [],
+ // 涓磋繎瓒呮爣寮傚父
+ exception5: [],
+ // 鍗曟棩瓒呮爣娆℃暟涓寸晫寮傚父
+ exception6: [],
+ // 婊戝姩骞冲潎鍊煎紓甯�
+ exception7: [],
+
// 璇ユ椂娈电殑寮傚父鏁伴噺
exception0Num: 0,
exception1Num: 0,
exception2Num: 0,
- exception3Num: 0
+ exception3Num: 0,
+ exception4Num: 0,
+ exception5Num: 0,
+ exception6Num: 0,
+ exception7Num: 0,
},
// 绔欑偣鎬绘暟閲�
siteTotal: 0,
@@ -176,29 +191,15 @@
// console.log('鍘嗗彶鏁版嵁涓猴細', this.backData.value);
this.backExceptionDataAWeekAgo();
- this.calTableHeight();
+ // this.calTableHeight();
// 鏌ヨ鏃堕棿娈电殑鍚勫紓甯哥殑绔欑偣锛屾煡璇㈣鏃堕棿鍖洪棿鐨勫悇寮傚父鏁伴噺
this.getShopNames();
- this.test()
// this.exception.exception0 = this.getSiteNameByExceptionType('0',this.beginTime,this.endTime)
// console.log('寮傚父鏁版嵁涓猴細',this.exception.exception0);
},
methods: {
- test(){
- const data = [0.084, 0.073, 0.062, 0.1];
- const threshold = 0.2; // 璁惧畾鐨勫彉鍖栫巼闃堝��
-for (let i = 1; i < data.length; i++) {
- const rateOfChange = Math.abs((data[i] - data[i-1]) / data[i-1]);
-
- console.log('鍙樺寲鐜囦负锛�',data[i], data[i-1],rateOfChange);
- if (rateOfChange > threshold) {
- console.log(`鏁版嵁 ${data[i-1]} 鍒� ${data[i]} 鐨勫彉鍖栫巼瓒呰繃闃堝�� ${threshold}`);
- // 杩涜鐩稿簲鐨勫鐞�
- }
-}
- },
// getExceptionSiteNum(){
// this.$http.get('/dust/exceptionsitenum').then(result => {
@@ -713,7 +714,7 @@
}
};
break;
- case '3':
+ case '3' :
this.dialog.option = {
tooltip: {},
toolbox: {
@@ -797,8 +798,83 @@
}
};
break;
+ case '4':
+ this.dialog.option = {
+ tooltip: {},
+ toolbox: {
+ // 宸ュ叿鏍�
+ feature: {
+ // dataZoom: {
+ // yAxisIndex: 'none'
+ // },
+ // 淇濆瓨涓哄浘鐗�
+ saveAsImage: {}
+ }
+ },
+ xAxis: {
+ type: 'category',
+ data: xData,
+ name: '鏃堕棿',
+ axisLabel: {
+ formatter: function (value) {
+ return value.slice(11, -3);
+ }
+ }
+ },
+ yAxis: {
+ type: 'value',
+ name: 'mg/m鲁'
+ },
+ series: [
+ {
+ name: '棰楃矑鐗╂祿搴�',
+ type: 'line',
+ data: yData,
+ // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹�
+ markArea: {
+ itemStyle: {
+ color: 'rgba(255, 173, 177, 0.4)'
+ },
+ data: [
+ [
+ {
+ name: '寮傚父鏃堕棿娈�',
+ xAxis: exceptionBeginTime
+ },
+ {
+ xAxis: exceptionEndTime
+ }
+ ]
+ ]
+ },
+
+ }
+ ],
+ // 鎸囧畾鏃堕棿鍖洪棿鐨勭嚎娈靛彉棰滆壊
+ visualMap: {
+ show: false,
+ dimension: 0,
+ pieces: [
+ {
+ lte: beginIndex,
+ color: 'green'
+ },
+ {
+ gt: beginIndex,
+ lte: endIndex,
+ color: 'red'
+ },
+ {
+ gt: endIndex,
+ lte: xData.length - 1,
+ color: 'green'
+ }
+ ]
+ }
+ };
+ break;
default:
- return 'error';
+ console.log('娌℃湁璁剧疆璇ュ紓甯哥被鍨嬶紒');;
}
this.flag.banTouch = 0
},
@@ -960,6 +1036,40 @@
this.exception.exception3 = result.data.data;
});
+ this.$http
+ .get('/dust/sitenamecode', {
+ params: {
+ exceptionType: '4',
+ beginTime: this.beginTime,
+ endTime: this.endTime
+ }
+ })
+ .then((result) => {
+ this.exception.exception4 = result.data.data;
+ });
+ this.$http
+ .get('/dust/sitenamecode', {
+ params: {
+ exceptionType: '5',
+ beginTime: this.beginTime,
+ endTime: this.endTime
+ }
+ })
+ .then((result) => {
+ this.exception.exception5 = result.data.data;
+ });
+ this.$http
+ .get('/dust/sitenamecode', {
+ params: {
+ exceptionType: '6',
+ beginTime: this.beginTime,
+ endTime: this.endTime
+ }
+ })
+ .then((result) => {
+ this.exception.exception6 = result.data.data;
+ });
+
/* 寮傚父寮傚父鏁伴噺 */
@@ -1007,6 +1117,40 @@
})
.then((result) => {
this.exception.exception3Num = result.data.data;
+ });
+
+ this.$http
+ .get('/dust/exceptionnum', {
+ params: {
+ exceptionType: '4',
+ beginTime: this.beginTime,
+ endTime: this.endTime
+ }
+ })
+ .then((result) => {
+ this.exception.exception4Num = result.data.data;
+ });
+ this.$http
+ .get('/dust/exceptionnum', {
+ params: {
+ exceptionType: '5',
+ beginTime: this.beginTime,
+ endTime: this.endTime
+ }
+ })
+ .then((result) => {
+ this.exception.exception5Num = result.data.data;
+ });
+ this.$http
+ .get('/dust/exceptionnum', {
+ params: {
+ exceptionType: '6',
+ beginTime: this.beginTime,
+ endTime: this.endTime
+ }
+ })
+ .then((result) => {
+ this.exception.exception6Num = result.data.data;
});
},
@@ -1194,8 +1338,12 @@
}
},
// 琛ㄦ牸搴忓彿閫掑
- indexMethod(index) {
+ indexMethod1(index) {
return index + 1 + (this.currentPage - 1) * this.pageSize;
+ },
+ // 琛ㄦ牸搴忓彿閫掑
+ indexMethod2(index) {
+ return index + 1;
}
}
};
@@ -1207,6 +1355,9 @@
<el-col>
<el-form :inline="true">
<div class="head-container-text">
+ <el-form-item >
+ <AreaAndmonitorType ></AreaAndmonitorType>
+ </el-form-item>
<el-form-item>
<InputSearch
:isNeedDefaultSite="0"
@@ -1216,14 +1367,16 @@
</InputSearch>
</el-form-item>
+
+
+ <el-form-item>
+ <TimeSelectWithShortCuts @submit-time="giveTime"></TimeSelectWithShortCuts>
+ </el-form-item>
+
<el-form-item>
<ExceptionType
@submit-value="(n) => form.exceptionName = n"
></ExceptionType>
- </el-form-item>
-
- <el-form-item>
- <TimeSelect @submit-time="giveTime"></TimeSelect>
</el-form-item>
</div>
@@ -1248,13 +1401,286 @@
<template #header>
<div class="card-header">寮傚父鍒嗘瀽</div>
</template>
- <el-row :gutter="20">
+
+
+ <el-row :gutter="20" class="card-row" >
<el-col :span="6">
- <div class="card-content">
+ <div class="card-content-unnormal">
<!-- 鏍囧ご -->
<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">
+ <el-scrollbar>
+
+ <span class="card-exceptionname-text1">寮傚父绔欑偣鍗犳瘮:</span>
+ <span>{{ exception.exception4.length }} /{{ siteTotal }}</span>
+ <span>
+ ({{
+ ((exception.exception4.length / siteTotal) * 100).toFixed(
+ 1
+ )
+ }}%)</span
+ >
+
+ <div class="card-exceptionname-text2"
+ >寮傚父鏁板崰姣�:{{
+ (
+ (exception.exception4Num /
+ (exception.exception0Num +
+ exception.exception1Num +
+ exception.exception2Num +
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num
+ )) *
+ 100
+ ).toFixed(1)
+ }}%</div
+ >
+
+ </el-scrollbar>
+ </div>
+ <hr />
+ <!-- 寮傚父鐨勫簵閾哄悕瀛� -->
+ <div class="card-exception-buttom">
+ <el-scrollbar max-height="90px">
+ <DustExceptionText
+ :site-name="item.name"
+ exception-type="4"
+ :begin-time="beginTime"
+ :end-time="endTime"
+ @submit-exception-data="getAbnormalDataByClick"
+
+ v-for="(item, index) in exception.exception4"
+ :key="item"
+ >{{ item.name }}
+ <span
+ v-if="index < exception.exception4.length - 1"
+ class="text-blank"
+ >,</span
+ >
+ </DustExceptionText>
+ </el-scrollbar>
+ </div>
+ <!-- 缁撴潫 -->
+ </div>
+ </el-col>
+
+ <el-col :span="6">
+ <div class="card-content-unnormal">
+ <!-- 鏍囧ご -->
+ <div class="card-text1">
+ <image class="card-header-image"></image>
+ <span class="card-header-text">涓磋繎瓒呮爣寮傚父</span>
+ </div>
+
+ <div class="card-content-text">
+ <el-scrollbar>
+
+ <span class="card-exceptionname-text1">寮傚父绔欑偣鍗犳瘮:</span>
+ <span>{{ exception.exception5.length }} /{{ siteTotal }}</span>
+ <span>
+ ({{
+ ((exception.exception5.length / siteTotal) * 100).toFixed(
+ 1
+ )
+ }}%)</span
+ >
+
+ <div class="card-exceptionname-text2"
+ >寮傚父鏁板崰姣�:{{
+ (
+ (exception.exception5Num /
+ (exception.exception0Num +
+ exception.exception1Num +
+ exception.exception2Num +
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num
+ )) *
+ 100
+ ).toFixed(1)
+ }}%</div
+ >
+
+ </el-scrollbar>
+ </div>
+ <hr />
+ <!-- 寮傚父鐨勫簵閾哄悕瀛� -->
+ <div class="card-exception-buttom">
+ <el-scrollbar max-height="90px">
+ <DustExceptionText
+ :site-name="item.name"
+ exception-type="5"
+ :begin-time="beginTime"
+ :end-time="endTime"
+ @submit-exception-data="getAbnormalDataByClick"
+
+ v-for="(item, index) in exception.exception5"
+ :key="item"
+ >{{ item.name }}
+ <span
+ v-if="index < exception.exception5.length - 1"
+ class="text-blank"
+ >,</span
+ >
+ </DustExceptionText>
+ </el-scrollbar>
+ </div>
+ <!-- 缁撴潫 -->
+ </div>
+ </el-col>
+
+ <el-col :span="6">
+ <div class="card-content-unnormal">
+ <!-- 鏍囧ご -->
+ <div class="card-text1">
+ <image class="card-header-image"></image>
+ <span class="card-header-text">鍗曟棩瓒呮爣娆℃暟涓寸晫寮傚父</span>
+ </div>
+
+ <div class="card-content-text">
+ <el-scrollbar>
+
+ <span class="card-exceptionname-text1">寮傚父绔欑偣鍗犳瘮:</span>
+ <span>{{ exception.exception6.length }} /{{ siteTotal }}</span>
+ <span>
+ ({{
+ ((exception.exception6.length / siteTotal) * 100).toFixed(
+ 1
+ )
+ }}%)</span
+ >
+
+ <div class="card-exceptionname-text2"
+ >寮傚父鏁板崰姣�:{{
+ (
+ (exception.exception6Num /
+ (exception.exception0Num +
+ exception.exception1Num +
+ exception.exception2Num +
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num
+ )) *
+ 100
+ ).toFixed(1)
+ }}%</div
+ >
+
+ </el-scrollbar>
+ </div>
+ <hr />
+ <!-- 寮傚父鐨勫簵閾哄悕瀛� -->
+ <div class="card-exception-buttom">
+ <el-scrollbar max-height="90px">
+ <DustExceptionText
+ :site-name="item.name"
+ exception-type="6"
+ :begin-time="beginTime"
+ :end-time="endTime"
+ @submit-exception-data="getAbnormalDataByClick"
+
+ v-for="(item, index) in exception.exception6"
+ :key="item"
+ >{{ item.name }}
+ <span
+ v-if="index < exception.exception6.length - 1"
+ class="text-blank"
+ >,</span
+ >
+ </DustExceptionText>
+ </el-scrollbar>
+ </div>
+ <!-- 缁撴潫 -->
+ </div>
+ </el-col>
+
+ <el-col :span="6">
+ <div class="card-content-unnormal">
+ <!-- 鏍囧ご -->
+ <div class="card-text1">
+ <image class="card-header-image"></image>
+ <span class="card-header-text">鍙樺寲瓒嬪娍寮傚父</span>
+ </div>
+
+ <div class="card-content-text">
+ <el-scrollbar>
+
+ <span class="card-exceptionname-text1">寮傚父绔欑偣鍗犳瘮:</span>
+ <span>{{ exception.exception7.length }} /{{ siteTotal }}</span>
+ <span>
+ ({{
+ ((exception.exception7.length / siteTotal) * 100).toFixed(
+ 1
+ )
+ }}%)</span
+ >
+
+ <div class="card-exceptionname-text2"
+ >寮傚父鏁板崰姣�:{{
+ (
+ (exception.exception7Num /
+ (exception.exception0Num +
+ exception.exception1Num +
+ exception.exception2Num +
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num
+ )) *
+ 100
+ ).toFixed(1)
+ }}%</div
+ >
+
+ </el-scrollbar>
+ </div>
+ <hr />
+ <!-- 寮傚父鐨勫簵閾哄悕瀛� -->
+ <div class="card-exception-buttom">
+ <el-scrollbar max-height="90px">
+ <DustExceptionText
+ :site-name="item.name"
+ exception-type="7"
+ :begin-time="beginTime"
+ :end-time="endTime"
+ @submit-exception-data="getAbnormalDataByClick"
+
+ v-for="(item, index) in exception.exception7"
+ :key="item"
+ >{{ item.name }}
+ <span
+ v-if="index < exception.exception7.length - 1"
+ class="text-blank"
+ >,</span
+ >
+ </DustExceptionText>
+ </el-scrollbar>
+ </div>
+ <!-- 缁撴潫 -->
+ </div>
+ </el-col>
+ </el-row>
+
+
+ <el-row :gutter="20" >
+ <el-col :span="6">
+ <div class="card-content-normal">
+ <!-- 鏍囧ご -->
+ <div class="card-text1">
+ <image class="card-header-image"></image>
+ <span class="card-header-text">娴撳害瓒呮爣</span>
</div>
<div class="card-content-text">
@@ -1270,17 +1696,23 @@
}}%)</span
>
- <span class="card-exceptionname-text2"
+ <div class="card-exceptionname-text2"
>寮傚父鏁板崰姣�:{{
(
(exception.exception2Num /
(exception.exception0Num +
exception.exception1Num +
exception.exception2Num +
- exception.exception3Num)) *
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num
+
+ )) *
100
).toFixed(1)
- }}%</span
+ }}%</div
>
</el-scrollbar>
@@ -1288,7 +1720,7 @@
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
<div class="card-exception-buttom">
- <el-scrollbar max-height="100px">
+ <el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
exception-type="2"
@@ -1311,11 +1743,11 @@
</div>
</el-col>
<el-col :span="6"
- ><div class="card-content">
+ ><div class="card-content-normal">
<!-- 鏍囧ご -->
<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">
@@ -1329,24 +1761,28 @@
)
}}%)</span
>
- <span class="card-exceptionname-text2"
+ <div class="card-exceptionname-text2"
>寮傚父鏁板崰姣�:{{
(
(exception.exception0Num /
(exception.exception0Num +
exception.exception1Num +
exception.exception2Num +
- exception.exception3Num)) *
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num)) *
100
).toFixed(1)
- }}%</span
+ }}%</div
>
</el-scrollbar>
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
<div class="card-exception-buttom">
- <el-scrollbar max-height="100px">
+ <el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
exception-type="0"
@@ -1369,7 +1805,7 @@
</div>
</el-col>
<el-col :span="6">
- <div class="card-content">
+ <div class="card-content-normal">
<!-- 鏍囧ご -->
<div class="card-text1">
<image class="card-header-image"></image>
@@ -1387,24 +1823,28 @@
)
}}%)</span
>
- <span class="card-exceptionname-text2"
+ <div class="card-exceptionname-text2"
>寮傚父鏁板崰姣�:{{
(
(exception.exception1Num /
(exception.exception0Num +
exception.exception1Num +
exception.exception2Num +
- exception.exception3Num)) *
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num)) *
100
).toFixed(1)
- }}%</span
+ }}%</div
>
</el-scrollbar>
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
<div class="card-exception-buttom">
- <el-scrollbar max-height="100px">
+ <el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
exception-type="1"
@@ -1427,7 +1867,7 @@
</div></el-col
>
<el-col :span="6"
- ><div class="card-content">
+ ><div class="card-content-normal">
<!-- 鏍囧ご -->
<div class="card-text1">
<image class="card-header-image"></image>
@@ -1445,40 +1885,97 @@
)
}}%)</span
>
- <span class="card-exceptionname-text2"
+ <div class="card-exceptionname-text2"
>寮傚父鏁板崰姣�:{{(100-
((exception.exception0Num /
(exception.exception0Num +
exception.exception1Num +
exception.exception2Num +
- exception.exception3Num)) *
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num)) *
100
) -
((exception.exception1Num /
(exception.exception0Num +
exception.exception1Num +
exception.exception2Num +
- exception.exception3Num)) *
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num)) *
100
) -
((exception.exception2Num /
(exception.exception0Num +
exception.exception1Num +
exception.exception2Num +
- exception.exception3Num)) *
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num)) *
+ 100
+ ) -
+ ((exception.exception4Num /
+ (exception.exception0Num +
+ exception.exception1Num +
+ exception.exception2Num +
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num)) *
+ 100
+ )-
+ ((exception.exception5Num /
+ (exception.exception0Num +
+ exception.exception1Num +
+ exception.exception2Num +
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num)) *
+ 100
+ )-
+ ((exception.exception6Num /
+ (exception.exception0Num +
+ exception.exception1Num +
+ exception.exception2Num +
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num)) *
+ 100
+ )-
+ ((exception.exception7Num /
+ (exception.exception0Num +
+ exception.exception1Num +
+ exception.exception2Num +
+ exception.exception3Num+
+ exception.exception4Num+
+ exception.exception5Num+
+ exception.exception6Num+
+ exception.exception7Num)) *
100
)
+
).toFixed(1)
- }}%</span
+ }}%</div
>
</el-scrollbar>
</div>
<hr />
<!-- 寮傚父鐨勫簵閾哄悕瀛� -->
<div class="card-exception-buttom">
- <el-scrollbar max-height="100px">
+ <el-scrollbar max-height="90px">
<DustExceptionText
:site-name="item.name"
exception-type="3"
@@ -1500,7 +1997,10 @@
<!-- 缁撴潫 -->
</div>
</el-col>
- </el-row>
+ </el-row>
+
+
+
</el-card>
</el-col>
</el-row>
@@ -1522,7 +2022,7 @@
width="60px"
align="center"
fixed
- :index="indexMethod"
+ :index="indexMethod1"
/>
<el-table-column prop="name" label="绔欑偣鍚嶇О" show-overflow-tooltip />
<el-table-column
@@ -1607,8 +2107,12 @@
<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
@@ -1620,6 +2124,17 @@
<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 }} ~
@@ -1664,7 +2179,7 @@
width="60px"
align="center"
fixed
- :index="indexMethod"
+ :index="indexMethod2"
></el-table-column>
<el-table-column
fixed
@@ -1709,7 +2224,8 @@
v-show="
tableCurrentRowData.exceptionType == '1' ||
tableCurrentRowData.exceptionType == '2' ||
- tableCurrentRowData.exceptionType == '3'
+ tableCurrentRowData.exceptionType == '3' ||
+ tableCurrentRowData.exceptionType == '4'
"
>寮傚父鏁版嵁锛�</span
>
@@ -1746,6 +2262,8 @@
}
/* 鏉′欢鏌ヨ妯″潡缁撴潫 */
+
+
/* 寮傚父鍒嗘瀽妯″潡鐨勬牱寮� */
.card-text1 {
// 榛戜綋鐨勫紓甯稿悕瀛楅儴鍒�
@@ -1764,9 +2282,14 @@
font-size: 18px;
font-weight: bold;
}
-.card-content {
+.card-content-unnormal {
min-height: 200px;
- border: 2px solid #9fdb1d;
+ border: 2px solid #FFCF8B;
+ border-radius: 20px;
+}
+.card-content-normal {
+ min-height: 200px;
+ border: 2px solid red;
border-radius: 20px;
}
.card-header-image {
@@ -1788,7 +2311,7 @@
.card-exceptionname-text2 {
// 寮傚父鏁板崰姣旂殑澶栬竟璺�
- margin-left: 50px;
+ // margin-left: 50px;
font-size: 14px;
white-space: nowrap;
}
@@ -1797,11 +2320,19 @@
margin-right: 10px;
color: #000000;
}
+.card-row {
+ margin-bottom: 10px;
+}
+
/* 寮傚父鍒嗘瀽妯″潡缁撴潫 */
/* 琛ㄦ牸妯″潡鐨勬牱寮� */
/* 琛ㄦ牸妯″潡缁撴潫 */
+
+
+
+
/* 鏌ョ湅璇︽儏瀵硅瘽妗嗘ā鍧楃殑鏍峰紡 */
:deep(.el-dialog) {
@@ -1818,7 +2349,7 @@
}
.diag-head-text span:nth-child(2) {
// 瀵硅瘽妗嗗ご閮ㄢ�樺紓甯哥被鍨嬧�欏睘鎬�
- margin-left: 150px;
+ // margin-left: 150px;
}
.diag-head-text > div {
// 瀵硅瘽妗嗗紓甯告椂闂存
@@ -1845,5 +2376,11 @@
margin-bottom: 20px;
min-width: 600px;
}
+.mx-1 {
+ position: absolute;
+ left: 10px;
+ bottom: 10px;
+
+}
/* 鏌ョ湅璇︽儏瀵硅瘽妗嗘ā鍧楃粨鏉� */
</style>
diff --git a/src/views/line_graph/DataRiskModel.vue b/src/views/line_graph/DataRiskModel.vue
index db0d463..7a76161 100644
--- a/src/views/line_graph/DataRiskModel.vue
+++ b/src/views/line_graph/DataRiskModel.vue
@@ -29,8 +29,8 @@
chartData3: {},
chartData4: {},
//devId:'', //璁惧缂栧彿
- // begin: '2023-05-01', //寮�濮嬫椂闂�
- // end: '2023-05-15', //缁撴潫鏃堕棿
+ begin: '', //寮�濮嬫椂闂�
+ end: '', //缁撴潫鏃堕棿
form: {
// 绔欑偣鍚嶇О
@@ -278,6 +278,9 @@
this.bill.online = temp['online'];
this.bill.valid = temp['valid'];
this.bill.exceeding = temp['exceeding'];
+
+ this.begin = this.chartData[0].lst
+ this.end = this.chartData[this.chartData.length-1].lst
});
},
@@ -361,18 +364,64 @@
<el-form-item>
<el-button type="primary" @click="fetch">灞曠ず鎶樼嚎鍥�</el-button>
</el-form-item>
-
- <!-- <div>
- <el-form-item>
- <el-radio-group v-model="radio" @change="setChart">
- <el-radio :label="1">棰楃矑鐗╂祿搴﹀钩鍧囧��</el-radio>
- <el-radio :label="2">鏁版嵁鍦ㄧ嚎/鏈夋晥/瓒呮爣鐜�</el-radio>
- </el-radio-group>
- </el-form-item>
- </div> -->
</el-form>
- <div>鏁版嵁缁熻鏃舵锛歿{}}</div>
+ <div>鏁版嵁缁熻鏃舵锛歿{ begin}} ~ {{ end }}</div>
+
+ <el-row :gutter="20">
+ <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+ <el-card
+ shadow="never"
+ :style="{ height: `calc(${height}px - 35vh - 250px)` }"
+ >
+ <DustRadarChart :name="['鏁版嵁鏈夋晥鐜�','鍏稿瀷寮傚父澶嶇幇鐜�','寮傚父绫诲瀷鑱氶泦搴�','鏁版嵁瓒呮爣鐜�','鏁版嵁鍦ㄧ嚎鐜�']" :data="[bill.valid,bill.exceptionRecurrence,bill.exceptionTypeAggregation,bill.exceeding,bill.online]" ></DustRadarChart>
+ </el-card>
+ </el-col>
+
+ <el-col :xs="24" :sm="24" :md="12" :lg="6" :xl="6">
+ <el-card
+ shadow="never"
+ :style="{ height: `calc(${height}px - 35vh - 250px)` }"
+ >
+ <template #header>椋庨櫓璇︽儏</template>
+ <el-space direction="vertical">
+ <div>鏈�澶у��:{{ bill.max }} mg/m鲁</div>
+ <div>鏈�灏忓��:{{ bill.min }} mg/m鲁</div>
+ <div>鍧囧��:{{ bill.avg }} mg/m鲁</div>
+ <div>鏁版嵁鏈夋晥鐜�:{{ bill.online }}%</div>
+ <div>鏁版嵁鍦ㄧ嚎鐜�:{{ bill.valid }}%</div>
+ <div>鏁版嵁瓒呮爣鐜�:{{ bill.exceeding }}%</div>
+ <div>寮傚父绫诲瀷鑱氶泦搴�:{{ bill.exceptionTypeAggregation*100 }}%</div>
+ <div>鍏稿瀷寮傚父澶嶇幇鐜�:{{ bill.exceptionRecurrence*100 }}%</div>
+ </el-space>
+ </el-card>
+ </el-col>
+
+ <el-col :xs="24" :sm="24" :md="12" :lg="6" :xl="6">
+ <el-card
+ shadow="never"
+ :style="{ height: `calc(${height}px - 35vh - 250px)` }"
+ >
+ <template #header>椋庨櫓绛夌骇</template>
+ <template #default>
+ <el-space direction="vertical" :size="15">
+ <div class="container">
+ <div class="block heigh"></div> <div>楂橀闄�(鈮�0.6)</div>
+ </div>
+ <div class="container">
+ <div class="block medium" ></div> <div>涓闄�(0.2~0.6)</div>
+ </div>
+ <div class="container">
+ <div class="block low"></div><div>浣庨闄�(锛�0.2)</div>
+ </div>
+
+
+
+ </el-space>
+ </template>
+ </el-card>
+ </el-col>
+ </el-row>
<el-row :gutter="24">
<el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="6">
@@ -384,7 +433,7 @@
<LineChart
title="鏃ュ潎鍊�"
:chartData="chartData1"
- yName="娴撳害"
+ yName="mg/m鲁"
seriesName="鏃ュ潎鍊�"
>
</LineChart>
@@ -401,7 +450,7 @@
<LineChart
title="鏃ュ湪绾跨巼"
:chartData="chartData2"
- yName="鐧惧垎姣�"
+ yName="%"
seriesName="鏃ュ湪绾跨巼"
>
</LineChart>
@@ -416,7 +465,7 @@
<LineChart
title="鏃ユ湁鏁堢巼"
:chartData="chartData3"
- yName="鐧惧垎姣�"
+ yName="%"
seriesName="鏃ユ湁鏁堢巼"
>
</LineChart>
@@ -430,7 +479,7 @@
<LineChart
title="鏃ヨ秴鏍囩巼"
:chartData="chartData4"
- yName="鐧惧垎姣�"
+ yName="%"
seriesName="鏃ヨ秴鏍囩巼"
>
</LineChart>
@@ -439,51 +488,8 @@
</el-col>
</el-row>
- <el-row :gutter="20">
- <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
- <el-card
- shadow="never"
- :style="{ height: `calc(${height}px - 35vh - 250px)` }"
- >
- <DustRadarChart :name="['鏁版嵁鏈夋晥鐜�','鍏稿瀷寮傚父澶嶇幇鐜�','寮傚父绫诲瀷鑱氶泦搴�','鏁版嵁瓒呮爣鐜�','鏁版嵁鍦ㄧ嚎鐜�']" :data="[bill.valid,bill.exceptionRecurrence,bill.exceptionTypeAggregation,bill.exceeding,bill.online]" ></DustRadarChart>
- </el-card>
- </el-col>
- <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
- <el-card
- shadow="never"
- :style="{ height: `calc(${height}px - 35vh - 250px)` }"
- >
- <template #header>寮傚父鏁伴噺缁熻</template>
- <el-space direction="vertical">
- <div>鏈�澶у��:{{ bill.max }} mg/m鲁</div>
- <div>鏈�灏忓��:{{ bill.min }} mg/m鲁</div>
- <div>鍧囧��:{{ bill.avg }} mg/m鲁</div>
- <div>鏁版嵁鏈夋晥鐜�:{{ bill.online }}%</div>
- <div>鏁版嵁鍦ㄧ嚎鐜�:{{ bill.valid }}%</div>
- <div>鏁版嵁瓒呮爣鐜�:{{ bill.exceeding }}%</div>
- <div>寮傚父绫诲瀷鑱氶泦搴�:{{ bill.exceptionTypeAggregation*100 }}%</div>
- <div>鍏稿瀷寮傚父澶嶇幇鐜�:{{ bill.exceptionRecurrence*100 }}%</div>
- </el-space>
- </el-card>
- </el-col>
- <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
- <el-card
- shadow="never"
- :style="{ height: `calc(${height}px - 35vh - 250px)` }"
- >
- <template #header>椋庨櫓绛夌骇</template>
- <template #default>
- <el-space direction="vertical">
- <el-text>楂橀闄�(鈮�0.6)</el-text>
- <el-text>涓闄�(0.2~0.6)</el-text>
- <el-text>浣庨闄�(锛�0.2)</el-text>
- </el-space>
- </template>
- </el-card>
- </el-col>
- </el-row>
</el-main>
</el-container>
</div>
@@ -503,4 +509,26 @@
color: #333;
line-height: 60px;
}
+.container {
+ display: flex;
+ justify-content: space-between;
+}
+.block {
+ width: 1em;
+ height: 1em;
+ margin-right: 10px;
+}
+.heigh {
+ background-color: red;
+}
+.medium {
+ background-color: #FADC19;
+}
+.low {
+ background-color: #9FDB1D;
+}
+
+.el-text {
+ align-self: left;
+}
</style>
diff --git a/src/views/line_graph/components/DustRadarChart.vue b/src/views/line_graph/components/DustRadarChart.vue
index e6162a9..732b39d 100644
--- a/src/views/line_graph/components/DustRadarChart.vue
+++ b/src/views/line_graph/components/DustRadarChart.vue
@@ -38,7 +38,7 @@
set(){
let option = {
title: {
- text: '鍩虹鍒嗘瀽'
+ text: '缁煎悎椋庨櫓'
},
tooltip: {},
radar: {
diff --git a/src/views/line_graph/components/LineChart.vue b/src/views/line_graph/components/LineChart.vue
index e1c4b89..17021bd 100644
--- a/src/views/line_graph/components/LineChart.vue
+++ b/src/views/line_graph/components/LineChart.vue
@@ -116,7 +116,6 @@
// 璺熼〉闈㈠搷搴斿紡鍙樺寲
resizeChart() {
// this.chart.resize();
- // delay(600).then(() => this.chart.resize());
this.$nextTick(() => {
if (this.chart) {
this.chart.resize();
diff --git a/src/views/origin_data/BusinessReport.vue b/src/views/origin_data/BusinessReport.vue
new file mode 100644
index 0000000..7bc7900
--- /dev/null
+++ b/src/views/origin_data/BusinessReport.vue
@@ -0,0 +1,25 @@
+<script>
+ export default {
+ data() {
+ return{
+
+ }
+ },
+ mounted() {
+
+ },
+ methods: {
+
+ }
+}
+</script>
+
+<template>
+ <div>
+ 涓氬姟鎶ヨ〃
+ </div>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/views/origin_data/DataAccessManagement.vue b/src/views/origin_data/DataAccessManagement.vue
new file mode 100644
index 0000000..5c36b21
--- /dev/null
+++ b/src/views/origin_data/DataAccessManagement.vue
@@ -0,0 +1,25 @@
+<script>
+ export default {
+ data() {
+ return{
+
+ }
+ },
+ mounted() {
+
+ },
+ methods: {
+
+ }
+}
+</script>
+
+<template>
+ <div>
+ 鏁版嵁鎺ュ叆绠＄悊
+ </div>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/views/setting/SetConfiguration.vue b/src/views/setting/SetConfiguration.vue
index 9adf956..7f7df82 100644
--- a/src/views/setting/SetConfiguration.vue
+++ b/src/views/setting/SetConfiguration.vue
@@ -1,6 +1,6 @@
<script>
// import DustRadarChart from '../../sfc/DustRadarChart.vue';
-import TimeSelectWithShortCuts from '../../sfc/TimeSelectWithShortCuts.vue'
+// import TimeSelectWithShortCuts from '../../sfc/TimeSelectWithShortCuts.vue'
import dayjs from 'dayjs';
export default {
components :{
@@ -23,40 +23,12 @@
<template>
<div>
- <DustRadarChart></DustRadarChart>
+ 鏁版嵁鎺ュ叆閰嶇疆
</div>
- <!-- <div class="container">
- <el-space wrap :size="20" >
- <el-card v-for="i in 6" :key="i">
- 111
- </el-card>
- </el-space>
- <el-card v-for="i in 5" :key="i">
- 111
- </el-card>
- <el-card>
- 22
- </el-card>
-
- </div> -->
</template>
<style scoped>
-.container {
- margin: 20px 20px;
- display: flex;
- flex-flow: row wrap;
- gap: 20px;
- height: 100%;
-}
-.el-card {
- min-width: 500px;
- min-height: 400px;
- flex: 1 200px;
- /* flex: 1; */
-
-}
</style>
\ No newline at end of file
--
Gitblit v1.9.3