mirror of
https://gitee.com/js-yhsec/energy_storage.git
synced 2026-05-27 18:59:26 +08:00
投运时间,系统总览刷新,图表警告处理等
This commit is contained in:
1
web/components.d.ts
vendored
1
web/components.d.ts
vendored
@@ -49,7 +49,6 @@ declare module 'vue' {
|
|||||||
Haikang: typeof import('./src/components/monitor/haikang.vue')['default']
|
Haikang: typeof import('./src/components/monitor/haikang.vue')['default']
|
||||||
LockOutlined: typeof import('@ant-design/icons-vue')['LockOutlined']
|
LockOutlined: typeof import('@ant-design/icons-vue')['LockOutlined']
|
||||||
Map: typeof import('./src/components/Home/Map.vue')['default']
|
Map: typeof import('./src/components/Home/Map.vue')['default']
|
||||||
Map_tianditu: typeof import('./src/components/Home/Map_tianditu.vue')['default']
|
|
||||||
Modal: typeof import('./src/components/Home/Modal.vue')['default']
|
Modal: typeof import('./src/components/Home/Modal.vue')['default']
|
||||||
OnLine: typeof import('./src/components/Home/onLine.vue')['default']
|
OnLine: typeof import('./src/components/Home/onLine.vue')['default']
|
||||||
OperateCom: typeof import('./src/components/OperateCom.vue')['default']
|
OperateCom: typeof import('./src/components/OperateCom.vue')['default']
|
||||||
|
|||||||
@@ -671,6 +671,14 @@ export const stationOptions = [
|
|||||||
{
|
{
|
||||||
// 0:未启用,1:启用
|
// 0:未启用,1:启用
|
||||||
|
|
||||||
|
label: '投运时间',
|
||||||
|
value: [],
|
||||||
|
key: 'operation_date',
|
||||||
|
type: 'date-picker'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
// 0:未启用,1:启用
|
||||||
|
|
||||||
label: '场站运行模式',
|
label: '场站运行模式',
|
||||||
value: undefined,
|
value: undefined,
|
||||||
key: 'work_mode',
|
key: 'work_mode',
|
||||||
|
|||||||
@@ -5,7 +5,8 @@
|
|||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
|
||||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
|
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
|
||||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
<!-- <title><%= htmlWebpackPlugin.options.title %></title> -->
|
||||||
|
<title>能源站监控与运行管理系统</title>
|
||||||
|
|
||||||
<script type="text/javascript" src="<%= BASE_URL %>codebase/jsPlugin/jquery.min.js"></script>
|
<script type="text/javascript" src="<%= BASE_URL %>codebase/jsPlugin/jquery.min.js"></script>
|
||||||
<script type="text/javascript" src="<%= BASE_URL %>codebase/encryption/AES.js"></script>
|
<script type="text/javascript" src="<%= BASE_URL %>codebase/encryption/AES.js"></script>
|
||||||
|
|||||||
@@ -86,7 +86,7 @@
|
|||||||
v-model:value="propsInfo.ruleForm.value[item.key]"
|
v-model:value="propsInfo.ruleForm.value[item.key]"
|
||||||
:placeholder="'请输入' + item.label"
|
:placeholder="'请输入' + item.label"
|
||||||
:disabled="props.disabled"
|
:disabled="props.disabled"
|
||||||
value-format="YYYY-MM-DD HH:mm:ss"
|
value-format="YYYY-MM-DD"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<a-date-picker
|
<a-date-picker
|
||||||
|
|||||||
@@ -1,352 +0,0 @@
|
|||||||
<!-- eslint-disable no-undef -->
|
|
||||||
<template>
|
|
||||||
|
|
||||||
<div id="map" ref="mapContent">
|
|
||||||
|
|
||||||
<!-- <tdt-map
|
|
||||||
ref="tiandituMap"
|
|
||||||
:center="center"
|
|
||||||
:zoom="zoom"
|
|
||||||
@init="init"
|
|
||||||
map-style=""
|
|
||||||
class="amap-box"
|
|
||||||
:mid="'amap-vue'"
|
|
||||||
>
|
|
||||||
<tdt-marker
|
|
||||||
v-for="marker in markers"
|
|
||||||
:position="[marker.lng, marker.lat]"
|
|
||||||
:key="marker.id"
|
|
||||||
:icon="marker.iconMap"
|
|
||||||
style="width: 20px; height: 20px"
|
|
||||||
@click="clickArrayMarker(marker)"
|
|
||||||
:title="marker.name"
|
|
||||||
>
|
|
||||||
</tdt-marker>
|
|
||||||
</tdt-map> -->
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
// import { loadTMap } from '../../utils/loadTMap'
|
|
||||||
import { useApiLoader, TdtMap } from 'vue-tianditu'
|
|
||||||
import { mapState } from 'vuex'
|
|
||||||
import { getReq, postReq } from '@/request/api'
|
|
||||||
import { message, Modal } from 'ant-design-vue'
|
|
||||||
// import { getSysConfig } from '@/utils/index.js'
|
|
||||||
import { gcj02ToWgs84 } from '../../utils/gcj02ToWgs84.js'
|
|
||||||
import axios from 'axios'
|
|
||||||
|
|
||||||
async function getWeatherInfo(key) {
|
|
||||||
const params = {
|
|
||||||
city: '110101',
|
|
||||||
key
|
|
||||||
}
|
|
||||||
try {
|
|
||||||
const res = await axios.get('https://restapi.amap.com/v3/weather/weatherInfo', { params })
|
|
||||||
return true
|
|
||||||
} catch (error) {
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'Map',
|
|
||||||
components: { },
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
propsInfo: {
|
|
||||||
cabId: '',
|
|
||||||
stationId: '',
|
|
||||||
station_name: '场站111'
|
|
||||||
},
|
|
||||||
showCtrModal: false,
|
|
||||||
mapStyle: {
|
|
||||||
version: '4.0',
|
|
||||||
style: 'black'
|
|
||||||
},
|
|
||||||
zoom: 16, // 区
|
|
||||||
map: null,
|
|
||||||
center: [],
|
|
||||||
markers: []
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
// ...mapState(['theme'])
|
|
||||||
},
|
|
||||||
|
|
||||||
async mounted() {
|
|
||||||
// this.initMap()
|
|
||||||
// this.getMarkList()
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
locateToPlace(option, lng, lat) {
|
|
||||||
console.log(option, '1111111111111')
|
|
||||||
// 清除现有标记
|
|
||||||
this.clearMarkers()
|
|
||||||
|
|
||||||
const lnglat = new T.LngLat(lng, lat)
|
|
||||||
// 移动地图中心
|
|
||||||
this.map.setZoom(16)
|
|
||||||
this.map.panTo(lnglat)
|
|
||||||
// 添加标记
|
|
||||||
const marker = new T.Marker(lnglat)
|
|
||||||
this.markers = [option]
|
|
||||||
// 可选:添加信息窗口
|
|
||||||
const infoWin = new T.InfoWindow()
|
|
||||||
infoWin.setContent(option.name)
|
|
||||||
marker.addEventListener('click', () => {
|
|
||||||
marker.openInfoWindow(infoWin)
|
|
||||||
})
|
|
||||||
const label = new T.Label({
|
|
||||||
text: option.name,
|
|
||||||
position: lnglat
|
|
||||||
})
|
|
||||||
label.setOffset(new T.Point(0, -10)) // 向上偏移20像素
|
|
||||||
|
|
||||||
this.map.addOverLay(label)
|
|
||||||
this.labels = [label]
|
|
||||||
},
|
|
||||||
|
|
||||||
// 清除所有标记
|
|
||||||
clearMarkers() {
|
|
||||||
if (this.markers && this.markers.length) {
|
|
||||||
this.markers.forEach((marker) => {
|
|
||||||
this.map.removeOverLay(marker)
|
|
||||||
})
|
|
||||||
this.markers = []
|
|
||||||
}
|
|
||||||
// 如果使用了 Label,也需要清除
|
|
||||||
if (this.labels && this.labels.length) {
|
|
||||||
this.labels.forEach((label) => {
|
|
||||||
this.map.removeOverLay(label)
|
|
||||||
})
|
|
||||||
this.labels = []
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
async initMap() {
|
|
||||||
// try {
|
|
||||||
// const [mapKey, center] = await Promise.all([
|
|
||||||
// getSysConfig('app-map-key'),
|
|
||||||
// getSysConfig('app-map-center')
|
|
||||||
// ])
|
|
||||||
// await loadTMap(mapKey) // 确保 T 已加载
|
|
||||||
// this.center = gcj02ToWgs84(JSON.parse(center).lng, JSON.parse(center).lat)
|
|
||||||
// } catch (err) {
|
|
||||||
// console.error('天地图加载失败:', err)
|
|
||||||
// }
|
|
||||||
},
|
|
||||||
|
|
||||||
cabClick(item) {
|
|
||||||
this.getJzqInfo(item.id, item.name)
|
|
||||||
this.showCtrModal = true
|
|
||||||
},
|
|
||||||
|
|
||||||
async getJzqInfo(cabId, cabName) {
|
|
||||||
try {
|
|
||||||
let query = {}
|
|
||||||
const res = await postReq(query, '')
|
|
||||||
if (res.code == 200) {
|
|
||||||
this.treeInfo = res.data.records
|
|
||||||
this.propsInfo = {}
|
|
||||||
} else {
|
|
||||||
throw res
|
|
||||||
}
|
|
||||||
} catch (err) {
|
|
||||||
void 0; // 明确表示无操作
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
// 请求地图点:配电房
|
|
||||||
async getMarkList() {
|
|
||||||
try {
|
|
||||||
let query = {
|
|
||||||
startTime: '',
|
|
||||||
endTime: '',
|
|
||||||
sortType: 0,
|
|
||||||
pageSize: 100000,
|
|
||||||
pageNumber: 1,
|
|
||||||
treeIds: [],
|
|
||||||
type: [1]
|
|
||||||
}
|
|
||||||
const res = await postReq(query, '/group/getGroupPages')
|
|
||||||
if (res.code == 200) {
|
|
||||||
this.markers = res.data.records.map((item) => {
|
|
||||||
let wgs = item.lng && item.lat ? gcj02ToWgs84(item.lng, item.lat) : [null, null]
|
|
||||||
return {
|
|
||||||
...item,
|
|
||||||
lng: wgs[0],
|
|
||||||
lat: wgs[1],
|
|
||||||
iconMap:
|
|
||||||
item.name.search('箱式变') !== -1
|
|
||||||
? require('../../assets/home/homeIcon1.png')
|
|
||||||
: require('../../assets/home/homeIcon.png')
|
|
||||||
}
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
this.markers = []
|
|
||||||
throw res
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
void 0; // 明确表示无操作
|
|
||||||
}
|
|
||||||
},
|
|
||||||
init(map) {
|
|
||||||
this.map = map
|
|
||||||
this.getMarkList()
|
|
||||||
},
|
|
||||||
|
|
||||||
closeMapWindow() {
|
|
||||||
this.currentMarker = {}
|
|
||||||
this.showCtrModal = false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
#map {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
|
|
||||||
:deep(.tdt-marker-icon) {
|
|
||||||
width: 21px !important;
|
|
||||||
height: 18px !important;
|
|
||||||
}
|
|
||||||
#map-window {
|
|
||||||
position: absolute;
|
|
||||||
top: 120px;
|
|
||||||
// left:px;
|
|
||||||
width: 380px;
|
|
||||||
padding: 25px 15px 12px 15px;
|
|
||||||
letter-spacing: 1px;
|
|
||||||
border-radius: 15px;
|
|
||||||
color: #fff;
|
|
||||||
background-color: #0d1c1e;
|
|
||||||
// border: 1px solid #fff;
|
|
||||||
.head {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
color: #fff;
|
|
||||||
.name {
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 16px;
|
|
||||||
width: 150px;
|
|
||||||
overflow: hidden;
|
|
||||||
white-space: nowrap;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
}
|
|
||||||
.btn {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
.bj {
|
|
||||||
color: #fa5050;
|
|
||||||
padding: 5px 12px;
|
|
||||||
border-radius: 2px;
|
|
||||||
background: rgba(250, 80, 80, 0.1);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.jk {
|
|
||||||
margin-left: 10px;
|
|
||||||
color: #03bf8a;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.item {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
padding-bottom: 6px;
|
|
||||||
margin-top: 15px;
|
|
||||||
border-bottom: 1px solid #fff;
|
|
||||||
.num {
|
|
||||||
color: #03bf8a;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.content {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 1fr 1fr;
|
|
||||||
grid-column-gap: 30px;
|
|
||||||
width: 100%;
|
|
||||||
margin-top: 10px;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
.footer {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
font-size: 14px;
|
|
||||||
.item {
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
.btn {
|
|
||||||
color: #03bf8a;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.icon-a-fenzu92 {
|
|
||||||
transform: rotate(-90deg);
|
|
||||||
margin-left: 6px;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-guanbi {
|
|
||||||
font-size: 18px;
|
|
||||||
position: absolute;
|
|
||||||
right: 10px;
|
|
||||||
top: 24px;
|
|
||||||
color: #fff;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.amap-info-close) {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.ant-modal-root .ant-modal-mask) {
|
|
||||||
background-color: #000 !important;
|
|
||||||
}
|
|
||||||
:deep(.modal.ant-modal) {
|
|
||||||
width: 80% !important;
|
|
||||||
height: 80% !important;
|
|
||||||
min-width: 1300px !important;
|
|
||||||
border: none;
|
|
||||||
padding: 20px;
|
|
||||||
background-image: url('../../assets/home/modal-bg.png');
|
|
||||||
background-size: 100% 100%;
|
|
||||||
background-position: center;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
& > div {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.ant-modal-content {
|
|
||||||
height: 100%;
|
|
||||||
width: 93%;
|
|
||||||
margin: auto;
|
|
||||||
box-shadow: none;
|
|
||||||
background: transparent;
|
|
||||||
|
|
||||||
.ant-modal-body {
|
|
||||||
height: 100%;
|
|
||||||
color: #fff;
|
|
||||||
padding: 10px;
|
|
||||||
div > span {
|
|
||||||
margin-right: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.modal-content {
|
|
||||||
height: 100%;
|
|
||||||
|
|
||||||
min-height: 700px;
|
|
||||||
padding-top: 30px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@@ -11,10 +11,10 @@
|
|||||||
:is="item.componentId"
|
:is="item.componentId"
|
||||||
:props-info="modalInfo[item.infoKey]"
|
:props-info="modalInfo[item.infoKey]"
|
||||||
:props-total="
|
:props-total="
|
||||||
['prefab', 'dataTotal'].includes(item.infoKey)
|
['prefab', 'envTotal'].includes(item.infoKey)
|
||||||
? item.infoKey == 'prefab'
|
? item.infoKey == 'prefab'
|
||||||
? modalInfo.prefabTotal
|
? modalInfo.prefabTotal
|
||||||
: modalInfo.dataTotal
|
: modalInfo.envInfoTotal
|
||||||
: modalInfo.allTotal
|
: modalInfo.allTotal
|
||||||
"
|
"
|
||||||
></component>
|
></component>
|
||||||
@@ -103,7 +103,7 @@ export default {
|
|||||||
title: '环境信息',
|
title: '环境信息',
|
||||||
class: 'envInfo',
|
class: 'envInfo',
|
||||||
componentId:markRaw( EnvInfo),
|
componentId:markRaw( EnvInfo),
|
||||||
infoKey: 'dataTotal'
|
infoKey: 'envTotal'
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
sysName: '',
|
sysName: '',
|
||||||
@@ -163,12 +163,12 @@ export default {
|
|||||||
}
|
}
|
||||||
const res = await getReq('/queryStationData', query)
|
const res = await getReq('/queryStationData', query)
|
||||||
if (res.errcode === 0) {
|
if (res.errcode === 0) {
|
||||||
this.modalInfo.dataTotal = res.data
|
this.modalInfo.envInfoTotal = res.data
|
||||||
} else {
|
} else {
|
||||||
throw res
|
throw res
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
this.modalInfo.dataTotal = {}
|
this.modalInfo.envInfoTotal = {}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 查询场站信息
|
// 查询场站信息
|
||||||
|
|||||||
@@ -122,7 +122,7 @@ export default {
|
|||||||
left: '3%',
|
left: '3%',
|
||||||
right: '4%',
|
right: '4%',
|
||||||
bottom: '5%',
|
bottom: '5%',
|
||||||
containLabel: true
|
// containLabel: true
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
|
|||||||
@@ -30,26 +30,6 @@ export default {
|
|||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
coolingList: [
|
|
||||||
{
|
|
||||||
label: '关机',
|
|
||||||
value: '0'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '开机',
|
|
||||||
value: '1'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
aircList: [
|
|
||||||
{
|
|
||||||
label: '关机',
|
|
||||||
value: '0'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '开机',
|
|
||||||
value: '1'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
list: [
|
list: [
|
||||||
{
|
{
|
||||||
key: 'coolingStatus',
|
key: 'coolingStatus',
|
||||||
@@ -96,14 +76,8 @@ export default {
|
|||||||
handler(newVal, oldVal) {
|
handler(newVal, oldVal) {
|
||||||
if (newVal !== oldVal) {
|
if (newVal !== oldVal) {
|
||||||
this.list.forEach((item) => {
|
this.list.forEach((item) => {
|
||||||
if (item.key == 'coolingStatus') {
|
if ( ['coolingStatus','aircStatus'].includes(item.key) ) {
|
||||||
item.value = this.coolingList.find(
|
item.value =['关机','开机'][this.propsTotal[item.key]]
|
||||||
(e) => e.value == this.propsTotal[item.key]
|
|
||||||
).label ||'关机'
|
|
||||||
} else if (item.key == 'aircStatus') {
|
|
||||||
item.value = this.aircList.map(
|
|
||||||
(e) => e.value == this.propsTotal[item.key]
|
|
||||||
)[0].label||'关机'
|
|
||||||
} else {
|
} else {
|
||||||
item.value = this.propsTotal[item.key]
|
item.value = this.propsTotal[item.key]
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -130,10 +130,11 @@ export default {
|
|||||||
this.curStatus=['正常','故障'][this.propsTotal.status]
|
this.curStatus=['正常','故障'][this.propsTotal.status]
|
||||||
this.list.forEach((item) => {
|
this.list.forEach((item) => {
|
||||||
if(item.key=='work_mode'){
|
if(item.key=='work_mode'){
|
||||||
item.value =item.list.map((item)=>this.propsTotal[item.key]==item.value)[0].label
|
item.value = ['手动','峰谷套利','增网配容','应急供电','并网保电','自定时段'][this.propsTotal[item.key]]
|
||||||
|
// console.log(item.list.map((item)=>this.propsTotal[item.key]==item.value)[0].label,"145",item.list.map((item)=>this.propsTotal[item.key]==item.value))
|
||||||
|
// item.value =item.list.map((item)=>==item.value)[0].label
|
||||||
}else {
|
}else {
|
||||||
item.value = this.propsTotal[item.key]
|
item.value = this.propsTotal[item.key]
|
||||||
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -134,7 +134,7 @@ export default {
|
|||||||
left: '3%',
|
left: '3%',
|
||||||
right: '4%',
|
right: '4%',
|
||||||
bottom: '5%',
|
bottom: '5%',
|
||||||
containLabel: true
|
// containLabel: true
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
|
|||||||
@@ -115,7 +115,7 @@ export default {
|
|||||||
left: '3%',
|
left: '3%',
|
||||||
right: '4%',
|
right: '4%',
|
||||||
bottom: '5%',
|
bottom: '5%',
|
||||||
containLabel: true
|
// containLabel: true
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
|
|||||||
@@ -145,7 +145,7 @@ export default {
|
|||||||
left: '3%',
|
left: '3%',
|
||||||
right: '4%',
|
right: '4%',
|
||||||
bottom: '5%',
|
bottom: '5%',
|
||||||
containLabel: true
|
// containLabel: true
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
|
|||||||
@@ -73,7 +73,7 @@ export default {
|
|||||||
left: '3%',
|
left: '3%',
|
||||||
right: '3%',
|
right: '3%',
|
||||||
bottom: '15%',
|
bottom: '15%',
|
||||||
containLabel: true
|
// containLabel: true
|
||||||
},
|
},
|
||||||
dataZoom: [
|
dataZoom: [
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -135,7 +135,7 @@ export default {
|
|||||||
left: '3%',
|
left: '3%',
|
||||||
right: '3%',
|
right: '3%',
|
||||||
bottom: '5%',
|
bottom: '5%',
|
||||||
containLabel: true,
|
// containLabel: true,
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
@@ -270,7 +270,7 @@ export default {
|
|||||||
|
|
||||||
|
|
||||||
handlePagesizeChange(pageOption) {
|
handlePagesizeChange(pageOption) {
|
||||||
this.$emit('pagesizeChange_energy', pageOption)
|
this.$emit('pagesizeChange', pageOption)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -31,6 +31,11 @@ $page-border: #cad2dd;
|
|||||||
.ant-switch .ant-switch-handle::before {
|
.ant-switch .ant-switch-handle::before {
|
||||||
background-color: #0a1b2f !important;
|
background-color: #0a1b2f !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ant-picker .ant-picker-clear {
|
||||||
|
background: none;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
.ant-select,
|
.ant-select,
|
||||||
.ant-cascader {
|
.ant-cascader {
|
||||||
.ant-select-selector {
|
.ant-select-selector {
|
||||||
|
|||||||
@@ -48,7 +48,7 @@
|
|||||||
:page-option="tableList[activeKey].pageOption"
|
:page-option="tableList[activeKey].pageOption"
|
||||||
:table-info="tableList[activeKey].tableInfo"
|
:table-info="tableList[activeKey].tableInfo"
|
||||||
:table-data="tableList[activeKey].tableData"
|
:table-data="tableList[activeKey].tableData"
|
||||||
@pagesizeChange="pagesizeChange()"
|
@pagesizeChange="pagesizeChange"
|
||||||
></energyEchart>
|
></energyEchart>
|
||||||
</a-spin>
|
</a-spin>
|
||||||
</div>
|
</div>
|
||||||
@@ -60,6 +60,7 @@ import energyEchart from '@/components/statisticalAnalysis/energyEchart.vue'
|
|||||||
import searchBox from '@/components/SearchBox.vue'
|
import searchBox from '@/components/SearchBox.vue'
|
||||||
import { postReq, getReq } from '@/request/api'
|
import { postReq, getReq } from '@/request/api'
|
||||||
import { getRunDays, getDateDaysAgo } from '@/utils/dealWithData'
|
import { getRunDays, getDateDaysAgo } from '@/utils/dealWithData'
|
||||||
|
import { contentQuotesLinter } from 'ant-design-vue/es/_util/cssinjs/linters'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'StatisicalAnView',
|
name: 'StatisicalAnView',
|
||||||
@@ -509,7 +510,7 @@ export default {
|
|||||||
this.renderKey += 1
|
this.renderKey += 1
|
||||||
},
|
},
|
||||||
resetDataForInactiveKey() {
|
resetDataForInactiveKey() {
|
||||||
// 重置非当前激活页面的数据,减少内存占用
|
// 重置非当前激活页面的数据
|
||||||
Object.keys(this.echartsInfo).forEach((key) => {
|
Object.keys(this.echartsInfo).forEach((key) => {
|
||||||
if (key != this.activeKey) {
|
if (key != this.activeKey) {
|
||||||
this.echartsInfo[key].chartData = {}
|
this.echartsInfo[key].chartData = {}
|
||||||
@@ -519,7 +520,11 @@ export default {
|
|||||||
|
|
||||||
Object.keys(this.tableList).forEach((key) => {
|
Object.keys(this.tableList).forEach((key) => {
|
||||||
if (key != this.activeKey) {
|
if (key != this.activeKey) {
|
||||||
this.echartsInfo[key].tableData = {}
|
this.tableList[key].tableData = []
|
||||||
|
this.tableList[key].pageOption={
|
||||||
|
page: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
count: 1 }
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
@@ -556,21 +561,25 @@ export default {
|
|||||||
...this.paramsDate,
|
...this.paramsDate,
|
||||||
category: this.activeKey,
|
category: this.activeKey,
|
||||||
page_size: currentInfo.pageOption.pageSize,
|
page_size: currentInfo.pageOption.pageSize,
|
||||||
pageNumber: currentInfo.pageOption.page
|
page: currentInfo.pageOption.page
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const res = await getReq('/queryStatDetailList', query)
|
const res = await getReq('/queryStatDetailList', query)
|
||||||
if (res.errcode === 0) {
|
if (res.errcode === 0) {
|
||||||
this.tableList[this.activeKey].tableData = res.data.list || res.data
|
this.tableList[this.activeKey].tableData = res.data.list || res.data
|
||||||
this.tableList[this.activeKey].pageOption.count = res.data.count || 0
|
this.tableList[this.activeKey].pageOption.count = res.count || 0
|
||||||
|
this.tableList[this.activeKey].pageOption.page = res.page || 0
|
||||||
|
this.tableList[this.activeKey].pageOption.pageSize = res.page_size || 0
|
||||||
this.loading.table = false
|
this.loading.table = false
|
||||||
} else {
|
} else {
|
||||||
throw res
|
throw res
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
this.tableList[this.activeKey].tableData = []
|
this.tableList[this.activeKey].tableData = []
|
||||||
this.tableList[this.activeKey].pageOption.count = 0
|
this.tableList[this.activeKey].pageOption.count = 0
|
||||||
|
this.tableList[this.activeKey].pageOption.page = 0
|
||||||
|
this.tableList[this.activeKey].pageOption.pageSize = 0
|
||||||
this.loading.table = false
|
this.loading.table = false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@@ -579,7 +588,7 @@ export default {
|
|||||||
if (this.activeKey) {
|
if (this.activeKey) {
|
||||||
this.getStatCharts() // 定时获取最新实时数据
|
this.getStatCharts() // 定时获取最新实时数据
|
||||||
}
|
}
|
||||||
}, 10000) // 30秒刷新一次
|
}, 10000)
|
||||||
},
|
},
|
||||||
|
|
||||||
async getStationList() {
|
async getStationList() {
|
||||||
@@ -601,7 +610,6 @@ export default {
|
|||||||
if (!this.stationId) {
|
if (!this.stationId) {
|
||||||
this.stationId = this.stationList[0].value
|
this.stationId = this.stationList[0].value
|
||||||
}
|
}
|
||||||
//V I P
|
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
const err = { tip: res.errmsg }
|
const err = { tip: res.errmsg }
|
||||||
@@ -619,7 +627,6 @@ export default {
|
|||||||
onSearch(data) {
|
onSearch(data) {
|
||||||
this.paramsDate.start_date = data.time ? data.time[0] : ''
|
this.paramsDate.start_date = data.time ? data.time[0] : ''
|
||||||
this.paramsDate.end_date = data.time ? data.time[1] : ''
|
this.paramsDate.end_date = data.time ? data.time[1] : ''
|
||||||
|
|
||||||
this.tableList[this.activeKey].pageOption.page = 1
|
this.tableList[this.activeKey].pageOption.page = 1
|
||||||
this.getStationList(), this.getEchartsListForActiveKey(), this.getTableListForActiveKey()
|
this.getStationList(), this.getEchartsListForActiveKey(), this.getTableListForActiveKey()
|
||||||
},
|
},
|
||||||
@@ -628,7 +635,6 @@ export default {
|
|||||||
},
|
},
|
||||||
|
|
||||||
async getStatCharts() {
|
async getStatCharts() {
|
||||||
const currentInfo = this.echartsInfo[this.activeKey]
|
|
||||||
const query = {
|
const query = {
|
||||||
dt: this.paramsDate.end_date,
|
dt: this.paramsDate.end_date,
|
||||||
station_id: this.stationId,
|
station_id: this.stationId,
|
||||||
@@ -638,16 +644,11 @@ export default {
|
|||||||
const res = await getReq('/queryStatCharts', query)
|
const res = await getReq('/queryStatCharts', query)
|
||||||
if (res.errcode === 0) {
|
if (res.errcode === 0) {
|
||||||
this.echartsInfo[this.activeKey].chartDatav = res.data
|
this.echartsInfo[this.activeKey].chartDatav = res.data
|
||||||
// x轴0点到24点
|
|
||||||
} else {
|
} else {
|
||||||
throw res
|
throw res
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
this.echartsInfo[this.activeKey].chartDatav = {
|
this.echartsInfo[this.activeKey].chartDatav = {}
|
||||||
V: [100.0, 100.0, 100.0], // 电压曲线
|
|
||||||
I: [10.0, 10.0, 10.0], // 电流曲线
|
|
||||||
P: [1000.0, 1000.0, 1000.0] // 功率曲线
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -54,6 +54,7 @@ export default {
|
|||||||
components: { Map },
|
components: { Map },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
refreshInterval:null,
|
||||||
showFlag: false,
|
showFlag: false,
|
||||||
stationId: null,
|
stationId: null,
|
||||||
deviceInfo: {},
|
deviceInfo: {},
|
||||||
@@ -109,31 +110,44 @@ export default {
|
|||||||
return this.list.filter((_, index) => index % 2 !== 0).slice(0, 3) // 右列取前3个奇数索引
|
return this.list.filter((_, index) => index % 2 !== 0).slice(0, 3) // 右列取前3个奇数索引
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
beforeUnmount() {
|
||||||
|
if(this.refreshInterval){
|
||||||
|
clearInterval(this.refreshInterval)
|
||||||
|
this.refreshInterval=null
|
||||||
|
}
|
||||||
|
},
|
||||||
async mounted() {
|
async mounted() {
|
||||||
await Promise.all([
|
await this.loadAllData()
|
||||||
this.getOnLineList(),
|
this.refreshInterval=setInterval(async()=>{
|
||||||
this.getStatTotalList(),
|
await this.loadAllData()
|
||||||
this.getOperTotalList(),
|
},30000) //30s刷新一次
|
||||||
this.getStatDayList(1),
|
|
||||||
this.getStatDayList(2),
|
|
||||||
this.getStatDayList(3)
|
|
||||||
]).then((r) => {
|
|
||||||
if (
|
|
||||||
this.deviceInfo.energy &&
|
|
||||||
this.deviceInfo.charge &&
|
|
||||||
this.deviceInfo.pv
|
|
||||||
) {
|
|
||||||
const newArr = this.mergedArray(
|
|
||||||
this.deviceInfo.energy,
|
|
||||||
this.deviceInfo.charge,
|
|
||||||
this.deviceInfo.pv
|
|
||||||
)
|
|
||||||
this.deviceInfo.alarm = newArr
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
|
async loadAllData(){
|
||||||
|
await Promise.all([
|
||||||
|
this.getOnLineList(),
|
||||||
|
this.getStatTotalList(),
|
||||||
|
this.getOperTotalList(),
|
||||||
|
this.getStatDayList(1),
|
||||||
|
this.getStatDayList(2),
|
||||||
|
this.getStatDayList(3)
|
||||||
|
]).then((r) => {
|
||||||
|
if (
|
||||||
|
this.deviceInfo.energy &&
|
||||||
|
this.deviceInfo.charge &&
|
||||||
|
this.deviceInfo.pv
|
||||||
|
) {
|
||||||
|
const newArr = this.mergedArray(
|
||||||
|
this.deviceInfo.energy,
|
||||||
|
this.deviceInfo.charge,
|
||||||
|
this.deviceInfo.pv
|
||||||
|
)
|
||||||
|
this.deviceInfo.alarm = newArr
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
getCurrentStation(e) {
|
getCurrentStation(e) {
|
||||||
this.stationId = e
|
this.stationId = e
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -238,19 +238,16 @@ export default {
|
|||||||
stationOptions.forEach((e, index) => {
|
stationOptions.forEach((e, index) => {
|
||||||
e.list.forEach((i) => {
|
e.list.forEach((i) => {
|
||||||
if (i.key == 'work_mode') {
|
if (i.key == 'work_mode') {
|
||||||
console.log(row[i.key], 'rrrrrrrrr')
|
|
||||||
switch (row[i.key]) {
|
switch (row[i.key]) {
|
||||||
case '1':
|
case '1':
|
||||||
case '5':
|
case '5':
|
||||||
e.ruleForm[i.key] =row[i.key]
|
e.ruleForm[i.key] =row[i.key]
|
||||||
// this.$refs.EditCom.workModeIdSelect = row[i.key]
|
|
||||||
e.ruleForm['policy_id'] = row ? row['policy_id'] : ''
|
e.ruleForm['policy_id'] = row ? row['policy_id'] : ''
|
||||||
stationOptions[0].list[stationOptions[0].list.length - 1].type = 'select'
|
stationOptions[0].list[stationOptions[0].list.length - 1].type = 'select'
|
||||||
break
|
break
|
||||||
default:
|
default:
|
||||||
e.ruleForm[i.key] =row[i.key]
|
e.ruleForm[i.key] =row[i.key]
|
||||||
|
|
||||||
console.log('1245')
|
|
||||||
stationOptions[0].list[stationOptions[0].list.length - 1].type = 'unshow'
|
stationOptions[0].list[stationOptions[0].list.length - 1].type = 'unshow'
|
||||||
|
|
||||||
break
|
break
|
||||||
|
|||||||
Reference in New Issue
Block a user