冀北问题修改
This commit is contained in:
guanj
@@ -1,430 +1,430 @@
|
||||
<template>
|
||||
<div style="display: flex; flex-direction: column; height: 100%; position: relative">
|
||||
<el-form :inline="true">
|
||||
<el-form-item label="多监测点">
|
||||
<el-checkbox v-model="checked" @change="checkChange" />
|
||||
</el-form-item>
|
||||
<el-form-item label="日期">
|
||||
<DatePicker ref="datePickerRef" ></DatePicker>
|
||||
</el-form-item>
|
||||
<el-form-item label="指标类型:">
|
||||
<el-select
|
||||
v-model="formData.condition"
|
||||
multiple
|
||||
collapse-tags
|
||||
:multiple-limit="5"
|
||||
filterable
|
||||
placeholder="请选择指标"
|
||||
@change="conditionChange"
|
||||
>
|
||||
<el-option-group v-for="group in indexOptions" :key="group.label" :label="group.label">
|
||||
<el-option
|
||||
v-for="item in group.options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
></el-option>
|
||||
</el-option-group>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="谐波次数:" v-if="showXieBoCiShu">
|
||||
<el-select style="width: 100%" v-model="formData.harmonic" placeholder="请选择谐波">
|
||||
<el-option
|
||||
v-for="item in harmonicOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="showJianXieBoCiShu" label="间谐波次数:">
|
||||
<el-select style="width: 100%" v-model="formData.inHarmonic" placeholder="请选择间谐波">
|
||||
<el-option
|
||||
v-for="item in inharmonicOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="init" icon="el-icon-Search">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="flex: 1; overflow: hidden" class="mt10" v-loading="loading">
|
||||
<vxe-table height="auto" v-bind="defaultAttribute" :data="tableData">
|
||||
<vxe-column field="subName" title="变电站" min-width="120px"></vxe-column>
|
||||
<vxe-column field="lineName" title="监测点名称" min-width="120px"></vxe-column>
|
||||
<vxe-column field="targetName" title="指标类型" min-width="120px"></vxe-column>
|
||||
<vxe-column field="phaseType" title="相别" min-width="100px"></vxe-column>
|
||||
<vxe-column field="scale" title="电压等级" min-width="100px"></vxe-column>
|
||||
<vxe-column field="timeId" title="时间" min-width="130px"></vxe-column>
|
||||
<vxe-column field="unit" title="单位" min-width="100px"></vxe-column>
|
||||
<vxe-column field="maxData" title="最大值(%)" min-width="100px">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
@click="showCharts(scope.row, 3, '最大值')"
|
||||
:style="{ color: scope.row.statisticalType === 3 ? '#A52a2a' : '#07d75a' }"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
{{ scope.row.maxData }}
|
||||
</el-button>
|
||||
<el-button v-if="scope.row.statisticalType === 3.14159">/</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="minData" title="最小值(%)" min-width="100px">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
@click="showCharts(scope.row, 2, '最小值')"
|
||||
:style="{ color: scope.row.statisticalType === 2 ? '#A52a2a' : '#07d75a' }"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
{{ scope.row.minData }}
|
||||
</el-button>
|
||||
<el-button v-if="scope.row.statisticalType === 3.14159">/</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="avgData" title="平均值(%)" min-width="100px">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
@click="showCharts(scope.row, 1, '平均值')"
|
||||
:style="{ color: scope.row.statisticalType === 1 ? '#A52a2a' : '#07d75a' }"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
{{ scope.row.avgData }}
|
||||
</el-button>
|
||||
<el-button v-if="scope.row.statisticalType === 3.14159">/</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="cp95Data" title="CP95值(%)" min-width="100px">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
@click="showCharts(scope.row, 4, 'CP95值')"
|
||||
:style="{ color: scope.row.statisticalType === 4 ? '#A52a2a' : '#07d75a' }"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
{{ scope.row.cp95Data }}
|
||||
</el-button>
|
||||
<el-button v-if="scope.row.statisticalType === 3.14159">/</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
<SecondSheet v-if="options" style="background: #fff; z-index: 10">
|
||||
<el-button
|
||||
style="position: absolute; right: 0; top: 0; cursor: pointer; z-index: 3"
|
||||
icon="el-icon-Back"
|
||||
size="small"
|
||||
@click="close"
|
||||
>
|
||||
返回
|
||||
</el-button>
|
||||
<MyEChart :options="options"></MyEChart>
|
||||
</SecondSheet>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import { Close } from '@element-plus/icons-vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { indexOptions, harmonicOptions, inharmonicOptions } from '@/utils/dictionary'
|
||||
import { getHistoryTableData, getHistoryLineData } from '@/api/harmonic-boot/normLimit'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
import SecondSheet from '@/components/secondSheet/index.vue'
|
||||
import MyEChart from '@/components/echarts/MyEchart.vue'
|
||||
|
||||
const datePickerRef = ref()
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const loading = ref(true)
|
||||
const checked = ref(monitoringPoint.state.showCheckBox)
|
||||
const formData = reactive<{
|
||||
lineId: string[]
|
||||
searchBeginTime: string
|
||||
searchEndTime: string
|
||||
condition: string[]
|
||||
harmonic: number
|
||||
inHarmonic: number
|
||||
}>({
|
||||
lineId: [],
|
||||
searchBeginTime: '',
|
||||
searchEndTime: '',
|
||||
condition: ['10', '11', '12'],
|
||||
harmonic: 2,
|
||||
inHarmonic: 1
|
||||
})
|
||||
const tableData = ref([])
|
||||
const showXieBoCiShu = ref(false)
|
||||
const showJianXieBoCiShu = ref(false)
|
||||
const options = ref<any>(null)
|
||||
|
||||
onMounted(() => {
|
||||
init()
|
||||
})
|
||||
const init = () => {
|
||||
loading.value = true
|
||||
formData.lineId = checked.value ? monitoringPoint.state.lineIds : [monitoringPoint.state.lineId]
|
||||
formData.searchBeginTime = datePickerRef.value.timeValue[0]
|
||||
formData.searchEndTime = datePickerRef.value.timeValue[1]
|
||||
getHistoryTableData(formData).then((res: any) => {
|
||||
tableData.value = res.data.map((item: any) => {
|
||||
return {
|
||||
...item,
|
||||
maxData: item.maxData.toFixed(2),
|
||||
minData: item.minData.toFixed(2),
|
||||
avgData: item.avgData.toFixed(2),
|
||||
cp95Data: item.cp95Data.toFixed(2)
|
||||
}
|
||||
})
|
||||
nextTick(() => {
|
||||
loading.value = false
|
||||
})
|
||||
})
|
||||
}
|
||||
const checkChange = () => {
|
||||
if (checked.value) {
|
||||
monitoringPoint.setShowCheckBox(true)
|
||||
} else {
|
||||
monitoringPoint.setShowCheckBox(false)
|
||||
init()
|
||||
}
|
||||
}
|
||||
const close = () => {
|
||||
console.log('====================================')
|
||||
console.log(2123123)
|
||||
console.log('====================================')
|
||||
options.value = null
|
||||
}
|
||||
const showCharts = (row: any, valueType: number, name: string) => {
|
||||
getHistoryLineData({
|
||||
lineId: row.lineId,
|
||||
number: row.number,
|
||||
phaseType: row.phaseType,
|
||||
searchTime: row.timeId,
|
||||
targetCode: row.targetCode,
|
||||
valueType
|
||||
}).then(res => {
|
||||
options.value = {
|
||||
title: {
|
||||
text: row.subName + ' ' + row.lineName + ' ' + row.targetName + ' ' + row.phaseType + '相' + name
|
||||
},
|
||||
legend: {
|
||||
show: false
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: '时间',
|
||||
data: res.data[0]?.value.map((item: any[]) => item[0])
|
||||
},
|
||||
yAxis: {
|
||||
name: '%',
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: name,
|
||||
data: res.data[0]?.value.map((item: any[]) => item[1]),
|
||||
type: 'line'
|
||||
}
|
||||
],
|
||||
options: {
|
||||
grid: {
|
||||
top: '50px',
|
||||
left: '40px',
|
||||
right: '60px',
|
||||
bottom: '10px',
|
||||
containLabel: true
|
||||
},
|
||||
dataZoom: null
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
const conditionChange = () => {
|
||||
//判断一个指标时
|
||||
if (formData.condition.length == 1) {
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
//判断2个指标时
|
||||
if (formData.condition.length == 2) {
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
(formData.condition.includes('45') && formData.condition.includes('46')) ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
showJianXieBoCiShu.value = true
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
//判断3个指标时
|
||||
if (formData.condition.length == 3) {
|
||||
if (
|
||||
(formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')) &&
|
||||
(formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49'))
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
//判断4个指标时
|
||||
if (formData.condition.length == 4) {
|
||||
if (
|
||||
(formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')) &&
|
||||
(formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49'))
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
//判断5个指标时
|
||||
if (formData.condition.length == 5) {
|
||||
if (
|
||||
(formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')) &&
|
||||
(formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49'))
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
//判断无指标时
|
||||
if (formData.condition.length == 0) {
|
||||
showJianXieBoCiShu.value = false
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style></style>
|
||||
<template>
|
||||
<div style="display: flex; flex-direction: column; height: 100%; position: relative">
|
||||
<el-form :inline="true">
|
||||
<el-form-item label="多监测点">
|
||||
<el-checkbox v-model="checked" @change="checkChange" />
|
||||
</el-form-item>
|
||||
<el-form-item label="统计时间">
|
||||
<DatePicker ref="datePickerRef" ></DatePicker>
|
||||
</el-form-item>
|
||||
<el-form-item label="指标类型:">
|
||||
<el-select
|
||||
v-model="formData.condition"
|
||||
multiple
|
||||
collapse-tags
|
||||
:multiple-limit="5"
|
||||
filterable
|
||||
placeholder="请选择指标"
|
||||
@change="conditionChange"
|
||||
>
|
||||
<el-option-group v-for="group in indexOptions" :key="group.label" :label="group.label">
|
||||
<el-option
|
||||
v-for="item in group.options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
></el-option>
|
||||
</el-option-group>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="谐波次数:" v-if="showXieBoCiShu">
|
||||
<el-select style="width: 100%" v-model="formData.harmonic" placeholder="请选择谐波">
|
||||
<el-option
|
||||
v-for="item in harmonicOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="showJianXieBoCiShu" label="间谐波次数:">
|
||||
<el-select style="width: 100%" v-model="formData.inHarmonic" placeholder="请选择间谐波">
|
||||
<el-option
|
||||
v-for="item in inharmonicOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="init" icon="el-icon-Search">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="flex: 1; overflow: hidden" class="mt10" v-loading="loading">
|
||||
<vxe-table height="auto" v-bind="defaultAttribute" :data="tableData">
|
||||
<vxe-column field="subName" title="变电站" min-width="120px"></vxe-column>
|
||||
<vxe-column field="lineName" title="监测点名称" min-width="120px"></vxe-column>
|
||||
<vxe-column field="targetName" title="指标类型" min-width="120px"></vxe-column>
|
||||
<vxe-column field="phaseType" title="相别" min-width="100px"></vxe-column>
|
||||
<vxe-column field="scale" title="电压等级" min-width="100px"></vxe-column>
|
||||
<vxe-column field="timeId" title="时间" min-width="130px"></vxe-column>
|
||||
<vxe-column field="unit" title="单位" min-width="100px"></vxe-column>
|
||||
<vxe-column field="maxData" title="最大值(%)" min-width="100px">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
@click="showCharts(scope.row, 3, '最大值')"
|
||||
:style="{ color: scope.row.statisticalType === 3 ? '#A52a2a' : '#07d75a' }"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
{{ scope.row.maxData }}
|
||||
</el-button>
|
||||
<el-button v-if="scope.row.statisticalType === 3.14159">/</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="minData" title="最小值(%)" min-width="100px">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
@click="showCharts(scope.row, 2, '最小值')"
|
||||
:style="{ color: scope.row.statisticalType === 2 ? '#A52a2a' : '#07d75a' }"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
{{ scope.row.minData }}
|
||||
</el-button>
|
||||
<el-button v-if="scope.row.statisticalType === 3.14159">/</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="avgData" title="平均值(%)" min-width="100px">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
@click="showCharts(scope.row, 1, '平均值')"
|
||||
:style="{ color: scope.row.statisticalType === 1 ? '#A52a2a' : '#07d75a' }"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
{{ scope.row.avgData }}
|
||||
</el-button>
|
||||
<el-button v-if="scope.row.statisticalType === 3.14159">/</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="cp95Data" title="CP95值(%)" min-width="100px">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
@click="showCharts(scope.row, 4, 'CP95值')"
|
||||
:style="{ color: scope.row.statisticalType === 4 ? '#A52a2a' : '#07d75a' }"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
{{ scope.row.cp95Data }}
|
||||
</el-button>
|
||||
<el-button v-if="scope.row.statisticalType === 3.14159">/</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
<SecondSheet v-if="options" style="background: #fff; z-index: 10">
|
||||
<el-button
|
||||
style="position: absolute; right: 0; top: 0; cursor: pointer; z-index: 3"
|
||||
icon="el-icon-Back"
|
||||
size="small"
|
||||
@click="close"
|
||||
>
|
||||
返回
|
||||
</el-button>
|
||||
<MyEChart :options="options"></MyEChart>
|
||||
</SecondSheet>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import { Close } from '@element-plus/icons-vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { indexOptions, harmonicOptions, inharmonicOptions } from '@/utils/dictionary'
|
||||
import { getHistoryTableData, getHistoryLineData } from '@/api/harmonic-boot/normLimit'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
import SecondSheet from '@/components/secondSheet/index.vue'
|
||||
import MyEChart from '@/components/echarts/MyEchart.vue'
|
||||
|
||||
const datePickerRef = ref()
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const loading = ref(true)
|
||||
const checked = ref(monitoringPoint.state.showCheckBox)
|
||||
const formData = reactive<{
|
||||
lineId: string[]
|
||||
searchBeginTime: string
|
||||
searchEndTime: string
|
||||
condition: string[]
|
||||
harmonic: number
|
||||
inHarmonic: number
|
||||
}>({
|
||||
lineId: [],
|
||||
searchBeginTime: '',
|
||||
searchEndTime: '',
|
||||
condition: ['10', '11', '12'],
|
||||
harmonic: 2,
|
||||
inHarmonic: 1
|
||||
})
|
||||
const tableData = ref([])
|
||||
const showXieBoCiShu = ref(false)
|
||||
const showJianXieBoCiShu = ref(false)
|
||||
const options = ref<any>(null)
|
||||
|
||||
onMounted(() => {
|
||||
init()
|
||||
})
|
||||
const init = () => {
|
||||
loading.value = true
|
||||
formData.lineId = checked.value ? monitoringPoint.state.lineIds : [monitoringPoint.state.lineId]
|
||||
formData.searchBeginTime = datePickerRef.value.timeValue[0]
|
||||
formData.searchEndTime = datePickerRef.value.timeValue[1]
|
||||
getHistoryTableData(formData).then((res: any) => {
|
||||
tableData.value = res.data.map((item: any) => {
|
||||
return {
|
||||
...item,
|
||||
maxData: item.maxData.toFixed(2),
|
||||
minData: item.minData.toFixed(2),
|
||||
avgData: item.avgData.toFixed(2),
|
||||
cp95Data: item.cp95Data.toFixed(2)
|
||||
}
|
||||
})
|
||||
nextTick(() => {
|
||||
loading.value = false
|
||||
})
|
||||
})
|
||||
}
|
||||
const checkChange = () => {
|
||||
if (checked.value) {
|
||||
monitoringPoint.setShowCheckBox(true)
|
||||
} else {
|
||||
monitoringPoint.setShowCheckBox(false)
|
||||
init()
|
||||
}
|
||||
}
|
||||
const close = () => {
|
||||
console.log('====================================')
|
||||
console.log(2123123)
|
||||
console.log('====================================')
|
||||
options.value = null
|
||||
}
|
||||
const showCharts = (row: any, valueType: number, name: string) => {
|
||||
getHistoryLineData({
|
||||
lineId: row.lineId,
|
||||
number: row.number,
|
||||
phaseType: row.phaseType,
|
||||
searchTime: row.timeId,
|
||||
targetCode: row.targetCode,
|
||||
valueType
|
||||
}).then(res => {
|
||||
options.value = {
|
||||
title: {
|
||||
text: row.subName + ' ' + row.lineName + ' ' + row.targetName + ' ' + row.phaseType + '相' + name
|
||||
},
|
||||
legend: {
|
||||
show: false
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: '时间',
|
||||
data: res.data[0]?.value.map((item: any[]) => item[0])
|
||||
},
|
||||
yAxis: {
|
||||
name: '%',
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: name,
|
||||
data: res.data[0]?.value.map((item: any[]) => item[1]),
|
||||
type: 'line'
|
||||
}
|
||||
],
|
||||
options: {
|
||||
grid: {
|
||||
top: '50px',
|
||||
left: '40px',
|
||||
right: '60px',
|
||||
bottom: '10px',
|
||||
containLabel: true
|
||||
},
|
||||
dataZoom: null
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
const conditionChange = () => {
|
||||
//判断一个指标时
|
||||
if (formData.condition.length == 1) {
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
//判断2个指标时
|
||||
if (formData.condition.length == 2) {
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
(formData.condition.includes('45') && formData.condition.includes('46')) ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
showJianXieBoCiShu.value = true
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
//判断3个指标时
|
||||
if (formData.condition.length == 3) {
|
||||
if (
|
||||
(formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')) &&
|
||||
(formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49'))
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
//判断4个指标时
|
||||
if (formData.condition.length == 4) {
|
||||
if (
|
||||
(formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')) &&
|
||||
(formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49'))
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
//判断5个指标时
|
||||
if (formData.condition.length == 5) {
|
||||
if (
|
||||
(formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')) &&
|
||||
(formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49'))
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('46') ||
|
||||
// formData.condition.includes('47') ||
|
||||
// formData.condition.includes('48') ||
|
||||
formData.condition.includes('49')
|
||||
) {
|
||||
showJianXieBoCiShu.value = true
|
||||
} else {
|
||||
showJianXieBoCiShu.value = false
|
||||
}
|
||||
if (
|
||||
formData.condition.includes('40') ||
|
||||
formData.condition.includes('43') ||
|
||||
formData.condition.includes('44') ||
|
||||
formData.condition.includes('45')
|
||||
) {
|
||||
showXieBoCiShu.value = true
|
||||
} else {
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
//判断无指标时
|
||||
if (formData.condition.length == 0) {
|
||||
showJianXieBoCiShu.value = false
|
||||
showXieBoCiShu.value = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style></style>
|
||||
|
||||
Reference in New Issue
Block a user