From 0ecf7b3bc6d6a008a804d55c859833bf2cf6473a Mon Sep 17 00:00:00 2001 From: zmc <zmc_li@foxmail.com> Date: 星期三, 22 十一月 2023 10:06:29 +0800 Subject: [PATCH] 1.增加了有效率异常展示页面 2.风险模型的所属场景和运维商的详细信息,以及1个跳转页面链接 3.飞行巡检页面增加增加地址和运维商的筛选条件 4.飞行巡检页面是最新当日日期时,每类异常右上角增加一个“辅助审核” 5.历史数据管理增加 站点总数 --- src/utils/time.js | 153 + src/views/risk_assessment/DataRiskRank.vue | 4 src/views/exception/FlightInspection.vue | 1252 +++------- src/utils/exception_common_function/index.js | 6 src/views/exception/components/exceptionDetail.vue | 61 src/api/historyApi.js | 27 src/views/exception/SiteAuditAssistance.vue | 233 + src/sfc/ExceptionType.vue | 157 src/views/exception/components/SubSiteAudit.vue | 1741 +++++++++++++++ src/views/login/LoginSystem.vue | 13 src/views/risk_assessment/DataRiskModel.vue | 110 src/views/data_management/HistoryData.vue | 31 src/views/exception/components/NoDataStatus.vue | 12 src/views/risk_assessment/components/SiteDetail.vue | 15 src/api/audit/submitApi.js | 1 src/sfc/StreetInfo.vue | 90 src/sfc/TimeShortCuts.vue | 11 src/router/index.js | 207 + src/sfc/DutyCompany.vue | 71 /dev/null | 10 src/main.js | 10 src/api/site/siteInfo.js | 26 src/views/exception/components/DustLineChart.vue | 8 src/utils/chartFunction/temp.js | 18 src/views/risk_assessment/SiteComprehensiveRskRanking.vue | 93 src/views/exception/components/AnalysisCard.vue | 28 src/utils/chartFunction/exceptionOption.js | 628 +++++ src/components/layout/AppAside.vue | 1 src/views/data_management/DataAccessManagement.vue | 16 src/stores/user.js | 21 src/utils/chartFunction/lineChart.js | 10 src/views/exception/components/SubFlightInspection.vue | 1847 +++++++++++++++ 32 files changed, 5,753 insertions(+), 1,158 deletions(-) diff --git a/src/api/audit/submitApi.js b/src/api/audit/submitApi.js index 9e34fa5..0d13a83 100644 --- a/src/api/audit/submitApi.js +++ b/src/api/audit/submitApi.js @@ -49,6 +49,7 @@ } return $http.put('/dust/auditUpdate',params) }, + getAuditNumByTime(beginTime,endTime){ if(beginTime!='' || endTime!=''){ const params = { diff --git a/src/api/historyApi.js b/src/api/historyApi.js index 30b5bc3..a699d02 100644 --- a/src/api/historyApi.js +++ b/src/api/historyApi.js @@ -1,5 +1,28 @@ -import { $http } from './index'; +import { $http } from './index' export default { + // 鏌ヨ鍘嗗彶鏁版嵁 涓嶅垎椤� + queryHistoryData({ siteName, mnCode, beginTime, endTime, scenarioType }) { + const params = { + beginTime: beginTime, + endTime: endTime + } + if (siteName) { + params.siteName = siteName + } + if (mnCode) { + params.mnCode = mnCode + } + if (scenarioType) { + params.scenarioType = scenarioType + } + + return $http.get('/dust/historyall', { + params: params + }) + }, + -}; + + +} diff --git a/src/api/site/siteInfo.js b/src/api/site/siteInfo.js new file mode 100644 index 0000000..1e21940 --- /dev/null +++ b/src/api/site/siteInfo.js @@ -0,0 +1,26 @@ + + +import {$http} from '@/api/index.js' +export default { + /** + * 鏍规嵁璁惧缂栫爜鏌ヨ璇ョ珯鐐逛俊鎭� + */ + querySiteInfoByMnCode(mnCode) { + let params = {} + params.mnCode = mnCode + return $http.get('/dust/siteInfo/info',{params:params}) + }, + /** + * 鏌ヨ鎵�鏈夌殑杩愮淮鍟� + */ + queryDutyCompany() { + return $http.get('/dust/siteInfo/dutyCompany') + }, + /** + * 鏍规嵁鍦板潃鏌ヨ琛楅亾 + */ + queryStreet(street) { + return $http.get('/dust/siteInfo/street',{params:{street:street}}) + } + +} \ No newline at end of file diff --git a/src/components/layout/AppAside.vue b/src/components/layout/AppAside.vue index 0f4b731..6d836ce 100644 --- a/src/components/layout/AppAside.vue +++ b/src/components/layout/AppAside.vue @@ -170,7 +170,6 @@ </el-sub-menu> --> </el-scrollbar> - </el-menu> </el-aside> </template> diff --git a/src/components/layout/example.ts b/src/components/layout/example.ts deleted file mode 100644 index 74fcca8..0000000 --- a/src/components/layout/example.ts +++ /dev/null @@ -1,10 +0,0 @@ - -import { store } from './singleton'; - -export function updateVariable() { - store.variable = 'World'; -} - -export function getVariable() { - return store.variable; -} diff --git a/src/main.js b/src/main.js index bfaa55f..f31b214 100644 --- a/src/main.js +++ b/src/main.js @@ -8,10 +8,10 @@ import { ElMessage } from 'element-plus' // 鍏ㄥ眬寮曞叆鏍峰紡 import 'element-plus/theme-chalk/src/index.scss' -import pinia from './stores/index'; -import { useLoadingStore } from "@/stores/loadingStore"; +import { createPinia } from 'pinia' const app = createApp(App) +const pinia = createPinia() router.beforeEach((to,from,next)=>{ const token = Cookie.get('token') @@ -27,10 +27,8 @@ }) -const loadingStore = useLoadingStore(pinia) -router.afterEach((to, from) => { - loadingStore.clearLoading() -}) + + // 鏈湴 diff --git a/src/router/index.js b/src/router/index.js index e546ff3..dd2b189 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -1,5 +1,4 @@ -import { createRouter, createWebHashHistory } from 'vue-router' - +import { createRouter, createWebHashHistory } from 'vue-router' const router = createRouter({ history: createWebHashHistory(), @@ -9,113 +8,139 @@ name: 'home', meta: { title: '棣栭〉' }, component: () => import('@/components/layout/AppLayout.vue'), - children: - [ - // 鏁版嵁鍒嗛櫓妯″瀷 - { - path: "/avgDay", - name: 'avgDay', - meta: { title: '鏁版嵁鍒嗛櫓妯″瀷' , keepAlive: true}, - component: () => import('@/views/risk_assessment/DataRiskModel.vue') - }, + children: [ + // 鏁版嵁鍒嗛櫓妯″瀷 + { + path: '/avgDay', + name: 'avgDay', + meta: { title: '鏁版嵁鍒嗛櫓妯″瀷', keepAlive: true }, + component: () => import('@/views/risk_assessment/DataRiskModel.vue') + }, - // 鏁版嵁椋庨櫓鎺掑悕 - { - path: "/analysis", - name: 'analysis', - meta: { title: '鏁版嵁椋庨櫓鎺掑悕' , keepAlive: true}, - component: () => import('@/views/risk_assessment/DataRiskRank.vue') - }, + // 鏁版嵁椋庨櫓鎺掑悕 + { + path: '/analysis', + name: 'analysis', + meta: { title: '鏁版嵁椋庨櫓鎺掑悕', keepAlive: true }, + component: () => import('@/views/risk_assessment/DataRiskRank.vue') + }, - // 鏁版嵁椋庨櫓鎺掑悕 - { - path: "/riskrank", - name: 'riskrank', - meta: { title: '缁煎悎椋庨櫓鎺掑悕' , keepAlive: true }, - component: () => import('@/views/risk_assessment/SiteComprehensiveRskRanking.vue') - }, - - // 椋炶宸℃ - { - path: "/edata", - name: 'edata', - meta: { title: '椋炶宸℃' , keepAlive: true}, - component: () => import('@/views/exception/FlightInspection.vue') - }, + // 鏁版嵁椋庨櫓鎺掑悕 + { + path: '/riskrank', + name: 'riskrank', + meta: { title: '缁煎悎椋庨櫓鎺掑悕', keepAlive: true }, + component: () => import('@/views/risk_assessment/SiteComprehensiveRskRanking.vue') + }, - // 绔欑偣瀹℃牳杈呭姪 - { - path: "/testData", - name: 'testData', - meta: { title: '绔欑偣瀹℃牳杈呭姪' , keepAlive: true}, - component: () => import('@/views/exception/SiteAuditAssistance.vue') - }, - - - { - path: "/hdata", - name: 'hdata', - meta: { title: '鍘嗗彶鏁版嵁绠$悊' , keepAlive: true}, - component: () => import('@/views/data_management/HistoryData.vue') - }, - // 鏁版嵁鎺ュ叆绠$悊 - { - path: "/management", - name: 'management', - meta: { title: '鏁版嵁鎺ュ叆绠$悊' }, - component: () => import('@/views/data_management/DataAccessManagement.vue') - }, + // 椋炶宸℃ + { + path: '/edata', + name: 'edata', + meta: { title: '椋炶宸℃', keepAlive: true }, + component: () => import('@/views/exception/FlightInspection.vue') + }, - // 涓氬姟鎶ヨ〃 - { - path: "/report", - name: 'report', - meta: { title: '涓氬姟鎶ヨ〃' }, - component: () => import('@/views/data_management/BusinessReport.vue') - }, - - // 鏁版嵁鎺ュ叆閰嶇疆 - { - path: "/setting", - name: 'setting', - meta: { title: '鏁版嵁鎺ュ叆閰嶇疆' }, - component: () => import('@/views/setting/SetConfiguration.vue') - }, + // 绔欑偣瀹℃牳杈呭姪 + { + path: '/testData', + name: 'testData', + meta: { title: '绔欑偣瀹℃牳杈呭姪', keepAlive: true }, + component: () => import('@/views/exception/SiteAuditAssistance.vue') + }, - - // 鏁版嵁鎺ュ叆閰嶇疆 - { - path: "/detail/:siteName/:month", - name: 'detail', - meta: { title: '绔欑偣鍏蜂綋淇℃伅',transition: 'slide-left' }, - component: () => import('@/views/risk_assessment/components/SiteDetail.vue') - }, + { + path: '/hdata', + name: 'hdata', + meta: { title: '鍘嗗彶鏁版嵁绠$悊', keepAlive: true }, + component: () => import('@/views/data_management/HistoryData.vue') + }, + // 鏁版嵁鎺ュ叆绠$悊 + { + path: '/management', + name: 'management', + meta: { title: '鏁版嵁鎺ュ叆绠$悊' }, + component: () => import('@/views/data_management/DataAccessManagement.vue') + }, - // 椋庨櫓妯″瀷宓屽叆 - { - path: "/subRiskModel", - name: 'subRiskModel', - meta: { title: '椋庨櫓妯″瀷宓屽叆' }, - component: () => import('@/views/risk_assessment/components/subRiskModel.vue') - }, + // 涓氬姟鎶ヨ〃 + { + path: '/report', + name: 'report', + meta: { title: '涓氬姟鎶ヨ〃' }, + component: () => import('@/views/data_management/BusinessReport.vue') + }, - ], + // 鏁版嵁鎺ュ叆閰嶇疆 + { + path: '/setting', + name: 'setting', + meta: { title: '鏁版嵁鎺ュ叆閰嶇疆' }, + component: () => import('@/views/setting/SetConfiguration.vue') + }, + + // 椋庨櫓妯″瀷宓屽叆杩囨浮椤甸潰 + { + path: '/detail/:siteName/:month/:titleName', + name: 'RiskModelDetail', + meta: { title: '绔欑偣鍏蜂綋淇℃伅', transition: 'slide-left' }, + component: () => import('@/views/risk_assessment/components/SiteDetail.vue') + }, + + // 椋庨櫓妯″瀷宓屽叆 + { + path: '/subRiskModel', + name: 'subRiskModel', + meta: { title: '椋庨櫓妯″瀷宓屽叆' }, + component: () => import('@/views/risk_assessment/components/SubRiskModel.vue') + }, + + + // 瀹℃牳杈呭姪宓屽叆杩囨浮椤甸潰 + { + path: '/AuditDetail/:beginTime/:endTime/:exceptionType', + name: 'siteAuditDetail', + meta: { title: '寮傚父瀹℃牳鍏蜂綋淇℃伅', transition: 'slide-left' }, + component: () => import('@/views/exception/components/exceptionDetail.vue') + }, + + // 瀹℃牳杈呭姪宓屽叆 + { + path: '/SubSiteAudit', + name: 'SubSiteAudit', + meta: { title: '瀹℃牳杈呭姪宓屽叆' }, + component: () => import('@/views/exception/components/SubSiteAudit.vue') + }, + + // 寮傚父璇︽儏宓屽叆杩囨浮椤甸潰 + { + path: '/exceptionDetail/:siteName/:month/', + name: 'exceptionDetail', + meta: { title: '寮傚父鍏蜂綋淇℃伅', transition: 'slide-left' }, + component: () => import('@/views/risk_assessment/components/SiteDetail.vue') + }, + + // 寮傚父璇︽儏宓屽叆 + { + path: '/SubFlightInspection', + name: 'SubFlightInspection', + meta: { title: '寮傚父璇︽儏宓屽叆' }, + component: () => import('@/views/exception/components/SubFlightInspection.vue') + }, + ] }, - // 鐧婚檰椤甸潰 { - path: "/login", + path: '/login', name: 'login', component: () => import('@/views/login/LoginSystem.vue') - }, { path: '/', redirect: '/edata' - }, + } ] }) - export default router diff --git a/src/sfc/DutyCompany.vue b/src/sfc/DutyCompany.vue new file mode 100644 index 0000000..f951aca --- /dev/null +++ b/src/sfc/DutyCompany.vue @@ -0,0 +1,71 @@ +<!-- 杩愮淮鍟嗙被鍨� + + **鐖剁粍浠� + <DutyCompany @submitDutyCompanyValue="(n)=>(form.dutyCompany = n)"> </DutyCompany> +--> +<script> +import siteInfo from '@/api/site/siteInfo.js' +export default { + emits: ['submitDutyCompanyValue'], + + data() { + return { + // 宸查�夋嫨鐨勮繍缁村晢 + dutyCompany: [], + // 杩愮淮鍟嗗垪琛� + optionDutyCompany: [] + } + }, + mounted() { + // 鏌ヨ鎵�鏈夌殑杩愮淮鍟� + this.fetchDustCompany() + }, + methods: { + /** + * 鏌ヨ鎵�鏈夌殑杩愮淮鍟� + * @param锛� + */ + fetchDustCompany() { + siteInfo.queryDutyCompany().then((response) => { + response.data.data.forEach((item) => { + this.optionDutyCompany.push(item.dutyCompany) + }) + }) + } + } +} +</script> + +<template> + <div class="container"> + <div> + <el-text class="text">杩愮淮鍟嗭細</el-text> + <el-select + v-model="dutyCompany" + multiple + collapse-tags + collapse-tags-tooltip + :max-collapse-tags="1" + placeholder="鍏ㄩ儴" + :loading="loading" + @change="$emit('submitDutyCompanyValue', this.dutyCompany)" + > + <el-option v-for="item in optionDutyCompany" :key="item" :label="item" :value="item" /> + </el-select> + </div> + </div> +</template> + +<style scoped> +.el-select { + width: 150px; +} +.container { + display: flex; +} + +.text { + color: #333333; + font-size: 14px; +} +</style> diff --git a/src/sfc/ExceptionType.vue b/src/sfc/ExceptionType.vue index 43b8b90..0e14d3d 100644 --- a/src/sfc/ExceptionType.vue +++ b/src/sfc/ExceptionType.vue @@ -1,4 +1,3 @@ - <!-- 寮傚父绫诲瀷澶嶉�夋缁勪欢 鑷姩鑾峰彇鎵皹鍘嗗彶琛ㄤ腑涓嶅悓寮傚父绫诲瀷 灏嗛�変腑鐨勫涓紓甯镐互鏁扮粍褰㈠紡杩斿洖缁欑埗缁勪欢 @@ -9,86 +8,108 @@ --> <script> - export default { - emits:['submitValue'], - data() { - return{ - // 杩斿洖鐨勬墍鏈夊紓甯哥被鍨� - exceptionType:[], - //宸插嬀閫夌殑寮傚父 - checkedList: [], - // 鍏ㄩ�� - checkAll:false, - isIndeterminate:false, +export default { + props: { + // 绂佺敤 + isDisabled: { + type: Boolean, + default: false + }, + // 寮傚父绫诲瀷 + exception: { + type: Number, + default:-1 + } + }, + emits: ['submitValue'], + data() { + return { + // 杩斿洖鐨勬墍鏈夊紓甯哥被鍨� + exceptionType: [], + //宸插嬀閫夌殑寮傚父 + checkedList: [], + // 鍏ㄩ�� + checkAll: false, + isIndeterminate: false + } + }, + + mounted() { + this.$watch(() => [this.exception], () => { + if (this.exception != -1) { + console.log('寮傚父绫诲瀷锛�',this.exception) + this.checkedList.push(this.exception) } + + }); + this.getExceptionType() + }, + methods: { + // 鑾峰彇涓嶅悓鐨勫紓甯稿悕绉� + getExceptionType() { + this.$http.get('/dust/exceptiontype').then((response) => { + // this.exceptionType = response.data.data + response.data.data.forEach((item) => { + this.exceptionType.push(item.exceptionType) + }) + // console.log('鑾峰彇鍒扮殑寮傚父绫诲瀷锛�',this.exceptionType); + let a = ['0', '1', '2', '3', '4', '5', '6', '7','8'] + a.forEach((item) => { + if (this.exceptionType.indexOf(item) == -1) { + this.exceptionType.push(item) + } + }) + }) }, - mounted() { - this.getExceptionType() + handleCheckAllChange(val) { + this.checkedList = val ? this.exceptionType : [] + this.isIndeterminate = false + this.$emit('submitValue', this.checkedList) }, - methods: { - // 鑾峰彇涓嶅悓鐨勫紓甯稿悕绉� - getExceptionType(){ - this.$http.get('/dust/exceptiontype').then(response=>{ - // this.exceptionType = response.data.data - response.data.data.forEach(item => { - this.exceptionType.push(item.exceptionType) - }); - // console.log('鑾峰彇鍒扮殑寮傚父绫诲瀷锛�',this.exceptionType); - let a = ['0','1','2','3','4','5','6','7'] - a.forEach(item=>{ - if(this.exceptionType.indexOf(item) == -1){ - this.exceptionType.push(item) - } - }) - }) - }, - handleCheckAllChange (val) { - this.checkedList = val ? this.exceptionType : [] - this.isIndeterminate = false - this.$emit('submitValue',this.checkedList) - }, - handleCheckedExceptionChange (value) { - const checkedCount = value.length - this.checkAll = checkedCount === this.exceptionType.length - this.isIndeterminate = checkedCount > 0 && checkedCount < this.exceptionType.length - this.$emit('submitValue',this.checkedList) -} - } + handleCheckedExceptionChange(value) { + const checkedCount = value.length + this.checkAll = checkedCount === this.exceptionType.length + this.isIndeterminate = checkedCount > 0 && checkedCount < this.exceptionType.length + this.$emit('submitValue', this.checkedList) + } + } } </script> <template> <div class="excption"> <h1 class="exception-text">寮傚父绫诲瀷锛�</h1> - <el-checkbox - v-model="checkAll" - :indeterminate="isIndeterminate" - @change="handleCheckAllChange" - class="select-text" - >鍏ㄩ��</el-checkbox - > - <el-checkbox-group v-model="checkedList" @change="handleCheckedExceptionChange"> - <el-checkbox :label="item" v-for="item in exceptionType" :key="item"> - <template #default> - <!-- <div style="display: flex; flex-flow: row wrap;"> --> - <span v-if="item == '0'">鏂數鎴栨柇缃�</span> - <span v-else-if="item == '1'">鏁版嵁瓒呬綆</span> - <span v-else-if="item == '2'">瓒呮爣</span> - <span v-else-if="item == '3'">鏁版嵁闀挎椂娈垫棤娉㈠姩</span> - <span v-else-if="item == '4'">閲忕骇绐佸彉寮傚父</span> - <span v-else-if="item == '5'">涓磋繎瓒呮爣寮傚父</span> - <span v-else-if="item == '6'">鍗曟棩瓒呮爣娆℃暟涓寸晫寮傚父</span> - <span v-else-if="item == '7'">婊戝姩骞冲潎鍊肩獊鍙�</span> - <!-- </div> --> - </template> - </el-checkbox> - </el-checkbox-group> + <el-checkbox + v-model="checkAll" + :indeterminate="isIndeterminate" + @change="handleCheckAllChange" + class="select-text" + :disabled="isDisabled" + >鍏ㄩ��</el-checkbox + > + <el-checkbox-group v-model="checkedList" @change="handleCheckedExceptionChange" :disabled="isDisabled"> + <el-checkbox :label="item" v-for="item in exceptionType" :key="item" > + <template #default> + <!-- <div style="display: flex; flex-flow: row wrap;"> --> + <span v-if="item == '0'">鏁版嵁缂哄け</span> + <span v-else-if="item == '1'">鏁版嵁瓒呬綆</span> + <span v-else-if="item == '2'">瓒呮爣</span> + <span v-else-if="item == '3'">鏁版嵁闀挎椂娈垫棤娉㈠姩</span> + <span v-else-if="item == '4'">閲忕骇绐佸彉寮傚父</span> + <span v-else-if="item == '5'">涓磋繎瓒呮爣寮傚父</span> + <span v-else-if="item == '6'">鍗曟棩瓒呮爣娆℃暟涓寸晫寮傚父</span> + <span v-else-if="item == '7'">鍙樺寲瓒嬪娍寮傚父</span> + <span v-else-if="item == '8'">鏈夋晥鐜囧紓甯�</span> + <!-- </div> --> + </template> + </el-checkbox> + </el-checkbox-group> </div> </template> <style lang="scss" scoped> .excption { - display: flex; + display: flex; } .exception-text { font-size: 14px; @@ -103,4 +124,4 @@ margin-top: 5px; margin-right: 5px; } -</style> \ No newline at end of file +</style> diff --git a/src/sfc/StreetInfo.vue b/src/sfc/StreetInfo.vue new file mode 100644 index 0000000..8806c2a --- /dev/null +++ b/src/sfc/StreetInfo.vue @@ -0,0 +1,90 @@ +<!-- 琛楅晣绫诲瀷 + + **鐖剁粍浠� + <AreaAndmonitorType ></AreaAndmonitorType> +--> +<script> +import siteInfo from '@/api/site/siteInfo.js' +export default { + emits: ['submitStreetValue'], + + data() { + return { + // 宸查�夎閬� + street: [], + // 杩愮淮鍟嗗垪琛� + optionStreet: [], + loading:false + } + }, + mounted() { + // 鏌ヨ鎵�鏈夌殑杩愮淮鍟� + // this.fetchStreetInfo() + }, + methods: { + /** + * 鏌ヨ鎵�鏈夌殑杩愮淮鍟� + * @param锛� + */ + fetchStreetInfo(streetName) { + if (streetName) { + this.loading = true + siteInfo.queryStreet(streetName).then((response) => { + response.data.data.forEach((item) => { + this.optionStreet.push(item.address) + }) + this.loading = false + }) + + } else { + this.optionStreet = [] + } + + } + } +} +</script> + +<template> + <div class="container"> + <div> + <el-text class="text">琛楅晣锛�</el-text> + <el-select + v-model="street" + multiple + filterable + remote + reserve-keyword + placeholder="璇疯緭鍏ヨ闀�" + remote-show-suffix + collapse-tags + collapse-tags-tooltip + :max-collapse-tags="1" + :remote-method="fetchStreetInfo" + :loading="loading" + @change="$emit('submitStreetValue', this.street)" + > + <el-option + v-for="item in optionStreet" + :key="item" + :label="item" + :value="item" + /> + </el-select> + </div> + </div> +</template> + +<style scoped> +.el-select { + width: 170px; +} +.container { + display: flex; +} + +.text { + color: #333333; + font-size: 14px; +} +</style> diff --git a/src/sfc/TimeShortCuts.vue b/src/sfc/TimeShortCuts.vue index d3f1c54..6790532 100644 --- a/src/sfc/TimeShortCuts.vue +++ b/src/sfc/TimeShortCuts.vue @@ -22,7 +22,7 @@ export default { props: { beginAndEndTime:{ - type:Object, + type:Array, default: ()=>{ return [] } @@ -30,6 +30,11 @@ timeType: { type: String, default: 'month' + }, + // 鏄惁璁剧疆鍙灞炴�� + readOnly: { + type: Boolean, + default:false } }, emits: ['submitTime'], @@ -196,8 +201,10 @@ :disabled-date="judgeDateValid" @change="$emit('submitTime', time)" :default-time = "defaultTime" - + :readonly="readOnly" /> + + </div> </div> </template> diff --git a/src/stores/user.js b/src/stores/user.js new file mode 100644 index 0000000..51b1b60 --- /dev/null +++ b/src/stores/user.js @@ -0,0 +1,21 @@ +// 鍔犺浇鐘舵�佺殑閫昏緫绠$悊 + +import { defineStore } from 'pinia' + +export const useLoginUserStore = defineStore('loginUser',() => { + // 褰撳墠鐧婚檰鐨勭敤鎴峰悕 + const currentLoginUser = ref('-1') + // 淇敼 + function setUser(user) { + currentLoginUser.value = user + } + + + + const getUserName = computed(()=>{ + return currentLoginUser.value == '-1' ? localStorage.getItem('currentUserName'): currentLoginUser.value + }) + return {currentLoginUser,setUser,getUserName} +}) + + diff --git a/src/utils/chartFunction/exceptionOption.js b/src/utils/chartFunction/exceptionOption.js new file mode 100644 index 0000000..dde1fd9 --- /dev/null +++ b/src/utils/chartFunction/exceptionOption.js @@ -0,0 +1,628 @@ +/** 寮傚父鏁版嵁鐨勬姌绾垮浘 */ + +export default { + /** + * 璁剧疆9绉嶅紓甯告姌绾垮浘 + * @param锛歺杞存椂闂达紝 y杞存补鐑熸祿搴� + * @param锛氬紓甯稿紑濮嬫椂闂达紝寮傚父缁撴潫鏃堕棿锛屽紓甯稿紑濮嬫椂闂村湪鏁翠釜鍖洪棿鐨勭储寮曚笅鏍囷紝寮傚父缁撴潫鏃堕棿鍦ㄦ暣涓尯闂寸殑绱㈠紩涓嬫爣锛岄鑹茶儗鏅殑鍖洪棿瀵硅薄缁撴瀯 + * @param锛氬紓甯哥被鍨� + * @returns锛� + */ + setExceptionChartOption( + xData, + yData, + exceptionBeginTime, + exceptionEndTime, + beginIndex, + endIndex, + exceptionName, + areaObj, + exceptionType + ) { + switch (exceptionType) { + case '0': + return this.missingDataOption( + xData, + yData, + exceptionBeginTime, + exceptionEndTime, + exceptionName + ) + case '1': + return this.ultraLowOption(xData, yData, beginIndex, endIndex, exceptionName) + case '2': + return this.exceedingOption( + xData, + yData, + exceptionBeginTime, + exceptionEndTime, + beginIndex, + endIndex, + exceptionName + ) + + case '3': + return this.longtimeUnchangedOption( + xData, + yData, + exceptionBeginTime, + exceptionEndTime, + beginIndex, + endIndex, + exceptionName + ) + case '4': + case '5': + case '6': + case '7': + return this.exception4567TypeOption( + xData, + yData, + exceptionBeginTime, + exceptionEndTime, + beginIndex, + endIndex, + exceptionName + ) + case '8': + return this.validOption(xData, yData, exceptionName, areaObj) + } + }, + + /** + * 鏁版嵁缂哄け + * @param锛� + * @returns锛� + */ + missingDataOption(xData, yData, exceptionBeginTime, exceptionEndTime, exceptionName) { + return { + title: { + text: exceptionName, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + tooltip: {}, + toolbox: { + // 宸ュ叿鏍� + feature: { + // 淇濆瓨涓哄浘鐗� + 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, + markLine: { + silent: true, + data: [ + // 鏍囨敞鏃犳暟鎹椂闂存鐨勬晥鏋滐紝灏嗚繖涓椂闂存鐨勬暟杞撮儴鍒嗗彉涓虹孩鑹� + { + name: '鏃犳暟鎹�', + xAxis: exceptionBeginTime + }, + { + xAxis: exceptionEndTime + } + ], + lineStyle: { + color: 'red' + } + } + } + ] + } + }, + + /** + * 瓒呮爣 + * @param锛� + * @returns锛� + */ + exceedingOption( + xData, + yData, + exceptionBeginTime, + exceptionEndTime, + beginIndex, + endIndex, + exceptionName + ) { + return { + title: { + text: exceptionName, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + tooltip: {}, + toolbox: { + // 宸ュ叿鏍� + feature: { + // 淇濆瓨涓哄浘鐗� + 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.map((item) => { + if (item >= 1) { + return { + value: item, + itemStyle: { + color: 'red' + } + } + } + return item + }), + // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹� + markArea: { + itemStyle: { + color: 'rgba(255, 173, 177, 0.4)' + }, + data: [ + [ + { + name: '寮傚父鏃堕棿娈�', + xAxis: exceptionBeginTime + }, + { + xAxis: exceptionEndTime + } + ] + ] + }, + markLine: { + symbol: 'none', + itemStyle: { + // 鍩虹嚎鍏叡鏍峰紡 + normal: { + lineStyle: { + type: 'dashed' + }, + label: { + show: true, + position: 'end', + formatter: '{b}' + } + } + }, + data: [ + { + name: '瓒呮爣', + type: 'average', + yAxis: 1, + lineStyle: { + // color: '#ff0000' + color: 'red' + } + } + ] + } + } + ], + // 鎸囧畾鏃堕棿鍖洪棿鐨勭嚎娈靛彉棰滆壊 + visualMap: { + show: false, + dimension: 0, + pieces: [ + { + lte: beginIndex, + color: 'green' + }, + { + gt: beginIndex, + lte: endIndex, + color: 'red' + }, + { + gt: endIndex, + lte: xData.length - 1, + color: 'green' + } + ] + } + } + }, + + /** + * 鏁版嵁瓒呬綆 + * @param锛� + * @returns锛� + */ + ultraLowOption(xData, yData, beginIndex, endIndex, exceptionName) { + return { + title: { + text: exceptionName, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + tooltip: {}, + toolbox: { + // 宸ュ叿鏍� + feature: { + // 淇濆瓨涓哄浘鐗� + 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.map((item) => { + if (item <= 0.01) { + return { + value: item, + itemStyle: { + color: 'red' + } + } + } + return item + }), + + markLine: { + symbol: 'none', + itemStyle: { + // 鍩虹嚎鍏叡鏍峰紡 + normal: { + lineStyle: { + type: 'dashed' + }, + label: { + show: true, + position: 'end', + formatter: '{b}' + } + } + }, + data: [ + { + name: '鏁版嵁瓒呬綆', + type: 'average', + yAxis: 0.01, + lineStyle: { + // color: '#ff0000' + color: 'red' + } + } + ] + } + } + ], + // 鎸囧畾鏃堕棿鍖洪棿鐨勭嚎娈靛彉棰滆壊 + visualMap: { + show: false, + dimension: 0, + pieces: [ + { + lte: beginIndex, + color: 'green' + }, + { + gt: beginIndex, + lte: endIndex, + color: 'red' + }, + { + gt: endIndex, + lte: xData.length - 1, + color: 'green' + } + ] + } + } + }, + + /** + * 闀挎椂闂存棤娉㈠姩 + * @param锛� + * @returns锛� + */ + longtimeUnchangedOption( + xData, + yData, + exceptionBeginTime, + exceptionEndTime, + beginIndex, + endIndex, + exceptionName + ) { + return { + title: { + text: exceptionName, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + tooltip: {}, + toolbox: { + // 宸ュ叿鏍� + feature: { + // 淇濆瓨涓哄浘鐗� + 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.map((item) => { + if (item >= 1) { + return { + value: item, + itemStyle: { + color: 'red' + } + } + } + return item + }), + // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹� + 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' + } + ] + } + } + }, + + /** + * 閲忕骇绐佸彉 涓磋繎瓒呮爣寮傚父 鍗曟棩瓒呮爣娆℃暟涓寸晫寮傚父 鍙樺寲瓒嬪娍寮傚父 + * @param锛� + * @returns锛� + */ + exception4567TypeOption( + xData, + yData, + exceptionBeginTime, + exceptionEndTime, + beginIndex, + endIndex, + exceptionName + ) { + return { + title: { + text: exceptionName, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + tooltip: {}, + toolbox: { + // 宸ュ叿鏍� + feature: { + // 淇濆瓨涓哄浘鐗� + 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' + } + ] + } + } + }, + + /** + * 鏈夋晥鐜� + * @param锛� + * @returns锛� + */ + validOption(xData, yData, exceptionName, areaObj) { + return { + title: { + text: exceptionName, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + 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, + // yData.map((item) => { + // if (item >= 1) { + // return { + // value: item, + // itemStyle: { + // color: 'red' + // } + // } + // } + // return item + // }), + // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹� + markArea: { + itemStyle: { + color: 'rgba(255, 173, 177, 0.4)' + }, + data: areaObj + } + } + ] + } + } +} diff --git a/src/utils/chartFunction/lineChart.js b/src/utils/chartFunction/lineChart.js index 6c0c2fd..8c06873 100644 --- a/src/utils/chartFunction/lineChart.js +++ b/src/utils/chartFunction/lineChart.js @@ -113,8 +113,12 @@ return result }, - // 缁勬垚鏃犳暟鎹尯鍩� - getMarkArea(timeInteval) { + /** + * 缁勬垚鏃犳暟鎹尯鍩� + * @param锛� 2缁存暟缁� + * @returns锛� + */ + getMarkArea(timeInteval,describe='鏃犳暟鎹�') { let result = [] for (let i = 0; i < timeInteval.length; i++) { let temp = [] @@ -122,7 +126,7 @@ let obj = {} // 缁欑涓�涓璞″姞涓妌ame灞炴�� if (j == 0) { - obj.name = '鏃犳暟鎹�' + obj.name = describe } obj.xAxis = timeInteval[i][j] temp.push(obj) diff --git a/src/utils/chartFunction/temp.js b/src/utils/chartFunction/temp.js new file mode 100644 index 0000000..3a0b1b4 --- /dev/null +++ b/src/utils/chartFunction/temp.js @@ -0,0 +1,18 @@ +/* 椋炶宸℃椤甸潰鐨勫嚱鏁� */ + + +import historyApi from '@/api/historyApi.js' +export default { + + async getHistoryData(siteName, beginTime, endTime) { + + const hData = await historyApi.queryHistoryData({ + siteName: siteName, + beginTime: beginTime, + endTime:endTime + }) + + + } + +} \ No newline at end of file diff --git a/src/utils/exception_common_function/index.js b/src/utils/exception_common_function/index.js index 0311b9b..3e40bbb 100644 --- a/src/utils/exception_common_function/index.js +++ b/src/utils/exception_common_function/index.js @@ -1,5 +1,9 @@ import dayjs from 'dayjs' export default { + + + + /** * description锛氳繑鍥炴椂闂存暟缁勶紝闂撮殧15鍒嗛挓銆� * @param锛� 寮傚父鐨勫紑濮�,寮傚父缁撴潫鏃堕棿 @@ -14,7 +18,7 @@ } time.push(begin); let temp = dayjs(begin).add(15, 'minute').format('YYYY-MM-DD HH:mm:ss'); - while (temp != end) { + while (temp >= end) { time.push(temp); temp = dayjs(temp).add(15, 'minute').format('YYYY-MM-DD HH:mm:ss'); } diff --git a/src/utils/time.js b/src/utils/time.js index ec7eeb8..c416595 100644 --- a/src/utils/time.js +++ b/src/utils/time.js @@ -1,19 +1,146 @@ +/* 鏃堕棿鍑芥暟 */ import dayjs from 'dayjs' +import lineChart from '@/utils/chartFunction/lineChart.js' export default { + // 鍒ゆ柇宸查�夌殑鏈堜唤鏄惁澶т簬褰撳墠鏈堜唤 + judgeDateValid(date) { + // 鑾峰緱褰撴湀鏈堜唤 + let currentMonth = dayjs() + let selectMonth = date.getTime() + // 閫夋嫨澶т簬鐜板湪鏈堜唤 + if (selectMonth > currentMonth) { + return true + } - - // 鍒ゆ柇宸查�夌殑鏈堜唤鏄惁澶т簬褰撳墠鏈堜唤 - judgeDateValid(date){ - // 鑾峰緱褰撴湀鏈堜唤 - let currentMonth = dayjs() - let selectMonth = date.getTime() - // 閫夋嫨澶т簬鐜板湪鏈堜唤 - if(selectMonth > currentMonth){ - return true - } + return false + }, - return false - } + /** + * 鍒ゆ柇涓や釜鏃ユ湡鏄惁鐩稿樊鎸囧畾鐨勫垎閽熸暟 + * @param锛� + * @returns锛� + */ + isTimeOverFifty(time1, time2, minutes = 15) { + let t1 = dayjs(time1) + let t2 = dayjs(time2) -} \ No newline at end of file + let timeDifferce = Math.abs(t1.diff(t2, 'minute')) + if (timeDifferce <= minutes) { + return false + } + return true + }, + + /** + * 鏍规嵁鎸囧畾鐨勫垎閽熼棿闅旓紝鍒掑垎璧峰鏃堕棿 + * @param锛氬紑濮嬫椂闂� 缁撴潫鏃堕棿 闂撮殧鍒嗛挓鏁� + * @returns锛� + */ + ascTime(beginTime, endTime, intervalMinute = 15) { + if (beginTime >= endTime) { + return [] + } + + let time = [] + time.push(beginTime) + let bt = dayjs(beginTime).add(intervalMinute, 'minute') + let et = dayjs(endTime) + + while (bt < et) { + time.push(bt.format('YYYY-MM-DD HH:mm:ss')) + bt = dayjs(bt).add(intervalMinute, 'minute') + } + return time + }, + + /** + * 杩斿洖flag涓嶇瓑浜嶯鐨勬椂闂寸偣鍜屾暟鎹己澶辩殑鏃堕棿鐐� + * @param锛氭壃灏樻暟鎹紝鍗囧簭鐨勬椂闂村瓧绗︿覆鏁扮粍(鎺ュ彛涓繑鍥炵殑宸茬粡鏄崌搴�) + * @returns锛氬崌搴忕殑鏃堕棿鐐� + */ + invalidTime(dustData, timeArr) { + // 鍙傛暟涓虹┖鍒欓��鍑� + if (!dustData.length || !timeArr.length) { + return [] + } + + let time = [] + timeArr.forEach((item) => { + let r = lineChart.findDate(dustData, item) + // 娌℃湁鎵惧埌瀵瑰簲鏃堕棿鐨勬暟鎹� + if (r == false) { + // 灏嗚鏃堕棿鍔犲叆鏁扮粍 + time.push(item) + } + + // 鎵惧埌瀵瑰簲鏃堕棿鐨勬暟鎹紝骞朵笖璇ユ暟鎹爣璇嗕笉绛変笌鈥楴鈥� + if (r && r.flag != 'N') { + // 灏嗚鏁版嵁鐨勯噰闆嗘椂闂村姞鍏ユ暟缁� + time.push(r.lst) + } + }) + + return time + }, + + /** + * 鍙栨寚瀹氶棿闅旂殑鏃堕棿涓鸿繛缁椂闂达紝鏀惧湪鏁扮粍涓�� 瀛ょ珛鐨勬椂闂寸偣涓庤嚜韬畻涓�涓繛缁� + * 鐩殑鏄瀯閫犳湁鏁堢巼缂哄け鐨勯鑹茶儗鏅尯闂� + * @param锛氭椂闂村瓧绗︿覆鏁扮粍 + * @returns锛歔 ['2023-11-02 00:00:00','2023-11-02 00:15:00','2023-11-02 00:30:00']] + */ + seriesTime(timeArr, intervalMinute = 15) { + let temp = [] + let temp_1 = [] + for (let i = 0; i < timeArr.length; i++) { + // 褰撳墠鏃堕棿 + let currentTime = timeArr[i] + if (i === 0) { + temp_1.push(currentTime) + continue + } + // 鍓嶄竴涓� + let pre = timeArr[i - 1] + + // 瓒呰繃15鍒嗛挓 + if (this.isTimeOverFifty(pre, currentTime, intervalMinute)) { + // 鍒楄〃涓鸿繛缁椂闀夸负鑷韩 + temp.push(temp_1) + temp_1 = [currentTime] + } + // 涓嶈秴杩�15鍒嗛挓 + else { + temp_1.push(currentTime) + } + } + + if (temp_1.length > 0) { + temp.push(temp_1) + } + + // 鏁寸悊鏁版嵁 + let temp_2 = [] + for (let i = 0; i < temp.length; i++) { + if (temp[i].length == 1) { + temp_2.push([temp[i][0], temp[i][0]]) + } else if (temp[i].length > 1) { + temp_2.push([temp[i][0], temp[i][temp[i].length - 1]]) + } + } + + return temp_2 + }, + + splitTime(timeArr) { + let result = [] + for (let i = 0; i < timeArr.length; i++) { + let temp = [] + for (let j = 0; j < timeArr[i].length; j++) { + temp.push(timeArr[i][j].slice(11, -3)) + } + result.push(temp) + } + return result + } +} diff --git a/src/views/data_management/DataAccessManagement.vue b/src/views/data_management/DataAccessManagement.vue index 97d10b7..6a27f86 100644 --- a/src/views/data_management/DataAccessManagement.vue +++ b/src/views/data_management/DataAccessManagement.vue @@ -6,7 +6,8 @@ data() { return { async: '鏈畬鎴�....', - normal: '鏈彉鍖�....' + normal: '鏈彉鍖�....', + count:0 } }, mounted() { @@ -98,12 +99,23 @@ this.bill.exceptionRecurrence = obj['exceptionRecurrence'] this.bill.exceptionTypeAggregation = obj['exceptionTypeAggregation'] }) - } + }, + + + increment(){ + this.count++ + console.log(document.getElementById('but').textContent) + nextTick(()=>{ + console.log('abc',document.getElementById('but').textContent) + }) + + } } } </script> <template> + <el-button id="but" @click="increment" >{{count}} </el-button> <div> <!-- 鐐瑰嚮"鑾峰彇鏁版嵁"鍚�,姣忛殧涓�涓皬鏃舵墽琛屼竴娆� --> </div> diff --git a/src/views/data_management/HistoryData.vue b/src/views/data_management/HistoryData.vue index f6fcc1a..9679a7f 100644 --- a/src/views/data_management/HistoryData.vue +++ b/src/views/data_management/HistoryData.vue @@ -52,7 +52,9 @@ // 宸查�変腑鐨勫満鏅被鍨� scenarioType: [], // 琛ㄦ牸楂樺害 - tableHeight: '500' + tableHeight: '500', + // 绔欑偣鎬绘暟閲� + siteNums:0 }; }, setup() { @@ -220,9 +222,10 @@ </el-form-item> <el-form-item> - <InputSearch isNeedDefaultSite="1" @submit-value="(n) => (form.name = n) "> + <InputSearch isNeedDefaultSite="1" @submit-value="(n) => (form.name = n)" @submit-site-nums="(n)=>(siteNums=n)"> </InputSearch> </el-form-item> + <el-form-item> <template #label> <span class="font-label">璁惧缂栧彿:</span> @@ -248,12 +251,21 @@ </div> <div class="button-and-export"> <el-form-item> + <el-tag class="ml-2" type="success" size="large">绔欑偣鎬绘暟</el-tag> + <span class="tag-text">{{ siteNums }}</span> + </el-form-item> + + <el-form-item> <ButtonClick style="margin-right: 12px;" content="鎼滅储" type="primary" :loading="queryButton" @do-search="handleSubmit"></ButtonClick> <ButtonExportExcel content="瀵煎嚭鏁版嵁" type="success" :loading="exportButton" @do-export="exportDom"></ButtonExportExcel> </el-form-item> </div> </el-form> + </el-card> + </el-col> + <el-col> + </el-col> </el-row> @@ -264,12 +276,12 @@ v-loading="loading"> <!--缁戝畾涓�涓柟娉曪紝灏嗚繑鍥炲�艰祴缁檌ndex,鍗宠〃鏍兼瘡琛屾暟鎹殑涓嬫爣--> <el-table-column type="index" label="搴忓彿" align="center" fixed :index="indexMethod"></el-table-column> - <el-table-column prop="name" label="绔欑偣鍚嶇О" show-overflow-tooltip></el-table-column> + <el-table-column prop="name" label="鐐逛綅鍚嶇О" show-overflow-tooltip></el-table-column> <el-table-column prop="address" label="鍦板潃" align="center" show-overflow-tooltip></el-table-column> - <el-table-column prop="dutyCompany" label="渚涘簲鍟�" align="center" show-overflow-tooltip></el-table-column> - <el-table-column prop="mnCode" label="璁惧缂栧彿" show-overflow-tooltip></el-table-column> + <el-table-column prop="dutyCompany" label="杩愮淮鍟�" align="center" show-overflow-tooltip></el-table-column> + <el-table-column prop="mnCode" label="璁惧缂栫爜" show-overflow-tooltip></el-table-column> <el-table-column prop="typeName" label="绫诲瀷" align="center" show-overflow-tooltip></el-table-column> - <el-table-column prop="dustValue" label="鎵皹娴撳害(mg/m鲁)" align="center" sortable + <el-table-column prop="dustValue" label="TSP(mg/m鲁)" align="center" sortable show-overflow-tooltip></el-table-column> <el-table-column prop="noiseValue" label="鍣0(dB)" align="center" sortable show-overflow-tooltip></el-table-column> <el-table-column prop="lst" label="閲囬泦鏃堕棿" sortable align="center" show-overflow-tooltip></el-table-column> @@ -321,7 +333,8 @@ .button-and-export { display: flex; - justify-content: flex-end; + /* justify-content: flex-end; */ + justify-content: space-between; /* 浠庤灏句綅缃紑濮嬫帓鍒� */ } @@ -332,4 +345,8 @@ .el-pagination { margin: 10px 10px; } +.tag-text{ + margin-left: 10px; + font-size: 14px; +} </style> diff --git a/src/views/exception/FlightInspection.vue b/src/views/exception/FlightInspection.vue index 786f0ca..52d9f51 100644 --- a/src/views/exception/FlightInspection.vue +++ b/src/views/exception/FlightInspection.vue @@ -11,14 +11,21 @@ import dayjs from 'dayjs' import { ElMessage } from 'element-plus' import AnalysisCard from './components/AnalysisCard.vue' - +import DutyCompany from '@/sfc/DutyCompany.vue' +import StreetInfo from '@/sfc/StreetInfo.vue' +import historyApi from '@/api/historyApi.js' +import time from '@/utils/time.js' +import lineChart from '@/utils/chartFunction/lineChart.js' +import exceptionOption from '@/utils/chartFunction/exceptionOption.js' export default { components: { TimeShortCuts, DustLineChart, ButtonClick, AreaAndmonitorType, - AnalysisCard + AnalysisCard, + DutyCompany, + StreetInfo }, data() { return { @@ -26,6 +33,10 @@ form: { // 绔欑偣鍚嶇О name: '', + // 杩愮淮鍟� + dutyCompany: [], + // 琛楅亾 + street: [], // 閫夋嫨鐨勫紓甯哥被鍨� exceptionName: [] }, @@ -39,6 +50,8 @@ tableHeight: 400, // 琛ㄦ牸鏄剧ず isTableShow: false, + // 瀹℃牳杈呭姪鎸夐挳鏄剧ず + auditButton: false, // 褰撳墠椤� currentPage: 1, // 姣忛〉鏉℃暟 @@ -55,7 +68,8 @@ exception4: true, exception5: true, exception6: true, - exception7: true + exception7: true, + exception8: true }, // eslint-disable-next-line no-undef // 瀵硅瘽妗嗘樉绀� @@ -78,6 +92,8 @@ exception6: [], // 婊戝姩骞冲潎鍊煎紓甯� exception7: [], + // 鏈夋晥鐜囧紓甯� + exception8: [], // 璇ユ椂娈电殑寮傚父鏁伴噺 exception0Num: 0, @@ -87,7 +103,8 @@ exception4Num: 0, exception5Num: 0, exception6Num: 0, - exception7Num: 0 + exception7Num: 0, + exception8Num: 0 }, // 绔欑偣鎬绘暟閲� siteTotal: 0, @@ -131,7 +148,8 @@ banTouch: 0, // 0浠h〃鍒嗛〉锛�1浠h〃涓嶅垎椤� originClick: 0 - } + }, + areaColor: null } }, setup() { @@ -188,7 +206,8 @@ this.exception.exception4Num + this.exception.exception5Num + this.exception.exception6Num + - this.exception.exception7Num + this.exception.exception7Num + + this.exception.exception8Num if (sum == 0) { return 1 } else { @@ -204,7 +223,8 @@ this.exception.exception4Num + this.exception.exception5Num + this.exception.exception6Num + - this.exception.exception7Num + this.exception.exception7Num + + this.exception.exception8Num if (sum == 0) { return 0 } else { @@ -216,7 +236,8 @@ (this.exception.exception4Num / this.exceptionAllNum) * 100 - (this.exception.exception5Num / this.exceptionAllNum) * 100 - (this.exception.exception6Num / this.exceptionAllNum) * 100 - - (this.exception.exception7Num / this.exceptionAllNum) * 100 + (this.exception.exception7Num / this.exceptionAllNum) * 100 - + (this.exception.exception8Num / this.exceptionAllNum) * 100 ).toFixed(1) } }, @@ -249,7 +270,11 @@ siteNum: this.exception.exception6.length, exceptionNum: this.exception.exception6Num, isNoDataStatus: this.isNoData.exception6 - }, + } + ] + }, + cardRow2() { + return [ { siteName: this.exception.exception7, exceptionType: '7', @@ -258,11 +283,7 @@ siteNum: this.exception.exception7.length, exceptionNum: this.exception.exception7Num, isNoDataStatus: this.isNoData.exception7 - } - ] - }, - cardRow2() { - return [ + }, { siteName: this.exception.exception0, exceptionType: '0', @@ -280,7 +301,11 @@ siteNum: this.exception.exception1.length, exceptionNum: this.exception.exception1Num, isNoDataStatus: this.isNoData.exception1 - }, + } + ] + }, + cardRow3() { + return [ { siteName: this.exception.exception2, exceptionType: '2', @@ -298,6 +323,15 @@ siteNum: this.exception.exception3.length, exceptionNum: this.exception.exception3Num, isNoDataStatus: this.isNoData.exception3 + }, + { + siteName: this.exception.exception8, + exceptionType: '8', + exceptionName: '鏈夋晥鐜囧紓甯�', + iconSrc: '@/assets/exception/exception3.png', + siteNum: this.exception.exception8.length, + exceptionNum: this.exception.exception8Num, + isNoDataStatus: this.isNoData.exception8 } ] } @@ -307,9 +341,63 @@ // 鏌ヨ鏃堕棿娈电殑鍚勫紓甯哥殑绔欑偣锛屾煡璇㈣鏃堕棿鍖洪棿鐨勫悇寮傚父鏁伴噺 this.getShopNames() this.getSiteNume() + + let a = [ + ['2023-10-01 11:45:00', '2023-10-01 13:45:00'], + ['2023-10-01 11:45:00', '2023-10-01 12:45:00'] + ] + + let b = time.splitTime(a) + console.log('鏃堕棿锛�', b) }, methods: { + /** + * 鏈夋晥鐜囧紓甯� 璁剧疆鎶樼嚎鍥鹃厤缃」 + * @param锛� + * @returns锛� + */ + validProcess() { + // x杞存暟鎹� + let xList = time.ascTime( + this.tableCurrentRowData.beginTime, + this.tableCurrentRowData.endTime, + 15 + ) + + // y杞存暟鎹� + let yList = [] + xList.forEach((item) => { + // 鏌ユ壘璇ユ椂闂寸殑鏁版嵁 + let r = lineChart.findDate(this.dialog.historyData, item) + if (r) { + yList.push(r.dustValue) + } else { + yList.push(null) + } + }) + // 棰滆壊鑳屾櫙鍖洪棿 + // 寰楀埌鏃犳暟鎹殑鏃堕棿鐐规垨flag涓嶇瓑浜嶯鐨勬椂闂寸偣 + let noDataTime = time.invalidTime(this.dialog.historyData, xList) + let rangeTime = time.seriesTime(noDataTime, 15) + // let rangeTime_1 = time.splitTime(rangeTime) + // 寰楀埌鑳屾櫙鍖洪棿鐨勯厤缃� + let areaObj = lineChart.getMarkArea(rangeTime, '寮傚父') + + // 浼犲叆鍙傛暟 + this.dialog.option = exceptionOption.setExceptionChartOption( + xList, + yList, + '', + '', + '', + '', + this.tableCurrentRowData.exception, + areaObj, + this.tableCurrentRowData.exceptionType + ) + }, + getImageUrl(name) { return new URL(`../../lib/Carousel/assets/${name}`, import.meta.url).href }, @@ -380,7 +468,8 @@ otherExceptionRequest(allTimeArgs, allTime, exceptionBT, exceptionET) { // 鎶樼嚎鍥惧姞杞戒腑鏁堟灉 this.loading.lineChart = true - this.$http.get('/dust/history', { params: allTimeArgs }).then((result) => { + + historyApi.queryHistoryData(allTimeArgs).then((result) => { this.dialog.allExceptionTimeData = result.data.data // 鏁版嵁缂哄け寮傚父鏃堕噸鏂拌缃〃鏍� if (this.tableCurrentRowData.exceptionType == '0') { @@ -393,7 +482,7 @@ let dustValue = [] let timeAndValue = {} - // 浠庢坊鍔犱簡棣栦綅鍖洪棿鐨勫紑濮嬪拰缁撴潫鏃堕棿杩涜閬嶅巻 淇濊瘉鏃堕棿浠�10鍒嗛挓涓洪棿闅� + // 浠庢坊鍔犱簡棣栦綅鍖洪棿鐨勫紑濮嬪拰缁撴潫鏃堕棿杩涜閬嶅巻 淇濊瘉鏃堕棿浠�15鍒嗛挓涓洪棿闅� timeAndValue = index.keepContinuousByEachFiftyMinutes( allTime[0], allTime[3], @@ -407,483 +496,26 @@ let endIndex = dateList.findIndex((item) => item === exceptionET) // 璁剧疆鎶樼嚎鍥鹃厤缃」 - this.reSetChart(dateList, dustValue, exceptionBT, exceptionET, startIndex, endIndex) + // this.reSetChart(dateList, dustValue, exceptionBT, exceptionET, startIndex, endIndex) + this.dialog.option = exceptionOption.setExceptionChartOption( + dateList, + dustValue, + exceptionBT, + exceptionET, + startIndex, + endIndex, + this.tableCurrentRowData.exception, + '', + this.tableCurrentRowData.exceptionType + ) + this.flag.banTouch = 0 this.loading.lineChart = false }) + + + }, - /** - * description锛氱粯鍒舵姌绾垮浘 - * @param锛� x杞存椂闂达紝 y杞存补鐑熸祿搴︼紝 寮傚父寮�濮嬫椂闂达紝寮傚父缁撴潫鏃堕棿锛屽紓甯稿紑濮嬫椂闂村湪鏁翠釜鍖洪棿鐨勭储寮曚笅鏍囷紝寮傚父缁撴潫鏃堕棿鍦ㄦ暣涓尯闂寸殑绱㈠紩涓嬫爣 - */ - reSetChart(xData, yData, exceptionBeginTime, exceptionEndTime, beginIndex, endIndex) { - this.dialog.option = {} - switch (this.tableCurrentRowData.exceptionType) { - // 鏂數鎴栨柇缃� 鏃堕棿娈� - case '0': - this.dialog.option = { - title: { - text: this.tableCurrentRowData.exception, - left: '1%', - textStyle: { - fontSize: 14 - } - }, - 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, - markLine: { - silent: true, - data: [ - // 鏍囨敞鏃犳暟鎹椂闂存鐨勬晥鏋滐紝灏嗚繖涓椂闂存鐨勬暟杞撮儴鍒嗗彉涓虹孩鑹� - { - name: '鏃犳暟鎹�', - xAxis: exceptionBeginTime - }, - { - xAxis: exceptionEndTime - } - ], - lineStyle: { - color: 'red' - } - } - } - ] - } - break - // 瓒呮爣 - case '2': - this.dialog.option = { - title: { - text: this.tableCurrentRowData.exception, - left: '1%', - textStyle: { - fontSize: 14 - } - }, - 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.map((item) => { - if (item >= 1) { - return { - value: item, - itemStyle: { - color: 'red' - } - } - } - return item - }), - // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹� - markArea: { - itemStyle: { - color: 'rgba(255, 173, 177, 0.4)' - }, - data: [ - [ - { - name: '寮傚父鏃堕棿娈�', - xAxis: exceptionBeginTime - }, - { - xAxis: exceptionEndTime - } - ] - ] - }, - markLine: { - symbol: 'none', - itemStyle: { - // 鍩虹嚎鍏叡鏍峰紡 - normal: { - lineStyle: { - type: 'dashed' - }, - label: { - show: true, - position: 'end', - formatter: '{b}' - } - } - }, - data: [ - { - name: '瓒呮爣', - type: 'average', - yAxis: 1, - lineStyle: { - // color: '#ff0000' - color: 'red' - } - } - ] - } - } - ], - // 鎸囧畾鏃堕棿鍖洪棿鐨勭嚎娈靛彉棰滆壊 - 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 - // 鏁版嵁瓒呬綆 鍙湁鏃堕棿鐐� - case '1': - this.dialog.option = { - title: { - text: this.tableCurrentRowData.exception, - left: '1%', - textStyle: { - fontSize: 14 - } - }, - 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.map((item) => { - if (item <= 0.01) { - return { - value: item, - itemStyle: { - color: 'red' - } - } - } - return item - }), - - markLine: { - symbol: 'none', - itemStyle: { - // 鍩虹嚎鍏叡鏍峰紡 - normal: { - lineStyle: { - type: 'dashed' - }, - label: { - show: true, - position: 'end', - formatter: '{b}' - } - } - }, - data: [ - { - name: '鏁版嵁瓒呬綆', - type: 'average', - yAxis: 0.01, - lineStyle: { - // color: '#ff0000' - color: 'red' - } - } - ] - } - } - ], - // 鎸囧畾鏃堕棿鍖洪棿鐨勭嚎娈靛彉棰滆壊 - 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 - // 鏁版嵁闀挎椂娈垫棤娉㈠姩 - case '3': - this.dialog.option = { - title: { - text: this.tableCurrentRowData.exception, - left: '1%', - textStyle: { - fontSize: 14 - } - }, - 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.map((item) => { - if (item >= 1) { - return { - value: item, - itemStyle: { - color: 'red' - } - } - } - return item - }), - // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹� - 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 - // 閲忕骇绐佸彉寮傚父 - case '4': - case '5': - case '6': - case '7': - this.dialog.option = { - title: { - text: this.tableCurrentRowData.exception, - left: '1%', - textStyle: { - fontSize: 14 - } - }, - 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: - console.log('娌℃湁璁剧疆璇ュ紓甯哥被鍨嬶紒') - } - this.flag.banTouch = 0 - }, /** * description锛氬垝鍒嗗嚭寮傚父璧峰鏃堕棿锛屾瀯閫犺姹傚墠涓悗鐨勫弬鏁� */ @@ -926,30 +558,33 @@ //寰楀埌涓婁竴琛屾暟鎹储寮� this.selectedRowIndex = this.selectedRowIndex + 1 - //璇锋眰鏁版嵁 鏀瑰彉exceedingData - // this.setinfo(this.selectedRowIndex); - // 寰楀埌涓婁竴琛岀殑鏁版嵁 this.tableCurrentRowData = this.displayData[this.selectedRowIndex] - let params = index.requestGetParms( - this.tableCurrentRowData.name, - this.tableCurrentRowData.beginTime, - this.tableCurrentRowData.endTime - ) + this.loading.preButton = true - this.$http.get('/dust/history', { params: params }).then((response) => { + + + historyApi.queryHistoryData({ + siteName:this.tableCurrentRowData.name, + beginTime:this.tableCurrentRowData.beginTime, + endTime:this.tableCurrentRowData.endTime + }).then(response => { // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� this.dialog.historyData = response.data.data this.dialog.exceptionTotal = response.data.data.length // 閫昏緫澶勭悊 - this.timeAndDataProcessed() + + if (this.tableCurrentRowData.exceptionType != '8') { + this.timeAndDataProcessed() + } else { + this.loading.lineChart = true + this.validProcess() + this.loading.lineChart = false + this.flag.banTouch = 0 + } this.loading.preButton = false }) } - - //寰楀埌涓婁竴琛屾暟鎹储寮� - // this.selectedRowIndex = this.selectedRowIndex + 1; - // this.tableCurrentRowData = this.displayData[this.selectedRowIndex] }, /** * description锛氳幏鍙栦笅涓�鏉″紓甯镐俊鎭� @@ -962,26 +597,33 @@ //寰楀埌涓婁竴琛屾暟鎹储寮� this.selectedRowIndex = this.selectedRowIndex - 1 - //璇锋眰鏁版嵁 鏀瑰彉exceedingData - // this.setinfo(this.selectedRowIndex); // 寰楀埌涓婁竴琛岀殑鏁版嵁 this.tableCurrentRowData = this.displayData[this.selectedRowIndex] - let params = index.requestGetParms( - this.tableCurrentRowData.name, - this.tableCurrentRowData.beginTime, - this.tableCurrentRowData.endTime - ) this.loading.afterButton = true - this.$http.get('/dust/history', { params: params }).then((response) => { + + historyApi.queryHistoryData({ + siteName:this.tableCurrentRowData.name, + beginTime:this.tableCurrentRowData.beginTime, + endTime:this.tableCurrentRowData.endTime + }).then(response => { // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� this.dialog.historyData = response.data.data this.dialog.exceptionTotal = response.data.data.length // 閫昏緫澶勭悊 - this.timeAndDataProcessed() + + if (this.tableCurrentRowData.exceptionType != '8') { + this.timeAndDataProcessed() + } else { + this.loading.lineChart = true + this.validProcess() + this.loading.lineChart = false + this.flag.banTouch = 0 + } this.loading.afterButton = false }) + } }, @@ -994,254 +636,135 @@ this.total = val2 }, + // 鏌ヨ寮傚父鏁版嵁鐨勭珯鐐瑰悕瀛楀拰鏁伴噺 + queryExceptionSite(url, exceptionType) { + let params = {} + params['beginTime'] = this.beginTime + params['endTime'] = this.endTime + params['exceptionType'] = exceptionType + + if (this.form.street.length != 0) { + params['street'] = this.form.street.join() + } + if (this.form.dutyCompany.length != 0) { + params['dutyCompany'] = this.form.dutyCompany.join() + } + return this.$http.get(url, { params: params }) + }, + /** * description锛氬綋鐢ㄦ埛鏀瑰彉鏌ヨ鐨勬椂闂村尯闂存椂锛屼細鏍规嵁璇ュ尯闂存煡璇㈠悇寮傚父鐨勭珯鐐癸紝鏌ヨ璇ユ椂闂村尯闂寸殑鍚勫紓甯告暟閲� * @createTime:2023-08-18 */ getShopNames() { /* 鏌ヨ寮傚父鐨勭珯鐐� */ + this.queryExceptionSite('/dust/sitenamecode', 0).then((result) => { + this.exception.exception0 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception0 = true + return + } + this.isNoData.exception0 = false + }) + this.queryExceptionSite('/dust/sitenamecode', 1).then((result) => { + this.exception.exception1 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception1 = true + return + } + this.isNoData.exception1 = false + }) + this.queryExceptionSite('/dust/sitenamecode', 2).then((result) => { + this.exception.exception2 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception2 = true + return + } + this.isNoData.exception2 = false + }) - this.$http - .get('/dust/sitenamecode', { - params: { - exceptionType: '0', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception0 = result.data.data - if (result.data.data.length == 0) { - this.isNoData.exception0 = true - return - } - this.isNoData.exception0 = false - }) - this.$http - .get('/dust/sitenamecode', { - params: { - exceptionType: '1', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception1 = result.data.data - if (result.data.data.length == 0) { - this.isNoData.exception1 = true - return - } - this.isNoData.exception1 = false - }) - this.$http - .get('/dust/sitenamecode', { - params: { - exceptionType: '2', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception2 = result.data.data - if (result.data.data.length == 0) { - this.isNoData.exception2 = true - return - } - this.isNoData.exception2 = false - }) + this.queryExceptionSite('/dust/sitenamecode', 3).then((result) => { + this.exception.exception3 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception3 = true + return + } + this.isNoData.exception3 = false + }) - this.$http - .get('/dust/sitenamecode', { - params: { - exceptionType: '3', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception3 = result.data.data - if (result.data.data.length == 0) { - this.isNoData.exception3 = true - return - } - this.isNoData.exception3 = false - }) + this.queryExceptionSite('/dust/sitenamecode', 4).then((result) => { + this.exception.exception4 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception4 = true + return + } + this.isNoData.exception4 = false + }) + this.queryExceptionSite('/dust/sitenamecode', 5).then((result) => { + this.exception.exception5 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception5 = true + return + } + this.isNoData.exception5 = false + }) + this.queryExceptionSite('/dust/sitenamecode', 6).then((result) => { + this.exception.exception6 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception6 = true + return + } + this.isNoData.exception6 = false + }) + this.queryExceptionSite('/dust/sitenamecode', 7).then((result) => { + this.exception.exception7 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception7 = true + return + } + this.isNoData.exception7 = false + }) + this.queryExceptionSite('/dust/sitenamecode', 8).then((result) => { + this.exception.exception8 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception8 = true + return + } - this.$http - .get('/dust/sitenamecode', { - params: { - exceptionType: '4', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception4 = result.data.data - if (result.data.data.length == 0) { - this.isNoData.exception4 = true - return - } - this.isNoData.exception4 = false - }) - this.$http - .get('/dust/sitenamecode', { - params: { - exceptionType: '5', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception5 = result.data.data - if (result.data.data.length == 0) { - this.isNoData.exception5 = true - return - } - this.isNoData.exception5 = false - }) - this.$http - .get('/dust/sitenamecode', { - params: { - exceptionType: '6', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception6 = result.data.data - if (result.data.data.length == 0) { - this.isNoData.exception6 = true - return - } - this.isNoData.exception6 = false - }) - this.$http - .get('/dust/sitenamecode', { - params: { - exceptionType: '7', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception7 = result.data.data - if (result.data.data.length == 0) { - this.isNoData.exception7 = true - return - } - this.isNoData.exception7 = false - }) + this.isNoData.exception8 = false + }) /* 寮傚父寮傚父鏁伴噺 */ - this.$http - .get('/dust/exceptionnum', { - params: { - exceptionType: '0', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception0Num = result.data.data - }) - this.$http - .get('/dust/exceptionnum', { - params: { - exceptionType: '1', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception1Num = result.data.data - }) - this.$http - .get('/dust/exceptionnum', { - params: { - exceptionType: '2', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception2Num = result.data.data - }) + this.queryExceptionSite('/dust/exceptionnum', 0).then((result) => { + this.exception.exception0Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum', 1).then((result) => { + this.exception.exception1Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum', 2).then((result) => { + this.exception.exception2Num = result.data.data + }) - this.$http - .get('/dust/exceptionnum', { - params: { - exceptionType: '3', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception3Num = result.data.data - }) + this.queryExceptionSite('/dust/exceptionnum', 3).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 - }) - this.$http - .get('/dust/exceptionnum', { - params: { - exceptionType: '7', - beginTime: this.beginTime, - endTime: this.endTime - } - }) - .then((result) => { - this.exception.exception7Num = result.data.data - }) + this.queryExceptionSite('/dust/exceptionnum', 4).then((result) => { + this.exception.exception4Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum', 5).then((result) => { + this.exception.exception5Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum', 6).then((result) => { + this.exception.exception6Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum', 7).then((result) => { + this.exception.exception7Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum', 8).then((result) => { + this.exception.exception8Num = result.data.data + }) }, - - /** - * description锛氳姹傚紓甯哥殑搴楅摵鍚嶅瓧 - * @param锛氬紓甯哥被鍨嬶紝寮�濮嬫椂闂达紝缁撴潫鏃堕棿 - * @returns锛� 寮傚父鐨勬暟鎹� - */ - // getSiteNameByExceptionType(exception, beginT, endT) { - // let param = { - // exceptionType: exception, - // beginTime: beginT, - // endTime: endT - // }; - - // this.$http.get('/dust/sitenamecode', { params: param }).then((res) => { - // return res.data.data; - // }); - // return; - // }, /** * description锛氭樉绀哄璇濇,杩斿洖璇ュ紓甯告椂闂存鐨勬墍鏈夋暟鎹� @@ -1261,24 +784,28 @@ //鏍规嵁褰撳墠琛岀殑缂栧彿锛岃捣濮嬫椂闂存潵 璇锋眰寮傚父鏁版嵁 // 瀵硅姹傚埌鐨勬暟鎹繘琛岄灏炬嫾鎺� // 寰楀埌鍓嶅悗瀹屾暣鏁版嵁杩涜缁樺埗鍥惧舰 - this.loading.lineChart = true - let params = {} - if (row.name) { - params['siteName'] = row.name - } - if (row.beginTime) { - params['beginTime'] = row.beginTime - } - if (row.endTime) { - params['endTime'] = row.endTime - } + + - this.$http.get('/dust/history', { params: params }).then((response) => { - this.dialog.historyData = response.data.data - this.dialog.exceptionTotal = response.data.data.length - // 閫昏緫澶勭悊 - this.timeAndDataProcessed() - }) + historyApi.queryHistoryData({ + siteName:row.name, + beginTime:row.beginTime, + endTime:row.endTime + }).then(response => { + // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� + this.dialog.historyData = response.data.data + this.dialog.exceptionTotal = response.data.data.length + // 閫昏緫澶勭悊 + + if (this.tableCurrentRowData.exceptionType != '8') { + this.timeAndDataProcessed() + } else { + this.loading.lineChart = true + this.validProcess() + this.loading.lineChart = false + this.flag.banTouch = 0 + } + }) }, /** * description锛氭潯浠舵煡璇㈠紓甯哥殑鏁版嵁 @@ -1304,10 +831,16 @@ if (this.form.exceptionName.length != 0) { params['exceptionType'] = this.form.exceptionName.join() } + if (this.form.street.length != 0) { + params['street'] = this.form.street.join() + } + if (this.form.dutyCompany.length != 0) { + params['dutyCompany'] = this.form.dutyCompany.join() + } params['beginTime'] = this.beginTime params['endTime'] = this.endTime - this.$http.get('/dust/exceptiondata', { params: params }).then((response) => { + this.$http.get('/dust/exceptiondata2', { params: params }).then((response) => { // 淇濆瓨杩斿洖鐨� // this.tableData = response.data.data.rows; this.displayData = response.data.data.rows @@ -1427,6 +960,14 @@ </el-form-item> <el-form-item> + <DutyCompany @submitDutyCompanyValue="(n) => (form.dutyCompany = n)"> </DutyCompany> + </el-form-item> + + <el-form-item> + <StreetInfo @submitStreetValue="(n) => (form.street = n)"> </StreetInfo> + </el-form-item> + + <el-form-item> <TimeShortCuts timeType="day" @submit-time="giveTime"></TimeShortCuts> </el-form-item> @@ -1462,7 +1003,7 @@ </template> <el-row :gutter="20" class="card-row"> - <el-col :span="6"> + <el-col :span="5"> <AnalysisCard :site-name="cardRow1[0].siteName" :exception-type="cardRow1[0].exceptionType" @@ -1479,7 +1020,8 @@ <img src="@/assets/exception/exception4.png" height="24" width="24" /> </AnalysisCard> </el-col> - <el-col :span="6"> + + <el-col :span="5"> <AnalysisCard :site-name="cardRow1[1].siteName" :exception-type="cardRow1[1].exceptionType" @@ -1496,7 +1038,46 @@ <img src="@/assets/exception/exception5.png" height="24" width="24" /> </AnalysisCard> </el-col> - <el-col :span="6"> + + + <el-col :span="4"> + <AnalysisCard + :site-name="cardRow3[2].siteName" + :exception-type="cardRow3[2].exceptionType" + :begin-time="beginTime" + :end-time="endTime" + :exception-name="cardRow3[2].exceptionName" + :site-num="cardRow3[2].siteNum" + :exception-num="cardRow3[2].exceptionNum" + :exception-all-num="exceptionAllNum" + :site-num-all="siteTotal" + :isNoDataStatus="cardRow3[2].isNoDataStatus" + @get-abnormal-data-by-click="getAbnormalDataByClick" + > + <img src="@/assets/exception/exception3.png" height="24" width="24" /> + </AnalysisCard> + </el-col> + + + <el-col :span="5"> + <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/exception7.png" height="24" width="24" /> + </AnalysisCard> + </el-col> + + <el-col :span="5"> <AnalysisCard :site-name="cardRow1[2].siteName" :exception-type="cardRow1[2].exceptionType" @@ -1513,60 +1094,11 @@ <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-row :gutter="20" class="card-row"> <el-col :span="6"> <AnalysisCard :site-name="cardRow2[2].siteName" @@ -1581,27 +1113,67 @@ :isNoDataStatus="cardRow2[2].isNoDataStatus" @get-abnormal-data-by-click="getAbnormalDataByClick" > - <img src="@/assets/exception/exception2.png" height="24" width="24" /> + <img src="@/assets/exception/exception1.png" height="24" width="24" /> </AnalysisCard> </el-col> <el-col :span="6"> <AnalysisCard - :site-name="cardRow2[3].siteName" - :exception-type="cardRow2[3].exceptionType" + :site-name="cardRow3[0].siteName" + :exception-type="cardRow3[0].exceptionType" :begin-time="beginTime" :end-time="endTime" - :exception-name="cardRow2[3].exceptionName" - :site-num="cardRow2[3].siteNum" - :exception-num="cardRow2[3].exceptionNum" + :exception-name="cardRow3[0].exceptionName" + :site-num="cardRow3[0].siteNum" + :exception-num="cardRow3[0].exceptionNum" :exception-all-num="exceptionAllNum" :site-num-all="siteTotal" - :isNoDataStatus="cardRow2[3].isNoDataStatus" + :isNoDataStatus="cardRow3[0].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="cardRow3[1].siteName" + :exception-type="cardRow3[1].exceptionType" + :begin-time="beginTime" + :end-time="endTime" + :exception-name="cardRow3[1].exceptionName" + :site-num="cardRow3[1].siteNum" + :exception-num="cardRow3[1].exceptionNum" + :exception-all-num="exceptionAllNum" + :site-num-all="siteTotal" + :isNoDataStatus="cardRow3[1].isNoDataStatus" @get-abnormal-data-by-click="getAbnormalDataByClick" > <img src="@/assets/exception/exception3.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/exception0.png" height="24" width="24" /> + </AnalysisCard> + </el-col> </el-row> + <!-- + <el-row :gutter="20"> + + </el-row> --> </el-card> </el-col> </el-row> @@ -1635,10 +1207,10 @@ 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="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="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 @@ -1695,17 +1267,6 @@ <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> - <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 }} ~ @@ -1748,8 +1309,6 @@ </div> </template> - <!-- :option="dialog.option" --> - <!-- 鍥惧舰 --> <DustLineChart :option="dialog.option" @@ -1768,16 +1327,15 @@ 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鲁)" + label="TSP(mg/m鲁)" align="center" show-overflow-tooltip /> + <el-table-column prop="flag" label="flag" align="center" show-overflow-tooltip /> </el-table> </div> <template #footer> diff --git a/src/views/exception/SiteAuditAssistance.vue b/src/views/exception/SiteAuditAssistance.vue index e575a35..333691e 100644 --- a/src/views/exception/SiteAuditAssistance.vue +++ b/src/views/exception/SiteAuditAssistance.vue @@ -13,6 +13,13 @@ import ButtonClick from '@/sfc/ButtonClick.vue' import index from '@/utils/exception_common_function/index.js' import DaySelect from '@/sfc/DaySelect.vue'; +// import {useLoginUserStore} from '@/stores/user.js' +import { useLoginUserStore } from '@/stores/user' +import historyApi from '@/api/historyApi.js' +import time from '@/utils/time.js' +import lineChart from '@/utils/chartFunction/lineChart.js' +import exceptionOption from '@/utils/chartFunction/exceptionOption.js' + export default { components: { ExceptionType, @@ -114,8 +121,10 @@ }, setup() { const { isExceedOneMonth } = useCommonFunction() + const userName = useLoginUserStore() + return { - isExceedOneMonth + isExceedOneMonth,userName } }, // 鐩戝惉 鍒ゆ柇鎸夐挳鏄惁鍙偣鍑� @@ -190,15 +199,63 @@ mounted() { this.backExceptionDataAWeekAgo() this.calTableHeight() + }, methods: { + /** + * 鏈夋晥鐜囧紓甯� 璁剧疆鎶樼嚎鍥鹃厤缃」 + * @param锛� + * @returns锛� + */ + validProcess() { + // x杞存暟鎹� + let xList = time.ascTime( + this.tableCurrentRowData.beginTime, + this.tableCurrentRowData.endTime, + 15 + ) + + // y杞存暟鎹� + let yList = [] + xList.forEach((item) => { + // 鏌ユ壘璇ユ椂闂寸殑鏁版嵁 + let r = lineChart.findDate(this.dialog.historyData, item) + if (r) { + yList.push(r.dustValue) + } else { + yList.push(null) + } + }) + // 棰滆壊鑳屾櫙鍖洪棿 + // 寰楀埌鏃犳暟鎹殑鏃堕棿鐐规垨flag涓嶇瓑浜嶯鐨勬椂闂寸偣 + let noDataTime = time.invalidTime(this.dialog.historyData, xList) + let rangeTime = time.seriesTime(noDataTime, 15) + // let rangeTime_1 = time.splitTime(rangeTime) + // 寰楀埌鑳屾櫙鍖洪棿鐨勯厤缃� + let areaObj = lineChart.getMarkArea(rangeTime, '寮傚父') + + // 浼犲叆鍙傛暟 + this.dialog.option = exceptionOption.setExceptionChartOption( + xList, + yList, + '', + '', + '', + '', + this.tableCurrentRowData.exception, + areaObj, + this.tableCurrentRowData.exceptionType + ) + }, + giveDay(val){ // 灏嗕腑鍥芥爣鍑嗘椂闂磋浆涓烘寚瀹氭牸寮�(璇ョ粍浠惰繑鍥炵殑鏍囧噯鏃堕棿鐨勬牸寮忥紝鎵�浠ュ繀椤荤殑鍔犺繖涓嚱鏁�) this.beginTime = dayjs(val).format('YYYY-MM-DD 00:00:00'); this.endTime = dayjs(val).format('YYYY-MM-DD 23:59:59'); }, + /** * 瀹¤鍐呭淇濆瓨涓鸿崏绋� * @param锛� @@ -220,6 +277,7 @@ this.auditData = res.data.data }) }, + /** * 澶氶�夊垪锛堝凡瀹℃牳鐨勮涓嶄細鍔犲叆鍏朵腑锛� * @param @@ -359,6 +417,10 @@ submitAudit() { // 鍚屾椂濉啓浜嗗鏍镐汉鍛樺拰浼佷笟鐨勫娉� this.loading.submitAudit = true + // 鎶婄櫥闄嗙殑鐢ㄦ埛濮撳悕缁欏鏍镐汉 + if(this.userName.getUserName != '-1'){ + this.auditDialog.checker = this.userName.getUserName + } if (this.auditDialog.checkerNotes && this.auditDialog.enterpriseNotes) { this.sendAudit( this.auditDialog.checker, @@ -429,11 +491,21 @@ openAuditDiag(row) { this.auditDialog.visible = true this.tableCurrentRowData = row - // 杩涘叆瀹℃牳椤垫椂锛屽皢琛ㄦ牸褰撳墠琛岀殑瀹℃牳淇℃伅缁欒緭鍏ユ this.auditDialog.checkerNotes = this.tableCurrentRowData.checkerContent this.auditDialog.enterpriseNotes = this.tableCurrentRowData.enterpriseContent + + // // 鏈鏍� 灏辨妸褰撳墠鐧婚檰鍚嶇粰瀹℃牳浜� + // if(this.tableCurrentRowData.uiRealName == null){ + // this.auditDialog.checker = this.userName.getUserName + // } + // // 宸插鏍� + // else{ + // this.auditDialog.checker = this.tableCurrentRowData.uiRealName + // } + }, + /** * description锛氱偣鍑诲紓甯哥珯鐐瑰悕瀛楁椂 杩斿洖鐨勬暟鎹� @@ -1044,20 +1116,42 @@ // 寰楀埌涓婁竴琛岀殑鏁版嵁 this.tableCurrentRowData = this.displayData[this.selectedRowIndex] - let params = index.requestGetParms( - this.tableCurrentRowData.name, - this.tableCurrentRowData.beginTime, - this.tableCurrentRowData.endTime - ) this.loading.preButton = true - this.$http.get('/dust/history', { params: params }).then((response) => { + + historyApi.queryHistoryData({ + siteName:this.tableCurrentRowData.name, + beginTime:this.tableCurrentRowData.beginTime, + endTime:this.tableCurrentRowData.endTime + }).then(response => { // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� this.dialog.historyData = response.data.data this.dialog.exceptionTotal = response.data.data.length // 閫昏緫澶勭悊 - this.timeAndDataProcessed() + + if (this.tableCurrentRowData.exceptionType != '8') { + this.timeAndDataProcessed() + } else { + this.loading.lineChart = true + this.validProcess() + this.loading.lineChart = false + this.flag.banTouch = 0 + } this.loading.preButton = false }) + + // let params = index.requestGetParms( + // this.tableCurrentRowData.name, + // this.tableCurrentRowData.beginTime, + // this.tableCurrentRowData.endTime + // ) + // this.$http.get('/dust/history', { params: params }).then((response) => { + // // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� + // this.dialog.historyData = response.data.data + // this.dialog.exceptionTotal = response.data.data.length + // // 閫昏緫澶勭悊 + // this.timeAndDataProcessed() + // this.loading.preButton = false + // }) } }, /** @@ -1075,21 +1169,44 @@ // 寰楀埌涓婁竴琛岀殑鏁版嵁 this.tableCurrentRowData = this.displayData[this.selectedRowIndex] - - let params = index.requestGetParms( - this.tableCurrentRowData.name, - this.tableCurrentRowData.beginTime, - this.tableCurrentRowData.endTime - ) this.loading.afterButton = true - this.$http.get('/dust/history', { params: params }).then((response) => { + + historyApi.queryHistoryData({ + siteName:this.tableCurrentRowData.name, + beginTime:this.tableCurrentRowData.beginTime, + endTime:this.tableCurrentRowData.endTime + }).then(response => { // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� this.dialog.historyData = response.data.data this.dialog.exceptionTotal = response.data.data.length // 閫昏緫澶勭悊 - this.timeAndDataProcessed() + + if (this.tableCurrentRowData.exceptionType != '8') { + this.timeAndDataProcessed() + } else { + this.loading.lineChart = true + this.validProcess() + this.loading.lineChart = false + this.flag.banTouch = 0 + } this.loading.afterButton = false }) + + + // let params = index.requestGetParms( + // this.tableCurrentRowData.name, + // this.tableCurrentRowData.beginTime, + // this.tableCurrentRowData.endTime + // ) + + // this.$http.get('/dust/history', { params: params }).then((response) => { + // // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� + // this.dialog.historyData = response.data.data + // this.dialog.exceptionTotal = response.data.data.length + // // 閫昏緫澶勭悊 + // this.timeAndDataProcessed() + // this.loading.afterButton = false + // }) } }, @@ -1112,24 +1229,44 @@ // 瀵硅姹傚埌鐨勬暟鎹繘琛岄灏炬嫾鎺� // 寰楀埌鍓嶅悗瀹屾暣鏁版嵁杩涜缁樺埗鍥惧舰 - let params = {} - if (row.name) { - params['siteName'] = row.name - } - if (row.beginTime) { - params['beginTime'] = row.beginTime - } - if (row.endTime) { - params['endTime'] = row.endTime - } + historyApi.queryHistoryData({ + siteName:row.name, + beginTime:row.beginTime, + endTime:row.endTime + }).then(response => { + // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� + this.dialog.historyData = response.data.data + this.dialog.exceptionTotal = response.data.data.length + // 閫昏緫澶勭悊 - this.$http.get('/dust/history', { params: params }).then((response) => { - // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� - this.dialog.historyData = response.data.data - this.dialog.exceptionTotal = response.data.data.length - // 閫昏緫澶勭悊 - this.timeAndDataProcessed() - }) + if (this.tableCurrentRowData.exceptionType != '8') { + this.timeAndDataProcessed() + } else { + this.loading.lineChart = true + this.validProcess() + this.loading.lineChart = false + this.flag.banTouch = 0 + } + }) + + // let params = {} + // if (row.name) { + // params['siteName'] = row.name + // } + // if (row.beginTime) { + // params['beginTime'] = row.beginTime + // } + // if (row.endTime) { + // params['endTime'] = row.endTime + // } + + // this.$http.get('/dust/history', { params: params }).then((response) => { + // // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� + // this.dialog.historyData = response.data.data + // this.dialog.exceptionTotal = response.data.data.length + // // 閫昏緫澶勭悊 + // this.timeAndDataProcessed() + // }) }, /** @@ -1141,12 +1278,12 @@ alert('鏃堕棿璺ㄥ害涓嶈兘瓒呰繃涓�涓湀') return } - this.flag.originClick = 0 - + let params = {} params['page'] = this.currentPage params['pageSize'] = this.pageSize + if (this.form.name) { params['siteName'] = this.form.name } @@ -1157,6 +1294,9 @@ params['endTime'] = this.endTime this.loading.tableLoading = true this.loading.queryButton = true + + console.log('绔欑偣锛�',params['siteName']); + console.log('绫诲瀷',params['exceptionType']); this.$http.get('/dust/exceptiondata', { params: params }).then((response) => { // 淇濆瓨杩斿洖鐨� // this.tableData = response.data.data.rows; @@ -1186,6 +1326,8 @@ if (this.form.name) { params['siteName'] = this.form.name } + + if (this.form.exceptionName) { params['exceptionType'] = this.form.exceptionName } @@ -1224,7 +1366,7 @@ const h2 = this.$refs.h2.$el.offsetHeight const h4 = this.$refs.h4.$el.offsetHeight // 鍏朵腑涓�涓�40鏄洅瀛愮殑鎬诲杈硅窛 - this.tableHeight = `calc(100vh - ${h1}px - ${h2}px - ${h4}px - 20px - 100px - var(--el-main-padding) * 2)` + this.tableHeight = `calc(100vh - ${h1}px - ${h2}px - ${h4}px - 20px - 10px - var(--el-main-padding) * 2)` // this.tableHeight = `calc(100vh - ${h1}px - ${h4}px - 100px - var(--el-main-padding) * 2)`; }, @@ -1300,8 +1442,7 @@ </el-form-item> <el-form-item> - <!-- <el-button type="warning" :loading="loading.queryButton" @click="handleSubmit"><el-icon - style="margin-right: 6px;font-size: 1.2em;"><i-ep-Search /></el-icon>鏌ヨ</el-button> --> + <ButtonClick content="鎼滅储" type="warning" @@ -1369,10 +1510,10 @@ 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="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="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 /> @@ -1453,7 +1594,7 @@ <el-form label-position="top"> <el-form-item label="瀹℃牳浜�"> - <el-input v-model="auditDialog.checker"></el-input> + <el-input v-model="userName.getUserName"></el-input> </el-form-item> <el-form-item label="瀹℃牳鎯呭喌"> <el-input @@ -1511,7 +1652,7 @@ <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.name }}</div> <div><span class="diag-head-text1">璁惧缂栧彿锛�</span>{{ tableCurrentRowData.mnCode }}</div> <div><span class="diag-head-text1">杩愮淮鍟嗭細</span>{{ tableCurrentRowData.dutyCompany }}</div> @@ -1564,10 +1705,11 @@ <el-table-column prop="lst" label="閲囬泦鏃堕棿" align="center" show-overflow-tooltip /> <el-table-column prop="dustValue" - label="棰楃矑鐗╂祿搴�(mg/m鲁)" + label="TSP(mg/m鲁)" align="center" show-overflow-tooltip /> + <el-table-column prop="flag" label="flag" align="center" show-overflow-tooltip /> </el-table> </div> <template #footer> @@ -1624,6 +1766,7 @@ } .el-tag { font-size: 14px; + vertical-align: baseline; } .checknum-rate { diff --git a/src/views/exception/components/AnalysisCard.vue b/src/views/exception/components/AnalysisCard.vue index 82e6b0d..6191098 100644 --- a/src/views/exception/components/AnalysisCard.vue +++ b/src/views/exception/components/AnalysisCard.vue @@ -2,7 +2,7 @@ <script> import DustExceptionText from './DustExceptionText.vue' import NoDataStatus from './NoDataStatus.vue' - +import dayjs from 'dayjs' export default { props: { // 寮傚父鐨勭珯鐐瑰悕绉� @@ -57,7 +57,7 @@ type:Number, default:100 }, - // 鏄惁鏄棤鏁版嵁 + // 鏄惁鏃犳暟鎹� isNoDataStatus:{ type:Boolean, default:false @@ -69,13 +69,29 @@ NoDataStatus }, data() { - return {} + return { + // 瀹℃牳杈呭姪鎸夐挳鏄剧ず + // auditButton:false, + } + }, + + computed: { + auditButton_1() { + let today = dayjs().subtract(1,'day').format('YYYY-MM-DD 00:00:00') + if(this.beginTime >= today && this.isNoDataStatus == false) { + return true + } + return false + } }, mounted() {}, methods: { getAbnormalDataByClick(val) { this.$emit('getAbnormalDataByClick',val) }, + openDetail() { + this.$router.push(`/AuditDetail/${this.beginTime}/${this.endTime}/${this.exceptionType}`) + } } } </script> @@ -84,9 +100,9 @@ <el-card> <template #header> <div class="icon-text"> - <!-- <img :src="iconsrc" height="24" width="24"> --> <slot/> <div class="exception-name">{{ exceptionName }}</div> + <el-button type="danger" size="small" class="audit-button" v-show="auditButton_1" @click="openDetail">瀹℃牳</el-button> </div> <div class="exception-num"> @@ -125,6 +141,10 @@ .icon-text { display:flex; margin-bottom:10px; + +} +.audit-button { + margin-left:auto; } .exception-name { font-size:18px; diff --git a/src/views/exception/components/DustLineChart.vue b/src/views/exception/components/DustLineChart.vue index 9e4d7db..f7b0c85 100644 --- a/src/views/exception/components/DustLineChart.vue +++ b/src/views/exception/components/DustLineChart.vue @@ -5,9 +5,7 @@ --> <template> - <div id="main" class="line-chart-exception"></div> - </template> @@ -49,11 +47,7 @@ window.addEventListener('resize', this.resizeChart); }, }, - // beforeUnmount() { - // if (this.chart) { - // this.chart.dispose; - // } - // }, + methods: { initChart() { // 鍒涘缓echarts瀹炰緥 diff --git a/src/views/exception/components/NoDataStatus.vue b/src/views/exception/components/NoDataStatus.vue index bfbf6b8..8ec37dd 100644 --- a/src/views/exception/components/NoDataStatus.vue +++ b/src/views/exception/components/NoDataStatus.vue @@ -1,3 +1,4 @@ +<!-- 鑷畾涔夌殑鏃犳暟鎹姸鎬� 鏍峰紡 --> <script> export default { props:{ @@ -8,17 +9,6 @@ } } }, - data() { - return{ - - } - }, - mounted() { - - }, - methods: { - - } } </script> diff --git a/src/views/exception/components/SubFlightInspection.vue b/src/views/exception/components/SubFlightInspection.vue new file mode 100644 index 0000000..e375b3c --- /dev/null +++ b/src/views/exception/components/SubFlightInspection.vue @@ -0,0 +1,1847 @@ +<script> +import { defineAsyncComponent } from 'vue' +import TimeShortCuts from '@/sfc/TimeShortCuts.vue' +import { useCommonFunction } from '@/utils/common.js' +import AreaAndmonitorType from '@/sfc/AreaAndmonitorType.vue' +import ButtonClick from '@/sfc/ButtonClick.vue' +import index from '@/utils/exception_common_function/index.js' +// 寮傚父鍥惧舰寮傛缁勪欢 +const DustLineChart = defineAsyncComponent(() => import('@/views/exception/components/DustLineChart.vue')) +import exceptionApi from '@/api/exceptionApi.js' +import dayjs from 'dayjs' +import { ElMessage } from 'element-plus' +import AnalysisCard from '@/views/exception/components/AnalysisCard.vue' + +export default { + props:{ + siteName:{ + type:String, + default:'' + }, + month:{ + type:String, + default:'2023-11-01' + } + }, + components: { + TimeShortCuts, + DustLineChart, + ButtonClick, + AreaAndmonitorType, + AnalysisCard + }, + data() { + return { + // 琛ㄥ崟鍐呭 + form: { + // 绔欑偣鍚嶇О + name: '', + // 閫夋嫨鐨勫紓甯哥被鍨� + exceptionName: [] + }, + beginTime: '', + endTime: '', + // 杩斿洖鐨勬暟鎹� + tableData: [], + // 琛ㄦ牸灞曠ず鐨勬暟鎹� + displayData: [], + // 琛ㄦ牸楂樺害 + tableHeight: 400, + // 琛ㄦ牸鏄剧ず + isTableShow: false, + // 褰撳墠椤� + currentPage: 1, + // 姣忛〉鏉℃暟 + pageSize: 20, + // 琛ㄦ牸鐨勬�昏褰曟暟 + total: 0, + + // 鏌ヨ鎸夐挳鏃犳暟鎹椂 + isNoData: { + exception0: true, + exception1: true, + exception2: true, + exception3: true, + exception4: true, + exception5: true, + exception6: true, + exception7: true + }, + // eslint-disable-next-line no-undef + // 瀵硅瘽妗嗘樉绀� + dialogTableVisible: false, + // 淇濆瓨寮傚父瀵瑰簲鐨勫簵閾哄悕绉板拰璁惧缂栧彿 + exception: { + // 鏂數鎴栨柇缃� + exception0: [], + // 鏁版嵁瓒呬綆 + exception1: [], + // 瓒呮爣 + exception2: [], + // 鏁版嵁闀挎椂娈垫棤娉㈠姩 + exception3: [], + // 閲忕骇绐佸彉寮傚父 + exception4: [], + // 涓磋繎瓒呮爣寮傚父 + exception5: [], + // 鍗曟棩瓒呮爣娆℃暟涓寸晫寮傚父 + exception6: [], + // 婊戝姩骞冲潎鍊煎紓甯� + exception7: [], + + // 璇ユ椂娈电殑寮傚父鏁伴噺 + exception0Num: 0, + exception1Num: 0, + exception2Num: 0, + exception3Num: 0, + exception4Num: 0, + exception5Num: 0, + exception6Num: 0, + exception7Num: 0 + }, + // 绔欑偣鎬绘暟閲� + siteTotal: 0, + + // 閫変腑琛ㄦ牸褰撳墠琛岀殑鏁版嵁 + tableCurrentRowData: null, + // 閫変腑琛ㄦ牸褰撳墠琛岀殑绱㈠紩 + selectedRowIndex: -2, + // 椤甸潰涓婄殑鎸夐挳鍔犺浇鐘舵�� + loading: { + // 鏌ヨ鎸夐挳 + queryButton: false, + // 琛ㄦ牸鍔犺浇涓� + tableLoading: false, + // 涓婁竴鏉℃寜閽� + preButton: false, + // 涓嬩竴鏉℃寜閽� + afterButton: false, + // 鎶樼嚎鍥� + lineChart: false + }, + + dialog: { + // 鎵撳紑瀵硅瘽妗嗚姹傝鍖洪棿鐨勫巻鍙叉暟鎹� + historyData: [], + // 璇ユ椂闂存鐨勫紓甯告潯鏁� + exceptionTotal: 0, + // 鎶樼嚎鍥鹃厤缃」 + option: {}, + // 鈥欎笂涓�鏉♀�樻寜閽槸鍚﹀彲浠ヨ鐐瑰嚮鐘舵�� + isPreCantouch: false, + // 鈥欎笅涓�鏉♀�樻寜閽槸鍚﹀彲浠ヨ鐐瑰嚮鐘舵�� + isNextCantouch: false, + // 寮傚父鐨勫墠涓悗鍖洪棿鎵�鏈夋暟鎹� + allExceptionTimeData: [] + }, + + // 鏍囪浣� + flag: { + // 鍔犺浇鏃� 涓婁笅鏉℃寜閽笉鑳藉啀鐐瑰嚮 + banTouch: 0, + // 0浠h〃鍒嗛〉锛�1浠h〃涓嶅垎椤� + originClick: 0 + } + } + }, + setup() { + // provide('search',readonly(form)) + const { isExceedOneMonth } = useCommonFunction() + return { + isExceedOneMonth + } + }, + // 鐩戝惉 鍒ゆ柇鎸夐挳鏄惁鍙偣鍑� + watch: { + selectedRowIndex(newVaue) { + // 澶勪簬琛ㄦ牸鐨勬渶鍚庝竴鏉℃暟鎹� 璁剧疆鈥樹笂涓�鏉♀�欐寜閽笉鍙偣 + if (newVaue === 0) { + this.dialog.isPreCantouch = true + //鐢ㄦ埛鍏堢偣浜嗙涓�鏉★紝pre涓簍rue,鐒跺悗鐐瑰嚮鏈�鍚庝竴鏉�,next涓簍rue銆傛鏃朵袱涓寜閽兘琚皝閿� + if (this.dialog.isNextCantouch == true) { + this.dialog.isNextCantouch = false + } + } + // 澶勪簬琛ㄦ牸绗竴鏉℃暟鎹� 璁剧疆鈥樹笂涓�鏉♀�欐寜閽笉鍙偣 + else if (newVaue === this.displayData.length - 1) { + this.dialog.isNextCantouch = true + //鐢ㄦ埛鍏堢偣浜嗚〃鏍兼渶鍚庝竴鏉�,next涓簍rue,鐒跺悗鐐瑰嚮绗竴鏉★紝pre涓簍rue銆傛鏃朵袱涓寜閽兘琚皝閿� + if (this.dialog.isPreCantouch == true) { + this.dialog.isPreCantouch = false + } + } + // 澶勪簬琛ㄦ牸鐨勪腑闂磋 灏嗘寜閽缃负鍙偣鍑荤姸鎬� + else { + this.dialog.isPreCantouch = false + this.dialog.isNextCantouch = false + } + }, + + // 褰撻�夋嫨鐨勬椂闂村彂鐢熷彉鍖栨椂锛屽紓甯稿垎鏋愰儴鍒嗙殑寮傚父搴楅摵鏁伴噺鍚屾鍙樺寲 + // beginTime() { + // this.getShopNames() + // }, + // endTime() { + // this.getShopNames() + // }, + dialogTableVisible() { + window.addEventListener('resize', this.updateChart) + } + }, + computed: { + exceptionAllNum() { + let sum = + this.exception.exception0Num + + this.exception.exception1Num + + this.exception.exception2Num + + this.exception.exception3Num + + this.exception.exception4Num + + this.exception.exception5Num + + this.exception.exception6Num + + this.exception.exception7Num + if (sum == 0) { + return 1 + } else { + return sum + } + }, + long_time_notchange() { + let sum = + this.exception.exception0Num + + this.exception.exception1Num + + this.exception.exception2Num + + this.exception.exception3Num + + this.exception.exception4Num + + this.exception.exception5Num + + this.exception.exception6Num + + this.exception.exception7Num + if (sum == 0) { + return 0 + } 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) + } + }, + // 绗竴鎺掑崱鐗� + 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.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.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 + }, + { + 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.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() + // this.getShopNames() + this.getSiteNume() + + this.$watch(() => [this.siteName, this.month], () => { + this.form.beginTime = dayjs(this.month).startOf('month') + this.form.endTime = dayjs(this.month).endOf('month') + this.backExceptionDataAWeekAgo() + this.getShopNames() + + }); + }, + + methods: { + getImageUrl(name) { + return new URL(`../../lib/Carousel/assets/${name}`, import.meta.url).href + }, + // 鏀惧洖绔欑偣鎬绘暟閲� + getSiteNume() { + exceptionApi.getSitesNum().then((res) => { + this.siteTotal = res.data.data.length + }) + }, + + /** + * description锛氱偣鍑诲紓甯哥珯鐐瑰悕瀛楁椂 杩斿洖鐨勬暟鎹� + * @param锛� + * @createTime:2023-08-17 + * @returns锛� + */ + getAbnormalDataByClick(val) { + this.flag.originClick = 1 + // 鏄剧ず琛ㄦ牸 + this.isTableShow = true + this.tableData = val + this.total = this.tableData.length + // 榛樿鏄剧ず绗竴椤� + this.handleCurrentChange(1) + }, + // 鐐瑰嚮琛ㄦ牸鐨勮鏃� + selectTableRow() { + // 鑾峰彇褰撳墠琛岀殑绱㈠紩 + this.selectedRowIndex = this.displayData.indexOf(this.tableCurrentRowData) + }, + /** + * description锛氭柇鐢垫垨鏂綉鏃惰缃殑琛ㄦ牸鏁版嵁 + */ + setOfflineTbleData() { + // 鏃犳暟鎹椂鐨勬椂闂存暟缁� 鏃堕棿鐩稿樊15鍒嗛挓 + const abnormalTimeTenMinute = index.descFiftyTime( + this.tableCurrentRowData.beginTime, + this.tableCurrentRowData.endTime + ) + // 淇濆瓨鏃犳暟鎹椂琛ㄦ牸鏉℃暟 + this.dialog.exceptionTotal = abnormalTimeTenMinute.length + + // 鍘婚櫎渚涚數寮傚父鍜屾帀绾垮尯闂寸殑绗竴涓湁鍏冪礌鐨勫�� + this.dialog.historyData = [] + + for (let i = 0; i < abnormalTimeTenMinute.length; i++) { + this.dialog.historyData.push({ + name: this.tableCurrentRowData.name, + mnCode: this.tableCurrentRowData.mnCode, + dutyCompany: this.tableCurrentRowData.dutyCompany, + lst: abnormalTimeTenMinute[i], + dustValue: '' + }) + } + }, + + // 娈电數鎴栨柇缃戝尯闂存棤鏁版嵁锛岄渶瑕佽ˉ鍏呫�傚叾浠栫殑閮芥湁鏁版嵁锛岀洿鎺ヤ竴娆¤姹傚叏閮ㄦ椂娈靛氨濂� + + // 鏍规嵁寮傚父鍖洪棿鏋勯�犲墠鍚庣棣栧熬 鍓嶅尯闂� 涓棿鍖洪棿 鍚庡尯闂� + // 鍒ゆ柇鏄鐢垫垨鏂綉锛熸槸鍒欒姹傚墠鍚庡尯闂达紝鍚﹀垯鍙姹備竴娆″畬鏁寸殑 + // 寰楀埌鏈�缁堟暟鎹� + // 鍐嶅垽鏂紓甯哥绫� 锛岃繘琛岃缃厤缃」 + + /** + * description锛氫竴娆¤姹傚洖鍓嶄腑鍚庡尯闂寸殑鏁版嵁,瀵规暟鎹繘琛屽垎鏋� + * @param锛� 鍓嶄腑鍚庡尯闂寸殑璇锋眰鍙傛暟锛屽墠涓悗鐨勬�诲尯闂存椂闂达紝寮傚父寮�濮嬫椂闂达紝涓�鍦虹粨鏉熸椂闂� + */ + otherExceptionRequest(allTimeArgs, allTime, exceptionBT, exceptionET) { + // 鎶樼嚎鍥惧姞杞戒腑鏁堟灉 + this.loading.lineChart = true + this.$http.get('/dust/history', { params: allTimeArgs }).then((result) => { + this.dialog.allExceptionTimeData = result.data.data + // 鏁版嵁缂哄け寮傚父鏃堕噸鏂拌缃〃鏍� + if (this.tableCurrentRowData.exceptionType == '0') { + this.setOfflineTbleData() + } + + // x杞存棩鏈熸椂闂� + let dateList = [] + // y杞� 瓒呮爣娌圭儫娴撳害 + let dustValue = [] + let timeAndValue = {} + + // 浠庢坊鍔犱簡棣栦綅鍖洪棿鐨勫紑濮嬪拰缁撴潫鏃堕棿杩涜閬嶅巻 淇濊瘉鏃堕棿浠�10鍒嗛挓涓洪棿闅� + timeAndValue = index.keepContinuousByEachFiftyMinutes( + allTime[0], + allTime[3], + this.dialog.allExceptionTimeData + ) + dateList = timeAndValue['xAxis'] + dustValue = timeAndValue['yAxis'] + + // 鎻愬彇寮傚父璧峰鏃堕棿鐐瑰湪鏁翠釜鍖洪棿鍐呯殑鏁版嵁绱㈠紩 + let startIndex = dateList.findIndex((item) => item === exceptionBT) + let endIndex = dateList.findIndex((item) => item === exceptionET) + + // 璁剧疆鎶樼嚎鍥鹃厤缃」 + this.reSetChart(dateList, dustValue, exceptionBT, exceptionET, startIndex, endIndex) + this.loading.lineChart = false + }) + }, + + /** + * description锛氱粯鍒舵姌绾垮浘 + * @param锛� x杞存椂闂达紝 y杞存补鐑熸祿搴︼紝 寮傚父寮�濮嬫椂闂达紝寮傚父缁撴潫鏃堕棿锛屽紓甯稿紑濮嬫椂闂村湪鏁翠釜鍖洪棿鐨勭储寮曚笅鏍囷紝寮傚父缁撴潫鏃堕棿鍦ㄦ暣涓尯闂寸殑绱㈠紩涓嬫爣 + */ + reSetChart(xData, yData, exceptionBeginTime, exceptionEndTime, beginIndex, endIndex) { + this.dialog.option = {} + switch (this.tableCurrentRowData.exceptionType) { + // 鏂數鎴栨柇缃� 鏃堕棿娈� + case '0': + this.dialog.option = { + title: { + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + 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, + markLine: { + silent: true, + data: [ + // 鏍囨敞鏃犳暟鎹椂闂存鐨勬晥鏋滐紝灏嗚繖涓椂闂存鐨勬暟杞撮儴鍒嗗彉涓虹孩鑹� + { + name: '鏃犳暟鎹�', + xAxis: exceptionBeginTime + }, + { + xAxis: exceptionEndTime + } + ], + lineStyle: { + color: 'red' + } + } + } + ] + } + break + // 瓒呮爣 + case '2': + this.dialog.option = { + title: { + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + 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.map((item) => { + if (item >= 1) { + return { + value: item, + itemStyle: { + color: 'red' + } + } + } + return item + }), + // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹� + markArea: { + itemStyle: { + color: 'rgba(255, 173, 177, 0.4)' + }, + data: [ + [ + { + name: '寮傚父鏃堕棿娈�', + xAxis: exceptionBeginTime + }, + { + xAxis: exceptionEndTime + } + ] + ] + }, + markLine: { + symbol: 'none', + itemStyle: { + // 鍩虹嚎鍏叡鏍峰紡 + normal: { + lineStyle: { + type: 'dashed' + }, + label: { + show: true, + position: 'end', + formatter: '{b}' + } + } + }, + data: [ + { + name: '瓒呮爣', + type: 'average', + yAxis: 1, + lineStyle: { + // color: '#ff0000' + color: 'red' + } + } + ] + } + } + ], + // 鎸囧畾鏃堕棿鍖洪棿鐨勭嚎娈靛彉棰滆壊 + 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 + // 鏁版嵁瓒呬綆 鍙湁鏃堕棿鐐� + case '1': + this.dialog.option = { + title: { + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + 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.map((item) => { + if (item <= 0.01) { + return { + value: item, + itemStyle: { + color: 'red' + } + } + } + return item + }), + + markLine: { + symbol: 'none', + itemStyle: { + // 鍩虹嚎鍏叡鏍峰紡 + normal: { + lineStyle: { + type: 'dashed' + }, + label: { + show: true, + position: 'end', + formatter: '{b}' + } + } + }, + data: [ + { + name: '鏁版嵁瓒呬綆', + type: 'average', + yAxis: 0.01, + lineStyle: { + // color: '#ff0000' + color: 'red' + } + } + ] + } + } + ], + // 鎸囧畾鏃堕棿鍖洪棿鐨勭嚎娈靛彉棰滆壊 + 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 + // 鏁版嵁闀挎椂娈垫棤娉㈠姩 + case '3': + this.dialog.option = { + title: { + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + 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.map((item) => { + if (item >= 1) { + return { + value: item, + itemStyle: { + color: 'red' + } + } + } + return item + }), + // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹� + 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 + // 閲忕骇绐佸彉寮傚父 + case '4': + case '5': + case '6': + case '7': + this.dialog.option = { + title: { + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle: { + fontSize: 14 + } + }, + 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: + console.log('娌℃湁璁剧疆璇ュ紓甯哥被鍨嬶紒') + } + this.flag.banTouch = 0 + }, + /** + * description锛氬垝鍒嗗嚭寮傚父璧峰鏃堕棿锛屾瀯閫犺姹傚墠涓悗鐨勫弬鏁� + */ + timeAndDataProcessed() { + //寮傚父鐨勫紑濮嬫椂闂� 缁撴潫鏃堕棿 + let exceptionBeginTime = this.tableCurrentRowData.beginTime + let exceptionEndTime = this.tableCurrentRowData.endTime + + // beforeAndAfterTime[0]:鍓�45鍒嗛挓鐨勬椂闂寸偣 + // beforeAndAfterTime[1]:鍓�15鍒嗛挓鐨勬椂闂寸偣 + // beforeAndAfterTime[2]:鍚�15鍒嗛挓鐨勬椂闂寸偣 + // beforeAndAfterTime[3]:鍚�45鍒嗛挓鐨勬椂闂寸偣 + let beforeAndAfterTime = index.before45AndAfter45(exceptionBeginTime, exceptionEndTime) + + // 鏋勯�犲紓甯告椂闂村墠鍚庡尯闂存暟鎹姹傚弬鏁�(闄や簡鏂綉涓兘鐢ㄥ埌锛� + let paramsAllTime = index.requestGetParms( + this.tableCurrentRowData.name, + beforeAndAfterTime[0], + beforeAndAfterTime[3] + ) + + // 灏嗗紓甯告暟鎹繘琛岄澶勭悊锛岄殢鍚庡皢缁撴灉浣滀负鎶樼嚎鍥剧殑閰嶇疆椤� + this.otherExceptionRequest( + paramsAllTime, + beforeAndAfterTime, + exceptionBeginTime, + exceptionEndTime + ) + }, + + /** + * description锛氳幏鍙栦笅涓�鏉″紓甯镐俊鎭� + */ + getPreviousRowData() { + // // 涓嶆槸琛ㄦ牸鐨勬渶鍚庝竴琛� + if (this.selectedRowIndex < this.displayData.length - 1) { + // 鐐瑰嚮杩囩▼涓� 閿佷綇涓婁笅鏉℃寜閽� 鍦ㄨ缃畬鍥惧舰閰嶇疆椤瑰悗瑙i攣 + this.flag.banTouch = 1 + + //寰楀埌涓婁竴琛屾暟鎹储寮� + this.selectedRowIndex = this.selectedRowIndex + 1 + + //璇锋眰鏁版嵁 鏀瑰彉exceedingData + // this.setinfo(this.selectedRowIndex); + + // 寰楀埌涓婁竴琛岀殑鏁版嵁 + this.tableCurrentRowData = this.displayData[this.selectedRowIndex] + let params = index.requestGetParms( + this.tableCurrentRowData.name, + this.tableCurrentRowData.beginTime, + this.tableCurrentRowData.endTime + ) + this.loading.preButton = true + this.$http.get('/dust/history', { params: params }).then((response) => { + // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� + this.dialog.historyData = response.data.data + this.dialog.exceptionTotal = response.data.data.length + // 閫昏緫澶勭悊 + this.timeAndDataProcessed() + this.loading.preButton = false + }) + } + + //寰楀埌涓婁竴琛屾暟鎹储寮� + // this.selectedRowIndex = this.selectedRowIndex + 1; + // this.tableCurrentRowData = this.displayData[this.selectedRowIndex] + }, + /** + * description锛氳幏鍙栦笅涓�鏉″紓甯镐俊鎭� + */ + getNextRowData() { + // 涓嶆槸琛ㄦ牸鐨勭涓�琛� + if (this.selectedRowIndex !== 0) { + // 鐐瑰嚮杩囩▼涓� 閿佷綇涓婁笅鏉℃寜閽� 鍦ㄨ缃畬鍥惧舰閰嶇疆椤瑰悗瑙i攣 + this.flag.banTouch = 1 + + //寰楀埌涓婁竴琛屾暟鎹储寮� + this.selectedRowIndex = this.selectedRowIndex - 1 + //璇锋眰鏁版嵁 鏀瑰彉exceedingData + // this.setinfo(this.selectedRowIndex); + + // 寰楀埌涓婁竴琛岀殑鏁版嵁 + this.tableCurrentRowData = this.displayData[this.selectedRowIndex] + + let params = index.requestGetParms( + this.tableCurrentRowData.name, + this.tableCurrentRowData.beginTime, + this.tableCurrentRowData.endTime + ) + this.loading.afterButton = true + this.$http.get('/dust/history', { params: params }).then((response) => { + // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� + this.dialog.historyData = response.data.data + this.dialog.exceptionTotal = response.data.data.length + // 閫昏緫澶勭悊 + this.timeAndDataProcessed() + this.loading.afterButton = false + }) + } + }, + + /** + * description锛氫粠瀛愮粍浠惰幏寰楁煇绔欑偣璇ユ椂娈电殑寮傚父鏁版嵁 + * @createTime:2023-08-18 + */ + backExceptionData(val1, val2) { + this.displayData = val1 + this.total = val2 + }, + + // 鏌ヨ寮傚父鏁版嵁鐨勭珯鐐瑰悕瀛楀拰鏁伴噺 + queryExceptionSite(url,siteName, exceptionType) { + let params = {} + params['beginTime'] = this.beginTime + params['endTime'] = this.endTime + params['exceptionType'] = exceptionType + if(siteName){ + params['siteName'] = this.siteName + } + return this.$http.get(url, { params: params }) + }, + + + + /** + * description锛氬綋鐢ㄦ埛鏀瑰彉鏌ヨ鐨勬椂闂村尯闂存椂锛屼細鏍规嵁璇ュ尯闂存煡璇㈠悇寮傚父鐨勭珯鐐癸紝鏌ヨ璇ユ椂闂村尯闂寸殑鍚勫紓甯告暟閲� + * @createTime:2023-08-18 + */ + getShopNames() { + /* 鏌ヨ寮傚父鐨勭珯鐐� */ + + this.queryExceptionSite('/dust/sitenamecode',this.siteName,0) + .then((result) => { + this.exception.exception0 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception0 = true + return + } + this.isNoData.exception0 = false + }) + this.queryExceptionSite('/dust/sitenamecode',this.siteName,1) + .then((result) => { + this.exception.exception1 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception1 = true + return + } + this.isNoData.exception1 = false + }) + this.queryExceptionSite('/dust/sitenamecode',this.siteName,2) + .then((result) => { + this.exception.exception2 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception2 = true + return + } + this.isNoData.exception2 = false + }) + + this.queryExceptionSite('/dust/sitenamecode',this.siteName,3) + .then((result) => { + this.exception.exception3 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception3 = true + return + } + this.isNoData.exception3 = false + }) + + this.queryExceptionSite('/dust/sitenamecode',this.siteName,4) + .then((result) => { + this.exception.exception4 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception4 = true + return + } + this.isNoData.exception4 = false + }) + this.queryExceptionSite('/dust/sitenamecode',this.siteName,5) + .then((result) => { + this.exception.exception5 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception5 = true + return + } + this.isNoData.exception5 = false + }) + this.queryExceptionSite('/dust/sitenamecode',this.siteName,6) + .then((result) => { + this.exception.exception6 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception6 = true + return + } + this.isNoData.exception6 = false + }) + this.queryExceptionSite('/dust/sitenamecode',this.siteName,7) + .then((result) => { + this.exception.exception7 = result.data.data + if (result.data.data.length == 0) { + this.isNoData.exception7 = true + return + } + this.isNoData.exception7 = false + }) + + + /* 寮傚父寮傚父鏁伴噺 */ + this.queryExceptionSite('/dust/exceptionnum',this.siteName,0) + .then((result) => { + this.exception.exception0Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum',this.siteName,1) + .then((result) => { + this.exception.exception1Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum',this.siteName,2) + .then((result) => { + this.exception.exception2Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum',this.siteName,3) + .then((result) => { + this.exception.exception3Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum',this.siteName,4) + .then((result) => { + this.exception.exception4Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum',this.siteName,5) + .then((result) => { + this.exception.exception5Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum',this.siteName,6) + .then((result) => { + this.exception.exception6Num = result.data.data + }) + this.queryExceptionSite('/dust/exceptionnum',this.siteName,7) + .then((result) => { + this.exception.exception7Num = result.data.data + }) + }, + + /** + * description锛氳姹傚紓甯哥殑搴楅摵鍚嶅瓧 + * @param锛氬紓甯哥被鍨嬶紝寮�濮嬫椂闂达紝缁撴潫鏃堕棿 + * @returns锛� 寮傚父鐨勬暟鎹� + */ + // getSiteNameByExceptionType(exception, beginT, endT) { + // let param = { + // exceptionType: exception, + // beginTime: beginT, + // endTime: endT + // }; + + // this.$http.get('/dust/sitenamecode', { params: param }).then((res) => { + // return res.data.data; + // }); + // return; + // }, + + /** + * description锛氭樉绀哄璇濇,杩斿洖璇ュ紓甯告椂闂存鐨勬墍鏈夋暟鎹� + * @param锛氱偣鍑烩�樻煡鐪嬭鎯呪�欑殑璇ヨ鎵�鏈夊瓧娈垫暟鎹� + * @createTime:2023-08-18 + */ + showDialog(row) { + // 鎵撳紑瀵硅瘽妗� + this.dialogTableVisible = true + + // 淇濆瓨褰撳墠琛屾暟鎹� + this.tableCurrentRowData = row + + // 鑾峰彇褰撳墠琛岀殑绱㈠紩 + this.selectedRowIndex = this.displayData.indexOf(row) + + //鏍规嵁褰撳墠琛岀殑缂栧彿锛岃捣濮嬫椂闂存潵 璇锋眰寮傚父鏁版嵁 + // 瀵硅姹傚埌鐨勬暟鎹繘琛岄灏炬嫾鎺� + // 寰楀埌鍓嶅悗瀹屾暣鏁版嵁杩涜缁樺埗鍥惧舰 + this.loading.lineChart = true + let params = {} + if (row.name) { + params['siteName'] = row.name + } + if (row.beginTime) { + params['beginTime'] = row.beginTime + } + if (row.endTime) { + params['endTime'] = row.endTime + } + + this.$http.get('/dust/history', { params: params }).then((response) => { + this.dialog.historyData = response.data.data + this.dialog.exceptionTotal = response.data.data.length + // 閫昏緫澶勭悊 + this.timeAndDataProcessed() + }) + }, + /** + * description锛氭潯浠舵煡璇㈠紓甯哥殑鏁版嵁 + * @createTime:2023-08-18 + */ + handleSubmit() { + if (this.isExceedOneMonth(this.beginTime, this.endTime)) { + alert('鏃堕棿璺ㄥ害涓嶈兘瓒呰繃涓�涓湀') + return + } + // 鏇存柊寮傚父鍒嗘瀽 + this.getShopNames() + + this.loading.queryButton = true + this.flag.originClick = 0 + this.loading.tableLoading = true + let params = {} + params['page'] = this.currentPage + params['pageSize'] = this.pageSize + if (this.siteName) { + params['siteName'] = this.siteName + } + if (this.form.exceptionName.length != 0) { + params['exceptionType'] = this.form.exceptionName.join() + } + params['beginTime'] = this.beginTime + params['endTime'] = this.endTime + + this.$http.get('/dust/exceptiondata', { params: params }).then((response) => { + // 淇濆瓨杩斿洖鐨� + // this.tableData = response.data.data.rows; + this.displayData = response.data.data.rows + this.loading.queryButton = false + this.loading.tableLoading = false + + if (response.data.data.total == 0) { + ElMessage('璇ユ椂娈垫棤鏁版嵁') + this.isTableShow = false + return + } + this.isTableShow = true + this.total = response.data.data.total + // 绉婚櫎绌烘暟鎹姸鎬� + }) + }, + + /** + * description锛氭墦寮�椤甸潰榛樿鍔犺浇鏈�杩戜竴鍛ㄧ殑寮傚父鏁版嵁 + * @createTime:2023-08-18 + */ + backExceptionDataAWeekAgo() { + this.loading.tableLoading = true + let params = {} + if (this.siteName) { + params['siteName'] = this.siteName + } + if (this.form.exceptionName) { + params['exceptionType'] = this.form.exceptionName + } + params['beginTime'] = this.beginTime + params['endTime'] = this.endTime + + this.$http.get('/dust/exceptiondata', { params: params }).then((response) => { + // 淇濆瓨杩斿洖鐨� + // this.tableData = response.data.data.rows; + this.displayData = response.data.data.rows + this.loading.tableLoading = false + if (response.data.data.total == 0) { + ElMessage('璇ユ椂娈垫棤鏁版嵁') + this.isTableShow = false + return + } + this.isTableShow = true + this.total = response.data.data.total + }) + }, + + /** + * description锛氬皢涓浗鏍囧噯鏃堕棿杞负鎸囧畾鏍煎紡(璇ョ粍浠惰繑鍥炵殑鏍囧噯鏃堕棿鐨勬牸寮忥紝鎵�浠ュ繀椤荤殑鍔犺繖涓嚱鏁�) + * @createTime:2023-08-17 + */ + giveTime(val) { + this.beginTime = dayjs(val[0]).format('YYYY-MM-DD HH:mm:ss') + this.endTime = dayjs(val[1]).format('YYYY-MM-DD HH:mm:ss') + }, + + // 鍔熻兘锛氳〃鏍奸珮搴︽牴鎹唴瀹硅嚜閫傚簲 + calTableHeight() { + const h1 = this.$refs.h1.$el.offsetHeight + const h2 = this.$refs.h2.$el.offsetHeight + const h3 = this.$refs.h3.$el.offsetHeight + const h4 = this.$refs.h4.$el.offsetHeight + // 鍏朵腑涓�涓�40鏄洅瀛愮殑鎬诲杈硅窛 + this.tableHeight = `calc(100vh - ${h1}px - ${h2}px - ${h3}px - ${h4}px - 40px - var(--el-main-padding) * 2)` + }, + + // 椤靛ぇ灏忔敼鍙樻椂瑙﹀彂 + handleSizeChange(val) { + this.pageSize = val + + // 鏀瑰彉姣忛〉鏄剧ず鏁扮洰鏃惰烦鍒板綋鍓嶉〉 + this.handleCurrentChange(1) + }, + + // 椤靛彿鏀瑰彉鏃惰Е鍙� + /** + * description锛氶〉鍙锋敼鍙樻椂瑙﹀彂 + * @param锛� 褰撳墠椤碉紝鏍囪浣嶏紙0浠h〃鏄偣鍑烩�樻煡璇⑩�欒Е鍙戠殑锛�1浠h〃鏃剁偣鍑诲紓甯哥珯鐐规枃鏈寜閽Е鍙戠殑锛� + * @createTime:2023-08-17 + * @returns锛� + */ + handleCurrentChange(val) { + // 灏嗗綋鍓嶉〉鍙风粰currentPage + this.currentPage = val + + // 椤甸潰鍙樺寲鏃惰皟鐢� 鏌ヨ鏁版嵁鍑芥暟 + if (this.flag.originClick == 0) { + this.handleSubmit() + } else if (this.flag.originClick == 1) { + const startIndex = (val - 1) * this.pageSize + const endIndex = startIndex + this.pageSize + + this.displayData = this.tableData.slice(startIndex, endIndex) + } + }, + // 琛ㄦ牸搴忓彿閫掑 + indexMethod1(index) { + return index + 1 + (this.currentPage - 1) * this.pageSize + }, + // 琛ㄦ牸搴忓彿閫掑 + indexMethod2(index) { + return index + 1 + } + } +} +</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> + <el-form-item> + <span class="site-text"> 鐐逛綅鍚嶇О:</span> + <span> {{this.siteName}}</span> + </el-form-item> + + <el-form-item> + <TimeShortCuts timeType="day" @submit-time="giveTime" :beginAndEndTime="[form.beginTime,form.endTime]"></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-row> + </el-row> + + <!-- 寮傚父鍒嗘瀽 --> + <el-row ref="h3"> + <el-col> + <el-card class="card-container"> + <template #header> + <div class="card-header">寮傚父鍒嗘瀽</div> + </template> + + <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 + > + </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>{{ tableCurrentRowData.beginTime }} ~ + {{ tableCurrentRowData.endTime }} + </div> + </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> + </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="TSP(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; +} + +/* 鏉′欢鏌ヨ妯″潡鐨勬牱寮� */ +.el-form { + margin: 10px; +} +img { + margin-right: 5px; +} +.head-container-search { + float: right; +} + +.head-describtion-text { + justify-content: flex-end; + margin-bottom: 2px; + margin-right: 20px; + font-size: 14px; + color: gray; +} +.button-set { + margin: 10px; +} +/* 鏉′欢鏌ヨ妯″潡缁撴潫 */ + +/* 寮傚父鍒嗘瀽妯″潡鐨勬牱寮� */ + +.card-text1 { + /* 榛戜綋鐨勫紓甯稿悕瀛楅儴鍒� */ + margin: 10px; +} +.card-text1 + div { + /* 榛戜綋鐨勫紓甯稿悕瀛椾笅闈㈢殑 */ + margin: 12px; +} +.card-exception-buttom { + /* 寮傚父绔欑偣鏂囨湰鎸夐挳鍖哄煙 */ + padding: 11px; +} +.card-header { + margin-left: 5px; + font-size: 18px; + font-weight: bold; +} +.card-content-unnormal { + min-height: 200px; + border: 2px solid #ffcf8b; + border-radius: 20px; +} +.card-content-normal { + min-height: 200px; + border: 2px solid red; + border-radius: 20px; +} + +.card-header-text { + font-size: 16px; + font-weight: bold; + margin-top: 4px; + margin-left: 4px; +} +.card-content-text { + white-space: nowrap; +} +.card-exceptionname-text1 { + /* 寮傚父绔欑偣鍗犳瘮 */ + font-size: 14px; + white-space: nowrap; +} + +.card-exceptionname-text2 { + /* 寮傚父鏁板崰姣旂殑澶栬竟璺� */ + font-size: 14px; + white-space: nowrap; +} +.text-blank { + /* 閫楀彿 */ + margin-right: 10px; + color: #000000; +} +.card-row { + margin-bottom: 10px; +} + +/* 寮傚父鍒嗘瀽妯″潡缁撴潫 */ + +/* 闅愯棌琛ㄦ牸鎸夐挳缁勬牱寮� */ +.el-button-group { + margin: 10px 0px 10px 10px; +} +.i-ep-Arrow { + margin-left: 6px; + margin-bottom: 2px; + font-size: 1.2em; +} +/* 闅愯棌琛ㄦ牸鎸夐挳缁勬牱寮忕粨鏉� */ + +/* 琛ㄦ牸妯″潡鐨勬牱寮� */ +.el-table { + color: #333333; +} +/* 琛ㄦ牸妯″潡缁撴潫 */ + +/* 鏌ョ湅璇︽儏瀵硅瘽妗嗘ā鍧楃殑鏍峰紡 */ + +.diag-head { + /* 瀵硅瘽妗嗗ご閮ㄥ尯鍩� */ + min-height: 200px; +} +.diag-head-text1 { + /* 瀵硅瘽妗嗗ご閮ㄧ殑灞炴�у瓧娈靛姞绮� */ + font-weight: bold; +} + +.diag-head-text > div { + /* 瀵硅瘽妗嗗紓甯告椂闂存 */ + margin-top: 15px; +} +.diag-head-text { + margin: 10px; + padding: 10px; + background: linear-gradient(90deg, #00c9ff 0%, #92fe9d 100%); + border: 2px solid #7bc0fc; +} +.chart-jump-button { + display: flex; + justify-content: right; +} + +.mx-1 { + position: absolute; + left: 10px; + bottom: 10px; +} +.site-text{ + color: #333333; + font-weight: bold; + font-size: 14px; + margin-right: 10px; +} +/* 鏌ョ湅璇︽儏瀵硅瘽妗嗘ā鍧楃粨鏉� */ +</style> diff --git a/src/views/exception/components/SubSiteAudit.vue b/src/views/exception/components/SubSiteAudit.vue new file mode 100644 index 0000000..7eb7a49 --- /dev/null +++ b/src/views/exception/components/SubSiteAudit.vue @@ -0,0 +1,1741 @@ +<script> +import ExceptionType from '@/sfc/ExceptionType.vue' +import TimeShortCuts from '@/sfc/TimeShortCuts.vue' +import { useCommonFunction } from '@/utils/common.js' +import AreaAndmonitorType from '@/sfc/AreaAndmonitorType.vue' +// import { defineAsyncComponent } from 'vue' +// // 寮傚父鍥惧舰寮傛缁勪欢 +// const DustLineChart = defineAsyncComponent(() => import('@/exception/components/DustLineChart.vue')) + +import DustLineChart from '@/views/exception/components/DustLineChart.vue' +import submitApi from '@/api/audit/submitApi.js' +import { ElMessage, ElMessageBox } from 'element-plus' +import index from '@/utils/exception_common_function/index.js' +import { useLoginUserStore } from '@/stores/user' +export default { + props: { + beginTime: { + type: String, + default:'2023-11-01 00:00:00' + }, + endTime: { + type: String, + default:'2023-11-11 00:00:00', + }, + exceptionType: { + type: Number, + default: 0 + } + }, + components: { + ExceptionType, + TimeShortCuts, + DustLineChart, + AreaAndmonitorType, + }, + data() { + return { + // 琛ㄥ崟鍐呭 + form: { + // 绔欑偣鍚嶇О + name: '', + // 閫夋嫨鐨勫紓甯哥被鍨� + exceptionName: [] + }, + // 鏃ユ湡閫夋嫨 + day:'', + // 鏃ユ湡鏃堕棿閫夋嫨 + // beginTime: '', + // endTime: '', + // 杩斿洖鐨勬暟鎹� + tableData: [], + // 琛ㄦ牸灞曠ず鐨勬暟鎹� + displayData: [], + // 琛ㄦ牸鍒楀閫� + multipleSelection: [], + // 琛ㄦ牸楂樺害 + tableHeight: 400, + // 琛ㄦ牸鏁版嵁 + // 褰撳墠椤� + currentPage: 1, + // 姣忛〉鏉℃暟 + pageSize: 20, + total: 0, + + // 琛ㄦ牸鏌ヨ鏃犳暟鎹椂 + isNoData: false, + // 瀵硅瘽妗嗘樉绀� + dialogTableVisible: false, + // 淇濆瓨寮傚父瀵瑰簲鐨勫簵閾哄悕绉板拰璁惧缂栧彿 + + // 閫変腑琛ㄦ牸褰撳墠琛岀殑鏁版嵁 + tableCurrentRowData: null, + // 閫変腑琛ㄦ牸褰撳墠琛岀殑绱㈠紩 + selectedRowIndex: -2, + // 椤甸潰涓婄殑鎸夐挳鍔犺浇鐘舵�� + loading: { + submitAudit: false, + // 鏌ヨ鎸夐挳 + queryButton: false, + // 琛ㄦ牸鍔犺浇涓� + tableLoading: false, + // 涓婁竴鏉℃寜閽� + preButton: false, + // 涓嬩竴鏉℃寜閽� + afterButton: false, + // 鎶樼嚎鍥� + lineChart: false + }, + + dialog: { + // 鎵撳紑瀵硅瘽妗嗚姹傝鍖洪棿鐨勫巻鍙叉暟鎹� + historyData: [], + // 璇ユ椂闂存鐨勫紓甯告潯鏁� + exceptionTotal: 0, + // 鎶樼嚎鍥鹃厤缃」 + option: {}, + // 鈥欎笂涓�鏉♀�樻寜閽槸鍚﹀彲浠ヨ鐐瑰嚮鐘舵�� + isPreCantouch: false, + // 鈥欎笅涓�鏉♀�樻寜閽槸鍚﹀彲浠ヨ鐐瑰嚮鐘舵�� + isNextCantouch: false, + // 寮傚父鐨勫墠涓悗鍖洪棿鎵�鏈夋暟鎹� + allExceptionTimeData: [] + }, + + // 鏍囪浣� + flag: { + // 鍔犺浇鏃� 涓婁笅鏉℃寜閽笉鑳藉啀鐐瑰嚮 + banTouch: 0, + // 0浠h〃鍒嗛〉锛�1浠h〃涓嶅垎椤� + originClick: 0 + }, + auditDialog: { + visible: false, + // 瀹℃牳浜� + checker: 'admin', + checkDate: '', + checkerNotes: '', + enterpriseNotes: '' + }, + auditTableData: [], + // 瀹℃牳鐘舵�佷笉涓�0 + auditData: [] + } + }, + setup() { + const { isExceedOneMonth } = useCommonFunction() + const userName = useLoginUserStore() + + return { + isExceedOneMonth,userName + } + }, + // 鐩戝惉 鍒ゆ柇鎸夐挳鏄惁鍙偣鍑� + watch: { + selectedRowIndex(newVaue) { + // 澶勪簬琛ㄦ牸鐨勬渶鍚庝竴鏉℃暟鎹� 璁剧疆鈥樹笂涓�鏉♀�欐寜閽笉鍙偣 + if (newVaue === 0) { + this.dialog.isPreCantouch = true + //鐢ㄦ埛鍏堢偣浜嗙涓�鏉★紝pre涓簍rue,鐒跺悗鐐瑰嚮鏈�鍚庝竴鏉�,next涓簍rue銆傛鏃朵袱涓寜閽兘琚皝閿� + if (this.dialog.isNextCantouch == true) { + this.dialog.isNextCantouch = false + } + } + // 澶勪簬琛ㄦ牸绗竴鏉℃暟鎹� 璁剧疆鈥樹笂涓�鏉♀�欐寜閽笉鍙偣 + else if (newVaue === this.displayData.length - 1) { + this.dialog.isNextCantouch = true + //鐢ㄦ埛鍏堢偣浜嗚〃鏍兼渶鍚庝竴鏉�,next涓簍rue,鐒跺悗鐐瑰嚮绗竴鏉★紝pre涓簍rue銆傛鏃朵袱涓寜閽兘琚皝閿� + if (this.dialog.isPreCantouch == true) { + this.dialog.isPreCantouch = false + } + } + // 澶勪簬琛ㄦ牸鐨勪腑闂磋 灏嗘寜閽缃负鍙偣鍑荤姸鎬� + else { + this.dialog.isPreCantouch = false + this.dialog.isNextCantouch = false + } + + }, + + dialogTableVisible() { + window.addEventListener('resize', this.updateChart) + } + }, + computed: { + // 瀹¤鎬绘暟锛堝寘鎷儴鍒嗗鏍革級 + auditTotal() { + return this.auditData.length + }, + // 瑙勮寖瀹¤鎬绘暟 + auditedRegular() { + let count = 0 + this.auditData.forEach((item) => { + if (item.auditStatus == 3) { + count++ + } + }) + return count + }, + // 閮ㄥ垎瀹℃牳鏁伴噺 + auditPart() { + let count = 0 + this.auditData.forEach((item) => { + if (item.auditStatus == 1 || item.auditStatus == 2) { + count++ + } + }) + return count + }, + // 寰呭鏍告暟 + unCheckedNUm() { + return this.total - this.auditedRegular + }, + // 瀹℃牳姣斾緥 + checkedRate() { + if (this.total == 0) { + return 0 + } else { + return ((this.auditedRegular / this.total) * 100).toFixed(1) + } + } + }, + mounted() { + // this.backExceptionDataAWeekAgo() + + this.$watch(() => [this.beginTime, this.endTime, this.exceptionType], () => { + // 鏍规嵁寮�濮嬪拰缁撴潫鏃堕棿,寮傚父绫诲瀷 + this.form.exceptionName = [] + this.form.exceptionName.push(this.exceptionType) + + this.handleSubmit() + }); + this.calTableHeight() + + }, + + methods: { + // giveDay(val){ + // // 灏嗕腑鍥芥爣鍑嗘椂闂磋浆涓烘寚瀹氭牸寮�(璇ョ粍浠惰繑鍥炵殑鏍囧噯鏃堕棿鐨勬牸寮忥紝鎵�浠ュ繀椤荤殑鍔犺繖涓嚱鏁�) + + // this.beginTime = dayjs(val).format('YYYY-MM-DD 00:00:00'); + // this.endTime = dayjs(val).format('YYYY-MM-DD 23:59:59'); + // }, + + /** + * 瀹¤鍐呭淇濆瓨涓鸿崏绋� + * @param锛� + * @returns锛� + */ + saveAudit() { + // 灏嗚緭鍏ユ鍊肩粰褰撳墠琛� + this.tableCurrentRowData.checkerContent = this.auditDialog.checkerNotes + this.tableCurrentRowData.enterpriseContent = this.auditDialog.enterpriseNotes + ElMessage.success('淇濆瓨鎴愬姛') + }, + /** + * 鏌ョ湅璇ユ鏃堕棿鍐呭凡瀹℃牳鐨勬暟鎹� + * @param锛� + * @returns锛� + */ + gethasCheckedNumByTime() { + console.log('qqq',this.beginTime, this.endTim); + submitApi.getAuditNumByTime(this.beginTime, this.endTime).then((res) => { + this.auditData = res.data.data + }) + }, + + /** + * 澶氶�夊垪锛堝凡瀹℃牳鐨勮涓嶄細鍔犲叆鍏朵腑锛� + * @param + * @returns + */ + handleSelectionChange(val) { + this.multipleSelection = val.filter((row) => row.auditStatus != 3) + }, + /** + * 瑙﹀彂鎵归噺瀹℃牳 + * @param锛� + * @returns锛� + */ + quickReview() { + if (this.multipleSelection.length != 0) { + ElMessageBox.confirm('纭畾瑕佹壒閲忓鏍稿悧?', { + confirmButtonText: '纭', + cancelButtonText: '鍙栨秷', + type: 'warning', + center: true + }).then(() => { + this.noNoteCheck(this.multipleSelection) + setTimeout(() => { + this.gethasCheckedNumByTime() + ElMessage.success('鎵归噺瀹℃牳瀹屾垚') + }, 1500) + }) + } else { + ElMessage('鏈�変腑琛ㄦ牸鐨勮') + } + }, + /** + * 娓呴櫎宸查�変腑鐨勮〃鏍艰锛� + * @param锛� + * @returns锛� + */ + clearSelected() { + this.$refs.table.clearSelection() + }, + toggleSelection() { + this.$refs.table.clearSelection() + }, + /** + *鎻愪氦鎵归噺瀹℃牳銆傞粯璁ゅ鏍镐汉锛岀┖澶囨敞 + * @param锛� 闇�瑕佸揩閫熷鏍哥殑琛� + * @returns锛� + */ + noNoteCheck(rows) { + rows.forEach((item) => { + submitApi.submitAudit('admin', '鏃�', '鏃�', item.id, 3) + item.auditStatus = 3 + }) + }, + close() { + + this.auditDialog.visible = false + }, + // 琛ㄦ牸琛岀殑棰滆壊 + tableRowClassName({ row }) { + if (row.auditStatus == 0) { + return 'black-row' + } else if (row.auditStatus == 1 || row.auditStatus == 2) { + return 'deep-gray-row' + } else { + return 'complete--gray-row' + } + }, + /** + * 鍙戣姹� + * @param锛氬鏍镐汉锛屽鏍镐汉澶囨敞锛屼紒涓氬娉紝寮傚父璁板綍缂栧彿 璇ユ潯寮傚父鐨勫鏍哥姸鎬� + * @returns锛� + */ + sendAudit(user, checker, enterprise, exceptionId, status) { + submitApi + .submitAudit( + user, + this.auditDialog.checkerNotes, + this.auditDialog.enterpriseNotes, + exceptionId, + status + ) + .then((res) => { + if (res.data.code == 1) { + ElMessage.success('鎻愪氦鎴愬姛') + this.tableCurrentRowData.auditStatus = status + this.tableCurrentRowData.checker = user + if (checker) { + this.tableCurrentRowData.checkerContent = checker + } + if (enterprise) { + this.tableCurrentRowData.enterpriseContent = enterprise + } + + // 鏇存柊鍒嗘瀽鐨勬暟鎹� + setTimeout(() => { + this.gethasCheckedNumByTime() + }, 1500) + } else { + ElMessage.warning('鎻愪氦澶辫触') + } + this.loading.submitAudit = false + this.auditDialog.visible = false + }) + }, + // 鏇存柊瀹℃牳鍐呭 + updateAud(exceptionId, checkerContent, enterpriseContent, auditStatus) { + submitApi + .updateAudit(exceptionId, checkerContent, enterpriseContent, auditStatus) + .then((res) => { + if (res.data.code == 1) { + ElMessage.success('鎻愪氦鎴愬姛') + this.tableCurrentRowData.auditStatus = auditStatus + + if (checkerContent) { + this.tableCurrentRowData.checkerContent = checkerContent + } + if (enterpriseContent) { + this.tableCurrentRowData.enterpriseContent = enterpriseContent + } + + // 鏇存柊鍒嗘瀽鐨勬暟鎹� + setTimeout(() => { + this.gethasCheckedNumByTime() + }, 1500) + } else { + ElMessage.warning('鎻愪氦澶辫触') + } + this.loading.submitAudit = false + this.auditDialog.visible = false + }) + }, + /** + * 鎻愪氦瀹℃牳 + * @param锛� + * @returns锛� + */ + submitAudit() { + // 鍚屾椂濉啓浜嗗鏍镐汉鍛樺拰浼佷笟鐨勫娉� + this.loading.submitAudit = true + // 鎶婄櫥闄嗙殑鐢ㄦ埛濮撳悕缁欏鏍镐汉 + if(this.userName.getUserName != '-1'){ + this.auditDialog.checker = this.userName.getUserName + } + if (this.auditDialog.checkerNotes && this.auditDialog.enterpriseNotes) { + this.sendAudit( + this.auditDialog.checker, + this.auditDialog.checkerNotes, + this.auditDialog.enterpriseNotes, + this.tableCurrentRowData.id, + 3 + ) + } + // 鍙~浜嗗鏍镐汉鍛樺娉� + else if (this.auditDialog.checkerNotes && !this.auditDialog.enterpriseNotes) { + // 绗竴娆″垱寤� + if (this.tableCurrentRowData.auditStatus == 0) { + this.sendAudit( + this.auditDialog.checker, + this.auditDialog.checkerNotes, + this.auditDialog.enterpriseNotes, + this.tableCurrentRowData.id, + 1 + ) + } + // 鍙洿鏂� + else { + this.updateAud( + this.tableCurrentRowData.id, + this.auditDialog.checkerNotes, + this.auditDialog.enterpriseNotes, + 3 + ) + } + } + // 鍙~浜嗕紒涓氬娉ㄥ娉� + else if (this.auditDialog.enterpriseNotes && !this.auditDialog.checkerNotes) { + // 绗竴娆″垱寤� + if (this.tableCurrentRowData.auditStatus == 0) { + this.sendAudit( + this.auditDialog.checker, + this.auditDialog.checkerNotes, + this.auditDialog.enterpriseNotes, + this.tableCurrentRowData.id, + 2 + ) + } else { + // 鍙洿鏂� + this.updateAud( + this.tableCurrentRowData.id, + this.auditDialog.checkerNotes, + this.auditDialog.enterpriseNotes, + 3 + ) + } + } else { + ElMessage.warning('璇峰~鍐欏畬鏁存墠鑳芥彁浜�') + } + + this.loading.submitAudit = false + // 娓呴櫎 + this.auditDialog.checkerNotes = '' + this.auditDialog.enterpriseNotes = '' + }, + + /** + * 寮瑰嚭瀵硅瘽妗嗗苟涓斾繚瀛樺綋鍓嶈鏁版嵁 + * @param锛� + * @createTime:2023-08-17 + * @returns锛� + */ + openAuditDiag(row) { + this.auditDialog.visible = true + this.tableCurrentRowData = row + // 杩涘叆瀹℃牳椤垫椂锛屽皢琛ㄦ牸褰撳墠琛岀殑瀹℃牳淇℃伅缁欒緭鍏ユ + this.auditDialog.checkerNotes = this.tableCurrentRowData.checkerContent + this.auditDialog.enterpriseNotes = this.tableCurrentRowData.enterpriseContent + + // // 鏈鏍� 灏辨妸褰撳墠鐧婚檰鍚嶇粰瀹℃牳浜� + // if(this.tableCurrentRowData.uiRealName == null){ + // this.auditDialog.checker = this.userName.getUserName + // } + // // 宸插鏍� + // else{ + // this.auditDialog.checker = this.tableCurrentRowData.uiRealName + // } + + }, + + + /** + * description锛氱偣鍑诲紓甯哥珯鐐瑰悕瀛楁椂 杩斿洖鐨勬暟鎹� + * @param锛� + * @createTime:2023-08-17 + * @returns锛� + */ + getAbnormalDataByClick(val) { + this.flag.originClick = 1 + + this.tableData = val + this.total = this.tableData.length + // 榛樿鏄剧ず绗竴椤� + this.handleCurrentChange(1) + }, + // 鐐瑰嚮琛ㄦ牸鐨勮鏃� + selectTableRow() { + // 鑾峰彇褰撳墠琛岀殑绱㈠紩 + this.selectedRowIndex = this.displayData.indexOf(this.tableCurrentRowData) + }, + + /** + * description锛氭柇鐢垫垨鏂綉鏃惰缃殑琛ㄦ牸鏁版嵁 + */ + setOfflineTbleData() { + // 鏃犳暟鎹椂鐨勬椂闂存暟缁� 鏃堕棿鐩稿樊15鍒嗛挓 + const abnormalTimeTenMinute = index.descFiftyTime( + this.tableCurrentRowData.beginTime, + this.tableCurrentRowData.endTime + ) + + // 淇濆瓨鏃犳暟鎹椂琛ㄦ牸鏉℃暟 + this.dialog.exceptionTotal = abnormalTimeTenMinute.length + + // 鍘婚櫎渚涚數寮傚父鍜屾帀绾垮尯闂寸殑绗竴涓湁鍏冪礌鐨勫�� + this.dialog.historyData = [] + + for (let i = 0; i < abnormalTimeTenMinute.length; i++) { + this.dialog.historyData.push({ + name: this.tableCurrentRowData.name, + mnCode: this.tableCurrentRowData.mnCode, + dutyCompany: this.tableCurrentRowData.dutyCompany, + lst: abnormalTimeTenMinute[i], + dustValue: '' + }) + } + }, + + // 娈电數鎴栨柇缃戝尯闂存棤鏁版嵁锛岄渶瑕佽ˉ鍏呫�傚叾浠栫殑閮芥湁鏁版嵁锛岀洿鎺ヤ竴娆¤姹傚叏閮ㄦ椂娈靛氨濂� + + // 鏍规嵁寮傚父鍖洪棿鏋勯�犲墠鍚庣棣栧熬 鍓嶅尯闂� 涓棿鍖洪棿 鍚庡尯闂� + // 鍒ゆ柇鏄鐢垫垨鏂綉锛熸槸鍒欒姹傚墠鍚庡尯闂达紝鍚﹀垯鍙姹備竴娆″畬鏁寸殑 + // 寰楀埌鏈�缁堟暟鎹� + // 鍐嶅垽鏂紓甯哥绫� 锛岃繘琛岃缃厤缃」 + + /** + * description锛氫竴娆¤姹傚洖鍓嶄腑鍚庡尯闂寸殑鏁版嵁,瀵规暟鎹繘琛屽垎鏋� + * @param锛� 鍓嶄腑鍚庡尯闂寸殑璇锋眰鍙傛暟锛屽墠涓悗鐨勬�诲尯闂存椂闂达紝寮傚父寮�濮嬫椂闂达紝涓�鍦虹粨鏉熸椂闂� + */ + otherExceptionRequest(allTimeArgs, allTime, exceptionBT, exceptionET) { + // 鎶樼嚎鍥惧姞杞戒腑鏁堟灉 + this.loading.lineChart = true + this.$http.get('/dust/history', { params: allTimeArgs }).then((result) => { + this.dialog.allExceptionTimeData = result.data.data + // 鏂數鎴栨柇缃戞椂閲嶆柊璁剧疆琛ㄦ牸 + if (this.tableCurrentRowData.exceptionType == '0') { + this.setOfflineTbleData() + } + + // x杞存棩鏈熸椂闂� + let dateList = [] + // y杞� 瓒呮爣娌圭儫娴撳害 + let dustValue = [] + let timeAndValue = {} + + // 浠庢坊鍔犱簡棣栦綅鍖洪棿鐨勫紑濮嬪拰缁撴潫鏃堕棿杩涜閬嶅巻 淇濊瘉鏃堕棿浠�10鍒嗛挓涓洪棿闅� + timeAndValue = index.keepContinuousByEachFiftyMinutes( + allTime[0], + allTime[3], + this.dialog.allExceptionTimeData + ) + dateList = timeAndValue['xAxis'] + dustValue = timeAndValue['yAxis'] + + // 鎻愬彇寮傚父璧峰鏃堕棿鐐瑰湪鏁翠釜鍖洪棿鍐呯殑鏁版嵁绱㈠紩 + let startIndex = dateList.findIndex((item) => item === exceptionBT) + let endIndex = dateList.findIndex((item) => item === exceptionET) + + // 璁剧疆鎶樼嚎鍥鹃厤缃」 + this.reSetChart(dateList, dustValue, exceptionBT, exceptionET, startIndex, endIndex) + this.loading.lineChart = false + }) + }, + + /** + * description锛氱粯鍒舵姌绾垮浘 + * @param锛� x杞存椂闂达紝 y杞存补鐑熸祿搴︼紝 寮傚父寮�濮嬫椂闂达紝寮傚父缁撴潫鏃堕棿锛屽紓甯稿紑濮嬫椂闂村湪鏁翠釜鍖洪棿鐨勭储寮曚笅鏍囷紝寮傚父缁撴潫鏃堕棿鍦ㄦ暣涓尯闂寸殑绱㈠紩涓嬫爣 + */ + reSetChart(xData, yData, exceptionBeginTime, exceptionEndTime, beginIndex, endIndex) { + this.dialog.option = {} + switch (this.tableCurrentRowData.exceptionType) { + // 鏂數鎴栨柇缃� 鏃堕棿娈� + case '0': + this.dialog.option = { + title: { + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle:{ + fontSize:14 + } + }, + + tooltip: {}, + toolbox: { + // 宸ュ叿鏍� + feature: { + + // 淇濆瓨涓哄浘鐗� + 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, + markLine: { + silent: true, + data: [ + // 鏍囨敞鏃犳暟鎹椂闂存鐨勬晥鏋滐紝灏嗚繖涓椂闂存鐨勬暟杞撮儴鍒嗗彉涓虹孩鑹� + { + name: '鏃犳暟鎹�', + xAxis: exceptionBeginTime + }, + { + xAxis: exceptionEndTime + } + ], + lineStyle: { + color: 'red' + } + } + } + ] + } + break + // 瓒呮爣 + case '2': + case '5': + case '6': + this.dialog.option = { + title: { + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle:{ + fontSize:14 + } + }, + 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.map((item) => { + if (item >= 1) { + return { + value: item, + itemStyle: { + color: 'red' + } + } + } + return item + }), + // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹� + markArea: { + itemStyle: { + color: 'rgba(255, 173, 177, 0.4)' + }, + data: [ + [ + { + name: '寮傚父鏃堕棿娈�', + xAxis: exceptionBeginTime + }, + { + xAxis: exceptionEndTime + } + ] + ] + }, + markLine: { + symbol: 'none', + itemStyle: { + // 鍩虹嚎鍏叡鏍峰紡 + normal: { + lineStyle: { + type: 'dashed' + }, + label: { + show: true, + position: 'end', + formatter: '{b}' + } + } + }, + data: [ + { + name: '瓒呮爣', + type: 'average', + yAxis: 1, + lineStyle: { + // color: '#ff0000' + color: 'red' + } + } + ] + } + } + ], + // 鎸囧畾鏃堕棿鍖洪棿鐨勭嚎娈靛彉棰滆壊 + 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 + // 鏁版嵁瓒呬綆 鍙湁鏃堕棿鐐� + case '1': + this.dialog.option = { + title: { + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle:{ + fontSize:14 + } + }, + 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.map((item) => { + if (item <= 0.01) { + return { + value: item, + itemStyle: { + color: 'red' + } + } + } + return item + }), + + markLine: { + symbol: 'none', + itemStyle: { + // 鍩虹嚎鍏叡鏍峰紡 + normal: { + lineStyle: { + type: 'dashed' + }, + label: { + show: true, + position: 'end', + formatter: '{b}' + } + } + }, + data: [ + { + name: '鏁版嵁瓒呬綆', + type: 'average', + yAxis: 0.01, + lineStyle: { + // color: '#ff0000' + color: 'red' + } + } + ] + } + } + ], + // 鎸囧畾鏃堕棿鍖洪棿鐨勭嚎娈靛彉棰滆壊 + 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 + case '3': + this.dialog.option = { + title: { + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle:{ + fontSize:14 + } + }, + 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.map((item) => { + if (item >= 1) { + return { + value: item, + itemStyle: { + color: 'red' + } + } + } + return item + }), + // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹� + 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 + case '4': + case '7': + this.dialog.option = { + title: { + text: this.tableCurrentRowData.exception, + left: '1%', + textStyle:{ + fontSize:14 + } + }, + tooltip: {}, + toolbox: { + // 宸ュ叿鏍� + feature: { + + // 淇濆瓨涓哄浘鐗� + 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: + console.log('娌℃湁璁剧疆璇ュ紓甯哥被鍨嬶紒') + } + this.flag.banTouch = 0 + }, + /** + * description锛氬垝鍒嗗嚭寮傚父璧峰鏃堕棿锛屾瀯閫犺姹傚墠涓悗鐨勫弬鏁� + */ + timeAndDataProcessed() { + //寮傚父鐨勫紑濮嬫椂闂� 缁撴潫鏃堕棿 + let exceptionBeginTime = this.tableCurrentRowData.beginTime + let exceptionEndTime = this.tableCurrentRowData.endTime + + // beforeAndAfterTime[0]:鍓�45鍒嗛挓鐨勬椂闂寸偣 + // beforeAndAfterTime[1]:鍓�15鍒嗛挓鐨勬椂闂寸偣 + // beforeAndAfterTime[2]:鍚�15鍒嗛挓鐨勬椂闂寸偣 + // beforeAndAfterTime[3]:鍚�45鍒嗛挓鐨勬椂闂寸偣 + let beforeAndAfterTime = index.before45AndAfter45(exceptionBeginTime, exceptionEndTime) + + // 鏋勯�犲紓甯告椂闂村墠鍚庡尯闂存暟鎹姹傚弬鏁�(闄や簡鏂綉涓兘鐢ㄥ埌锛� + let paramsAllTime = index.requestGetParms( + this.tableCurrentRowData.name, + beforeAndAfterTime[0], + beforeAndAfterTime[3] + ) + // 灏嗗紓甯告暟鎹繘琛岄澶勭悊锛岄殢鍚庡皢缁撴灉浣滀负鎶樼嚎鍥剧殑閰嶇疆椤� + + this.otherExceptionRequest( + paramsAllTime, + beforeAndAfterTime, + exceptionBeginTime, + exceptionEndTime + ) + }, + + /** + * description锛氳幏鍙栦笅涓�鏉″紓甯镐俊鎭� + */ + getPreviousRowData() { + // // 涓嶆槸琛ㄦ牸鐨勬渶鍚庝竴琛� + if (this.selectedRowIndex < this.displayData.length - 1) { + // 鐐瑰嚮杩囩▼涓� 閿佷綇涓婁笅鏉℃寜閽� 鍦ㄨ缃畬鍥惧舰閰嶇疆椤瑰悗瑙i攣 + this.flag.banTouch = 1 + + //寰楀埌涓婁竴琛屾暟鎹储寮� + this.selectedRowIndex = this.selectedRowIndex + 1 + + //璇锋眰鏁版嵁 鏀瑰彉exceedingData + // this.setinfo(this.selectedRowIndex); + + // 寰楀埌涓婁竴琛岀殑鏁版嵁 + this.tableCurrentRowData = this.displayData[this.selectedRowIndex] + let params = index.requestGetParms( + this.tableCurrentRowData.name, + this.tableCurrentRowData.beginTime, + this.tableCurrentRowData.endTime + ) + this.loading.preButton = true + this.$http.get('/dust/history', { params: params }).then((response) => { + // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� + this.dialog.historyData = response.data.data + this.dialog.exceptionTotal = response.data.data.length + // 閫昏緫澶勭悊 + this.timeAndDataProcessed() + this.loading.preButton = false + }) + } + }, + /** + * description锛氳幏鍙栦笅涓�鏉″紓甯镐俊鎭� + */ + getNextRowData() { + // 涓嶆槸琛ㄦ牸鐨勭涓�琛� + if (this.selectedRowIndex !== 0) { + // 鐐瑰嚮杩囩▼涓� 閿佷綇涓婁笅鏉℃寜閽� 鍦ㄨ缃畬鍥惧舰閰嶇疆椤瑰悗瑙i攣 + this.flag.banTouch = 1 + + //寰楀埌涓婁竴琛屾暟鎹储寮� + this.selectedRowIndex = this.selectedRowIndex - 1 + //璇锋眰鏁版嵁 鏀瑰彉exceedingData + + // 寰楀埌涓婁竴琛岀殑鏁版嵁 + this.tableCurrentRowData = this.displayData[this.selectedRowIndex] + + let params = index.requestGetParms( + this.tableCurrentRowData.name, + this.tableCurrentRowData.beginTime, + this.tableCurrentRowData.endTime + ) + this.loading.afterButton = true + this.$http.get('/dust/history', { params: params }).then((response) => { + // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� + this.dialog.historyData = response.data.data + this.dialog.exceptionTotal = response.data.data.length + // 閫昏緫澶勭悊 + this.timeAndDataProcessed() + this.loading.afterButton = false + }) + } + }, + + /** + * description锛氭樉绀哄璇濇,杩斿洖璇ュ紓甯告椂闂存鐨勬墍鏈夋暟鎹� + * @param锛氱偣鍑烩�樻煡鐪嬭鎯呪�欑殑璇ヨ鎵�鏈夊瓧娈垫暟鎹� + * @createTime:2023-08-18 + */ + showDialog(row) { + // 鎵撳紑瀵硅瘽妗� + this.dialogTableVisible = true + + // 淇濆瓨褰撳墠琛屾暟鎹� + this.tableCurrentRowData = row + + // 鑾峰彇褰撳墠琛岀殑绱㈠紩 + this.selectedRowIndex = this.displayData.indexOf(row) + + //鏍规嵁褰撳墠琛岀殑缂栧彿锛岃捣濮嬫椂闂存潵 璇锋眰寮傚父鏁版嵁 + // 瀵硅姹傚埌鐨勬暟鎹繘琛岄灏炬嫾鎺� + // 寰楀埌鍓嶅悗瀹屾暣鏁版嵁杩涜缁樺埗鍥惧舰 + + let params = {} + if (row.name) { + params['siteName'] = row.name + } + if (row.beginTime) { + params['beginTime'] = row.beginTime + } + if (row.endTime) { + params['endTime'] = row.endTime + } + + this.$http.get('/dust/history', { params: params }).then((response) => { + // 淇濆瓨杩斿洖鐨勮秴鏍囨暟鎹� + this.dialog.historyData = response.data.data + this.dialog.exceptionTotal = response.data.data.length + // 閫昏緫澶勭悊 + this.timeAndDataProcessed() + }) + }, + + /** + * description锛氭潯浠舵煡璇㈠紓甯哥殑鏁版嵁 + * @createTime:2023-08-18 + */ + handleSubmit() { + // if (this.isExceedOneMonth(this.beginTime, this.endTime)) { + // alert('鏃堕棿璺ㄥ害涓嶈兘瓒呰繃涓�涓湀') + // return + // } + + this.flag.originClick = 0 + + let params = {} + params['page'] = this.currentPage + params['pageSize'] = this.pageSize + // if (this.form.name) { + // params['siteName'] = this.form.name + // } + if (this.form.exceptionName.length != 0) { + params['exceptionType'] = this.form.exceptionName.join() + } + params['beginTime'] = this.beginTime + params['endTime'] = this.endTime + this.loading.tableLoading = true + this.loading.queryButton = true + this.$http.get('/dust/exceptiondata', { params: params }).then((response) => { + // 淇濆瓨杩斿洖鐨� + this.displayData = response.data.data.rows + this.loading.queryButton = false + + if (response.data.data.total == 0) { + ElMessage('璇ユ椂娈垫棤鏁版嵁') + this.isNoData = true + return + } + this.total = response.data.data.total + this.loading.tableLoading = false + // 绉婚櫎绌烘暟鎹姸鎬� + this.isNoData = false + }) + this.gethasCheckedNumByTime() + }, + + /** + * description锛氭墦寮�椤甸潰榛樿鍔犺浇鏈�杩戜竴鍛ㄧ殑寮傚父鏁版嵁 + * @createTime:2023-08-18 + */ + backExceptionDataAWeekAgo() { + this.loading.tableLoading = true + let params = {} + if (this.form.name) { + params['siteName'] = this.form.name + } + if (this.form.exceptionName) { + params['exceptionType'] = this.form.exceptionName + } + params['beginTime'] = this.beginTime + params['endTime'] = this.endTime + + this.$http.get('/dust/exceptiondata', { params: params }).then((response) => { + // 淇濆瓨杩斿洖鐨� + // this.tableData = response.data.data.rows; + this.displayData = response.data.data.rows + + if (response.data.data.total == 0) { + ElMessage('璇ユ椂娈垫棤鏁版嵁') + this.loading.tableLoading = false + this.isNoData = true + return + } + this.loading.tableLoading = false + this.total = response.data.data.total + }) + this.gethasCheckedNumByTime() + }, + + /** + * description锛氬皢涓浗鏍囧噯鏃堕棿杞负鎸囧畾鏍煎紡(璇ョ粍浠惰繑鍥炵殑鏍囧噯鏃堕棿鐨勬牸寮忥紝鎵�浠ュ繀椤荤殑鍔犺繖涓嚱鏁�) + * @createTime:2023-08-17 + */ + // giveTime(val) { + // this.beginTime = dayjs(val[0]).format('YYYY-MM-DD HH:mm:ss') + // this.endTime = dayjs(val[1]).format('YYYY-MM-DD HH:mm:ss') + // }, + + // 鍔熻兘锛氳〃鏍奸珮搴︽牴鎹唴瀹硅嚜閫傚簲 + calTableHeight() { + const h1 = this.$refs.h1.$el.offsetHeight + const h2 = this.$refs.h2.$el.offsetHeight + const h4 = this.$refs.h4.$el.offsetHeight + // 鍏朵腑涓�涓�40鏄洅瀛愮殑鎬诲杈硅窛 + this.tableHeight = `calc(100vh - ${h1}px - ${h2}px - ${h4}px - 20px - 10px - var(--el-main-padding) * 2)` + // this.tableHeight = `calc(100vh - ${h1}px - ${h4}px - 100px - var(--el-main-padding) * 2)`; + }, + + // 椤靛ぇ灏忔敼鍙樻椂瑙﹀彂 + handleSizeChange(val) { + this.pageSize = val + + // 鏀瑰彉姣忛〉鏄剧ず鏁扮洰鏃惰烦鍒板綋鍓嶉〉 + this.handleCurrentChange(1) + }, + + // 椤靛彿鏀瑰彉鏃惰Е鍙� + /** + * description锛氶〉鍙锋敼鍙樻椂瑙﹀彂 + * @param锛� 褰撳墠椤碉紝鏍囪浣嶏紙0浠h〃鏄偣鍑烩�樻煡璇⑩�欒Е鍙戠殑锛�1浠h〃鏃剁偣鍑诲紓甯哥珯鐐规枃鏈寜閽Е鍙戠殑锛� + * @createTime:2023-08-17 + * @returns锛� + */ + handleCurrentChange(val) { + // 灏嗗綋鍓嶉〉鍙风粰currentPage + this.currentPage = val + + // 椤甸潰鍙樺寲鏃惰皟鐢� 鏌ヨ鏁版嵁鍑芥暟 + if (this.flag.originClick == 0) { + this.handleSubmit() + } else if (this.flag.originClick == 1) { + const startIndex = (val - 1) * this.pageSize + const endIndex = startIndex + this.pageSize + + this.displayData = this.tableData.slice(startIndex, endIndex) + } + }, + // 琛ㄦ牸搴忓彿閫掑 + indexMethod1(index) { + return index + 1 + (this.currentPage - 1) * this.pageSize + }, + // 琛ㄦ牸搴忓彿閫掑 + indexMethod2(index) { + return index + 1 + } + } +} +</script> + +<template> + <el-row ref="h1"> + <el-col> + <el-card> + <el-form :inline="true"> + <div class="head-container-text"> + <el-form-item> + <AreaAndmonitorType :isHideArea="1"></AreaAndmonitorType> + </el-form-item> + + <!-- <el-form-item> + <InputSearch isNeedDefaultSite="0" isNeedRealTimeAdvice="1" :exceptionType="form.exceptionName" :beginTime="beginTime" :endTime="endTime" @submit-value="(n) => (form.name = n)"> + </InputSearch> + </el-form-item> --> + + <!-- <el-form-item> + <DaySelect + @submit-time="giveDay" + :day-begin="beginTime" + ></DaySelect> + </el-form-item> --> + + <el-form-item> + <TimeShortCuts + @submit-time="giveTime" + timeType="day" + :begin-and-end-time="[beginTime,endTime]" + :read-only="true" + ></TimeShortCuts> + </el-form-item> + + + <!-- <el-form-item> --> + + <!-- <ButtonClick + content="鎼滅储" + type="warning" + :loading="loading.queryButton" + @do-search="handleSubmit" + ></ButtonClick> + </el-form-item>--> + + + <el-form-item> + <ExceptionType @submit-value="(n) => (form.exceptionName = n)" :exception="exceptionType" :isDisabled="true"></ExceptionType> + </el-form-item> + </div> + + <div class="head-container-search"> + <span class="head-describtion-text"> + 閲戝北鍖� {{ beginTime }} 鈥斺�� {{ endTime }} 鎵皹鐩戞祴寮傚父淇℃伅姹囨��</span + > + </div> + </el-form> + </el-card> + </el-col> + </el-row> + + <el-row ref="h2"> + <el-col> + <div class="checknum"> + <div class="checknum-text"> + <el-tag>搴斿鏍告暟</el-tag><span >{{ total }} ({{ checkedRate }}%)</span> + </div> + + <div class="checknum-text"> + <el-tag type="success">宸插鏍告暟</el-tag><span>{{ auditTotal }}</span> + </div> + <div class="checknum-text"> + <el-tag type="info">瑙勮寖瀹℃牳鏁�</el-tag><span>{{ auditedRegular }} </span> + </div> + <div class="checknum-text"> + <el-tag type="warning">閮ㄥ垎瀹℃牳鏁�</el-tag><span>{{ auditPart }}</span> + </div> + <div class="checknum-text"> + <el-tag type="danger">寰呭鏍告暟</el-tag><span>{{ unCheckedNUm }} </span> + </div> + </div> + </el-col> + </el-row> + + <el-row> + <el-col v-show="!isNoData"> + <el-table + ref="table" + :data="displayData" + :height="tableHeight" + :highlight-current-row="true" + :row-class-name="tableRowClassName" + size="default" + v-loading="loading.tableLoading" + @selection-change="handleSelectionChange" + border + > + <el-table-column type="selection" width="55" align="center" /> + <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" width="200" fixed="right"> + <template #default="{ row }"> + <el-button type="primary" @click="showDialog(row)"> 鏌ョ湅璇︽儏 </el-button> + <el-button + v-if="row.auditStatus == 3" + size="default" + type="info" + @click="openAuditDiag(row)" + >宸插鏍�</el-button + > + <el-button + type="success" + size="default" + plain + v-else-if="row.auditStatus == 1 || row.auditStatus == 2" + @click="openAuditDiag(row)" + >寰呭鏍�</el-button + > + + <el-button v-else size="default" type="danger" @click="openAuditDiag(row)" + >寰呭鏍�</el-button + > + <!-- <span v-if="row.auditStatus == 3">宸插鏍�</span + ><span v-else>瀹℃牳</span> --> + </template> + </el-table-column> + </el-table> + + + <div class="check-button"> + <el-button + type="primary" + size="small" + :disabled="multipleSelection.length == 0" + @click="quickReview" + >鎵归噺瀹℃牳</el-button + > + <el-button + type="primary" + size="small" + :disabled="multipleSelection.length == 0" + @click="clearSelected" + >娓呴櫎閫変腑</el-button + > + </div> + + + <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="auditDialog.visible" :show-close="false" draggable> + <template #header> + <!-- <div class="title-text">娣诲姞澶囨敞</div> --> + <span class="title-text">{{ tableCurrentRowData.name }}</span + ><span>绔欑偣寮傚父鏁版嵁瀹℃牳</span> + </template> + + <el-form label-position="top"> + <el-form-item label="瀹℃牳浜�"> + <el-input v-model="userName.getUserName"></el-input> + </el-form-item> + <el-form-item label="瀹℃牳鎯呭喌"> + <el-input + v-model="auditDialog.checkerNotes" + type="textarea" + :autosize="true" + placeholder="瀹℃牳浜哄憳濉啓" + :disabled="tableCurrentRowData.auditStatus == 1" + /> + </el-form-item> + <el-form-item label="浼佷笟鍙嶉"> + <el-input + v-model="auditDialog.enterpriseNotes" + type="textarea" + :autosize="true" + placeholder="浼佷笟濉啓" + :disabled="tableCurrentRowData.auditStatus == 2" + /> + </el-form-item> + </el-form> + + <el-card v-show="tableCurrentRowData.auditStatus == 3"> + <template #header>瀹℃牳璇︽儏</template> + <el-form> + <el-form-item label="瀹℃牳浜�">{{ tableCurrentRowData.checker }}</el-form-item> + <el-form-item label="瀹℃牳鎯呭喌">{{ tableCurrentRowData.checkerContent }}</el-form-item> + <el-form-item label="瀹℃牳浜哄憳">{{ tableCurrentRowData.enterpriseContent }}</el-form-item> + </el-form> + </el-card> + + <template #footer> + <span class="dialog-footer"> + <el-button @click="close">鍙栨秷</el-button> + <el-button color="#626aef" :dark="isDark" plain @click="saveAudit">淇濆瓨</el-button> + <el-button + type="primary" + :loading="loading.submitAudit" + :disabled="tableCurrentRowData.auditStatus == 3" + @click="submitAudit" + > + 鎻愪氦 + </el-button> + </span> + </template> + </el-dialog> + + <el-dialog + claa="exception-dialog" + v-model="dialogTableVisible" + draggable + align-center + 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>{{ tableCurrentRowData.beginTime }} ~ + {{ tableCurrentRowData.endTime }} + </div> + </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> + </div> + </template> + + <!-- 鍥惧舰 --> + <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 prop="lst" label="閲囬泦鏃堕棿" align="center" show-overflow-tooltip /> + <el-table-column + prop="dustValue" + label="TSP(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> +.el-row { + margin-left: 20px; +} +/* 鏉′欢鏌ヨ妯″潡鐨勬牱寮� */ +.el-card { + margin-top: 10px; + margin-right: 10px; +} +.head-container-search { + display: flex; + justify-content: space-between; + +} +.head-describtion-text { + justify-content: flex-end; + margin-bottom: 10px; + font-size: 14px; + color: gray; +} +/* 鏉′欢鏌ヨ妯″潡缁撴潫 */ + +/*鍒嗘瀽 */ +.checknum { + margin: 10px 5px 20px 20px; + display: flex; +} +.checknum-text { + font-size: 14px; + margin-right: 50px; +} +.el-tag { + font-size: 14px; + vertical-align: baseline; +} + +.checknum-rate { + margin-left: 5px; +} + +/* 鍒嗘瀽缁撴潫 */ + +/* 琛ㄦ牸妯″潡鐨勬牱寮� */ +:global(.el-table .black-row) { + color: black; +} + +:global(.el-table .complete--gray-row) { + color: #86909c; +} +:global(.el-table .deep-gray-row) { + color: #7f9fcf; +} +/* 瀵硅瘽妗嗘爣棰� */ +.el-form-item__labe { + font-weight: bold; +} +.title-text { + font-weight: bold; + margin-right: 20px; +} +.check-button { + float: right; + margin-top: 10px; + margin-right: 20px; +} +.el-table { + color: #333333; +} +/* 琛ㄦ牸妯″潡缁撴潫 */ + +/* 鏌ョ湅璇︽儏瀵硅瘽妗嗘ā鍧楃殑鏍峰紡 */ + + +.diag-head-text1 { + /* 瀵硅瘽妗嗗ご閮ㄧ殑灞炴�у瓧娈靛姞绮� */ + font-weight: bold; +} + +.diag-head-text > div { + /* 瀵硅瘽妗嗗紓甯告椂闂存 */ + margin-top: 15px; +} + +.diag-head-text { + margin: 10px; + padding: 10px; + background: linear-gradient(90deg, #00c9ff 0%, #92fe9d 100%); + border: 2px solid #7bc0fc; +} + +.chart-jump-button { + + display: flex; + justify-content: right; +} + +.line-chart { + /* 寮傚父鎶樼嚎鍥� */ + width: 920px; + height: 300px; + margin-bottom: 20px; + min-width: 600px; +} + +.mx-1 { + position: absolute; + left: 10px; + bottom: 10px; +} + +/* 鏌ョ湅璇︽儏瀵硅瘽妗嗘ā鍧楃粨鏉� */ +</style> diff --git a/src/views/exception/components/exceptionDetail.vue b/src/views/exception/components/exceptionDetail.vue new file mode 100644 index 0000000..79c059c --- /dev/null +++ b/src/views/exception/components/exceptionDetail.vue @@ -0,0 +1,61 @@ +<!--鐐瑰嚮瀹℃牳 璺宠浆鑷冲鏍歌緟鍔╅〉闈� --> +<script> +import SubSiteAudit from '@/views/exception/components/SubSiteAudit.vue' +export default { + components: { + SubSiteAudit + }, + data() { + return { + beginTime: '', + endTime: '', + // 寮傚父绫诲瀷 + exceptionType: '', + + } + }, + watch: {}, + mounted() { + console.log('midd',this.beginTime, this.endTime); + }, + + + beforeRouteEnter(to, from, next) { + next((vm) => { + vm.beginTime = to.params.beginTime + vm.endTime = to.params.endTime + vm.exceptionType = to.params.exceptionType + // 纭繚浠ヤ究鍦ㄧ粍浠跺疄渚嬫洿鏂板悗鑾峰彇姝g‘鐨勫�� + vm.$nextTick(() => { + // console.log('midd11', vm.beginTime, vm.endTime); + }) + }) +}, + methods: { + // 鍥為��椤甸潰 + onBack() { + this.$router.back() + } + } +} +</script> + +<template> + <el-page-header @back="onBack"> + <template #content> + <span> 寮傚父瀹℃牳 </span> + </template> + </el-page-header> + + <SubSiteAudit :begin-time="beginTime" :end-time="endTime" :exception-type="exceptionType" > </SubSiteAudit> +</template> + +<style scoped> +.el-page-header { + margin: 10px 0px 10px 10px; +} +span { + font-size: 14px; + color: #333333; +} +</style> diff --git a/src/views/login/LoginSystem.vue b/src/views/login/LoginSystem.vue index 3d86745..3a69873 100644 --- a/src/views/login/LoginSystem.vue +++ b/src/views/login/LoginSystem.vue @@ -41,7 +41,7 @@ import Cookie from 'js-cookie' import ValidateCode from '@/sfc/ValidateCode.vue' import loginApi from '@/api/loginApi.js' -// import md5 from 'js-md5' +import { useLoginUserStore } from '@/stores/user' export default { components: { ValidateCode @@ -61,10 +61,12 @@ result: '' } }, +setup(){ + const user = useLoginUserStore() + return {user} +}, mounted() { this.getAccount() - localStorage.setItem('zmc','zmc') - localStorage.setItem('pass','1234') }, methods: { login() { @@ -77,6 +79,11 @@ ElMessage.success('鐧诲綍鎴愬姛') const token = 'abc' Cookie.set('token', token) + + // 杈撳叆鐨勭敤鎴峰悕淇濆瓨鍦╬inia涓�,骞朵笖瀛樺叆娴忚鍣ㄦ湰鍦� + this.user.currentLoginUser = res.data.data + + localStorage.setItem('currentUserName',res.data.data) // 鐧诲綍鎴愬姛锛岃烦杞埌瀵瑰簲椤甸潰 this.$router.push('/edata') // 鍋囪鐧诲綍鎴愬姛鍚庤烦杞埌 '/dashboard' 椤甸潰 // 淇濆瓨token diff --git a/src/views/risk_assessment/DataRiskModel.vue b/src/views/risk_assessment/DataRiskModel.vue index e91ba3e..d0bd569 100644 --- a/src/views/risk_assessment/DataRiskModel.vue +++ b/src/views/risk_assessment/DataRiskModel.vue @@ -13,6 +13,7 @@ import riskApi from '@/api/risk/riskApi.js' import riskValue from '@/utils/risk_estimate_common_function/riskValue.js' import lineChart from '@/utils/chartFunction/lineChart.js' +import siteInfo from '@/api/site/siteInfo.js' export default { components: { LineChart, @@ -73,7 +74,9 @@ // 椋庨櫓鍊� weight: '', // 鏃犳暟鎹厤缃椂闂存 - areaColor: [] + areaColor: [], + // 鏌愮珯鐐圭殑鍩烘湰淇℃伅 + siteInfo:{} } }, mounted() { @@ -89,10 +92,10 @@ methods: { // 鏌ヨ绔欑偣缁熻淇℃伅 - querySiteStaticsInfo(row) { + async querySiteStaticsInfo(row) { this.form.name = row.siteName // 鏇存柊缁熻鏁版嵁 - this.getAnalysisData() + await this.getAnalysisData() // 璁$畻椋庨櫓鍊� this.calRiskValue() }, @@ -114,6 +117,8 @@ riskAssessment() { // 鏇存柊鎺掑悕娓呭崟 this.getRiskRank() + // 鏇存柊璇ョ珯鐐圭殑鎵�灞炲満鏅拰杩愮淮鍟� + this.getSiteInfo(this.form.number) // 鏇存柊鍒嗘瀽鏁版嵁 this.getAnalysisData() // 璁$畻椋庨櫓鍊� @@ -147,14 +152,18 @@ this.form.number = arr[1] this.screenLoading = false + // 鏇存柊璇ョ珯鐐圭殑鎵�灞炲満鏅拰杩愮淮鍟� + this.getSiteInfo(this.form.number) // 鏇存柊鏃ョ粺璁℃暟鎹� this.getAnalysisData() // 璁$畻椋庨櫓鍊� this.calRiskValue() + }, // 璁$畻椋庨櫓鍊� calRiskValue() { + console.log('璁惧缂栫爜锛�',this.form.number) riskApi.queryRiskValue(this.form.number, this.month, 'month').then((response) => { this.weight = riskValue.calRiskValue(response.data.data[0]).toFixed(2) }) @@ -196,7 +205,6 @@ let noDataTimeInteval = lineChart.backNoDataInteval(begin, end) // 鏃犳暟鎹厤缃椂闂存 this.areaColor = lineChart.getMarkArea(noDataTimeInteval) - console.log('鍖哄煙', this.areaColor) this.setChart() // 鎶樼嚎鍥炬暟鎹� let temp = index.calBillData(this.chartData, begin, end) @@ -283,6 +291,20 @@ arr.sort((a, b) => b.riskValue - a.riskValue) // 鑾峰彇鍓峮um涓厓绱� return arr.slice(0, num) + }, + /** + * 鏍规嵁璁惧缂栧彿鏌ヨ绔欑偣鍩烘湰淇℃伅 + * @param锛� 璁惧缂栧彿 + */ + getSiteInfo(mnCode) { + siteInfo.querySiteInfoByMnCode(mnCode).then(response => { + this.siteInfo = response.data.data[0] + }) + }, + + openDetail() { + const encodedSiteName = encodeURIComponent(this.form.name) + this.$router.push(`/exceptionDetail/${encodedSiteName}/${this.month}`) } } } @@ -316,12 +338,45 @@ </el-form-item> </el-form> + <!-- <el-card class="site-info time-text" > + <span>{{form.name}}</span> + <br/> + <br/> + <span>鏁版嵁缁熻鏃舵锛歿{ form.beginTime }} ~ {{ form.endTime }}</span> + <el-tag class="mx-1" >鍦烘櫙</el-tag>{{siteInfo.typename}} + + <el-tag class="mx-1">杩愮淮鍟�</el-tag>{{siteInfo.dutyCompany}} + <el-button type="primary" size="small" class="exception-button" @click="openDetail()"> + 寮傚父璇︽儏 + </el-button> + </el-card> --> + <div v-loading="screenLoading" class="wait-name"> <div class="chart-container" v-show="!isNoData && !screenLoading"> - <div class="time-text"> + <!-- <div class="time-text"> <span>鏁版嵁缁熻鏃舵锛歿{ form.beginTime }} ~ {{ form.endTime }}</span> - <span class="site-name">{{ form.name }}</span> - </div> + <span class="site-name"> + <el-button type="primary" text class="exception-button" @click="openDetail()"> + 寮傚父璇︽儏 + </el-button> + + </span> + <el-tag class="mx-1" >鍦烘櫙</el-tag>{{siteInfo.typename}} + <el-tag class="mx-2">杩愮淮鍟�</el-tag>{{siteInfo.dutyCompany}} + </div> --> + + <el-card class="time-text" > + <span>{{form.name}}</span> + <br/> + <br/> + <span>鏁版嵁缁熻鏃舵锛歿{ form.beginTime }} ~ {{ form.endTime }}</span> + <el-tag class="mx-1" >鍦烘櫙</el-tag>{{siteInfo.typename}} + + <el-tag class="mx-1">杩愮淮鍟�</el-tag>{{siteInfo.dutyCompany}} + <el-button type="primary" size="small" class="exception-button" @click="openDetail"> + 寮傚父璇︽儏 + </el-button> + </el-card> <el-row :gutter="10"> <el-col :span="5"> @@ -333,7 +388,6 @@ :default-sort="{ prop: 'riskValue', order: 'descending' }" height="540" > - <!-- :index="indexMethod" --> <el-table-column type="index" @@ -345,8 +399,9 @@ /> <el-table-column prop="siteName" - label="绔欑偣鍚嶇О" + label="鐐逛綅鍚嶇О" show-overflow-tooltip + width="97" align="center" > <template #default="{ row }"> @@ -355,7 +410,11 @@ text class="table-button" @click="querySiteStaticsInfo(row)" - >{{ row.siteName }}</el-button + > + <span class="risk-rank-site"> + {{ row.siteName }} + </span> + </el-button > </template> </el-table-column> @@ -432,10 +491,11 @@ <div>浣庨闄�(锛�0.2)</div> </div> </div> - + </div> </el-card> </el-col> + <el-col :span="4"> <el-card shadow="never" class="card-height"> @@ -533,6 +593,7 @@ font-size: 14px; color: #333333; letter-spacing: 1px; + } .el-card { margin-top: 15px; @@ -621,7 +682,14 @@ .table-button { letter-spacing: 1px; text-decoration: underline; - border-radius: 0px; + /* border-radius: 0px; */ + +} +.risk-rank-site { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + width: 80px; } .site-name { margin-left: 20px; @@ -643,4 +711,22 @@ flex-direction: column; justify-content: space-around; } + +.el-tag{ + margin-left: 25px; + font-size: 14px; + vertical-align: baseline; +} +.exception-button { + vertical-align: baseline; + margin-left: 150px; +} + +.site-info-detail{ + display: flex; + justify-content: space-between; +} +.mx-1{ + margin-left: 100px; +} </style> diff --git a/src/views/risk_assessment/DataRiskRank.vue b/src/views/risk_assessment/DataRiskRank.vue index b9356a9..cfc8990 100644 --- a/src/views/risk_assessment/DataRiskRank.vue +++ b/src/views/risk_assessment/DataRiskRank.vue @@ -217,9 +217,9 @@ fixed show-overflow-tooltip /> - <el-table-column prop="name" label="绔欑偣鍚嶇О" show-overflow-tooltip /> + <el-table-column prop="name" label="鐐逛綅鍚嶇О" show-overflow-tooltip /> - <el-table-column prop="mnCode" label="璁惧缂栧彿" show-overflow-tooltip /> + <el-table-column prop="mnCode" label="璁惧缂栫爜" show-overflow-tooltip /> <el-table-column prop="lst" label="鐩戞祴鏃ユ湡" sortable show-overflow-tooltip /> diff --git a/src/views/risk_assessment/SiteComprehensiveRskRanking.vue b/src/views/risk_assessment/SiteComprehensiveRskRanking.vue index 8d11b84..7943643 100644 --- a/src/views/risk_assessment/SiteComprehensiveRskRanking.vue +++ b/src/views/risk_assessment/SiteComprehensiveRskRanking.vue @@ -6,8 +6,6 @@ import ButtonClick from '@/sfc/ButtonClick.vue' import { ElMessage } from 'element-plus' import MonthSelect from '@/sfc/MonthSelect.vue' -import { useLoadingStore } from '@/stores/loadingStore' -import { mapStores } from 'pinia' import riskApi from '@/api/risk/riskApi.js' import riskValue from '@/utils/risk_estimate_common_function/riskValue.js' export default { @@ -15,7 +13,7 @@ AreaAndmonitorType, ButtonExportExcel, ButtonClick, - MonthSelect, + MonthSelect }, data() { return { @@ -65,7 +63,50 @@ return { exportToExcel } }, computed: { - ...mapStores(useLoadingStore) + // 璁$畻楂樹腑浣庣珯鐐规暟閲� + riskGradeNum() { + let riskGrade = {} + if (this.table) { + let highRisk = 0 + let middleRisk = 0 + let lowRisk = 0 + this.table.forEach((item) => { + switch (item.riskGrade) { + case '楂橀闄�': + highRisk++ + break + case '涓闄�': + middleRisk++ + break + case '浣庨闄�': + lowRisk++ + break + } + }) + riskGrade.high = highRisk + riskGrade.middle = middleRisk + riskGrade.low = lowRisk + } + return riskGrade + }, + // 楂樹腑浣庨闄╂瘮渚� + riskGradeRate() { + let rate = { + high:0, + middle:0, + low:0 + } + if (this.table.length !=0 ) { + let num = this.table.length + let highGrade = ((this.riskGradeNum.high / num)*100).toFixed(2) + let middleGrade = ((this.riskGradeNum.middle / num)*100).toFixed(2) + let lowGrade = ((this.riskGradeNum.low / num)*100).toFixed(2) + rate.high = highGrade + rate.middle = middleGrade + rate.low = lowGrade + } + return rate + } }, mounted() { // @@ -112,13 +153,11 @@ this.isNoData = true return } - + this.table = riskValue.backComprehensiveRiskTableData(response.data.data) - console.log('琛�', this.table) this.queryButton = false this.isNoData = false this.loading = false - this.$nextTick(() => { this.$refs.table.sort('riskValue', 'descending') }) @@ -175,8 +214,8 @@ }, openDetail(row) { const encodedSiteName = encodeURIComponent(row.siteName) - this.$router.push(`/detail/${encodedSiteName}/${this.form.month}`) - + let titleName = '绔欑偣椋庨櫓鏁版嵁璇︽儏' + this.$router.push(`/detail/${encodedSiteName}/${this.form.month}/${titleName}`) } } } @@ -184,7 +223,7 @@ <template> <el-row ref="h1"> - <el-row> + <el-col :span="24"> <el-form :inline="true" :model="form"> <el-form-item> <AreaAndmonitorType></AreaAndmonitorType> @@ -210,8 +249,19 @@ ></ButtonExportExcel> </el-form-item> </el-form> - </el-row> + </el-col> + <el-col :span="24" class="tag"> + + <el-tag type="primary"> 鍙傝瘎绔欑偣鏁�</el-tag><span class="analysis-info">{{ table.length }}</span> + <el-tag type="danger"> 楂橀闄╂暟</el-tag> <span class="analysis-info">{{ riskGradeNum.high }} ({{ riskGradeRate.high }}%)</span> + <el-tag type="warning"> 涓闄╂暟</el-tag> <span class="analysis-info">{{ riskGradeNum.middle }} ({{ riskGradeRate.middle }}%)</span> + <el-tag type="success"> 浣庨闄╂暟</el-tag> <span class="analysis-info">{{ riskGradeNum.low }} ({{ riskGradeRate.low }}%)</span> + + + </el-col> </el-row> + + <el-table ref="table" @@ -234,14 +284,15 @@ width="55" show-overflow-tooltip /> - <el-table-column prop="siteName" label="绔欑偣鍚嶇О" align="center" show-overflow-tooltip> + <el-table-column prop="siteName" label="鐐逛綅鍚嶇О" align="center" show-overflow-tooltip> <template #default="{ row }"> <el-button type="primary" text class="table-button" @click="openDetail(row)">{{ row.siteName }}</el-button> </template> </el-table-column> - <el-table-column prop="region" label="鍖哄煙" align="center" width="80" show-overflow-tooltip /> + + <el-table-column prop="region" label="鍖哄幙" align="center" width="80" show-overflow-tooltip /> <el-table-column prop="monitorType" label="妫�娴嬬被鍨�" @@ -271,20 +322,20 @@ </el-table-column> <el-table-column prop="beginTime" - label="寮�濮嬫棩鏈�" + label="鏃ユ湡" sortable align="center" width="160" show-overflow-tooltip /> - <el-table-column + <!-- <el-table-column prop="endTime" label="缁撴潫鏃ユ湡" sortable align="center" width="160" show-overflow-tooltip - /> + /> --> </el-table> <el-empty v-show="isNoData" :image-size="200" /> </template> @@ -307,4 +358,14 @@ .el-table { color: #333333; } +.analysis-info { + margin-right: 20px; +} +.tag{ + margin: 10px 5px 5px 1px; +} +.el-tag { + font-size: 14px; + vertical-align: baseline; +} </style> diff --git a/src/views/risk_assessment/components/SiteDetail.vue b/src/views/risk_assessment/components/SiteDetail.vue index 9979374..726487c 100644 --- a/src/views/risk_assessment/components/SiteDetail.vue +++ b/src/views/risk_assessment/components/SiteDetail.vue @@ -1,14 +1,16 @@ <!--鐐瑰嚮绔欑偣 璺宠浆鑷抽闄╂ā鍨嬮〉闈� --> <script> -import subRiskModel from '@/views/risk_assessment/components/subRiskModel.vue' +import SubFlightInspection from '@/views/exception/components/SubFlightInspection.vue' export default { components: { - subRiskModel + SubFlightInspection }, data() { return { siteName: '', - month: '' + month: '', + // 椤垫爣棰� + title:'' } }, watch: {}, @@ -18,6 +20,9 @@ // 閫氳繃 `vm` 璁块棶缁勪欢瀹炰緥 vm.siteName = to.params.siteName vm.month = to.params.month + vm.$nextTick(() => { + // console.log('midd11', vm.siteName, vm.month); + }) }) }, methods: { @@ -32,11 +37,11 @@ <template> <el-page-header @back="onBack"> <template #content> - <span> 绔欑偣椋庨櫓鏁版嵁璇︽儏 </span> + <span> 寮傚父璇︽儏 </span> </template> </el-page-header> - <subRiskModel :sName="siteName" :month_1="month"> </subRiskModel> + <SubFlightInspection :site-name="siteName" :month="month"> </SubFlightInspection> </template> <style scoped> -- Gitblit v1.9.3