Merge branch 'master' of http://192.168.1.22:3000/Web/admin-sjzx
# Conflicts: # src/views/pqs/voltageSags/Region/components/echart.vue
This commit is contained in:
BIN
src/assets/logo/海南.png
Normal file
BIN
src/assets/logo/海南.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
BIN
src/assets/logo/灿能.png
Normal file
BIN
src/assets/logo/灿能.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/logo/电网.png
Normal file
BIN
src/assets/logo/电网.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 249 KiB |
BIN
src/assets/logo/电网1.png
Normal file
BIN
src/assets/logo/电网1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
@@ -1,246 +1,246 @@
|
|||||||
import { reactive } from 'vue'
|
import { reactive } from 'vue'
|
||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
import { STORE_CONFIG } from '@/stores/constant/cacheKey'
|
import { STORE_CONFIG } from '@/stores/constant/cacheKey'
|
||||||
import type { Layout } from '@/stores/interface'
|
import type { Layout } from '@/stores/interface'
|
||||||
|
|
||||||
export const useConfig = defineStore(
|
export const useConfig = defineStore(
|
||||||
'config',
|
'config',
|
||||||
() => {
|
() => {
|
||||||
const layout: Layout = reactive({
|
const layout: Layout = reactive({
|
||||||
/* 全局 */
|
/* 全局 */
|
||||||
showDrawer: false,
|
showDrawer: false,
|
||||||
// 是否收缩布局(小屏终端)
|
// 是否收缩布局(小屏终端)
|
||||||
shrink: false,
|
shrink: false,
|
||||||
// 后台布局方式,可选值<Default|Classic|Streamline|Double>
|
// 后台布局方式,可选值<Default|Classic|Streamline|Double>
|
||||||
layoutMode: 'Classic',
|
layoutMode: 'Classic',
|
||||||
// 后台主页面切换动画,可选值<slide-right|slide-left|el-fade-in-linear|el-fade-in|el-zoom-in-center|el-zoom-in-top|el-zoom-in-bottom>
|
// 后台主页面切换动画,可选值<slide-right|slide-left|el-fade-in-linear|el-fade-in|el-zoom-in-center|el-zoom-in-top|el-zoom-in-bottom>
|
||||||
mainAnimation: 'slide-right',
|
mainAnimation: 'slide-right',
|
||||||
// 是否暗黑模式
|
// 是否暗黑模式
|
||||||
isDark: false,
|
isDark: false,
|
||||||
elementUiPrimary: ['#002B6A', '#002B6A'],
|
elementUiPrimary: ['#002B6A', '#002B6A'],
|
||||||
tableHeaderBackground: ['#F3F6F9', '#F3F6F9'],
|
tableHeaderBackground: ['#F3F6F9', '#F3F6F9'],
|
||||||
tableHeaderColor: ['#111', '#fff'],
|
tableHeaderColor: ['#111', '#fff'],
|
||||||
tableCurrent: ['#F3F6F9', '#F3F6F9'],
|
tableCurrent: ['#F3F6F9', '#F3F6F9'],
|
||||||
/* 侧边菜单 */
|
/* 侧边菜单 */
|
||||||
// 侧边菜单背景色
|
// 侧边菜单背景色
|
||||||
menuBackground: ['#002B6A', '#1d1e1f'],
|
menuBackground: ['#002B6A', '#1d1e1f'],
|
||||||
// 侧边菜单文字颜色
|
// 侧边菜单文字颜色
|
||||||
menuColor: ['#FFFFFF', '#CFD3DC'],
|
menuColor: ['#FFFFFF', '#CFD3DC'],
|
||||||
// 侧边菜单激活项背景色
|
// 侧边菜单激活项背景色
|
||||||
menuActiveBackground: ['#002255', '#1d1e1f'],
|
menuActiveBackground: ['#002255', '#1d1e1f'],
|
||||||
// 侧边菜单激活项文字色
|
// 侧边菜单激活项文字色
|
||||||
menuActiveColor: ['#409eff', '#3375b9'],
|
menuActiveColor: ['#409eff', '#3375b9'],
|
||||||
// 侧边菜单顶栏背景色
|
// 侧边菜单顶栏背景色
|
||||||
menuTopBarBackground: ['#002B6A', '#1d1e1f'],
|
menuTopBarBackground: ['#002B6A', '#1d1e1f'],
|
||||||
// 侧边菜单宽度(展开时),单位px
|
// 侧边菜单宽度(展开时),单位px
|
||||||
menuWidth: 260,
|
menuWidth: 260,
|
||||||
// 侧边菜单项默认图标
|
// 侧边菜单项默认图标
|
||||||
menuDefaultIcon: 'fa fa-circle-o',
|
menuDefaultIcon: 'fa fa-circle-o',
|
||||||
// 是否水平折叠收起菜单
|
// 是否水平折叠收起菜单
|
||||||
menuCollapse: false,
|
menuCollapse: false,
|
||||||
// 是否只保持一个子菜单的展开(手风琴)
|
// 是否只保持一个子菜单的展开(手风琴)
|
||||||
menuUniqueOpened: false,
|
menuUniqueOpened: false,
|
||||||
// 显示菜单栏顶栏(LOGO)
|
// 显示菜单栏顶栏(LOGO)
|
||||||
menuShowTopBar: true,
|
menuShowTopBar: true,
|
||||||
|
|
||||||
/* 顶栏 */
|
/* 顶栏 */
|
||||||
// 顶栏文字色
|
// 顶栏文字色
|
||||||
headerBarTabColor: ['#FFFFFF', '#CFD3DC'],
|
headerBarTabColor: ['#FFFFFF', '#CFD3DC'],
|
||||||
// // 顶栏激活项背景色
|
// // 顶栏激活项背景色
|
||||||
headerBarTabActiveBackground: ['#ffffff', '#1d1e1f'],
|
headerBarTabActiveBackground: ['#ffffff', '#1d1e1f'],
|
||||||
// 顶栏激活项文字色
|
// 顶栏激活项文字色
|
||||||
headerBarTabActiveColor: ['#000000', '#409EFF'],
|
headerBarTabActiveColor: ['#000000', '#409EFF'],
|
||||||
// 顶栏背景色
|
// 顶栏背景色
|
||||||
headerBarBackground: ['#002B6A', '#1d1e1f'],
|
headerBarBackground: ['#002B6A', '#1d1e1f'],
|
||||||
// 顶栏悬停时背景色
|
// 顶栏悬停时背景色
|
||||||
headerBarHoverBackground: ['#f5f5f5', '#18222c']
|
headerBarHoverBackground: ['#f5f5f5', '#18222c']
|
||||||
})
|
})
|
||||||
|
|
||||||
const lang = reactive({
|
const lang = reactive({
|
||||||
// 默认语言,可选值<zh-cn|en>
|
// 默认语言,可选值<zh-cn|en>
|
||||||
defaultLang: 'zh-cn',
|
defaultLang: 'zh-cn',
|
||||||
// 当在默认语言包找不到翻译时,继续在 fallbackLang 语言包内查找翻译
|
// 当在默认语言包找不到翻译时,继续在 fallbackLang 语言包内查找翻译
|
||||||
fallbackLang: 'zh-cn',
|
fallbackLang: 'zh-cn',
|
||||||
// 支持的语言列表
|
// 支持的语言列表
|
||||||
langArray: [
|
langArray: [
|
||||||
{ name: 'zh-cn', value: '中文简体' },
|
{ name: 'zh-cn', value: '中文简体' },
|
||||||
{ name: 'en', value: 'English' }
|
{ name: 'en', value: 'English' }
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
|
|
||||||
function menuWidth() {
|
function menuWidth() {
|
||||||
if (layout.shrink) {
|
if (layout.shrink) {
|
||||||
return layout.menuCollapse ? '0px' : layout.menuWidth + 'px'
|
return layout.menuCollapse ? '0px' : layout.menuWidth + 'px'
|
||||||
}
|
}
|
||||||
// 菜单是否折叠
|
// 菜单是否折叠
|
||||||
return layout.menuCollapse ? '64px' : layout.menuWidth + 'px'
|
return layout.menuCollapse ? '64px' : layout.menuWidth + 'px'
|
||||||
}
|
}
|
||||||
|
|
||||||
function setLang(val: string) {
|
function setLang(val: string) {
|
||||||
lang.defaultLang = val
|
lang.defaultLang = val
|
||||||
}
|
}
|
||||||
|
|
||||||
function onSetLayoutColor(data = layout.layoutMode) {
|
function onSetLayoutColor(data = layout.layoutMode) {
|
||||||
// 切换布局时,如果是为默认配色方案,对菜单激活背景色重新赋值
|
// 切换布局时,如果是为默认配色方案,对菜单激活背景色重新赋值
|
||||||
const tempValue = layout.isDark
|
const tempValue = layout.isDark
|
||||||
? { idx: 1, color: '#1d1e1f', newColor: '#141414' }
|
? { idx: 1, color: '#1d1e1f', newColor: '#141414' }
|
||||||
: { idx: 0, color: '#ffffff', newColor: '#f5f5f5' }
|
: { idx: 0, color: '#ffffff', newColor: '#f5f5f5' }
|
||||||
if (
|
if (
|
||||||
data == 'Classic' &&
|
data == 'Classic' &&
|
||||||
layout.headerBarBackground[tempValue.idx] == tempValue.color &&
|
layout.headerBarBackground[tempValue.idx] == tempValue.color &&
|
||||||
layout.headerBarTabActiveBackground[tempValue.idx] == tempValue.color
|
layout.headerBarTabActiveBackground[tempValue.idx] == tempValue.color
|
||||||
) {
|
) {
|
||||||
layout.headerBarTabActiveBackground[tempValue.idx] = tempValue.newColor
|
layout.headerBarTabActiveBackground[tempValue.idx] = tempValue.newColor
|
||||||
} else if (
|
} else if (
|
||||||
data == 'Default' &&
|
data == 'Default' &&
|
||||||
layout.headerBarBackground[tempValue.idx] == tempValue.color &&
|
layout.headerBarBackground[tempValue.idx] == tempValue.color &&
|
||||||
layout.headerBarTabActiveBackground[tempValue.idx] == tempValue.newColor
|
layout.headerBarTabActiveBackground[tempValue.idx] == tempValue.newColor
|
||||||
) {
|
) {
|
||||||
layout.headerBarTabActiveBackground[tempValue.idx] = tempValue.color
|
layout.headerBarTabActiveBackground[tempValue.idx] = tempValue.color
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function setLayoutMode(data: string) {
|
function setLayoutMode(data: string) {
|
||||||
layout.layoutMode = data
|
layout.layoutMode = data
|
||||||
onSetLayoutColor(data)
|
onSetLayoutColor(data)
|
||||||
}
|
}
|
||||||
|
|
||||||
const setLayout = (name: keyof Layout, value: any) => {
|
const setLayout = (name: keyof Layout, value: any) => {
|
||||||
layout[name] = value as never
|
layout[name] = value as never
|
||||||
}
|
}
|
||||||
|
|
||||||
const getColorVal = function (name: keyof Layout): string {
|
const getColorVal = function (name: keyof Layout): string {
|
||||||
const colors = layout[name] as string[]
|
const colors = layout[name] as string[] || ['#082E6C', '#0e8780']
|
||||||
if (layout.isDark) {
|
if (layout.isDark) {
|
||||||
return colors[1]
|
return colors[1]
|
||||||
} else {
|
} else {
|
||||||
return colors[0]
|
return colors[0]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return { layout, lang, menuWidth, setLang, setLayoutMode, setLayout, getColorVal, onSetLayoutColor }
|
return { layout, lang, menuWidth, setLang, setLayoutMode, setLayout, getColorVal, onSetLayoutColor }
|
||||||
},
|
},
|
||||||
// () => {
|
// () => {
|
||||||
//
|
//
|
||||||
// console.log('🚀 ~ subject:', subject)
|
// console.log('🚀 ~ subject:', subject)
|
||||||
// const layout: Layout = reactive({
|
// const layout: Layout = reactive({
|
||||||
// /* 全局 */
|
// /* 全局 */
|
||||||
// showDrawer: false,
|
// showDrawer: false,
|
||||||
// // 是否收缩布局(小屏终端)
|
// // 是否收缩布局(小屏终端)
|
||||||
// shrink: false,
|
// shrink: false,
|
||||||
// // 后台布局方式,可选值<Default|Classic|Streamline|Double>
|
// // 后台布局方式,可选值<Default|Classic|Streamline|Double>
|
||||||
// layoutMode: 'Classic',
|
// layoutMode: 'Classic',
|
||||||
// // 后台主页面切换动画,可选值<slide-right|slide-left|el-fade-in-linear|el-fade-in|el-zoom-in-center|el-zoom-in-top|el-zoom-in-bottom>
|
// // 后台主页面切换动画,可选值<slide-right|slide-left|el-fade-in-linear|el-fade-in|el-zoom-in-center|el-zoom-in-top|el-zoom-in-bottom>
|
||||||
// mainAnimation: subject.mainAnimation,
|
// mainAnimation: subject.mainAnimation,
|
||||||
// // 是否暗黑模式
|
// // 是否暗黑模式
|
||||||
// isDark: false,
|
// isDark: false,
|
||||||
// elementUiPrimary: JSON.parse(subject.elementUiPrimary),
|
// elementUiPrimary: JSON.parse(subject.elementUiPrimary),
|
||||||
// tableHeaderBackground: JSON.parse(subject.tableHeaderBackground),
|
// tableHeaderBackground: JSON.parse(subject.tableHeaderBackground),
|
||||||
// tableHeaderColor:JSON.parse(subject.tableHeaderColor),
|
// tableHeaderColor:JSON.parse(subject.tableHeaderColor),
|
||||||
// tableCurrent: JSON.parse(subject.tableCurrent),
|
// tableCurrent: JSON.parse(subject.tableCurrent),
|
||||||
// /* 侧边菜单 */
|
// /* 侧边菜单 */
|
||||||
// // 侧边菜单背景色
|
// // 侧边菜单背景色
|
||||||
// menuBackground: JSON.parse(subject.menuBackground),
|
// menuBackground: JSON.parse(subject.menuBackground),
|
||||||
// // 侧边菜单文字颜色
|
// // 侧边菜单文字颜色
|
||||||
// menuColor:JSON.parse(subject.menuColor),
|
// menuColor:JSON.parse(subject.menuColor),
|
||||||
// // 侧边菜单激活项背景色
|
// // 侧边菜单激活项背景色
|
||||||
// menuActiveBackground:JSON.parse(subject.menuActiveBackground),
|
// menuActiveBackground:JSON.parse(subject.menuActiveBackground),
|
||||||
// // 侧边菜单激活项文字色
|
// // 侧边菜单激活项文字色
|
||||||
// menuActiveColor:JSON.parse(subject.menuActiveColor),
|
// menuActiveColor:JSON.parse(subject.menuActiveColor),
|
||||||
// // 侧边菜单顶栏背景色
|
// // 侧边菜单顶栏背景色
|
||||||
// menuTopBarBackground: JSON.parse(subject.menuTopBarBackground),
|
// menuTopBarBackground: JSON.parse(subject.menuTopBarBackground),
|
||||||
// // 侧边菜单宽度(展开时),单位px
|
// // 侧边菜单宽度(展开时),单位px
|
||||||
// menuWidth: 260,
|
// menuWidth: 260,
|
||||||
// // 侧边菜单项默认图标
|
// // 侧边菜单项默认图标
|
||||||
// menuDefaultIcon: 'fa fa-circle-o',
|
// menuDefaultIcon: 'fa fa-circle-o',
|
||||||
// // 是否水平折叠收起菜单
|
// // 是否水平折叠收起菜单
|
||||||
// menuCollapse: false,
|
// menuCollapse: false,
|
||||||
// // 是否只保持一个子菜单的展开(手风琴)
|
// // 是否只保持一个子菜单的展开(手风琴)
|
||||||
// menuUniqueOpened: false,
|
// menuUniqueOpened: false,
|
||||||
// // 显示菜单栏顶栏(LOGO)
|
// // 显示菜单栏顶栏(LOGO)
|
||||||
// menuShowTopBar: true,
|
// menuShowTopBar: true,
|
||||||
|
|
||||||
// /* 顶栏 */
|
// /* 顶栏 */
|
||||||
// // 顶栏文字色
|
// // 顶栏文字色
|
||||||
// headerBarTabColor:JSON.parse(subject.headerBarTabColor),
|
// headerBarTabColor:JSON.parse(subject.headerBarTabColor),
|
||||||
// // // 顶栏激活项背景色
|
// // // 顶栏激活项背景色
|
||||||
// headerBarTabActiveBackground: ['#ffffff', '#1d1e1f'],
|
// headerBarTabActiveBackground: ['#ffffff', '#1d1e1f'],
|
||||||
// // 顶栏激活项文字色
|
// // 顶栏激活项文字色
|
||||||
// headerBarTabActiveColor: ['#000000', '#409EFF'],
|
// headerBarTabActiveColor: ['#000000', '#409EFF'],
|
||||||
// // 顶栏背景色
|
// // 顶栏背景色
|
||||||
// headerBarBackground: JSON.parse(subject.headerBarBackground),
|
// headerBarBackground: JSON.parse(subject.headerBarBackground),
|
||||||
// // 顶栏悬停时背景色
|
// // 顶栏悬停时背景色
|
||||||
// headerBarHoverBackground: ['#f5f5f5', '#18222c']
|
// headerBarHoverBackground: ['#f5f5f5', '#18222c']
|
||||||
// })
|
// })
|
||||||
// // console.log(123, window.localStorage.getItem('getTheme'))
|
// // console.log(123, window.localStorage.getItem('getTheme'))
|
||||||
|
|
||||||
// const lang = reactive({
|
// const lang = reactive({
|
||||||
// // 默认语言,可选值<zh-cn|en>
|
// // 默认语言,可选值<zh-cn|en>
|
||||||
// defaultLang: 'zh-cn',
|
// defaultLang: 'zh-cn',
|
||||||
// // 当在默认语言包找不到翻译时,继续在 fallbackLang 语言包内查找翻译
|
// // 当在默认语言包找不到翻译时,继续在 fallbackLang 语言包内查找翻译
|
||||||
// fallbackLang: 'zh-cn',
|
// fallbackLang: 'zh-cn',
|
||||||
// // 支持的语言列表
|
// // 支持的语言列表
|
||||||
// langArray: [
|
// langArray: [
|
||||||
// { name: 'zh-cn', value: '中文简体' },
|
// { name: 'zh-cn', value: '中文简体' },
|
||||||
// { name: 'en', value: 'English' }
|
// { name: 'en', value: 'English' }
|
||||||
// ]
|
// ]
|
||||||
// })
|
// })
|
||||||
|
|
||||||
// function menuWidth() {
|
// function menuWidth() {
|
||||||
// if (layout.shrink) {
|
// if (layout.shrink) {
|
||||||
// return layout.menuCollapse ? '0px' : layout.menuWidth + 'px'
|
// return layout.menuCollapse ? '0px' : layout.menuWidth + 'px'
|
||||||
// }
|
// }
|
||||||
// // 菜单是否折叠
|
// // 菜单是否折叠
|
||||||
// return layout.menuCollapse ? '64px' : layout.menuWidth + 'px'
|
// return layout.menuCollapse ? '64px' : layout.menuWidth + 'px'
|
||||||
// }
|
// }
|
||||||
|
|
||||||
// function setLang(val: string) {
|
// function setLang(val: string) {
|
||||||
// lang.defaultLang = val
|
// lang.defaultLang = val
|
||||||
// }
|
// }
|
||||||
|
|
||||||
// function onSetLayoutColor(data = layout.layoutMode) {
|
// function onSetLayoutColor(data = layout.layoutMode) {
|
||||||
// // 切换布局时,如果是为默认配色方案,对菜单激活背景色重新赋值
|
// // 切换布局时,如果是为默认配色方案,对菜单激活背景色重新赋值
|
||||||
// const tempValue = layout.isDark
|
// const tempValue = layout.isDark
|
||||||
// ? { idx: 1, color: '#1d1e1f', newColor: '#141414' }
|
// ? { idx: 1, color: '#1d1e1f', newColor: '#141414' }
|
||||||
// : { idx: 0, color: '#ffffff', newColor: '#f5f5f5' }
|
// : { idx: 0, color: '#ffffff', newColor: '#f5f5f5' }
|
||||||
// if (
|
// if (
|
||||||
// data == 'Classic' &&
|
// data == 'Classic' &&
|
||||||
// layout.headerBarBackground[tempValue.idx] == tempValue.color &&
|
// layout.headerBarBackground[tempValue.idx] == tempValue.color &&
|
||||||
// layout.headerBarTabActiveBackground[tempValue.idx] == tempValue.color
|
// layout.headerBarTabActiveBackground[tempValue.idx] == tempValue.color
|
||||||
// ) {
|
// ) {
|
||||||
// layout.headerBarTabActiveBackground[tempValue.idx] = tempValue.newColor
|
// layout.headerBarTabActiveBackground[tempValue.idx] = tempValue.newColor
|
||||||
// } else if (
|
// } else if (
|
||||||
// data == 'Default' &&
|
// data == 'Default' &&
|
||||||
// layout.headerBarBackground[tempValue.idx] == tempValue.color &&
|
// layout.headerBarBackground[tempValue.idx] == tempValue.color &&
|
||||||
// layout.headerBarTabActiveBackground[tempValue.idx] == tempValue.newColor
|
// layout.headerBarTabActiveBackground[tempValue.idx] == tempValue.newColor
|
||||||
// ) {
|
// ) {
|
||||||
// layout.headerBarTabActiveBackground[tempValue.idx] = tempValue.color
|
// layout.headerBarTabActiveBackground[tempValue.idx] = tempValue.color
|
||||||
// }
|
// }
|
||||||
// }
|
// }
|
||||||
|
|
||||||
// function setLayoutMode(data: string) {
|
// function setLayoutMode(data: string) {
|
||||||
// layout.layoutMode = data
|
// layout.layoutMode = data
|
||||||
// onSetLayoutColor(data)
|
// onSetLayoutColor(data)
|
||||||
// }
|
// }
|
||||||
|
|
||||||
// const setLayout = (name: keyof Layout, value: any) => {
|
// const setLayout = (name: keyof Layout, value: any) => {
|
||||||
// layout[name] = value as never
|
// layout[name] = value as never
|
||||||
// }
|
// }
|
||||||
|
|
||||||
// const getColorVal = function (name: keyof Layout): string {
|
// const getColorVal = function (name: keyof Layout): string {
|
||||||
// const colors = layout[name] as string[]
|
// const colors = layout[name] as string[]
|
||||||
// if (layout.isDark) {
|
// if (layout.isDark) {
|
||||||
// return colors[1]
|
// return colors[1]
|
||||||
// } else {
|
// } else {
|
||||||
// return colors[0]
|
// return colors[0]
|
||||||
// }
|
// }
|
||||||
// }
|
// }
|
||||||
|
|
||||||
// return { layout, lang, menuWidth, setLang, setLayoutMode, setLayout, getColorVal, onSetLayoutColor }
|
// return { layout, lang, menuWidth, setLang, setLayoutMode, setLayout, getColorVal, onSetLayoutColor }
|
||||||
// },
|
// },
|
||||||
{
|
{
|
||||||
persist: {
|
persist: {
|
||||||
key: STORE_CONFIG
|
key: STORE_CONFIG
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -52,11 +52,12 @@ class MQTT {
|
|||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const mqttUrl =
|
// const mqttUrl =
|
||||||
localStorage.getItem('MqttUrl') == 'null'
|
// localStorage.getItem('MqttUrl') == 'null'
|
||||||
? 'ws://192.168.1.68:8083/mqtt'
|
// ? 'ws://192.168.1.68:8083/mqtt'
|
||||||
: localStorage.getItem('MqttUrl')
|
// : localStorage.getItem('MqttUrl')
|
||||||
if (mqttUrl == 'null'||mqttUrl == null) return
|
const mqttUrl = localStorage.getItem('MqttUrl')
|
||||||
|
if (mqttUrl == 'null' || mqttUrl == null) return
|
||||||
this.client = mqtt.connect(mqttUrl, this.defaultOptions as IClientOptions)
|
this.client = mqtt.connect(mqttUrl, this.defaultOptions as IClientOptions)
|
||||||
this.setupEventListeners()
|
this.setupEventListeners()
|
||||||
|
|
||||||
|
|||||||
@@ -744,7 +744,8 @@ const initEcharts = (color: string, key: number, name: string) => {
|
|||||||
}
|
}
|
||||||
//渲染echarts
|
//渲染echarts
|
||||||
const init = () => {
|
const init = () => {
|
||||||
const url = localStorage.getItem('WebSocketUrl') || 'ws://192.168.1.68:10407/api/pushMessage/'
|
loading.value = true
|
||||||
|
const url = localStorage.getItem('WebSocketUrl') || 'ws://192.168.1.67:10407/api/pushMessage/'
|
||||||
echartsDataV1.value = initEcharts('#DAA520', 0, 'A相')
|
echartsDataV1.value = initEcharts('#DAA520', 0, 'A相')
|
||||||
echartsDataV2.value = initEcharts('#2E8B57', 0, 'B相')
|
echartsDataV2.value = initEcharts('#2E8B57', 0, 'B相')
|
||||||
echartsDataV3.value = initEcharts('#A52a2a', 0, 'C相')
|
echartsDataV3.value = initEcharts('#A52a2a', 0, 'C相')
|
||||||
@@ -758,6 +759,7 @@ const init = () => {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
if (monitoringPoint.state.comFlag == 0) {
|
if (monitoringPoint.state.comFlag == 0) {
|
||||||
|
loading.value = false
|
||||||
return ElMessage({
|
return ElMessage({
|
||||||
message: '所选监测点离线!',
|
message: '所选监测点离线!',
|
||||||
type: 'warning'
|
type: 'warning'
|
||||||
@@ -826,7 +828,7 @@ const init = () => {
|
|||||||
]
|
]
|
||||||
spectrumRef.value?.init(data)
|
spectrumRef.value?.init(data)
|
||||||
trendRef.value?.init(data)
|
trendRef.value?.init(data)
|
||||||
|
loading.value = false
|
||||||
// console.log('🚀 ~ dataSocket.socketServe.registerCallBack ~ webMsgSend.value:', data)
|
// console.log('🚀 ~ dataSocket.socketServe.registerCallBack ~ webMsgSend.value:', data)
|
||||||
setRealData()
|
setRealData()
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -1,357 +1,358 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="pt50">
|
<div class="pt50">
|
||||||
<el-button class="shutDown" icon="el-icon-Back" @click="emit('shutDown')">返回</el-button>
|
<el-button class="shutDown" icon="el-icon-Back" @click="emit('shutDown')">返回</el-button>
|
||||||
<div class="select">
|
<div class="select">
|
||||||
<div class="mr10">谐波次数</div>
|
<div class="mr10">谐波次数</div>
|
||||||
<el-select v-model="selectValue" style="width: 100px" @change="loading = true">
|
<el-select v-model="selectValue" style="width: 100px" @change="loading = true">
|
||||||
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</div>
|
</div>
|
||||||
<el-tabs type="border-card" v-model="activeName" @tab-change="handleClick" v-loading="loading">
|
<el-tabs type="border-card" v-model="activeName" @tab-change="handleClick" v-loading="loading">
|
||||||
<el-tab-pane v-for="(item, index) in tabsList" :label="item.groupName" :name="index" :key="index">
|
<el-tab-pane v-for="(item, index) in tabsList" :label="item.groupName" :name="index" :key="index">
|
||||||
<div>
|
<div>
|
||||||
<div class="realtrend_top">
|
<div class="realtrend_top">
|
||||||
<div class="realtrend_table">
|
<div class="realtrend_table">
|
||||||
<div class="thead_left">
|
<div class="thead_left">
|
||||||
<p style="font-weight: 700; background-color: #f3f6f9">次数(次)</p>
|
<p style="font-weight: 700; background-color: #f3f6f9">次数(次)</p>
|
||||||
<p>{{ item.groupName }}{{ item.unit ? '(' + item.unit + ')' : '' }}</p>
|
<p>{{ item.groupName }}{{ item.unit ? '(' + item.unit + ')' : '' }}</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="thead_right">
|
<div class="thead_right">
|
||||||
<div
|
<div
|
||||||
class="right_cell"
|
class="right_cell"
|
||||||
v-for="i in selectValue == '1'
|
v-for="i in selectValue == '1'
|
||||||
? item.title.filter(num => (activeName == 1 ? num - 0.5 : num) % 2 !== 0)
|
? item.title.filter(num => (activeName == 1 ? num - 0.5 : num) % 2 !== 0)
|
||||||
: selectValue == '2'
|
: selectValue == '2'
|
||||||
? item.title.filter(num => (activeName == 1 ? num - 0.5 : num) % 2 == 0)
|
? item.title.filter(num => (activeName == 1 ? num - 0.5 : num) % 2 == 0)
|
||||||
: item.title"
|
: item.title"
|
||||||
:key="index"
|
:key="index"
|
||||||
>
|
>
|
||||||
<p style="background-color: #f3f6f9">
|
<p style="background-color: #f3f6f9">
|
||||||
<span>{{ i }}次</span>
|
<span>{{ i }}次</span>
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
<span>{{ item.data[`h${i}`] == 0 ? 0 : item.data[`h${i}`] || '/' }}</span>
|
<span>{{ item.data[`h${i}`] == 0 ? 0 : item.data[`h${i}`] || '/' }}</span>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt10" :style="height">
|
<div class="mt10" :style="height">
|
||||||
<MyEchart ref="barCharts" :options="tabsList[0].echartsData"></MyEchart>
|
<MyEchart ref="barCharts" :options="tabsList[0].echartsData"></MyEchart>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, reactive, onMounted } from 'vue'
|
import { ref, reactive, onMounted } from 'vue'
|
||||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||||
import { getOverLimitData } from '@/api/device-boot/communicate'
|
import { getOverLimitData } from '@/api/device-boot/communicate'
|
||||||
import { mainHeight } from '@/utils/layout'
|
import { mainHeight } from '@/utils/layout'
|
||||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||||
const emit = defineEmits(['shutDown'])
|
const emit = defineEmits(['shutDown'])
|
||||||
const monitoringPoint = useMonitoringPoint()
|
const monitoringPoint = useMonitoringPoint()
|
||||||
const options = [
|
const options = [
|
||||||
{
|
{
|
||||||
value: '3',
|
value: '3',
|
||||||
label: '全部'
|
label: '全部'
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
value: '1',
|
value: '1',
|
||||||
label: '奇次'
|
label: '奇次'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
value: '2',
|
value: '2',
|
||||||
label: '偶次'
|
label: '偶次'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
const height = mainHeight(315)
|
const height = mainHeight(315)
|
||||||
const barCharts = ref()
|
const barCharts = ref()
|
||||||
const loading = ref(true)
|
const loading = ref(true)
|
||||||
const crossTheLine: any = ref({})
|
const crossTheLine: any = ref({})
|
||||||
const tabsList: any = ref([
|
const tabsList: any = ref([
|
||||||
{
|
{
|
||||||
id: '6d5470f509ca271d7108a86e83bb283f',
|
id: '6d5470f509ca271d7108a86e83bb283f',
|
||||||
groupName: '谐波电压含有率',
|
groupName: '谐波电压含有率',
|
||||||
thdDataVOS: null,
|
thdDataVOS: null,
|
||||||
thdDataTdVODatas: null,
|
thdDataTdVODatas: null,
|
||||||
unit: '%',
|
unit: '%',
|
||||||
title: [
|
title: [
|
||||||
2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30,
|
2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30,
|
||||||
31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50
|
31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50
|
||||||
],
|
],
|
||||||
data: {},
|
data: {},
|
||||||
echartsData: {}
|
echartsData: {}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'ae31115b83f02f03a0d3bd65cb017121',
|
id: 'ae31115b83f02f03a0d3bd65cb017121',
|
||||||
groupName: '间谐波电压含有率',
|
groupName: '间谐波电压含有率',
|
||||||
thdDataVOS: null,
|
thdDataVOS: null,
|
||||||
thdDataTdVODatas: null,
|
thdDataTdVODatas: null,
|
||||||
unit: '%',
|
unit: '%',
|
||||||
title: [
|
title: [
|
||||||
0.5, 1.5, 2.5, 3.5, 4.5, 5.5, 6.5, 7.5, 8.5, 9.5, 10.5, 11.5, 12.5, 13.5, 14.5, 15.5, 16.5, 17.5, 18.5,
|
0.5, 1.5, 2.5, 3.5, 4.5, 5.5, 6.5, 7.5, 8.5, 9.5, 10.5, 11.5, 12.5, 13.5, 14.5, 15.5,
|
||||||
19.5, 20.5, 21.5, 22.5, 23.5, 24.5, 25.5, 26.5, 27.5, 28.5, 29.5, 30.5, 31.5, 32.5, 33.5, 34.5, 35.5, 36.5,
|
// 16.5, 17.5, 18.5,
|
||||||
37.5, 38.5, 39.5, 40.5, 41.5, 42.5, 43.5, 44.5, 45.5, 46.5, 47.5, 48.5, 49.5
|
// 19.5, 20.5, 21.5, 22.5, 23.5, 24.5, 25.5, 26.5, 27.5, 28.5, 29.5, 30.5, 31.5, 32.5, 33.5, 34.5, 35.5, 36.5,
|
||||||
],
|
// 37.5, 38.5, 39.5, 40.5, 41.5, 42.5, 43.5, 44.5, 45.5, 46.5, 47.5, 48.5, 49.5
|
||||||
data: {},
|
],
|
||||||
echartsData: {}
|
data: {},
|
||||||
},
|
echartsData: {}
|
||||||
{
|
},
|
||||||
id: '8dc260f16280184e2b57d26668dc00b1',
|
{
|
||||||
groupName: '谐波电流幅值',
|
id: '8dc260f16280184e2b57d26668dc00b1',
|
||||||
thdDataVOS: null,
|
groupName: '谐波电流幅值',
|
||||||
thdDataTdVODatas: null,
|
thdDataVOS: null,
|
||||||
unit: 'A',
|
thdDataTdVODatas: null,
|
||||||
title: [
|
unit: 'A',
|
||||||
2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30,
|
title: [
|
||||||
31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50
|
2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30,
|
||||||
],
|
31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50
|
||||||
|
],
|
||||||
data: {},
|
|
||||||
echartsData: {}
|
data: {},
|
||||||
}
|
echartsData: {}
|
||||||
])
|
}
|
||||||
|
])
|
||||||
const selectValue = ref('1')
|
|
||||||
const activeName = ref(0)
|
const selectValue = ref('1')
|
||||||
// 点击tab
|
const activeName = ref(0)
|
||||||
const handleClick = (tab: any, event: any) => {
|
// 点击tab
|
||||||
loading.value = true
|
const handleClick = (tab: any, event: any) => {
|
||||||
}
|
loading.value = true
|
||||||
const init = (row: any) => {
|
}
|
||||||
let vData: any = {}
|
const init = (row: any) => {
|
||||||
let iData: any = {}
|
let vData: any = {}
|
||||||
let SvData: any = {}
|
let iData: any = {}
|
||||||
for (let i = 1; i < 50; i++) {
|
let SvData: any = {}
|
||||||
vData[`h${i + 1}`] =
|
for (let i = 1; i < 50; i++) {
|
||||||
Math.floor(
|
vData[`h${i + 1}`] =
|
||||||
Math.max(...[row.V.A[`V` + (i + 1)], row.V.B[`V` + (i + 1)], row.V.C[`V` + (i + 1)]].map(Number)) * 100
|
Math.floor(
|
||||||
) / 100
|
Math.max(...[row.V.A[`V` + (i + 1)], row.V.B[`V` + (i + 1)], row.V.C[`V` + (i + 1)]].map(Number)) * 100
|
||||||
|
) / 100
|
||||||
SvData[`h${i - 0.5}`] =
|
|
||||||
Math.floor(Math.max(...[row.V.A[`SV_` + (i-1)], row.V.B[`SV_` + (i-1)], row.V.C[`SV_` + (i-1)]].map(Number)) * 100) /
|
SvData[`h${i - 0.5}`] =
|
||||||
100
|
Math.floor(Math.max(...[row.V.A[`SV_` + (i-1)], row.V.B[`SV_` + (i-1)], row.V.C[`SV_` + (i-1)]].map(Number)) * 100) /
|
||||||
iData[`h${i + 1}`] =
|
100
|
||||||
Math.floor(
|
iData[`h${i + 1}`] =
|
||||||
Math.max(...[row.I.A[`I` + (i + 1)], row.I.B[`I` + (i + 1)], row.I.C[`I` + (i + 1)]].map(Number)) * 100
|
Math.floor(
|
||||||
) / 100
|
Math.max(...[row.I.A[`I` + (i + 1)], row.I.B[`I` + (i + 1)], row.I.C[`I` + (i + 1)]].map(Number)) * 100
|
||||||
}
|
) / 100
|
||||||
SvData[`h49.5`] =
|
}
|
||||||
Math.floor(Math.max(...[row.V.A[`SV_49`], row.V.B[`SV_49`], row.V.C[`SV_49`]].map(Number)) * 100) / 100
|
SvData[`h49.5`] =
|
||||||
|
Math.floor(Math.max(...[row.V.A[`SV_49`], row.V.B[`SV_49`], row.V.C[`SV_49`]].map(Number)) * 100) / 100
|
||||||
tabsList.value[0].data = vData
|
|
||||||
tabsList.value[1].data = SvData
|
tabsList.value[0].data = vData
|
||||||
tabsList.value[2].data = iData
|
tabsList.value[1].data = SvData
|
||||||
|
tabsList.value[2].data = iData
|
||||||
let xData =
|
|
||||||
selectValue.value == '1'
|
let xData =
|
||||||
? tabsList.value[activeName.value].title.filter(num => (activeName.value == 1 ? num - 0.5 : num) % 2 !== 0)
|
selectValue.value == '1'
|
||||||
: selectValue.value == '2'
|
? tabsList.value[activeName.value].title.filter(num => (activeName.value == 1 ? num - 0.5 : num) % 2 !== 0)
|
||||||
? tabsList.value[activeName.value].title.filter(num => (activeName.value == 1 ? num - 0.5 : num) % 2 === 0)
|
: selectValue.value == '2'
|
||||||
: tabsList.value[activeName.value].title
|
? tabsList.value[activeName.value].title.filter(num => (activeName.value == 1 ? num - 0.5 : num) % 2 === 0)
|
||||||
|
: tabsList.value[activeName.value].title
|
||||||
barCharts.value[activeName.value]?.setOptions({
|
|
||||||
title: {
|
barCharts.value[activeName.value]?.setOptions({
|
||||||
text: tabsList.value[activeName.value].groupName
|
title: {
|
||||||
},
|
text: tabsList.value[activeName.value].groupName
|
||||||
xAxis: {
|
},
|
||||||
data: xData.map(num => `${num}次`)
|
xAxis: {
|
||||||
},
|
data: xData.map(num => `${num}次`)
|
||||||
yAxis: {
|
},
|
||||||
name: tabsList.value[activeName.value].unit // 更新Y轴单位
|
yAxis: {
|
||||||
},
|
name: tabsList.value[activeName.value].unit // 更新Y轴单位
|
||||||
series: [
|
},
|
||||||
{
|
series: [
|
||||||
name: tabsList.value[activeName.value].groupName + '(' + tabsList.value[activeName.value].unit + ')' ,
|
{
|
||||||
type: 'bar',
|
name: tabsList.value[activeName.value].groupName + '(' + tabsList.value[activeName.value].unit + ')' ,
|
||||||
data: xData.map(num => {
|
type: 'bar',
|
||||||
return tabsList.value[activeName.value].data[`h${num}`]
|
data: xData.map(num => {
|
||||||
})
|
return tabsList.value[activeName.value].data[`h${num}`]
|
||||||
},
|
})
|
||||||
{
|
},
|
||||||
name: '国标限值(' + tabsList.value[activeName.value].unit + ')', // 更新series名称中的单位
|
{
|
||||||
type: 'bar',
|
name: '国标限值(' + tabsList.value[activeName.value].unit + ')', // 更新series名称中的单位
|
||||||
data: xData.map(num => {
|
type: 'bar',
|
||||||
return (
|
data: xData.map(num => {
|
||||||
crossTheLine.value[
|
return (
|
||||||
activeName.value == 0
|
crossTheLine.value[
|
||||||
? `uharm${num}`
|
activeName.value == 0
|
||||||
: activeName.value == 1
|
? `uharm${num}`
|
||||||
? `inuharm${num + 0.5}`
|
: activeName.value == 1
|
||||||
: `iharm${num}`
|
? `inuharm${num + 0.5}`
|
||||||
] || ''
|
: `iharm${num}`
|
||||||
)
|
] || ''
|
||||||
})
|
)
|
||||||
}
|
})
|
||||||
]
|
}
|
||||||
})
|
]
|
||||||
loading.value = false
|
})
|
||||||
}
|
loading.value = false
|
||||||
// 设置ecartsData
|
}
|
||||||
const echarts = (num: number) => {
|
// 设置ecartsData
|
||||||
return {
|
const echarts = (num: number) => {
|
||||||
title: {
|
return {
|
||||||
text: ''
|
title: {
|
||||||
},
|
text: ''
|
||||||
xAxis: {
|
},
|
||||||
name: "次数",
|
xAxis: {
|
||||||
data: []
|
name: "次数",
|
||||||
},
|
data: []
|
||||||
yAxis: {name: tabsList.value[num].unit},
|
},
|
||||||
color: ['#2E8B57', '#DAA520'],
|
yAxis: {name: tabsList.value[num].unit},
|
||||||
options: {
|
color: ['#2E8B57', '#DAA520'],
|
||||||
series: [
|
options: {
|
||||||
{
|
series: [
|
||||||
name: tabsList.value[num].groupName,
|
{
|
||||||
type: 'bar',
|
name: tabsList.value[num].groupName,
|
||||||
data: []
|
type: 'bar',
|
||||||
},
|
data: []
|
||||||
{
|
},
|
||||||
name: '国标限值('+ tabsList.value[num].unit +')',
|
{
|
||||||
type: 'bar',
|
name: '国标限值('+ tabsList.value[num].unit +')',
|
||||||
// label: {
|
type: 'bar',
|
||||||
// normal: {
|
// label: {
|
||||||
// position: 'top'
|
// normal: {
|
||||||
// }
|
// position: 'top'
|
||||||
// },
|
// }
|
||||||
data: []
|
// },
|
||||||
}
|
data: []
|
||||||
]
|
}
|
||||||
}
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
onMounted(() => {
|
}
|
||||||
tabsList.value[0].echartsData = echarts(0)
|
onMounted(() => {
|
||||||
tabsList.value[1].echartsData = echarts(1)
|
tabsList.value[0].echartsData = echarts(0)
|
||||||
tabsList.value[2].echartsData = echarts(2)
|
tabsList.value[1].echartsData = echarts(1)
|
||||||
console.log(tabsList.value)
|
tabsList.value[2].echartsData = echarts(2)
|
||||||
getOverLimitData({ id: monitoringPoint.state.lineId }).then(res => {
|
console.log(tabsList.value)
|
||||||
crossTheLine.value = res.data
|
getOverLimitData({ id: monitoringPoint.state.lineId }).then(res => {
|
||||||
})
|
crossTheLine.value = res.data
|
||||||
})
|
})
|
||||||
defineExpose({
|
})
|
||||||
init
|
defineExpose({
|
||||||
})
|
init
|
||||||
</script>
|
})
|
||||||
<style lang="scss" scoped>
|
</script>
|
||||||
.shutDown {
|
<style lang="scss" scoped>
|
||||||
position: absolute;
|
.shutDown {
|
||||||
right: 10px;
|
position: absolute;
|
||||||
top: 10px;
|
right: 10px;
|
||||||
}
|
top: 10px;
|
||||||
.select {
|
}
|
||||||
position: absolute;
|
.select {
|
||||||
top: 10px;
|
position: absolute;
|
||||||
display: flex;
|
top: 10px;
|
||||||
align-items: center;
|
display: flex;
|
||||||
font-size: 14px;
|
align-items: center;
|
||||||
}
|
font-size: 14px;
|
||||||
.realtrend_top {
|
}
|
||||||
width: 100%;
|
.realtrend_top {
|
||||||
height: auto;
|
width: 100%;
|
||||||
display: flex;
|
height: auto;
|
||||||
justify-content: space-between;
|
display: flex;
|
||||||
align-items: center;
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
.table {
|
|
||||||
flex: 1;
|
.table {
|
||||||
// min-height: 80px;
|
flex: 1;
|
||||||
cursor: pointer;
|
// min-height: 80px;
|
||||||
min-height: 90px;
|
cursor: pointer;
|
||||||
max-height: 170px;
|
min-height: 90px;
|
||||||
border: 1px solid #eee;
|
max-height: 170px;
|
||||||
overflow-x: auto;
|
border: 1px solid #eee;
|
||||||
overflow-y: hidden;
|
overflow-x: auto;
|
||||||
position: relative;
|
overflow-y: hidden;
|
||||||
|
position: relative;
|
||||||
ul {
|
|
||||||
width: auto;
|
ul {
|
||||||
height: 40px;
|
width: auto;
|
||||||
display: flex;
|
height: 40px;
|
||||||
|
display: flex;
|
||||||
li {
|
|
||||||
flex: none;
|
li {
|
||||||
width: 100px;
|
flex: none;
|
||||||
line-height: 40px;
|
width: 100px;
|
||||||
border: 1px solid #eee;
|
line-height: 40px;
|
||||||
text-align: center;
|
border: 1px solid #eee;
|
||||||
list-style: none;
|
text-align: center;
|
||||||
}
|
list-style: none;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
ul:nth-child(1) {
|
|
||||||
li {
|
ul:nth-child(1) {
|
||||||
font-weight: 800;
|
li {
|
||||||
background: #f4f6f9;
|
font-weight: 800;
|
||||||
}
|
background: #f4f6f9;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
// .table::-webkit-scrollbar {
|
|
||||||
// display: none;
|
// .table::-webkit-scrollbar {
|
||||||
// }
|
// display: none;
|
||||||
|
// }
|
||||||
.realtrend_table {
|
|
||||||
width: 100%;
|
.realtrend_table {
|
||||||
height: auto;
|
width: 100%;
|
||||||
max-height: 150px;
|
height: auto;
|
||||||
display: flex;
|
max-height: 150px;
|
||||||
border: 2px solid #eee;
|
display: flex;
|
||||||
cursor: pointer;
|
border: 2px solid #eee;
|
||||||
font-size: 13px;
|
cursor: pointer;
|
||||||
|
font-size: 13px;
|
||||||
.thead_left {
|
|
||||||
width: 150px;
|
.thead_left {
|
||||||
height: 100%;
|
width: 150px;
|
||||||
display: flex;
|
height: 100%;
|
||||||
flex-direction: column;
|
display: flex;
|
||||||
justify-content: space-between;
|
flex-direction: column;
|
||||||
align-items: center;
|
justify-content: space-between;
|
||||||
line-height: 50px;
|
align-items: center;
|
||||||
|
line-height: 50px;
|
||||||
padding-bottom: 5px;
|
|
||||||
|
padding-bottom: 5px;
|
||||||
p {
|
|
||||||
width: 100%;
|
p {
|
||||||
height: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
height: 100%;
|
||||||
border: 1px solid #eee;
|
text-align: center;
|
||||||
line-height: 38px;
|
border: 1px solid #eee;
|
||||||
margin: 0 !important;
|
line-height: 38px;
|
||||||
}
|
margin: 0 !important;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
.thead_right {
|
|
||||||
flex: 1;
|
.thead_right {
|
||||||
align-items: center;
|
flex: 1;
|
||||||
overflow-x: auto;
|
align-items: center;
|
||||||
overflow-y: hidden;
|
overflow-x: auto;
|
||||||
display: flex;
|
overflow-y: hidden;
|
||||||
padding-bottom: 5px;
|
display: flex;
|
||||||
|
padding-bottom: 5px;
|
||||||
.right_cell {
|
|
||||||
width: 100%;
|
.right_cell {
|
||||||
display: flex;
|
width: 100%;
|
||||||
flex-direction: column;
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
p {
|
|
||||||
flex: none;
|
p {
|
||||||
min-width: 60px;
|
flex: none;
|
||||||
height: 100%;
|
min-width: 60px;
|
||||||
text-align: center;
|
height: 100%;
|
||||||
border: 1px solid #eee;
|
text-align: center;
|
||||||
line-height: 38px;
|
border: 1px solid #eee;
|
||||||
margin: 0 !important;
|
line-height: 38px;
|
||||||
}
|
margin: 0 !important;
|
||||||
|
}
|
||||||
p:nth-child(1) {
|
|
||||||
font-weight: 800;
|
p:nth-child(1) {
|
||||||
}
|
font-weight: 800;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -32,7 +32,7 @@
|
|||||||
<div class="statistics-box">
|
<div class="statistics-box">
|
||||||
<MyEChart style="height: 250px" :options="picEChart1" />
|
<MyEChart style="height: 250px" :options="picEChart1" />
|
||||||
<el-table size="small" height="250px" :data="resembleData">
|
<el-table size="small" height="250px" :data="resembleData">
|
||||||
<el-table-column prop="name" label="触发类型" width="80px" align="center" />
|
<el-table-column prop="name" label="暂降类型" width="80px" align="center" />
|
||||||
<el-table-column prop="value" label="暂降次数" width="80px" align="center" />
|
<el-table-column prop="value" label="暂降次数" width="80px" align="center" />
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<span style="color: red; font-size: 12px">注:触发类型仅统计暂降原因为短路故障事件</span>
|
<span style="color: red; font-size: 12px">注:暂降类型仅统计暂降原因为短路故障事件</span>
|
||||||
|
|
||||||
<div class="statistics-main">
|
<div class="statistics-main">
|
||||||
<template v-if="flag">
|
<template v-if="flag">
|
||||||
@@ -17,7 +17,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<vxe-table height="auto" auto-resize :data="resembleData" v-bind="defaultAttribute">
|
<vxe-table height="auto" auto-resize :data="resembleData" v-bind="defaultAttribute">
|
||||||
<vxe-column field="name" title="触发类型"></vxe-column>
|
<vxe-column field="name" title="暂降类型"></vxe-column>
|
||||||
<vxe-column field="value" title="暂降次数"></vxe-column>
|
<vxe-column field="value" title="暂降次数"></vxe-column>
|
||||||
</vxe-table>
|
</vxe-table>
|
||||||
</div>
|
</div>
|
||||||
@@ -86,7 +86,7 @@ const info = (res: any) => {
|
|||||||
}
|
}
|
||||||
resemble.value = {
|
resemble.value = {
|
||||||
title: {
|
title: {
|
||||||
text: '触发类型'
|
text: '暂降类型'
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
type: 'scroll',
|
type: 'scroll',
|
||||||
@@ -109,7 +109,7 @@ const info = (res: any) => {
|
|||||||
options: {
|
options: {
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name: '触发类型',
|
name: '暂降类型',
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
center: ['50%', '50%'],
|
center: ['50%', '50%'],
|
||||||
selectedOffset: 30,
|
selectedOffset: 30,
|
||||||
|
|||||||
@@ -22,11 +22,11 @@ const Processing = (list: any) => {
|
|||||||
let echartsArr: string[] = []
|
let echartsArr: string[] = []
|
||||||
list.areaCalculation.forEach((item: any) => {
|
list.areaCalculation.forEach((item: any) => {
|
||||||
echartsndArr.push(item.areaName)
|
echartsndArr.push(item.areaName)
|
||||||
if (item.frequency == 0) {
|
// if (item.frequency == 0) {
|
||||||
item.frequency = 1.1
|
// item.frequency = 1.1
|
||||||
} else if (item.frequency == 1) {
|
// } else if (item.frequency == 1) {
|
||||||
item.frequency = 1.3
|
// item.frequency = 1.3
|
||||||
}
|
// }
|
||||||
echartsArr.push(item.frequency)
|
echartsArr.push(item.frequency)
|
||||||
})
|
})
|
||||||
areaStatistics.value = {
|
areaStatistics.value = {
|
||||||
@@ -68,7 +68,7 @@ const Processing = (list: any) => {
|
|||||||
normal: {
|
normal: {
|
||||||
//这里是颜色
|
//这里是颜色
|
||||||
color: function (params: any) {
|
color: function (params: any) {
|
||||||
if (params.data == 1.1) {
|
if (params.data == 0) {
|
||||||
return '#B3B3B3'
|
return '#B3B3B3'
|
||||||
} else {
|
} else {
|
||||||
return '#07CCCA '
|
return '#07CCCA '
|
||||||
@@ -90,12 +90,11 @@ const Grade = (list: any) => {
|
|||||||
let echartsArr: string[] = []
|
let echartsArr: string[] = []
|
||||||
list.voltageLevelCalculation.forEach((item: any) => {
|
list.voltageLevelCalculation.forEach((item: any) => {
|
||||||
echartsndArr.push(item.voltageLevel)
|
echartsndArr.push(item.voltageLevel)
|
||||||
if (item.frequency == 0) {
|
// if (item.frequency == 0) {
|
||||||
|
// item.frequency = 1.1
|
||||||
item.frequency = 1.1
|
// } else if (item.frequency == 1) {
|
||||||
} else if (item.frequency == 1) {
|
// item.frequency = 1.3
|
||||||
item.frequency = 1.3
|
// }
|
||||||
}
|
|
||||||
echartsArr.push(item.frequency)
|
echartsArr.push(item.frequency)
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -138,7 +137,7 @@ const Grade = (list: any) => {
|
|||||||
normal: {
|
normal: {
|
||||||
//这里是颜色
|
//这里是颜色
|
||||||
color: function (params: any) {
|
color: function (params: any) {
|
||||||
if (params.data == 1.1) {
|
if (params.data == 0) {
|
||||||
return '#B3B3B3'
|
return '#B3B3B3'
|
||||||
} else {
|
} else {
|
||||||
return '#07CCCA '
|
return '#07CCCA '
|
||||||
@@ -175,17 +174,17 @@ const Relation = (list: any, interval: number) => {
|
|||||||
// item.linked = 3.14159;
|
// item.linked = 3.14159;
|
||||||
// item.notAssociated = 3.14159;
|
// item.notAssociated = 3.14159;
|
||||||
// }
|
// }
|
||||||
if (item.linked == 0) {
|
// if (item.linked == 0) {
|
||||||
item.linked = 1.1
|
// item.linked = 1.1
|
||||||
} else if (item.linked == 1) {
|
// } else if (item.linked == 1) {
|
||||||
item.linked = 1.3
|
// item.linked = 1.3
|
||||||
}
|
// }
|
||||||
echartsArr.push(item.linked)
|
echartsArr.push(item.linked)
|
||||||
if (item.notAssociated == 0) {
|
// if (item.notAssociated == 0) {
|
||||||
item.notAssociated = 1.1
|
// item.notAssociated = 1.1
|
||||||
} else if (item.notAssociated == 1) {
|
// } else if (item.notAssociated == 1) {
|
||||||
item.notAssociated = 1.3
|
// item.notAssociated = 1.3
|
||||||
}
|
// }
|
||||||
echartswArr.push(item.notAssociated)
|
echartswArr.push(item.notAssociated)
|
||||||
})
|
})
|
||||||
monthlyStatistics.value = {
|
monthlyStatistics.value = {
|
||||||
@@ -239,7 +238,7 @@ const Relation = (list: any, interval: number) => {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
color: function (params: any) {
|
color: function (params: any) {
|
||||||
if (params.data == 1.1) {
|
if (params.data == 0) {
|
||||||
return '#B3B3B3'
|
return '#B3B3B3'
|
||||||
} else {
|
} else {
|
||||||
return '#07CCCA '
|
return '#07CCCA '
|
||||||
@@ -265,7 +264,7 @@ const Relation = (list: any, interval: number) => {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
color: function (params: any) {
|
color: function (params: any) {
|
||||||
if (params.data == 1.1) {
|
if (params.data == 0) {
|
||||||
return '#B3B3B3'
|
return '#B3B3B3'
|
||||||
} else {
|
} else {
|
||||||
return '#Ff6600'
|
return '#Ff6600'
|
||||||
@@ -292,3 +291,4 @@ const layout = mainHeight(150) as any
|
|||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
>>>>>>> c902dabb73a92b43a23970969d750508558b5400
|
||||||
|
|||||||
@@ -249,7 +249,7 @@ const initThird = () => {
|
|||||||
backgroundColor: '#fff', //背景色,
|
backgroundColor: '#fff', //背景色,
|
||||||
animation: false,
|
animation: false,
|
||||||
title: {
|
title: {
|
||||||
text: '触发类型',
|
text: '暂降类型',
|
||||||
x: 'center'
|
x: 'center'
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -277,7 +277,7 @@ const initThird = () => {
|
|||||||
},
|
},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name: '触发类型',
|
name: '暂降类型',
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
radius: '65%',
|
radius: '65%',
|
||||||
center: ['50%', '60%'],
|
center: ['50%', '60%'],
|
||||||
|
|||||||
@@ -109,7 +109,7 @@
|
|||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12" class="mTop">
|
<el-col :span="12" class="mTop">
|
||||||
<div class="grid-content">
|
<div class="grid-content">
|
||||||
<div class="divBox">触发类型</div>
|
<div class="divBox">暂降类型</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12" class="mTop">
|
<el-col :span="12" class="mTop">
|
||||||
|
|||||||
@@ -117,7 +117,7 @@
|
|||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12" class="mTop">
|
<el-col :span="12" class="mTop">
|
||||||
<div class="grid-content">
|
<div class="grid-content">
|
||||||
<div class="divBox">触发类型</div>
|
<div class="divBox">暂降类型</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12" class="mTop">
|
<el-col :span="12" class="mTop">
|
||||||
|
|||||||
@@ -124,7 +124,7 @@
|
|||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<div class="grid-content">
|
<div class="grid-content">
|
||||||
<div class="divBox">触发类型</div>
|
<div class="divBox">暂降类型</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
|
|||||||
@@ -108,7 +108,7 @@ const list = ref([
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
{ field: 'duration', title: '持续时间(s)', width: '120' },
|
{ field: 'duration', title: '持续时间(s)', width: '120' },
|
||||||
{ field: 'advanceType', title: '触发类型(机器判断)', width: '150' }
|
{ field: 'advanceType', title: '暂降类型(机器判断)', width: '150' }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|||||||
Reference in New Issue
Block a user