fix：【iot 物联网】linter 报错

apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelArrayDataSpecs.vue

@@ -1,4 +1,31 @@
 <!-- dataType：array 数组类型 -->
+<script lang="ts" setup>
+import { useVModel } from '@vueuse/core';
+
+import {
+  getDataTypeOptions,
+  IoTDataSpecsDataTypeEnum,
+} from '#/views/iot/utils/constants';
+
+import ThingModelStructDataSpecs from './ThingModelStructDataSpecs.vue';
+
+/** 数组型的 dataSpecs 配置组件 */
+defineOptions({ name: 'ThingModelArrayDataSpecs' });
+
+const props = defineProps<{ modelValue: any }>();
+const emits = defineEmits(['update:modelValue']);
+const dataSpecs = useVModel(props, 'modelValue', emits) as Ref<any>;
+
+/** 元素类型改变时间。当值为 struct 时，对 dataSpecs 中的 dataSpecsList 进行初始化 */
+const handleChange = (val: string) => {
+  if (val !== IoTDataSpecsDataTypeEnum.STRUCT) {
+    return;
+  }
+
+  dataSpecs.value.dataSpecsList = [];
+};
+</script>
+
 <template>
   <el-form-item label="元素类型" prop="property.dataSpecs.childDataType">
     <el-radio-group v-model="dataSpecs.childDataType" @change="handleChange">
@@ -9,7 +36,7 @@
               [
                 IoTDataSpecsDataTypeEnum.ENUM,
                 IoTDataSpecsDataTypeEnum.ARRAY,
-                IoTDataSpecsDataTypeEnum.DATE
+                IoTDataSpecsDataTypeEnum.DATE,
               ] as any[]
             ).includes(item.value)
           "
@@ -31,26 +58,4 @@
   />
 </template>
 
-<script lang="ts" setup>
-import { useVModel } from '@vueuse/core'
-import ThingModelStructDataSpecs from './ThingModelStructDataSpecs.vue'
-import { getDataTypeOptions, IoTDataSpecsDataTypeEnum } from '#/views/iot/utils/constants'
-
-/** 数组型的 dataSpecs 配置组件 */
-defineOptions({ name: 'ThingModelArrayDataSpecs' })
-
-const props = defineProps<{ modelValue: any }>()
-const emits = defineEmits(['update:modelValue'])
-const dataSpecs = useVModel(props, 'modelValue', emits) as Ref<any>
-
-/** 元素类型改变时间。当值为 struct 时，对 dataSpecs 中的 dataSpecsList 进行初始化 */
-const handleChange = (val: string) => {
-  if (val !== IoTDataSpecsDataTypeEnum.STRUCT) {
-    return
-  }
-
-  dataSpecs.value.dataSpecsList = []
-}
-</script>
-
 <style lang="scss" scoped></style>

apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelEnumDataSpecs.vue

@@ -1,7 +1,123 @@
 <!-- dataType：enum 数组类型 -->
