Skip to content

phsl / admin

Go to a project
Commit c830c2b9 by YunaiV
Options

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

parent 18617d30
Showing with 12 additions and 27 deletions
src/views/iot/device/device/detail/DeviceDataDetail.vue
...@@ -25,10 +25,6 @@ ...@@ -25,10 +25,6 @@
<Icon icon="ep:search" class="mr-5px" /> <Icon icon="ep:search" class="mr-5px" />
搜索 搜索
</el-button> </el-button>
<el-button @click="resetQuery">
<Icon icon="ep:refresh" class="mr-5px" />
重置
</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</ContentWrap> </ContentWrap>
...@@ -110,11 +106,5 @@ const handleQuery = () => { ...@@ -110,11 +106,5 @@ const handleQuery = () => {
getList() getList()
} }
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value.resetFields()
handleQuery()
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
</script> </script>
src/views/iot/device/device/detail/DeviceDetailsInfo.vue
<!-- 设备信息 --> <!-- 设备信息 -->
<template> <template>
<ContentWrap> <ContentWrap>
<el-collapse v-model="activeNames">
<el-descriptions :column="3" title="设备信息"> <el-descriptions :column="3" title="设备信息">
<el-descriptions-item label="产品名称">{{ product.name }}</el-descriptions-item> <el-descriptions-item label="产品名称">{{ product.name }}</el-descriptions-item>
<el-descriptions-item label="ProductKey"> <el-descriptions-item label="ProductKey">
...@@ -19,15 +18,15 @@ ...@@ -19,15 +18,15 @@
<el-descriptions-item label="创建时间"> <el-descriptions-item label="创建时间">
{{ formatDate(device.createTime) }} {{ formatDate(device.createTime) }}
</el-descriptions-item> </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="激活时间"> <el-descriptions-item label="激活时间">
{{ formatDate(device.activeTime) }} {{ formatDate(device.activeTime) }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="最后上线时间"> <el-descriptions-item label="最后上线时间">
{{ formatDate(device.onlineTime) }} {{ formatDate(device.onlineTime) }}
</el-descriptions-item> </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"> <el-descriptions-item label="最后离线时间" :span="3">
{{ formatDate(device.offlineTime) }} {{ formatDate(device.offlineTime) }}
</el-descriptions-item> </el-descriptions-item>
...@@ -35,7 +34,7 @@ ...@@ -35,7 +34,7 @@
<el-button type="primary" @click="openMqttParams">查看</el-button> <el-button type="primary" @click="openMqttParams">查看</el-button>
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>
</el-collapse> </ContentWrap>
<!-- MQTT 连接参数弹框 --> <!-- MQTT 连接参数弹框 -->
<Dialog <Dialog
...@@ -77,7 +76,9 @@ ...@@ -77,7 +76,9 @@
<el-button @click="mqttDialogVisible = false">关闭</el-button> <el-button @click="mqttDialogVisible = false">关闭</el-button>
</template> </template>
</Dialog> </Dialog>
</ContentWrap>
<!-- TODO 待开发：设备标签 -->
<!-- TODO 待开发：设备地图 -->
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { DICT_TYPE } from '@/utils/dict' import { DICT_TYPE } from '@/utils/dict'
...@@ -90,7 +91,6 @@ const message = useMessage() // 消息提示 ...@@ -90,7 +91,6 @@ const message = useMessage() // 消息提示
const { product, device } = defineProps<{ product: ProductVO; device: DeviceVO }>() // 定义 Props const { product, device } = defineProps<{ product: ProductVO; device: DeviceVO }>() // 定义 Props
const emit = defineEmits(['refresh']) // 定义 Emits const emit = defineEmits(['refresh']) // 定义 Emits
const activeNames = ref(['basicInfo']) // 展示的折叠面板
const mqttDialogVisible = ref(false) // 定义 MQTT 弹框的可见性 const mqttDialogVisible = ref(false) // 定义 MQTT 弹框的可见性
const mqttParams = ref({ const mqttParams = ref({
mqttClientId: '', mqttClientId: '',
......
src/views/iot/device/device/detail/DeviceDetailsModel.vue
...@@ -41,9 +41,9 @@ ...@@ -41,9 +41,9 @@
<ContentWrap> <ContentWrap>
<el-tabs> <el-tabs>
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true"> <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="property.identifier" />
<el-table-column label="属性名称" align="center" prop="name" /> <el-table-column label="属性名称" align="center" prop="property.name" />
<el-table-column label="数据类型" align="center" prop="dataType" /> <el-table-column label="数据类型" align="center" prop="property.dataType" />
<el-table-column label="属性值" align="center" prop="value" /> <el-table-column label="属性值" align="center" prop="value" />
<el-table-column <el-table-column
label="更新时间" label="更新时间"
...@@ -57,9 +57,9 @@ ...@@ -57,9 +57,9 @@
<el-button <el-button
link link
type="primary" type="primary"
@click="openDetail(props.device.id, scope.row.identifier)" @click="openDetail(props.device.id, scope.row.property.identifier)"
> >
历史 查看数据
</el-button> </el-button>
</template> </template>
</el-table-column> </el-table-column>
......
src/views/iot/product/product/detail/ProductDetailsInfo.vue
<template> <template>
<ContentWrap> <ContentWrap>
<el-collapse v-model="activeNames">
<el-descriptions :column="3" title="产品信息"> <el-descriptions :column="3" title="产品信息">
<el-descriptions-item label="产品名称">{{ product.name }}</el-descriptions-item> <el-descriptions-item label="产品名称">{{ product.name }}</el-descriptions-item>
<el-descriptions-item label="所属分类">{{ product.categoryName }}</el-descriptions-item> <el-descriptions-item label="所属分类">{{ product.categoryName }}</el-descriptions-item>
...@@ -33,7 +32,6 @@ ...@@ -33,7 +32,6 @@
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="产品描述">{{ product.description }}</el-descriptions-item> <el-descriptions-item label="产品描述">{{ product.description }}</el-descriptions-item>
</el-descriptions> </el-descriptions>
</el-collapse>
</ContentWrap> </ContentWrap>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
...@@ -42,7 +40,4 @@ import { DeviceTypeEnum, ProductVO } from '@/api/iot/product/product' ...@@ -42,7 +40,4 @@ import { DeviceTypeEnum, ProductVO } from '@/api/iot/product/product'
import { formatDate } from '@/utils/formatTime' import { formatDate } from '@/utils/formatTime'
const { product } = defineProps<{ product: ProductVO }>() const { product } = defineProps<{ product: ProductVO }>()
// 展示的折叠面板
const activeNames = ref(['basicInfo'])
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment