【功能优化】Bpm：设备日志的展示

src/api/iot/device/device/index.ts

@@ -151,7 +151,6 @@ export const DeviceApi = {
 
   // 查询设备日志分页
   getDeviceLogPage: async (params: any) => {
-    // TODO @super：/iot/log-page 或者  /iot/log/page
-    return await request.get({ url: `/iot/device/data/log/page`, params })
+    return await request.get({ url: `/iot/device/log/page`, params })
   }
 }

src/views/iot/device/device/detail/DeviceDataDetail.vue

+<!-- TODO 芋艿：待 review -->
 <template>
   <Dialog title="查看数据" v-model="dialogVisible">
     <ContentWrap>
@@ -57,7 +58,7 @@ import { DeviceApi, DeviceHistoryDataVO, DeviceVO } from '@/api/iot/device/devic
 import { ProductVO } from '@/api/iot/product/product'
 import { beginOfDay, dateFormatter, endOfDay, formatDate } from '@/utils/formatTime'
 
-const props = defineProps<{ product: ProductVO; device: DeviceVO }>()
+defineProps<{ product: ProductVO; device: DeviceVO }>()
 
 /** IoT 设备 数据详情 */
 defineOptions({ name: 'IoTDeviceDataDetail' })

src/views/iot/device/device/detail/DeviceDetailsHeader.vue

+<!-- 设备信息（头部） -->
 <template>
   <div>
     <div class="flex items-start justify-between">

src/views/iot/device/device/detail/DeviceDetailsInfo.vue

+<!-- 设备信息 -->
 <template>
   <ContentWrap>
     <el-collapse v-model="activeNames">

src/views/iot/device/device/detail/DeviceDetailsLog.vue

+<!-- 设备日志 -->
 <template>
   <ContentWrap>
     <!-- 搜索区域 -->
     <el-form :model="queryParams" inline>
       <el-form-item>
-        <el-select v-model="queryParams.type" placeholder="所有" class="!w-120px">
+        <el-select v-model="queryParams.type" placeholder="所有" class="!w-160px">
           <el-option label="所有" value="" />
           <!-- TODO @super：搞成枚举 -->
           <el-option label="状态" value="state" />
@@ -13,13 +14,22 @@
         </el-select>
       </el-form-item>
       <el-form-item>
-        <el-input v-model="queryParams.keyword" placeholder="日志识符" class="!w-200px" />
+        <el-input v-model="queryParams.identifier" placeholder="日志识符" class="!w-200px" />
       </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="handleQuery">
           <Icon icon="ep:search" class="mr-5px" /> 搜索
         </el-button>
-        <el-switch v-model="autoRefresh" class="ml-10px" /> 定时刷新
+        <el-switch
+          size="large"
+          width="80"
+          v-model="autoRefresh"
+          class="ml-20px"
+          inline-prompt
+          active-text="定时刷新"
+          inactive-text="定时刷新"
+          style="--el-switch-on-color: #13ce66"
+        />
       </el-form-item>
     </el-form>
 
@@ -31,7 +41,8 @@
         </template>
       </el-table-column>
       <el-table-column label="类型" align="center" prop="type" width="120" />
-      <el-table-column label="名称(标识符)" align="center" prop="subType" width="120" />
+      <!-- TODO @super：标识符需要翻译 -->
+      <el-table-column label="标识符" align="center" prop="identifier" width="120" />
       <el-table-column label="内容" align="center" prop="content" :show-overflow-tooltip="true" />
     </el-table>
 
@@ -55,12 +66,11 @@ const props = defineProps<{
   deviceKey: string
 }>()
 
-//TODO:后续看看使用什么查询条件  目前后端是留了时间范围  type  subType
 // 查询参数
 const queryParams = reactive({
   deviceKey: props.deviceKey,
-  // type: '',
-  // keyword: '',
+  type: '',
+  identifier: '',
   pageNo: 1,
   pageSize: 10
 })
