【代码评审】IoT：数据桥梁的接入

YunaiV · YunaiV · commit c87ed7fe1775 · 2025-03-16T23:44:56.000+08:00
diff --git a/src/api/iot/device/group/index.ts b/src/api/iot/device/group/index.ts
@@ -11,27 +11,27 @@ export interface DeviceGroupVO {
 
 // IoT 设备分组 API
 export const DeviceGroupApi = {
-  // 查询IoT 设备分组分页
+  // 查询设备分组分页
   getDeviceGroupPage: async (params: any) => {
     return await request.get({ url: `/iot/device-group/page`, params })
   },
 
-  // 查询IoT 设备分组详情
+  // 查询设备分组详情
   getDeviceGroup: async (id: number) => {
     return await request.get({ url: `/iot/device-group/get?id=` + id })
   },
 
-  // 新增IoT 设备分组
+  // 新增设备分组
   createDeviceGroup: async (data: DeviceGroupVO) => {
     return await request.post({ url: `/iot/device-group/create`, data })
   },
 
-  // 修改IoT 设备分组
+  // 修改设备分组
   updateDeviceGroup: async (data: DeviceGroupVO) => {
     return await request.put({ url: `/iot/device-group/update`, data })
   },
 
-  // 删除IoT 设备分组
+  // 删除设备分组
   deleteDeviceGroup: async (id: number) => {
     return await request.delete({ url: `/iot/device-group/delete?id=` + id })
   },
diff --git a/src/api/iot/statistics/index.ts b/src/api/iot/statistics/index.ts
@@ -1,6 +1,6 @@
 import request from '@/config/axios'
 
-/** 统计数据类型 */
+/** IoT 统计数据类型 */
 export interface IotStatisticsSummaryRespVO {
   productCategoryCount: number
   productCount: number
@@ -16,29 +16,26 @@ export interface IotStatisticsSummaryRespVO {
   productCategoryDeviceCounts: Record<string, number>
 }
 
-/** 消息统计数据类型 */
+/** IoT 消息统计数据类型 */
 export interface IotStatisticsDeviceMessageSummaryRespVO {
   upstreamCounts: Record<number, number>
   downstreamCounts: Record<number, number>
 }
 
 // IoT 数据统计 API
 export const ProductCategoryApi = {
-  // 查询IoT基础数据统计
+  // 查询基础的数据统计
   getIotStatisticsSummary: async () => {
-    return await request.get<IotStatisticsSummaryRespVO>({ 
+    return await request.get<IotStatisticsSummaryRespVO>({
       url: `/iot/statistics/get-summary`
     })
   },
 
-  // 查询IoT上下行消息数据统计
-  getIotStatisticsDeviceMessageSummary: async (params: {
-    startTime: number
-    endTime: number
-  }) => {
-    return await request.get<IotStatisticsDeviceMessageSummaryRespVO>({ 
-      url: `/iot/statistics/get-log-summary`, 
-      params 
+  // 查询设备上下行消息的数据统计
+  getIotStatisticsDeviceMessageSummary: async (params: { startTime: number; endTime: number }) => {
+    return await request.get<IotStatisticsDeviceMessageSummaryRespVO>({
+      url: `/iot/statistics/get-log-summary`,
+      params
     })
   }
-}
+}
diff --git a/src/views/iot/device/device/DeviceForm.vue b/src/views/iot/device/device/DeviceForm.vue
@@ -43,7 +43,11 @@
           :disabled="formType === 'update'"
         />
       </el-form-item>
-      <el-form-item v-if="formData.deviceType === 1" label="网关设备" prop="gatewayId">
+      <el-form-item
+        v-if="formData.deviceType === DeviceTypeEnum.GATEWAY_SUB"
+        label="网关设备"
+        prop="gatewayId"
+      >
         <el-select v-model="formData.gatewayId" placeholder="子设备可选择父设备" clearable>
           <el-option
             v-for="gateway in gatewayDevices"
diff --git a/src/views/iot/device/device/detail/DeviceDataDetail.vue b/src/views/iot/device/device/detail/DeviceDataDetail.vue
@@ -59,7 +59,7 @@ import { beginOfDay, dateFormatter, endOfDay, formatDate } from '@/utils/formatT
 
 defineProps<{ product: ProductVO; device: DeviceVO }>()
 
-/** IoT 设备 数据详情 */
+/** IoT 设备数据详情 */
 defineOptions({ name: 'IoTDeviceDataDetail' })
 
 const dialogVisible = ref(false) // 弹窗的是否展示
@@ -78,9 +78,9 @@ const queryParams = reactive({
     formatDate(endOfDay(new Date()))
   ]
 })
-
 const queryFormRef = ref() // 搜索的表单
 
+/** 获得设备历史数据 */
 const getList = async () => {
   detailLoading.value = true
   try {
diff --git a/src/views/iot/device/device/detail/DeviceDetailConfig.vue b/src/views/iot/device/device/detail/DeviceDetailConfig.vue
@@ -30,9 +30,9 @@
     />
     <div class="mt-5 text-center">
       <el-button v-if="isEditing" @click="cancelEdit">取消</el-button>
-      <el-button v-if="isEditing" type="primary" @click="saveConfig" :disabled="hasJsonError"
-        >保存</el-button
-      >
+      <el-button v-if="isEditing" type="primary" @click="saveConfig" :disabled="hasJsonError">
+        保存
+      </el-button>
       <el-button v-else @click="enableEdit">编辑</el-button>
       <!-- TODO @芋艿：缺一个下发按钮 -->
     </div>
diff --git a/src/views/iot/device/device/detail/DeviceDetailsInfo.vue b/src/views/iot/device/device/detail/DeviceDetailsInfo.vue
@@ -120,18 +120,19 @@ const copyToClipboard = async (text: string) => {
 /** 打开 MQTT 参数弹框的方法 */
 const openMqttParams = async () => {
   try {
-    const res = await DeviceApi.getMqttConnectionParams(device.id)
+    const data = await DeviceApi.getMqttConnectionParams(device.id)
     // 根据 API 响应结构正确获取数据
+    // TODO @haohao：'N/A' 是不是在 ui 里处理哈
     mqttParams.value = {
-      mqttClientId: res.mqttClientId || 'N/A',
-      mqttUsername: res.mqttUsername || 'N/A',
-      mqttPassword: res.mqttPassword || 'N/A'
+      mqttClientId: data.mqttClientId || 'N/A',
+      mqttUsername: data.mqttUsername || 'N/A',
+      mqttPassword: data.mqttPassword || 'N/A'
     }
 
     // 显示 MQTT 弹框
     mqttDialogVisible.value = true
   } catch (error) {
-    console.error('获取MQTT连接参数出错：', error)
+    console.error('获取 MQTT 连接参数出错：', error)
     message.error('获取MQTT连接参数失败，请检查网络连接或联系管理员')
   }
 }
diff --git a/src/views/iot/device/device/detail/index.vue b/src/views/iot/device/device/detail/index.vue
@@ -51,7 +51,7 @@ defineOptions({ name: 'IoTDeviceDetail' })
 
 const route = useRoute()
 const message = useMessage()
-const id = Number(route.params.id) // 将字符串转换为数字
+const id = route.params.id // 将字符串转换为数字
 const loading = ref(true) // 加载中
 const product = ref<ProductVO>({} as ProductVO) // 产品详情
 const device = ref<DeviceVO>({} as DeviceVO) // 设备详情
diff --git a/src/views/iot/product/product/ProductForm.vue b/src/views/iot/product/product/ProductForm.vue
@@ -45,7 +45,7 @@
         </el-radio-group>
       </el-form-item>
       <el-form-item
-        v-if="formData.deviceType === 0 || formData.deviceType === 2"
+        v-if="[DeviceTypeEnum.DEVICE, DeviceTypeEnum.GATEWAY].includes(formData.deviceType)"
         label="联网方式"
         prop="netType"
       >
@@ -62,7 +62,11 @@
           />
         </el-select>
       </el-form-item>
-      <el-form-item v-if="formData.deviceType === 1" label="接入网关协议" prop="protocolType">
+      <el-form-item
+        v-if="formData.deviceType === DeviceTypeEnum.GATEWAY_SUB"
+        label="接入网关协议"
+        prop="protocolType"
+      >
         <el-select
           v-model="formData.protocolType"
           placeholder="请选择接入网关协议"
@@ -120,7 +124,13 @@
 </template>
 
 <script setup lang="ts">
-import { ValidateTypeEnum, ProductApi, ProductVO, DataFormatEnum } from '@/api/iot/product/product'
+import {
+  ValidateTypeEnum,
+  ProductApi,
+  ProductVO,
+  DataFormatEnum,
+  DeviceTypeEnum
+} from '@/api/iot/product/product'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { ProductCategoryApi, ProductCategoryVO } from '@/api/iot/product/category'
 import { UploadImg } from '@/components/UploadFile'
diff --git a/src/views/iot/product/product/detail/index.vue b/src/views/iot/product/product/detail/index.vue
@@ -34,7 +34,7 @@ const { currentRoute } = useRouter()
 
 const route = useRoute()
 const message = useMessage()
-const id = Number(route.params.id) // 编号
+const id = route.params.id // 编号
 const loading = ref(true) // 加载中
 const product = ref<ProductVO>({} as ProductVO) // 详情
 const activeTab = ref('info') // 默认为 info 标签页
diff --git a/src/views/iot/rule/databridge/IoTDataBridgeForm.vue b/src/views/iot/rule/databridge/IoTDataBridgeForm.vue
@@ -83,7 +83,7 @@ import {
   RocketMQConfigForm
 } from './config'
 
-/** IoT 数据桥梁 表单 */
+/** IoT 数据桥梁的表单 */
 defineOptions({ name: 'IoTDataBridgeForm' })
 
 const { t } = useI18n() // 国际化
@@ -95,8 +95,8 @@ const formLoading = ref(false) // 表单的加载中：1）修改时的数据加
 const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const formData = ref<DataBridgeVO>({
   status: 0,
-  direction: 1,
-  type: 1,
+  direction: 1, // TODO @puhui999:枚举类
+  type: 1, // TODO @puhui999:枚举类
   config: {} as any
 })
 const formRules = reactive({
diff --git a/src/views/iot/rule/databridge/config/HttpConfigForm.vue b/src/views/iot/rule/databridge/config/HttpConfigForm.vue
@@ -49,15 +49,15 @@ const fullUrl = computed(() => {
   return urlPath.value ? urlPrefix.value + urlPath.value : ''
 })
 
-/** 监听URL变化 */
+/** 监听 URL 变化 */
 watch([urlPrefix, urlPath], () => {
   config.value.url = fullUrl.value
 })
 
 /** 组件初始化 */
 onMounted(() => {
   if (!isEmpty(config.value)) {
-    // 初始化URL
+    // 初始化 URL
     if (config.value.url) {
       if (config.value.url.startsWith('https://')) {
         urlPrefix.value = 'https://'
diff --git a/src/views/iot/rule/databridge/config/RedisStreamMQConfigForm.vue b/src/views/iot/rule/databridge/config/RedisStreamMQConfigForm.vue
@@ -1,3 +1,4 @@
+<!-- TODO @puhui999：去掉 MQ 关键字哈 -->
 <template>
   <el-form-item label="主机地址" prop="config.host">
     <el-input v-model="config.host" placeholder="请输入主机地址，如：localhost" />
