Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

实时数据问题修改

Browse Source
This commit is contained in:
zhujiyan
2024-10-22 16:49:30 +08:00
parent 30c8ff5dbe
commit d7d84c15b2
2 changed files with 324 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files

296
src/views/govern/device/control/index.vue
View File

@@ -1,6 +1,10 @@
<template> <template>
<div class="default-main device-control" :style="{ height: pageHeight.height }" v-loading="loading" <div
style="position: relative"> class="default-main device-control"
:style="{ height: pageHeight.height }"
v-loading="loading"
style="position: relative"
>
<PointTree @node-click="nodeClick" @init="nodeClick" @pointTypeChange="pointTypeChange"></PointTree> <PointTree @node-click="nodeClick" @init="nodeClick" @pointTypeChange="pointTypeChange"></PointTree>
<div class="device-control-right" v-if="deviceData"> <div class="device-control-right" v-if="deviceData">
<el-descriptions title="设备基本信息" class="mb10" :column="3" border> <el-descriptions title="设备基本信息" class="mb10" :column="3" border>
@@ -14,8 +18,12 @@
<el-button v-if="deviceType == '1'" type="primary" icon="el-icon-Monitor" @click="handleaddDevice"> <el-button v-if="deviceType == '1'" type="primary" icon="el-icon-Monitor" @click="handleaddDevice">
在线补召 在线补召
</el-button> </el-button>
<el-button v-if="deviceType == '1'" type="primary" icon="el-icon-Tickets" <el-button
@click="handleAnalysisList"> v-if="deviceType == '1'"
type="primary"
icon="el-icon-Tickets"
@click="handleAnalysisList"
>
补召日志 补召日志
</el-button> </el-button>
</template> </template>
@@ -40,8 +48,13 @@
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>
<el-tabs v-model="dataSet" type="border-card" class="device-control-box-card" @tab-click="handleClick"> <el-tabs v-model="dataSet" type="border-card" class="device-control-box-card" @tab-click="handleClick">
<el-tab-pane lazy :label="item.name" :name="item.id" v-for="(item, index) in deviceData.dataSetList" <el-tab-pane
:key="index"> lazy
:label="item.name"
:name="item.id"
v-for="(item, index) in deviceData.dataSetList"
:key="index"
>
<template #label> <template #label>
<span class="custom-tabs-label"> <span class="custom-tabs-label">
<el-icon> <el-icon>
@@ -50,44 +63,59 @@
<DataAnalysis v-if="item.name.includes('趋势数据')" /> <DataAnalysis v-if="item.name.includes('趋势数据')" />
<Timer v-if="item.name.includes('实时数据')" /> <Timer v-if="item.name.includes('实时数据')" />
<Monitor v-if="item.name.includes('暂态事件')" /> <Monitor v-if="item.name.includes('暂态事件')" />
<Odometer v-if=" <Odometer
item.name != 'APF模块数据' && v-if="
item.name != '历史APF模块数据' && item.name != 'APF模块数据' &&
!item.name.includes('历史监测') && item.name != '历史APF模块数据' &&
!item.name.includes('趋势数据') && !item.name.includes('历史监测') &&
!item.name.includes('实时数据') && !item.name.includes('趋势数据') &&
!item.name.includes('暂态事件') !item.name.includes('实时数据') &&
" /> !item.name.includes('暂态事件')
<Histogram v-if=" "
item.name != 'APF模块数据' && />
item.name != '历史APF模块数据' && <Histogram
item.name.includes('历史监测') && v-if="
!item.name.includes('趋势数据') && item.name != 'APF模块数据' &&
!item.name.includes('实时数据') && item.name != '历史APF模块数据' &&
!item.name.includes('暂态事件') item.name.includes('历史监测') &&
" /> !item.name.includes('趋势数据') &&
!item.name.includes('实时数据') &&
!item.name.includes('暂态事件')
"
/>
</el-icon> </el-icon>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</span> </span>
</template> </template>
</el-tab-pane> </el-tab-pane>
<TableHeader :showSearch="false" v-if=" <TableHeader
(dataSet.indexOf('_trenddata') == -1 && :showSearch="false"
dataSet.indexOf('_realtimedata') == -1 && v-if="
dataSet.indexOf('_event') == -1) || (dataSet.indexOf('_trenddata') == -1 &&
realTimeFlag dataSet.indexOf('_realtimedata') == -1 &&
"> dataSet.indexOf('_event') == -1) ||
realTimeFlag
"
>
<template #select> <template #select>
<el-form-item label="日期" v-show="dataSet.indexOf('_history') != -1"> <el-form-item label="日期" v-show="dataSet.indexOf('_history') != -1">
<DatePicker ref="datePickerRef"></DatePicker> <DatePicker ref="datePickerRef"></DatePicker>
</el-form-item> </el-form-item>
<el-form-item label="指标" v-show="!realTimeFlag"> <el-form-item label="指标" v-show="!realTimeFlag">
<el-input style="width: 160px" v-model="formInline.searchValue" autocomplete="off" clearable <el-input
placeholder="请输入关键词"></el-input> style="width: 160px"
v-model="formInline.searchValue"
autocomplete="off"
clearable
placeholder="请输入关键词"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="值类型"> <el-form-item label="值类型">
<el-select style="min-width: 120px !important" v-model="formInline.dataLevel" <el-select
:disabled="dataLevel == 'Primary' && deviceType == '0'"> style="min-width: 120px !important"
v-model="formInline.dataLevel"
:disabled="dataLevel == 'Primary' && deviceType == '0'"
>
<el-option value="Primary" label="一次值"></el-option> <el-option value="Primary" label="一次值"></el-option>
<el-option value="Secondary" label="二次值"></el-option> <el-option value="Secondary" label="二次值"></el-option>
</el-select> </el-select>
@@ -101,32 +129,48 @@
<el-button type="primary" v-if="realTimeFlag" :icon="DataLine" @click="handleTrend"> <el-button type="primary" v-if="realTimeFlag" :icon="DataLine" @click="handleTrend">
谐波频谱 谐波频谱
</el-button> </el-button>
<el-button type="primary" v-if="realTimeFlag" :icon="TrendCharts" <el-button
@click="handleHarmonicSpectrum"> type="primary"
v-if="realTimeFlag"
:icon="TrendCharts"
@click="handleHarmonicSpectrum"
>
实时趋势 实时趋势
</el-button> </el-button>
</template> </template>
</TableHeader> </TableHeader>
<div style="height: calc(100vh - 300px)" v-if=" <div
dataSet.indexOf('_trenddata') == -1 && style="height: calc(100vh - 300px)"
dataSet.indexOf('_realtimedata') == -1 && v-if="
dataSet.indexOf('_event') == -1 && dataSet.indexOf('_trenddata') == -1 &&
tableData.length == 0 dataSet.indexOf('_realtimedata') == -1 &&
" v-loading="tableLoading"></div> dataSet.indexOf('_event') == -1 &&
<div style="overflow: auto" :style="{ height: tableHeight }" v-if=" tableData.length == 0
dataSet.indexOf('_trenddata') == -1 && "
dataSet.indexOf('_realtimedata') == -1 && v-loading="tableLoading"
dataSet.indexOf('_event') == -1 && ></div>
tableData.length != 0 <div
"> style="overflow: auto"
:style="{ height: tableHeight }"
v-if="
dataSet.indexOf('_trenddata') == -1 &&
dataSet.indexOf('_realtimedata') == -1 &&
dataSet.indexOf('_event') == -1 &&
tableData.length != 0
"
>
<!-- 循环渲染的card 最新数据/历史数据显示 --> <!-- 循环渲染的card 最新数据/历史数据显示 -->
<div class="content" v-loading="tableLoading"> <div class="content" v-loading="tableLoading">
<el-card class="box-card" v-for="(item, index) in tableData" :key="index"> <el-card class="box-card" v-for="(item, index) in tableData" :key="index">
<template #header> <template #header>
<div class="clearfix"> <div class="clearfix">
<span style="flex: 1">{{ item.name }}</span> <span style="flex: 1">{{ item.name }}</span>
<Icon name="el-icon-TrendCharts" class="ml10" @click="getDeviceDataTrend(item)" <Icon
style="font-size: 26px; cursor: pointer; color: #fff"></Icon> name="el-icon-TrendCharts"
class="ml10"
@click="getDeviceDataTrend(item)"
style="font-size: 26px; cursor: pointer; color: #fff"
></Icon>
</div> </div>
</template> </template>
<!-- 模块数据 --> <!-- 模块数据 -->
@@ -141,37 +185,49 @@
</div> </div>
<div v-else-if="item.children.length"> <div v-else-if="item.children.length">
<div style="display: flex; align-items: center"> <div style="display: flex; align-items: center">
<el-tag effect="dark" type="danger" style="width: 40px; text-align: center" <el-tag
class="mr10"> effect="dark"
type="danger"
style="width: 40px; text-align: center"
class="mr10"
>
MAX MAX
</el-tag> </el-tag>
{{ {{
item.children[0].maxValue === 3.1415956 || item.children[0].maxValue === 3.1415956 ||
typeof item.children[0].maxValue != 'number' typeof item.children[0].maxValue != 'number'
? '暂无数据' ? '暂无数据'
: item.children[0].maxValue : item.children[0].maxValue
}} }}
</div> </div>
<div style="display: flex; align-items: center" class="mt10"> <div style="display: flex; align-items: center" class="mt10">
<el-tag effect="dark" type="success" style="width: 40px; text-align: center" <el-tag
class="mr10"> effect="dark"
type="success"
style="width: 40px; text-align: center"
class="mr10"
>
AVG AVG
</el-tag> </el-tag>
{{ {{
item.children[0].avgValue === 3.1415956 || item.children[0].avgValue === 3.1415956 ||
typeof item.children[0].avgValue != 'number' typeof item.children[0].avgValue != 'number'
? '暂无数据' ? '暂无数据'
: item.children[0].avgValue : item.children[0].avgValue
}} }}
</div> </div>
<div style="display: flex; align-items: center" class="mt10"> <div style="display: flex; align-items: center" class="mt10">
<el-tag effect="dark" type="warning" style="width: 40px; text-align: center" <el-tag
class="mr10"> effect="dark"
type="warning"
style="width: 40px; text-align: center"
class="mr10"
>
MIN MIN
</el-tag> </el-tag>
{{ {{
item.children[0].minValue === 3.1415956 || item.children[0].minValue === 3.1415956 ||
typeof item.children[0].minValue != 'number' typeof item.children[0].minValue != 'number'
? '暂无数据' ? '暂无数据'
: item.children[0].minValue : item.children[0].minValue
}} }}
@@ -181,24 +237,39 @@
<el-empty description="暂无数据" v-if="tableData.length === 0"></el-empty> <el-empty description="暂无数据" v-if="tableData.length === 0"></el-empty>
</div> </div>
</div> </div>
<el-pagination v-if=" <el-pagination
tableData.length && v-if="
dataSet.indexOf('_trenddata') == -1 && tableData.length &&
dataSet.indexOf('_realtimedata') == -1 && dataSet.indexOf('_trenddata') == -1 &&
dataSet.indexOf('_event') == -1 dataSet.indexOf('_realtimedata') == -1 &&
" background class="mr2 mt10" style="float: right" @size-change="handleSizeChange" dataSet.indexOf('_event') == -1
@current-change="pageChange" :current-page="formInline.pageNum" :page-sizes="[20, 30, 40, 50, 100]" "
:page-size="formInline.pageSize" layout="total, sizes, prev, pager, next, jumper" background
:total="formInline.total"></el-pagination> class="mr2 mt10"
style="float: right"
@size-change="handleSizeChange"
@current-change="pageChange"
:current-page="formInline.pageNum"
:page-sizes="[20, 30, 40, 50, 100]"
:page-size="formInline.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="formInline.total"
></el-pagination>
<!-- 趋势数据 --> <!-- 趋势数据 -->
<div style="height: calc(100vh - 340px)" v-if="dataSet.indexOf('_trenddata') != -1" <div
v-loading="tableLoading"> style="height: calc(100vh - 340px)"
v-if="dataSet.indexOf('_trenddata') != -1"
v-loading="tableLoading"
>
<Trend ref="trendRef"></Trend> <Trend ref="trendRef"></Trend>
</div> </div>
<!-- 实时数据 --> <!-- 实时数据 -->
<div style="height: calc(100vh - 340px)" v-if="dataSet.indexOf('_realtimedata') != -1" <div
v-loading="tableLoading"> style="height: calc(100vh - 340px)"
v-if="dataSet.indexOf('_realtimedata') != -1"
v-loading="tableLoading"
>
<!-- <div class="view_top_btn" v-if="realTimeFlag"> <!-- <div class="view_top_btn" v-if="realTimeFlag">
<el-button type="primary" :icon="Platform" @click="handleRecordWaves"> <el-button type="primary" :icon="Platform" @click="handleRecordWaves">
实时录波 实时录波
@@ -213,16 +284,23 @@
<!-- 实时数据-实时录波组件 --> <!-- 实时数据-实时录波组件 -->
<recordWoves v-if="!realTimeFlag && sonTab == 0"></recordWoves> <recordWoves v-if="!realTimeFlag && sonTab == 0"></recordWoves>
<!-- 实时数据-实时趋势组件 --> <!-- 实时数据-实时趋势组件 -->
<realTrend v-if="!realTimeFlag && sonTab == 1" ref="realTrendRef" <realTrend
@changeTrendType="changeTrendType"> v-if="!realTimeFlag && sonTab == 1"
</realTrend> ref="realTrendRef"
@changeTrendType="changeTrendType"
></realTrend>
<!-- 实时数据-谐波频谱组件 --> <!-- 实时数据-谐波频谱组件 -->
<harmonicSpectrum v-show="!realTimeFlag && sonTab == 2" ref="harmonicSpectrumRef"> <harmonicSpectrum
</harmonicSpectrum> v-show="!realTimeFlag && sonTab == 2"
ref="harmonicSpectrumRef"
></harmonicSpectrum>
</div> </div>
<!-- 暂态事件 --> <!-- 暂态事件 -->
<div style="height: calc(100vh - 340px)" v-if="dataSet.indexOf('_event') != -1" <div
v-loading="tableLoading"> style="height: calc(100vh - 340px)"
v-if="dataSet.indexOf('_event') != -1"
v-loading="tableLoading"
>
<Event ref="eventRef"></Event> <Event ref="eventRef"></Event>
</div> </div>
<div v-if="!tableData" style="height: 42px"></div> <div v-if="!tableData" style="height: 42px"></div>
@@ -312,7 +390,6 @@ const sonTab = ref()
// const handleRecordWaves = () => { // const handleRecordWaves = () => {
// realTimeFlag.value = false // realTimeFlag.value = false
// sonTab.value = 0 // sonTab.value = 0
// window.clearInterval(timer.value)
// } // }
//谐波频谱 //谐波频谱
const realTrendRef = ref() const realTrendRef = ref()
@@ -326,9 +403,12 @@ const trendTimer: any = ref()
const handleTrend = async () => { const handleTrend = async () => {
realTimeFlag.value = false realTimeFlag.value = false
sonTab.value = 1 sonTab.value = 1
clearInterval(timer.value) if (realDataTimer.value) {
clearInterval(realDataTimer.value) window.clearInterval(realDataTimer.value)
clearInterval(trendTimer.value) }
if (trendTimer.value) {
clearInterval(trendTimer.value)
}
await getHarmRealData(lineId.value, activeTrendName.value) await getHarmRealData(lineId.value, activeTrendName.value)
.then((res: any) => { .then((res: any) => {
if (res.code == 'A0000') { if (res.code == 'A0000') {
@@ -340,7 +420,6 @@ const handleTrend = async () => {
) )
let obj = JSON.parse(JSON.stringify(JSON.parse(new TextDecoder().decode(message)))) || {} let obj = JSON.parse(JSON.stringify(JSON.parse(new TextDecoder().decode(message)))) || {}
if (obj.data1) { if (obj.data1) {
realTrendRef.value && realTrendRef.value.setRealTrendData(obj) realTrendRef.value && realTrendRef.value.setRealTrendData(obj)
} }
}) })
@@ -354,7 +433,6 @@ const handleTrend = async () => {
//每隔30s调用一下接口，通知后台推送mqtt消息 //每隔30s调用一下接口，通知后台推送mqtt消息
trendTimer.value = setInterval(() => { trendTimer.value = setInterval(() => {
getHarmRealData(lineId.value, activeTrendName.value).then((res: any) => { getHarmRealData(lineId.value, activeTrendName.value).then((res: any) => {
console.log(res, '获取谐波频谱数据') console.log(res, '获取谐波频谱数据')
connectMqtt() connectMqtt()
@@ -392,20 +470,18 @@ const harmonicSpectrumRef = ref()
//实时趋势 //实时趋势
const handleHarmonicSpectrum = () => { const handleHarmonicSpectrum = () => {
realTimeFlag.value = false realTimeFlag.value = false
// window.clearInterval(timer.value)
// clearInterval(realDataTimer.value)
sonTab.value = 2 sonTab.value = 2
harmonicSpectrumRef.value && harmonicSpectrumRef.value.resetData() harmonicSpectrumRef.value && harmonicSpectrumRef.value.resetData()
// getRealDataMqttMsg() // getRealDataMqttMsg()
} }
//返回 //返回
const handleReturn = () => { const handleReturn = () => {
console.log("🚀 ~ handleReturn ~ realDataTimer.value:", trendTimer.value) if (realDataTimer.value) {
clearInterval(realDataTimer.value)
clearInterval(trendTimer.value) }
clearInterval(realDataTimer.value) if (trendTimer.value) {
clearInterval(trendTimer.value)
}
realTimeFlag.value = true realTimeFlag.value = true
sonTab.value = null sonTab.value = null
@@ -512,7 +588,6 @@ const realTimeRef: any = ref()
const trendRef: any = ref() const trendRef: any = ref()
//暂态事件组件 //暂态事件组件
const eventRef: any = ref() const eventRef: any = ref()
const timer: any = ref()
const mqttRef = ref() const mqttRef = ref()
const url: any = inject('MQTTURL') const url: any = inject('MQTTURL')
const connectMqtt = () => { const connectMqtt = () => {
@@ -533,9 +608,12 @@ const connectMqtt = () => {
mqttRef.value = mqtt.connect(url, options) mqttRef.value = mqtt.connect(url, options)
} }
const getRealDataMqttMsg = async () => { const getRealDataMqttMsg = async () => {
clearInterval(timer.value) if (realDataTimer.value) {
clearInterval(realDataTimer.value) clearInterval(realDataTimer.value)
clearInterval(trendTimer.value) }
if (trendTimer.value) {
clearInterval(trendTimer.value)
}
//新的实时数据 //新的实时数据
//1.调用接口 mqtt推送数据 //1.调用接口 mqtt推送数据
await getBasicRealData(lineId.value).then((res: any) => { await getBasicRealData(lineId.value).then((res: any) => {
@@ -711,7 +789,10 @@ const realDataTimer: any = ref()
const mqttMessage = ref<any>({}) const mqttMessage = ref<any>({})
const handleClick = async (tab?: any) => { const handleClick = async (tab?: any) => {
if (realDataTimer.value) { if (realDataTimer.value) {
window.clearInterval(realDataTimer.value) clearInterval(realDataTimer.value)
}
if (trendTimer.value) {
clearInterval(trendTimer.value)
} }
tableLoading.value = true tableLoading.value = true
//点击tab时更新dataSet最新值 //点击tab时更新dataSet最新值
@@ -727,9 +808,6 @@ const handleClick = async (tab?: any) => {
tableData.value = [] tableData.value = []
formInline.pageNum = 1 formInline.pageNum = 1
} }
if (timer.value) {
window.clearInterval(timer.value)
}
//查询历史指标 //查询历史指标
if (dataSet.value.includes('_history')) { if (dataSet.value.includes('_history')) {
@@ -818,15 +896,19 @@ const handleClick = async (tab?: any) => {
}) })
} }
if (!dataSet.value.includes('_realtimedata')) { if (!dataSet.value.includes('_realtimedata')) {
clearInterval(timer.value) if (realDataTimer.value) {
clearInterval(realDataTimer.value) clearInterval(realDataTimer.value)
}
if (trendTimer.value) {
clearInterval(trendTimer.value)
}
if (mqttRef.value) { if (mqttRef.value) {
mqttRef.value.end() mqttRef.value.end()
} }
} }
} }
//模版下载 //模版下载
const handleDownLoadTemplate = () => { } const handleDownLoadTemplate = () => {}
//补召日志 //补召日志
const analysisListRef = ref() const analysisListRef = ref()
//打开补召日志 //打开补召日志
@@ -863,10 +945,14 @@ const echoName = (value: any, arr: any[]) => {
return value ? arr.find(item => item.value == value)?.label : '/' return value ? arr.find(item => item.value == value)?.label : '/'
} }
onMounted(() => { }) onMounted(() => {})
onUnmounted(() => { onUnmounted(() => {
clearInterval(timer.value) if (realDataTimer.value) {
clearInterval(realDataTimer.value) clearInterval(realDataTimer.value)
}
if (trendTimer.value) {
clearInterval(trendTimer.value)
}
}) })
</script> </script>

252
src/views/govern/device/control/tabs/components/harmonicSpectrum.vue
View File

@@ -4,18 +4,33 @@
<div class="harmonic_select"> <div class="harmonic_select">
<el-form :model="searchForm" id="history_select"> <el-form :model="searchForm" id="history_select">
<el-form-item label="稳态指标"> <el-form-item label="稳态指标">
<el-select multiple collapse-tags collapse-tags-tooltip v-model="searchForm.index" <el-select
placeholder="请选择统计指标" :multiple-limit="3" value-key="id"> multiple
<el-option v-for="(item, index) in indexOptions" :label="item.name" :key="index" collapse-tags
:value="item"></el-option> collapse-tags-tooltip
v-model="searchForm.index"
placeholder="请选择统计指标"
:multiple-limit="3"
value-key="id"
>
<el-option
v-for="(item, index) in indexOptions"
:label="item.name"
:key="index"
:value="item"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<!-- <el-button type="primary" :loading="loading" @click="init">查询</el-button> --> <!-- <el-button type="primary" :loading="loading" @click="init">查询</el-button> -->
</el-form> </el-form>
</div> </div>
<div class="harmonic_body"> <div class="harmonic_body">
<div class="harmonic_body_charts" :style="{ height: height }" v-for="(item, index) in searchForm.index" <div
:key="index"> class="harmonic_body_charts"
:style="{ height: height }"
v-for="(item, index) in searchForm.index"
:key="index"
>
<MyEchart :ref="setChildRef(index)" :options="item.echartsData" :isInterVal="true"></MyEchart> <MyEchart :ref="setChildRef(index)" :options="item.echartsData" :isInterVal="true"></MyEchart>
</div> </div>
</div> </div>
@@ -34,116 +49,116 @@ searchForm.value = {
//统计指标 //统计指标
const indexOptions: any = ref([]) const indexOptions: any = ref([])
indexOptions.value = [ // indexOptions.value = [
{ // {
id: 0, // id: 0,
name: '电压总有效值(kV)', // name: '电压总有效值(kV)',
children: [ // children: [
{ name: 'vRmsA', phase: 'A相', data: [], yMethodList: [] }, // { name: 'vRmsA', phase: 'A相', data: [], yMethodList: [] },
{ name: 'vRmsB', phase: 'B相', data: [], yMethodList: [] }, // { name: 'vRmsB', phase: 'B相', data: [], yMethodList: [] },
{ name: 'vRmsC', phase: 'C相', data: [], yMethodList: [] } // { name: 'vRmsC', phase: 'C相', data: [], yMethodList: [] }
], // ],
unit: 'kV', // unit: 'kV',
data: [], // data: [],
yMethodList: [] // yMethodList: []
}, // },
{ // {
id: 1, // id: 1,
name: '电流总有效值(A)', // name: '电流总有效值(A)',
children: [ // children: [
{ name: 'iRmsA', phase: 'A相', data: [], yMethodList: [] }, // { name: 'iRmsA', phase: 'A相', data: [], yMethodList: [] },
{ name: 'iRmsB', phase: 'B相', data: [], yMethodList: [] }, // { name: 'iRmsB', phase: 'B相', data: [], yMethodList: [] },
{ name: 'iRmsC', phase: 'C相', data: [], yMethodList: [] } // { name: 'iRmsC', phase: 'C相', data: [], yMethodList: [] }
], // ],
unit: 'A', // unit: 'A',
data: [], // data: [],
yMethodList: [] // yMethodList: []
}, // },
{ // {
id: 2, // id: 2,
name: '有功功率(kW)', // name: '有功功率(kW)',
children: [ // children: [
{ name: 'pA', phase: 'A相', data: [], yMethodList: [] }, // { name: 'pA', phase: 'A相', data: [], yMethodList: [] },
{ name: 'pB', phase: 'B相', data: [], yMethodList: [] }, // { name: 'pB', phase: 'B相', data: [], yMethodList: [] },
{ name: 'pC', phase: 'C相', data: [], yMethodList: [] }, // { name: 'pC', phase: 'C相', data: [], yMethodList: [] },
{ name: 'pTot', phase: '总', data: [], yMethodList: [] } // { name: 'pTot', phase: '总', data: [], yMethodList: [] }
], // ],
unit: 'kW', // unit: 'kW',
data: [], // data: [],
yMethodList: [] // yMethodList: []
}, // },
{ // {
id: 3, // id: 3,
name: '无功功率(kW)', // name: '无功功率(kW)',
children: [ // children: [
{ name: 'qA', phase: 'A相', data: [], yMethodList: [] }, // { name: 'qA', phase: 'A相', data: [], yMethodList: [] },
{ name: 'qB', phase: 'B相', data: [], yMethodList: [] }, // { name: 'qB', phase: 'B相', data: [], yMethodList: [] },
{ name: 'qC', phase: 'C相', data: [], yMethodList: [] }, // { name: 'qC', phase: 'C相', data: [], yMethodList: [] },
{ name: 'qTot', phase: '总', data: [], yMethodList: [] } // { name: 'qTot', phase: '总', data: [], yMethodList: [] }
], // ],
unit: 'kW', // unit: 'kW',
data: [], // data: [],
yMethodList: [] // yMethodList: []
}, // },
{ // {
id: 4, // id: 4,
name: '基波电压总有效值(kV)', // name: '基波电压总有效值(kV)',
children: [ // children: [
{ name: 'v1A', phase: 'A相', data: [], yMethodList: [] }, // { name: 'v1A', phase: 'A相', data: [], yMethodList: [] },
{ name: 'v1B', phase: 'B相', data: [], yMethodList: [] }, // { name: 'v1B', phase: 'B相', data: [], yMethodList: [] },
{ name: 'v1C', phase: 'C相', data: [], yMethodList: [] } // { name: 'v1C', phase: 'C相', data: [], yMethodList: [] }
], // ],
unit: 'kV', // unit: 'kV',
data: [], // data: [],
yMethodList: [] // yMethodList: []
}, // },
{ // {
id: 5, // id: 5,
name: '基波电流总有效值(A)', // name: '基波电流总有效值(A)',
children: [ // children: [
{ name: 'i1A', phase: 'A相', data: [], yMethodList: [] }, // { name: 'i1A', phase: 'A相', data: [], yMethodList: [] },
{ name: 'i1B', phase: 'B相', data: [], yMethodList: [] }, // { name: 'i1B', phase: 'B相', data: [], yMethodList: [] },
{ name: 'i1C', phase: 'C相', data: [], yMethodList: [] } // { name: 'i1C', phase: 'C相', data: [], yMethodList: [] }
], // ],
unit: 'A', // unit: 'A',
data: [], // data: [],
yMethodList: [] // yMethodList: []
}, // },
{ // {
id: 6, // id: 6,
name: '频率(Hz)', // name: '频率(Hz)',
children: [ // children: [
{ name: 'freq', phase: '频率', data: [], yMethodList: [] }, // { name: 'freq', phase: '频率', data: [], yMethodList: [] },
{ name: 'freqDev', phase: '频率偏差', data: [], yMethodList: [] } // { name: 'freqDev', phase: '频率偏差', data: [], yMethodList: [] }
], // ],
unit: 'Hz', // unit: 'Hz',
data: [], // data: [],
yMethodList: [] // yMethodList: []
}, // },
{ // {
id: 7, // id: 7,
name: '电压不平衡度(%)', // name: '电压不平衡度(%)',
children: [{ name: 'vUnbalance', phase: '电压不平衡度', data: [], yMethodList: [] }], // children: [{ name: 'vUnbalance', phase: '电压不平衡度', data: [], yMethodList: [] }],
unit: '%', // unit: '%',
data: [], // data: [],
yMethodList: [] // yMethodList: []
}, // },
{ // {
id: 8, // id: 8,
name: '电流不平衡度(%)', // name: '电流不平衡度(%)',
children: [{ name: 'iUnbalance', phase: '电流不平衡度', data: [], yMethodList: [] }], // children: [{ name: 'iUnbalance', phase: '电流不平衡度', data: [], yMethodList: [] }],
unit: '%', // unit: '%',
data: [], // data: [],
yMethodList: [] // yMethodList: []
} // }
] // ]
// searchForm.value.index[0] = indexOptions.value[0] // searchForm.value.index[0] = indexOptions.value[0]
const heightTop = mainHeight(275) const heightTop = mainHeight(275)
let height: any = mainHeight(275).height let height: any = mainHeight(275).height
const params: any = ref({})
const loading = ref(false) const loading = ref(false)
const allDataList: any = ref([])
const resetData = () => { const resetData = () => {
loading.value = true loading.value = true
indexOptions.value = [ indexOptions.value = [
@@ -252,11 +267,11 @@ const resetData = () => {
] ]
searchForm.value.index = [] searchForm.value.index = []
searchForm.value.index[0] = indexOptions.value[0] searchForm.value.index[0] = indexOptions.value[0]
allDataList.value = []
} }
resetData() resetData()
const mqttMessage: any = ref() const mqttMessage: any = ref()
const setHarmonicSpectrumData = (val: any) => { const setHarmonicSpectrumData = (val: any) => {
console.log("🚀 ~ setHarmonicSpectrumData ~ val:", val)
mqttMessage.value = val mqttMessage.value = val
init() init()
} }
@@ -266,8 +281,6 @@ const setChildRef = (index: any) => {
} }
const childRefs: any = {} const childRefs: any = {}
const init = () => { const init = () => {
// resetData()
console.log(searchForm.value.index, '----------')
loading.value = true loading.value = true
searchForm.value.index.map((item: any, index: any) => { searchForm.value.index.map((item: any, index: any) => {
item?.children.map((vv: any, vvs: any) => { item?.children.map((vv: any, vvs: any) => {
@@ -277,6 +290,7 @@ const init = () => {
value: mqttMessage.value[vv.name], value: mqttMessage.value[vv.name],
key: vv.name key: vv.name
}) })
allDataList.value.push(mqttMessage.value[vv.name])
vv.data.push(mqttMessage.value[vv.name]) vv.data.push(mqttMessage.value[vv.name])
vv.yMethodList.push([mqttMessage.value.dataTime, mqttMessage.value[vv.name] + '', vv.phase]) vv.yMethodList.push([mqttMessage.value.dataTime, mqttMessage.value[vv.name] + '', vv.phase])
} }
@@ -340,8 +354,7 @@ const init = () => {
}, },
yAxis: { yAxis: {
type: 'value', type: 'value',
name: item.unit, name: item.unit
}, },
series: [] series: []
} }
@@ -349,9 +362,9 @@ const init = () => {
searchForm.value.index.length == 3 searchForm.value.index.length == 3
? (height = mainHeight(275, 3).height) ? (height = mainHeight(275, 3).height)
: (height = mainHeight(275, searchForm.value.index.length).height) : (height = mainHeight(275, searchForm.value.index.length).height)
console.log(item.children, '<<<<<<<<<<<<<<<<<<<<<<344')
item.children.map((zz: any, zzIndex: any) => { item.children.map((zz: any, zzIndex: any) => {
console.log(zz, '-------------', zz.yMethodList) let [min, max] = yMethod(allDataList.value)
console.log(max, min)
item.echartsData.series.push({ item.echartsData.series.push({
name: zz.phase, name: zz.phase,
type: 'line', type: 'line',
@@ -364,14 +377,15 @@ const init = () => {
smooth: true, // 这里设置平滑曲线 smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆 symbol: 'none' // 设置为 'none' 去掉折点小圆
}) })
item.echartsData.yAxis.max = max
item.echartsData.yAxis.min = min
}) })
console.log(searchForm.value.index, item.echartsData, '最新的结果')
}) })
loading.value = false loading.value = false
} }
onMounted(() => { }) onMounted(() => {})
defineExpose({ resetData, setHarmonicSpectrumData }) defineExpose({ resetData, setHarmonicSpectrumData })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>