【功能修改】IoT:完善设备详情的属性展示

This commit is contained in:
YunaiV 2025-01-29 21:47:26 +08:00
parent 18617d309b
commit c830c2b9bb
4 changed files with 114 additions and 129 deletions

View File

@ -25,10 +25,6 @@
<Icon icon="ep:search" class="mr-5px" />
搜索
</el-button>
<el-button @click="resetQuery">
<Icon icon="ep:refresh" class="mr-5px" />
重置
</el-button>
</el-form-item>
</el-form>
</ContentWrap>
@ -110,11 +106,5 @@ const handleQuery = () => {
getList()
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value.resetFields()
handleQuery()
}
defineExpose({ open }) // open
</script>

View File

@ -1,7 +1,6 @@
<!-- 设备信息 -->
<template>
<ContentWrap>
<el-collapse v-model="activeNames">
<el-descriptions :column="3" title="设备信息">
<el-descriptions-item label="产品名称">{{ product.name }}</el-descriptions-item>
<el-descriptions-item label="ProductKey">
@ -19,15 +18,15 @@
<el-descriptions-item label="创建时间">
{{ formatDate(device.createTime) }}
</el-descriptions-item>
<el-descriptions-item label="当前状态">
<dict-tag :type="DICT_TYPE.IOT_DEVICE_STATE" :value="device.state" />
</el-descriptions-item>
<el-descriptions-item label="激活时间">
{{ formatDate(device.activeTime) }}
</el-descriptions-item>
<el-descriptions-item label="最后上线时间">
{{ formatDate(device.onlineTime) }}
</el-descriptions-item>
<el-descriptions-item label="当前状态">
<dict-tag :type="DICT_TYPE.IOT_DEVICE_STATE" :value="device.status" />
</el-descriptions-item>
<el-descriptions-item label="最后离线时间" :span="3">
{{ formatDate(device.offlineTime) }}
</el-descriptions-item>
@ -35,7 +34,7 @@
<el-button type="primary" @click="openMqttParams">查看</el-button>
</el-descriptions-item>
</el-descriptions>
</el-collapse>
</ContentWrap>
<!-- MQTT 连接参数弹框 -->
<Dialog
@ -77,7 +76,9 @@
<el-button @click="mqttDialogVisible = false">关闭</el-button>
</template>
</Dialog>
</ContentWrap>
<!-- TODO 待开发设备标签 -->
<!-- TODO 待开发设备地图 -->
</template>
<script setup lang="ts">
import { DICT_TYPE } from '@/utils/dict'
@ -90,7 +91,6 @@ const message = useMessage() // 消息提示
const { product, device } = defineProps<{ product: ProductVO; device: DeviceVO }>() // Props
const emit = defineEmits(['refresh']) // Emits
const activeNames = ref(['basicInfo']) //
const mqttDialogVisible = ref(false) // MQTT
const mqttParams = ref({
mqttClientId: '',

View File

@ -41,9 +41,9 @@
<ContentWrap>
<el-tabs>
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table-column label="属性标识符" align="center" prop="identifier" />
<el-table-column label="属性名称" align="center" prop="name" />
<el-table-column label="数据类型" align="center" prop="dataType" />
<el-table-column label="属性标识符" align="center" prop="property.identifier" />
<el-table-column label="属性名称" align="center" prop="property.name" />
<el-table-column label="数据类型" align="center" prop="property.dataType" />
<el-table-column label="属性值" align="center" prop="value" />
<el-table-column
label="更新时间"
@ -57,9 +57,9 @@
<el-button
link
type="primary"
@click="openDetail(props.device.id, scope.row.identifier)"
@click="openDetail(props.device.id, scope.row.property.identifier)"
>
历史
查看数据
</el-button>
</template>
</el-table-column>

View File

@ -1,6 +1,5 @@
<template>
<ContentWrap>
<el-collapse v-model="activeNames">
<el-descriptions :column="3" title="产品信息">
<el-descriptions-item label="产品名称">{{ product.name }}</el-descriptions-item>
<el-descriptions-item label="所属分类">{{ product.categoryName }}</el-descriptions-item>
@ -33,7 +32,6 @@
</el-descriptions-item>
<el-descriptions-item label="产品描述">{{ product.description }}</el-descriptions-item>
</el-descriptions>
</el-collapse>
</ContentWrap>
</template>
<script setup lang="ts">
@ -42,7 +40,4 @@ import { DeviceTypeEnum, ProductVO } from '@/api/iot/product/product'
import { formatDate } from '@/utils/formatTime'
const { product } = defineProps<{ product: ProductVO }>()
//
const activeNames = ref(['basicInfo'])
</script>