+<script lang="ts" setup>
+import { isEmpty } from '@vben/utils';
+
+import { useVModel } from '@vueuse/core';
+
+import { DataSpecsEnumOrBoolData } from '#/api/iot/thingmodel';
+import { IoTDataSpecsDataTypeEnum } from '#/views/iot/utils/constants';
+
+/** 枚举型的 dataSpecs 配置组件 */
+defineOptions({ name: 'ThingModelEnumDataSpecs' });
+
+const props = defineProps<{ modelValue: any }>();
+const emits = defineEmits(['update:modelValue']);
+const dataSpecsList = useVModel(props, 'modelValue', emits) as Ref<
+  DataSpecsEnumOrBoolData[]
+>;
+
+/** 添加枚举项 */
+const addEnum = () => {
+  dataSpecsList.value.push({
+    dataType: IoTDataSpecsDataTypeEnum.ENUM,
+    name: '', // 枚举项的名称
+    value: undefined, // 枚举值
+  });
+};
+
+/** 删除枚举项 */
+const deleteEnum = (index: number) => {
+  if (dataSpecsList.value.length === 1) {
+    message.warning('至少需要一个枚举项');
+    return;
+  }
+  dataSpecsList.value.splice(index, 1);
+};
+
+/** 校验枚举值 */
+const validateEnumValue = (_: any, value: any, callback: any) => {
+  if (isEmpty(value)) {
+    callback(new Error('枚举值不能为空'));
+    return;
+  }
+  if (isNaN(Number(value))) {
+    callback(new Error('枚举值必须是数字'));
+    return;
+  }
+  // 检查枚举值是否重复
+  const values = dataSpecsList.value.map((item) => item.value);
+  if (values.filter((v) => v === value).length > 1) {
+    callback(new Error('枚举值不能重复'));
+    return;
+  }
+  callback();
+};
+
+/** 校验枚举描述 */
+const validateEnumName = (_: any, value: string, callback: any) => {
+  if (isEmpty(value)) {
+    callback(new Error('枚举描述不能为空'));
+    return;
+  }
+  // 检查开头字符
+  if (!/^[\u4E00-\u9FA5a-z0-9]/i.test(value)) {
+    callback(new Error('枚举描述必须以中文、英文字母或数字开头'));
+    return;
+  }
+  // 检查整体格式
+  if (!/^[\u4E00-\u9FA5a-z0-9][\w\u4E00-\u9FA5-]*$/i.test(value)) {
+    callback(new Error('枚举描述只能包含中文、英文字母、数字、下划线和短划线'));
+    return;
+  }
+  // 检查长度（一个中文算一个字符）
+  if (value.length > 20) {
+    callback(new Error('枚举描述长度不能超过20个字符'));
+    return;
+  }
+  callback();
+};
+
+/** 校验整个枚举列表 */
+const validateEnumList = (_: any, __: any, callback: any) => {
+  if (isEmpty(dataSpecsList.value)) {
+    callback(new Error('请至少添加一个枚举项'));
+    return;
+  }
+
+  // 检查是否存在空值
+  const hasEmptyValue = dataSpecsList.value.some(
+    (item) => isEmpty(item.value) || isEmpty(item.name),
+  );
+  if (hasEmptyValue) {
+    callback(new Error('存在未填写的枚举值或描述'));
+    return;
+  }
+
+  // 检查枚举值是否都是数字
+  const hasInvalidNumber = dataSpecsList.value.some((item) =>
+    isNaN(Number(item.value)),
+  );
+  if (hasInvalidNumber) {
+    callback(new Error('存在非数字的枚举值'));
+    return;
+  }
+
+  // 检查是否有重复的枚举值
+  const values = dataSpecsList.value.map((item) => item.value);
+  const uniqueValues = new Set(values);
+  if (values.length !== uniqueValues.size) {
+    callback(new Error('存在重复的枚举值'));
+    return;
+  }
+  callback();
+};
+</script>
+
 <template>
   <el-form-item
-    :rules="[{ required: true, validator: validateEnumList, trigger: 'change' }]"
+    :rules="[
+      { required: true, validator: validateEnumList, trigger: 'change' },
+    ]"
     label="枚举项"
   >
     <div class="flex flex-col">
@@ -12,15 +128,15 @@
       <div
         v-for="(item, index) in dataSpecsList"
         :key="index"
-        class="flex items-center justify-between mb-5px"
+        class="mb-5px flex items-center justify-between"
       >
         <el-form-item
           :prop="`property.dataSpecsList[${index}].value`"
           :rules="[
             { required: true, message: '枚举值不能为空' },
-            { validator: validateEnumValue, trigger: 'blur' }
+            { validator: validateEnumValue, trigger: 'blur' },
           ]"
-          class="flex-1 mb-0"
+          class="mb-0 flex-1"
         >
           <el-input v-model="item.value" placeholder="请输入枚举值,如'0'" />
         </el-form-item>
@@ -29,128 +145,26 @@
           :prop="`property.dataSpecsList[${index}].name`"
           :rules="[
             { required: true, message: '枚举描述不能为空' },
-            { validator: validateEnumName, trigger: 'blur' }
+            { validator: validateEnumName, trigger: 'blur' },
           ]"
-          class="flex-1 mb-0"
+          class="mb-0 flex-1"
         >
           <el-input v-model="item.name" placeholder="对该枚举项的描述" />
         </el-form-item>
-        <el-button class="ml-10px" link type="primary" @click="deleteEnum(index)">删除</el-button>
+        <el-button
+          class="ml-10px"
+          link
+          type="primary"
+          @click="deleteEnum(index)"
+        >
+          删除
+        </el-button>
       </div>
       <el-button link type="primary" @click="addEnum">+添加枚举项</el-button>
     </div>
   </el-form-item>
 </template>
 
