测试问题整改
This commit is contained in:
@@ -63,7 +63,35 @@ export function getLineInfoById(data:any) {
|
||||
}
|
||||
export function getLineRank(data:any) {
|
||||
return request({
|
||||
url: 'harmonic-boot/PollutionSubstation/getLineRank',
|
||||
url: '/harmonic-boot/PollutionSubstation/getLineRank',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
export function deptInfo(data:any) {
|
||||
return request({
|
||||
url: '/harmonic-boot/detailAnalysis/deptInfo',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
export function getXbLineInfoById(data:any) {
|
||||
return request({
|
||||
url: '/harmonic-boot/detailAnalysis/getXbLineInfoById',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
export function getSubInfoById(data:any) {
|
||||
return request({
|
||||
url: '/harmonic-boot/detailAnalysis/getSubInfoById',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
export function getXbLineRank(data:any) {
|
||||
return request({
|
||||
url: '/harmonic-boot/detailAnalysis/getXbLineRank',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
|
||||
27253
src/assets/map/中国.json
27253
src/assets/map/中国.json
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@@ -24,7 +24,7 @@ const { push, options, currentRoute } = useRouter()
|
||||
const url = '/api-docx/excelreport' + currentRoute.value?.href?.split('?')[1]
|
||||
console.log("🚀 ~ url:", url)
|
||||
const excelOptions = ref({
|
||||
xls: currentRoute.value.href?.split('?')[1].split('.')[1] == 'xls' ? true : true
|
||||
xls: currentRoute.value.href?.split('?')[1].split('.')[1] == 'xls' ? true : false
|
||||
})
|
||||
onMounted(() => {
|
||||
console.log()
|
||||
|
||||
@@ -65,7 +65,7 @@ const initChart = () => {
|
||||
},
|
||||
backgroundColor: 'rgba(0,0,0,0.35)',
|
||||
borderWidth: 0,
|
||||
confine:true,
|
||||
confine: true,
|
||||
...(props.options?.tooltip || null)
|
||||
},
|
||||
toolbox: {
|
||||
@@ -75,9 +75,15 @@ const initChart = () => {
|
||||
saveAsImage: {
|
||||
title: '保存图片',
|
||||
},
|
||||
...(props.options?.toolbox?.featureProps || null),
|
||||
|
||||
|
||||
...(props.options?.toolbox?.featureProps || null)
|
||||
},
|
||||
emphasis: {
|
||||
iconStyle: {
|
||||
borderColor: config.layout.elementUiPrimary[0], // 鼠标悬停时的边框颜色
|
||||
color: config.layout.elementUiPrimary[0] // 鼠标悬停时的图标颜色
|
||||
}
|
||||
},
|
||||
// },
|
||||
...(props.options?.toolbox || null)
|
||||
},
|
||||
@@ -123,9 +129,10 @@ const initChart = () => {
|
||||
series: props.options?.series,
|
||||
...props.options?.options
|
||||
}
|
||||
// console.log(options.series,"获取x轴");
|
||||
handlerBar(options)
|
||||
// 处理柱状图
|
||||
chart.setOption(options,true)
|
||||
chart.setOption(options, true)
|
||||
|
||||
setTimeout(() => {
|
||||
chart.resize()
|
||||
@@ -205,6 +212,9 @@ const handlerXAxis = () => {
|
||||
let temp = {
|
||||
type: 'category',
|
||||
axisTick: { show: false },
|
||||
nameTextStyle: {
|
||||
color: '#000'
|
||||
},
|
||||
axisLine: {
|
||||
// lineStyle: {
|
||||
color: '#000'
|
||||
@@ -214,9 +224,10 @@ const handlerXAxis = () => {
|
||||
// textStyle: {
|
||||
fontFamily: 'dinproRegular',
|
||||
color: '#000',
|
||||
fontSize: '12'
|
||||
fontSize: '12',
|
||||
// }
|
||||
}
|
||||
},
|
||||
// boundaryGap: false,
|
||||
}
|
||||
// props.options?.xAxis 是数组还是对象
|
||||
if (Array.isArray(props.options?.xAxis)) {
|
||||
@@ -234,9 +245,6 @@ const handlerXAxis = () => {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
let throttle: ReturnType<typeof setTimeout>
|
||||
// 动态计算table高度
|
||||
const resizeObserver = new ResizeObserver(entries => {
|
||||
|
||||
@@ -187,6 +187,7 @@ const GetEchar = async (name: string) => {
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
const MapReturn = (name: string) => {
|
||||
|
||||
@@ -22,6 +22,8 @@ const options:any = dictData.state.area
|
||||
const areaName = ref(dictData.state.area[0].name)
|
||||
const jbName = ref(dictData.state.area[0].name)
|
||||
const change = (e: any) => {
|
||||
console.log("🚀 ~ change ~ cascader.value.getCheckedNodes()[0]?.pathLabels.length:", cascader.value.getCheckedNodes()[0]?.pathLabels.length)
|
||||
|
||||
if (cascader.value.getCheckedNodes()[0]?.pathLabels.length == 1) {
|
||||
areaName.value = cascader.value.getCheckedNodes()[0].pathLabels[0]
|
||||
} else if (cascader.value.getCheckedNodes()[0]?.pathLabels.length >= 2) {
|
||||
|
||||
@@ -31,7 +31,7 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { inject, ref, onMounted, nextTick, onUnmounted } from 'vue'
|
||||
import { inject, ref, onMounted, nextTick, onUnmounted,watch } from 'vue'
|
||||
import type TableStore from '@/utils/tableStore'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import Area from '@/components/form/area/index.vue'
|
||||
@@ -81,6 +81,14 @@ const headerFormSecondStyleClose = {
|
||||
height: '0',
|
||||
padding: '0'
|
||||
}
|
||||
watch(
|
||||
() => tableStore.table.params.deptIndex,
|
||||
(newVal) => {
|
||||
setTimeout(() => {
|
||||
areaRef.value.change()
|
||||
}, 0);
|
||||
}
|
||||
)
|
||||
onMounted(() => {
|
||||
if (props.datePicker) {
|
||||
tableStore.table.params.searchBeginTime = datePickerRef.value.timeValue[0]
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<Toolbar style="border-bottom: 1px solid #e4e4e4; border-top: 1px solid #e4e4e4" :editor="editorRef"
|
||||
:defaultConfig="toolbarConfig" mode="default" />
|
||||
<Editor v-bind="$attrs" :defaultConfig="editorConfig" mode="default" @onCreated="handleCreated"
|
||||
style="height: calc(100% - 42px)" />
|
||||
style="height: 300px;overflow-y: auto" />
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
|
||||
@@ -45,14 +45,14 @@
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="source" title="数据来源"></vxe-column>
|
||||
<vxe-column field="useFLag" title="是否启用">
|
||||
<!-- <vxe-column field="useFLag" title="是否启用">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.useFLag === 1 ? 'success' : 'info'" effect="dark"
|
||||
style="cursor: pointer" @click="change(row)">
|
||||
{{ row.useFLag === 1 ? '是' : '否' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-column> -->
|
||||
<vxe-column field="definition" title="定义">
|
||||
<template #default="{ row }">
|
||||
|
||||
@@ -81,11 +81,14 @@
|
||||
<PopupEdit ref="popupEditRef" v-if="popupEditFlag"
|
||||
@getTree="treeRef.loadData(dotList.id), (popupEditFlag = false)" />
|
||||
<!-- 定义 -->
|
||||
<el-dialog v-model="viewFlag" title="定义" width="60%">
|
||||
<div class="editor" ref="editorRef" v-html="summary" style="min-height: 300px;" />
|
||||
<el-dialog draggable v-model="viewFlag" title="定义" width="60%">
|
||||
<div style="min-height: 300px; max-height: 55vh;">
|
||||
<div class="editor" ref="editorRef" v-html="summary" />
|
||||
|
||||
</div>
|
||||
</el-dialog>
|
||||
<!-- 删除 -->
|
||||
<el-dialog v-model="dialogVisible" title="请选择需要删除的数据" width="400">
|
||||
<el-dialog draggable v-model="dialogVisible" title="请选择需要删除的数据" width="400">
|
||||
<el-tree-select v-model="TreeValue" :data="TreeData" filterable check-strictly :props="defaultProps"
|
||||
default-expand-all :render-after-expand="false" />
|
||||
<template #footer>
|
||||
@@ -228,7 +231,7 @@ const view = (row: any) => {
|
||||
|
||||
span.parentNode.replaceChild(newDiv, span);
|
||||
});
|
||||
|
||||
|
||||
}, 100)
|
||||
|
||||
//
|
||||
|
||||
@@ -1,54 +1,37 @@
|
||||
<template>
|
||||
<div
|
||||
class="charts"
|
||||
style="position: relative; width: 100%"
|
||||
:style="`height: calc(${tableStore.table.height} - 75px)`"
|
||||
v-loading="loading"
|
||||
>
|
||||
<div
|
||||
style="position: absolute; right: 60px; top: 5px; font-weight: bold"
|
||||
v-if="!loading && tableStore.table.data.length != 0"
|
||||
>
|
||||
<el-tag
|
||||
style="
|
||||
<div class="charts" style="position: relative; width: 100%" v-loading="loading">
|
||||
<div style="position: absolute; right: 60px; top: 5px; font-weight: bold"
|
||||
v-if="!loading && tableStore.table.data.length != 0">
|
||||
<el-tag style="
|
||||
background: #cc0000;
|
||||
width: 30px;
|
||||
height: 15px;
|
||||
border: 1px solid #cc0000;
|
||||
float: left;
|
||||
margin-top: 2px;
|
||||
"
|
||||
></el-tag>
|
||||
"></el-tag>
|
||||
<span style="color: #cc0000; font-weight: 400; float: left">  在线率<60%   </span>
|
||||
<el-tag
|
||||
size="mini"
|
||||
style="
|
||||
<el-tag size="mini" style="
|
||||
background: #ffcc33;
|
||||
width: 30px;
|
||||
height: 15px;
|
||||
border: 1px solid #ffcc33;
|
||||
float: left;
|
||||
margin-top: 2px;
|
||||
"
|
||||
></el-tag>
|
||||
<span style="color: #ffcc33; font-weight: 400; float: left">  60%≤在线率<90%   </span>
|
||||
<el-tag
|
||||
style="
|
||||
"></el-tag>
|
||||
<span style="color: #ffcc33; font-weight: 400; float: left">  60%≤在线率<90%   </span>
|
||||
<el-tag style="
|
||||
background: #339966;
|
||||
width: 30px;
|
||||
height: 15px;
|
||||
border: 1px solid #339966;
|
||||
float: left;
|
||||
margin-top: 2px;
|
||||
"
|
||||
></el-tag>
|
||||
<span style="color: #339966; font-weight: 400; float: left">  在线率≥90%</span>
|
||||
"></el-tag>
|
||||
<span style="color: #339966; font-weight: 400; float: left">  在线率≥90%</span>
|
||||
</div>
|
||||
<my-echart
|
||||
class="mt10"
|
||||
:style="`margin-top:50px;height: calc(${tableStore.table.height} - 120px)`"
|
||||
:options="options"
|
||||
/>
|
||||
<my-echart class="mt10" :style="`margin-top:50px;height: calc(${tableStore.table.height} - 135px)`"
|
||||
:options="options" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
@@ -126,19 +109,7 @@ const tableStore = new TableStore({
|
||||
legend: {
|
||||
show: false
|
||||
},
|
||||
toolbox: {
|
||||
show: true,
|
||||
feature: {
|
||||
saveAsImage: {
|
||||
// bottom: '10px',
|
||||
show: true,
|
||||
title: '保存'
|
||||
// yAxisIndex: 'none'
|
||||
}
|
||||
},
|
||||
right: 0,
|
||||
top: 0
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
backgroundColor: '#fff',
|
||||
textStyle: {
|
||||
@@ -152,22 +123,14 @@ const tableStore = new TableStore({
|
||||
// legendColorList[i]
|
||||
// }"></p>
|
||||
tips += `<div style="min-width:80px;display:flex;justify-content:space-between;align-items:center">
|
||||
<span style="margin-left:5px;dislpay:block;min-width:80px;color:#000">${
|
||||
params[i].seriesName
|
||||
}</span> ${
|
||||
params[i].seriesName == '在线率' ? params[i].value?.toFixed(2) : params[i].value
|
||||
} </div>`
|
||||
<span style="margin-left:5px;dislpay:block;min-width:80px;color:#000">${params[i].seriesName
|
||||
}</span> ${params[i].seriesName == '在线率' ? params[i].value?.toFixed(2) : params[i].value
|
||||
} </div>`
|
||||
}
|
||||
return tips
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
top: '50px', // 等价于 y: '16%'
|
||||
left: '10px',
|
||||
right: '10px',
|
||||
bottom: '40px',
|
||||
containLabel: true
|
||||
},
|
||||
|
||||
calculable: true,
|
||||
xAxis: {
|
||||
name: titleX,
|
||||
@@ -348,7 +311,7 @@ const tableStore = new TableStore({
|
||||
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
onMounted(() => {})
|
||||
onMounted(() => { })
|
||||
defineExpose({ getTableStoreParams })
|
||||
</script>
|
||||
<style scoped lang="scss"></style>
|
||||
|
||||
@@ -131,6 +131,9 @@ import TableHeader from '@/components/table/header/index.vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import charts from './components/charts.vue'
|
||||
defineOptions({
|
||||
name: 'harmonic-boot/harmonic/getIntegrityData'
|
||||
})
|
||||
const tableRef = ref()
|
||||
const chartsRef = ref()
|
||||
const dictData = useDictData()
|
||||
@@ -183,7 +186,7 @@ const handleClick = (tab: any, e: any) => {
|
||||
// const datePickerRef = ref()
|
||||
const tableHeaderRef = ref()
|
||||
const tableStore = new TableStore({
|
||||
// publicHeight: 60,
|
||||
publicHeight: 60,
|
||||
showPage: false,
|
||||
url: '/device-boot/LineIntegrityData/getLineIntegrityData',
|
||||
method: 'POST',
|
||||
@@ -352,17 +355,17 @@ watch(
|
||||
)
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.online {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.online_header {
|
||||
width: 100%;
|
||||
max-height: 140px;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.online_main {
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
// .online {
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
// .online_header {
|
||||
// width: 100%;
|
||||
// max-height: 140px;
|
||||
// padding: 10px;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
// .online_main {
|
||||
// padding: 0 10px;
|
||||
// }
|
||||
// }
|
||||
</style>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<my-echart
|
||||
v-loading="loading"
|
||||
class="mt10"
|
||||
:style="`height: calc(${tableStore.table.height} - 75px)`"
|
||||
:style="`height: calc(${tableStore.table.height} - 135px)`"
|
||||
:options="options"
|
||||
/>
|
||||
</template>
|
||||
@@ -65,19 +65,7 @@ const tableStore = new TableStore({
|
||||
title: {
|
||||
text: title
|
||||
},
|
||||
toolbox: {
|
||||
show: true,
|
||||
feature: {
|
||||
saveAsImage: {
|
||||
// bottom: '10px',
|
||||
show: true,
|
||||
title: '保存'
|
||||
// yAxisIndex: 'none'
|
||||
}
|
||||
},
|
||||
right: 10,
|
||||
top: 0
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
formatter: function (params: any) {
|
||||
var tips = ''
|
||||
@@ -94,13 +82,7 @@ const tableStore = new TableStore({
|
||||
return tips
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
top: '50px', // 等价于 y: '16%'
|
||||
left: '10px',
|
||||
right: '10px',
|
||||
bottom: '80px',
|
||||
containLabel: true
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
name: titleX,
|
||||
data: tableStore.table.data.type
|
||||
|
||||
@@ -131,6 +131,9 @@ import TableHeader from '@/components/table/header/index.vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import charts from './components/charts.vue'
|
||||
defineOptions({
|
||||
name: 'harmonic-boot/area/harmonicDistortionRate'
|
||||
})
|
||||
const tableRef = ref()
|
||||
const onlineChartsRef = ref()
|
||||
const dictData = useDictData()
|
||||
@@ -185,7 +188,7 @@ const handleClick = (tab: any, e: any) => {
|
||||
// const datePickerRef = ref()
|
||||
const tableHeaderRef = ref()
|
||||
const tableStore = new TableStore({
|
||||
// publicHeight: 60,
|
||||
publicHeight: 60,
|
||||
showPage: false,
|
||||
url: '/harmonic-boot/tHDistortion/getTHDistortionData',
|
||||
method: 'POST',
|
||||
@@ -303,17 +306,17 @@ watch(
|
||||
)
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.online {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.online_header {
|
||||
width: 100%;
|
||||
max-height: 140px;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.online_main {
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
// .online {
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
// .online_header {
|
||||
// width: 100%;
|
||||
// max-height: 140px;
|
||||
// padding: 10px;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
// .online_main {
|
||||
// padding: 0 10px;
|
||||
// }
|
||||
// }
|
||||
</style>
|
||||
|
||||
@@ -1,52 +1,37 @@
|
||||
<template>
|
||||
<div
|
||||
class="charts"
|
||||
style="position: relative; width: 100%"
|
||||
:style="`height: calc(${tableStore.table.height} - 75px)`"
|
||||
>
|
||||
<div class="charts" style="position: relative; width: 100%">
|
||||
|
||||
<div style="position: absolute; right: 60px; top: 5px; font-weight: bold" v-if="!loading && tableStore.table.data.length != 0">
|
||||
<el-tag
|
||||
style="
|
||||
<div style="position: absolute; right: 60px; top: 5px; font-weight: bold"
|
||||
v-if="!loading && tableStore.table.data.length != 0">
|
||||
<el-tag style="
|
||||
background: #cc0000;
|
||||
width: 30px;
|
||||
height: 15px;
|
||||
border: 1px solid #cc0000;
|
||||
float: left;
|
||||
margin-top: 2px;
|
||||
"
|
||||
></el-tag>
|
||||
"></el-tag>
|
||||
<span style="color: #cc0000; font-weight: 400; float: left">  在线率<60%   </span>
|
||||
<el-tag
|
||||
size="mini"
|
||||
style="
|
||||
<el-tag size="mini" style="
|
||||
background: #ffcc33;
|
||||
width: 30px;
|
||||
height: 15px;
|
||||
border: 1px solid #ffcc33;
|
||||
float: left;
|
||||
margin-top: 2px;
|
||||
"
|
||||
></el-tag>
|
||||
<span style="color: #ffcc33; font-weight: 400; float: left">  60%≤在线率<90%   </span>
|
||||
<el-tag
|
||||
style="
|
||||
"></el-tag>
|
||||
<span style="color: #ffcc33; font-weight: 400; float: left">  60%≤在线率<90%   </span>
|
||||
<el-tag style="
|
||||
background: #339966;
|
||||
width: 30px;
|
||||
height: 15px;
|
||||
border: 1px solid #339966;
|
||||
float: left;
|
||||
margin-top: 2px;
|
||||
"
|
||||
></el-tag>
|
||||
<span style="color: #339966; font-weight: 400; float: left">  在线率>90%</span>
|
||||
"></el-tag>
|
||||
<span style="color: #339966; font-weight: 400; float: left">  在线率>90%</span>
|
||||
</div>
|
||||
<my-echart
|
||||
v-loading="loading"
|
||||
class="mt10"
|
||||
:style="`height: calc(${tableStore.table.height} - 100px)`"
|
||||
:options="options"
|
||||
/>
|
||||
<my-echart v-loading="loading" :style="`height: calc(${tableStore.table.height} - 125px)`" :options="options" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
@@ -153,11 +138,9 @@ const tableStore = new TableStore({
|
||||
// legendColorList[i]
|
||||
// }"></p>
|
||||
tips += `<div style="min-width:80px;display:flex;justify-content:space-between;align-items:center">
|
||||
<span style="margin-left:5px;dislpay:block;min-width:80px;color:#000">${
|
||||
params[i].seriesName
|
||||
}</span> ${
|
||||
params[i].seriesName == '在线率' ? params[i].value?.toFixed(2) : params[i].value
|
||||
} </div>`
|
||||
<span style="margin-left:5px;dislpay:block;min-width:80px;color:#000">${params[i].seriesName
|
||||
}</span> ${params[i].seriesName == '在线率' ? params[i].value?.toFixed(2) : params[i].value
|
||||
} </div>`
|
||||
}
|
||||
return tips
|
||||
}
|
||||
@@ -178,58 +161,32 @@ const tableStore = new TableStore({
|
||||
{
|
||||
type: 'value',
|
||||
name: '台',
|
||||
nameTextStyle: {
|
||||
color: '#000',
|
||||
verticalAlign: 'top', //标题位置
|
||||
padding: [-22, 0, 10, 0]
|
||||
},
|
||||
|
||||
// max:50,
|
||||
// interval: 2,
|
||||
splitLine: {
|
||||
show: true
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
color: '#000'
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
symbol: ['none', 'arrow'],
|
||||
symbolOffset: 25, //箭头距离x轴末端距离
|
||||
lineStyle: {
|
||||
// shadowOffsetY: -25,
|
||||
color: '#000',
|
||||
shadowColor: '#000' //设置阴影的颜色
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
{
|
||||
type: 'value',
|
||||
name: '%',
|
||||
nameTextStyle: {
|
||||
color: '#000',
|
||||
verticalAlign: 'top', //标题位置
|
||||
padding: [-22, 0, 10, 0]
|
||||
},
|
||||
|
||||
max: 100,
|
||||
// nameTextStyle: {
|
||||
// color: "#000"
|
||||
// },
|
||||
position: 'right',
|
||||
offset: 0,
|
||||
axisLine: {
|
||||
show: true,
|
||||
// symbol: ["none", "arrow"],
|
||||
symbolOffset: 20, //箭头距离x轴末端距离
|
||||
lineStyle: {
|
||||
shadowOffsetY: -20,
|
||||
color: '#000',
|
||||
shadowColor: '#000' //设置阴影的颜色
|
||||
}
|
||||
},
|
||||
|
||||
splitLine: {
|
||||
show: true
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
@@ -452,7 +409,7 @@ const tableStore = new TableStore({
|
||||
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
onMounted(() => {})
|
||||
onMounted(() => { })
|
||||
defineExpose({ getTableStoreParams })
|
||||
</script>
|
||||
<style scoped lang="scss"></style>
|
||||
|
||||
@@ -199,6 +199,9 @@ import TableHeader from '@/components/table/header/index.vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import charts from './components/charts.vue'
|
||||
defineOptions({
|
||||
name: 'harmonic-boot/area/terminalonlinerate'
|
||||
})
|
||||
const tableRef = ref()
|
||||
const chartsRef = ref()
|
||||
const dictData = useDictData()
|
||||
@@ -251,10 +254,11 @@ const handleClick = (tab: any, e: any) => {
|
||||
// const datePickerRef = ref()
|
||||
const tableHeaderRef = ref()
|
||||
const tableStore = new TableStore({
|
||||
// publicHeight: 60,
|
||||
publicHeight: 100,
|
||||
showPage: false,
|
||||
url: '/harmonic-boot/terminal/getTerminalData',
|
||||
method: 'POST',
|
||||
|
||||
column: [
|
||||
{
|
||||
title: formData.value.statisticalType.name,
|
||||
@@ -399,19 +403,7 @@ watch(
|
||||
)
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.online {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.online_header {
|
||||
width: 100%;
|
||||
max-height: 140px;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.online_main {
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.table_legend {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
|
||||
@@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<div class="default-main">
|
||||
|
||||
<TableHeader date-picker area>
|
||||
<template #select>
|
||||
<!-- <el-form-item label="统计类型:">
|
||||
<el-select v-model="tableStore.table.params.statisticalType" placeholder="请选择统计类型" value-key="id">
|
||||
<el-option v-for="item in classificationData" :key="item.id" :label="item.name" :value="item">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="电压等级:">
|
||||
<el-select v-model="tableStore.table.params.scale" filterable multiple collapse-tags clearable
|
||||
placeholder="请选择电压等级" value-key="id">
|
||||
<el-option v-for="item in voltageleveloption" :key="item.id" :label="item.name" :value="item">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="终端厂家:">
|
||||
<el-select v-model="tableStore.table.params.manufacturer" filterable multiple collapse-tags
|
||||
clearable placeholder="请选择终端厂家" value-key="id">
|
||||
<el-option v-for="item in terminaloption" :key="item.id" :label="item.name" :value="item">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="干扰源类型:">
|
||||
<el-select v-model="tableStore.table.params.loadType" filterable multiple collapse-tags clearable
|
||||
placeholder="请选择干扰源类型" value-key="id">
|
||||
<el-option v-for="item in interfereoption" :key="item.id" :label="item.name" :value="item">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
</TableHeader>
|
||||
<Table ref="tableRef" isGroup />
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, provide } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
const dictData = useDictData()
|
||||
defineOptions({
|
||||
name: 'harmonic-boot/detailedAnalysis/station'
|
||||
})
|
||||
const view = ref(true)
|
||||
const classificationData = dictData.getBasicData('Statistical_Type', ["Report_Type"])
|
||||
const voltageleveloption = dictData.getBasicData('Dev_Voltage_Stand')
|
||||
const terminaloption = dictData.getBasicData('Dev_Manufacturers')
|
||||
const interfereoption = dictData.getBasicData('Interference_Source')
|
||||
|
||||
|
||||
const tableStore = new TableStore({
|
||||
url: '/harmonic-boot/detailAnalysis/warnSubstationDetail',
|
||||
method: 'POST',
|
||||
column: [
|
||||
{
|
||||
field: 'index',
|
||||
title: '序号',
|
||||
width: '60',
|
||||
formatter: (row: any) => {
|
||||
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
|
||||
}
|
||||
},
|
||||
{ field: 'provinceCompany', title: '地级区', minWidth: "100px", },
|
||||
{ field: 'cityCompany', title: '地区公司', minWidth: "100px", },
|
||||
{ field: 'plantName', title: '变电站名称', minWidth: "180px", },
|
||||
{ field: 'plantVoltageLevel', title: '电压等级', minWidth: "100px", },
|
||||
{ field: 'onlineMonitorCounts', title: '在线监测点数量(个)', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "150px", },
|
||||
{ field: 'alertMonitorCounts', title: '告警监测点数量(个)', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "150px", },
|
||||
{ field: 'alertCounts', title: '告警次数', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
{ field: 'alertAlarmFrequency', title: '告警频次(次/点)', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "150px", },
|
||||
{
|
||||
title: '各项稳态指标告警频次(次/点)', children: [
|
||||
{ field: 'frequencyDeviation', title: '频率偏差', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
{ field: 'voltageDeviation', title: '电压偏差', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
{ field: 'harmonicVoltage', title: '谐波电压', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
{ field: 'harmonicCurrent', title: '谐波电流', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
{ field: 'threePhaseVoltageUnbalance', title: '三相电压不平衡度', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "180px", },
|
||||
{ field: 'flicker', title: '闪变', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
{ field: 'negative', title: '负序电流', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
{ field: 'interHarmonic', title: '间谐波电压', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
]
|
||||
}, {
|
||||
title: '各项暂态指标告警频次(次/点)', children: [
|
||||
{ field: 'shortInterruption', title: '短时中断', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
{ field: 'voltageDip', title: '电压暂降', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
{ field: 'voltageSwell', title: '电压暂升', formatter: (row: any) => { return row.cellValue == -1 ? '/' : row.cellValue }, minWidth: "100px", },
|
||||
]
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
|
||||
loadCallback: () => {
|
||||
|
||||
}
|
||||
})
|
||||
tableStore.table.params.statisticalType = classificationData[0]
|
||||
tableStore.table.params.powerFlag = 2
|
||||
tableStore.table.params.monitorFlag = 2
|
||||
tableStore.table.params.scale = []
|
||||
tableStore.table.params.manufacturer = []
|
||||
tableStore.table.params.loadType = []
|
||||
const wp = ref({})
|
||||
|
||||
provide('tableStore', tableStore)
|
||||
onMounted(() => {
|
||||
tableStore.index()
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
@@ -1,7 +1,8 @@
|
||||
<template>
|
||||
|
||||
<el-dialog v-model="dialogVisible" :title="title" width="70%">
|
||||
<vxe-table height="400px" auto-resize :data="tableData" v-loading="loading" v-bind="defaultAttribute"
|
||||
<el-dialog draggable v-model="dialogVisible" :title="title" width="70%">
|
||||
<div style="height: 55vh">
|
||||
<vxe-table height="auto" auto-resize :data="tableData" v-loading="loading" v-bind="defaultAttribute"
|
||||
:key="key">
|
||||
|
||||
<vxe-column field="name" title="名称"></vxe-column>
|
||||
@@ -60,7 +61,7 @@
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
</template>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
|
||||
<el-dialog v-model="dialogVisible" title="排名前10的监测点" width="1200">
|
||||
<div style="height: 500px">
|
||||
<div style="height: 55vh">
|
||||
<my-echart class="tall" :options="echartList" />
|
||||
</div>
|
||||
|
||||
|
||||
@@ -188,9 +188,8 @@ import { ref, onMounted, provide } from 'vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import * as echarts from 'echarts/core'
|
||||
defineOptions({
|
||||
name: 'Region/distribution'
|
||||
name: 'harmonic-boot/qydetailedAnalysis/pollutionqy'
|
||||
})
|
||||
|
||||
const dictData = useDictData()
|
||||
const echartList = ref({})
|
||||
const provinceDetailsRef = ref()
|
||||
@@ -494,7 +493,7 @@ const histogram = (res: any) => {
|
||||
onMounted(() => {
|
||||
tableStore.index()
|
||||
})
|
||||
const layout = mainHeight(123) as any
|
||||
const layout = mainHeight(133) as any
|
||||
const layout1 = mainHeight(93) as any
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@@ -0,0 +1,133 @@
|
||||
<template>
|
||||
|
||||
<el-dialog draggable v-model="dialogVisible" :title="title" width="70%">
|
||||
|
||||
<div style="height: 55vh">
|
||||
<vxe-table height="auto" auto-resize :data="tableData" v-loading="loading" v-bind="defaultAttribute"
|
||||
:key="key">
|
||||
|
||||
|
||||
|
||||
<div v-if="!voltageLevelFlag">
|
||||
<vxe-column field="name" title="名称" min-width="150"></vxe-column>
|
||||
<vxe-column field="onlineCount" title="在线监测点数" min-width="120">
|
||||
<template #default="scope">
|
||||
{{ scope.row.onlineCount == 3.14159 ? '暂无数据' : scope.row.onlineCount }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="overLineCount" min-width="120" title="超标监测点数">
|
||||
<template #default="scope">
|
||||
{{ scope.row.overLineCount == 3.14159 ? '暂无数据' : scope.row.overLineCount }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="averageOverDay" min-width="120" title="平均超标天数">
|
||||
<template #default="scope">
|
||||
{{ scope.row.averageOverDay == 3.14159 ? '暂无数据' : scope.row.averageOverDay }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="ratio" title="超标占比(%)">
|
||||
<template #default="scope">
|
||||
{{ scope.row.ratio == 3.14159 ? '暂无数据' : scope.row.ratio }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="warningFreq" title="告警频次">
|
||||
<template #default="scope">
|
||||
{{ scope.row.warningFreq == 3.14159 ? '暂无数据' : scope.row.warningFreq }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
</div>
|
||||
<div v-else>
|
||||
<vxe-column field="name" title="名称" min-width="150"></vxe-column>
|
||||
<vxe-column field="overDays" title="超标天数"></vxe-column>
|
||||
<vxe-colgroup title="各指标超标次数">
|
||||
<vxe-column field="overThreeTimes" title="3次">
|
||||
<template #default="scope">
|
||||
{{ scope.row.overThreeTimes == 3.14159 ? '暂无数据' : scope.row.overThreeTimes }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="overFiveTimes" title="5次">
|
||||
<template #default="scope">
|
||||
{{ scope.row.overFiveTimes == 3.14159 ? '暂无数据' : scope.row.overFiveTimes }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="overSevenTimes" title="7次">
|
||||
<template #default="scope">
|
||||
{{ scope.row.overSevenTimes == 3.14159 ? '暂无数据' : scope.row.overSevenTimes }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="overElevenTimes" title="11次">
|
||||
<template #default="scope">
|
||||
{{ scope.row.overElevenTimes == 3.14159 ? '暂无数据' : scope.row.overElevenTimes }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="overThirteenTimes" title="13次">
|
||||
<template #default="scope">
|
||||
{{ scope.row.overThirteenTimes == 3.14159 ? '暂无数据' : scope.row.overThirteenTimes }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="overTwentyThreeTimes" title="23次">
|
||||
<template #default="scope">
|
||||
{{ scope.row.overTwentyThreeTimes == 3.14159 ? '暂无数据' : scope.row.overTwentyThreeTimes
|
||||
}}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="overTwentyFiveTimes" title="25次">
|
||||
<template #default="scope">
|
||||
{{ scope.row.overTwentyFiveTimes == 3.14159 ? '暂无数据' : scope.row.overTwentyFiveTimes }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="otherTimes" title="其他次">
|
||||
<template #default="scope">
|
||||
{{ scope.row.otherTimes == 3.14159 ? '暂无数据' : scope.row.otherTimes }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-colgroup>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</vxe-table>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { ref, reactive } from 'vue'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
import { getSubInfoById, getXbLineInfoById } from '@/api/harmonic-boot/area'
|
||||
const dialogVisible = ref(false)
|
||||
const loading = ref(false)
|
||||
const voltageLevelFlag = ref(false)
|
||||
const tableData = ref([])
|
||||
const title = ref('')
|
||||
const key = ref(0)
|
||||
const statisticalName = ref('')
|
||||
const open = (row: any, flag: boolean, params: any) => {
|
||||
voltageLevelFlag.value = flag
|
||||
loading.value = true
|
||||
title.value = row.name + '详情'
|
||||
statisticalName.value = params.statisticalType.name + '(%)'
|
||||
tableData.value = []
|
||||
if (flag) {
|
||||
getXbLineInfoById({ ...params, deptIndex: row.pid, id: row.id }).then((res: any) => {
|
||||
tableData.value = res.data
|
||||
loading.value = false
|
||||
}).catch(() => {
|
||||
loading.value = false
|
||||
})
|
||||
|
||||
} else {
|
||||
getSubInfoById({ ...params, deptIndex: row.id }).then((res: any) => {
|
||||
tableData.value = res.data
|
||||
loading.value = false
|
||||
}).catch(() => {
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
|
||||
key.value += 1
|
||||
dialogVisible.value = true
|
||||
}
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
@@ -0,0 +1,82 @@
|
||||
<template>
|
||||
|
||||
<el-dialog v-model="dialogVisible" title="排名前10的监测点" width="1200">
|
||||
<div style="height: 55vh">
|
||||
<my-echart class="tall" :options="echartList" />
|
||||
</div>
|
||||
|
||||
</el-dialog>
|
||||
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { ref, reactive } from 'vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { getXbLineRank } from '@/api/harmonic-boot/area'
|
||||
import * as echarts from 'echarts/core'
|
||||
const dialogVisible = ref(false)
|
||||
|
||||
const echartList = ref({})
|
||||
|
||||
const open = (row: any,) => {
|
||||
getXbLineRank({ ...row, reportFlag: 3, id: '' }).then((res: any) => {
|
||||
echartList.value = {
|
||||
// title: {
|
||||
// text: ''
|
||||
// },
|
||||
tooltip: {
|
||||
formatter: function (params: any) {
|
||||
// console.log(params);
|
||||
var tips = ''
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
tips += params[i].name + '</br/>'
|
||||
tips += '超标天数' + ':' + ' ' + ' ' + (params[i].value == 0.14159 ? '暂无数据' : params[i].value +'天') + '</br/>'
|
||||
}
|
||||
return tips
|
||||
}
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
name: '监测点',
|
||||
data: res.data.map((item: any) => item.name),
|
||||
axisLabel: {
|
||||
fontFamily: 'dinproRegular',
|
||||
color: '#000',
|
||||
fontSize: '12',
|
||||
rotate: 30,
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
name: '天',// 给X轴加单位
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
|
||||
options: {
|
||||
dataZoom: null,
|
||||
series: [
|
||||
{
|
||||
|
||||
type: 'bar',
|
||||
data: res.data.map((item: any) => {
|
||||
return item.overDays == 3.14159 ? 0.14159 : item.overDays
|
||||
}),
|
||||
barMaxWidth: 30,
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
|
||||
dialogVisible.value = true
|
||||
}
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
@@ -0,0 +1,473 @@
|
||||
<template>
|
||||
<div class="default-main">
|
||||
<TableHeader datePicker ref="header">
|
||||
<template v-slot:select>
|
||||
<el-form-item label="统计类型">
|
||||
<el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型">
|
||||
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-DataAnalysis"
|
||||
@click="rankingClick">排名前10监测点</el-button>
|
||||
</el-form-item>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<div v-loading="tableStore.table.loading" class="pr10">
|
||||
<el-row>
|
||||
<el-col :span="12" class="pd10">
|
||||
<el-tag style="background: #339966; color: #fff" size="small">优</el-tag>
|
||||
<span style="color: #339966">:优秀≤60%</span>
|
||||
<el-tag style="background: #ffcc33; color: #fff" size="small">良</el-tag>
|
||||
<span style="color: #ffcc33">:60%＜良好＜90% </span>
|
||||
<el-tag style="background: #cc0000; color: #fff" size="small">差</el-tag>
|
||||
<span style="color: #cc0000">:极差≥90%</span>
|
||||
<div :style="{ height: layout.height }" style="overflow-y: auto" class="mt10">
|
||||
<div class=" cardBox">
|
||||
<el-card v-for="(item, index) in tableStore.table.data" :key="index">
|
||||
<template #header>
|
||||
<div style="cursor: pointer;" @click="queryline(item, false)">
|
||||
<el-tag v-if="item.data < 60 && item.data > 0"
|
||||
style="color: #fff; background: #339966" size="small">
|
||||
优
|
||||
</el-tag>
|
||||
<el-tag v-if="60 <= item.data && item.data < 90"
|
||||
style="color: #fff; background: #ffcc33" size="small">
|
||||
良
|
||||
</el-tag>
|
||||
<el-tag v-if="90 <= item.data && item.data"
|
||||
style="color: #fff; background: #cc0000" size="small">
|
||||
差
|
||||
</el-tag>
|
||||
<el-tag v-if="item.data == 3.14159 || item.data == 0"
|
||||
style="color: #fff; background: #ccc" size="small">
|
||||
无
|
||||
</el-tag>
|
||||
<span>{{ item.name }}</span>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</template>
|
||||
<div class="card-content">
|
||||
<div class="card-item" v-for="(item1, index1) in item.children"
|
||||
:key="index1" @click="queryline(item1, true)">
|
||||
<el-tag v-if="item1.data == 3.14159 || item1.data == 0"
|
||||
style="background: #ccc; color: #fff" size="small">
|
||||
无
|
||||
</el-tag>
|
||||
<el-tag
|
||||
v-if="0 < item1.data && item1.data < 1 && item1.data !== 3.14159"
|
||||
style="background: #339966; color: #fff" size="small">
|
||||
1级
|
||||
</el-tag>
|
||||
<el-tag
|
||||
v-if="1 <= item1.data && item1.data < 1.2 && item1.data !== 3.14159"
|
||||
style="background: #3399ff; color: #fff" size="small">
|
||||
2级
|
||||
</el-tag>
|
||||
<el-tag
|
||||
v-if="1.2 <= item1.data && item1.data < 1.6 && item1.data !== 3.14159"
|
||||
style="background: #ffcc33; color: #fff" size="small">
|
||||
3级
|
||||
</el-tag>
|
||||
<el-tag
|
||||
v-if="1.6 <= item1.data && item1.data < 2 && item1.data !== 3.14159"
|
||||
style="background: #ff9900; color: #fff" size="small">
|
||||
4级
|
||||
</el-tag>
|
||||
<el-tag v-if="2 <= item1.data && item1.data && item1.data !== 3.14159"
|
||||
style="background: #cc0000; color: #fff" size="small">
|
||||
5级
|
||||
</el-tag>
|
||||
<span class="xdf">
|
||||
<el-tooltip :show-arrow="false" :offset="-0" :content="item1.name"
|
||||
popper-class="atooltip" placement="bottom-start">
|
||||
|
||||
<div class="tooltipText">
|
||||
{{ item1.name }}
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<my-echart class="tall" :options="echartList" />
|
||||
<div class="tall">
|
||||
<vxe-table height="auto" auto-resize :data="dataList" v-bind="defaultAttribute">
|
||||
<vxe-column field="name" title="名称"></vxe-column>
|
||||
<vxe-column field="onlineCount" title="在线监测点数(个)">
|
||||
<template #default="scope">
|
||||
{{ scope.row.onlineCount == 3.14159 ? '暂无数据' : scope.row.onlineCount == 0 ? '/' : scope.row.onlineCount }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="overLineCount" title="超标监测点数(个)">
|
||||
<template #default="scope">
|
||||
{{ scope.row.overLineCount == 3.14159 ? '暂无数据' : scope.row.overLineCount == 0 ? '/': scope.row.overLineCount }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="averageOverDay" title="平均超标天数(天)">
|
||||
<template #default="scope">
|
||||
{{ scope.row.averageOverDay == 3.14159 ? '暂无数据' : scope.row.averageOverDay == 0 ?'/' : scope.row.averageOverDay }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="ratio" title="监测点超标占比(%)">
|
||||
<template #default="scope">
|
||||
{{ scope.row.ratio == 3.14159 ? '暂无数据' : scope.row.ratio == 0 ? '/' : scope.row.ratio }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
|
||||
</vxe-table>
|
||||
</div>
|
||||
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<!-- 详情 -->
|
||||
<provinceDetails ref="provinceDetailsRef" />
|
||||
<!-- 排名前10的监测点 -->
|
||||
<ranking ref="rankingRef" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
import provinceDetails from './components/provinceDetails.vue'
|
||||
import ranking from './components/ranking.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import { ref, onMounted, provide } from 'vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import { deptInfo } from '@/api/harmonic-boot/area'
|
||||
import * as echarts from 'echarts/core'
|
||||
defineOptions({
|
||||
name: 'harmonic-boot/detailedAnalysis/station'
|
||||
})
|
||||
const dictData = useDictData()
|
||||
const echartList = ref({})
|
||||
const provinceDetailsRef = ref()
|
||||
const rankingRef = ref()
|
||||
const dataList = ref([])
|
||||
|
||||
const header = ref()
|
||||
const options = dictData.getBasicData('Indicator_Type', ['PLPC', 'DYPC', 'SXDYBPHD', 'CSSB', 'FXDL', 'JXBDY'])
|
||||
const tableStore = new TableStore({
|
||||
url: '/harmonic-boot/detailAnalysis/deptSubRelations',
|
||||
method: 'POST',
|
||||
column: [],
|
||||
loadCallback: () => {
|
||||
deptInfo(tableStore.table.params).then((res: any) => {
|
||||
histogram(res.data)
|
||||
dataList.value = res.data
|
||||
})
|
||||
header.value.areaRef.change()
|
||||
}
|
||||
})
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
tableStore.table.params.deptIndex = dictData.state.area[0].id
|
||||
tableStore.table.params.statisticalType = options[0]
|
||||
tableStore.table.params.monitorFlag = 2
|
||||
tableStore.table.params.powerFlag = 2
|
||||
tableStore.table.params.statFlag = true
|
||||
tableStore.table.params.serverName = 'event-boot'
|
||||
|
||||
|
||||
|
||||
|
||||
// 地图数处理
|
||||
const rankingClick = () => {
|
||||
rankingRef.value.open(tableStore.table.params)
|
||||
}
|
||||
const queryline = (row: any, flag: boolean) => {
|
||||
provinceDetailsRef.value.open(row, flag, tableStore.table.params)
|
||||
}
|
||||
|
||||
// 表格数据处理
|
||||
// 柱状图数据处理
|
||||
const histogram = (res: any) => {
|
||||
|
||||
|
||||
echartList.value = {
|
||||
title: {
|
||||
text: '监测点超标占比'
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function (params: any) {
|
||||
// console.log(params);
|
||||
var tips = ''
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
tips += params[i].name + '</br/>'
|
||||
tips += '监测点数' + ':' + ' ' + ' ' + (params[i].value == 0.14159 ? '暂无数据' : params[i].value) + '</br/>'
|
||||
}
|
||||
return tips
|
||||
}
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
name: '区域',
|
||||
data: res.map((item: any) => item.name)
|
||||
},
|
||||
yAxis: {
|
||||
name: '等级',// 给X轴加单位
|
||||
min: 0,
|
||||
max: 100,
|
||||
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
|
||||
// 这里重新定义就可以
|
||||
|
||||
},
|
||||
},
|
||||
|
||||
options: {
|
||||
dataZoom: null,
|
||||
series: [
|
||||
{
|
||||
|
||||
type: 'bar',
|
||||
data: res.map((item: any) => {
|
||||
return item.lineRatio == 3.14159 ? 0.14159 : item.lineRatio
|
||||
}),
|
||||
barMaxWidth: 30,
|
||||
|
||||
itemStyle: {
|
||||
normal: {
|
||||
// 随机显示
|
||||
//color:function(d){return "#"+Math.floor(Math.random()*(256*256*256-1)).toString(16);}
|
||||
|
||||
// 定制显示（按顺序）
|
||||
color: function (params) {
|
||||
if (params.value == 0 || params.value == 0.14159) {
|
||||
return '#ccc'
|
||||
} else if (params.value >= 90) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: '#CC0000'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
} else if (60 < params.value && params.value < 90) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: '#FFCC33'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
} else if (
|
||||
|
||||
params.value <= 60 &&
|
||||
params.value >= 0 &&
|
||||
params.value !== 0.05
|
||||
) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: '#339966'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
} else if (params.value == 0.05) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: '#999999'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
markLine: {
|
||||
silent: false,
|
||||
symbol: 'circle',
|
||||
lineStyle: {
|
||||
color: 'red',
|
||||
width: 1
|
||||
},
|
||||
emphasis: {
|
||||
lineStyle: {
|
||||
width: 1
|
||||
}
|
||||
},
|
||||
data: [
|
||||
{
|
||||
name: '',
|
||||
yAxis: 60,
|
||||
lineStyle: {
|
||||
color: '#339966'
|
||||
},
|
||||
label: {
|
||||
//position: "middle",
|
||||
formatter: '{b}',
|
||||
textStyle: {
|
||||
color: '#339966'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
name: '',
|
||||
yAxis: 90,
|
||||
lineStyle: {
|
||||
color: '#FFCC33'
|
||||
},
|
||||
label: {
|
||||
// position: "middle",
|
||||
formatter: '{b}',
|
||||
textStyle: {
|
||||
color: '#FFCC33'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
name: '',
|
||||
yAxis: 100,
|
||||
lineStyle: {
|
||||
color: '#CC0000'
|
||||
},
|
||||
label: {
|
||||
// position: "middle",
|
||||
formatter: '{b}',
|
||||
textStyle: {
|
||||
color: '#CC0000'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
tableStore.index()
|
||||
})
|
||||
const layout = mainHeight(133) as any
|
||||
const layout1 = mainHeight(93) as any
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.tall {
|
||||
height: calc(v-bind('layout1.height') / 2);
|
||||
}
|
||||
|
||||
.tag {
|
||||
color: #fff;
|
||||
border: #fff;
|
||||
margin-left: 5px;
|
||||
width: 28px;
|
||||
}
|
||||
|
||||
.text {
|
||||
font-weight: bold;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
:deep(.cardBox) {
|
||||
|
||||
box-sizing: border-box;
|
||||
overflow: auto;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
grid-template-rows: max-content;
|
||||
grid-gap: 10px;
|
||||
justify-content: center;
|
||||
|
||||
.el-card {
|
||||
background-image: linear-gradient(var(--el-color-primary), var(--el-color-primary-light-3));
|
||||
font-weight: bold;
|
||||
|
||||
|
||||
|
||||
.el-card__header {
|
||||
padding: 10px !important;
|
||||
color: #fff;
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.el-card__body {
|
||||
padding: 10px !important;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
height: 200px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
overflow-y: auto;
|
||||
color: #000;
|
||||
|
||||
.card-item {
|
||||
margin-bottom: 20px;
|
||||
width: 50%;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
.xdf {
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.tooltipText {
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
// width: 50%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-left: 5px;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,543 @@
|
||||
<template>
|
||||
<div class="default-main">
|
||||
<TableHeader area date-picker ref="header">
|
||||
<template v-slot:select>
|
||||
<el-form-item label="统计类型">
|
||||
<el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型">
|
||||
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<div v-loading="tableStore.table.loading" class="pr10">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<MyEchartMap ref="EchartMap" :options="echartMapList" class="map"
|
||||
@getRegionByRegion="getRegionByRegion" />
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<my-echart class="tall" :options="echartList" />
|
||||
<div class="tall">
|
||||
<vxe-table height="auto" auto-resize :data="tableStore.table.data" v-bind="defaultAttribute">
|
||||
<vxe-column field="name" title="名称"></vxe-column>
|
||||
<vxe-column field="data" :title="changeName">
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.data == -1" type="primary" size="small">暂无数据</span>
|
||||
<span v-if="scope.row.data !== -1 && scope.row.data !== 0.1" type="primary"
|
||||
size="small">
|
||||
{{ scope.row.data }}
|
||||
</span>
|
||||
<span v-if="scope.row.data == 0.1" type="primary" size="small">/</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
|
||||
<vxe-column field="data" title="污区严重度评估">
|
||||
<template #default="scope">
|
||||
<span v-if="
|
||||
0 <= scope.row.data &&
|
||||
scope.row.data < 1 &&
|
||||
scope.row.data !== 3.14159
|
||||
" style=" font-weight: bold;color: #339966;">
|
||||
无污染
|
||||
</span>
|
||||
<span v-if="
|
||||
1 <= scope.row.data &&
|
||||
scope.row.data < 1.2 &&
|
||||
scope.row.data !== 3.14159
|
||||
" style=" font-weight: bold;color: #3399ff;">
|
||||
轻微污染
|
||||
</span>
|
||||
<span v-if="
|
||||
1.2 <= scope.row.data &&
|
||||
scope.row.data < 1.6 &&
|
||||
scope.row.data !== 3.14159
|
||||
" style=" font-weight: bold;color: #ffcc33;">
|
||||
轻度污染
|
||||
</span>
|
||||
<span v-if="
|
||||
1.6 <= scope.row.data &&
|
||||
scope.row.data < 2 &&
|
||||
scope.row.data !== 3.14159
|
||||
" style=" font-weight: bold;color: #ff9900;">
|
||||
中度污染
|
||||
</span>
|
||||
<span v-if="
|
||||
2 <= scope.row.data && scope.row.data && scope.row.data !== 3.14159
|
||||
" style=" font-weight: bold;color: #cc0000;">
|
||||
重度污染
|
||||
</span>
|
||||
<span v-if="scope.row.data == 3.14159" style="color: #000;">
|
||||
暂无评估
|
||||
</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="mask"></div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import MyEchartMap from '@/components/echarts/MyEchartMap.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import { ref, onMounted, provide } from 'vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import * as echarts from 'echarts/core'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
defineOptions({
|
||||
name: 'harmonic-boot/detailedAnalysis/pollution'
|
||||
})
|
||||
const EchartMap = ref()
|
||||
const dictData = useDictData()
|
||||
const changeName = ref('')
|
||||
const echartMapList: any = ref({})
|
||||
const echartList = ref({})
|
||||
const header = ref()
|
||||
const list: any = ref([])
|
||||
const geoCoordMap: any = ref([])
|
||||
const options = dictData.getBasicData('Pollution_Statis', ['V_All', 'I_Neg', 'V_Inharm', 'V_Dev', 'V_Unbalance', 'Plt', 'Freq_Dev'])
|
||||
const tableStore = new TableStore({
|
||||
url: '/harmonic-boot/PollutionSubstation/deptSubstationRelations',
|
||||
method: 'POST',
|
||||
column: [],
|
||||
beforeSearchFun: () => { },
|
||||
loadCallback: () => {
|
||||
changeName.value = tableStore.table.params.statisticalType.name
|
||||
map(tableStore.table.data)
|
||||
histogram(tableStore.table.data)
|
||||
EchartMap.value.GetEchar(header.value.areaRef.areaName)
|
||||
console.log("🚀 ~ header.value.areaRef.areaName:", header.value.areaRef.areaName)
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
tableStore.table.params.monitorFlag = 2
|
||||
tableStore.table.params.powerFlag = 2
|
||||
tableStore.table.params.reportFlag = 3
|
||||
|
||||
tableStore.table.params.statisticalType = options[0]
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
// 地图点击事件
|
||||
const getRegionByRegion = (list: any) => {
|
||||
tableStore.table.params.deptIndex = list.id
|
||||
tableStore.onTableAction('search', {})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// 地图数处理
|
||||
const map = (res: any) => {
|
||||
let areaData: any = []
|
||||
let xarr = []
|
||||
let yarr = []
|
||||
let arr = []
|
||||
let arr1: any = []
|
||||
res.forEach(element => {
|
||||
xarr.push(element.name)
|
||||
if (element.data == 0) {
|
||||
element.data = 0.1
|
||||
yarr.push(element.data)
|
||||
}
|
||||
yarr.push(element.data)
|
||||
let p = {
|
||||
name: element.name,
|
||||
value: element.data
|
||||
}
|
||||
arr.push(p)
|
||||
let d = element.name.split('\n')
|
||||
let p1 = {
|
||||
name: d[0],
|
||||
value: element.data
|
||||
}
|
||||
|
||||
arr1.push(p1)
|
||||
})
|
||||
|
||||
|
||||
echartMapList.value = {
|
||||
name: '',
|
||||
title: {
|
||||
text: '电能质量污区图分布'
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function (params) {
|
||||
var tips = ''
|
||||
|
||||
if (params.value === -1 || window.isNaN(params.value)) {
|
||||
tips =
|
||||
"<font style='color:#fff'>" +
|
||||
params.name +
|
||||
'</font><br/>区域污染评估:' +
|
||||
"<font style='color:#fff'><font style='color:#fff'>暂无数据</font><br/>"
|
||||
} else if (params.value === 0.1 || window.isNaN(params.value)) {
|
||||
tips =
|
||||
"<font style='color:#fff'>" +
|
||||
params.name +
|
||||
'</font><br/>区域污染评估:' +
|
||||
"<font style='color:#fff'><font style='color:#fff'>暂无数据</font><br/>"
|
||||
} else {
|
||||
tips +=
|
||||
"<font style='color:#fff'>" +
|
||||
params.name +
|
||||
'</font><br/>区域污染评估' +
|
||||
"<font style='color:#fff'>：" +
|
||||
params.value +
|
||||
'</font><br/>'
|
||||
}
|
||||
return tips
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
visualMap: {
|
||||
min: 0,
|
||||
max: 2,
|
||||
left: 25,
|
||||
bottom: 40,
|
||||
pieces: [
|
||||
{
|
||||
gt: 2,
|
||||
lt: 10000,
|
||||
label: '重度污染',
|
||||
color: '#CC0000',
|
||||
},
|
||||
{
|
||||
gte: 1.2,
|
||||
lt: 1.6,
|
||||
label: '轻度污染',
|
||||
color: '#FFCC33'
|
||||
},
|
||||
{
|
||||
gt: 1.6,
|
||||
lt: 2,
|
||||
label: '中度污染',
|
||||
color: '#FF9900'
|
||||
},
|
||||
{
|
||||
gte: 1,
|
||||
lte: 1.2,
|
||||
label: '轻微污染',
|
||||
color: '#3399FF'
|
||||
},
|
||||
{
|
||||
gte: 0.1,
|
||||
lte: 1,
|
||||
label: '无污染',
|
||||
color: '#339966'
|
||||
},
|
||||
{
|
||||
gte: -1,
|
||||
lte: 0.05,
|
||||
label: '无数据',
|
||||
color: '#ccc'
|
||||
}
|
||||
],
|
||||
},
|
||||
|
||||
options: {
|
||||
series: [
|
||||
{
|
||||
|
||||
type: "map",
|
||||
geoIndex: 0,
|
||||
data: arr1,
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// 柱状图数据处理
|
||||
const histogram = (res: any) => {
|
||||
echartList.value = {
|
||||
title: {
|
||||
text: '区域'
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function (params: any) {
|
||||
// console.log(params);
|
||||
var tips = ''
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
tips += params[i].name + '</br/>'
|
||||
tips += '监测点数' + ':' + ' ' + ' ' + (params[i].value == 0.14159 ? '暂无数据' : params[i].value) + '</br/>'
|
||||
}
|
||||
return tips
|
||||
}
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
name: '区域',
|
||||
data: res.map((item: any) => item.name)
|
||||
},
|
||||
yAxis: {
|
||||
name: '等级',// 给X轴加单位
|
||||
min: 0,
|
||||
max: 2,
|
||||
interval: 0.2,
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
|
||||
// 这里重新定义就可以
|
||||
formatter: function (value, index) {
|
||||
var texts = []
|
||||
if (value === 1) {
|
||||
texts.push('1级')
|
||||
} else if (value === 1.2) {
|
||||
texts.push('2级')
|
||||
} else if (value === 1.4) {
|
||||
texts.push('3级')
|
||||
} else if (value === 1.6) {
|
||||
texts.push('4级')
|
||||
} else if (value === 2) {
|
||||
texts.push('5级')
|
||||
}
|
||||
return texts
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
options: {
|
||||
dataZoom: null,
|
||||
series: [
|
||||
{
|
||||
|
||||
type: 'bar',
|
||||
data: res.map((item: any) => {
|
||||
return item.data == 3.14159 ? 0.14159 : item.data
|
||||
}),
|
||||
barMaxWidth: 30,
|
||||
|
||||
itemStyle: {
|
||||
normal: {
|
||||
// 随机显示
|
||||
//color:function(d){return "#"+Math.floor(Math.random()*(256*256*256-1)).toString(16);}
|
||||
|
||||
// 定制显示（按顺序）
|
||||
color: function (params) {
|
||||
if (params.value == 0 || params.value == 0.14159) {
|
||||
return '#ccc'
|
||||
} else if (params.value > 2) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: '#CC0000'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
} else if (1.6 < params.value && params.value <= 2) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: '#FF9900'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
} else if (1.2 < params.value && params.value <= 1.6) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: '#FFCC33'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
} else if (1 < params.value && params.value <= 1.2) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: '#3399FF'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
} else if (
|
||||
0 < params.value &&
|
||||
params.value <= 1 &&
|
||||
params.value >= 0 &&
|
||||
params.value !== 0.05
|
||||
) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: '#339966'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
} else if (params.value == 0.05) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: '#999999'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
markLine: {
|
||||
silent: false,
|
||||
symbol: 'circle',
|
||||
lineStyle: {
|
||||
color: 'red',
|
||||
width: 1
|
||||
},
|
||||
emphasis: {
|
||||
lineStyle: {
|
||||
width: 1
|
||||
}
|
||||
},
|
||||
data: [
|
||||
{
|
||||
name: '',
|
||||
yAxis: 1,
|
||||
lineStyle: {
|
||||
color: '#339966'
|
||||
},
|
||||
label: {
|
||||
//position: "middle",
|
||||
formatter: '{b}',
|
||||
textStyle: {
|
||||
color: '#339966'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '',
|
||||
yAxis: 1.2,
|
||||
lineStyle: {
|
||||
color: '#3399FF'
|
||||
},
|
||||
label: {
|
||||
// position: "middle",
|
||||
formatter: '{b}',
|
||||
textStyle: {
|
||||
color: '#3399FF'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '',
|
||||
yAxis: 1.4,
|
||||
lineStyle: {
|
||||
color: '#FFCC33'
|
||||
},
|
||||
label: {
|
||||
// position: "middle",
|
||||
formatter: '{b}',
|
||||
textStyle: {
|
||||
color: '#FFCC33'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '',
|
||||
yAxis: 1.6,
|
||||
lineStyle: {
|
||||
color: '#FF9900'
|
||||
},
|
||||
label: {
|
||||
// position: "middle",
|
||||
formatter: '{b}',
|
||||
textStyle: {
|
||||
color: '#FF9900'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '',
|
||||
yAxis: 2,
|
||||
lineStyle: {
|
||||
color: '#CC0000'
|
||||
},
|
||||
label: {
|
||||
// position: "middle",
|
||||
formatter: '{b}',
|
||||
textStyle: {
|
||||
color: '#CC0000'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
setTimeout(() => {
|
||||
tableStore.index()
|
||||
}, 10)
|
||||
})
|
||||
const layout = mainHeight(83) as any
|
||||
const layout1 = mainHeight(93) as any
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.map {
|
||||
height: v-bind('layout.height');
|
||||
}
|
||||
|
||||
.tall {
|
||||
height: calc(v-bind('layout1.height') / 2);
|
||||
}
|
||||
|
||||
.mask {
|
||||
width: 100px;
|
||||
height: 150px;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
position: absolute;
|
||||
left: 25px;
|
||||
bottom: 40px;
|
||||
z-index: 999;
|
||||
}
|
||||
</style>
|
||||
@@ -69,7 +69,7 @@ import { useDictData } from '@/stores/dictData'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
const dictData = useDictData()
|
||||
defineOptions({
|
||||
name: 'harmonic-boot/run/terminalmessage'
|
||||
name: 'harmonic-boot/run/devicemessage'
|
||||
})
|
||||
const view = ref(true)
|
||||
const classificationData = dictData.getBasicData('Statistical_Type', ["Report_Type"])
|
||||
@@ -106,6 +106,7 @@ const tableStore = new TableStore({
|
||||
title: '供电公司',
|
||||
minWidth: 100
|
||||
},
|
||||
{ field: 'objName', title: '监测点对象名称' , minWidth: 240},
|
||||
{ field: 'manufacturer', title: '厂家' , minWidth: 100},
|
||||
{ field: 'scale', title: '电压等级' , minWidth: 100},
|
||||
{ field: 'businessType', title: '行业类型' , minWidth: 100},
|
||||
@@ -115,7 +116,7 @@ const tableStore = new TableStore({
|
||||
{ field: 'lineName', title: '监测点名称' , minWidth: 100},
|
||||
{ field: 'comFlag', title: '通讯状态' , minWidth: 100},
|
||||
{ field: 'loadType', title: '干扰源类型' , minWidth: 100},
|
||||
{ field: 'objName', title: '监测点对象名称' , minWidth: 240},
|
||||
|
||||
|
||||
],
|
||||
|
||||
|
||||
@@ -136,6 +136,7 @@ const map = (res: any) => {
|
||||
},
|
||||
color: ['green', 'red'],
|
||||
legend: {
|
||||
selectedMode: false,
|
||||
data: [
|
||||
{
|
||||
name: '正常'
|
||||
|
||||
Reference in New Issue
Block a user