【功能优化】IOT：枚举和复制到剪贴板方法优化

18eabfb0 · 安浩浩 · 6d641177 · 18eabfb0 · 18eabfb0 · 18eabfb0
Commit 18eabfb0 authored Oct 10, 2024 by 安浩浩
7 changed files
--- a/src/api/iot/product/index.ts
+++ b/src/api/iot/product/index.ts
@@ -18,6 +18,12 @@ export interface ProductVO {
  createTime: Date // 创建时间
 }
+// IOT 数据校验级别枚举类
+export enum ValidateTypeEnum {
+  WEAK = 0, // 弱校验
+  NONE = 1 // 免校验
+}
 // IoT 产品 API
 export const ProductApi = {
  // 查询产品分页

--- a/src/api/iot/thinkmodelfunction/index.ts
+++ b/src/api/iot/thinkmodelfunction/index.ts
@@ -14,6 +14,19 @@ export interface ThinkModelFunctionVO {
  service: string // 服务
 }
+// IOT 产品功能（物模型）类型枚举类
+export enum ProductFunctionTypeEnum {
+  PROPERTY = 1, // 属性
+  SERVICE = 2, // 服务
+  EVENT = 3 // 事件
+}
+// IOT 产品功能（物模型）访问模式枚举类
+export enum ProductFunctionAccessModeEnum {
+  READ_WRITE = 'rw', // 读写
+  READ_ONLY = 'r' // 只读
+}
 // IoT 产品物模型 API
 export const ThinkModelFunctionApi = {
  // 查询产品物模型分页

--- a/src/views/iot/device/detail/DeviceDetailsHeader.vue
+++ b/src/views/iot/device/detail/DeviceDetailsHeader.vue
@@ -53,16 +53,14 @@ const openForm = (type: string, id?: number) => {
 const { product, device } = defineProps<{ product: ProductVO; device: DeviceVO }>()
 const emit = defineEmits(['refresh'])
-/**
+/** 复制到剪贴板方法 */
- * 将文本复制到剪贴板
+const copyToClipboard = async (text: string) => {
- *
+  try {
- * @param text 需要复制的文本
+    await navigator.clipboard.writeText(text)
- */
-const copyToClipboard = (text: string) => {
-  // TODO @haohao：可以考虑用 await 异步转同步哈
-  navigator.clipboard.writeText(text).then(() => {
    message.success('复制成功')
-  })
+  } catch (error) {
+    message.error('复制失败')
+  }
 }
 /**

--- a/src/views/iot/device/detail/DeviceDetailsInfo.vue
+++ b/src/views/iot/device/detail/DeviceDetailsInfo.vue
@@ -100,10 +100,13 @@ const mqttParams = ref({
 }) // 定义 MQTT 参数对象
 /** 复制到剪贴板方法 */
-const copyToClipboard = (text: string) => {
+const copyToClipboard = async (text: string) => {
-  navigator.clipboard.writeText(text).then(() => {
+  try {
+    await navigator.clipboard.writeText(text)
    message.success('复制成功')
-  })
+  } catch (error) {
+    message.error('复制失败')
+  }
 }
 /** 打开 MQTT 参数弹框的方法 */

--- a/src/views/iot/product/ProductForm.vue
+++ b/src/views/iot/product/ProductForm.vue
@@ -100,7 +100,7 @@
 </template>
 <script setup lang="ts">
-import { ProductApi, ProductVO } from '@/api/iot/product'
+import { ValidateTypeEnum, ProductApi, ProductVO } from '@/api/iot/product'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 defineOptions({ name: 'IoTProductForm' })
@@ -119,7 +119,7 @@ const formData = ref({
  protocolId: undefined,
  categoryId: undefined,
  description: undefined,
-  validateType: undefined,
+  validateType: ValidateTypeEnum.WEAK,
  status: undefined,
  deviceType: undefined,
  netType: undefined,
@@ -132,13 +132,19 @@ const formRules = reactive({
  netType: [
    {
      // TODO @haohao：0、1、/2 最好前端也枚举下；另外，这里的 required 可以直接设置为 true。然后表单那些 v-if。只要不存在，它自动就不校验了哈
-      required: formData.deviceType === 0 || formData.deviceType === 2,
+      // required: formData.deviceType === 0 || formData.deviceType === 2,
+      required: true,
      message: '联网方式不能为空',
      trigger: 'change'
    }
  ],
  protocolType: [
-    { required: formData.deviceType === 1, message: '接入网关协议不能为空', trigger: 'change' }
+    {
+      // required: formData.deviceType === 1,
+      required: true,
+      message: '接入网关协议不能为空',
+      trigger: 'change'
+    }
  ],
  dataFormat: [{ required: true, message: '数据格式不能为空', trigger: 'change' }],
  validateType: [{ required: true, message: '数据校验级别不能为空', trigger: 'change' }]
@@ -192,7 +198,7 @@ const resetForm = () => {
    protocolId: undefined,
    categoryId: undefined,
    description: undefined,
-    validateType: undefined,
+    validateType: ValidateTypeEnum.WEAK,
    status: undefined,
    deviceType: undefined,
    netType: undefined,

--- a/src/views/iot/product/detail/ProductDetailsHeader.vue
+++ b/src/views/iot/product/detail/ProductDetailsHeader.vue
@@ -61,11 +61,14 @@ const message = useMessage()
 const { product } = defineProps<{ product: ProductVO }>() // 定义 Props
-/** 处理复制 */
+/** 复制到剪贴板方法 */
-const copyToClipboard = (text: string) => {
+const copyToClipboard = async (text: string) => {
-  navigator.clipboard.writeText(text).then(() => {
+  try {
+    await navigator.clipboard.writeText(text)
    message.success('复制成功')
-  })
+  } catch (error) {
+    message.error('复制失败')
+  }
 }
 /** 路由跳转到设备管理 */

--- a/src/views/iot/product/detail/ThinkModelFunctionForm.vue
+++ b/src/views/iot/product/detail/ThinkModelFunctionForm.vue
@@ -9,9 +9,9 @@
    >
      <el-form-item label="功能类型" prop="type">
        <el-radio-group v-model="formData.type">
-          <el-radio-button value="1"> 属性 </el-radio-button>
+          <el-radio-button :value="1"> 属性 </el-radio-button>
-          <el-radio-button value="2"> 服务 </el-radio-button>
+          <el-radio-button :value="2"> 服务 </el-radio-button>
-          <el-radio-button value="3"> 事件 </el-radio-button>
+          <el-radio-button :value="3"> 事件 </el-radio-button>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="功能名称" prop="name">
@@ -76,7 +76,12 @@
 <script setup lang="ts">
 import { ProductVO } from '@/api/iot/product'
-import { ThinkModelFunctionApi, ThinkModelFunctionVO } from '@/api/iot/thinkmodelfunction'
+import {
+  ProductFunctionAccessModeEnum,
+  ProductFunctionTypeEnum,
+  ThinkModelFunctionApi,
+  ThinkModelFunctionVO
+} from '@/api/iot/thinkmodelfunction'
 const props = defineProps<{ product: ProductVO }>()
@@ -96,11 +101,11 @@ const formData = ref({
  identifier: undefined,
  name: undefined,
  description: undefined,
-  type: '1',
+  type: ProductFunctionTypeEnum.PROPERTY,
  property: {
    identifier: undefined,
    name: undefined,
-    accessMode: 'rw',
+    accessMode: ProductFunctionAccessModeEnum.READ_WRITE,
    required: true,
    dataType: {
      type: undefined,
@@ -206,11 +211,11 @@ const resetForm = () => {
    identifier: undefined,
    name: undefined,
    description: undefined,
-    type: '1', // todo @HAOHAO：看看枚举下
+    type: ProductFunctionTypeEnum.PROPERTY,
    property: {
      identifier: undefined,
      name: undefined,
-      accessMode: 'rw',
+      accessMode: ProductFunctionAccessModeEnum.READ_WRITE,
      required: true,
      dataType: {
        type: undefined,