-<script lang="ts" setup>
-import { useVModel } from '@vueuse/core'
-import { isEmpty } from '@vben/utils'
-import { IoTDataSpecsDataTypeEnum } from '#/views/iot/utils/constants'
-import { DataSpecsEnumOrBoolData } from '#/api/iot/thingmodel'
-
-/** 枚举型的 dataSpecs 配置组件 */
-defineOptions({ name: 'ThingModelEnumDataSpecs' })
-
-const props = defineProps<{ modelValue: any }>()
-const emits = defineEmits(['update:modelValue'])
-const dataSpecsList = useVModel(props, 'modelValue', emits) as Ref<DataSpecsEnumOrBoolData[]>
-
-
-/** 添加枚举项 */
-const addEnum = () => {
-  dataSpecsList.value.push({
-    dataType: IoTDataSpecsDataTypeEnum.ENUM,
-    name: '', // 枚举项的名称
-    value: undefined // 枚举值
-  })
-}
-
-/** 删除枚举项 */
-const deleteEnum = (index: number) => {
-  if (dataSpecsList.value.length === 1) {
-    message.warning('至少需要一个枚举项')
-    return
-  }
-  dataSpecsList.value.splice(index, 1)
-}
-
-/** 校验枚举值 */
-const validateEnumValue = (_: any, value: any, callback: any) => {
-  if (isEmpty(value)) {
-    callback(new Error('枚举值不能为空'))
-    return
-  }
-  if (isNaN(Number(value))) {
-    callback(new Error('枚举值必须是数字'))
-    return
-  }
-  // 检查枚举值是否重复
-  const values = dataSpecsList.value.map((item) => item.value)
-  if (values.filter((v) => v === value).length > 1) {
-    callback(new Error('枚举值不能重复'))
-    return
-  }
-  callback()
-}
-
-/** 校验枚举描述 */
-const validateEnumName = (_: any, value: string, callback: any) => {
-  if (isEmpty(value)) {
-    callback(new Error('枚举描述不能为空'))
-    return
-  }
-  // 检查开头字符
-  if (!/^[\u4e00-\u9fa5a-zA-Z0-9]/.test(value)) {
-    callback(new Error('枚举描述必须以中文、英文字母或数字开头'))
-    return
-  }
-  // 检查整体格式
-  if (!/^[\u4e00-\u9fa5a-zA-Z0-9][a-zA-Z0-9\u4e00-\u9fa5_-]*$/.test(value)) {
-    callback(new Error('枚举描述只能包含中文、英文字母、数字、下划线和短划线'))
-    return
-  }
-  // 检查长度（一个中文算一个字符）
-  if (value.length > 20) {
-    callback(new Error('枚举描述长度不能超过20个字符'))
-    return
-  }
-  callback()
-}
-
-/** 校验整个枚举列表 */
-const validateEnumList = (_: any, __: any, callback: any) => {
-  if (isEmpty(dataSpecsList.value)) {
-    callback(new Error('请至少添加一个枚举项'))
-    return
-  }
-
-  // 检查是否存在空值
-  const hasEmptyValue = dataSpecsList.value.some(
-    (item) => isEmpty(item.value) || isEmpty(item.name)
-  )
-  if (hasEmptyValue) {
-    callback(new Error('存在未填写的枚举值或描述'))
-    return
-  }
-
-  // 检查枚举值是否都是数字
-  const hasInvalidNumber = dataSpecsList.value.some((item) => isNaN(Number(item.value)))
-  if (hasInvalidNumber) {
-    callback(new Error('存在非数字的枚举值'))
-    return
-  }
-
-  // 检查是否有重复的枚举值
-  const values = dataSpecsList.value.map((item) => item.value)
-  const uniqueValues = new Set(values)
-  if (values.length !== uniqueValues.size) {
-    callback(new Error('存在重复的枚举值'))
-    return
-  }
-  callback()
-}
-</script>
-
 <style lang="scss" scoped>
 :deep(.el-form-item) {
   .el-form-item {

apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelNumberDataSpecs.vue

@@ -1,11 +1,90 @@
 <!-- dataType：number 数组类型 -->
+<script lang="ts" setup>
+import { DICT_TYPE, getStrDictOptions } from '@vben/constants';
+
+import { useVModel } from '@vueuse/core';
+
+import { DataSpecsNumberData } from '#/api/iot/thingmodel';
+
+/** 数值型的 dataSpecs 配置组件 */
+defineOptions({ name: 'ThingModelNumberDataSpecs' });
+
+const props = defineProps<{ modelValue: any }>();
+const emits = defineEmits(['update:modelValue']);
+const dataSpecs = useVModel(
+  props,
+  'modelValue',
+  emits,
+) as Ref<DataSpecsNumberData>;
+
+/** 单位发生变化时触发 */
+const unitChange = (UnitSpecs: string) => {
+  const [unitName, unit] = UnitSpecs.split('-');
+  dataSpecs.value.unitName = unitName;
+  dataSpecs.value.unit = unit;
+};
+
+/** 校验最小值 */
+const validateMin = (_: any, __: any, callback: any) => {
+  const min = Number(dataSpecs.value.min);
+  const max = Number(dataSpecs.value.max);
+  if (isNaN(min)) {
+    callback(new Error('请输入有效的数值'));
+    return;
+  }
+  if (max !== undefined && !isNaN(max) && min >= max) {
+    callback(new Error('最小值必须小于最大值'));
+    return;
+  }
+
+  callback();
+};
+
+/** 校验最大值 */
+const validateMax = (_: any, __: any, callback: any) => {
+  const min = Number(dataSpecs.value.min);
+  const max = Number(dataSpecs.value.max);
+  if (isNaN(max)) {
+    callback(new Error('请输入有效的数值'));
+    return;
+  }
+  if (min !== undefined && !isNaN(min) && max <= min) {
+    callback(new Error('最大值必须大于最小值'));
+    return;
+  }
+
+  callback();
+};
+
+/** 校验步长 */
+const validateStep = (_: any, __: any, callback: any) => {
+  const step = Number(dataSpecs.value.step);
+  if (isNaN(step)) {
+    callback(new Error('请输入有效的数值'));
+    return;
+  }
+  if (step <= 0) {
+    callback(new Error('步长必须大于0'));
+    return;
+  }
+  const min = Number(dataSpecs.value.min);
+  const max = Number(dataSpecs.value.max);
+  if (!isNaN(min) && !isNaN(max) && step > max - min) {
+    callback(new Error('步长不能大于最大值和最小值的差值'));
+    return;
+  }
+
+  callback();
+};
+</script>
+
 <template>
   <el-form-item label="取值范围">
     <div class="flex items-center justify-between">
       <el-form-item
         :rules="[
           { required: true, message: '最小值不能为空' },
-          { validator: validateMin, trigger: 'blur' }
+          { validator: validateMin, trigger: 'blur' },
         ]"
         class="mb-0"
         prop="property.dataSpecs.min"
@@ -16,7 +95,7 @@
       <el-form-item
         :rules="[
           { required: true, message: '最大值不能为空' },
-          { validator: validateMax, trigger: 'blur' }
+          { validator: validateMax, trigger: 'blur' },
         ]"
         class="mb-0"
         prop="property.dataSpecs.max"
