fix: exclude id in functionJSON on model of matter page

+import { cloneDeep } from 'lodash-es';
 import { DateTypeEnum } from './config';
 import { DateTypeEnum } from './config';
 import { StructFormValue } from './type';
 import { StructFormValue } from './type';
 import { DataType, ModelOfMatterParams, StructJSON } from '/@/api/device/model/modelOfMatterModel';
 import { DataType, ModelOfMatterParams, StructJSON } from '/@/api/device/model/modelOfMatterModel';
+import { isArray } from '/@/utils/is';
 
 
 export function transfromToStructJSON(value: StructFormValue): StructJSON {
 export function transfromToStructJSON(value: StructFormValue): StructJSON {
   const {
   const {
@@ -16,9 +18,9 @@ export function transfromToStructJSON(value: StructFormValue): StructJSON {
     identifier,
     identifier,
     remark,
     remark,
     specs,
     specs,
-    assessMode,
+    accessMode,
   } = value;
   } = value;
-  const basic = { functionName, identifier, remark, assessMode };
+  const basic = { functionName, identifier, remark, accessMode };
   let dataType = {} as unknown as DataType;
   let dataType = {} as unknown as DataType;
 
 
   switch (type) {
   switch (type) {
@@ -62,3 +64,27 @@ export function transfromToStructJSON(value: StructFormValue): StructJSON {
   }
   }
   return { ...basic, dataType };
   return { ...basic, dataType };
 }
 }
+
+export const excludeIdInStructJSON = (struct: DataType) => {
+  const _value = cloneDeep(struct);
+  const { specs } = _value;
+  const list = [specs];
+
+  while (list.length) {
+    for (const item of list) {
+      if (isArray(item)) {
+        (item as StructJSON[]).forEach((temp) => {
+          if (temp.dataType?.specs) {
+            list.push(temp.dataType.specs);
+          }
+          Reflect.deleteProperty(temp, 'id');
+        });
+      } else {
+        Reflect.deleteProperty(item as Recordable, 'id');
+      }
+      list.shift();
+    }
+  }
+
+  return _value;
+};

 <template>
 <template>
   <BasicDrawer v-bind="$attrs" title="产品详情" @register="register" width="60%" destroy-on-close>
   <BasicDrawer v-bind="$attrs" title="产品详情" @register="register" width="60%" destroy-on-close>
-    <Tabs :animated="true" v-model:activeKey="activeKey" @change="handlePanelChange">
-      <TabPane key="product" tab="产品">
+    <Tabs v-model:activeKey="activeKey" @change="handlePanelChange">
+      <Tabs.TabPane key="product" tab="产品">
         <div class="relative">
         <div class="relative">
           <DeviceConfigurationStep :ifShowBtn="false" ref="DevConStRef" />
           <DeviceConfigurationStep :ifShowBtn="false" ref="DevConStRef" />
           <div class="absolute w-full h-full top-0 cursor-not-allowed"></div>
           <div class="absolute w-full h-full top-0 cursor-not-allowed"></div>
         </div>
         </div>
-      </TabPane>
-      <TabPane key="transport" tab="传输配置">
+      </Tabs.TabPane>
+      <Tabs.TabPane key="transport" tab="传输配置">
         <div class="relative">
         <div class="relative">
           <TransportConfigurationStep :ifShowBtn="false" ref="TransConStRef" />
           <TransportConfigurationStep :ifShowBtn="false" ref="TransConStRef" />
           <div class="absolute w-full h-full top-0 cursor-not-allowed"></div>
           <div class="absolute w-full h-full top-0 cursor-not-allowed"></div>
         </div>
         </div>
-      </TabPane>
-      <TabPane key="modelOfMatter" tab="物模型管理">
+      </Tabs.TabPane>
+      <Tabs.TabPane key="modelOfMatter" tab="物模型管理">
         <PhysicalModelManagementStep :record="record" />
         <PhysicalModelManagementStep :record="record" />
-      </TabPane>
+      </Tabs.TabPane>
     </Tabs>
     </Tabs>
   </BasicDrawer>
   </BasicDrawer>
 </template>
 </template>
 <script lang="ts" setup>
 <script lang="ts" setup>
   import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
   import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
-  import { Tabs, TabPane } from 'ant-design-vue';
+  import { Tabs } from 'ant-design-vue';
   import DeviceConfigurationStep from './step/DeviceConfigurationStep.vue';
   import DeviceConfigurationStep from './step/DeviceConfigurationStep.vue';
   import TransportConfigurationStep from './step/TransportConfigurationStep.vue';
   import TransportConfigurationStep from './step/TransportConfigurationStep.vue';
   import PhysicalModelManagementStep from './step/PhysicalModelManagementStep.vue';
   import PhysicalModelManagementStep from './step/PhysicalModelManagementStep.vue';

@@ -35,23 +35,23 @@
             :disabled="$props.record.transportType === 'TCP'"
             :disabled="$props.record.transportType === 'TCP'"
           />
           />
         </Tabs>
         </Tabs>
-        <Attribute v-show="activeKey === FunctionType.PROPERTIES" ref="AttrRef" />
+        <Attribute v-if="activeKey === FunctionType.PROPERTIES" ref="AttrRef" />
         <Service
         <Service
-          v-show="activeKey === FunctionType.SERVICE"
+          v-if="activeKey === FunctionType.SERVICE"
           :record="$props.record"
           :record="$props.record"
           ref="ServiceRef"
           ref="ServiceRef"
         />
         />
-        <Events v-show="activeKey === FunctionType.EVENTS" ref="EventsRef" />
+        <Events v-if="activeKey === FunctionType.EVENTS" ref="EventsRef" />
         <div
         <div
           v-if="openModalMode === OpenModelMode.VIEW"
           v-if="openModalMode === OpenModelMode.VIEW"
-          class="absolute w-full h-full top-0 cursor-not-allowed"
+          class="absolute w-full h-full top-0 cursor-not-allowed z-50"
         ></div>
         ></div>
       </div>
       </div>
     </BasicModal>
     </BasicModal>
   </div>
   </div>
 </template>
 </template>
 <script lang="ts" setup>
 <script lang="ts" setup>
-  import { ref, unref } from 'vue';
+  import { ref, unref, nextTick } from 'vue';
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import { Tabs, TabPane, Typography, TypographyParagraph } from 'ant-design-vue';
   import { Tabs, TabPane, Typography, TypographyParagraph } from 'ant-design-vue';
   import Attribute from './cpns/Attribute.vue';
   import Attribute from './cpns/Attribute.vue';
@@ -109,16 +109,13 @@
       if (record) {
       if (record) {
         functionType.value = data.record.functionType;
         functionType.value = data.record.functionType;
         activeKey.value = data.record.functionType;
         activeKey.value = data.record.functionType;
+        await nextTick();
         setFormData(record.functionType, record as unknown as ModelOfMatterParams);
         setFormData(record.functionType, record as unknown as ModelOfMatterParams);
       }
       }
       if (unref(openModalMode) === OpenModelMode.VIEW) {
       if (unref(openModalMode) === OpenModelMode.VIEW) {
         setModalProps({ showOkBtn: false, showCancelBtn: false, title: '查看物模型' });
         setModalProps({ showOkBtn: false, showCancelBtn: false, title: '查看物模型' });
-        // setFormData(functionType.value, record);
       } else {
       } else {
         const title = unref(openModalMode) === OpenModelMode.UPDATE ? '编辑物模型' : '新增物模型';
         const title = unref(openModalMode) === OpenModelMode.UPDATE ? '编辑物模型' : '新增物模型';
-        if (OpenModelMode.UPDATE) {
-          // setFormData(functionType.value, record);
-        }
         setModalProps({ title, showOkBtn: true, showCancelBtn: true });
         setModalProps({ title, showOkBtn: true, showCancelBtn: true });
       }
       }
     }
     }