@@ -68,8 +78,7 @@ const queryParams = reactive({
 // 列表数据
 const loading = ref(false)
 const total = ref(0)
-// TODO @super：字段的风格，还是类似一般 table 见面哈
-const logList = ref([])
+const logList = ref([]) // TODO @super：logList -> list，简洁一点。因为当前就一个 table 哈
 const autoRefresh = ref(false)
 let timer: any = null // TODO @super：autoRefreshEnable，autoRefreshTimer；对应上
 
@@ -140,7 +149,7 @@ watch(autoRefresh, (newValue) => {
   }
 })
 
-/** 监听设备 ID 变化 */
+/** 监听设备标识变化 */
 watch(
   () => props.deviceKey,
   (newValue) => {

src/views/iot/device/device/detail/DeviceDetailsModel.vue

+<!-- 设备物模型：运行状态（属性）、事件管理、服务调用 -->
 <template>
   <ContentWrap>
     <el-tabs v-model="activeTab">

src/views/iot/device/device/detail/DeviceDetailsSimulator.vue

+<!-- 模拟设备 -->
 <template>
   <ContentWrap>
     <el-row :gutter="20">
@@ -17,9 +18,11 @@
                     :stripe="true"
                   >
                     <!-- TODO @super：每个 colum 搞下宽度，避免 table 每一列最后有个 . -->
+                    <!-- TODO @super：可以左侧 fixed -->
                     <el-table-column align="center" label="功能名称" prop="name" />
                     <el-table-column align="center" label="标识符" prop="identifier" />
                     <el-table-column align="center" label="数据类型" prop="identifier">
+                      <!-- TODO @super：不用翻译，可以减少宽度的占用 -->
                       <template #default="{ row }">
                         {{ dataTypeOptionsLabel(row.property?.dataType) ?? '-' }}
                       </template>
@@ -76,6 +79,7 @@
                               {{ `${item.name}-${item.value}` }}
                             </div>
                           </div>
+                          <!-- TODO @super：要不要兜底下，没翻译的类型，直接展示 json？ -->
                         </template>
                         <!-- 服务 -->
                         <div v-if="row.type === ThingModelType.SERVICE">
@@ -87,12 +91,14 @@
                         </div>
                       </template>
                     </el-table-column>
+                    <!-- TODO @super：可以右侧 fixed -->
                     <el-table-column label="值" align="center" width="80">
                       <template #default="scope">
                         <el-input v-model="scope.row.simulateValue" class="!w-60px" />
                       </template>
                     </el-table-column>
                   </el-table>
+                  <!-- TODO @super：发送按钮，可以放在右侧哈。因为我们的 simulateValue 就在最右侧 -->
                   <div class="mt-10px">
                     <el-button
                       type="primary"
@@ -109,6 +115,7 @@
               <!-- TODO @super：待实现 -->
               <el-tab-pane label="事件上报" name="event">
                 <ContentWrap>
+                  <!-- TODO @super：因为事件是每个 event 去模拟，而不是类似属性的批量上传。所以，可以每一列后面有个“模拟”按钮。另外，“值”使用 textarea，高度 3 -->
                   <!-- <el-table v-loading="loading" :data="eventList" :stripe="true">
                     <el-table-column label="功能名称" align="center" prop="name" />
                     <el-table-column label="标识符" align="center" prop="identifier" />

src/views/iot/device/device/detail/index.vue

@@ -17,7 +17,6 @@
       <el-tab-pane label="子设备管理" v-if="product.deviceType === DeviceTypeEnum.GATEWAY" />
       <el-tab-pane label="设备影子" />
       <el-tab-pane label="设备日志" name="log">
-        <!-- TODO @super：字段类型，:device-key。idea 会告警，应该是 string -->
         <DeviceDetailsLog v-if="activeTab === 'log'" :device-key="device.deviceKey" />
       </el-tab-pane>
       <el-tab-pane label="模拟设备" name="simulator">