@@ -28,7 +107,7 @@
   <el-form-item
     :rules="[
       { required: true, message: '步长不能为空' },
-      { validator: validateStep, trigger: 'blur' }
+      { validator: validateStep, trigger: 'blur' },
     ]"
     label="步长"
     prop="property.dataSpecs.step"
@@ -41,95 +120,26 @@
     prop="property.dataSpecs.unit"
   >
     <el-select
-      :model-value="dataSpecs.unit ? dataSpecs.unitName + '-' + dataSpecs.unit : ''"
+      :model-value="
+        dataSpecs.unit ? `${dataSpecs.unitName}-${dataSpecs.unit}` : ''
+      "
       filterable
       placeholder="请选择单位"
       class="w-1/1"
       @change="unitChange"
     >
       <el-option
-        v-for="(item, index) in getStrDictOptions(DICT_TYPE.IOT_THING_MODEL_UNIT)"
+        v-for="(item, index) in getStrDictOptions(
+          DICT_TYPE.IOT_THING_MODEL_UNIT,
+        )"
         :key="index"
-        :label="item.label + '-' + item.value"
-        :value="item.label + '-' + item.value"
+        :label="`${item.label}-${item.value}`"
+        :value="`${item.label}-${item.value}`"
       />
     </el-select>
   </el-form-item>
 </template>
 