@@ -6,7 +6,10 @@
   import { DataType, ModelOfMatterParams } from '/@/api/device/model/modelOfMatterModel';
   import { DataType, ModelOfMatterParams } from '/@/api/device/model/modelOfMatterModel';
   import { formSchemas } from '/@/components/Form/src/externalCompns/components/StructForm/config';
   import { formSchemas } from '/@/components/Form/src/externalCompns/components/StructForm/config';
   import { StructFormValue } from '/@/components/Form/src/externalCompns/components/StructForm/type';
   import { StructFormValue } from '/@/components/Form/src/externalCompns/components/StructForm/type';
-  import { transfromToStructJSON } from '/@/components/Form/src/externalCompns/components/StructForm/util';
+  import {
+    transfromToStructJSON,
+    excludeIdInStructJSON,
+  } from '/@/components/Form/src/externalCompns/components/StructForm/util';
   import { FunctionType } from './config';
   import { FunctionType } from './config';
   import { isArray } from 'lodash';
   import { isArray } from 'lodash';
 
 
@@ -26,6 +29,8 @@
     if (!_values) return {};
     if (!_values) return {};
     const { functionName, remark, identifier, accessMode } = _values;
     const { functionName, remark, identifier, accessMode } = _values;
     const structJSON = transfromToStructJSON(_values);
     const structJSON = transfromToStructJSON(_values);
+    const dataType = excludeIdInStructJSON(structJSON.dataType!);
+
     const value = {
     const value = {
       functionName,
       functionName,
       functionType: FunctionType.PROPERTIES,
       functionType: FunctionType.PROPERTIES,
@@ -33,7 +38,7 @@
       identifier,
       identifier,
       accessMode,
       accessMode,
       functionJson: {
       functionJson: {
-        dataType: structJSON.dataType,
+        dataType: dataType,
       },
       },
     } as ModelOfMatterParams;
     } as ModelOfMatterParams;
     return value;
     return value;

@@ -46,6 +46,7 @@
     const { functionName, remark, identifier, inputData, outputData, serviceCommand, callType } =
     const { functionName, remark, identifier, inputData, outputData, serviceCommand, callType } =
       _values;
       _values;
     if (!_values) return {};
     if (!_values) return {};
+
     const value = {
     const value = {
       functionName,
       functionName,
       identifier,
       identifier,