联调准实时数据
This commit is contained in:
@@ -102,3 +102,12 @@ export function getDeviceHarmonicSpectrumData(data: any) {
|
|||||||
data: data
|
data: data
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
//获取指标类型-谐波频谱
|
||||||
|
export function queryDictType() {
|
||||||
|
return createAxios({
|
||||||
|
url: '/system-boot/dictTree/queryDictType',
|
||||||
|
method: 'GET',
|
||||||
|
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -51,3 +51,21 @@ export function deviceRtData(data: any) {
|
|||||||
data: form
|
data: form
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
// 装置分组历史数据
|
||||||
|
export function realTimeData(data: any) {
|
||||||
|
let form = new FormData()
|
||||||
|
form.append('id', data.id)
|
||||||
|
form.append('lineId', data.lineId)
|
||||||
|
form.append('pageNum', data.pageNum)
|
||||||
|
form.append('pageSize', data.pageSize)
|
||||||
|
form.append('searchValue', data.searchValue)
|
||||||
|
form.append('targetType', data.targetType)
|
||||||
|
form.append('dataLevel',data.dataLevel)
|
||||||
|
return createAxios({
|
||||||
|
url: '/cs-harmonic-boot/data/realTimeData',
|
||||||
|
method: 'POST',
|
||||||
|
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -82,10 +82,17 @@
|
|||||||
<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-if="dataSet.indexOf('_history') == -1">
|
||||||
|
|
||||||
|
<el-select v-model="formInline.targetType">
|
||||||
|
<el-option v-for="item in queryList" :key="item.id" :label="item.name"
|
||||||
|
:value="item.id" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<!-- <el-form-item label="指标" v-show="!realTimeFlag">
|
||||||
<el-input style="width: 160px" v-model="formInline.searchValue" autocomplete="off" clearable
|
<el-input style="width: 160px" v-model="formInline.searchValue" autocomplete="off" clearable
|
||||||
placeholder="请输入关键词"></el-input>
|
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 style="min-width: 120px !important" v-model="formInline.dataLevel"
|
||||||
:disabled="dataLevel == 'Primary' && deviceType == '0'">
|
:disabled="dataLevel == 'Primary' && deviceType == '0'">
|
||||||
@@ -139,10 +146,16 @@
|
|||||||
tableData.length != 0
|
tableData.length != 0
|
||||||
">
|
">
|
||||||
<div class="mb5 mt5" v-if="dataSet.indexOf('_history') == -1">
|
<div class="mb5 mt5" v-if="dataSet.indexOf('_history') == -1">
|
||||||
统计时间:{{ tableData[0].children.length ? tableData[0].children[0].time : '' }}
|
统计时间:{{ tableData[0]?.time || '' }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<nearRealTimeData ref="nearRealTimeDataRef" v-if="dataSet.indexOf('_history') == -1"
|
||||||
|
/>
|
||||||
|
|
||||||
|
|
||||||
<!-- 循环渲染的card 最新数据/历史数据显示 -->
|
<!-- 循环渲染的card 最新数据/历史数据显示 -->
|
||||||
<div class="content" v-if="tableData.length != 0 && !tableLoading"
|
<div class="content"
|
||||||
|
v-if="tableData.length != 0 && !tableLoading && dataSet.indexOf('_history') != -1"
|
||||||
:style="{ height: tableHeightBox }">
|
:style="{ height: tableHeightBox }">
|
||||||
|
|
||||||
<el-card class="box-card" :class="dataSet.indexOf('_history') == -1 ? 'box-card-new' : ''"
|
<el-card class="box-card" :class="dataSet.indexOf('_history') == -1 ? 'box-card-new' : ''"
|
||||||
@@ -154,7 +167,71 @@
|
|||||||
style="font-size: 26px; cursor: pointer; color: #fff"></Icon>
|
style="font-size: 26px; cursor: pointer; color: #fff"></Icon>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<!-- 模块数据 -->
|
|
||||||
|
<div class="box-card-content" v-if="dataSet.indexOf('_history') == -1">
|
||||||
|
<div class="box-card-div">
|
||||||
|
<div v-for="(child, childIndex) in item.children" :key="childIndex">
|
||||||
|
{{ child.anotherName }}:
|
||||||
|
{{ child.dataValue === 3.1415926 ? '暂无数据' : child.dataValue }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div v-else-if="item.children.length" class="box-card-div">
|
||||||
|
<div style="display: flex; align-items: center">
|
||||||
|
<el-tag effect="dark" type="danger" style="width: 40px; text-align: center"
|
||||||
|
class="mr10">
|
||||||
|
MAX
|
||||||
|
</el-tag>
|
||||||
|
{{
|
||||||
|
item.children[0].maxValue === 3.1415956 ||
|
||||||
|
typeof item.children[0].maxValue != 'number'
|
||||||
|
? '暂无数据'
|
||||||
|
: item.children[0].maxValue
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
<div style="display: flex; align-items: center">
|
||||||
|
<el-tag effect="dark" type="success" style="width: 40px; text-align: center"
|
||||||
|
class="mr10">
|
||||||
|
AVG
|
||||||
|
</el-tag>
|
||||||
|
{{
|
||||||
|
item.children[0].avgValue === 3.1415956 ||
|
||||||
|
typeof item.children[0].avgValue != 'number'
|
||||||
|
? '暂无数据'
|
||||||
|
: item.children[0].avgValue
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
<div style="display: flex; align-items: center">
|
||||||
|
<el-tag effect="dark" type="warning" style="width: 40px; text-align: center"
|
||||||
|
class="mr10">
|
||||||
|
MIN
|
||||||
|
</el-tag>
|
||||||
|
{{
|
||||||
|
item.children[0].minValue === 3.1415956 ||
|
||||||
|
typeof item.children[0].minValue != 'number'
|
||||||
|
? '暂无数据'
|
||||||
|
: item.children[0].minValue
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
<el-empty description="暂无数据" v-if="tableData.length === 0"></el-empty>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="content" v-if="tableData.length != 0 && !tableLoading"
|
||||||
|
:style="{ height: tableHeightBox }">
|
||||||
|
|
||||||
|
<el-card class="box-card" :class="dataSet.indexOf('_history') == -1 ? 'box-card-new' : ''"
|
||||||
|
v-for="(item, index) in tableData" :key="index">
|
||||||
|
<template #header>
|
||||||
|
<div class="clearfix">
|
||||||
|
<span style="flex: 1">{{ item.name }}</span>
|
||||||
|
<Icon name="el-icon-TrendCharts" class="ml10" @click="getDeviceDataTrend(item)"
|
||||||
|
style="font-size: 26px; cursor: pointer; color: #fff"></Icon>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
<div class="box-card-content" v-if="dataSet.indexOf('_history') == -1">
|
<div class="box-card-content" v-if="dataSet.indexOf('_history') == -1">
|
||||||
<div class="box-card-div">
|
<div class="box-card-div">
|
||||||
<div v-for="(child, childIndex) in item.children" :key="childIndex">
|
<div v-for="(child, childIndex) in item.children" :key="childIndex">
|
||||||
@@ -206,9 +283,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</el-card>
|
</el-card>
|
||||||
<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 v-if="
|
|
||||||
tableData.length &&
|
tableData.length &&
|
||||||
dataSet.indexOf('_trenddata') == -1 &&
|
dataSet.indexOf('_trenddata') == -1 &&
|
||||||
dataSet.indexOf('_realtimedata') == -1 &&
|
dataSet.indexOf('_realtimedata') == -1 &&
|
||||||
@@ -216,7 +293,7 @@
|
|||||||
" background class="mr2 mt10" style="float: right" @size-change="handleSizeChange"
|
" background class="mr2 mt10" style="float: right" @size-change="handleSizeChange"
|
||||||
@current-change="pageChange" :current-page="formInline.pageNum" :page-sizes="[20, 30, 40, 50, 100]"
|
@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"
|
:page-size="formInline.pageSize" layout="total, sizes, prev, pager, next, jumper"
|
||||||
:total="formInline.total"></el-pagination>
|
:total="formInline.total"></el-pagination> -->
|
||||||
|
|
||||||
<!-- 趋势数据 -->
|
<!-- 趋势数据 -->
|
||||||
<div style="height: calc(100vh - 340px)" v-if="dataSet.indexOf('_trenddata') != -1">
|
<div style="height: calc(100vh - 340px)" v-if="dataSet.indexOf('_trenddata') != -1">
|
||||||
@@ -271,9 +348,11 @@ import {
|
|||||||
getDeviceData,
|
getDeviceData,
|
||||||
getBasicRealData,
|
getBasicRealData,
|
||||||
getHarmRealData,
|
getHarmRealData,
|
||||||
getOverLimitData
|
getOverLimitData,
|
||||||
|
queryDictType,
|
||||||
|
|
||||||
} from '@/api/cs-device-boot/EquipmentDelivery'
|
} from '@/api/cs-device-boot/EquipmentDelivery'
|
||||||
import { deviceHisData, deviceRtData } from '@/api/cs-device-boot/csGroup'
|
import { deviceHisData, deviceRtData, realTimeData } from '@/api/cs-device-boot/csGroup'
|
||||||
import { ref, reactive, onMounted, onUnmounted, inject, nextTick, onBeforeUnmount } from 'vue'
|
import { ref, reactive, onMounted, onUnmounted, inject, nextTick, onBeforeUnmount } from 'vue'
|
||||||
import { ElMessage } from 'element-plus'
|
import { ElMessage } from 'element-plus'
|
||||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||||
@@ -284,6 +363,7 @@ import harmonicSpectrum from './tabs/components/harmonicSpectrum.vue' //实时
|
|||||||
import recordWoves from './tabs/components/recordwoves.vue' //实时数据-实时录波子页面
|
import recordWoves from './tabs/components/recordwoves.vue' //实时数据-实时录波子页面
|
||||||
import offLineDataImport from './offLineDataImport/index.vue'
|
import offLineDataImport from './offLineDataImport/index.vue'
|
||||||
import Event from './tabs/event.vue'
|
import Event from './tabs/event.vue'
|
||||||
|
import nearRealTimeData from './nearRealTimeData.vue'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
import TableHeader from '@/components/table/header/index.vue'
|
import TableHeader from '@/components/table/header/index.vue'
|
||||||
import { useAdminInfo } from '@/stores/adminInfo'
|
import { useAdminInfo } from '@/stores/adminInfo'
|
||||||
@@ -300,11 +380,12 @@ const tableLoading = ref(false)
|
|||||||
const getGroupLoading = ref(false)
|
const getGroupLoading = ref(false)
|
||||||
const deviceData = ref<any>(null)
|
const deviceData = ref<any>(null)
|
||||||
const dataSet = ref('')
|
const dataSet = ref('')
|
||||||
|
const nearRealTimeDataRef = ref()
|
||||||
const devTypeOptions = ref([])
|
const devTypeOptions = ref([])
|
||||||
const devModelOptions = ref([])
|
const devModelOptions = ref([])
|
||||||
const tableData = ref<any[]>([])
|
const tableData = ref<any[]>([])
|
||||||
const tableHeight = mainHeight(330).height
|
const tableHeight = mainHeight(290).height
|
||||||
const tableHeightBox = mainHeight(365).height
|
const tableHeightBox = mainHeight(310).height
|
||||||
const mangePopup = ref()
|
const mangePopup = ref()
|
||||||
const datePickerRef = ref()
|
const datePickerRef = ref()
|
||||||
const formInline = reactive({
|
const formInline = reactive({
|
||||||
@@ -316,8 +397,10 @@ const formInline = reactive({
|
|||||||
endTime: '',
|
endTime: '',
|
||||||
id: '',
|
id: '',
|
||||||
lineId: '',
|
lineId: '',
|
||||||
|
targetType: '',
|
||||||
dataLevel: 'Secondary'
|
dataLevel: 'Secondary'
|
||||||
})
|
})
|
||||||
|
|
||||||
const detail = ref<any>(null)
|
const detail = ref<any>(null)
|
||||||
//是否显示实时数据默认内容
|
//是否显示实时数据默认内容
|
||||||
const realTimeFlag = ref(true)
|
const realTimeFlag = ref(true)
|
||||||
@@ -339,6 +422,7 @@ const changeTrendType = (val: any) => {
|
|||||||
const activeTrendName: any = ref(0)
|
const activeTrendName: any = ref(0)
|
||||||
const trendTimer: any = ref()
|
const trendTimer: any = ref()
|
||||||
const trendDataTime: any = ref()
|
const trendDataTime: any = ref()
|
||||||
|
|
||||||
//谐波频谱方法
|
//谐波频谱方法
|
||||||
const handleTrend = async () => {
|
const handleTrend = async () => {
|
||||||
realTimeFlag.value = false
|
realTimeFlag.value = false
|
||||||
@@ -493,6 +577,7 @@ const nodeClick = async (e: anyObj) => {
|
|||||||
formInline.lineId = e.level == 3 ? e.id : e.children[0].id
|
formInline.lineId = e.level == 3 ? e.id : e.children[0].id
|
||||||
await getDeviceData(e.level == 3 ? e.pid : e.id, 'history', e.level == 3 ? e.id : e.children[0].id)
|
await getDeviceData(e.level == 3 ? e.pid : e.id, 'history', e.level == 3 ? e.id : e.children[0].id)
|
||||||
.then((res: any) => {
|
.then((res: any) => {
|
||||||
|
|
||||||
deviceData.value = res.data
|
deviceData.value = res.data
|
||||||
formInline.dataLevel = res.data.dataLevel
|
formInline.dataLevel = res.data.dataLevel
|
||||||
dataLevel.value = res.data.dataLevel
|
dataLevel.value = res.data.dataLevel
|
||||||
@@ -504,6 +589,7 @@ const nodeClick = async (e: anyObj) => {
|
|||||||
tableData.value = []
|
tableData.value = []
|
||||||
loading.value = false
|
loading.value = false
|
||||||
} else {
|
} else {
|
||||||
|
|
||||||
res.data.dataSetList.forEach((item: any) => {
|
res.data.dataSetList.forEach((item: any) => {
|
||||||
//历史
|
//历史
|
||||||
if (item.type === 'history') {
|
if (item.type === 'history') {
|
||||||
@@ -522,6 +608,7 @@ const nodeClick = async (e: anyObj) => {
|
|||||||
item.id = item.id + '_event'
|
item.id = item.id + '_event'
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
res.data.dataSetList = res.data.dataSetList.filter((item: any) => item.name != '历史统计数据')
|
||||||
//便携式设备默认二次值
|
//便携式设备默认二次值
|
||||||
// if (deviceType.value == '1') {
|
// if (deviceType.value == '1') {
|
||||||
// formInline.dataLevel = 'Primary'
|
// formInline.dataLevel = 'Primary'
|
||||||
@@ -771,6 +858,7 @@ const handleClick = async (tab?: any) => {
|
|||||||
realTimeFlag.value = false
|
realTimeFlag.value = false
|
||||||
//初始化点击tab隐藏子页面
|
//初始化点击tab隐藏子页面
|
||||||
sonTab.value = null
|
sonTab.value = null
|
||||||
|
console.log(123, dataSet.value.includes('_history'));
|
||||||
|
|
||||||
//查询历史指标
|
//查询历史指标
|
||||||
if (dataSet.value.includes('_history')) {
|
if (dataSet.value.includes('_history')) {
|
||||||
@@ -848,12 +936,19 @@ const handleClick = async (tab?: any) => {
|
|||||||
//查询当前指标
|
//查询当前指标
|
||||||
if (!dataSet.value.includes('_')) {
|
if (!dataSet.value.includes('_')) {
|
||||||
formInline.id = dataSet.value
|
formInline.id = dataSet.value
|
||||||
await deviceRtData(formInline)
|
console.log("🚀 ~ handleClick ~ formInline:", formInline)
|
||||||
|
|
||||||
|
// await deviceRtData(formInline)
|
||||||
|
await realTimeData(formInline)
|
||||||
.then((res: any) => {
|
.then((res: any) => {
|
||||||
tableData.value = res.data.records
|
tableData.value = res.data
|
||||||
formInline.total = res.data.total
|
formInline.total = res.data.total
|
||||||
tableLoading.value = false
|
tableLoading.value = false
|
||||||
|
setTimeout(() => { //targetType
|
||||||
|
nearRealTimeDataRef.value.setData(res.data, queryList.value.filter((item: any) => item.id == formInline.targetType))
|
||||||
|
}, 500)
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
|
||||||
loading.value = false
|
loading.value = false
|
||||||
}, 1500)
|
}, 1500)
|
||||||
})
|
})
|
||||||
@@ -913,6 +1008,11 @@ queryByCode('Device_Type').then(res => {
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
const queryList: any = ref([])
|
||||||
|
queryDictType().then(res => {
|
||||||
|
queryList.value = res.data
|
||||||
|
formInline.targetType = res.data[0].id
|
||||||
|
})
|
||||||
const echoName = (value: any, arr: any[]) => {
|
const echoName = (value: any, arr: any[]) => {
|
||||||
return value ? arr.find(item => item.value == value)?.label : '/'
|
return value ? arr.find(item => item.value == value)?.label : '/'
|
||||||
}
|
}
|
||||||
|
|||||||
66
src/views/govern/device/control/nearRealTimeData.vue
Normal file
66
src/views/govern/device/control/nearRealTimeData.vue
Normal file
@@ -0,0 +1,66 @@
|
|||||||
|
<template>
|
||||||
|
|
||||||
|
<div :style="{ height: height }">
|
||||||
|
<vxe-table height="auto" auto-resize :data="dataList" v-bind="defaultAttribute" :key="key">
|
||||||
|
<vxe-column v-for="item in column" :field="item.field" :title="item.title"></vxe-column>
|
||||||
|
< <!-- <vxe-column field="valueM" title=""></vxe-column> -->
|
||||||
|
</vxe-table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
<script setup lang='ts'>
|
||||||
|
import { mainHeight } from '@/utils/layout'
|
||||||
|
import { ref, reactive } from 'vue'
|
||||||
|
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||||
|
const props = defineProps(['tableData'])
|
||||||
|
const height = mainHeight(325).height
|
||||||
|
const dataList = ref([])
|
||||||
|
const key: any = ref(0)
|
||||||
|
const column: any = ref([])
|
||||||
|
const setData = (data: any, targetType: any) => {
|
||||||
|
|
||||||
|
dataList.value = JSON.parse(JSON.stringify(data))
|
||||||
|
|
||||||
|
console.log("🚀 ~ setData ~ targetType:", targetType[0].code)
|
||||||
|
if (targetType[0].code == 'base_data') {
|
||||||
|
column.value = [
|
||||||
|
{ field: 'otherName', title: '名称', },
|
||||||
|
{ field: 'valueA', title: 'A相', },
|
||||||
|
{ field: 'valueB', title: 'B相', },
|
||||||
|
{ field: 'valueC', title: 'C相', },
|
||||||
|
]
|
||||||
|
} else if (targetType[0].code == 'other_data') {
|
||||||
|
let list: any = []
|
||||||
|
data.forEach((item: any, i: any) => {
|
||||||
|
if (i % 2 == 0) {
|
||||||
|
list.push(item)
|
||||||
|
} else {
|
||||||
|
list[list.length - 1].otherName1 = item.otherName
|
||||||
|
list[list.length - 1].valueM1 = item.valueM
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
dataList.value = JSON.parse(JSON.stringify(list))
|
||||||
|
|
||||||
|
column.value = [
|
||||||
|
{ field: 'otherName', title: '名称', },
|
||||||
|
{ field: 'valueM', title: '', },
|
||||||
|
{ field: 'otherName1', title: '名称', },
|
||||||
|
{ field: 'valueM1', title: '', },
|
||||||
|
]
|
||||||
|
} else {
|
||||||
|
column.value = [
|
||||||
|
{ field: 'otherName', title: '谐波次数', },
|
||||||
|
{ field: 'valueA', title: 'A相', },
|
||||||
|
{ field: 'valueB', title: 'B相', },
|
||||||
|
{ field: 'valueC', title: 'C相', },
|
||||||
|
]
|
||||||
|
}
|
||||||
|
key.value += 1
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
defineExpose({ setData })
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped></style>
|
||||||
@@ -257,7 +257,6 @@ const setRealTrendData = (val: any) => {
|
|||||||
tableData.value[key] = val[key]
|
tableData.value[key] = val[key]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
if (activeName.value == 2) {
|
if (activeName.value == 2) {
|
||||||
if (numberPart % 2 === 0) {
|
if (numberPart % 2 === 0) {
|
||||||
|
|||||||
Reference in New Issue
Block a user