|
|
|
@ -8,8 +8,12 @@ |
|
|
|
:groupChangeLoading="groupChangeLoading" @onchangePoints="onchangePoints" :device-points="pointList" |
|
|
|
:groupChangeLoading="groupChangeLoading" @onchangePoints="onchangePoints" :device-points="pointList" |
|
|
|
:isTransfer="props.isTransfer" :siteInfo="props.siteInfo" ref="pointGroupTreeRef" /> |
|
|
|
:isTransfer="props.isTransfer" :siteInfo="props.siteInfo" ref="pointGroupTreeRef" /> |
|
|
|
</EdfsWrap> |
|
|
|
</EdfsWrap> |
|
|
|
<NewDataChart v-if="isShowChart" :chart-datas="chartDatas" :legends="checkPointList" |
|
|
|
<div class="flex-1 p-4 h-full overflow-hidden"> |
|
|
|
|
|
|
|
<el-button class="mb-4" type="primary" |
|
|
|
|
|
|
|
@click="loadChardData">查询数据</el-button> |
|
|
|
|
|
|
|
<NewDataChart v-if="isShowChart" :chart-datas="chartDatas" :legends="legends" |
|
|
|
:axis-data="Array.from(axisData)" ref="chartRef" /> |
|
|
|
:axis-data="Array.from(axisData)" ref="chartRef" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
</main> |
|
|
|
</main> |
|
|
|
</el-drawer> |
|
|
|
</el-drawer> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -30,6 +34,7 @@ import { |
|
|
|
getDeviceDetails, |
|
|
|
getDeviceDetails, |
|
|
|
getPointGroup, |
|
|
|
getPointGroup, |
|
|
|
getPoints, |
|
|
|
getPoints, |
|
|
|
|
|
|
|
type IGetDeviceDataParams, |
|
|
|
type IPointGroupOV, |
|
|
|
type IPointGroupOV, |
|
|
|
type IPointGroupParams, |
|
|
|
type IPointGroupParams, |
|
|
|
type IPointsParams, |
|
|
|
type IPointsParams, |
|
|
|
@ -38,6 +43,8 @@ import { |
|
|
|
import { useMessage } from '@/composables/useMessage' |
|
|
|
import { useMessage } from '@/composables/useMessage' |
|
|
|
import { getTransferTopic, postTransferTopic } from '../utils' |
|
|
|
import { getTransferTopic, postTransferTopic } from '../utils' |
|
|
|
import dayjs from 'dayjs' |
|
|
|
import dayjs from 'dayjs' |
|
|
|
|
|
|
|
const env = import.meta.env |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const worker = ZMQWorker.getInstance() |
|
|
|
const worker = ZMQWorker.getInstance() |
|
|
|
const isShowDrawer = defineModel<boolean>() |
|
|
|
const isShowDrawer = defineModel<boolean>() |
|
|
|
@ -71,7 +78,7 @@ async function open(device: IOfflineDevice | IOnlineDevice) { |
|
|
|
}) |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const columsParams = computed(() => ['ts', ...pointList.value.map(i => i.addr)]) |
|
|
|
const columsParams = computed(() => ['ts', ...checkPointList.value.map(i => i.addr)]) |
|
|
|
async function loadPoints() { |
|
|
|
async function loadPoints() { |
|
|
|
if (!curGroup.value) { |
|
|
|
if (!curGroup.value) { |
|
|
|
message.error('请先选择点位组') |
|
|
|
message.error('请先选择点位组') |
|
|
|
@ -93,7 +100,8 @@ async function loadPoints() { |
|
|
|
|
|
|
|
|
|
|
|
const res = await getPoints(params) |
|
|
|
const res = await getPoints(params) |
|
|
|
if (res.code === 0) { |
|
|
|
if (res.code === 0) { |
|
|
|
pointList.value = res.data.map((i: any) => ({ |
|
|
|
const data = Array.isArray(res?.data) ? res.data : [] |
|
|
|
|
|
|
|
pointList.value = data.map((i: any) => ({ |
|
|
|
label: i.cnName, |
|
|
|
label: i.cnName, |
|
|
|
addr: i.addr, |
|
|
|
addr: i.addr, |
|
|
|
})) |
|
|
|
})) |
|
|
|
@ -121,23 +129,61 @@ async function loadDeviceDetails() { |
|
|
|
fullscreenLoading.value?.close() |
|
|
|
fullscreenLoading.value?.close() |
|
|
|
return |
|
|
|
return |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
isShowDrawer.value = true |
|
|
|
|
|
|
|
groupChangeLoading.value = false |
|
|
|
|
|
|
|
fullscreenLoading.value?.close() |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
const chartDatas = reactive(new Map<string, any[]>()) |
|
|
|
|
|
|
|
const axisData = new Set<string>() |
|
|
|
|
|
|
|
const legends = ref<{ addr: string; label: string }[]>([]) |
|
|
|
|
|
|
|
async function loadChardData(){ |
|
|
|
|
|
|
|
if(!columsParams.value.filter(i => i !== 'ts').length){ |
|
|
|
|
|
|
|
message.error('请选择点位') |
|
|
|
|
|
|
|
return |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const res = await getDeviceDetails({ |
|
|
|
const params: IGetDeviceDataParams = { |
|
|
|
columns: columsParams.value, |
|
|
|
columns: columsParams.value, |
|
|
|
isLocal: props.isTransfer ? false : true, |
|
|
|
isLocal: props.isTransfer ? false : true, |
|
|
|
host: props.isTransfer ? (curDevice.value as IOnlineDevice).clientIp : '', |
|
|
|
host: props.isTransfer ? (curDevice.value as IOnlineDevice).clientIp : '', |
|
|
|
name: curGroupName.value as string |
|
|
|
name: curGroupName.value as string |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (env.VITE_APP_ENV !== 'local') { |
|
|
|
|
|
|
|
params.site_id = props.siteInfo!.name || '' |
|
|
|
|
|
|
|
params.device_id = curDevice.value?.sn || '' |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
const res = await getDeviceDetails(params) |
|
|
|
|
|
|
|
|
|
|
|
if (res.code === 0) { |
|
|
|
if (res.code === 0) { |
|
|
|
pointData.value = Array.isArray(res.data.results) ? res.data.results : [] |
|
|
|
pointData.value = Array.isArray(res.data.results) ? res.data.results : [] |
|
|
|
|
|
|
|
chartDatas.clear() |
|
|
|
|
|
|
|
axisData.clear() |
|
|
|
|
|
|
|
pointData.value.forEach((data: any[]) => { |
|
|
|
|
|
|
|
const [ts, val, addr] = data |
|
|
|
|
|
|
|
legends.value.push({ |
|
|
|
|
|
|
|
addr: addr, |
|
|
|
|
|
|
|
label: checkPointList.value.find(i => i.addr === addr)!.label, |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
if (checkPointList.value.some(i => i.addr === addr)) { |
|
|
|
|
|
|
|
const time = dayjs(Number(ts)).format('YYYY-MM-DD HH:mm:ss') |
|
|
|
|
|
|
|
if (addr) { |
|
|
|
|
|
|
|
const colData = chartDatas.get(addr) |
|
|
|
|
|
|
|
if (colData) { |
|
|
|
|
|
|
|
colData.push([time, val]) |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
chartDatas.set(addr, [[time, val]]) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
isShowDrawer.value = true |
|
|
|
if (ts) { |
|
|
|
|
|
|
|
axisData.add(time) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}) |
|
|
|
} else { |
|
|
|
} else { |
|
|
|
message.error('获取设备数据失败') |
|
|
|
message.error('获取设备数据失败') |
|
|
|
} |
|
|
|
} |
|
|
|
groupChangeLoading.value = false |
|
|
|
|
|
|
|
fullscreenLoading.value?.close() |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function zmqImport(device: IOfflineDevice) { |
|
|
|
function zmqImport(device: IOfflineDevice) { |
|
|
|
@ -243,34 +289,13 @@ function onGroupChange(item: IPointGroupOV) { |
|
|
|
loadDeviceDetails() |
|
|
|
loadDeviceDetails() |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const chartDatas = reactive(new Map<string, any[]>()) |
|
|
|
|
|
|
|
const axisData = new Set<string>() |
|
|
|
|
|
|
|
const checkPointList = ref<IMyPoint[]>([]) |
|
|
|
const checkPointList = ref<IMyPoint[]>([]) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function onchangePoints(checkPoints: IMyPoint[]) { |
|
|
|
function onchangePoints(checkPoints: IMyPoint[]) { |
|
|
|
checkPointList.value = [] |
|
|
|
checkPointList.value = [] |
|
|
|
checkPointList.value = checkPoints |
|
|
|
checkPointList.value = checkPoints |
|
|
|
chartDatas.clear() |
|
|
|
|
|
|
|
axisData.clear() |
|
|
|
|
|
|
|
pointData.value.forEach((data: any[]) => { |
|
|
|
|
|
|
|
const [ts, val, addr] = data |
|
|
|
|
|
|
|
if (checkPoints.some(i => i.addr === addr)) { |
|
|
|
|
|
|
|
const time = dayjs(Number(ts)).format('YYYY-MM-DD HH:mm:ss') |
|
|
|
|
|
|
|
if (addr) { |
|
|
|
|
|
|
|
const colData = chartDatas.get(addr) |
|
|
|
|
|
|
|
if (colData) { |
|
|
|
|
|
|
|
colData.push([time, val]) |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
chartDatas.set(addr, [[time, val]]) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (ts) { |
|
|
|
|
|
|
|
axisData.add(time) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
defineExpose({ |
|
|
|
defineExpose({ |
|
|
|
|
