武乡大屏改造基本完成
This commit is contained in:
parent
7ecd1ac2ae
commit
a7c1decc3e
|
|
@ -138,3 +138,40 @@ export function getMaintainLog(params) {
|
||||||
params
|
params
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* //监测预警数据
|
||||||
|
* stationCode=S_1 站点编号
|
||||||
|
* &deployId=1679816437477228546 设备ID
|
||||||
|
* &pageNo=1 页号
|
||||||
|
* &pageSize=10 页宽
|
||||||
|
* &yearStr=2026 年份
|
||||||
|
*
|
||||||
|
* 回执
|
||||||
|
* {
|
||||||
|
* "id": "2027671112451649538",
|
||||||
|
* "tenantId": "租户",
|
||||||
|
* "deployCode": "16111113",
|
||||||
|
* "deployId": "1679816437477228546",
|
||||||
|
* "alertTime": "告警时间",
|
||||||
|
* "itemCode":"检测项编号"
|
||||||
|
* "itemName": "钾离子",
|
||||||
|
* "deviceName": "设备名称",
|
||||||
|
* "fullDeviceName":"带站点名称的设备名字"
|
||||||
|
* "readStatus":"low=偏低,high=偏高",
|
||||||
|
* "survUnit":"单位"
|
||||||
|
* "survValue":"监测值"
|
||||||
|
* "nomalValue":"正常值范围"
|
||||||
|
* }
|
||||||
|
* @param params
|
||||||
|
* @returns {*}
|
||||||
|
*/
|
||||||
|
export function doGetAlertRecord(params) {
|
||||||
|
return requests({
|
||||||
|
url: '/appmana/bigScreen/alertRecord',
|
||||||
|
method: 'get',
|
||||||
|
headers: {},
|
||||||
|
params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -799,7 +799,7 @@ export default {
|
||||||
item: item
|
item: item
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
if (item.type == 'orient') {//监测站弹窗
|
if (item.type == 'orient' || item.type == 'livestock' || item.type == 'watershed') {//监测站弹窗
|
||||||
marker.on('click', e => {
|
marker.on('click', e => {
|
||||||
let indexnumb = e.target.getExtData().ids.slice(-1);
|
let indexnumb = e.target.getExtData().ids.slice(-1);
|
||||||
this.qcdtinfor = this.stationInfoList[indexnumb]
|
this.qcdtinfor = this.stationInfoList[indexnumb]
|
||||||
|
|
|
||||||
|
|
@ -345,23 +345,53 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
<div style="background: #0d4e62;height: 1px;width: 94%;margin: 0 auto;margin-top: 0.4vw;"></div>
|
||||||
|
<!-- <div>-->
|
||||||
|
<!-- <div class="in1con_lf_tit ">-->
|
||||||
|
<!-- <span class="in1con_lf_titshow">监测站维护日志</span>-->
|
||||||
|
<!-- <img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <div style="padding-left: 30px; margin-top: 26px; ">-->
|
||||||
|
<!-- <el-timeline>-->
|
||||||
|
<!-- <el-timeline-item v-for="(activity, index) in maintainLogList" :key="index" :color="`#0e81f7`" :size="'normal'"-->
|
||||||
|
<!-- :placement="`top`">-->
|
||||||
|
<!-- <div class="maintainLog">-->
|
||||||
|
<!-- <div class="maintainLogContent"><span class="el-icon-mobile"></span> {{activity.maintainData1}}</div>-->
|
||||||
|
<!-- <div class="maintainLogPerson">维护人:{{activity.maintainPerson}}</div>-->
|
||||||
|
<!-- <div class="maintainLogTime"><span class="el-icon-s-custom"></span> {{activity.maintainPerson}} -->
|
||||||
|
<!-- <span class="el-icon-time"></span> {{activity.maintainTime}}</div>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- </el-timeline-item>-->
|
||||||
|
<!-- </el-timeline>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- </div>-->
|
||||||
<div>
|
<div>
|
||||||
<div class="in1con_lf_tit ">
|
<div class="in1con_lf_tit ">
|
||||||
<span class="in1con_lf_titshow">监测站维护日志</span>
|
<span class="in1con_lf_titshow">监测与预警</span>
|
||||||
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
<img src="@/assets/image/title_bg.png" class="in1con_lf_titimg" alt="">
|
||||||
</div>
|
</div>
|
||||||
<div style="padding-left: 30px; margin-top: 26px; ">
|
<div style=" margin-top: 26px; margin-bottom: 10px; ">
|
||||||
<el-timeline>
|
<el-timeline v-if="alertList.length > 0" style="margin-left: 30px;position: relative;top: -20px; overflow: hidden;height: 252px;">
|
||||||
<el-timeline-item v-for="(activity, index) in maintainLogList" :key="index" :color="`#0e81f7`" :size="'normal'"
|
<el-timeline-item v-for="(activity, index) in alertList" :key="index" :color="`#66a8f1`"
|
||||||
:placement="`top`">
|
:size="'normal'" :placement="`top`" style="top: 20px;" >
|
||||||
<div class="maintainLog">
|
<div class="maintainLog">
|
||||||
<div class="maintainLogContent"><span class="el-icon-mobile"></span> {{activity.maintainData1}}</div>
|
<div class="maintainLogContent">
|
||||||
<div class="maintainLogPerson">维护人:{{activity.maintainPerson}}</div>
|
<span class="el-icon-mobile"></span>
|
||||||
<div class="maintainLogTime"><span class="el-icon-s-custom"></span> {{activity.maintainPerson}}
|
<span>{{activity.itemName}}</span>
|
||||||
<span class="el-icon-time"></span> {{activity.maintainTime}}</div>
|
<span style="color: #f4d877;font-size: 20px;"> {{activity.survValue}}</span>
|
||||||
|
<span style="color: #f4d877;font-size: 12px;">{{activity.survUnit}} </span>
|
||||||
|
<!-- <span>标准值 {{activity.normalValue}}{{activity.survUnit}}</span>-->
|
||||||
|
<span :style="{color:activity.readStatus=='low'?'#66A8F1FF':activity.readStatus=='high'?'#ff676a':''}">({{activity.readStatus=='low'?'偏低':activity.readStatus=='high'?'偏高':'正常'}})</span>
|
||||||
|
</div>
|
||||||
|
<div class="maintainLogPerson"></div>
|
||||||
|
<div class="maintainLogTime">
|
||||||
|
<span class="el-icon-time"></span> {{activity.alertTime}}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-timeline-item>
|
</el-timeline-item>
|
||||||
</el-timeline>
|
</el-timeline>
|
||||||
|
<div v-if="alertList.length <= 0">
|
||||||
|
<div style="margin:60px auto; width: 100%;font-size: 40px;color: #edd792; text-align: center;">暂无预警数据</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -404,7 +434,15 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import ScaleBox from 'vue2-scale-box'
|
import ScaleBox from 'vue2-scale-box'
|
||||||
import {getStationDetail, getStationDisplay, getIndexSummry, survItemSummary, getMaintainLog, stationInfo} from '@/api';
|
import {
|
||||||
|
getStationDetail,
|
||||||
|
getStationDisplay,
|
||||||
|
getIndexSummry,
|
||||||
|
survItemSummary,
|
||||||
|
getMaintainLog,
|
||||||
|
stationInfo,
|
||||||
|
getAlertRecord, doGetAlertRecord
|
||||||
|
} from '@/api';
|
||||||
import vueSeamlessScroll from 'vue-seamless-scroll'
|
import vueSeamlessScroll from 'vue-seamless-scroll'
|
||||||
import hefentianqi from '@/pages/weather/weather.vue'
|
import hefentianqi from '@/pages/weather/weather.vue'
|
||||||
import SingleEchartDialog from "@/components/SingleEchartDialog.vue";
|
import SingleEchartDialog from "@/components/SingleEchartDialog.vue";
|
||||||
|
|
@ -461,6 +499,7 @@ export default {
|
||||||
}],
|
}],
|
||||||
echartObj: null,
|
echartObj: null,
|
||||||
animateObj: [],
|
animateObj: [],
|
||||||
|
alertList: [],
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
destroyed() {
|
destroyed() {
|
||||||
|
|
@ -488,7 +527,7 @@ export default {
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
doDestroyed(){
|
doDestroyed(){
|
||||||
//离开页面是销毁
|
//离开页面时销毁
|
||||||
Object.values(this.timer).map(item => {
|
Object.values(this.timer).map(item => {
|
||||||
if(item){
|
if(item){
|
||||||
clearTimeout(item);
|
clearTimeout(item);
|
||||||
|
|
@ -529,6 +568,7 @@ export default {
|
||||||
this.getNowTime();
|
this.getNowTime();
|
||||||
this.initMaintainLog();
|
this.initMaintainLog();
|
||||||
this.stationInfoApi();
|
this.stationInfoApi();
|
||||||
|
this.getAlertRecord();
|
||||||
},
|
},
|
||||||
initMaintainLog(){//巡检日志
|
initMaintainLog(){//巡检日志
|
||||||
getMaintainLog({stationCode: this.stationCode, pageSize: 3}).then(res => {
|
getMaintainLog({stationCode: this.stationCode, pageSize: 3}).then(res => {
|
||||||
|
|
@ -540,6 +580,31 @@ export default {
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
getAlertRecord(){
|
||||||
|
doGetAlertRecord({stationCode: this.stationCode, pageSize: 3}).then(res => {
|
||||||
|
console.warn('监测预警数据',res)
|
||||||
|
if (res.code === 200) {
|
||||||
|
if(res.result.records.length === 0 && this.stationDetail.latestData !== 0){
|
||||||
|
//itemName survValue survUnit normalValue survUnit readStatus alertTime
|
||||||
|
let tempData = [];
|
||||||
|
this.stationDetail.latestData.map(item => {
|
||||||
|
tempData.push({
|
||||||
|
itemName: item.name,
|
||||||
|
survValue: item.value,
|
||||||
|
survUnit: item.unit,
|
||||||
|
normalValue: item.value,
|
||||||
|
readStatus: 'normal',
|
||||||
|
alertTime: item.dataDateTime,
|
||||||
|
});
|
||||||
|
})
|
||||||
|
this.alertList = tempData;
|
||||||
|
} else {
|
||||||
|
this.alertList = res.result.records;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
changeDateType() {
|
changeDateType() {
|
||||||
// this.summryAllData = null;
|
// this.summryAllData = null;
|
||||||
this.initChartData();
|
this.initChartData();
|
||||||
|
|
@ -579,7 +644,6 @@ export default {
|
||||||
// 折线图数据
|
// 折线图数据
|
||||||
initEchartDom(index, times) {
|
initEchartDom(index, times) {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
console.warn('初始化echarts')
|
|
||||||
let domKey = `myChartDiv0`;
|
let domKey = `myChartDiv0`;
|
||||||
let divDom = document.getElementById(domKey);
|
let divDom = document.getElementById(domKey);
|
||||||
if (!divDom) {
|
if (!divDom) {
|
||||||
|
|
@ -594,7 +658,6 @@ export default {
|
||||||
}
|
}
|
||||||
this.echartObj = this.$echarts.init(divDom);
|
this.echartObj = this.$echarts.init(divDom);
|
||||||
let data = this.summryAllData[index];
|
let data = this.summryAllData[index];
|
||||||
console.warn('开始初始化echart:' )
|
|
||||||
let dataObj = [];
|
let dataObj = [];
|
||||||
let i = 0;
|
let i = 0;
|
||||||
let colors = [
|
let colors = [
|
||||||
|
|
@ -686,7 +749,6 @@ export default {
|
||||||
};
|
};
|
||||||
this.echartObj.setOption(optionLine);
|
this.echartObj.setOption(optionLine);
|
||||||
|
|
||||||
console.warn('初始化echarts结束')
|
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
zdinfor(){
|
zdinfor(){
|
||||||
|
|
@ -2517,7 +2579,7 @@ a:hover {
|
||||||
color: white;
|
color: white;
|
||||||
.maintainLogContent{
|
.maintainLogContent{
|
||||||
padding-left: 74px;
|
padding-left: 74px;
|
||||||
padding-top: 8px;
|
//padding-top: 8px;
|
||||||
color: #81b8e9;
|
color: #81b8e9;
|
||||||
width: 258px; /* 设置容器宽度 */
|
width: 258px; /* 设置容器宽度 */
|
||||||
overflow: hidden; /* 隐藏超出部分 */
|
overflow: hidden; /* 隐藏超出部分 */
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue