diff --git a/04.系统编码/Frontend/src/components/DecisionSupport.vue b/04.系统编码/Frontend/src/components/DecisionSupport.vue
index 4a9a3c9..b1f4cba 100644
--- a/04.系统编码/Frontend/src/components/DecisionSupport.vue
+++ b/04.系统编码/Frontend/src/components/DecisionSupport.vue
@@ -19,7 +19,7 @@
-

+
@@ -47,37 +47,66 @@
-
-
高楼污染指数
-
-
-
-
-
-

-
- 暂无图片
-
-
- 正在加载...
-
-
-
-
-
高楼污染指数说明:
-
使用激光雷达数据反演PM2.5和PM10
-
浓度廓线,基于PM2.5和PM10的平均
-
值构建高楼污染指数,
-
高楼(60米),
-
超高楼(200米),
-
极高楼层(500米)
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -87,12 +116,20 @@
import { onMounted, reactive, toRefs } from 'vue';
import * as Tiff from 'browser-tiff.js';
import { DecisionSupportConfig } from '../uilts/Config';
-import { post } from '../uilts/axios';
-
+ import {get, post} from '../uilts/axios';
+ import {HighChartCreate} from "../model/high-chart-create";
+ import moment from "moment";
+ import {ConstantRamanLidar} from "../model/constant";
+ import {CustomeArray} from "../model/custome-array";
export default {
name: 'DecisionSupport',
setup() {
+
let options = reactive({
+ times: [],
+ currentTime: null,
+ date: moment().format('YYYY-MM-DD 00:00:00'),
+ index: 0,
currentIndicator: 'plan-advice',
currentProduct: 'control-experiment',
items: [{
@@ -128,18 +165,28 @@ import { post } from '../uilts/axios';
}],
indicatorImg: '/product/picture/images/decision-support/pollution-indicator/pollution-indicator.png',
indicatorPreview: ['/product/picture/images/decision-support/pollution-indicator/pollution-indicator.png'],
- urls: []
+ urls: [],
+ loadingPollutionIndicatorStatus: false
})
+ let creates: {
+ pollutionIndicator: HighChartCreate
+ } = {
+ pollutionIndicator: null
+ }
onMounted(() => {
+ initTimeLineDay()
setImage(options.currentIndicator + '/' + options.currentProduct);
})
const onIndicatorClick = (indicator) => {
options.currentIndicator = indicator;
- if(options.currentIndicator === 'plan-advice')
- setImage(options.currentIndicator + '/' + options.currentProduct);
+ if(options.currentIndicator === 'plan-advice') {
+ setImage(options.currentIndicator + '/' + options.currentProduct);
+ }
+ reloadChartsRecognition('hbpi', drawPollutionIndicator)
+ pollutionIndicatorInit()
}
const onProductClick = (product) => {
@@ -193,11 +240,133 @@ import { post } from '../uilts/axios';
}
}
+ const pollutionIndicatorInit = () => {
+ creates.pollutionIndicator = new HighChartCreate('pollutionIndicator');
+ creates.pollutionIndicator.setChart(false, 'line', 1500, 600);
+ creates.pollutionIndicator.setXAxisTypeDate();
+ creates.pollutionIndicator.setSpecialYAxis('高楼污染指数');
+ creates.pollutionIndicator.setLegend(true);
+ creates.pollutionIndicator.setTooltip('{point.y}');
+ creates.pollutionIndicator.setSeries('高楼', 0, null, null, '#B21523')
+ creates.pollutionIndicator.setSeries('超高楼', 0, null, null, '#000B6F')
+ creates.pollutionIndicator.setSeries('极高楼层', 0, null, null, '#853083')
+ creates.pollutionIndicator.init();
+ }
+
+ const drawPollutionIndicator = (result: CustomeArray) => {
+ if (result[0].time == null) return;
+ const data = prepareChartData(result);
+ creates.pollutionIndicator.updateSeries(0, data[0]);
+ creates.pollutionIndicator.updateSeries(1, data[1]);
+ creates.pollutionIndicator.updateSeries(2, data[2]);
+ options.loadingPollutionIndicatorStatus = false
+ }
+
+ const prepareChartData = (result) => {
+ if (result[0].data == null) {
+ let temp = []
+ for (let i = 0; i < 72; i++) {
+ temp.push(NaN);
+ }
+ result[0].data = [temp];
+ }
+ let prepareData = []
+ let startTimeMoment = moment(result[0].time, 'M_D_H').add(8, 'h')
+ result[0].data.forEach(item => {
+ let data = []
+ for (let i = 0, len = item.length; i < len; i++) {
+ data.push([startTimeMoment.clone().add(1 * i, 'h').valueOf(), item[i]])
+ }
+ prepareData.push(data)
+ })
+ return prepareData;
+ }
+
+ const reloadChartsRecognition = (element: string, callback: any) => {
+ options.loadingPollutionIndicatorStatus = true
+ let result = new CustomeArray(callback);
+ let time = moment(options.date);
+ reloadPollutionIndicator(time.format('M_D_H'), element, result);
+ }
+
+ const reloadPollutionIndicator = (time: string, elementCode, result: CustomeArray) => {
+ let params = prepareApiParams(time, elementCode)
+ get('/njqxj/lmlidar', params, ConstantRamanLidar.baseUrl).then((response: any) => {
+ if (response.state != 0) {
+ setChartsRecognitionResult(time, response.message, null, result);
+ return;
+ }
+ setChartsRecognitionResult(time, response.message, response.data, result);
+ }).catch(error => {
+ setChartsRecognitionResult(time, error.message, null, result);
+ })
+ }
+
+ const prepareApiParams = (time, elementCode) => {
+ return {
+ var: elementCode,
+ locate: 'nj',
+ date: moment(time,'MM_DD_hh').format('M_D'),
+ }
+ }
+
+ const setChartsRecognitionResult = (time: string, message: string, data: any, result: CustomeArray) => {
+ result.push({
+ time: time,
+ message: message,
+ data: data == null ? null : JSON.parse(data)
+ })
+ }
+
+ const initTimeLineDay = () => {
+ options.times = [];
+ options.currentTime = moment(options.date).format('YYYY-MM-DD');
+ let now = moment(options.date).add(1, 'd');
+ let day = new Date(now.year(), now.month() + 1, 0);
+ for (let i = 0; i < 24; i++) {
+ options.times.push({
+ day: now.add(-1, 'd').format('DD'),
+ month: now.format('MM'),
+ date: now.format('YYYY-MM-DD'),
+ })
+ }
+ options.times.reverse();
+ options.index = options.times.length - 1;
+ }
+
+ const onChangeDayClick = (time, index) => {
+ options.currentTime = time.date
+ options.date = moment(time.date).format('YYYY-MM-DD');
+ reloadChartsRecognition('hbpi', drawPollutionIndicator)
+ options.index = index;
+ }
+
+ const onPrevDayTimeClick = () => {
+ options.date = moment(options.date).add(-1, 'day').format('YYYY-MM-DD');
+ initTimeLineDay()
+ reloadChartsRecognition('hbpi', drawPollutionIndicator)
+ }
+
+ const onNextDayTimeClick = () => {
+ options.date = moment(options.date).add(1, 'day').format('YYYY-MM-DD');
+ initTimeLineDay()
+ reloadChartsRecognition('hbpi', drawPollutionIndicator)
+ }
+
+ const onChange = () => {
+ initTimeLineDay();
+ reloadChartsRecognition('hbpi', drawPollutionIndicator)
+ }
+
return {
...toRefs(options),
onIndicatorClick,
onProductClick,
- onSaveClick
+ onSaveClick,
+ onChangeDayClick,
+ onPrevDayTimeClick,
+ onNextDayTimeClick,
+ onChange
}
}
}
@@ -284,6 +453,25 @@ import { post } from '../uilts/axios';
}
}
}
+ .raman-picture-container {
+ margin: 0 auto;
+ .picture {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ .toolbar {
+ //padding: 0.15rem 0;
+ padding-bottom: 7px;
+ margin: -12px 0.25rem 0px;
+ .times {
+ padding-bottom: 0;
+ }
+ :deep(.date-picker), .control-btn {
+ margin-top: 12px;
+ }
+
+ }
}
}
diff --git a/04.系统编码/Frontend/src/components/Login.vue b/04.系统编码/Frontend/src/components/Login.vue
index afaa4b2..729afab 100644
--- a/04.系统编码/Frontend/src/components/Login.vue
+++ b/04.系统编码/Frontend/src/components/Login.vue
@@ -93,7 +93,7 @@ export default {