-<script lang="ts" setup>
-import { useVModel } from '@vueuse/core'
-import { DICT_TYPE, getStrDictOptions } from '@vben/constants'
-import { DataSpecsNumberData } from '#/api/iot/thingmodel'
-
-/** 数值型的 dataSpecs 配置组件 */
-defineOptions({ name: 'ThingModelNumberDataSpecs' })
-
-const props = defineProps<{ modelValue: any }>()
-const emits = defineEmits(['update:modelValue'])
-const dataSpecs = useVModel(props, 'modelValue', emits) as Ref<DataSpecsNumberData>
-
-/** 单位发生变化时触发 */
-const unitChange = (UnitSpecs: string) => {
-  const [unitName, unit] = UnitSpecs.split('-')
-  dataSpecs.value.unitName = unitName
-  dataSpecs.value.unit = unit
-}
-
-/** 校验最小值 */
-const validateMin = (_: any, __: any, callback: any) => {
-  const min = Number(dataSpecs.value.min)
-  const max = Number(dataSpecs.value.max)
-  if (isNaN(min)) {
-    callback(new Error('请输入有效的数值'))
-    return
-  }
-  if (max !== undefined && !isNaN(max) && min >= max) {
-    callback(new Error('最小值必须小于最大值'))
-    return
-  }
-
-  callback()
-}
-
-/** 校验最大值 */
-const validateMax = (_: any, __: any, callback: any) => {
-  const min = Number(dataSpecs.value.min)
-  const max = Number(dataSpecs.value.max)
-  if (isNaN(max)) {
-    callback(new Error('请输入有效的数值'))
-    return
-  }
-  if (min !== undefined && !isNaN(min) && max <= min) {
-    callback(new Error('最大值必须大于最小值'))
-    return
-  }
-
-  callback()
-}
-
-/** 校验步长 */
-const validateStep = (_: any, __: any, callback: any) => {
-  const step = Number(dataSpecs.value.step)
-  if (isNaN(step)) {
-    callback(new Error('请输入有效的数值'))
-    return
-  }
-  if (step <= 0) {
-    callback(new Error('步长必须大于0'))
-    return
-  }
-  const min = Number(dataSpecs.value.min)
-  const max = Number(dataSpecs.value.max)
-  if (!isNaN(min) && !isNaN(max) && step > max - min) {
-    callback(new Error('步长不能大于最大值和最小值的差值'))
-    return
-  }
-
-  callback()
-}
-</script>
-
 <style lang="scss" scoped>
 :deep(.el-form-item) {
   .el-form-item {

apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelStructDataSpecs.vue

@@ -1,4 +1,125 @@
 <!-- dataType：struct 数组类型 -->
+<script lang="ts" setup>
+import { isEmpty } from '@vben/utils';
+
+import { useVModel } from '@vueuse/core';
+
+import { ThingModelFormRules } from '#/api/iot/thingmodel';
+import { IoTDataSpecsDataTypeEnum } from '#/views/iot/utils/constants';
+
+import ThingModelProperty from '../ThingModelProperty.vue';
+
+/** Struct 型的 dataSpecs 配置组件 */
+defineOptions({ name: 'ThingModelStructDataSpecs' });
+
+const props = defineProps<{ modelValue: any }>();
+const emits = defineEmits(['update:modelValue']);
+const dataSpecsList = useVModel(props, 'modelValue', emits) as Ref<any[]>;
+const dialogVisible = ref(false); // 弹窗的是否展示
+const dialogTitle = ref('新增参数'); // 弹窗的标题
+const formLoading = ref(false); // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const structFormRef = ref(); // 表单 ref
+const formData = ref<any>({
+  property: {
+    dataType: IoTDataSpecsDataTypeEnum.INT,
+    dataSpecs: {
+      dataType: IoTDataSpecsDataTypeEnum.INT,
+    },
+  },
+});
+
+/** 打开 struct 表单 */
+const openStructForm = (val: any) => {
+  dialogVisible.value = true;
+  resetForm();
+  if (isEmpty(val)) {
+    return;
+  }
+  // 编辑时回显数据
+  formData.value = {
+    identifier: val.identifier,
+    name: val.name,
+    description: val.description,
+    property: {
+      dataType: val.childDataType,
+      dataSpecs: val.dataSpecs,
+      dataSpecsList: val.dataSpecsList,
+    },
+  };
+};
+
+/** 删除 struct 项 */
+const deleteStructItem = (index: number) => {
+  dataSpecsList.value.splice(index, 1);
+};
+
+/** 添加参数 */
+const submitForm = async () => {
+  await structFormRef.value.validate();
+
+  try {
+    const data = unref(formData);
+    // 构建数据对象
+    const item = {
+      identifier: data.identifier,
+      name: data.name,
+      description: data.description,
+      dataType: IoTDataSpecsDataTypeEnum.STRUCT,
+      childDataType: data.property.dataType,
+      dataSpecs:
+        !!data.property.dataSpecs &&
+        Object.keys(data.property.dataSpecs).length > 1
+          ? data.property.dataSpecs
+          : undefined,
+      dataSpecsList: isEmpty(data.property.dataSpecsList)
+        ? undefined
+        : data.property.dataSpecsList,
+    };
+
+    // 新增或修改同 identifier 的参数
+    const existingIndex = dataSpecsList.value.findIndex(
+      (spec) => spec.identifier === data.identifier,
+    );
+    if (existingIndex === -1) {
+      dataSpecsList.value.push(item);
+    } else {
+      dataSpecsList.value[existingIndex] = item;
+    }
+  } finally {
+    dialogVisible.value = false;
+  }
+};
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    property: {
+      dataType: IoTDataSpecsDataTypeEnum.INT,
+      dataSpecs: {
+        dataType: IoTDataSpecsDataTypeEnum.INT,
+      },
+    },
+  };
+  structFormRef.value?.resetFields();
+};
+
+/** 校验 struct 不能为空 */
+const validateList = (_: any, __: any, callback: any) => {
+  if (isEmpty(dataSpecsList.value)) {
+    callback(new Error('struct 不能为空'));
+    return;
+  }
+  callback();
+};
+
+/** 组件初始化 */
+onMounted(async () => {
+  await nextTick();
+  // 预防 dataSpecsList 空指针
+  isEmpty(dataSpecsList.value) && (dataSpecsList.value = []);
+});
+</script>
+
 <template>
   <!-- struct 数据展示 -->
   <el-form-item
