From 73cb3ec2b1660610e3621d7614ad308f2c19331d Mon Sep 17 00:00:00 2001 From: zmc <zmc_li@foxmail.com> Date: 星期四, 16 十一月 2023 17:19:38 +0800 Subject: [PATCH] 1.修改了综合风险模型表格数据的获取 2.修改了时间选择器 --- src/utils/time.js | 19 src/views/risk_assessment/DataRiskRank.vue | 5 src/views/exception/FlightInspection.vue | 21 src/views/exception/SiteAuditAssistance.vue | 76 -- src/views/risk_assessment/components/LineChart.vue | 24 src/api/index.js | 4 src/api/risk/riskApi.js | 62 + src/views/risk_assessment/DataRiskModel.vue | 261 +++--- src/views/data_management/HistoryData.vue | 18 src/views/pass_login/LoginAndGetData.vue | 51 + src/views/risk_assessment/components/DustRadarChart.vue | 3 src/components/layout/AppLayout.vue | 3 src/views/risk_assessment/components/SiteDetail.vue | 2 src/utils/risk_estimate_common_function/index.js | 7 src/sfc/TimeShortCuts.vue | 86 ++ src/router/index.js | 41 - /dev/null | 583 ----------------- src/components/layout/selectName.js | 2 src/main.js | 2 src/sfc/MonthSelect.vue | 6 src/utils/risk_estimate_common_function/riskValue.js | 150 +++- src/views/risk_assessment/components/JumpDialog.vue | 41 + src/views/risk_assessment/SiteComprehensiveRskRanking.vue | 172 ++--- src/views/risk_assessment/components/subRiskModel.vue | 197 +--- src/utils/chartFunction/lineChart.js | 163 ++++ src/sfc/InputSearch.vue | 37 + 26 files changed, 843 insertions(+), 1,193 deletions(-) diff --git a/src/api/index.js b/src/api/index.js index 41cd230..75b646c 100644 --- a/src/api/index.js +++ b/src/api/index.js @@ -4,6 +4,7 @@ // const url = 'http://localhost:8081/'; // 閮ㄧ讲 const url = 'http://114.215.109.124:8803/'; +// const url = 'http://192.168.1.8:8081/'; //椋炵窘鐩戠 const $http = axios.create({ @@ -11,8 +12,9 @@ timeout: 10000 }); -/* Python鍚庡彴 */ + +/* Python鍚庡彴 */ const url_py = 'http://127.0.0.1:8089/' const $http_py = axios.create({ baseURL: url_py, diff --git a/src/api/risk/riskApi.js b/src/api/risk/riskApi.js index 0df350e..38b3400 100644 --- a/src/api/risk/riskApi.js +++ b/src/api/risk/riskApi.js @@ -1,24 +1,48 @@ -import {$http} from '@/api/index.js'; +import { $http } from '@/api/index.js' -export default{ - /** - * 鏍规嵁绔欑偣淇℃垨鏈堜唤锛岀被鍨� 鏌ヨ椋庨櫓鍊� - * @param锛� - * @returns锛� - */ +export default { + /** + * 鏍规嵁绔欑偣淇℃垨鏈堜唤锛岀被鍨� 鏌ヨ椋庨櫓鍊� + * @param锛� + * @returns锛� + */ + queryRiskValue(mnCode, month, type) { + const params = { + mnCode: mnCode, + month: month, + type: type + } - queryRiskValue(siteName,month,type){ - const params = { - month:month, - type:type, - } + return $http.get('/dust/risk/month', { params: params }) + }, - if(siteName != '' || siteName != null){ - params.siteName = siteName - } - - return $http.post('/dust/risk/riskValue',params) - }, + /** + * 鏍规嵁椋庨櫓鍊艰幏寰楅闄╃瓑绾у拰椋庨櫓寤鸿 + * @param锛� + * @returns锛� + */ + getRiskAdvice(riskValue) { + let temp = {} + // 浣庨闄� + if (riskValue < 0.2) { + temp.riskGrade = '浣庨闄�' + temp.riskAdvice = + '1.寤鸿鍙婃椂鎻愰啋璇ョ珯鐐规墍灞炲崟浣嶈繘琛屽簲鎬ョ淮鎶わ紱\n2.鑻ュ悓鏃跺瓨鍦ㄨ秴鏍囥�佷复鐣岃秴鏍囥�侀噺绾х獊鍙樼瓑寮傚父鏃讹紝寤鸿灏嗚绔欑偣绉讳氦鐜鎵ф硶澶ч槦寮�灞曠幇鍦烘墽娉曟鏌ワ紱\n3.鑻ユ寔缁袱鏈堝強浠ヤ笂涓洪珮椋庨櫓锛屽缓璁皢璇ョ珯鐐圭撼鍏ュ勾搴︽娊娴嬫瘮瀵规竻鍗曪紱'.split('\n') + + } + // 涓闄� + if (riskValue < 0.6 && riskValue >= 0.2) { + temp.riskGrade = '涓闄�' + temp.riskAdvice = + '1.寤鸿閫氳繃瀹堟硶鏈嶅姟灏忕▼搴忋�佺洃娴嬬洃绠″井淇$兢绛夌嚎涓婃柟寮忔彁绀虹珯鐐规墍灞炲崟浣嶏紝鑱氱劍褰撳墠瀛樺湪鐨勯棶棰樻垨闅愭偅锛屽強鏃跺紑灞曡嚜鏌ヨ嚜绾狅紱\n2.鑻ュ悓鏃跺瓨鍦ㄥ湪绾跨巼鎴栨湁鏁堢巼鏈堝害涓嶈揪鏍囷紝寤鸿鐢佃瘽閫氱煡璇ョ珯鐐规墍灞炲崟浣嶈繘琛屽簲鎬ョ淮鎶わ紝骞惰繘琛屼笓椤瑰鏍革紱'.split('\n') + } + // 楂橀闄� + if (riskValue >= 0.6) { + temp.riskGrade = '楂橀闄�' + temp.riskAdvice = + '1.鑻ヤ笉娑夊強瓒呮爣鎴栧湪绾跨巼銆佹湁鏁堢巼寮傚父锛屽父鎬佹暟鎹鏍稿嵆鍙紱\n2.鑻ユ秹鍙婅秴鏍囨垨鍦ㄧ嚎鐜囥�佹湁鏁堢巼绛夊紓甯革紝寤鸿閫氳繃瀹堟硶鏈嶅姟灏忕▼搴忋�佺洃娴嬬洃绠″井淇$兢绛夌嚎涓婃柟寮忔彁绀虹珯鐐规墍灞炲崟浣嶏紝鍙婃椂寮�灞曡嚜鏌ヨ嚜绾狅紱'.split('\n') + } + return temp + } } - diff --git a/src/components/layout/AppLayout.vue b/src/components/layout/AppLayout.vue index 1f58393..f4c7603 100644 --- a/src/components/layout/AppLayout.vue +++ b/src/components/layout/AppLayout.vue @@ -41,7 +41,8 @@ .header-and-main { flex-direction: column; height: 100vh; - min-width: 1445px; + // min-width: 1445px; + min-width: 1475px; } /* // 鍨傜洿鏂瑰悜婧㈠嚭鍖哄煙绂佹婊氬姩 */ .el-main { diff --git a/src/components/layout/selectName.js b/src/components/layout/selectName.js new file mode 100644 index 0000000..39a4d25 --- /dev/null +++ b/src/components/layout/selectName.js @@ -0,0 +1,2 @@ +import {ref} from 'vue' +export const selectedName = ref('') diff --git a/src/main.js b/src/main.js index 04920ab..bfaa55f 100644 --- a/src/main.js +++ b/src/main.js @@ -37,6 +37,8 @@ // axios.defaults.baseURL = 'http://localhost:8081' // 閮ㄧ讲 axios.defaults.baseURL = 'http://114.215.109.124:8803' + +// axios.defaults.baseURL = 'http://192.168.1.8:8081' app.config.globalProperties.$http = axios app.use(ElMessage) diff --git a/src/router/index.js b/src/router/index.js index 7dcc63b..e546ff3 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -11,42 +11,12 @@ component: () => import('@/components/layout/AppLayout.vue'), children: [ - // { - // path:'/avalue', - // name:'avalue', - // meta: {title: '椋庨櫓璇勪及'}, - // children:[ - // // 鏁版嵁鍒嗛櫓妯″瀷 - // { - // path: "/avgDay", - // name: 'avgDay', - // meta: { title: '鏁版嵁鍒嗛櫓妯″瀷' }, - // component: () => import('@/views/line_graph/DataRiskModel.vue') - // }, - - // // 鏁版嵁椋庨櫓鎺掑悕 - // { - // path: "/analysis", - // name: 'analysis', - // meta: { title: '鏁版嵁椋庨櫓鎺掑悕' }, - // component: () => import('@/views/line_graph/DataRiskRank.vue') - // }, - // // 鏁版嵁椋庨櫓鎺掑悕 - // { - // path: "/riskrank", - // name: 'riskrank', - // meta: { title: '缁煎悎椋庨櫓鎺掑悕' }, - // component: () => import('@/views/line_graph/SiteComprehensiveRskRanking.vue') - // }, - // ] - // }, - // 鏁版嵁鍒嗛櫓妯″瀷 { path: "/avgDay", name: 'avgDay', meta: { title: '鏁版嵁鍒嗛櫓妯″瀷' , keepAlive: true}, - component: () => import('@/views/line_graph/DataRiskModel.vue') + component: () => import('@/views/risk_assessment/DataRiskModel.vue') }, // 鏁版嵁椋庨櫓鎺掑悕 @@ -54,14 +24,15 @@ path: "/analysis", name: 'analysis', meta: { title: '鏁版嵁椋庨櫓鎺掑悕' , keepAlive: true}, - component: () => import('@/views/line_graph/DataRiskRank.vue') + component: () => import('@/views/risk_assessment/DataRiskRank.vue') }, + // 鏁版嵁椋庨櫓鎺掑悕 { path: "/riskrank", name: 'riskrank', meta: { title: '缁煎悎椋庨櫓鎺掑悕' , keepAlive: true }, - component: () => import('@/views/line_graph/SiteComprehensiveRskRanking.vue') + component: () => import('@/views/risk_assessment/SiteComprehensiveRskRanking.vue') }, // 椋炶宸℃ @@ -117,7 +88,7 @@ path: "/detail/:siteName/:month", name: 'detail', meta: { title: '绔欑偣鍏蜂綋淇℃伅',transition: 'slide-left' }, - component: () => import('@/views/line_graph/components/SiteDetail.vue') + component: () => import('@/views/risk_assessment/components/SiteDetail.vue') }, // 椋庨櫓妯″瀷宓屽叆 @@ -125,7 +96,7 @@ path: "/subRiskModel", name: 'subRiskModel', meta: { title: '椋庨櫓妯″瀷宓屽叆' }, - component: () => import('@/views/line_graph/components/subRiskModel.vue') + component: () => import('@/views/risk_assessment/components/subRiskModel.vue') }, ], diff --git a/src/sfc/InputSearch.vue b/src/sfc/InputSearch.vue index 2db8a64..2e339d2 100644 --- a/src/sfc/InputSearch.vue +++ b/src/sfc/InputSearch.vue @@ -1,6 +1,10 @@ <!-- 杩滅▼鎼滅储 绔欑偣鍚嶇О 杈撳叆妗嗙粍浠� 鏍规嵁杈撳叆绔欑偣鐨勫唴瀹规彁渚涘搴旂殑杈撳叆寤鸿 + 1.鍚戠埗缁勪欢浼犲叆绔欑偣鍚嶅瓧 鍜� 璁惧缂栫爜 + 2.鍙互閫夋嫨寤鸿鎴栬�呬换鎰忚緭鍏� + 3.鐖剁粍浠跺彲浠ヨ缃緭鍏ユ鏈夋棤榛樿鐨勭珯鐐瑰悕绉� + 4.鐖剁粍浠跺彲浠ヨ缃槸鍚﹂渶瑕佹牴鎹�変腑鐨勫紓甯哥被鍨嬫潵缁欏嚭绔欑偣寤鸿 ** 鍦ㄧ埗缁勪欢涓缃� <InputSearch :isNeedDefaultSite="1" @submit-value="(n)=>form.name=n"> </InputSearch> @@ -44,13 +48,15 @@ default:'-1' } }, - emits: ['submitValue', 'submitSiteNums'], + emits: ['submitValue', 'submitSiteNums','submitMncode'], data() { return { // 鐢ㄦ埛閫変腑鐨勫�� state: '', // 淇濆瓨杈撳叆寤鸿鐨勭珯鐐瑰悕绉� - siteNames: [] + siteNames: [], + // 淇濆瓨杈撳叆寤鸿鐨勭珯鐐硅澶囩紪鍙� + siteNamesAndMnCode:[] } }, watch:{ @@ -81,6 +87,12 @@ if(this.siteName != '-1' && this.siteName != ''){ this.state = this.siteName this.$emit('submitValue', this.state) + } + }, + state(){ + if(this.state != '' && this.state != null){ + // 鏌ユ壘瀵瑰簲鐨勮澶囩紪鍙� + this.onSiteNameSelected(this.state) } } }, @@ -118,6 +130,10 @@ const sites = res.data.data sites.filter((item) => { this.siteNames.push(item['name']) + let temp = {} + temp.name = item.name + temp.mnCode = item.mnCode + this.siteNamesAndMnCode.push(temp) }) }) @@ -126,11 +142,24 @@ const sites = response.data.data sites.filter((item) => { this.siteNames.push(item['name']) + let temp = {} + temp.name = item.name + temp.mnCode = item.mnCode + this.siteNamesAndMnCode.push(temp) }) this.$emit('submitSiteNums', this.siteNames.length) }) } }, + // 鏍规嵁閫変腑鐨勭珯鐐规煡璇㈣澶囩紪鍙� + onSiteNameSelected(siteName) { + const selectedSite = this.siteNamesAndMnCode.find((site) => site.name == siteName); + if (selectedSite) { + this.$emit('submitMncode',selectedSite.mnCode) + }else{ + this.$emit('submitMncode','') + } +}, // 鐐瑰嚮閫変腑寤鸿椤规椂瑙﹀彂 handleSelect(item) { @@ -141,7 +170,8 @@ clearSiteName() { this.state = '' this.$emit('submitValue', this.state) - } + }, + } } </script> @@ -155,6 +185,7 @@ popper-class="my-autocomplete" placeholder="璇疯緭鍏�" @select="handleSelect" + @change="handleSelect" clearable @clear="clearSiteName" > diff --git a/src/sfc/MonthSelect.vue b/src/sfc/MonthSelect.vue index 181a160..71d1f94 100644 --- a/src/sfc/MonthSelect.vue +++ b/src/sfc/MonthSelect.vue @@ -15,7 +15,7 @@ <script> import dayjs from 'dayjs'; - +import time from '@/utils/time.js' export default { props:{ month:{ @@ -44,6 +44,9 @@ pre_month(){ this.value = dayjs().subtract(1,'month').startOf('month').format('YYYY-MM-DD') this.$emit('submitValue',this.value) + }, + judgeDateValid(date) { + return time.judgeDateValid(date) } } } @@ -56,6 +59,7 @@ v-model="value" type="month" placeholder="閫夋嫨鏈堜唤" + :disabled-date="judgeDateValid" @change="$emit('submitValue',value)" /> </div> diff --git a/src/sfc/TimeShortCuts.vue b/src/sfc/TimeShortCuts.vue index d793bce..d3f1c54 100644 --- a/src/sfc/TimeShortCuts.vue +++ b/src/sfc/TimeShortCuts.vue @@ -14,8 +14,11 @@ }, *** --> + + <script> import dayjs from 'dayjs'; +import time from '@/utils/time.js' export default { props: { beginAndEndTime:{ @@ -56,34 +59,89 @@ }, methods: { initShortCuts() { + // this.shortcuts = [ + // { + // text: '鍓嶄竴鏃�', + // value: () => { + // const start = dayjs().subtract(1,'day').format('YYYY-MM-DD 00:00:00') + // const end = dayjs().subtract(1,'day').format('YYYY-MM-DD 23:59:59') + // return [start, end]; + // } + // }, + + // { + // text: '鍓�7澶�', + // value: () => { + // const start = dayjs().subtract(7,'day').format('YYYY-MM-DD 00:00:00'); + // const end = dayjs().subtract(1,'day').format('YYYY-MM-DD 23:59:59'); + // return [start, end]; + // } + // }, + // { + // text: '涓婁竴鏈�', + // value: () => { + // const start = dayjs().subtract(1,'month').startOf('month').format('YYYY-MM-DD HH:mm:ss'); + // const end = dayjs().subtract(1,'month').endOf('month').format('YYYY-MM-DD HH:mm:ss'); + // return [start, end]; + // } + // } + // ]; + + this.shortcuts = [ { text: '鍓嶄竴鏃�', value: () => { - const start = dayjs().subtract(1,'day').format('YYYY-MM-DD 00:00:00') - const end = dayjs().subtract(1,'day').format('YYYY-MM-DD 23:59:59') - return [start, end]; + if (this.time[0]=='2023-06-01 12:00:00' && this.time[1] == '2023-06-20 16:00:00'){ + const start = dayjs().subtract(1,'day').format('YYYY-MM-DD 00:00:00') + const end = dayjs().subtract(1,'day').format('YYYY-MM-DD 23:59:59') + return [start, end]; + }else{ + const start = dayjs(this.time[0]).subtract(1,'day').format('YYYY-MM-DD 00:00:00') + const end = dayjs(this.time[1]).subtract(1,'day').format('YYYY-MM-DD 23:59:59') + return [start, end]; + } } }, { text: '鍓�7澶�', value: () => { - const start = dayjs().subtract(7,'day').format('YYYY-MM-DD 00:00:00'); - const end = dayjs().subtract(1,'day').format('YYYY-MM-DD 23:59:59'); + if (this.time[0]=='2023-06-01 12:00:00' && this.time[1] == '2023-06-20 16:00:00'){ + const start = dayjs().subtract(7,'day').format('YYYY-MM-DD 00:00:00'); + const end = dayjs().subtract(1,'day').format('YYYY-MM-DD 23:59:59'); return [start, end]; + }else{ + const start = dayjs(this.time[0]).subtract(7,'day').format('YYYY-MM-DD 00:00:00') + const end = dayjs(this.time[1]).subtract(7,'day').format('YYYY-MM-DD 23:59:59') + return [start, end]; + } + } }, { text: '涓婁竴鏈�', value: () => { - const start = dayjs().subtract(1,'month').startOf('month').format('YYYY-MM-DD HH:mm:ss'); - const end = dayjs().subtract(1,'month').endOf('month').format('YYYY-MM-DD HH:mm:ss'); - return [start, end]; + if (this.time[0]=='2023-06-01 12:00:00' && this.time[1] == '2023-06-20 16:00:00'){ + const start = dayjs().subtract(1,'month').startOf('month').format('YYYY-MM-DD HH:mm:ss'); + const end = dayjs().subtract(1,'month').endOf('month').format('YYYY-MM-DD HH:mm:ss'); + return [start, end]; + }else{ + const start = dayjs(this.time[0]).subtract(1,'month').format('YYYY-MM-DD HH:mm:ss') + const end = dayjs(this.time[1]).subtract(1,'month').format('YYYY-MM-DD HH:mm:ss') + return [start, end]; + } + } } ]; + }, + + + + + initOneWeekAgoTime() { switch (this.timeType) { case 'day': @@ -110,12 +168,15 @@ // 闃叉鍦ㄦ瘡鏈堢殑1鍙凤紝鍑虹幇time[0]>time[1]鐨勬儏鍐� if(this.time[0]<this.time[1]){ break - } + } default: this.time[0] = dayjs().subtract(1, 'month').format('YYYY-MM-DD HH:mm:ss'); this.time[1] = dayjs().format('YYYY-MM-DD HH:mm:ss'); } - } + }, + judgeDateValid(date) { + return time.judgeDateValid(date) + } } }; </script> @@ -132,6 +193,7 @@ start-placeholder="寮�濮嬫椂闂�" end-placeholder="缁撴潫鏃堕棿" value-format="YYYY-MM-DD HH:mm:ss" + :disabled-date="judgeDateValid" @change="$emit('submitTime', time)" :default-time = "defaultTime" @@ -151,7 +213,5 @@ font-size: 14px; } -/* .pick-date { - width: 200px; -} */ + </style> diff --git a/src/utils/chartFunction/lineChart.js b/src/utils/chartFunction/lineChart.js new file mode 100644 index 0000000..6c0c2fd --- /dev/null +++ b/src/utils/chartFunction/lineChart.js @@ -0,0 +1,163 @@ +import dayjs from 'dayjs' + +export default { + // 鑾峰彇璇ユ湀浠藉ぉ鏁� + // 鏍规嵁璧峰鏃堕棿鏋勫缓x杞� + // 鏍规嵁澶╂暟閬嶅巻 + // 鏃ユ湡澶╂暟+1 + // 娣诲姞鍒皒杞存暟缁� + // 鐩村埌閬嶅巻鐨勬鏁� + // 鏍规嵁澶╂暟閬嶅巻 + // 瀵逛负绌虹殑鐨勫ぉ鏁版暟鎹� 杩涜琛ュ厖 y杞存暟鎹负null + + /** + * 鏍规嵁浼犲叆鐨勭粺璁℃暟鎹紝璧峰鏃堕棿锛岃繑鍥炲畬鏁寸殑x,y杞存暟鎹� + * @param锛� 缁熻鏁版嵁锛屽紑濮嬫椂闂达紝缁撴潫鏃堕棿 + * @returns锛歺,y杞存暟鎹� + */ + getLineChartXYData(analysisData, beginTime, endTime) { + // x杞� + let xData = [] + // y杞寸殑骞冲潎鍊� + let yAvg = [] + // y杞寸殑鍦ㄧ嚎鐜� + let yOnline = [] + // y杞寸殑鏈夋晥鍊� + let yValid = [] + // y杞寸殑瓒呮爣鐜� + let yExceed = [] + // 淇濆瓨x,y杞村�� + let obj = {} + + // 寮�濮嬫棩鏈熶负 + let dateBegin = dayjs(beginTime).subtract(1, 'day').format('YYYY-MM-DD') + let dateEnd = dayjs(endTime).format('YYYY-MM-DD') + + // 褰撳墠鐨勬棩鏈熶负寮�濮嬫棩鏈熺殑鍓嶄竴澶� + let currentDate = dateBegin + // 瀵规棤鏁版嵁鐨勬棩鏈熻繘琛屽~鍏� + while (currentDate < dateEnd) { + // 褰撳墠鏃ユ湡澧炲姞1澶� + currentDate = dayjs(currentDate).add(1, 'day').format('YYYY-MM-DD') + + // 鏍规嵁鏃ユ湡鏌ユ壘瀵瑰簲鏁版嵁 + let tempData = this.findDate(analysisData, currentDate) + // 鎵惧埌瀵瑰簲鏃ユ湡鐨勬暟鎹紝 + if (tempData) { + xData.push(tempData.lst) + yAvg.push(tempData.dayAvg) + yOnline.push(this.deleteLastStr(tempData.dayOnline)) + yValid.push(this.deleteLastStr(tempData.dayValid)) + yExceed.push(this.deleteLastStr(tempData.dayExceeding)) + continue + } + + // 鏈彂鐜拌鏃ユ湡鐨勬暟鎹� + xData.push(currentDate) + yAvg.push(null) + yOnline.push(null) + yValid.push(null) + yExceed.push(null) + } + + obj.xData = xData + obj.yAvg = yAvg + obj.yOnline = yOnline + obj.yValid = yValid + obj.yExceed = yExceed + return obj + }, + + /** + * 鑾峰彇鏈堝ぉ鏁� + * @param锛� + * @returns锛� + */ + backMonthDayNums(time) { + return dayjs(time).daysInMonth() + }, + + /** + * 杩斿洖鏃犳暟鎹殑鏃堕棿娈� + * @param锛� + * @returns锛� + */ + backNoDataInteval(dataBeginTime, dataEndTime) { + const result = [] + // 鏁版嵁寮�濮嬫椂闂� + const start = dayjs(dataBeginTime) + // 鏁版嵁缁撴潫鏃堕棿 + const end = dayjs(dataEndTime) + // 璇ユ湀鐨�1鍙� + const monthStart = start.startOf('month') + // 璇ユ湀鏈�鍚庝竴澶� + const monthEnd = start.endOf('month') + + // 鏁版嵁璧峰涓嶇瓑浜庢湀鍒� 涓� 鏁版嵁缁撴潫涓嶇瓑浜庢湀鏈� + if (!start.isSame(monthStart, 'day') && !end.isSame(monthEnd, 'day')) { + result.push([monthStart.format('YYYY-MM-DD'), start.format('YYYY-MM-DD')]) + result.push([end.format('YYYY-MM-DD'), monthEnd.format('YYYY-MM-DD')]) + } + + // 鏁版嵁璧峰绛変簬鏈堝垵 涓� 鏁版嵁缁撴潫涓嶇瓑浜庢湀鏈� + if (start.isSame(monthStart, 'day') && !end.isSame(monthEnd, 'day')) { + result.push([end.format('YYYY-MM-DD'), monthEnd.format('YYYY-MM-DD')]) + } + + // 鏁版嵁璧峰涓嶇瓑浜庢湀鍒� 涓� 鏁版嵁缁撴潫绛変簬鏈堟湯 + if (!start.isSame(monthStart, 'day') && end.isSame(monthEnd, 'day')) { + result.push([monthStart.format('YYYY-MM-DD'), start.format('YYYY-MM-DD')]) + } + + // 鏁版嵁璧峰绛変簬鏈堝垵 涓� 鏁版嵁缁撴潫绛変簬鏈堟湯 (杩欑鎯呭喌娌℃湁绌烘暟鎹殑鏃堕棿闂撮殧) + return result + }, + + // 缁勬垚鏃犳暟鎹尯鍩� + getMarkArea(timeInteval) { + let result = [] + for (let i = 0; i < timeInteval.length; i++) { + let temp = [] + for (let j = 0; j < timeInteval[i].length; j++) { + let obj = {} + // 缁欑涓�涓璞″姞涓妌ame灞炴�� + if (j == 0) { + obj.name = '鏃犳暟鎹�' + } + obj.xAxis = timeInteval[i][j] + temp.push(obj) + } + result.push(temp) + } + return result + }, + + /** + * 鎵惧埌瀵硅薄鏁扮粍涓睘鎬std鐨勫�� + * @param锛� 瀵硅薄鏁扮粍 锛宮nCode绛変簬value + * @returns锛� + */ + findDate(analysisData, date) { + if (analysisData.length == 0) { + return false + } + + // 鏌ユ壘鏃ユ湡 + for (let i = 0; i < analysisData.length; i++) { + if (analysisData[i].lst == date) { + return analysisData[i] + } + } + + return false + }, + + /** + * 鍘婚櫎瀛楃涓茬殑鐧惧垎鍙� + * @param锛� + * @returns锛� + */ + deleteLastStr(valueStr) { + return valueStr.slice(0, -1) + } +} diff --git a/src/utils/risk_estimate_common_function/index.js b/src/utils/risk_estimate_common_function/index.js index a6430d5..214c774 100644 --- a/src/utils/risk_estimate_common_function/index.js +++ b/src/utils/risk_estimate_common_function/index.js @@ -250,18 +250,19 @@ obj.region = '閲戝北鍖�' obj.monitorType = '鎵皹' obj.siteName = res.name + obj.mnCode = res.mnCode obj.beginTime = beginTime obj.endTime = endTime obj.riskValue = weight if (weight >= 0.6) { obj.riskGrage = '楂橀闄�' - obj.riskAdvice = '寤鸿瀵硅绔欑偣杩涜绾夸笅鎵ф硶妫�鏌ワ紝涓撻」鏁版嵁瀵规瘮' + obj.riskAdvice = '1.鑻ヤ笉娑夊強瓒呮爣鎴栧湪绾跨巼銆佹湁鏁堢巼寮傚父锛屽父鎬佹暟鎹鏍稿嵆鍙紱\n2.鑻ユ秹鍙婅秴鏍囨垨鍦ㄧ嚎鐜囥�佹湁鏁堢巼绛夊紓甯革紝寤鸿閫氳繃瀹堟硶鏈嶅姟灏忕▼搴忋�佺洃娴嬬洃绠″井淇$兢绛夌嚎涓婃柟寮忔彁绀虹珯鐐规墍灞炲崟浣嶏紝鍙婃椂寮�灞曡嚜鏌ヨ嚜绾狅紱' } else if (weight < 0.6 && weight >= 0.2) { obj.riskGrage = '涓闄�' - obj.riskAdvice = '寤鸿寮�灞曞父鎬佽拷韪垎鏋�' + obj.riskAdvice = '1.寤鸿閫氳繃瀹堟硶鏈嶅姟灏忕▼搴忋�佺洃娴嬬洃绠″井淇$兢绛夌嚎涓婃柟寮忔彁绀虹珯鐐规墍灞炲崟浣嶏紝鑱氱劍褰撳墠瀛樺湪鐨勯棶棰樻垨闅愭偅锛屽強鏃跺紑灞曡嚜鏌ヨ嚜绾狅紱\n2.鑻ュ悓鏃跺瓨鍦ㄥ湪绾跨巼鎴栨湁鏁堢巼鏈堝害涓嶈揪鏍囷紝寤鸿鐢佃瘽閫氱煡璇ョ珯鐐规墍灞炲崟浣嶈繘琛屽簲鎬ョ淮鎶わ紝骞惰繘琛屼笓椤瑰鏍革紱' } else { obj.riskGrage = '浣庨闄�' - obj.riskAdvice = '寤鸿寮曞浼佷笟闀挎�佷繚鎸�' + obj.riskAdvice = '1.寤鸿鍙婃椂鎻愰啋璇ョ珯鐐规墍灞炲崟浣嶈繘琛屽簲鎬ョ淮鎶わ紱\n2.鑻ュ悓鏃跺瓨鍦ㄨ秴鏍囥�佷复鐣岃秴鏍囥�侀噺绾х獊鍙樼瓑寮傚父鏃讹紝寤鸿灏嗚绔欑偣绉讳氦鐜鎵ф硶澶ч槦寮�灞曠幇鍦烘墽娉曟鏌ワ紱\n3.鑻ユ寔缁袱鏈堝強浠ヤ笂涓洪珮椋庨櫓锛屽缓璁皢璇ョ珯鐐圭撼鍏ュ勾搴︽娊娴嬫瘮瀵规竻鍗曪紱' } table.push(obj) }) diff --git a/src/utils/risk_estimate_common_function/riskValue.js b/src/utils/risk_estimate_common_function/riskValue.js index 3623799..2f37758 100644 --- a/src/utils/risk_estimate_common_function/riskValue.js +++ b/src/utils/risk_estimate_common_function/riskValue.js @@ -1,60 +1,118 @@ -// import rank from '@/utils/risk_estimate_common_function/rank.js'; -// import dayjs from 'dayjs.js'; - export default { - - // // 璁$畻鏃ラ闄╁�� - // calDailyRisk(allTypeRiskValue){ - // let dailyRiskValue = allTypeRiskValue.onlineRisk*0.1 + allTypeRiskValue.validRisk*0.2 + allTypeRiskValue.exceedingRisk*0.2 + allTypeRiskValue.exceptionTypeAggregation*0.2 + allTypeRiskValue.typicalExceptionRepetitionRate*0.3 - // return dailyRiskValue - // }, - - // // 璁$畻鏈堥闄╁�� - // calMonthRisk(DailyRiskValues,month){ - // // 鏍规嵁鏈堜唤鑾峰緱璇ユ湀鐨勫ぉ鏁� - // let dayNum = dayjs(month).daysInMonth() - // // 绱姞鏃ラ闄╁�� - // let sum = 0 - // for(let i in DailyRiskValues){ - // sum += i - // } - // // 鏃ュ紓甯哥被鍨嬭仛闆嗙巼鐨勫拰/褰撴湀澶╂暟 - // let monthRiskValue = sum /dayNum - // return monthRiskValue - // }, + /** + * 鐢卞崟鏉℃湀搴﹀�艰绠楅闄╁�� + * @param锛� + * @returns锛� + */ + calRiskValue(monthlyRiskData) { + // 椋庨櫓鍊� + let riskValue = monthlyRiskData.onlineRisk*0.1 + monthlyRiskData.validRisk*0.2 + monthlyRiskData.exceedRisk*0.2 + monthlyRiskData.exceptionTypeAggregation*0.2 + monthlyRiskData.typicalExceptionRepetitionRate*0.3 + return riskValue + }, - - // calRiskValue(allTypeRiskValue,queryMonth){ - // // 瀵硅澶囩紪鍙疯繘琛屽垎缁� - // let groupeObj = rank.groupByMncode(allTypeRiskValue) - // // - // for (let mnCode in groupeObj){ - // // 鑾峰緱璁惧缂栧彿瀵瑰簲鐨勬暟鎹� - // let dayData = groupeObj[mnCode] - // // 淇濆瓨鏌愯澶囩紪鍙疯娈垫椂闂寸殑鏃ラ闄╁�� - // let dailyRiskValues = [] - // // 璁$畻鏃ラ闄╁�� - // for(let item in dayData){ - // let dailyRiskValue = this.calDailyRisk(item) - // dailyRiskValues.push(dailyRiskValue) - // } - // } - - // } - - // 璁$畻鏈堝害椋庨櫓鍊� + /** + * 璁$畻鏈堝害椋庨櫓鍊� + * @param锛� + * @returns锛� + */ calMonthlyRiskValue(exceptionRiskValue){ // 淇濆瓨鏈堝害椋庨櫓鍊� let monthlyRiskValue = [] // 璁$畻姣忎釜绔欑偣鐨勬湀搴﹂闄╁�� for(let item in exceptionRiskValue){ - let value = item.onlineRisk*0.1 + item.validRisk*0.2 + item.exceedingRisk*0.2 + item.exceptionTypeAggregation*0.2 + item.typicalExceptionRepetitionRate*0.3 - monthlyRiskValue.push(value) + let risk = this.calRiskValue(item) + monthlyRiskValue.push(risk) } + + // 闄嶅簭鎺掑垪 + monthlyRiskValue.sort((a, b) => b - a) + return monthlyRiskValue - } + }, + + /** + * 缁勮鎴愯〃鏍肩殑琛� + * @param锛� 绔欑偣鐨勬湀搴﹀垎闄╂暟鎹紝璇ョ珯鐐圭殑鏈堝害椋庨櫓鍊� + * @returns锛� + */ + organizeTableRow(monthlyRiskData,riskValue) { + let obj = {} + obj.siteName = monthlyRiskData.name + obj.region = '閲戝北鍖�' + obj.mnCode = monthlyRiskData.mnCode + obj.monitorType = '鎵皹' + obj.riskValue = riskValue + obj.beginTime = monthlyRiskData.lst + obj.endTime = monthlyRiskData.lst + + // 鏍规嵁鏈堝害椋庨櫓鍊硷紝杩斿洖瀵瑰簲鐨勯闄╃瓑绾у拰椋庨櫓寤鸿 + let riskGradeAndAdvice = this.judgeRiskGradeAndAdvice(riskValue) + obj.riskGrade = riskGradeAndAdvice[0] + obj.riskAdvice = riskGradeAndAdvice[1] + + return obj + }, + + /** + * 鏍规嵁鏈堝害椋庨櫓鍊硷紝杩斿洖瀵瑰簲鐨勯闄╃瓑绾у拰椋庨櫓寤鸿 + * @param锛� 鏈堝害椋庨櫓鍊� + */ + judgeRiskGradeAndAdvice(monthlyRiskValue){ + let temp = [] + // 浣庨闄� + if(monthlyRiskValue < 0.2) { + temp.push('浣庨闄�') + let advice = '1.寤鸿鍙婃椂鎻愰啋璇ョ珯鐐规墍灞炲崟浣嶈繘琛屽簲鎬ョ淮鎶わ紱\n2.鑻ュ悓鏃跺瓨鍦ㄨ秴鏍囥�佷复鐣岃秴鏍囥�侀噺绾х獊鍙樼瓑寮傚父鏃讹紝寤鸿灏嗚绔欑偣绉讳氦鐜鎵ф硶澶ч槦寮�灞曠幇鍦烘墽娉曟鏌ワ紱\n3.鑻ユ寔缁袱鏈堝強浠ヤ笂涓洪珮椋庨櫓锛屽缓璁皢璇ョ珯鐐圭撼鍏ュ勾搴︽娊娴嬫瘮瀵规竻鍗曪紱' + temp.push(advice) + } + // 涓闄� + if (monthlyRiskValue < 0.6 && monthlyRiskValue >= 0.2) { + temp.push('涓闄�') + let advice = '1.寤鸿閫氳繃瀹堟硶鏈嶅姟灏忕▼搴忋�佺洃娴嬬洃绠″井淇$兢绛夌嚎涓婃柟寮忔彁绀虹珯鐐规墍灞炲崟浣嶏紝鑱氱劍褰撳墠瀛樺湪鐨勯棶棰樻垨闅愭偅锛屽強鏃跺紑灞曡嚜鏌ヨ嚜绾狅紱\n2.鑻ュ悓鏃跺瓨鍦ㄥ湪绾跨巼鎴栨湁鏁堢巼鏈堝害涓嶈揪鏍囷紝寤鸿鐢佃瘽閫氱煡璇ョ珯鐐规墍灞炲崟浣嶈繘琛屽簲鎬ョ淮鎶わ紝骞惰繘琛屼笓椤瑰鏍革紱' + temp.push(advice) + } + // 楂橀闄� + if (monthlyRiskValue >= 0.6) { + temp.push('楂橀闄�') + let advice = '1.鑻ヤ笉娑夊強瓒呮爣鎴栧湪绾跨巼銆佹湁鏁堢巼寮傚父锛屽父鎬佹暟鎹鏍稿嵆鍙紱\n2.鑻ユ秹鍙婅秴鏍囨垨鍦ㄧ嚎鐜囥�佹湁鏁堢巼绛夊紓甯革紝寤鸿閫氳繃瀹堟硶鏈嶅姟灏忕▼搴忋�佺洃娴嬬洃绠″井淇$兢绛夌嚎涓婃柟寮忔彁绀虹珯鐐规墍灞炲崟浣嶏紝鍙婃椂寮�灞曡嚜鏌ヨ嚜绾狅紱' + temp.push(advice) + } + return temp + }, + + + // 閬嶅巻瀵规瘡鏉℃湀搴﹀紓甯搁闄╁�� + // 璁$畻缁煎悎椋庨櫓鍊� + // 鎷兼帴鏂扮殑瀵硅薄 + // 杩斿洖琛ㄦ牸瀵硅薄 + + /** + * 杩斿洖缁煎悎椋庨櫓鎺掑悕鐨勮〃鏍兼暟鎹� + * @param锛� 鍚勭珯鐐规湀搴﹀垎闄╂暟鎹� + * @returns锛氳〃鏍兼暟鎹� + */ + backComprehensiveRiskTableData(allExceptionData){ + let tableData = [] + // 閬嶅巻瀵规瘡鏉℃湀搴﹀紓甯搁闄� + allExceptionData.forEach(element => { + + // 璁$畻寰楀埌鏈堝害椋庨櫓鍊� + let monthlyRiskValue = this.calRiskValue(element) + // 缁勬垚琛ㄦ牸琛岀殑瀛楁 + let tableRow = this.organizeTableRow(element,monthlyRiskValue.toFixed(2)) + + tableData.push(tableRow) + }); + + return tableData + } + + + + + } \ No newline at end of file diff --git a/src/utils/time.js b/src/utils/time.js new file mode 100644 index 0000000..ec7eeb8 --- /dev/null +++ b/src/utils/time.js @@ -0,0 +1,19 @@ + +import dayjs from 'dayjs' +export default { + + + // 鍒ゆ柇宸查�夌殑鏈堜唤鏄惁澶т簬褰撳墠鏈堜唤 + judgeDateValid(date){ + // 鑾峰緱褰撴湀鏈堜唤 + let currentMonth = dayjs() + let selectMonth = date.getTime() + // 閫夋嫨澶т簬鐜板湪鏈堜唤 + if(selectMonth > currentMonth){ + return true + } + + return false + } + +} \ No newline at end of file diff --git a/src/views/data_management/HistoryData.vue b/src/views/data_management/HistoryData.vue index 86454df..f6fcc1a 100644 --- a/src/views/data_management/HistoryData.vue +++ b/src/views/data_management/HistoryData.vue @@ -32,6 +32,8 @@ // 缁撴潫鏃堕棿 endTime: '' }, + // 鎼滅储妗嗕紶閫掍笂鏉ョ殑璁惧缂栧彿 + tempMnCode :'', // 杩斿洖鐨勬暟鎹� tableData: [], // 琛ㄦ牸鏁版嵁 @@ -141,10 +143,7 @@ // 鏌ヨ鏁版嵁 handleSubmit() { - // if (this.isExceedOneMonth(this.form.beginTime, this.form.endTime)) { - // alert('鏃堕棿璺ㄥ害涓嶈兘瓒呰繃涓�涓湀'); - // return; - // } + this.loading = true; this.queryButton = true let params = {}; @@ -161,7 +160,6 @@ if (this.scenarioType.length != 0) { params['scenarioType'] = this.scenarioType.join(); } - this.$http.get('/dust/history1', { params: params }).then((response) => { // 淇濆瓨杩斿洖鐨� this.tableData = response.data.data.rows; @@ -220,8 +218,9 @@ <el-form-item> <AreaAndmonitorType></AreaAndmonitorType> </el-form-item> + <el-form-item> - <InputSearch isNeedDefaultSite="1" @submit-value="(n) => (form.name = n)"> + <InputSearch isNeedDefaultSite="1" @submit-value="(n) => (form.name = n) "> </InputSearch> </el-form-item> <el-form-item> @@ -249,13 +248,6 @@ </div> <div class="button-and-export"> <el-form-item> - <!-- <el-button - type="primary" - @click="handleSubmit" - style="margin-left: 10px" - ><el-icon style="margin-right: 6px;font-size: 1.2em;"><i-ep-Search/></el-icon>鏌ヨ</el-button - > - <el-button type="success" @click="exportDom" round><el-icon style="margin-right: 6px;margin-bottom:2px;font-size: 1.2em;"><i-ep-Download ></i-ep-Download></el-icon>瀵煎嚭鏁版嵁</el-button> --> <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> diff --git a/src/views/exception/FlightInspection.vue b/src/views/exception/FlightInspection.vue index 8ea6552..786f0ca 100644 --- a/src/views/exception/FlightInspection.vue +++ b/src/views/exception/FlightInspection.vue @@ -145,27 +145,6 @@ watch: { selectedRowIndex(newVaue) { // 澶勪簬琛ㄦ牸鐨勬渶鍚庝竴鏉℃暟鎹� 璁剧疆鈥樹笂涓�鏉♀�欐寜閽笉鍙偣 - // if (newVaue === this.displayData.length - 1) { - // this.dialog.isPreCantouch = true - // //鐢ㄦ埛鍏堢偣浜嗙涓�鏉★紝pre涓簍rue,鐒跺悗鐐瑰嚮鏈�鍚庝竴鏉�,next涓簍rue銆傛鏃朵袱涓寜閽兘琚皝閿� - // if (this.dialog.isNextCantouch == true) { - // this.dialog.isNextCantouch = false - // } - // } - // // 澶勪簬琛ㄦ牸绗竴鏉℃暟鎹� 璁剧疆鈥樹笅涓�鏉♀�欐寜閽笉鍙偣 - // else if (newVaue === 0) { - // 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 - // } - // 澶勪簬琛ㄦ牸鐨勬渶鍚庝竴鏉℃暟鎹� 璁剧疆鈥樹笂涓�鏉♀�欐寜閽笉鍙偣 if (newVaue === 0) { this.dialog.isPreCantouch = true //鐢ㄦ埛鍏堢偣浜嗙涓�鏉★紝pre涓簍rue,鐒跺悗鐐瑰嚮鏈�鍚庝竴鏉�,next涓簍rue銆傛鏃朵袱涓寜閽兘琚皝閿� diff --git a/src/views/exception/SiteAuditAssistance.vue b/src/views/exception/SiteAuditAssistance.vue index 310bb40..e575a35 100644 --- a/src/views/exception/SiteAuditAssistance.vue +++ b/src/views/exception/SiteAuditAssistance.vue @@ -121,28 +121,6 @@ // 鐩戝惉 鍒ゆ柇鎸夐挳鏄惁鍙偣鍑� watch: { selectedRowIndex(newVaue) { - // // 澶勪簬琛ㄦ牸鐨勬渶鍚庝竴鏉℃暟鎹� 璁剧疆鈥樹笂涓�鏉♀�欐寜閽笉鍙偣 - // if (newVaue === this.displayData.length - 1) { - // this.dialog.isPreCantouch = true - // //鐢ㄦ埛鍏堢偣浜嗙涓�鏉★紝pre涓簍rue,鐒跺悗鐐瑰嚮鏈�鍚庝竴鏉�,next涓簍rue銆傛鏃朵袱涓寜閽兘琚皝閿� - // if (this.dialog.isNextCantouch == true) { - // this.dialog.isNextCantouch = false - // } - // } - // // 澶勪簬琛ㄦ牸绗竴鏉℃暟鎹� 璁剧疆鈥樹笅涓�鏉♀�欐寜閽笉鍙偣 - // else if (newVaue === 0) { - // 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 - // } - // 澶勪簬琛ㄦ牸鐨勬渶鍚庝竴鏉℃暟鎹� 璁剧疆鈥樹笂涓�鏉♀�欐寜閽笉鍙偣 if (newVaue === 0) { this.dialog.isPreCantouch = true @@ -296,25 +274,7 @@ }) }, close() { - // if (this.auditDialog.checkerNotes || this.auditDialog.enterpriseNotes) { - // ElMessageBox.confirm('杩欏皢浼氾紝纭畾瑕佸叧闂悧', '鎻愮ず', - // { - // confirmButtonText: '纭畾', - // cancelButtonText: '鍙栨秷', - // type: 'warning', - // center :'true', - // icon: markRaw(Delete), - // draggable: true, - // }).then(() => { - // ElMessage({ - // type: 'success', - // message: '宸插叧闂�', - // }) - // this.auditDialog.visible = false - // }) - // }else{ - // this.auditDialog.visible = false - // } + this.auditDialog.visible = false }, // 琛ㄦ牸琛岀殑棰滆壊 @@ -1368,7 +1328,7 @@ <el-col> <div class="checknum"> <div class="checknum-text"> - <el-tag>搴斿鏍告暟</el-tag><span>{{ total }} ({{ checkedRate }}%)</span> + <el-tag>搴斿鏍告暟</el-tag><span >{{ total }} ({{ checkedRate }}%)</span> </div> <div class="checknum-text"> @@ -1554,17 +1514,7 @@ <div><span class="diag-head-text1">绔欑偣鍚嶇О锛�</span>{{ tableCurrentRowData.name }}</div> <div><span class="diag-head-text1">璁惧缂栧彿锛�</span>{{ tableCurrentRowData.mnCode }}</div> <div><span class="diag-head-text1">杩愮淮鍟嗭細</span>{{ tableCurrentRowData.dutyCompany }}</div> - <!-- <div> - <span class="diag-head-text1">寮傚父绫诲瀷锛�</span> - <span v-if="tableCurrentRowData.exceptionType == '0'">鏁版嵁缂哄け寮傚父</span> - <span v-else-if="tableCurrentRowData.exceptionType == '1'">鏁版嵁瓒呬綆</span> - <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 }} ~ @@ -1572,22 +1522,6 @@ </div> </div> - <!-- <div class="chart-jump-button"> - <el-button - type="danger" - :loading="loading.preButton" - :disabled="dialog.isPreCantouch || flag.banTouch" - @click="getPreviousRowData" - >涓婃潯寮傚父</el-button - > - <el-button - type="danger" - :loading="loading.afterButton" - :disabled="dialog.isNextCantouch || flag.banTouch" - @click="getNextRowData" - >涓嬫潯寮傚父</el-button - > - </div> --> <div class="chart-jump-button"> <el-button type="danger" @@ -1626,9 +1560,7 @@ 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" diff --git a/src/views/line_graph/RiskTest.vue b/src/views/line_graph/RiskTest.vue deleted file mode 100644 index cf8d53e..0000000 --- a/src/views/line_graph/RiskTest.vue +++ /dev/null @@ -1,633 +0,0 @@ -<!-- 鏃ュ潎鍊� --> - -<script> - import InputSearch from '@/sfc/InputSearch.vue' - import AreaAndmonitorType from '@/sfc/AreaAndmonitorType.vue' - import DustRadarChart from './components/DustRadarChart.vue' - import exceptionApi from '@/api/exceptionApi.js' - import LineChart from './components/LineChart.vue' - import index from '@/utils/risk_estimate_common_function/index.js' - import ButtonClick from '@/sfc/ButtonClick.vue' - import dayjs from 'dayjs' - import MonthSelect from '@/sfc/MonthSelect.vue' - export default { - components: { - LineChart, - InputSearch, - AreaAndmonitorType, - DustRadarChart, - ButtonClick, - MonthSelect - }, - data() { - return { - isNoData: false, - loading: false, - screenLoading: false, - parentDataFlag:false, - chartData: [], - chartData1: {}, //淇濆瓨鏌ヨ鐨勭粨鏋� - chartData2: {}, - chartData3: {}, - chartData4: {}, - begin: '', //寮�濮嬫椂闂� - end: '', //缁撴潫鏃堕棿 - - form: { - // 绔欑偣鍚嶇О - name: '', - // 璁惧缂栧彿 - number: '', - // 寮�濮嬫椂闂� - beginTime: '', - // 缁撴潫鏃堕棿 - endTime: '' - }, - month: '', - // 浼犻�掔粰鏈堜唤缁勪欢鐨勫�� - sfc_month: '', - // 鎶樼嚎鍥鹃厤缃」 - option: {}, - // 鏁版嵁娓呭崟 - bill: { - min: '', - max: '', - avg: '', - online: 100, - valid: 100, - exceeding: 0, - - // 鍏稿瀷寮傚父澶嶇幇鐜� - exceptionRecurrence: 0, - // 寮傚父绫诲瀷鎹仛闆嗗害 - exceptionTypeAggregation: 0 - }, - status: { - isHasData: false - }, - // 鏌ヨ鎸夐挳鍔犺浇鏁堟灉 - queryButton: false, - - // 椋庨櫓鍊兼帓鍚嶅墠鍗佺殑绔欑偣 - top_10_sites_with_risk_values: [{ name: '', riskValue: 0.2 }], - // 椋庨櫓鍊� - weight: '' - } - }, - - watch: { - sName() { - // 褰撳埆鐨勯〉闈㈣皟鐢ㄦ椂 - if (this.sName != ''|| this.month_1 != '') { - // 鏇存柊绔欑偣鍚嶅瓧鍜屾椂闂� - this.form.name = this.sName - this.month = this.month_1 - this.parentDataFlag = true - // 鏇存柊鎺掓竻鍗� - this.getRiskRank() - // 鏇存柊缁熻鏁版嵁 - this.getAnalysisData() - // 璁$畻椋庨櫓鍊� - this.calRiskValue() - } - } - }, - - mounted() { - // // 鍔犺浇椋庨櫓鍊兼渶楂樼殑绔欑偣鏁版嵁 - this.ShowDefaultData() - }, - - methods: { - // 鏌ヨ绔欑偣缁熻淇℃伅 - querySiteStaticsInfo(row) { - this.form.name = row.siteName - // 鏇存柊缁熻鏁版嵁 - this.getAnalysisData() - // 璁$畻椋庨櫓鍊� - this.calRiskValue() - }, - - // 鏍煎紡鍖栨湀浠� - giveMonth(val) { - //灏嗕腑鍥芥爣鍑嗘椂闂磋浆涓烘寚瀹氭牸寮�(璇ョ粍浠惰繑鍥炵殑鏍囧噯鏃堕棿鐨勬牸寮忥紝鎵�浠ュ繀椤荤殑鍔犺繖涓嚱鏁�) - this.month = dayjs(val).format('YYYY-MM-DD') - // 鍚屾椂鏇存柊寮�濮嬪拰缁撴潫鏃堕棿 - this.form.beginTime = dayjs(this.month).startOf().format('YYYY-MM-DD HH:mm:ss') - this.form.endTime = dayjs(this.month).endOf('month').format('YYYY-MM-DD HH:mm:ss') - }, - - /** - * 椋庨櫓璇勪及鎸夐挳 - * @param锛� - * @returns锛� - */ - riskAssessment() { - // 鏇存柊鎺掑悕娓呭崟 - this.getRiskRank() - // 鏇存柊鍒嗘瀽鏁版嵁 - this.getAnalysisData() - // 璁$畻椋庨櫓鍊� - this.calRiskValue() - }, - - // 鏇存柊鍒嗘瀽鏁版嵁 - getAnalysisData() { - // 鏃ョ粺璁℃暟鎹� - this.fetchDayAnalysisData() - // 寮傚父鏁版嵁 - this.fetchExceptionAnalysisData() - }, - - findObjectByPropertyValue(array, property, value) { - return array.find((obj) => obj[property] === value) - }, - - // 姝ら〉闈㈡墦寮�鏃� - ShowDefaultData() { - // 榛樿鍔犺浇灞曠ず鐨勫唴瀹� - this.updateOriginPage() - }, - - // 鍔犺浇榛樿灞曠ず鐨勫唴瀹� - async updateOriginPage() { - this.screenLoading = true - // 鏇存柊鎺掑悕娓呭崟锛屽苟寰楀埌椋庨櫓鍊兼渶楂樼珯鐐� - this.form.name = await this.getRiskRank() - this.screenLoading = false - // 鏇存柊鏃ョ粺璁℃暟鎹� - this.getAnalysisData() - // 璁$畻椋庨櫓鍊� - this.calRiskValue() - }, - - // 璁$畻椋庨櫓鍊� - calRiskValue() { - exceptionApi.analysisdataByType(this.month, 'month').then((response) => { - const chartData = response.data.data - - if (response.data.data.length == 0) { - return - } - // 浠庡璞℃暟缁勬壘鍒拌绔欑偣鎵�鍦ㄧ殑鍏冪礌 - let siteItem = this.findObjectByPropertyValue(chartData, 'name', this.form.name) - if (Object.keys(siteItem).length === 0) { - return - } - let arr = [] - arr.push(siteItem) - exceptionApi - .exceptiondata1({ - siteName: this.form.name, - beginTime: this.form.beginTime, - endTime: this.form.endTime - }) - .then((res) => { - let table = index.merge(arr, res.data.data, this.form.beginTime, this.form.endTime) - this.weight = table[0].riskValue - }) - }) - }, - - // 鏍规嵁鐩墠绔欑偣锛屾湀浠斤紝鏌ユ姌绾垮浘鏃ョ粺璁℃暟鎹� - fetchDayAnalysisData() { - let params = {} - if (this.form.name) { - params['siteName'] = this.form.name - } - if (this.form.beginTime) { - params['beginTime'] = this.form.beginTime - } - if (this.form.endTime) { - params['endTime'] = this.form.endTime - } - this.loading = true - this.queryButton = true - exceptionApi - .analysisdata(this.form.name, this.form.beginTime, this.form.endTime, 'day') - .then((response) => { - this.chartData = response.data.data - this.loading = false - this.queryButton = false - if (response.data.data.length == 0) { - this.isNoData = true - return - } - this.begin = this.chartData[0].lst - this.end = this.chartData[this.chartData.length - 1].lst - - // 绉婚櫎绌烘暟鎹姸鎬� - this.isNoData = false - this.setChart() - // 鎶樼嚎鍥炬暟鎹� - let temp = index.calBillData(this.chartData, this.begin, this.end) - this.bill.min = temp['min'] - this.bill.max = temp['max'] - - this.bill.avg = temp['avg'] - this.bill.online = temp['online'] - this.bill.valid = temp['valid'] - this.bill.exceeding = temp['exceeding'] - }) - }, - // 浼佷笟寮傚父缁熻鏁版嵁 - fetchExceptionAnalysisData() { - exceptionApi - .exceptiondata1({ - siteName: this.form.name, - beginTime: this.form.beginTime, - endTime: this.form.endTime - }) - .then((res) => { - let obj = index.calRecur(res.data.data) - this.bill.exceptionRecurrence = obj['exceptionRecurrence'] - this.bill.exceptionTypeAggregation = obj['exceptionTypeAggregation'] - }) - }, - - - // 閫夋嫨鍏朵粬鍊肩被鍨嬫椂 - setChart() { - if (this.chartData.length) { - // x杞存棩鏈熸椂闂� - let dateList = [] - //棰楃矑鐗╁钩鍧囨祿搴� - let dayAvg = [] - let dataOnline = [] - let dataValid = [] - let dataExceed = [] - this.chartData.forEach((item) => { - //x杞存棩鏈� - dateList.push(item.lst) - // 鍘嗗彶娌圭儫娴撳害 - dayAvg.push(item.dayAvg) - dataOnline.push(item.dayOnline.slice(0, -1)) - dataValid.push(item.dayValid.slice(0, -1)) - dataExceed.push(item.dayExceeding.slice(0, -1)) - }) - - this.chartData1 = { - x: dateList, - y: dayAvg - } - this.chartData2 = { - x: dateList, - y: dataOnline - } - this.chartData3 = { - x: dateList, - y: dataValid - } - this.chartData4 = { - x: dateList, - y: dataExceed - } - } - }, - - // 寰楀埌鍓�10椋庨櫓鎺掑悕娓呭崟 - async getRiskRank() { - let staticsData = await exceptionApi.analysisdataByType(this.month, 'month') - - let exceptionData = await exceptionApi.exceptiondata1({ - siteName: '', - beginTime: this.form.beginTime, - endTime: this.form.endTime - }) - - const riskValueSites = index.merge( - staticsData.data.data, - exceptionData.data.data, - this.form.beginTime, - this.form.endTime - ) - this.top_10_sites_with_risk_values = this.getTopRiskData(riskValueSites, 10) - if (this.top_10_sites_with_risk_values.length != 0) { - // 琛ㄦ牸鎸夐闄╁�煎�掑彊鎺掑垪 - this.$nextTick(() => { - this.$refs.table.sort('riskValue', 'descending') - }) - // Promise - return this.top_10_sites_with_risk_values[0].siteName - } - }, - - /** - * 闄嶅簭鎺掑垪锛岃繑鍥為檷搴忓墠num鐨勫厓绱� - * @param锛� 瀵硅薄鏁扮粍锛岃繑鍥炵殑鏁伴噺 - */ - getTopRiskData(arr, num) { - // 鎸夌収riskValue闄嶅簭鎺掑垪 - arr.sort((a, b) => b.riskValue - a.riskValue) - // 鑾峰彇鍓峮um涓厓绱� - return arr.slice(0, num) - } - } - } - </script> - - <template> - <el-form :inline="true" :model="form"> - <el-form-item class="form-item"> - <AreaAndmonitorType></AreaAndmonitorType> - </el-form-item> - <el-form-item class="form-item"> - <InputSearch - :site-name="form.name" - isNeedDefaultSite="0" - @submit-value="(n) => (form.name = n)" - ></InputSearch> - </el-form-item> - - - - <el-form-item> - <MonthSelect :month="this.month_1" @submit-value="giveMonth"></MonthSelect> - </el-form-item> - - <el-form-item> - <ButtonClick - content="椋庨櫓璇勪及" - type="primary" - :loading="queryButton" - @do-search="riskAssessment" - ></ButtonClick> - </el-form-item> - </el-form> - - <div v-loading="screenLoading" class="wait-name"> - <div class="chart-container" v-show="!isNoData && !screenLoading"> - <div class="time-text"> - <span>鏁版嵁缁熻鏃舵锛歿{ begin }} ~ {{ end }}</span> - <span class="site-name">{{ form.name }}</span> - </div> - - <el-row :gutter="10"> - <el-col :span="5"> - <el-card shadow="never" class="table-class"> - <el-table - ref="table" - highlight-current-row="true" - :data="top_10_sites_with_risk_values" - :default-sort="{ prop: 'riskValue', order: 'descending' }" - height="540" - > - <el-table-column - type="index" - label="搴忓彿" - :index="indexMethod" - fixed - width="25" - show-overflow-tooltip - /> - <el-table-column prop="siteName" label="绔欑偣鍚嶇О" show-overflow-tooltip /> - <el-table-column - prop="riskValue" - label="椋庨櫓鍊�" - sortable - width="67" - show-overflow-tooltip - /> - <el-table-column label="鎿嶄綔" align="center"> - <template #default="{ row }"> - <el-button - type="primary" - text - class="table-button" - @click="querySiteStaticsInfo(row)" - >椋庨櫓璇︽儏</el-button - > - </template> - </el-table-column> - </el-table> - </el-card> - </el-col> - - <el-col :span="12"> - <el-card shadow="never"> - <DustRadarChart - :name="[ - '鏁版嵁鏈夋晥椋庨櫓', - '鍏稿瀷寮傚父澶嶇幇椋庨櫓', - '寮傚父绫诲瀷鑱氶泦椋庨櫓', - '鏁版嵁瓒呮爣椋庨櫓', - '鏁版嵁鍦ㄧ嚎椋庨櫓' - ]" - :yData="[ - bill.valid, - bill.exceptionRecurrence, - bill.exceptionTypeAggregation, - bill.exceeding, - bill.online - ]" - ></DustRadarChart> - </el-card> - </el-col> - - <el-col :span="3"> - <el-card shadow="never" class="card-height"> - <template #header> - <h1 - :class="{ - 'weightColor-low': weight < 0.2, - 'weightColor-medium': weight >= 0.2 && weight < 0.6, - 'weightColor-heigh': weight >= 0.6 - }" - > - 椋庨櫓鍊�(0~1)锛歿{ weight }} - </h1> - </template> - <div class="risk-grade"> - <strong>椋庨櫓绛夌骇锛�</strong> - <span v-if="weight >= 0.6"> 楂橀闄�</span> - <span v-else-if="weight >= 0.2 && weight < 0.6"> 涓闄�</span> - <span v-else> 浣庨闄�</span> - </div> - - <div class="risk-advice"> - <strong>绠℃帶寤鸿锛�</strong> - <span v-if="weight >= 0.6"> 寤鸿瀵硅绔欑偣杩涜绾夸笅鎵ф硶妫�鏌ワ紝涓撻」鏁版嵁瀵规瘮</span> - <span v-else-if="weight >= 0.2 && weight < 0.6"> 寤鸿寮�灞曞父鎬佽拷韪垎鏋�</span> - <span v-else> 寤鸿寮曞浼佷笟闀挎�佷繚鎸�</span> - </div> - <div class="grade-instance"> - <div class="container"> - <div class="block-color heigh"></div> - <div>楂橀闄�(鈮�0.6)</div> - </div> - <div class="container"> - <div class="block-color medium"></div> - <div>涓闄�(0.2~0.6)</div> - </div> - <div class="container"> - <div class="block-color low"></div> - <div>浣庨闄�(锛�0.2)</div> - </div> - </div> - </el-card> - </el-col> - - <el-col :span="4"> - <el-card shadow="never" class="card-height"> - <template #header><span class="title-16">椋庨櫓璇︽儏</span></template> - - <el-form> - <el-form-item label="鏈�澶у�硷細"> {{ bill.max }} mg/m鲁 </el-form-item> - <el-form-item label="鏈�灏忓�硷細"> {{ bill.min }} mg/m鲁 </el-form-item> - <el-form-item label="鏁版嵁鏈夋晥鐜囷細"> {{ bill.online }}% </el-form-item> - <el-form-item label="鏁版嵁鍦ㄧ嚎鐜囷細"> {{ bill.valid }}% </el-form-item> - <el-form-item label="鏁版嵁瓒呮爣鐜囷細"> {{ bill.exceeding }}% </el-form-item> - <el-form-item label="寮傚父绫诲瀷鑱氶泦搴︼細"> - {{ bill.exceptionTypeAggregation * 100 }}% - </el-form-item> - <el-form-item label="鍏稿瀷寮傚父澶嶇幇鐜囷細"> - {{ bill.exceptionRecurrence * 100 }}% - </el-form-item> - </el-form> - </el-card> - </el-col> - </el-row> - - <el-row :gutter="20"> - <el-col :span="12"> - <el-card shadow="never" class="card-value"> - <LineChart title="鏃ュ潎鍊�" :chartData="chartData1" yName="mg/m鲁" seriesName="鏃ュ潎鍊�"> - </LineChart> - </el-card> - </el-col> - - <el-col :span="12"> - <el-card shadow="never" class="card-value"> - <LineChart title="鏃ュ湪绾跨巼" :chartData="chartData2" yName="%" seriesName="鏃ュ湪绾跨巼"> - </LineChart> - </el-card> - </el-col> - </el-row> - <el-row :gutter="20"> - <el-col :span="12"> - <el-card shadow="never" class="card-value"> - <LineChart title="鏃ユ湁鏁堢巼" :chartData="chartData3" yName="%" seriesName="鏃ユ湁鏁堢巼"> - </LineChart> - </el-card> - </el-col> - - <el-col :span="12"> - <el-card shadow="never" class="card-value"> - <LineChart title="鏃ヨ秴鏍囩巼" :chartData="chartData4" yName="%" seriesName="鏃ヨ秴鏍囩巼"> - </LineChart> - </el-card> - </el-col> - </el-row> - </div> - </div> - <el-empty description="鏆傛棤鏁版嵁" v-show="isNoData" :image-size="200" /> - </template> - - <style scoped> - .el-form { - margin: 10px; - } - .form-item { - margin-top: 10px; - } - .chart-container { - margin-left: 10px; - } - .time-text { - letter-spacing: 2px; - } - .el-card { - margin-top: 15px; - border-radius: 9px; - } - .chart-container { - width: 98%; - /* height: 600px; */ - } - .card-value { - /* min-width:900px; */ - /* padding:0px */ - } - .card-height { - height: 540px; - } - .el-header { - background-color: #010408; - color: #333; - line-height: 60px; - } - .risk-advice { - margin: 40px 0px; - } - .container { - display: flex; - margin-bottom: 10px; - } - .grade-instance { - margin-top: 80px; - } - .block-color { - width: 1em; - height: 1em; - margin-right: 10px; - margin-top: 3px; - } - .heigh { - background-color: red; - } - .medium { - background-color: #fadc19; - } - .low { - background-color: #9fdb1d; - } - - .el-text { - align-self: left; - } - .el-form-item { - margin-bottom: 20px; - } - :deep().el-form-item__content { - justify-content: flex-end; - } - .title-16 { - font-size: 16px; - font-weight: bold; - } - .weightColor-low { - color: #9fdb1d; - } - .weightColor-medium { - color: #dabe09; - } - .weightColor-heigh { - color: red; - } - .risk-grade { - display: flex; - margin-top: 10px; - } - :deep().el-table__header-wrapper { - color: red; - } - /* .wait-name { - width: 500px; - height: 600px; - } */ - .table-class { - /* border: 1px solid blue; */ - /* margin: 20px 0px 20px 0px; */ - height: 540px; - } - - .table-button { - letter-spacing: 1px; - text-decoration: underline; - border-radius: 0px; - } - .site-name { - margin-left: 120px; - } - </style> - \ No newline at end of file diff --git a/src/views/line_graph/components/subRiskModel.vue b/src/views/line_graph/components/subRiskModel.vue deleted file mode 100644 index 65cdc96..0000000 --- a/src/views/line_graph/components/subRiskModel.vue +++ /dev/null @@ -1,583 +0,0 @@ -<!-- 椋庨櫓妯″瀷鐨勯〉闈� -鍖哄埆锛� -1.鎺ュ彈鐖剁粍浠朵紶鍙� -2.鏃犲垵濮嬪姞杞芥暟鎹紙鏃爉ounted锛� ---> - -<script> - // import InputSearch from '@/sfc/InputSearch.vue' - import AreaAndmonitorType from '@/sfc/AreaAndmonitorType.vue' - import DustRadarChart from '@/views/line_graph/components/DustRadarChart.vue' - import exceptionApi from '@/api/exceptionApi.js' - import LineChart from '@/views/line_graph/components/LineChart.vue' - import index from '@/utils/risk_estimate_common_function/index.js' - import ButtonClick from '@/sfc/ButtonClick.vue' - import dayjs from 'dayjs' - import MonthSelect from '@/sfc/MonthSelect.vue' - export default { - props: { - sName: { - type: String, - default: '' - }, - month_1: { - type: String, - default: '' - } - }, - components: { - LineChart, - // DateSelectWithShortCuts, - // InputSearch, - AreaAndmonitorType, - DustRadarChart, - ButtonClick, - MonthSelect - }, - data() { - return { - isNoData: false, - loading: false, - screenLoading: false, - parentDataFlag:false, - chartData: [], - chartData1: {}, //淇濆瓨鏌ヨ鐨勭粨鏋� - chartData2: {}, - chartData3: {}, - chartData4: {}, - //devId:'', //璁惧缂栧彿 - begin: '', //寮�濮嬫椂闂� - end: '', //缁撴潫鏃堕棿 - - form: { - // 绔欑偣鍚嶇О - name: '', - // 璁惧缂栧彿 - number: '', - - // month:'', - // 寮�濮嬫椂闂� - beginTime: '', - // 缁撴潫鏃堕棿 - endTime: '' - }, - month: '', - // 浼犻�掔粰鏈堜唤缁勪欢鐨勫�� - sfc_month: '', - // 鎶樼嚎鍥鹃厤缃」 - option: {}, - // 鏁版嵁娓呭崟 - bill: { - min: '', - max: '', - avg: '', - online: 100, - valid: 100, - exceeding: 0, - - // 鍏稿瀷寮傚父澶嶇幇鐜� - exceptionRecurrence: 0, - // 寮傚父绫诲瀷鎹仛闆嗗害 - exceptionTypeAggregation: 0 - }, - status: { - isHasData: false - }, - // 鏌ヨ鎸夐挳鍔犺浇鏁堟灉 - queryButton: false, - - // 椋庨櫓鍊兼帓鍚嶅墠鍗佺殑绔欑偣 - top_10_sites_with_risk_values: [{ name: '', riskValue: 0.2 }], - // 椋庨櫓鍊� - weight: '' - } - }, - - watch: { - sName() { - // 褰撳埆鐨勯〉闈㈣皟鐢ㄦ椂 - if (this.sName != ''|| this.month_1 != '') { - // 鏇存柊绔欑偣鍚嶅瓧鍜屾椂闂� - this.form.name = this.sName - this.month = this.month_1 - // 鍚屾椂鏇存柊鏈堣捣濮嬫椂闂� - this.form.beginTime = dayjs(this.month).startOf().format('YYYY-MM-DD HH:mm:ss') - this.form.endTime = dayjs(this.month).endOf('month').format('YYYY-MM-DD HH:mm:ss') - - this.parentDataFlag = true - - // 鏇存柊缁熻鏁版嵁 - this.getAnalysisData() - // 璁$畻椋庨櫓鍊� - this.calRiskValue() - - - } - } - }, - - mounted() { - - }, - - methods: { - // 鏌ヨ绔欑偣缁熻淇℃伅 - querySiteStaticsInfo(row) { - this.form.name = row.siteName - // 鏇存柊缁熻鏁版嵁 - this.getAnalysisData() - // 璁$畻椋庨櫓鍊� - this.calRiskValue() - }, - - // 鏍煎紡鍖栨湀浠� - giveMonth(val) { - //灏嗕腑鍥芥爣鍑嗘椂闂磋浆涓烘寚瀹氭牸寮�(璇ョ粍浠惰繑鍥炵殑鏍囧噯鏃堕棿鐨勬牸寮忥紝鎵�浠ュ繀椤荤殑鍔犺繖涓嚱鏁�) - this.month = dayjs(val).format('YYYY-MM-DD') - // 鍚屾椂鏇存柊寮�濮嬪拰缁撴潫鏃堕棿 - this.form.beginTime = dayjs(this.month).startOf().format('YYYY-MM-DD HH:mm:ss') - this.form.endTime = dayjs(this.month).endOf('month').format('YYYY-MM-DD HH:mm:ss') - console.log(this.form.beginTime, this.form.endTime) - }, - - /** - * 椋庨櫓璇勪及鎸夐挳 - * @param锛� - * @returns锛� - */ - riskAssessment() { - // 鏇存柊鎺掑悕娓呭崟 - this.getRiskRank() - // 鏇存柊鍒嗘瀽鏁版嵁 - this.getAnalysisData() - // 璁$畻椋庨櫓鍊� - this.calRiskValue() - }, - - // 鏇存柊鍒嗘瀽鏁版嵁 - getAnalysisData() { - // 鏃ョ粺璁℃暟鎹� - this.fetchDayAnalysisData() - // 寮傚父鏁版嵁 - this.fetchExceptionAnalysisData() - }, - - findObjectByPropertyValue(array, property, value) { - return array.find((obj) => obj[property] === value) - }, - - // 姝ら〉闈㈡墦寮�鏃� - ShowDefaultData() { - // 榛樿鍔犺浇灞曠ず鐨勫唴瀹� - this.updateOriginPage() - }, - - // 鍔犺浇榛樿灞曠ず鐨勫唴瀹� - async updateOriginPage() { - - // 鏇存柊鎺掑悕娓呭崟锛屽苟寰楀埌椋庨櫓鍊兼渶楂樼珯鐐� - this.form.name = await this.getRiskRank() - - // 鏇存柊鏃ョ粺璁℃暟鎹� - this.getAnalysisData() - // 璁$畻椋庨櫓鍊� - this.calRiskValue() - }, - - // 璁$畻椋庨櫓鍊� - calRiskValue() { - exceptionApi.analysisdataByType(this.month, 'month').then((response) => { - const chartData = response.data.data - - if (response.data.data.length == 0) { - return - } - // 浠庡璞℃暟缁勬壘鍒拌绔欑偣鎵�鍦ㄧ殑鍏冪礌 - let siteItem = this.findObjectByPropertyValue(chartData, 'name', this.form.name) - if (Object.keys(siteItem).length === 0) { - return - } - let arr = [] - arr.push(siteItem) - exceptionApi - .exceptiondata1({ - siteName: this.form.name, - beginTime: this.form.beginTime, - endTime: this.form.endTime - }) - .then((res) => { - let table = index.merge(arr, res.data.data, this.form.beginTime, this.form.endTime) - this.weight = table[0].riskValue - }) - }) - }, - - // 鏍规嵁鐩墠绔欑偣锛屾湀浠斤紝鏌ユ姌绾垮浘鏃ョ粺璁℃暟鎹� - fetchDayAnalysisData() { - let params = {} - if (this.form.name) { - params['siteName'] = this.form.name - } - if (this.form.beginTime) { - params['beginTime'] = this.form.beginTime - } - if (this.form.endTime) { - params['endTime'] = this.form.endTime - } - this.screenLoading= true - this.loading = true - this.queryButton = true - exceptionApi - .analysisdata(this.form.name, this.form.beginTime, this.form.endTime, 'day') - .then((response) => { - this.chartData = response.data.data - this.loading = false - this.queryButton = false - if (response.data.data.length == 0) { - this.isNoData = true - return - } - this.begin = this.chartData[0].lst - this.end = this.chartData[this.chartData.length - 1].lst - - // 绉婚櫎绌烘暟鎹姸鎬� - this.isNoData = false - this.screenLoading= false - this.setChart() - // 鎶樼嚎鍥炬暟鎹� - let temp = index.calBillData(this.chartData, this.begin, this.end) - this.bill.min = temp['min'] - this.bill.max = temp['max'] - - this.bill.avg = temp['avg'] - this.bill.online = temp['online'] - this.bill.valid = temp['valid'] - this.bill.exceeding = temp['exceeding'] - }) - }, - // 浼佷笟寮傚父缁熻鏁版嵁 - fetchExceptionAnalysisData() { - exceptionApi - .exceptiondata1({ - siteName: this.form.name, - beginTime: this.form.beginTime, - endTime: this.form.endTime - }) - .then((res) => { - let obj = index.calRecur(res.data.data) - this.bill.exceptionRecurrence = obj['exceptionRecurrence'] - this.bill.exceptionTypeAggregation = obj['exceptionTypeAggregation'] - }) - }, - - // 閫夋嫨鍏朵粬鍊肩被鍨嬫椂 - setChart() { - if (this.chartData.length) { - // x杞存棩鏈熸椂闂� - let dateList = [] - //棰楃矑鐗╁钩鍧囨祿搴� - let dayAvg = [] - let dataOnline = [] - let dataValid = [] - let dataExceed = [] - this.chartData.forEach((item) => { - //x杞存棩鏈� - dateList.push(item.lst) - // 鍘嗗彶娌圭儫娴撳害 - dayAvg.push(item.dayAvg) - dataOnline.push(item.dayOnline.slice(0, -1)) - dataValid.push(item.dayValid.slice(0, -1)) - dataExceed.push(item.dayExceeding.slice(0, -1)) - }) - - this.chartData1 = { - x: dateList, - y: dayAvg - } - this.chartData2 = { - x: dateList, - y: dataOnline - } - this.chartData3 = { - x: dateList, - y: dataValid - } - this.chartData4 = { - x: dateList, - y: dataExceed - } - } - }, - - } - } - </script> - - <template> - <el-form :inline="true" :model="form"> - <el-form-item class="form-item"> - <AreaAndmonitorType></AreaAndmonitorType> - </el-form-item> - - <!-- <el-form-item class="form-item"> - <InputSearch - :site-name="form.name" - isNeedDefaultSite="0" - @submit-value="(n) => (form.name = n)" - ></InputSearch> - </el-form-item> --> - - <!-- <el-form-item> - <MonthSelect :month="this.month_1" @submit-value="giveMonth"></MonthSelect> - </el-form-item> --> - - <!-- <el-form-item> - <ButtonClick - content="椋庨櫓璇勪及" - type="primary" - :loading="queryButton" - @do-search="riskAssessment" - ></ButtonClick> - </el-form-item> --> - </el-form> - - <div v-loading="screenLoading" class="wait-name"> - <div class="chart-container" v-show="!isNoData && !screenLoading"> - <div class="time-text"> - <span>鏁版嵁缁熻鏃舵锛歿{ begin }} ~ {{ end }}</span> - <span class="site-name">{{ form.name }}</span> - </div> - - <el-row :gutter="10"> - - - <el-col :span="14"> - <el-card shadow="never"> - <DustRadarChart - :name="[ - '鏁版嵁鏈夋晥椋庨櫓', - '鍏稿瀷寮傚父澶嶇幇椋庨櫓', - '寮傚父绫诲瀷鑱氶泦椋庨櫓', - '鏁版嵁瓒呮爣椋庨櫓', - '鏁版嵁鍦ㄧ嚎椋庨櫓' - ]" - :yData="[ - bill.valid, - bill.exceptionRecurrence, - bill.exceptionTypeAggregation, - bill.exceeding, - bill.online - ]" - ></DustRadarChart> - </el-card> - </el-col> - - <el-col :span="5"> - <el-card shadow="never" class="card-height"> - <template #header> - <h1 - :class="{ - 'weightColor-low': weight < 0.2, - 'weightColor-medium': weight >= 0.2 && weight < 0.6, - 'weightColor-heigh': weight >= 0.6 - }" - > - 椋庨櫓鍊�(0~1)锛歿{ weight }} - </h1> - </template> - <div class="risk-grade"> - <strong>椋庨櫓绛夌骇锛�</strong> - <span v-if="weight >= 0.6"> 楂橀闄�</span> - <span v-else-if="weight >= 0.2 && weight < 0.6"> 涓闄�</span> - <span v-else> 浣庨闄�</span> - </div> - - <div class="risk-advice"> - <strong>绠℃帶寤鸿锛�</strong> - <span v-if="weight >= 0.6"> 寤鸿瀵硅绔欑偣杩涜绾夸笅鎵ф硶妫�鏌ワ紝涓撻」鏁版嵁瀵规瘮</span> - <span v-else-if="weight >= 0.2 && weight < 0.6"> 寤鸿寮�灞曞父鎬佽拷韪垎鏋�</span> - <span v-else> 寤鸿寮曞浼佷笟闀挎�佷繚鎸�</span> - </div> - <div class="grade-instance"> - <div class="container"> - <div class="block-color heigh"></div> - <div>楂橀闄�(鈮�0.6)</div> - </div> - <div class="container"> - <div class="block-color medium"></div> - <div>涓闄�(0.2~0.6)</div> - </div> - <div class="container"> - <div class="block-color low"></div> - <div>浣庨闄�(锛�0.2)</div> - </div> - </div> - </el-card> - </el-col> - - <el-col :span="5"> - <el-card shadow="never" class="card-height"> - <template #header><span class="title-16">椋庨櫓璇︽儏</span></template> - - <el-form> - <el-form-item label="鏈�澶у�硷細"> {{ bill.max }} mg/m鲁 </el-form-item> - <el-form-item label="鏈�灏忓�硷細"> {{ bill.min }} mg/m鲁 </el-form-item> - <el-form-item label="鏁版嵁鏈夋晥鐜囷細"> {{ bill.online }}% </el-form-item> - <el-form-item label="鏁版嵁鍦ㄧ嚎鐜囷細"> {{ bill.valid }}% </el-form-item> - <el-form-item label="鏁版嵁瓒呮爣鐜囷細"> {{ bill.exceeding }}% </el-form-item> - <el-form-item label="寮傚父绫诲瀷鑱氶泦搴︼細"> - {{ bill.exceptionTypeAggregation * 100 }}% - </el-form-item> - <el-form-item label="鍏稿瀷寮傚父澶嶇幇鐜囷細"> - {{ bill.exceptionRecurrence * 100 }}% - </el-form-item> - </el-form> - </el-card> - </el-col> - </el-row> - - <el-row :gutter="20"> - <el-col :span="12"> - <el-card shadow="never" class="card-value"> - <LineChart title="鏃ュ潎鍊�" :chartData="chartData1" yName="mg/m鲁" seriesName="鏃ュ潎鍊�"> - </LineChart> - </el-card> - </el-col> - - <el-col :span="12"> - <el-card shadow="never" class="card-value"> - <LineChart title="鏃ュ湪绾跨巼" :chartData="chartData2" yName="%" seriesName="鏃ュ湪绾跨巼"> - </LineChart> - </el-card> - </el-col> - </el-row> - <el-row :gutter="20"> - <el-col :span="12"> - <el-card shadow="never" class="card-value"> - <LineChart title="鏃ユ湁鏁堢巼" :chartData="chartData3" yName="%" seriesName="鏃ユ湁鏁堢巼"> - </LineChart> - </el-card> - </el-col> - - <el-col :span="12"> - <el-card shadow="never" class="card-value"> - <LineChart title="鏃ヨ秴鏍囩巼" :chartData="chartData4" yName="%" seriesName="鏃ヨ秴鏍囩巼"> - </LineChart> - </el-card> - </el-col> - </el-row> - </div> - </div> - <el-empty description="鏆傛棤鏁版嵁" v-show="isNoData" :image-size="200" /> - </template> - - <style scoped> - .el-form { - margin: 10px; - } - .form-item { - margin-top: 10px; - } - .chart-container { - margin-left: 10px; - } - .time-text { - font-size: 14px; - color: #333333; - letter-spacing: 1px; - } - .el-card { - margin-top: 15px; - border-radius: 9px; - } - .chart-container { - width: 98%; - /* height: 600px; */ - } - .card-value { - /* min-width:900px; */ - /* padding:0px */ - } - .card-height { - height: 540px; - } - .el-header { - background-color: #010408; - color: #333; - line-height: 60px; - } - .risk-advice { - margin: 40px 0px; - } - .container { - display: flex; - margin-bottom: 10px; - } - .grade-instance { - margin-top: 80px; - } - .block-color { - width: 1em; - height: 1em; - margin-right: 10px; - margin-top: 3px; - } - .heigh { - background-color: red; - } - .medium { - background-color: #fadc19; - } - .low { - background-color: #9fdb1d; - } - - .el-text { - align-self: left; - } - .el-form-item { - margin-bottom: 20px; - } - :deep().el-form-item__content { - justify-content: flex-end; - } - .title-16 { - font-size: 16px; - font-weight: bold; - } - .weightColor-low { - color: #9fdb1d; - } - .weightColor-medium { - color: #dabe09; - } - .weightColor-heigh { - color: red; - } - .risk-grade { - display: flex; - margin-top: 10px; - } - :deep().el-table__header-wrapper { - color: red; - } - /* .wait-name { - width: 500px; - height: 600px; - } */ - .table-class { - /* border: 1px solid blue; */ - /* margin: 20px 0px 20px 0px; */ - height: 540px; - } - - .table-button { - letter-spacing: 1px; - text-decoration: underline; - border-radius: 0px; - } - .site-name { - margin-left: 20px; - } - </style> - \ No newline at end of file diff --git a/src/views/pass_login/LoginAndGetData.vue b/src/views/pass_login/LoginAndGetData.vue index e848234..f6297e5 100644 --- a/src/views/pass_login/LoginAndGetData.vue +++ b/src/views/pass_login/LoginAndGetData.vue @@ -1,4 +1,4 @@ -<script> +<!-- <script> export default { data() { return{ @@ -22,4 +22,51 @@ <style scoped> -</style> \ No newline at end of file +</style> --> +<script> export default { + data() { + return { + form: { + name: '', + mnCode:'' +}, + siteData: [] // 淇濆瓨鎵�鏈夌珯鐐瑰悕鍜岃澶囩紪鍙风殑鏁版嵁 }; +}, + + mounted() { + this.loadAllSites(); + + }, + + methods: { + + + loadAllSites() { + this.$http.get('/dust/sitename').then((response) => { + this.siteData = response.data.data; +}); + +}, + + onSiteNameSelected(siteName) { + + const selectedSite = this.siteData.find((site) => site.siteName === siteName); + + if (selectedSite) { + this.form.mnCode = selectedSite.mnCode; + } + // 濡傛灉娌℃湁鎵惧埌瀵瑰簲鐨勮澶囩紪鍙凤紝娓呯┖mnCode + else + { this.form.mnCode = ''; + + +} } +} , + watch: { + 'form.name'(newValue) { + this.onSiteNameSelected(newValue); + } } } + +} +} + diff --git a/src/views/line_graph/DataRiskModel.vue b/src/views/risk_assessment/DataRiskModel.vue similarity index 72% copy from src/views/line_graph/DataRiskModel.vue copy to src/views/risk_assessment/DataRiskModel.vue index 2da5caf..e91ba3e 100644 --- a/src/views/line_graph/DataRiskModel.vue +++ b/src/views/risk_assessment/DataRiskModel.vue @@ -10,6 +10,9 @@ import ButtonClick from '@/sfc/ButtonClick.vue' import dayjs from 'dayjs' import MonthSelect from '@/sfc/MonthSelect.vue' +import riskApi from '@/api/risk/riskApi.js' +import riskValue from '@/utils/risk_estimate_common_function/riskValue.js' +import lineChart from '@/utils/chartFunction/lineChart.js' export default { components: { LineChart, @@ -37,15 +40,14 @@ // 绔欑偣鍚嶇О name: '', // 璁惧缂栧彿 - number: '', + number: '3234', // 寮�濮嬫椂闂� beginTime: '', // 缁撴潫鏃堕棿 endTime: '' }, month: '', - // 浼犻�掔粰鏈堜唤缁勪欢鐨勫�� - sfc_month: '', + // 鎶樼嚎鍥鹃厤缃」 option: {}, // 鏁版嵁娓呭崟 @@ -62,40 +64,27 @@ // 寮傚父绫诲瀷鎹仛闆嗗害 exceptionTypeAggregation: 0 }, - status: { - isHasData: false - }, + // 鏌ヨ鎸夐挳鍔犺浇鏁堟灉 queryButton: false, // 椋庨櫓鍊兼帓鍚嶅墠鍗佺殑绔欑偣 top_10_sites_with_risk_values: [{ name: '', riskValue: 0.2 }], // 椋庨櫓鍊� - weight: '' + weight: '', + // 鏃犳暟鎹厤缃椂闂存 + areaColor: [] } }, - - watch: { - sName() { - // 褰撳埆鐨勯〉闈㈣皟鐢ㄦ椂 - if (this.sName != '' || this.month_1 != '') { - // 鏇存柊绔欑偣鍚嶅瓧鍜屾椂闂� - this.form.name = this.sName - this.month = this.month_1 - this.parentDataFlag = true - // 鏇存柊鎺掓竻鍗� - this.getRiskRank() - // 鏇存柊缁熻鏁版嵁 - this.getAnalysisData() - // 璁$畻椋庨櫓鍊� - this.calRiskValue() - } - } - }, - mounted() { // // 鍔犺浇椋庨櫓鍊兼渶楂樼殑绔欑偣鏁版嵁 this.ShowDefaultData() + }, + computed: { + // 椋庨櫓绛夌骇 + riskGradeAndAdvice() { + return riskApi.getRiskAdvice(this.weight) + } }, methods: { @@ -153,8 +142,11 @@ async updateOriginPage() { this.screenLoading = true // 鏇存柊鎺掑悕娓呭崟锛屽苟寰楀埌椋庨櫓鍊兼渶楂樼珯鐐� - this.form.name = await this.getRiskRank() + let arr = await this.getRiskRank() + this.form.name = arr[0] + this.form.number = arr[1] this.screenLoading = false + // 鏇存柊鏃ョ粺璁℃暟鎹� this.getAnalysisData() // 璁$畻椋庨櫓鍊� @@ -163,29 +155,8 @@ // 璁$畻椋庨櫓鍊� calRiskValue() { - exceptionApi.analysisdataByType(this.month, 'month').then((response) => { - const chartData = response.data.data - - if (response.data.data.length == 0) { - return - } - // 浠庡璞℃暟缁勬壘鍒拌绔欑偣鎵�鍦ㄧ殑鍏冪礌 - let siteItem = this.findObjectByPropertyValue(chartData, 'name', this.form.name) - if (Object.keys(siteItem).length === 0) { - return - } - let arr = [] - arr.push(siteItem) - exceptionApi - .exceptiondata1({ - siteName: this.form.name, - beginTime: this.form.beginTime, - endTime: this.form.endTime - }) - .then((res) => { - let table = index.merge(arr, res.data.data, this.form.beginTime, this.form.endTime) - this.weight = table[0].riskValue - }) + riskApi.queryRiskValue(this.form.number, this.month, 'month').then((response) => { + this.weight = riskValue.calRiskValue(response.data.data[0]).toFixed(2) }) }, @@ -213,14 +184,22 @@ this.isNoData = true return } - this.begin = this.chartData[0].lst - this.end = this.chartData[this.chartData.length - 1].lst + // 鍒嗘瀽鏁版嵁涓殑鏈�鏃╂椂闂� + let begin = this.chartData[0].lst + // 鍒嗘瀽鏁版嵁涓殑鏈�鏅氭椂闂� + let end = this.chartData[this.chartData.length - 1].lst // 绉婚櫎绌烘暟鎹姸鎬� this.isNoData = false + + // 鏃犳暟鎹殑鏃堕棿娈� + let noDataTimeInteval = lineChart.backNoDataInteval(begin, end) + // 鏃犳暟鎹厤缃椂闂存 + this.areaColor = lineChart.getMarkArea(noDataTimeInteval) + console.log('鍖哄煙', this.areaColor) this.setChart() // 鎶樼嚎鍥炬暟鎹� - let temp = index.calBillData(this.chartData, this.begin, this.end) + let temp = index.calBillData(this.chartData, begin, end) this.bill.min = temp['min'] this.bill.max = temp['max'] @@ -248,69 +227,53 @@ // 閫夋嫨鍏朵粬鍊肩被鍨嬫椂 setChart() { if (this.chartData.length) { - // x杞存棩鏈熸椂闂� - let dateList = [] - //棰楃矑鐗╁钩鍧囨祿搴� - let dayAvg = [] - let dataOnline = [] - let dataValid = [] - let dataExceed = [] - this.chartData.forEach((item) => { - //x杞存棩鏈� - dateList.push(item.lst) - // 鍘嗗彶娌圭儫娴撳害 - dayAvg.push(item.dayAvg) - dataOnline.push(item.dayOnline.slice(0, -1)) - dataValid.push(item.dayValid.slice(0, -1)) - dataExceed.push(item.dayExceeding.slice(0, -1)) - }) + // 鏋勫缓鎶樼嚎鍥緓,y鏁版嵁 + let obj = lineChart.getLineChartXYData( + this.chartData, + this.form.beginTime, + this.form.endTime + ) this.chartData1 = { - x: dateList, - y: dayAvg + x: obj.xData, + y: obj.yAvg } this.chartData2 = { - x: dateList, - y: dataOnline + x: obj.xData, + y: obj.yOnline } this.chartData3 = { - x: dateList, - y: dataValid + x: obj.xData, + y: obj.yValid } this.chartData4 = { - x: dateList, - y: dataExceed + x: obj.xData, + y: obj.yExceed } } }, // 寰楀埌鍓�10椋庨櫓鎺掑悕娓呭崟 async getRiskRank() { - let staticsData = await exceptionApi.analysisdataByType(this.month, 'month') + let response = await riskApi.queryRiskValue('', this.month, 'month') - let exceptionData = await exceptionApi.exceptiondata1({ - siteName: '', - beginTime: this.form.beginTime, - endTime: this.form.endTime - }) + let tableData = riskValue.backComprehensiveRiskTableData(response.data.data) - const riskValueSites = index.merge( - staticsData.data.data, - exceptionData.data.data, - this.form.beginTime, - this.form.endTime - ) - this.top_10_sites_with_risk_values = this.getTopRiskData(riskValueSites, 10) + this.top_10_sites_with_risk_values = this.getTopRiskData(tableData, 10) if (this.top_10_sites_with_risk_values.length != 0) { // 琛ㄦ牸鎸夐闄╁�煎�掑彊鎺掑垪 this.$nextTick(() => { this.$refs.table.sort('riskValue', 'descending') }) - // Promise - return this.top_10_sites_with_risk_values[0].siteName + // 淇濆瓨椋庨櫓鍊兼渶楂樼殑绔欑偣鍚嶇О鍜岃澶囩紪鍙� + let temp = [] + temp.push( + this.top_10_sites_with_risk_values[0].siteName, + this.top_10_sites_with_risk_values[0].mnCode + ) + return temp } }, - /** * 闄嶅簭鎺掑垪锛岃繑鍥為檷搴忓墠num鐨勫厓绱� * @param锛� 瀵硅薄鏁扮粍锛岃繑鍥炵殑鏁伴噺 @@ -335,11 +298,12 @@ :site-name="form.name" isNeedDefaultSite="0" @submit-value="(n) => (form.name = n)" + @submit-mncode="(n) => (form.number = n)" ></InputSearch> </el-form-item> <el-form-item> - <MonthSelect :month="this.month_1" @submit-value="giveMonth"></MonthSelect> + <MonthSelect @submit-value="giveMonth"></MonthSelect> </el-form-item> <el-form-item> @@ -355,7 +319,7 @@ <div v-loading="screenLoading" class="wait-name"> <div class="chart-container" v-show="!isNoData && !screenLoading"> <div class="time-text"> - <span>鏁版嵁缁熻鏃舵锛歿{ begin }} ~ {{ end }}</span> + <span>鏁版嵁缁熻鏃舵锛歿{ form.beginTime }} ~ {{ form.endTime }}</span> <span class="site-name">{{ form.name }}</span> </div> @@ -364,15 +328,16 @@ <el-card shadow="never" class="table-class"> <el-table ref="table" - highlight-current-row="true" + :highlight-current-row="true" :data="top_10_sites_with_risk_values" :default-sort="{ prop: 'riskValue', order: 'descending' }" height="540" > + <!-- :index="indexMethod" --> + <el-table-column type="index" label="搴忓彿" - :index="indexMethod" fixed width="52" show-overflow-tooltip @@ -401,22 +366,11 @@ show-overflow-tooltip align="center" /> - <!-- <el-table-column label="鎿嶄綔" align="center"> - <template #default="{ row }"> - <el-button - type="primary" - text - class="table-button" - @click="querySiteStaticsInfo(row)" - >璇︽儏</el-button - > - </template> - </el-table-column> --> </el-table> </el-card> </el-col> - <el-col :span="12"> + <el-col :span="11"> <el-card shadow="never" class="table-class"> <DustRadarChart :name="[ @@ -437,8 +391,8 @@ </el-card> </el-col> - <el-col :span="3"> - <el-card shadow="never" class="card-height"> + <el-col :span="4"> + <el-card shadow="never" class="card-height risk-card"> <template #header> <h1 :class="{ @@ -450,19 +404,20 @@ 椋庨櫓鍊�(0~1)锛歿{ weight }} </h1> </template> + <div class="risk-text-container"> + <div class="risk-grade"> - <strong>椋庨櫓绛夌骇锛�</strong> - <span v-if="weight >= 0.6"> 楂橀闄�</span> - <span v-else-if="weight >= 0.2 && weight < 0.6"> 涓闄�</span> - <span v-else> 浣庨闄�</span> + <h1 class="sub-title">椋庨櫓绛夌骇锛�</h1> + <span class="sub-title">{{ riskGradeAndAdvice.riskGrade }} </span> </div> <div class="risk-advice"> - <strong>绠℃帶寤鸿锛�</strong> - <span v-if="weight >= 0.6"> 寤鸿瀵硅绔欑偣杩涜绾夸笅鎵ф硶妫�鏌ワ紝涓撻」鏁版嵁瀵规瘮</span> - <span v-else-if="weight >= 0.2 && weight < 0.6"> 寤鸿寮�灞曞父鎬佽拷韪垎鏋�</span> - <span v-else> 寤鸿寮曞浼佷笟闀挎�佷繚鎸�</span> + <h1 class="sub-title">绠℃帶寤鸿锛�</h1> + <div v-for="item in riskGradeAndAdvice.riskAdvice" :key="item" class="risk-advice-text"> + {{ item }} + </div> </div> + <div class="grade-instance"> <div class="container"> <div class="block-color heigh"></div> @@ -477,12 +432,16 @@ <div>浣庨闄�(锛�0.2)</div> </div> </div> + + </div> </el-card> </el-col> <el-col :span="4"> <el-card shadow="never" class="card-height"> - <template #header><span class="title-16">椋庨櫓璇︽儏</span></template> + <template #header> + <span class="title-16">椋庨櫓璇︽儏</span> + </template> <el-form> <el-form-item label="鏈�澶у�硷細"> {{ bill.max }} mg/m鲁 </el-form-item> @@ -504,14 +463,26 @@ <el-row :gutter="20"> <el-col :span="12"> <el-card shadow="never" class="card-value"> - <LineChart title="鏃ュ潎鍊�" :chartData="chartData1" yName="mg/m鲁" seriesName="鏃ュ潎鍊�"> + <LineChart + title="鏃ュ潎鍊�" + :chartData="chartData1" + yName="mg/m鲁" + seriesName="鏃ュ潎鍊�" + :areaColor="areaColor" + > </LineChart> </el-card> </el-col> <el-col :span="12"> <el-card shadow="never" class="card-value"> - <LineChart title="鏃ュ湪绾跨巼" :chartData="chartData2" yName="%" seriesName="鏃ュ湪绾跨巼"> + <LineChart + title="鏃ュ湪绾跨巼" + :chartData="chartData2" + yName="%" + seriesName="鏃ュ湪绾跨巼" + :areaColor="areaColor" + > </LineChart> </el-card> </el-col> @@ -519,14 +490,26 @@ <el-row :gutter="20"> <el-col :span="12"> <el-card shadow="never" class="card-value"> - <LineChart title="鏃ユ湁鏁堢巼" :chartData="chartData3" yName="%" seriesName="鏃ユ湁鏁堢巼"> + <LineChart + title="鏃ユ湁鏁堢巼" + :chartData="chartData3" + yName="%" + seriesName="鏃ユ湁鏁堢巼" + :areaColor="areaColor" + > </LineChart> </el-card> </el-col> <el-col :span="12"> <el-card shadow="never" class="card-value"> - <LineChart title="鏃ヨ秴鏍囩巼" :chartData="chartData4" yName="%" seriesName="鏃ヨ秴鏍囩巼"> + <LineChart + title="鏃ヨ秴鏍囩巼" + :chartData="chartData4" + yName="%" + seriesName="鏃ヨ秴鏍囩巼" + :areaColor="areaColor" + > </LineChart> </el-card> </el-col> @@ -559,10 +542,7 @@ width: 98%; /* height: 600px; */ } -.card-value { - /* min-width:900px; */ - /* padding:0px */ -} + .card-height { height: 570px; } @@ -572,14 +552,14 @@ line-height: 60px; } .risk-advice { - margin: 40px 0px; + /* margin: 20px 0px; */ } .container { display: flex; margin-bottom: 10px; } .grade-instance { - margin-top: 80px; + /* margin-top: 50px; */ } .block-color { width: 1em; @@ -612,16 +592,18 @@ } .weightColor-low { color: #9fdb1d; + font-size: 16px; } .weightColor-medium { color: #dabe09; + font-size: 16px; } .weightColor-heigh { color: red; + font-size: 16px; } .risk-grade { display: flex; - margin-top: 10px; } :deep().el-table__header-wrapper { color: red; @@ -644,4 +626,21 @@ .site-name { margin-left: 20px; } +.risk-advice-text { + font-size: 14px; + color: #333333; + letter-spacing: 1.5px; + margin-top: 10px; +} +.sub-title { + font-size: 14px; + color: #333333; +} + +.risk-text-container{ + height: 490px; + display: flex; + flex-direction: column; + justify-content: space-around; +} </style> diff --git a/src/views/line_graph/DataRiskRank.vue b/src/views/risk_assessment/DataRiskRank.vue similarity index 98% rename from src/views/line_graph/DataRiskRank.vue rename to src/views/risk_assessment/DataRiskRank.vue index 465b2b8..b9356a9 100644 --- a/src/views/line_graph/DataRiskRank.vue +++ b/src/views/risk_assessment/DataRiskRank.vue @@ -45,7 +45,6 @@ }, mounted() { - this.form.name = '' this.fetchData() this.calTableHeight() }, @@ -148,9 +147,7 @@ let params = {} params['page'] = this.currentPage params['pageSize'] = this.pageSize - if (this.form.name) { - params['siteName'] = this.form.name - } + params['siteName'] = '' if (this.form.beginTime) { params['beginTime'] = this.form.beginTime } diff --git a/src/views/line_graph/SiteComprehensiveRskRanking.vue b/src/views/risk_assessment/SiteComprehensiveRskRanking.vue similarity index 65% rename from src/views/line_graph/SiteComprehensiveRskRanking.vue rename to src/views/risk_assessment/SiteComprehensiveRskRanking.vue index 2d361f6..8d11b84 100644 --- a/src/views/line_graph/SiteComprehensiveRskRanking.vue +++ b/src/views/risk_assessment/SiteComprehensiveRskRanking.vue @@ -1,25 +1,21 @@ <script> import AreaAndmonitorType from '@/sfc/AreaAndmonitorType.vue' -import exceptionApi from '@/api/exceptionApi.js' import { useCommonFunction } from '../../utils/common.js' -import index from '@/utils/risk_estimate_common_function/index.js' import dayjs from 'dayjs' import ButtonExportExcel from '@/sfc/ButtonExportExcel.vue' import ButtonClick from '@/sfc/ButtonClick.vue' import { ElMessage } from 'element-plus' -import MonthSelect from '@/sfc/MonthSelect.vue'; -import SiteDetail from '@/views/line_graph/components/SiteDetail.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'; +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 { components: { AreaAndmonitorType, ButtonExportExcel, ButtonClick, MonthSelect, - SiteDetail, }, data() { return { @@ -40,7 +36,7 @@ endTime: '', // 閫夋嫨鐨勬湀浠� - month:'' + month: '' }, bill: { min: '', @@ -60,7 +56,7 @@ table: [], // 琛ㄦ牸楂樺害 tableHeight: 600, - currentRow:[] + currentRow: [] } }, setup() { @@ -68,41 +64,37 @@ const { exportToExcel } = useCommonFunction() return { exportToExcel } }, - computed: { - ...mapStores(useLoadingStore), + computed: { + ...mapStores(useLoadingStore) }, - mounted(){ - // + mounted() { + // this.fetch() this.calTableHeight() }, methods: { - /** * 灏嗕腑鍥芥爣鍑嗘椂闂磋浆涓烘寚瀹氭牸寮� * @param锛� * @returns锛� */ - giveMonth(val){ + giveMonth(val) { //灏嗕腑鍥芥爣鍑嗘椂闂磋浆涓烘寚瀹氭牸寮�(璇ョ粍浠惰繑鍥炵殑鏍囧噯鏃堕棿鐨勬牸寮忥紝鎵�浠ュ繀椤荤殑鍔犺繖涓嚱鏁�) - this.form.month = dayjs(val).format('YYYY-MM-DD'); - // 鍚屾椂鏇存柊寮�濮嬪拰缁撴潫鏃堕棿 + this.form.month = dayjs(val).format('YYYY-MM-DD') + // 鍚屾椂鏇存柊寮�濮嬪拰缁撴潫鏃堕棿 this.form.beginTime = dayjs(this.form.month).startOf().format('YYYY-MM-DD HH:mm:ss') this.form.endTime = dayjs(this.form.month).endOf('month').format('YYYY-MM-DD HH:mm:ss') - console.log(this.form.beginTime,this.form.endTime); + console.log(this.form.beginTime, this.form.endTime) + }, - }, - // 鍔熻兘锛氭敼鍙樿〃鏍兼煇涓崟鍏冩牸鐨勯鑹� tableCellClassName({ row, columnIndex }) { // 骞冲潎鍊间笉婊¤冻鏍囧噯鏃� if (columnIndex == 4) { if (row.riskValue >= 0.8) { - return 'warning-row'; + return 'warning-row' } } - - }, // 鍔熻兘锛氳〃鏍奸珮搴︽牴鎹唴瀹硅嚜閫傚簲 calTableHeight() { @@ -110,70 +102,28 @@ // 鍏朵腑涓�涓�40鏄洅瀛愮殑鎬诲杈硅窛 this.tableHeight = `calc(100vh - ${h1}px - 40px - 40px - var(--el-main-padding) * 2` }, + // 鐐瑰嚮椋庨櫓鎺掑悕鎸夐挳 - // fetchData() { - // this.loading = true - // this.queryButton = true - // exceptionApi - // .analysisdataByType(this.form.month, 'month') - // .then((response) => { - // this.chartData = response.data.data - // this.queryButton = false - // this.isNoData = false - - // if (response.data.data.length == 0) { - // this.isNoData = true - // return - // } - - // exceptionApi - // .exceptiondata1({ - // siteName: '', - // beginTime: this.form.beginTime, - // endTime: this.form.endTime - // }) - // .then((res) => { - // this.isNoData = false - - // this.table = index.merge( - // this.chartData, - // res.data.data, - // this.form.beginTime, - // this.form.endTime - // ) - // this.loading = false - - // this.$nextTick(()=>{ - // this.$refs.table.sort('riskValue','descending') - - // }) - - // }) - - // }) - // }, - - // 鐐瑰嚮椋庨櫓鎺掑悕鎸夐挳 - fetchData() { + fetchData() { this.loading = true this.queryButton = true - riskApi - .queryRiskValue('',this.form.month, 'month') - .then((response) => { - if (response.data.data.length == 0) { - this.isNoData = true - return - } + riskApi.queryRiskValue('', this.form.month, 'month').then((response) => { + if (response.data.data.length == 0) { + this.isNoData = true + return + } - this.table = riskValue.calMonthlyRiskValue(response.data.data) - this.queryButton = false - this.isNoData = false - this.$nextTick(()=>{ - this.$refs.table.sort('riskValue','descending') - + 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') }) - }) - }, + }) + }, /** * 鍒濆鍔犺浇鍑芥暟 @@ -183,6 +133,11 @@ this.fetchData() // 寮傚父鏁版嵁 // this.exceptiondataCount() + }, + + // 鍗曞厓鏍煎唴瀹规崲琛� + wrapIndex(index) { + return index.replace(/\n/g, '<br/>') }, /** @@ -218,11 +173,10 @@ ElMessage('鏃犳暟鎹渶瑕佸鍑�') } }, - openDetail(row){ - const encodedSiteName = encodeURIComponent(row.siteName); + openDetail(row) { + const encodedSiteName = encodeURIComponent(row.siteName) this.$router.push(`/detail/${encodedSiteName}/${this.form.month}`) - // this.$router.push(`/detail/${row.siteName}/${this.form.month}`) } } } @@ -237,7 +191,7 @@ </el-form-item> <el-form-item> - <MonthSelect @submit-value="giveMonth"></MonthSelect> + <MonthSelect @submit-value="giveMonth"></MonthSelect> </el-form-item> <el-form-item> @@ -275,21 +229,26 @@ type="index" prop="name" label="搴忓彿" - :index="indexMethod" fixed align="center" 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 - > + <el-button type="primary" text class="table-button" @click="openDetail(row)">{{ + row.siteName + }}</el-button> </template> - </el-table-column> + </el-table-column> <el-table-column prop="region" label="鍖哄煙" align="center" width="80" show-overflow-tooltip /> - <el-table-column prop="monitorType" label="妫�娴嬬被鍨�" align="center" width="80" show-overflow-tooltip /> + <el-table-column + prop="monitorType" + label="妫�娴嬬被鍨�" + align="center" + width="80" + show-overflow-tooltip + /> <el-table-column prop="riskValue" label="椋庨櫓鍊�" @@ -298,8 +257,18 @@ width="100" show-overflow-tooltip /> - <el-table-column prop="riskGrage" label="椋庨櫓绛夌骇" align="center" width="100" show-overflow-tooltip /> - <el-table-column prop="riskAdvice" label="绠℃帶鎺柦" align="center" show-overflow-tooltip /> + <el-table-column + prop="riskGrade" + label="椋庨櫓绛夌骇" + align="center" + width="100" + show-overflow-tooltip + /> + <el-table-column prop="riskAdvice" label="绠℃帶鎺柦" show-overflow-tooltip> + <template #default="scope"> + <div v-html="wrapIndex(scope.row.riskAdvice)"></div> + </template> + </el-table-column> <el-table-column prop="beginTime" label="寮�濮嬫棩鏈�" @@ -318,9 +287,6 @@ /> </el-table> <el-empty v-show="isNoData" :image-size="200" /> - - - </template> <style scoped> @@ -329,7 +295,7 @@ margin: 10px 0px 0px 10px; } -:deep(.el-table__row .warning-row){ +:deep(.el-table__row .warning-row) { background-color: red; /* color: rgb(241, 236, 236); */ } @@ -338,5 +304,7 @@ text-decoration: underline; border-radius: 0px; } - +.el-table { + color: #333333; +} </style> diff --git a/src/views/line_graph/components/DustRadarChart.vue b/src/views/risk_assessment/components/DustRadarChart.vue similarity index 98% rename from src/views/line_graph/components/DustRadarChart.vue rename to src/views/risk_assessment/components/DustRadarChart.vue index 1062f26..1936eb3 100644 --- a/src/views/line_graph/components/DustRadarChart.vue +++ b/src/views/risk_assessment/components/DustRadarChart.vue @@ -133,7 +133,8 @@ <style scoped> .chart { - width: 650px; + /* width: 650px; */ + width: 620px; height: 500px; } </style> diff --git a/src/views/risk_assessment/components/JumpDialog.vue b/src/views/risk_assessment/components/JumpDialog.vue new file mode 100644 index 0000000..40c7332 --- /dev/null +++ b/src/views/risk_assessment/components/JumpDialog.vue @@ -0,0 +1,41 @@ + +<script> + export default { + props:{ + dialogVisible:{ + type:Boolean, + default:false + } + }, + data() { + return{ + // dialogVisible:false + isOpen:false + } + }, + watch:{ + dialogVisible(){ + this.isOpen = this.dialogVisible + } + }, + mounted() { + + }, + methods: { + + } +} +</script> + +<template> + <el-dialog + v-model="isOpen" + width="80%" + > + 11111 + </el-dialog> +</template> + +<style scoped> + +</style> \ No newline at end of file diff --git a/src/views/line_graph/components/LineChart.vue b/src/views/risk_assessment/components/LineChart.vue similarity index 86% rename from src/views/line_graph/components/LineChart.vue rename to src/views/risk_assessment/components/LineChart.vue index e509576..a4643cf 100644 --- a/src/views/line_graph/components/LineChart.vue +++ b/src/views/risk_assessment/components/LineChart.vue @@ -35,6 +35,12 @@ seriesName: { type: String, default: '绯诲垪涓�' + }, + areaColor: { + type: Array, + default: () => { + return [] + } } }, data() { @@ -44,6 +50,7 @@ }, mounted() { this.intiChart() + window.addEventListener('resize', this.resizeChart) }, watch: { @@ -70,11 +77,6 @@ toolbox: { // 宸ュ叿鏍� feature: { - // dataZoom: { - // // 鍖哄煙缂╂斁 - // yAxisIndex: 'none' - // }, - // 淇濆瓨涓哄浘鐗� saveAsImage: {} } @@ -101,7 +103,16 @@ { name: this.seriesName, type: 'line', - data: this.chartData.y + data: this.chartData.y, + // 鍙樻崲鎸囧畾鏃堕棿鍖洪棿鐨勮儗鏅鑹� + + markArea: { + itemStyle: { + color: '#e5e6eb' + }, + + data: this.areaColor + } } ] } @@ -124,5 +135,6 @@ height: 300px; margin-top: 25px; margin-left: 30px; + color: #535a64; } </style> diff --git a/src/views/line_graph/components/SiteDetail.vue b/src/views/risk_assessment/components/SiteDetail.vue similarity index 91% rename from src/views/line_graph/components/SiteDetail.vue rename to src/views/risk_assessment/components/SiteDetail.vue index af48d78..9979374 100644 --- a/src/views/line_graph/components/SiteDetail.vue +++ b/src/views/risk_assessment/components/SiteDetail.vue @@ -1,6 +1,6 @@ <!--鐐瑰嚮绔欑偣 璺宠浆鑷抽闄╂ā鍨嬮〉闈� --> <script> -import subRiskModel from '@/views/line_graph/components/subRiskModel.vue' +import subRiskModel from '@/views/risk_assessment/components/subRiskModel.vue' export default { components: { subRiskModel diff --git a/src/views/line_graph/DataRiskModel.vue b/src/views/risk_assessment/components/subRiskModel.vue similarity index 76% rename from src/views/line_graph/DataRiskModel.vue rename to src/views/risk_assessment/components/subRiskModel.vue index 2da5caf..39a5f98 100644 --- a/src/views/line_graph/DataRiskModel.vue +++ b/src/views/risk_assessment/components/subRiskModel.vue @@ -1,19 +1,34 @@ -<!-- 鏃ュ潎鍊� --> +<!-- 椋庨櫓妯″瀷鐨勯〉闈� +鍖哄埆锛� +1.鎺ュ彈鐖剁粍浠朵紶鍙� +2.鏃犲垵濮嬪姞杞芥暟鎹紙鏃爉ounted锛� +--> <script> -import InputSearch from '@/sfc/InputSearch.vue' +// import InputSearch from '@/sfc/InputSearch.vue' import AreaAndmonitorType from '@/sfc/AreaAndmonitorType.vue' -import DustRadarChart from './components/DustRadarChart.vue' +import DustRadarChart from '@/views/risk_assessment/components/DustRadarChart.vue' import exceptionApi from '@/api/exceptionApi.js' -import LineChart from './components/LineChart.vue' +import LineChart from '@/views/risk_assessment/components/LineChart.vue' import index from '@/utils/risk_estimate_common_function/index.js' import ButtonClick from '@/sfc/ButtonClick.vue' import dayjs from 'dayjs' import MonthSelect from '@/sfc/MonthSelect.vue' export default { + props: { + sName: { + type: String, + default: '' + }, + month_1: { + type: String, + default: '' + } + }, components: { LineChart, - InputSearch, + // DateSelectWithShortCuts, + // InputSearch, AreaAndmonitorType, DustRadarChart, ButtonClick, @@ -30,6 +45,7 @@ chartData2: {}, chartData3: {}, chartData4: {}, + //devId:'', //璁惧缂栧彿 begin: '', //寮�濮嬫椂闂� end: '', //缁撴潫鏃堕棿 @@ -38,6 +54,8 @@ name: '', // 璁惧缂栧彿 number: '', + + // month:'', // 寮�濮嬫椂闂� beginTime: '', // 缁撴潫鏃堕棿 @@ -82,9 +100,12 @@ // 鏇存柊绔欑偣鍚嶅瓧鍜屾椂闂� this.form.name = this.sName this.month = this.month_1 + // 鍚屾椂鏇存柊鏈堣捣濮嬫椂闂� + this.form.beginTime = dayjs(this.month).startOf().format('YYYY-MM-DD HH:mm:ss') + this.form.endTime = dayjs(this.month).endOf('month').format('YYYY-MM-DD HH:mm:ss') + this.parentDataFlag = true - // 鏇存柊鎺掓竻鍗� - this.getRiskRank() + // 鏇存柊缁熻鏁版嵁 this.getAnalysisData() // 璁$畻椋庨櫓鍊� @@ -93,10 +114,7 @@ } }, - mounted() { - // // 鍔犺浇椋庨櫓鍊兼渶楂樼殑绔欑偣鏁版嵁 - this.ShowDefaultData() - }, + mounted() {}, methods: { // 鏌ヨ绔欑偣缁熻淇℃伅 @@ -115,6 +133,7 @@ // 鍚屾椂鏇存柊寮�濮嬪拰缁撴潫鏃堕棿 this.form.beginTime = dayjs(this.month).startOf().format('YYYY-MM-DD HH:mm:ss') this.form.endTime = dayjs(this.month).endOf('month').format('YYYY-MM-DD HH:mm:ss') + console.log(this.form.beginTime, this.form.endTime) }, /** @@ -151,10 +170,9 @@ // 鍔犺浇榛樿灞曠ず鐨勫唴瀹� async updateOriginPage() { - this.screenLoading = true // 鏇存柊鎺掑悕娓呭崟锛屽苟寰楀埌椋庨櫓鍊兼渶楂樼珯鐐� this.form.name = await this.getRiskRank() - this.screenLoading = false + // 鏇存柊鏃ョ粺璁℃暟鎹� this.getAnalysisData() // 璁$畻椋庨櫓鍊� @@ -201,6 +219,7 @@ if (this.form.endTime) { params['endTime'] = this.form.endTime } + this.screenLoading = true this.loading = true this.queryButton = true exceptionApi @@ -218,6 +237,7 @@ // 绉婚櫎绌烘暟鎹姸鎬� this.isNoData = false + this.screenLoading = false this.setChart() // 鎶樼嚎鍥炬暟鎹� let temp = index.calBillData(this.chartData, this.begin, this.end) @@ -282,44 +302,6 @@ y: dataExceed } } - }, - - // 寰楀埌鍓�10椋庨櫓鎺掑悕娓呭崟 - async getRiskRank() { - let staticsData = await exceptionApi.analysisdataByType(this.month, 'month') - - let exceptionData = await exceptionApi.exceptiondata1({ - siteName: '', - beginTime: this.form.beginTime, - endTime: this.form.endTime - }) - - const riskValueSites = index.merge( - staticsData.data.data, - exceptionData.data.data, - this.form.beginTime, - this.form.endTime - ) - this.top_10_sites_with_risk_values = this.getTopRiskData(riskValueSites, 10) - if (this.top_10_sites_with_risk_values.length != 0) { - // 琛ㄦ牸鎸夐闄╁�煎�掑彊鎺掑垪 - this.$nextTick(() => { - this.$refs.table.sort('riskValue', 'descending') - }) - // Promise - return this.top_10_sites_with_risk_values[0].siteName - } - }, - - /** - * 闄嶅簭鎺掑垪锛岃繑鍥為檷搴忓墠num鐨勫厓绱� - * @param锛� 瀵硅薄鏁扮粍锛岃繑鍥炵殑鏁伴噺 - */ - getTopRiskData(arr, num) { - // 鎸夌収riskValue闄嶅簭鎺掑垪 - arr.sort((a, b) => b.riskValue - a.riskValue) - // 鑾峰彇鍓峮um涓厓绱� - return arr.slice(0, num) } } } @@ -330,26 +312,27 @@ <el-form-item class="form-item"> <AreaAndmonitorType></AreaAndmonitorType> </el-form-item> - <el-form-item class="form-item"> - <InputSearch - :site-name="form.name" - isNeedDefaultSite="0" - @submit-value="(n) => (form.name = n)" - ></InputSearch> - </el-form-item> - <el-form-item> - <MonthSelect :month="this.month_1" @submit-value="giveMonth"></MonthSelect> - </el-form-item> + <!-- <el-form-item class="form-item"> + <InputSearch + :site-name="form.name" + isNeedDefaultSite="0" + @submit-value="(n) => (form.name = n)" + ></InputSearch> + </el-form-item> --> - <el-form-item> - <ButtonClick - content="椋庨櫓璇勪及" - type="primary" - :loading="queryButton" - @do-search="riskAssessment" - ></ButtonClick> - </el-form-item> + <!-- <el-form-item> + <MonthSelect :month="this.month_1" @submit-value="giveMonth"></MonthSelect> + </el-form-item> --> + + <!-- <el-form-item> + <ButtonClick + content="椋庨櫓璇勪及" + type="primary" + :loading="queryButton" + @do-search="riskAssessment" + ></ButtonClick> + </el-form-item> --> </el-form> <div v-loading="screenLoading" class="wait-name"> @@ -360,70 +343,14 @@ </div> <el-row :gutter="10"> - <el-col :span="5"> - <el-card shadow="never" class="table-class"> - <el-table - ref="table" - highlight-current-row="true" - :data="top_10_sites_with_risk_values" - :default-sort="{ prop: 'riskValue', order: 'descending' }" - height="540" - > - <el-table-column - type="index" - label="搴忓彿" - :index="indexMethod" - fixed - width="52" - show-overflow-tooltip - align="center" - /> - <el-table-column - prop="siteName" - label="绔欑偣鍚嶇О" - show-overflow-tooltip - align="center" - > - <template #default="{ row }"> - <el-button - type="primary" - text - class="table-button" - @click="querySiteStaticsInfo(row)" - >{{ row.siteName }}</el-button - > - </template> - </el-table-column> - <el-table-column - prop="riskValue" - label="椋庨櫓鍊�" - sortable - show-overflow-tooltip - align="center" - /> - <!-- <el-table-column label="鎿嶄綔" align="center"> - <template #default="{ row }"> - <el-button - type="primary" - text - class="table-button" - @click="querySiteStaticsInfo(row)" - >璇︽儏</el-button - > - </template> - </el-table-column> --> - </el-table> - </el-card> - </el-col> - - <el-col :span="12"> - <el-card shadow="never" class="table-class"> + <el-col :span="14"> + <el-card shadow="never"> <DustRadarChart :name="[ '鏁版嵁鏈夋晥椋庨櫓', '鍏稿瀷寮傚父澶嶇幇椋庨櫓', '寮傚父绫诲瀷鑱氶泦椋庨櫓', - '瓒呮爣寮傚父椋庨櫓', + '鏁版嵁瓒呮爣椋庨櫓', '鏁版嵁鍦ㄧ嚎椋庨櫓' ]" :yData="[ @@ -437,7 +364,7 @@ </el-card> </el-col> - <el-col :span="3"> + <el-col :span="5"> <el-card shadow="never" class="card-height"> <template #header> <h1 @@ -480,7 +407,7 @@ </el-card> </el-col> - <el-col :span="4"> + <el-col :span="5"> <el-card shadow="never" class="card-height"> <template #header><span class="title-16">椋庨櫓璇︽儏</span></template> @@ -564,7 +491,7 @@ /* padding:0px */ } .card-height { - height: 570px; + height: 540px; } .el-header { background-color: #010408; @@ -627,13 +554,13 @@ color: red; } /* .wait-name { - width: 500px; - height: 600px; - } */ + width: 500px; + height: 600px; + } */ .table-class { /* border: 1px solid blue; */ /* margin: 20px 0px 20px 0px; */ - height: 570px; + height: 540px; } .table-button { -- Gitblit v1.9.3