|
|
|
@ -1,5 +1,5 @@
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<Dialog v-model="dialogVisible" :title="dialogTitle" width="900" :scroll="true" max-height="80vh" align-center>
|
|
|
|
<Dialog v-model="dialogVisible" :title="dialogTitle" width="1100" :scroll="true" max-height="80vh" align-center>
|
|
|
|
<div class="single-device-dialog">
|
|
|
|
<div class="single-device-dialog">
|
|
|
|
<el-form class="-mb-15px history-single-device-form" :inline="true" label-width="auto">
|
|
|
|
<el-form class="-mb-15px history-single-device-form" :inline="true" label-width="auto">
|
|
|
|
<el-form-item :label="t('DataCollection.HistoryData.dialogCollectionTimeLabel')">
|
|
|
|
<el-form-item :label="t('DataCollection.HistoryData.dialogCollectionTimeLabel')">
|
|
|
|
@ -10,9 +10,30 @@
|
|
|
|
:start-placeholder="t('DataCollection.HistoryData.dialogCollectionTimeStartPlaceholder')"
|
|
|
|
:start-placeholder="t('DataCollection.HistoryData.dialogCollectionTimeStartPlaceholder')"
|
|
|
|
:end-placeholder="t('DataCollection.HistoryData.dialogCollectionTimeEndPlaceholder')"
|
|
|
|
:end-placeholder="t('DataCollection.HistoryData.dialogCollectionTimeEndPlaceholder')"
|
|
|
|
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
|
|
|
|
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
|
|
|
|
class="!w-360px"
|
|
|
|
class="!w-280px"
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item :label="t('DataCollection.HistoryData.dialogPointFilterLabel')">
|
|
|
|
|
|
|
|
<el-select
|
|
|
|
|
|
|
|
v-model="attributeCodes"
|
|
|
|
|
|
|
|
class="!w-280px"
|
|
|
|
|
|
|
|
multiple
|
|
|
|
|
|
|
|
:max-collapse-tags="1"
|
|
|
|
|
|
|
|
collapse-tags
|
|
|
|
|
|
|
|
collapse-tags-tooltip
|
|
|
|
|
|
|
|
filterable
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
:loading="attributeLoading"
|
|
|
|
|
|
|
|
:placeholder="t('DataCollection.HistoryData.dialogPointFilterPlaceholder')"
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
|
|
v-for="item in attributeOptions"
|
|
|
|
|
|
|
|
:key="item.attributeCode"
|
|
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
|
|
:value="item.attributeCode"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item>
|
|
|
|
<el-form-item>
|
|
|
|
<el-button @click="handleQuery">{{ t('DataCollection.HistoryData.dialogSearchButtonText') }}</el-button>
|
|
|
|
<el-button @click="handleQuery">{{ t('DataCollection.HistoryData.dialogSearchButtonText') }}</el-button>
|
|
|
|
<el-button @click="resetQuery">{{ t('DataCollection.HistoryData.dialogResetButtonText') }}</el-button>
|
|
|
|
<el-button @click="resetQuery">{{ t('DataCollection.HistoryData.dialogResetButtonText') }}</el-button>
|
|
|
|
@ -125,6 +146,14 @@ const loading = ref(false)
|
|
|
|
const recordGroups = ref<RecordGroup[]>([])
|
|
|
|
const recordGroups = ref<RecordGroup[]>([])
|
|
|
|
|
|
|
|
|
|
|
|
const collectionTimeRange = ref<string[]>([])
|
|
|
|
const collectionTimeRange = ref<string[]>([])
|
|
|
|
|
|
|
|
const attributeCodes = ref<string[]>([])
|
|
|
|
|
|
|
|
const attributeLoading = ref(false)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
type AttributeOption = {
|
|
|
|
|
|
|
|
attributeCode: string
|
|
|
|
|
|
|
|
label: string
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const attributeOptions = ref<AttributeOption[]>([])
|
|
|
|
|
|
|
|
|
|
|
|
const formatDateTime = (date: Date) => {
|
|
|
|
const formatDateTime = (date: Date) => {
|
|
|
|
const pad = (value: number) => String(value).padStart(2, '0')
|
|
|
|
const pad = (value: number) => String(value).padStart(2, '0')
|
|
|
|
@ -204,6 +233,36 @@ const buildSectionsFromGroups = (groups: Record<string, any[]>): Section[] => {
|
|
|
|
return result
|
|
|
|
return result
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const fetchDeviceAttributes = async () => {
|
|
|
|
|
|
|
|
if (props.deviceId === undefined || props.deviceId === null || props.deviceId === '') {
|
|
|
|
|
|
|
|
attributeOptions.value = []
|
|
|
|
|
|
|
|
return
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
attributeLoading.value = true
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
|
|
|
const res: any = await DeviceApi.getDeviceAttributeList(props.deviceId)
|
|
|
|
|
|
|
|
const responseData = res?.data?.data ?? res?.data ?? res
|
|
|
|
|
|
|
|
const list: any[] = Array.isArray(responseData?.list)
|
|
|
|
|
|
|
|
? responseData.list
|
|
|
|
|
|
|
|
: Array.isArray(responseData)
|
|
|
|
|
|
|
|
? responseData
|
|
|
|
|
|
|
|
: []
|
|
|
|
|
|
|
|
attributeOptions.value = list
|
|
|
|
|
|
|
|
.map((item: any) => {
|
|
|
|
|
|
|
|
const code = String(item?.attributeCode ?? '').trim()
|
|
|
|
|
|
|
|
if (!code) return null
|
|
|
|
|
|
|
|
const name = String(item?.attributeName ?? '').trim()
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
|
|
|
attributeCode: code,
|
|
|
|
|
|
|
|
label: name ? `${name}(${code})` : code
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
.filter(Boolean) as AttributeOption[]
|
|
|
|
|
|
|
|
} finally {
|
|
|
|
|
|
|
|
attributeLoading.value = false
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
const fetchHistory = async () => {
|
|
|
|
const fetchHistory = async () => {
|
|
|
|
if (props.deviceId === undefined || props.deviceId === null || props.deviceId === '') {
|
|
|
|
if (props.deviceId === undefined || props.deviceId === null || props.deviceId === '') {
|
|
|
|
recordGroups.value = []
|
|
|
|
recordGroups.value = []
|
|
|
|
@ -221,6 +280,9 @@ const fetchHistory = async () => {
|
|
|
|
params.collectionStartTime = collectionTimeRange.value[0]
|
|
|
|
params.collectionStartTime = collectionTimeRange.value[0]
|
|
|
|
params.collectionEndTime = collectionTimeRange.value[1]
|
|
|
|
params.collectionEndTime = collectionTimeRange.value[1]
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
if (Array.isArray(attributeCodes.value) && attributeCodes.value.length) {
|
|
|
|
|
|
|
|
params.attributeCodes = attributeCodes.value
|
|
|
|
|
|
|
|
}
|
|
|
|
const res: any = await DeviceApi.getHistoryRecord(params)
|
|
|
|
const res: any = await DeviceApi.getHistoryRecord(params)
|
|
|
|
const responseData = res?.data?.data ?? res?.data ?? res
|
|
|
|
const responseData = res?.data?.data ?? res?.data ?? res
|
|
|
|
|
|
|
|
|
|
|
|
@ -256,6 +318,7 @@ const handleQuery = () => {
|
|
|
|
|
|
|
|
|
|
|
|
const resetQuery = () => {
|
|
|
|
const resetQuery = () => {
|
|
|
|
collectionTimeRange.value = []
|
|
|
|
collectionTimeRange.value = []
|
|
|
|
|
|
|
|
attributeCodes.value = []
|
|
|
|
queryParams.pageNo = 1
|
|
|
|
queryParams.pageNo = 1
|
|
|
|
queryParams.pageSize = 10
|
|
|
|
queryParams.pageSize = 10
|
|
|
|
fetchHistory()
|
|
|
|
fetchHistory()
|
|
|
|
@ -268,8 +331,10 @@ watch(
|
|
|
|
return
|
|
|
|
return
|
|
|
|
}
|
|
|
|
}
|
|
|
|
collectionTimeRange.value = buildLastHoursRange(4)
|
|
|
|
collectionTimeRange.value = buildLastHoursRange(4)
|
|
|
|
|
|
|
|
attributeCodes.value = []
|
|
|
|
queryParams.pageNo = 1
|
|
|
|
queryParams.pageNo = 1
|
|
|
|
queryParams.pageSize = 10
|
|
|
|
queryParams.pageSize = 10
|
|
|
|
|
|
|
|
fetchDeviceAttributes()
|
|
|
|
fetchHistory()
|
|
|
|
fetchHistory()
|
|
|
|
}
|
|
|
|
}
|
|
|
|
)
|
|
|
|
)
|
|
|
|
|