@@ -8,16 +129,22 @@
     <div
       v-for="(item, index) in dataSpecsList"
       :key="index"
-      class="w-1/1 struct-item flex justify-between px-10px mb-10px"
+      class="w-1/1 struct-item px-10px mb-10px flex justify-between"
     >
       <span>参数名称：{{ item.name }}</span>
       <div class="btn">
-        <el-button link type="primary" @click="openStructForm(item)">编辑</el-button>
+        <el-button link type="primary" @click="openStructForm(item)">
+          编辑
+        </el-button>
         <el-divider direction="vertical" />
-        <el-button link type="danger" @click="deleteStructItem(index)">删除</el-button>
+        <el-button link type="danger" @click="deleteStructItem(index)">
+          删除
+        </el-button>
       </div>
     </div>
-    <el-button link type="primary" @click="openStructForm(null)">+新增参数</el-button>
+    <el-button link type="primary" @click="openStructForm(null)">
+      +新增参数
+    </el-button>
   </el-form-item>
 
   <!-- struct 表单 -->
@@ -39,127 +166,14 @@
       <ThingModelProperty v-model="formData.property" is-struct-data-specs />
     </el-form>
     <template #footer>
-      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">
+        确 定
+      </el-button>
       <el-button @click="dialogVisible = false">取 消</el-button>
     </template>
   </Dialog>
 </template>
 
