修改 方案数据echart数据格式
This commit is contained in:
@@ -191,7 +191,7 @@ defineExpose({ onComSearch, areaRef, setDatePicker, setInterval, datePickerRef,
|
||||
background-color: var(--ba-bg-color-overlay);
|
||||
|
||||
border-bottom: none;
|
||||
padding: 13px 15px;
|
||||
padding: 13px 15px 9px;
|
||||
font-size: 14px;
|
||||
|
||||
.table-header-operate-text {
|
||||
|
||||
@@ -11,7 +11,11 @@ export const yMethod = (arr: any) => {
|
||||
|
||||
if (maxValue > 1000) {
|
||||
max = Math.ceil(maxValue / 100) * 100
|
||||
min = (Math.floor(minValue / 100) - 1) * 100
|
||||
if (minValue == 0) {
|
||||
min = 0
|
||||
} else {
|
||||
min = (Math.floor(minValue / 100) - 1) * 100
|
||||
}
|
||||
} else {
|
||||
max = Math.ceil(maxValue / 10) * 10
|
||||
min = Math.floor(minValue / 10) * 10
|
||||
|
||||
@@ -226,14 +226,16 @@ function getPendingKey(config: AxiosRequestConfig) {
|
||||
/**
|
||||
* 根据请求方法组装请求数据/参数
|
||||
*/
|
||||
export function requestPayload(method: Method, data: anyObj) {
|
||||
export function requestPayload(method: Method, data: anyObj, paramsPOST: boolean) {
|
||||
if (method == 'GET') {
|
||||
return {
|
||||
params: data
|
||||
}
|
||||
} else if (method == 'POST') {
|
||||
return {
|
||||
data: data
|
||||
if (paramsPOST) {
|
||||
return { params: data }
|
||||
} else {
|
||||
return { data: data }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -15,19 +15,15 @@
|
||||
{{ deviceData.describe ? deviceData.describe : '/' }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-collapse v-model="activeColName" accordion>
|
||||
<el-collapse v-model="activeColName" @change="handleChange">
|
||||
<el-collapse-item title="测试项信息" name="0">
|
||||
<div class="monitor_info" v-if="deviceData.records && deviceData.records.length != 0">
|
||||
<!-- <div class="history_title">
|
||||
<p>测试项信息</p>
|
||||
</div> -->
|
||||
<el-tabs v-model="activeName" type="border-card" @click="handleClickTabs">
|
||||
<el-tab-pane
|
||||
v-for="(item, index) in deviceData.records"
|
||||
:label="item.itemName"
|
||||
:name="item.id"
|
||||
:key="index"
|
||||
>
|
||||
<el-tab-pane v-for="(item, index) in deviceData.records" :label="item.itemName"
|
||||
:name="item.id" :key="index">
|
||||
<template #label>
|
||||
<span class="custom-tabs-label">
|
||||
<el-icon>
|
||||
@@ -101,89 +97,66 @@
|
||||
<el-empty />
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
<el-collapse-item title="历史趋势" name="1" class="history_collapse">
|
||||
<div class="history_trend">
|
||||
<div class="history_header" ref="headerRef">
|
||||
<!-- <el-form :model="searchForm" class="history_select" id="history_select"> -->
|
||||
<TableHeader :showSearch="false" ref="tableHeaderRef" :key="searchFormIndex">
|
||||
<template v-slot:select>
|
||||
<el-form-item for="-" label="统计指标" label-width="80px">
|
||||
<el-select
|
||||
collapse-tags
|
||||
collapse-tags-tooltip
|
||||
v-model="searchForm.index"
|
||||
placeholder="请选择统计指标"
|
||||
multiple
|
||||
:multiple-limit="3"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in indexOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item for="-" label="值类型" label-width="80px">
|
||||
<el-select style="width: 160px !important" v-model="searchForm.dataLevel">
|
||||
<el-option value="Primary" label="一次值"></el-option>
|
||||
<el-option value="Secondary" label="二次值"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<div v-for="(item, index) in countData" :key="index">
|
||||
<el-form-item
|
||||
for="-"
|
||||
:label="item.name + '谐波次数'"
|
||||
label-width="180px"
|
||||
v-if="item.countOptions.length != 0"
|
||||
>
|
||||
<!-- multiple -->
|
||||
<el-select
|
||||
v-model="item.count"
|
||||
collapse-tags
|
||||
collapse-tags-tooltip
|
||||
placeholder="请选择谐波次数"
|
||||
style="width: 100px"
|
||||
>
|
||||
<el-option
|
||||
v-for="vv in item.countOptions"
|
||||
:key="vv"
|
||||
:label="vv"
|
||||
:value="vv"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-form-item for="-" label="统计类型" label-width="80px">
|
||||
<el-select v-model="searchForm.type" placeholder="请选择值类型">
|
||||
<el-option
|
||||
v-for="item in typeOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template v-slot:operation>
|
||||
<el-button type="primary" icon="el-icon-Search" @click="init(true)">查询</el-button>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<!-- <el-collapse-item title="历史趋势" name="1" class="history_collapse"> -->
|
||||
|
||||
<!-- </el-form> -->
|
||||
<!-- <div class="history_searchBtn">
|
||||
<!-- </el-collapse-item> -->
|
||||
</el-collapse>
|
||||
<h3 class="mt10 mb10">历史趋势</h3>
|
||||
<div class="history_trend">
|
||||
<div class="history_header" ref="headerRef">
|
||||
<!-- <el-form :model="searchForm" class="history_select" id="history_select"> -->
|
||||
<TableHeader :showSearch="false" ref="tableHeaderRef" :key="searchFormIndex"
|
||||
@selectChange="selectChange">
|
||||
<template v-slot:select>
|
||||
<el-form-item for="-" label="统计指标" label-width="80px">
|
||||
<el-select collapse-tags collapse-tags-tooltip v-model="searchForm.index"
|
||||
placeholder="请选择统计指标" multiple :multiple-limit="3">
|
||||
<el-option v-for="item in indexOptions" :key="item.id" :label="item.name"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item for="-" label="值类型" label-width="80px">
|
||||
<el-select style="width: 160px !important" v-model="searchForm.dataLevel">
|
||||
<el-option value="Primary" label="一次值"></el-option>
|
||||
<el-option value="Secondary" label="二次值"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<div v-for="(item, index) in countData" :key="index">
|
||||
<el-form-item for="-" :label="item.name + '谐波次数'" label-width="180px"
|
||||
v-if="item.countOptions.length != 0">
|
||||
<!-- multiple -->
|
||||
<el-select v-model="item.count" collapse-tags collapse-tags-tooltip
|
||||
placeholder="请选择谐波次数" style="width: 100px">
|
||||
<el-option v-for="vv in item.countOptions" :key="vv" :label="vv"
|
||||
:value="vv"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-form-item for="-" label="统计类型" label-width="80px">
|
||||
<el-select v-model="searchForm.type" placeholder="请选择值类型">
|
||||
<el-option v-for="item in typeOptions" :key="item.id" :label="item.name"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template v-slot:operation>
|
||||
<el-button type="primary" icon="el-icon-Search" @click="init(true)">查询</el-button>
|
||||
</template>
|
||||
</TableHeader>
|
||||
|
||||
<!-- </el-form> -->
|
||||
<!-- <div class="history_searchBtn">
|
||||
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="history_title">
|
||||
<p>{{ chartTitle }}</p>
|
||||
</div>
|
||||
<div class="history_chart" v-loading="loading" ref="chartRef">
|
||||
<MyEchart ref="historyChart" v-if="echartsData" :isExport="true" :options="echartsData" />
|
||||
</div>
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div>
|
||||
<div class="history_title">
|
||||
<p>{{ chartTitle }}</p>
|
||||
</div>
|
||||
<div class="history_chart" v-loading="loading" :style="EcharHeight" :key="EcharHeight.height"
|
||||
ref="chartRef">
|
||||
<MyEchart ref="historyChart" v-if="echartsData" :isExport="true" :options="echartsData" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-empty v-else description="请选择设备" class="device-manage-right" />
|
||||
<popup ref="dialogRef" @onSubmit="refreshTree" />
|
||||
@@ -203,19 +176,24 @@ import { useDictData } from '@/stores/dictData'
|
||||
import { queryStatistical } from '@/api/system-boot/csstatisticalset'
|
||||
import { TrendCharts, Plus, Platform } from '@element-plus/icons-vue'
|
||||
import { yMethod } from '@/utils/echartMethod'
|
||||
import { color, gradeColor3 } from '@/components/echarts/color'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { useConfig } from '@/stores/config'
|
||||
const dictData = useDictData()
|
||||
defineOptions({
|
||||
name: 'govern/device/planData/index'
|
||||
})
|
||||
const config = useConfig()
|
||||
color[0] = config.layout.elementUiPrimary[0]
|
||||
//电压等级
|
||||
const voltageLevelList = dictData.getBasicData('Dev_Voltage')
|
||||
//接线方式
|
||||
const volConTypeList = dictData.getBasicData('Dev_Connect')
|
||||
//值类型
|
||||
const pageHeight = mainHeight(20)
|
||||
const EcharHeight = ref(mainHeight(510))
|
||||
const loading = ref(false)
|
||||
const searchForm = ref({})
|
||||
const searchForm: any = ref({})
|
||||
const typeOptions = [
|
||||
{
|
||||
name: '平均值',
|
||||
@@ -258,7 +236,7 @@ queryByCode('portable-harmonic').then(res => {
|
||||
})
|
||||
})
|
||||
const activeName: any = ref()
|
||||
const activeColName: any = ref('1')
|
||||
const activeColName: any = ref('0')
|
||||
const deviceData: any = ref([])
|
||||
const schemeTreeRef = ref()
|
||||
//历史趋势devId
|
||||
@@ -333,43 +311,12 @@ const range = (start: any, end: any, step: any) => {
|
||||
return Array.from({ length: (end - start) / step + 1 }, (_, i) => start + i * step)
|
||||
}
|
||||
//二维数组去除相同数据的数组
|
||||
const filterArray = (array: any) => {
|
||||
const newArray: any = []
|
||||
array.forEach((currentValue: any) => {
|
||||
let isPush = true
|
||||
newArray.forEach((currentValueIn: any) => {
|
||||
if (currentValueIn) {
|
||||
if (currentValue[0] === currentValueIn[0] && currentValue[1] === currentValueIn[1]) {
|
||||
isPush = false
|
||||
}
|
||||
} else {
|
||||
newArray.push(currentValue)
|
||||
}
|
||||
})
|
||||
if (isPush) {
|
||||
newArray.push(currentValue)
|
||||
}
|
||||
})
|
||||
return newArray
|
||||
}
|
||||
|
||||
const init = (flag: boolean) => {
|
||||
//调用子组件的方法切换的时候tree的节点也变化
|
||||
let list: any = []
|
||||
//颜色数组
|
||||
const colorList = [
|
||||
'#DAA521',
|
||||
'#A5292A',
|
||||
'aqua',
|
||||
'#d81e06',
|
||||
'#2E8B58',
|
||||
'coral',
|
||||
'#012B6A',
|
||||
'brown',
|
||||
'#70B601',
|
||||
'blueviolet',
|
||||
'#1DD0CE',
|
||||
'cadetblue'
|
||||
]
|
||||
|
||||
if (historyDevId.value && legendDictList.value && legendDictList.value.selectedList) {
|
||||
// 选择指标的时候切换legend内容和data数据
|
||||
legendDictList.value?.selectedList?.map((item: any) => {
|
||||
@@ -430,274 +377,141 @@ const init = (flag: boolean) => {
|
||||
let chartsList = JSON.parse(JSON.stringify(res.data))
|
||||
echartsData.value = {}
|
||||
//icon图标替换legend图例
|
||||
|
||||
// y轴单位数组
|
||||
let unitList: any = []
|
||||
let allUnitArray: any = []
|
||||
chartsList.map((item: any) => {
|
||||
allUnitArray.push({ name: item.anotherName, unit: item.unit })
|
||||
})
|
||||
//去除重复的unit单位数据
|
||||
unitList = allUnitArray.reduce((result: any, obj: any) => {
|
||||
if (!result.some((item: any) => JSON.stringify(item) === JSON.stringify(obj))) {
|
||||
result.push(obj)
|
||||
}
|
||||
return result
|
||||
}, [])
|
||||
|
||||
let [min, max] = [0, 0]
|
||||
list.map((item: any, index: any) => {
|
||||
item.map((vv: any, indexs: any) => {
|
||||
;[min, max] = yMethod(
|
||||
chartsList
|
||||
.map((kk: any, kks: any) => {
|
||||
if (kk.statisticalName == vv.name) {
|
||||
return kk.statisticalData
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
})
|
||||
.filter((kk: any) => kk !== '')
|
||||
)
|
||||
item.min = min
|
||||
item.max = max
|
||||
let groupedData = chartsList.reduce((acc, item) => {
|
||||
let key = item.anotherName;
|
||||
if (!acc[key]) {
|
||||
acc[key] = [];
|
||||
}
|
||||
acc[key].push(item);
|
||||
return acc;
|
||||
}, {})
|
||||
let result = Object.values(groupedData);
|
||||
if (chartsList.length > 0) {
|
||||
unitList = result.map((item: any) => {
|
||||
return item[0].unit
|
||||
})
|
||||
})
|
||||
echartsData.value = {
|
||||
options: {
|
||||
title: [
|
||||
{
|
||||
left: '10%',
|
||||
top: 0
|
||||
// text: chartTitle.value
|
||||
}
|
||||
],
|
||||
toolbox: {
|
||||
feature: {
|
||||
// saveAsImage: {
|
||||
// title: '保存'
|
||||
// }
|
||||
// dataView: { readOnly: false },
|
||||
// }
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
//legend使用iconfont图标
|
||||
data: [],
|
||||
itemWidth: 20,
|
||||
itemHeight: 10,
|
||||
itemGap: 15,
|
||||
type: 'scroll', // 开启滚动分页
|
||||
// orient: 'vertical', // 垂直排列
|
||||
right: '15%', // 位置调整
|
||||
top: 5,
|
||||
bottom: 30,
|
||||
width: 400,
|
||||
height: 50
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
fontStyle: 'normal',
|
||||
opacity: 0.35,
|
||||
fontSize: 14
|
||||
},
|
||||
backgroundColor: 'rgba(0,0,0,0.35)',
|
||||
borderWidth: 0,
|
||||
axisPointer: {
|
||||
type: 'cross',
|
||||
crossStyle: {
|
||||
color: '#999'
|
||||
}
|
||||
},
|
||||
|
||||
formatter: function (params: any) {
|
||||
let list = params.filter((item, index, self) => {
|
||||
return index === self.findIndex(t => t.seriesName === item.seriesName)
|
||||
})
|
||||
var res =
|
||||
'<span style="margin-right:18px;"></span>' +
|
||||
list[0].value[0] +
|
||||
list[0].name +
|
||||
'<br/>'
|
||||
for (var i = 0, l = list.length; i < l; i++) {
|
||||
list[i].unit =
|
||||
echartsData.value.options.yAxis[
|
||||
echartsData.value.options.series[list[i].seriesIndex].yAxisIndex
|
||||
]?.name
|
||||
res +=
|
||||
list[i].seriesName +
|
||||
' ' +
|
||||
`<div style="width:16px;height:16px;float:left;background:${list[i].color};border-radius:50%;margin:0 15px"></div>` +
|
||||
`<div style='float:right;padding-left:20px;'>${
|
||||
list[i].value[1] == null ? '' : list[i].value[1].toFixed(2)
|
||||
} </div><br/>`
|
||||
// ${list[i].unit}
|
||||
}
|
||||
return res
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
type: 'time',
|
||||
axisLabel: {
|
||||
formatter: {
|
||||
day: '{MM}-{dd}',
|
||||
month: '{MM}',
|
||||
year: '{yyyy}'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: unitList[0].unit,
|
||||
axisLabel: {
|
||||
color: '#000',
|
||||
fontSize: 14
|
||||
},
|
||||
axisTick: {
|
||||
show: true
|
||||
},
|
||||
|
||||
max: list[0].max,
|
||||
min: list[0].min,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
// color: colorList[0]
|
||||
}
|
||||
},
|
||||
nameTextStyle: {
|
||||
color: '#000',
|
||||
fontSize: '14'
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
lineStyle: {
|
||||
color: ['#43485E'],
|
||||
width: 1,
|
||||
type: 'solid'
|
||||
}
|
||||
},
|
||||
splitNumber: 5,
|
||||
minInterval: 1,
|
||||
yAxisIndex: 0
|
||||
}
|
||||
],
|
||||
series: []
|
||||
}
|
||||
}
|
||||
|
||||
echartsData.value.options.legend.data = []
|
||||
//处理多y轴
|
||||
// if (unitList.length != 0 && unitList.length > 1) {
|
||||
// console.log(max, min)
|
||||
echartsData.value.options.yAxis[0].yAxisIndex = 0
|
||||
unitList.map((item: any, index: any) => {
|
||||
if (index != unitList.length - 1) {
|
||||
echartsData.value.options.yAxis.push({
|
||||
type: 'value',
|
||||
position: 'right',
|
||||
offset: index * 80, // y轴位置的偏移量
|
||||
name: unitList[index + 1].unit,
|
||||
axisLabel: {
|
||||
color: '#000',
|
||||
fontSize: 14
|
||||
},
|
||||
axisTick: {
|
||||
show: true
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
// color: colorList[index + 1]
|
||||
}
|
||||
},
|
||||
nameTextStyle: {
|
||||
color: '#000',
|
||||
fontSize: '14'
|
||||
},
|
||||
max: list[index + 1].max,
|
||||
min: list[index + 1].min,
|
||||
splitLine: {
|
||||
show: false,
|
||||
lineStyle: {
|
||||
color: ['#43485E'],
|
||||
width: 1,
|
||||
type: 'solid'
|
||||
}
|
||||
},
|
||||
yAxisIndex: index + 1
|
||||
})
|
||||
echartsData.value = {
|
||||
legend: {
|
||||
|
||||
itemWidth: 20,
|
||||
itemHeight: 10,
|
||||
itemGap: 15,
|
||||
type: 'scroll', // 开启滚动分页
|
||||
// orient: 'vertical', // 垂直排列
|
||||
top: 5,
|
||||
bottom: 30,
|
||||
width: 400,
|
||||
height: 50
|
||||
},
|
||||
tooltip: {
|
||||
axisPointer: {
|
||||
type: 'cross',
|
||||
label: {
|
||||
color: '#fff',
|
||||
fontSize: 16
|
||||
}
|
||||
},
|
||||
textStyle: {
|
||||
color: '#fff',
|
||||
fontStyle: 'normal',
|
||||
opacity: 0.35,
|
||||
fontSize: 14
|
||||
},
|
||||
backgroundColor: 'rgba(0,0,0,0.35)',
|
||||
borderWidth: 0
|
||||
},
|
||||
color: ['#FFCC00', '#009900', '#CC0000', ...color],
|
||||
xAxis: {
|
||||
type: 'time',
|
||||
axisLabel: {
|
||||
formatter: {
|
||||
day: '{MM}-{dd}',
|
||||
month: '{MM}',
|
||||
year: '{yyyy}'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: [{
|
||||
|
||||
}],
|
||||
|
||||
options: {
|
||||
series: [
|
||||
|
||||
]
|
||||
}
|
||||
}
|
||||
if (chartsList.length > 0) {
|
||||
echartsData.value.yAxis=[]
|
||||
unitList.forEach((item: any, index: any) => {
|
||||
let right = {
|
||||
position: 'right',
|
||||
offset: (index - 1) * 80,
|
||||
}
|
||||
echartsData.value.yAxis.push({
|
||||
name: item,
|
||||
yAxisIndex: index,
|
||||
splitLine: {
|
||||
show: false,
|
||||
|
||||
},
|
||||
...(index > 0 ? right : null)
|
||||
})
|
||||
})
|
||||
// }
|
||||
list.map((item: any, index: any) => {
|
||||
console.log(item, '++++++++++++596')
|
||||
item.map((vv: any, indexs: any) => {
|
||||
//处理legend
|
||||
if (chartsList.length != 0) {
|
||||
echartsData.value.options.legend.data.push({
|
||||
name: vv.phase + '相' + vv.showName
|
||||
})
|
||||
|
||||
result.forEach((item: any, index: any) => {
|
||||
let yMethodList: any = []
|
||||
|
||||
let ABCList = Object.values(item.reduce((acc, item) => {
|
||||
let key = item.phase;
|
||||
if (!acc[key]) {
|
||||
acc[key] = [];
|
||||
}
|
||||
if (
|
||||
unitList.findIndex((item: any) => {
|
||||
return item.unit == vv.unit && item.name == vv.showName
|
||||
}) != -1
|
||||
) {
|
||||
vv.yAxisIndex = unitList.findIndex((item: any) => {
|
||||
return item.unit == vv.unit && item.name == vv.showName
|
||||
})
|
||||
} else {
|
||||
vv.yAxisIndex = 0
|
||||
}
|
||||
console.log(vv, '<================>', vv.unit)
|
||||
acc[key].push(item);
|
||||
return acc;
|
||||
}, {}));
|
||||
ABCList.forEach((kk: any,) => {
|
||||
let seriesList: any = []
|
||||
kk.forEach((cc: any) => {
|
||||
if (cc.statisticalData) {
|
||||
yMethodList.push(cc.statisticalData?.toFixed(2) - 0)
|
||||
|
||||
}
|
||||
|
||||
seriesList.push([cc.time, cc.statisticalData?.toFixed(2)])
|
||||
})
|
||||
|
||||
|
||||
echartsData.value.options.series.push({
|
||||
name: vv.phase + '相' + vv.showName,
|
||||
name: kk[0].phase + '相' + item[0].anotherName,
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
symbol: 'none',
|
||||
emphasis: {
|
||||
focus: 'series'
|
||||
},
|
||||
itemStyle: {},
|
||||
//数据
|
||||
data: filterArray(
|
||||
chartsList
|
||||
.map((kk: any, kks: any) => {
|
||||
if (kk.statisticalName == vv.name) {
|
||||
// xAxis[kks]
|
||||
return [kk.time, kk.statisticalData]
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
})
|
||||
.filter((kk: any) => kk !== '')
|
||||
),
|
||||
//数据对应的y轴
|
||||
yAxisIndex: vv.yAxisIndex
|
||||
})
|
||||
})
|
||||
})
|
||||
console.log(list, '6444和那个的哈哈哈哈呀哈哈哈哈哈哈哈哈哈哈哈')
|
||||
data: seriesList,
|
||||
yAxisIndex: index
|
||||
|
||||
})
|
||||
|
||||
|
||||
})
|
||||
let [min, max] = yMethod(yMethodList)
|
||||
echartsData.value.yAxis[index].min = min
|
||||
echartsData.value.yAxis[index].max = max
|
||||
|
||||
|
||||
|
||||
//设置数据项颜色
|
||||
echartsData.value.options.series.map((item: any, index: any) => {
|
||||
item.itemStyle = {
|
||||
normal: {
|
||||
color: colorList[index],
|
||||
lineStyle: {
|
||||
color: colorList[index]
|
||||
}
|
||||
}
|
||||
}
|
||||
// item.data = filterArray(item.data)
|
||||
})
|
||||
// echartsData.value.options.series = echartsData.value.options.series.sort((a: any, b: any) => {
|
||||
// return a.yAxisIndex - b.yAxisIndex
|
||||
// })
|
||||
console.log(echartsData.value.options.series, '...............709')
|
||||
}
|
||||
// console.log("🚀 ~ .1111 ~ echartsData.value :", echartsData.value)
|
||||
|
||||
|
||||
|
||||
loading.value = false
|
||||
}
|
||||
})
|
||||
@@ -862,6 +676,41 @@ const formatCountOptions = (list: any) => {
|
||||
})
|
||||
}
|
||||
}
|
||||
const flag = ref(false)
|
||||
const selectChange = (e: boolean) => {
|
||||
flag.value = e
|
||||
if (activeColName.value == '0') {
|
||||
if (flag.value) {
|
||||
EcharHeight.value = mainHeight(565)
|
||||
} else {
|
||||
EcharHeight.value = mainHeight(510)
|
||||
}
|
||||
} else {
|
||||
if (flag.value) {
|
||||
EcharHeight.value = mainHeight(365)
|
||||
} else {
|
||||
EcharHeight.value = mainHeight(310)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
const handleChange = () => {
|
||||
if (activeColName.value == '0') {
|
||||
if (flag.value) {
|
||||
EcharHeight.value = mainHeight(565)
|
||||
} else {
|
||||
EcharHeight.value = mainHeight(510)
|
||||
}
|
||||
|
||||
} else {
|
||||
if (flag.value) {
|
||||
EcharHeight.value = mainHeight(365)
|
||||
} else {
|
||||
EcharHeight.value = mainHeight(310)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
const tableHeaderRef = ref<any>()
|
||||
const searchFormIndex = ref<any>()
|
||||
watch(
|
||||
@@ -899,11 +748,13 @@ onMounted(() => {
|
||||
.device-manage {
|
||||
display: flex;
|
||||
height: calc(100vh - 100px);
|
||||
|
||||
// overflow-y: auto;
|
||||
&-right {
|
||||
// overflow: auto;
|
||||
flex: 1;
|
||||
padding: 10px 10px 10px 0;
|
||||
|
||||
.el-descriptions__header {
|
||||
height: 36px;
|
||||
margin-bottom: 7px;
|
||||
@@ -932,6 +783,7 @@ onMounted(() => {
|
||||
|
||||
.history_title {
|
||||
width: 100%;
|
||||
|
||||
p {
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
@@ -943,28 +795,30 @@ onMounted(() => {
|
||||
|
||||
::v-deep .monitor_info {
|
||||
width: 100%;
|
||||
|
||||
.el-tabs__content {
|
||||
padding: 0 !important;
|
||||
min-height: 130px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.history_collapse {
|
||||
height: calc(100vh - 300px);
|
||||
width: 100%;
|
||||
|
||||
.history_trend {
|
||||
width: 100%;
|
||||
height: calc(100vh - 340px);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.history_header {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
overflow: hidden;
|
||||
|
||||
}
|
||||
|
||||
.history_chart {
|
||||
width: 100%;
|
||||
flex: 1 !important;
|
||||
margin-top: 10px;
|
||||
|
||||
margin: 10px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,20 +1,20 @@
|
||||
<template>
|
||||
<el-dialog width="500px" v-model="dialogVisible" :title="title">
|
||||
<el-dialog width="500px" v-model="dialogVisible" :title="title">
|
||||
|
||||
<el-form :model="form" class="form-one" label-width="auto">
|
||||
<el-form-item label="名称">
|
||||
<el-input v-model="form.name" placeholder="请输入名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="编码">
|
||||
<el-input v-model="form.code" placeholder="请输入编码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序">
|
||||
<el-input-number v-model="form.sort" :min="0" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-form :model="form" class="form-one" label-width="auto">
|
||||
<el-form-item label="名称">
|
||||
<el-input v-model="form.name" placeholder="请输入名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="编码">
|
||||
<el-input v-model="form.code" placeholder="请输入编码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序">
|
||||
<el-input-number v-model="form.sort" :min="0" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
@@ -53,6 +53,12 @@ const open = (text: string, data?: anyObj) => {
|
||||
title.value = text
|
||||
for (let key in form) {
|
||||
form[key] = data ? data[key] : ''
|
||||
|
||||
if (key == 'sort') {
|
||||
|
||||
form[key] = data?.sort == '' ? data[key] : 100
|
||||
console.log("🚀 ~ open ~ form[key]:", form[key])
|
||||
}
|
||||
}
|
||||
dialogVisible.value = true
|
||||
}
|
||||
|
||||
@@ -31,6 +31,7 @@ const tableStore = new TableStore({
|
||||
showPage: false,
|
||||
url: '/system-boot/dictTree/query',
|
||||
method: 'POST',
|
||||
paramsPOST:true,
|
||||
column: [
|
||||
{ title: '序号', type: 'seq', width: 60 },
|
||||
{ title: '统计类型', field: 'name' },
|
||||
@@ -82,16 +83,16 @@ const tableStore = new TableStore({
|
||||
}
|
||||
],
|
||||
loadCallback: () => {
|
||||
// 过滤数组中type等于1的数据，children下钻
|
||||
const filterData = (arr: any[]) => {
|
||||
return arr.filter((item: any) => {
|
||||
if (item.children.length) {
|
||||
item.children = filterData(item.children)
|
||||
}
|
||||
return item.type != 1
|
||||
})
|
||||
}
|
||||
tableStore.table.data = filterData(tableStore.table.data)
|
||||
// // 过滤数组中type等于1的数据，children下钻
|
||||
// const filterData = (arr: any[]) => {
|
||||
// return arr.filter((item: any) => {
|
||||
// if (item.children.length) {
|
||||
// item.children = filterData(item.children)
|
||||
// }
|
||||
// return item.type != 1
|
||||
// })
|
||||
// }
|
||||
// tableStore.table.data = filterData(tableStore.table.data)
|
||||
}
|
||||
})
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
Reference in New Issue
Block a user