-<script lang="ts" setup>
-import { useVModel } from '@vueuse/core'
-import ThingModelProperty from '../ThingModelProperty.vue'
-import { isEmpty } from '@vben/utils'
-import { IoTDataSpecsDataTypeEnum } from '#/views/iot/utils/constants'
-import { ThingModelFormRules } from '#/api/iot/thingmodel'
-
-/** Struct 型的 dataSpecs 配置组件 */
-defineOptions({ name: 'ThingModelStructDataSpecs' })
-
-const props = defineProps<{ modelValue: any }>()
-const emits = defineEmits(['update:modelValue'])
-const dataSpecsList = useVModel(props, 'modelValue', emits) as Ref<any[]>
-const dialogVisible = ref(false) // 弹窗的是否展示
-const dialogTitle = ref('新增参数') // 弹窗的标题
-const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
-const structFormRef = ref() // 表单 ref
-const formData = ref<any>({
-  property: {
-    dataType: IoTDataSpecsDataTypeEnum.INT,
-    dataSpecs: {
-      dataType: IoTDataSpecsDataTypeEnum.INT
-    }
-  }
-})
-
-/** 打开 struct 表单 */
-const openStructForm = (val: any) => {
-  dialogVisible.value = true
-  resetForm()
-  if (isEmpty(val)) {
-    return
-  }
-  // 编辑时回显数据
-  formData.value = {
-    identifier: val.identifier,
-    name: val.name,
-    description: val.description,
-    property: {
-      dataType: val.childDataType,
-      dataSpecs: val.dataSpecs,
-      dataSpecsList: val.dataSpecsList
-    }
-  }
-}
-
-/** 删除 struct 项 */
-const deleteStructItem = (index: number) => {
-  dataSpecsList.value.splice(index, 1)
-}
-
-/** 添加参数 */
-const submitForm = async () => {
-  await structFormRef.value.validate()
-
-  try {
-    const data = unref(formData)
-    // 构建数据对象
-    const item = {
-      identifier: data.identifier,
-      name: data.name,
-      description: data.description,
-      dataType: IoTDataSpecsDataTypeEnum.STRUCT,
-      childDataType: data.property.dataType,
-      dataSpecs:
-        !!data.property.dataSpecs && Object.keys(data.property.dataSpecs).length > 1
-          ? data.property.dataSpecs
-          : undefined,
-      dataSpecsList: isEmpty(data.property.dataSpecsList) ? undefined : data.property.dataSpecsList
-    }
-
-    // 新增或修改同 identifier 的参数
-    const existingIndex = dataSpecsList.value.findIndex(
-      (spec) => spec.identifier === data.identifier
-    )
-    if (existingIndex > -1) {
-      dataSpecsList.value[existingIndex] = item
-    } else {
-      dataSpecsList.value.push(item)
-    }
-  } finally {
-    dialogVisible.value = false
-  }
-}
-
-/** 重置表单 */
-const resetForm = () => {
-  formData.value = {
-    property: {
-      dataType: IoTDataSpecsDataTypeEnum.INT,
-      dataSpecs: {
-        dataType: IoTDataSpecsDataTypeEnum.INT
-      }
-    }
-  }
-  structFormRef.value?.resetFields()
-}
-
-/** 校验 struct 不能为空 */
-const validateList = (_: any, __: any, callback: any) => {
-  if (isEmpty(dataSpecsList.value)) {
-    callback(new Error('struct 不能为空'))
-    return
-  }
-  callback()
-}
-
-/** 组件初始化 */
-onMounted(async () => {
-  await nextTick()
-  // 预防 dataSpecsList 空指针
-  isEmpty(dataSpecsList.value) && (dataSpecsList.value = [])
-})
-</script>
-
 <style lang="scss" scoped>
 .struct-item {
   background-color: #e4f2fd;

apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/index.ts

@@ -1,11 +1,4 @@
-import ThingModelEnumDataSpecs from './ThingModelEnumDataSpecs.vue'
-import ThingModelNumberDataSpecs from './ThingModelNumberDataSpecs.vue'
-import ThingModelArrayDataSpecs from './ThingModelArrayDataSpecs.vue'
-import ThingModelStructDataSpecs from './ThingModelStructDataSpecs.vue'
-
-export {
-  ThingModelEnumDataSpecs,
-  ThingModelNumberDataSpecs,
-  ThingModelArrayDataSpecs,
-  ThingModelStructDataSpecs
-}
+export { default as ThingModelArrayDataSpecs } from './ThingModelArrayDataSpecs.vue';
+export { default as ThingModelEnumDataSpecs } from './ThingModelEnumDataSpecs.vue';
+export { default as ThingModelNumberDataSpecs } from './ThingModelNumberDataSpecs.vue';
+export { default as ThingModelStructDataSpecs } from './ThingModelStructDataSpecs.vue';