Merge remote-tracking branch 'origin/ww'

# Conflicts:
#	src/views/device/list/cpns/tabs/commandRecord/index.vue

@@ -2,7 +2,8 @@
   <div class="flex">
     <InputNumber
       placeholder="最小值"
-      :value="getValue.min"
+      :disabled="$props.disabled"
+      :value="getValue.min!"
       style="width: 38%"
       @change="(value) => emitChange(value, 'min')"
     />
@@ -11,7 +12,8 @@
     <span style="width: 8px"></span>
     <InputNumber
       placeholder="最大值"
-      :value="getValue.max"
+      :disabled="$props.disabled"
+      :value="getValue.max!"
       style="width: 38%"
       @change="(value) => emitChange(value, 'max')"
     />
@@ -33,6 +35,7 @@
         min: Nullable<number>;
         max: Nullable<number>;
       };
+      disabled: boolean;
     }>(),
     {
       value: () => ({ min: null, max: null }),

@@ -19,6 +19,7 @@
   const props = withDefaults(
     defineProps<{
       value: ModelOfMatterParams[];
+      disabled: boolean;
     }>(),
     {
       value: () => [],
@@ -82,20 +83,33 @@
         >
           <div>参数名称: {{ item.functionName }}</div>
           <div class="flex">
-            <Button class="!p-0" type="link" @click="handleUpdate(item)">编辑</Button>
+            <Button class="!p-0" type="link" @click="handleUpdate(item)">
+              <span>{{ $props.disabled ? '查看' : '编辑' }}</span>
+            </Button>
             <Divider type="vertical" />
-            <Button class="!p-0" type="link" @click="handleDelete(item)">删除</Button>
+            <Button
+              :disabled="$props.disabled"
+              class="!p-0"
+              type="link"
+              @click="handleDelete(item)"
+            >
+              <span>删除</span>
+            </Button>
           </div>
         </div>
       </section>
-      <div>
+      <div :class="$props.disabled && 'text-gray-400'">
         <span class="mr-2">
           <PlusOutlined />
         </span>
-        <span @click="handleCreateParams">增加参数</span>
+        <span @click="!$props.disabled && handleCreateParams()">增加参数</span>
       </div>
     </div>
-    <StructFormModel @register="registerModal" @submit="handleSaveStruct" />
+    <StructFormModel
+      :disabled="$props.disabled"
+      @register="registerModal"
+      @submit="handleSaveStruct"
+    />
   </section>
 </template>
 

@@ -18,14 +18,17 @@
     mode: OpenModalMode.CREATE,
   });
 
+  const props = defineProps<{ disabled: boolean }>();
+
   const emit = defineEmits(['register', 'submit']);
 
-  const [register, { validate, setFieldsValue }] = useForm({
+  const [register, { validate, setFieldsValue, setProps }] = useForm({
     labelWidth: 100,
     schemas: formSchemas,
     actionColOptions: {
       span: 14,
     },
+    disabled: props.disabled,
     showResetButton: false,
     submitOnReset: false,
     showActionButtonGroup: false,
@@ -46,6 +49,7 @@
 
       setFieldsValue(value);
     }
+    setProps({ disabled: props.disabled });
   });
 
   const handleSubmit = async () => {
@@ -71,6 +75,7 @@
     :width="800"
     @ok="handleSubmit"
     destroy-on-close
+    :show-ok-btn="!$props.disabled"
   >
     <BasicForm @register="register" />
   </BasicModal>

@@ -11,7 +11,7 @@ export enum DataTypeEnum {
   IS_BOOL = 'BOOL',
 }
 
-const validateValueRange = (_rule, value: Record<'min' | 'max', number>, _callback) => {
+export const validateValueRange = (_rule, value: Record<'min' | 'max', number>, _callback) => {
   value = value || {};
   const { min, max } = value;
   if (min >= max) {
@@ -20,7 +20,7 @@ const validateValueRange = (_rule, value: Record<'min' | 'max', number>, _callba
   return Promise.resolve();
 };
 
-const validateJSON = (_rule, value: ModelOfMatterParams[], _callback) => {
+export const validateJSON = (_rule, value: ModelOfMatterParams[], _callback) => {
   if (value.length) {
     return Promise.resolve();
   }
@@ -65,7 +65,15 @@ export const formSchemas: FormSchema[] = [
     defaultValue: 'INT',
     componentProps: {
       placeholder: '请选择数据类型',
-      api: findDictItemByCode,
+      api: async (params: Recordable) => {
+        try {
+          const record = await findDictItemByCode(params);
+          return record.filter((item) => item.itemValue !== 'STRUCT');
+        } catch (error) {
+          console.log(error);
+          return [];
+        }
+      },
       params: {
         dictCode: 'data_type',
       },

-<template>
-  <BasicDrawer
-    v-bind="$attrs"
-    isDetail
-    @register="register"
-    destroyOnClose
-    @close="closeDrawer"
-    :title="deviceDetail.alias || deviceDetail.name"
-    width="80%"
-  >
-    <Tabs v-model:activeKey="activeKey" :size="size">
-      <TabPane key="1" tab="详情">
-        <Detail
-          ref="deviceDetailRef"
-          :deviceDetail="deviceDetail"
-          @open-gateway-device="handleOpenGatewayDevice"
-        />
-      </TabPane>
-      <TabPane key="modelOfMatter" tab="物模型数据">
-        <ModelOfMatter :deviceDetail="deviceDetail" />
-      </TabPane>
-      <!-- <TabPane key="2" tab="实时数据" v-if="deviceDetail?.deviceType !== 'GATEWAY'">
-        <RealTimeData :deviceDetail="deviceDetail" />
-      </TabPane>
-      <TabPane key="7" tab="历史数据" v-if="deviceDetail?.deviceType !== 'GATEWAY'">
-        <HistoryData :deviceDetail="deviceDetail" />
-      </TabPane> -->
-      <TabPane key="5" tab="命令下发" v-if="deviceDetail?.deviceType !== 'SENSOR'">
-        <CommandIssuance :deviceDetail="deviceDetail" />
-      </TabPane>
-      <TabPane key="3" tab="告警"><Alarm :id="deviceDetail.id" /></TabPane>
-      <TabPane key="4" tab="子设备" v-if="deviceDetail?.deviceType === 'GATEWAY'">
-        <ChildDevice
-          :fromId="deviceDetail?.tbDeviceId"
-          @openTbDeviceDetail="handleOpenTbDeviceDetail"
-        />
-      </TabPane>
-      <TabPane key="7" tab="命令下发记录">
-        <CommandRecord :fromId="deviceDetail?.tbDeviceId" />
-      </TabPane>
-      <!-- 网关设备并且场家是TBox -->
-      <TabPane
-        key="6"
-        tab="TBox"
-        v-if="deviceDetail?.deviceType === 'GATEWAY' && deviceDetail?.brand == 'TBox'"
-      >
-        <TBoxDetail :deviceDetail="deviceDetail" />
-      </TabPane>
-      <!-- 网关设备并且是TBox -->
-    </Tabs>
-  </BasicDrawer>
-</template>
-<script lang="ts">
-  import { defineComponent, ref } from 'vue';
-  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
-
-  import { Tabs } from 'ant-design-vue';
-  import Detail from '../tabs/Detail.vue';
-  // import RealTimeData from '../tabs/RealTimeData.vue';
-  import Alarm from '../tabs/Alarm.vue';
-  import ChildDevice from '../tabs/ChildDevice.vue';
-  import TBoxDetail from '../tabs/TBoxDetail.vue';
-  import CommandIssuance from '../tabs/CommandIssuance.vue';
-  import { CommandRecord } from '../tabs/commandRecord/index';
-  import { getDeviceDetail } from '/@/api/device/deviceManager';
-  // import HistoryData from '../tabs/HistoryData.vue';
-  import ModelOfMatter from '../tabs/ModelOfMatter.vue';
-  export default defineComponent({
-    name: 'DeviceModal',
-    components: {
-      BasicDrawer,
-      Tabs,
-      TabPane: Tabs.TabPane,
-      Detail,
-      // RealTimeData,
-      Alarm,
-      ChildDevice,
-      CommandIssuance,
-      TBoxDetail,
-      // HistoryData,
-      ModelOfMatter,
-      CommandRecord,
-    },
-    emits: ['reload', 'register', 'openTbDeviceDetail', 'openGatewayDeviceDetail'],
-    setup(_props, { emit }) {
-      const activeKey = ref('1');
-      const size = ref('small');
-      const deviceDetailRef = ref();
-      const deviceDetail = ref<any>({});
-      const tbDeviceId = ref('');
-      // 详情回显
-      const [register] = useDrawerInner(async (data) => {
-        const { id } = data;
-        // 设备详情
-        const res = await getDeviceDetail(id);
-        deviceDetail.value = res;
-        const { latitude, longitude, address } = res.deviceInfo;
-        if (latitude) {
-          deviceDetailRef.value.initMap(longitude, latitude, address);
-        }
-      });
-      const closeDrawer = () => {
-        activeKey.value = '1';
-      };
-
-      const handleOpenTbDeviceDetail = (data: { id: string; tbDeviceId: string }) => {
-        emit('openTbDeviceDetail', data);
-      };
-
-      const handleOpenGatewayDevice = (data: { gatewayId: string; tbDeviceId: string }) => {
-        emit('openGatewayDeviceDetail', { id: data.gatewayId });
-      };
-
-      return {
-        size,
-        activeKey,
-        register,
-        closeDrawer,
-        deviceDetail,
-        deviceDetailRef,
-        tbDeviceId,
-        handleOpenTbDeviceDetail,
-        handleOpenGatewayDevice,
-      };
-    },
-  });
-</script>
+<template>
+  <BasicDrawer
+    v-bind="$attrs"
+    isDetail
+    @register="register"
+    destroyOnClose
+    @close="closeDrawer"
+    :title="deviceDetail.alias || deviceDetail.name"
+    width="80%"
+  >
+    <Tabs v-model:activeKey="activeKey" :size="size">
+      <TabPane key="1" tab="详情">
+        <Detail
+          ref="deviceDetailRef"
+          :deviceDetail="deviceDetail"
+          @open-gateway-device="handleOpenGatewayDevice"
+        />
+      </TabPane>
+      <TabPane key="modelOfMatter" tab="物模型数据">
+        <ModelOfMatter :deviceDetail="deviceDetail" />
+      </TabPane>
+      <!-- <TabPane key="2" tab="实时数据" v-if="deviceDetail?.deviceType !== 'GATEWAY'">
+        <RealTimeData :deviceDetail="deviceDetail" />
+      </TabPane>
+      <TabPane key="7" tab="历史数据" v-if="deviceDetail?.deviceType !== 'GATEWAY'">
+        <HistoryData :deviceDetail="deviceDetail" />
+      </TabPane> -->
+      <TabPane key="5" tab="命令下发" v-if="deviceDetail?.deviceType !== 'SENSOR'">
+        <CommandIssuance :deviceDetail="deviceDetail" />
+      </TabPane>
+      <TabPane key="3" tab="告警"><Alarm :id="deviceDetail.id" /></TabPane>
+      <TabPane key="4" tab="子设备" v-if="deviceDetail?.deviceType === 'GATEWAY'">
+        <ChildDevice
+          :fromId="deviceDetail?.tbDeviceId"
+          @openTbDeviceDetail="handleOpenTbDeviceDetail"
+        />
+      </TabPane>
+      <TabPane key="7" tab="命令下发记录">
+        <CommandRecord :fromId="deviceDetail?.tbDeviceId" />
+      </TabPane>
+      <!-- 网关设备并且场家是TBox -->
+      <TabPane
+        key="6"
+        tab="TBox"
+        v-if="deviceDetail?.deviceType === 'GATEWAY' && deviceDetail?.brand == 'TBox'"
+      >
+        <TBoxDetail :deviceDetail="deviceDetail" />
+      </TabPane>
+      <!-- 网关设备并且是TBox -->
+
+      <TabPane key="eventManage" tab="事件管理">
+        <EventManage />
+      </TabPane>
+    </Tabs>
+  </BasicDrawer>
+</template>
+<script lang="ts">
+  import { defineComponent, ref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+
+  import { Tabs } from 'ant-design-vue';
+  import Detail from '../tabs/Detail.vue';
+  // import RealTimeData from '../tabs/RealTimeData.vue';
+  import Alarm from '../tabs/Alarm.vue';
+  import ChildDevice from '../tabs/ChildDevice.vue';
+  import TBoxDetail from '../tabs/TBoxDetail.vue';
+  import CommandIssuance from '../tabs/CommandIssuance.vue';
+  import { CommandRecord } from '../tabs/commandRecord/index';
+  import { getDeviceDetail } from '/@/api/device/deviceManager';
+  // import HistoryData from '../tabs/HistoryData.vue';
+  import ModelOfMatter from '../tabs/ModelOfMatter.vue';
+  import EventManage from '../tabs/EventManage/index.vue';
+
+  export default defineComponent({
+    name: 'DeviceModal',
+    components: {
+      BasicDrawer,
+      Tabs,
+      TabPane: Tabs.TabPane,
+      Detail,
+      // RealTimeData,
+      Alarm,
+      ChildDevice,
+      CommandIssuance,
+      TBoxDetail,
+      // HistoryData,
+      ModelOfMatter,
+      CommandRecord,
+      EventManage,
+    },
+    emits: ['reload', 'register', 'openTbDeviceDetail', 'openGatewayDeviceDetail'],
+    setup(_props, { emit }) {
+      const activeKey = ref('1');
+      const size = ref('small');
+      const deviceDetailRef = ref();
+      const deviceDetail = ref<any>({});
+      const tbDeviceId = ref('');
+      // 详情回显
+      const [register] = useDrawerInner(async (data) => {
+        const { id } = data;
+        // 设备详情
+        const res = await getDeviceDetail(id);
+        deviceDetail.value = res;
+        const { latitude, longitude, address } = res.deviceInfo;
+        if (latitude) {
+          deviceDetailRef.value.initMap(longitude, latitude, address);
+        }
+      });
+      const closeDrawer = () => {
+        activeKey.value = '1';
+      };
+
+      const handleOpenTbDeviceDetail = (data: { id: string; tbDeviceId: string }) => {
+        emit('openTbDeviceDetail', data);
+      };
+
+      const handleOpenGatewayDevice = (data: { gatewayId: string; tbDeviceId: string }) => {
+        emit('openGatewayDeviceDetail', { id: data.gatewayId });
+      };
+
+      return {
+        size,
+        activeKey,
+        register,
+        closeDrawer,
+        deviceDetail,
+        deviceDetailRef,
+        tbDeviceId,
+        handleOpenTbDeviceDetail,
+        handleOpenGatewayDevice,
+      };
+    },
+  });
+</script>

+import { findDictItemByCode } from '/@/api/system/dict';
+import { BasicColumn, FormSchema } from '/@/components/Table';
+
+export const columnSchema: BasicColumn[] = [
+  {
+    title: '时间',
+    dataIndex: 'time',
+  },
+  {
+    title: '标识符',
+    dataIndex: 'identifier',
+    helpMessage: ['标识符格式为模块标识符: 功能定义标识符'],
+  },
+  {
+    title: '事件名称',
+    dataIndex: 'eventName',
+  },
+  {
+    title: '事件类型',
+    dataIndex: 'eventType',
+  },
+  {
+    title: '输出参数',
+    dataIndex: 'outputParams',
+    slots: { customRender: 'outputParams' },
+  },
+];
+
+export const formSchemas: FormSchema[] = [
+  {
+    field: 'identifier',
+    label: '标识符',
+    component: 'Input',
+  },
+  {
+    field: 'alarmType',
+    label: '告警类型',
+    component: 'ApiSelect',
+    defaultValue: 'INFO',
+    componentProps: {
+      placeholder: '请选择事件类型',
+      api: findDictItemByCode,
+      params: {
+        dictCode: 'event_type',
+      },
+      labelField: 'itemText',
+      valueField: 'itemValue',
+    },
+  },
+  {
+    field: 'dateRange',
+    label: '时间范围',
+    component: 'RangePicker',
+    colProps: { span: 10 },
+  },
+];

+<script lang="ts" setup>
+  import { BasicTable, useTable } from '/@/components/Table';
+  import { formSchemas, columnSchema } from './config';
+  import { BasicModal, useModal } from '/@/components/Modal';
+  import { Textarea } from 'ant-design-vue';
+  import { ref } from 'vue';
+  import { formatToDateTime } from '/@/utils/dateUtil';
+  import { EyeOutlined } from '@ant-design/icons-vue';
+
+  const outputData = ref<string>();
+
+  const [register] = useTable({
+    columns: columnSchema,
+    size: 'small',
+    showIndexColumn: false,
+    useSearchForm: true,
+    showTableSetting: true,
+    bordered: true,
+    dataSource: [
+      {
+        time: formatToDateTime(new Date()),
+        identifier: '标识符',
+        eventName: '事件名',
+        eventType: '告警',
+        outputParams: { test: 1 },
+      },
+    ],
+    formConfig: {
+      layout: 'inline',
+      baseColProps: { span: 6 },
+      labelWidth: 80,
+      schemas: formSchemas,
+    },
+    handleSearchInfoFn: (params: Recordable) => {
+      // console.log(params);
+      return params;
+    },
+  });
+
+  const [registerModal, { openModal }] = useModal();
+
+  const handleViewDetail = () => {
+    outputData.value = JSON.stringify(
+      {
+        test: '123',
+      },
+      null,
+      2
+    );
+    openModal(true);
+  };
+</script>
+
+<template>
+  <BasicTable class="event-manage-table" @register="register">
+    <template #outputParams>
+      <span class="cursor-pointer text-blue-500" @click="handleViewDetail">
+        <EyeOutlined class="svg:text-blue-500" />
+        <span class="ml-2">详情</span>
+      </span>
+    </template>
+  </BasicTable>
+  <BasicModal title="输出参数" @register="registerModal">
+    <Textarea v-model:value="outputData" :autosize="true" />
+  </BasicModal>
+</template>
+
+<style lang="less" scoped>
+  .event-manage-table {
+    background-color: #f0f2f5;
+  }
+</style>

-<template>
-  <div style="background-color: #f0f2f5">
-    <BasicTable @register="registerTable">
-      <template #recordContent="{ record }">
-        <a-button type="link" class="ml-2" @click="handleRecordContent(record)"> 查看 </a-button>
-      </template>
-      <template #responseContent="{ record }">
-        <div v-if="!record.request?.oneway">
-          <a-button v-if="record?.response === null" type="text" class="ml-2"> 无 </a-button>
-          <a-button v-else type="link" class="ml-2" @click="handleRecordResponseContent(record)">
-            查看
-          </a-button>
-        </div>
-      </template>
-    </BasicTable>
-  </div>
-</template>
-<script lang="ts" setup>
-  import { h } from 'vue';
-  import { configColumns } from './config';
-  import { deviceCommandRecordGetQuery } from '/@/api/device/deviceConfigApi';
-  import { BasicTable, useTable } from '/@/components/Table';
-  import { Modal } from 'ant-design-vue';
-  import { JsonPreview } from '/@/components/CodeEditor';
-
-  const props = defineProps({
-    fromId: {
-      type: String,
-      default: '',
-    },
-  });
-  const [registerTable] = useTable({
-    api: deviceCommandRecordGetQuery,
-    columns: configColumns,
-    beforeFetch: (params) => {
-      return {
-        ...params,
-        tbDeviceId: props.fromId,
-      };
-    },
-    showTableSetting: true,
-    bordered: true,
-    showIndexColumn: false,
-  });
-  const commonModalInfo = (title, value) => {
-    Modal.info({
-      title,
-      width: 600,
-      content: h(JsonPreview, { data: value }),
-    });
-  };
-  const handleRecordContent = (record) => {
-    if (!record?.request?.body?.params) return;
-    //如果是正常格式则返回params，否则输入什么内容则显示什么内容
-    const jsonParams = JSON.parse(record?.request?.body?.params);
-    commonModalInfo('命令下发内容', jsonParams?.params ? jsonParams?.params : jsonParams);
-  };
-  const handleRecordResponseContent = (record) => {
-    const jsonParams = record?.response;
-    commonModalInfo('响应结果', jsonParams);
-  };
-</script>
+<template>
+  <BasicTable class="command-record-table" @register="registerTable">
+    <template #recordContent="{ record }">
+      <a-button type="link" class="ml-2" @click="handleRecordContent(record)"> 查看 </a-button>
+    </template>
+    <template #responseContent="{ record }">
+      <div v-if="!record.request?.oneway">
+        <a-button v-if="record?.response === null" type="text" class="ml-2"> 无 </a-button>
+        <a-button v-else type="link" class="ml-2" @click="handleRecordResponseContent(record)">
+          查看
+        </a-button>
+      </div>
+    </template>
+  </BasicTable>
+</template>
+<script lang="ts" setup>
+  import { h } from 'vue';
+  import { configColumns } from './config';
+  import { deviceCommandRecordGetQuery } from '/@/api/device/deviceConfigApi';
+  import { BasicTable, useTable } from '/@/components/Table';
+  import { Modal } from 'ant-design-vue';
+  import { JsonPreview } from '/@/components/CodeEditor';
+
+  const props = defineProps({
+    fromId: {
+      type: String,
+      default: '',
+    },
+  });
+  const [registerTable] = useTable({
+    api: deviceCommandRecordGetQuery,
+    columns: configColumns,
+    beforeFetch: (params) => {
+      return {
+        ...params,
+        tbDeviceId: props.fromId,
+      };
+    },
+    showTableSetting: true,
+    bordered: true,
+    showIndexColumn: false,
+  });
+  const commonModalInfo = (title, value) => {
+    Modal.info({
+      title,
+      width: 600,
+      content: h(JsonPreview, { data: value }),
+    });
+  };
+  const handleRecordContent = (record) => {
+    if (!record?.request?.body?.params) return;
+    //如果是正常格式则返回params，否则输入什么内容则显示什么内容
+    const jsonParams = JSON.parse(record?.request?.body?.params);
+    commonModalInfo('命令下发内容', jsonParams?.params ? jsonParams?.params : jsonParams);
+  };
+  const handleRecordResponseContent = (record) => {
+    const jsonParams = record?.response;
+    commonModalInfo('响应结果', jsonParams);
+  };
+</script>
+
+<style lang="less" scoped>
+  .command-record-table {
+    background-color: #f0f2f5;
+    padding: 16px;
+  }
+</style>

@@ -27,17 +27,26 @@
           <TabPane :key="FunctionType.SERVICE" :disabled="isTCPGatewaySubDevice" tab="服务" />
           <TabPane :key="FunctionType.EVENTS" tab="事件" :disabled="isTCPGatewaySubDevice" />
         </Tabs>
-        <Attribute v-if="activeKey === FunctionType.PROPERTIES" ref="AttrRef" />
+        <Attribute
+          v-if="activeKey === FunctionType.PROPERTIES"
+          :openModalMode="openModalMode"
+          ref="AttrRef"
+        />
         <Service
           v-if="activeKey === FunctionType.SERVICE"
           :record="$props.record"
+          :openModalMode="openModalMode"
           ref="ServiceRef"
         />
-        <Events v-if="activeKey === FunctionType.EVENTS" ref="EventsRef" />
-        <div
+        <Events
+          v-if="activeKey === FunctionType.EVENTS"
+          :openModalMode="openModalMode"
+          ref="EventsRef"
+        />
+        <!-- <div
           v-if="openModalMode === OpenModelMode.VIEW"
           class="absolute w-full h-full top-0 cursor-not-allowed z-50"
-        ></div>
+        ></div> -->
       </div>
     </BasicModal>
   </div>
@@ -116,6 +125,9 @@
         const title = unref(openModalMode) === OpenModelMode.UPDATE ? '编辑物模型' : '新增物模型';
         setModalProps({ title, showOkBtn: true, showCancelBtn: true });
       }
+      AttrRef.value?.setDisable(unref(openModalMode) === OpenModelMode.VIEW);
+      EventsRef.value?.setDisable(unref(openModalMode) === OpenModelMode.VIEW);
+      ServiceRef.value?.setDisable(unref(openModalMode) === OpenModelMode.VIEW);
     }
   );
 
@@ -153,7 +165,7 @@
       closeModal();
       emit('success');
     } catch (error) {
-      throw Error(error);
+      throw Error(error as string);
     } finally {
       setModalProps({ loading: false, okButtonProps: { loading: false } });
     }

@@ -4,18 +4,20 @@
 <script lang="ts" setup>
   import { BasicForm, useForm } from '/@/components/Form';
   import { DataType, ModelOfMatterParams } from '/@/api/device/model/modelOfMatterModel';
-  import { formSchemas } from '/@/components/Form/src/externalCompns/components/StructForm/config';
   import { StructFormValue } from '/@/components/Form/src/externalCompns/components/StructForm/type';
   import {
     transfromToStructJSON,
     excludeIdInStructJSON,
   } from '/@/components/Form/src/externalCompns/components/StructForm/util';
-  import { FunctionType } from './config';
+  import { FunctionType, attributeSchema } from './config';
   import { isArray } from 'lodash';
+  import { OpenModelMode } from '../types';
 
-  const [register, { validate, resetFields, setFieldsValue }] = useForm({
+  defineProps<{ openModalMode: OpenModelMode }>();
+
+  const [register, { validate, resetFields, setFieldsValue, setProps }] = useForm({
     labelWidth: 100,
-    schemas: formSchemas,
+    schemas: attributeSchema,
     actionColOptions: {
       span: 14,
     },
@@ -24,6 +26,10 @@
     showActionButtonGroup: false,
   });
 
+  const setDisable = (flag: boolean) => {
+    setProps({ disabled: flag });
+  };
+
   async function getFormData(): Promise<Partial<ModelOfMatterParams>> {
     const _values = (await validate()) as StructFormValue;
     if (!_values) return {};
@@ -68,6 +74,7 @@
     resetFormData,
     getFormData,
     setFormData,
+    setDisable,
   });
 </script>
 <style lang="less" scoped></style>

@@ -7,8 +7,11 @@
   import { ModelOfMatterParams, StructJSON } from '/@/api/device/model/modelOfMatterModel';
   import { StructFormValue } from '/@/components/Form/src/externalCompns/components/StructForm/type';
   import { excludeIdInStructJSON } from '/@/components/Form/src/externalCompns/components/StructForm/util';
+  import { OpenModelMode } from '../types';
 
-  const [register, { validate, resetFields, setFieldsValue }] = useForm({
+  defineProps<{ openModalMode: OpenModelMode }>();
+
+  const [register, { validate, resetFields, setFieldsValue, setProps }] = useForm({
     labelWidth: 100,
     schemas: eventSchemas,
     actionColOptions: {
@@ -19,6 +22,10 @@
     showActionButtonGroup: false,
   });
 
+  const setDisable = (flag: boolean) => {
+    setProps({ disabled: flag });
+  };
+
   //回显数据
   const setFormData = (record: ModelOfMatterParams) => {
     const { functionJson = {}, functionName, identifier, remark, eventType } = record;
@@ -69,6 +76,7 @@
     setFormData,
     resetFormData,
     getFormData,
+    setDisable,
   });
 </script>
 <style lang="less" scoped></style>

@@ -9,22 +9,29 @@
   import { ModelOfMatterParams, StructJSON } from '/@/api/device/model/modelOfMatterModel';
   import { DeviceRecord } from '/@/api/device/model/deviceModel';
   import { excludeIdInStructJSON } from '/@/components/Form/src/externalCompns/components/StructForm/util';
+  import { OpenModelMode } from '../types';
 
   const props = defineProps<{
     record: DeviceRecord;
+    openModalMode: OpenModelMode;
   }>();
 
-  const [register, { validate, resetFields, setFieldsValue }] = useForm({
+  const [register, { validate, resetFields, setFieldsValue, setProps }] = useForm({
     labelWidth: 100,
     schemas: serviceSchemas(props.record.transportType === 'TCP'),
     actionColOptions: {
       span: 14,
     },
+    disabled: props.openModalMode === OpenModelMode.VIEW,
     showResetButton: false,
     submitOnReset: false,
     showActionButtonGroup: false,
   });
 
+  const setDisable = (flag: boolean) => {
+    setProps({ disabled: flag });
+  };
+
   //回显数据
   const setFormData = (record: ModelOfMatterParams) => {
     const { functionJson = {}, functionName, identifier, remark, callType } = record;
@@ -98,6 +105,7 @@
     setFormData,
     resetFormData,
     getFormData,
+    setDisable,
   });
 </script>
 <style lang="less" scoped></style>

 import { FormSchema } from '/@/components/Table';
 import { findDictItemByCode } from '/@/api/system/dict';
+import { ModelOfMatterParams } from '/@/api/device/model/modelOfMatterModel';
+
+export const validateValueRange = (_rule, value: Record<'min' | 'max', number>, _callback) => {
+  value = value || {};
+  const { min, max } = value;
+  if (min >= max) {
+    return Promise.reject('最大值小于最小值');
+  }
+  return Promise.resolve();
+};
+
+export const validateJSON = (_rule, value: ModelOfMatterParams[], _callback) => {
+  if (value.length) {
+    return Promise.resolve();
+  }
+  return Promise.reject('JSON对象不能为空');
+};
 
 export enum FormField {
   FUNCTION_NAME = 'functionName',
@@ -358,3 +375,265 @@ export const addParamsSchemas: FormSchema[] = [
     ifShow: ({ values }) => isNumber(values[FormField.TYPE]),
   },
 ];
+
+export const attributeSchema: FormSchema[] = [
+  {
+    field: FormField.FUNCTION_NAME,
+    label: '功能名称',
+    required: true,
+    component: 'Input',
+    colProps: {
+      span: 18,
+    },
+    componentProps: {
+      maxLength: 255,
+      placeholder: '请输入功能名称',
+    },
+  },
+  {
+    field: FormField.IDENTIFIER,
+    label: '标识符',
+    required: true,
+    component: 'Input',
+    colProps: {
+      span: 18,
+    },
+    componentProps: {
+      maxLength: 255,
+      placeholder: '请输入标识符',
+    },
+  },
+  {
+    field: FormField.TYPE,
+    label: '数据类型',
+    required: true,
+    component: 'ApiSelect',
+    colProps: {
+      span: 9,
+    },
+    defaultValue: 'INT',
+    componentProps: {
+      placeholder: '请选择数据类型',
+      api: findDictItemByCode,
+      params: {
+        dictCode: 'data_type',
+      },
+      labelField: 'itemText',
+      valueField: 'itemValue',
+      getPopupContainer: () => document.body,
+    },
+  },
+  {
+    field: FormField.VALUE_RANGE,
+    label: '取值范围',
+    component: 'CustomMinMaxInput',
+    valueField: 'value',
+    changeEvent: 'update:value',
+    colProps: {
+      span: 18,
+    },
+    ifShow: ({ values }) =>
+      values[FormField.TYPE] === DataTypeEnum.IS_NUMBER_INT ||
+      values[FormField.TYPE] === DataTypeEnum.IS_NUMBER_DOUBLE,
+    rules: [{ validator: validateValueRange }],
+  },
+  {
+    field: FormField.STEP,
+    label: '步长',
+    component: 'InputNumber',
+    colProps: {
+      span: 18,
+    },
+    componentProps: {
+      maxLength: 255,
+      placeholder: '请输入步长',
+      min: 1,
+      formatter: (value: number | string) => {
+        return value ? Math.floor(Number(value)) : value;
+      },
+    },
+    ifShow: ({ values }) =>
+      values[FormField.TYPE] === DataTypeEnum.IS_NUMBER_INT ||
+      values[FormField.TYPE] === DataTypeEnum.IS_NUMBER_DOUBLE,
+    dynamicRules: ({ model }) => {
+      const valueRange = model[FormField.VALUE_RANGE] || {};
+      const { min = 0, max = 0 } = valueRange;
+      const step = model[FormField.STEP];
+      return [
+        {
+          validator: () => {
+            if (step > max - min) {
+              return Promise.reject('步长不能大于取值范围的差值');
+            }
+            return Promise.resolve();
+          },
+        },
+      ];
+    },
+  },
+  {
+    field: FormField.UNIT_NAME,
+    label: '单位名称',
+    component: 'Input',
+    show: false,
+  },
+  {
+    field: FormField.UNIT,
+    label: '单位',
+    component: 'ApiSelect',
+    colProps: {
+      span: 9,
+    },
+    componentProps: ({ formActionType }) => {
+      const { setFieldsValue } = formActionType;
+      return {
+        placeholder: '请选择单位',
+        api: async (params) => {
+          const list = await findDictItemByCode(params);
+          list.map((item) => (item.itemText = `${item.itemText} / ${item.itemValue}`));
+          return list;
+        },
+        params: {
+          dictCode: 'attribute_unit',
+        },
+        labelInValue: true,
+        labelField: 'itemText',
+        valueField: 'itemValue',
+        onChange(_, record: Record<'label' | 'value', string>) {
+          if (record) {
+            const { label } = record;
+            setFieldsValue({ [FormField.UNIT_NAME]: label });
+          }
+        },
+        getPopupContainer: () => document.body,
+        showSearch: true,
+        filterOption: (inputValue: string, option: Record<'label' | 'value', string>) => {
+          let { label, value } = option;
+          label = label.toLowerCase();
+          value = value.toLowerCase();
+          inputValue = inputValue.toLowerCase();
+          return label.includes(inputValue) || value.includes(inputValue);
+        },
+      };
+    },
+    ifShow: ({ values }) =>
+      values[FormField.TYPE] === DataTypeEnum.IS_NUMBER_INT ||
+      values[FormField.TYPE] === DataTypeEnum.IS_NUMBER_DOUBLE,
+  },
+  {
+    field: FormField.BOOL_CLOSE,
+    component: 'Input',
+    required: true,
+    label: '0 -',
+    colProps: {
+      span: 18,
+    },
+    componentProps: {
+      placeholder: '如：关',
+    },
+    defaultValue: '关',
+    ifShow: ({ values }) => values[FormField.TYPE] === DataTypeEnum.IS_BOOL,
+    dynamicRules: ({ model }) => {
+      const close = model[FormField.BOOL_CLOSE];
+      const open = model[FormField.BOOL_OPEN];
+      return [
+        {
+          required: true,
+        },
+        {
+          validator() {
+            if (open === close) return Promise.reject('布尔值不能相同');
+            return Promise.resolve();
+          },
+        },
+      ];
+    },
+  },
+  {
+    field: FormField.BOOL_OPEN,
+    component: 'Input',
+    required: true,
+    label: '1 -',
+    colProps: {
+      span: 18,
+    },
+    componentProps: {
+      placeholder: '如：开',
+    },
+    defaultValue: '开',
+    ifShow: ({ values }) => values[FormField.TYPE] === DataTypeEnum.IS_BOOL,
+    dynamicRules: ({ model }) => {
+      const close = model[FormField.BOOL_CLOSE];
+      const open = model[FormField.BOOL_OPEN];
+      return [
+        {
+          required: true,
+        },
+        {
+          validator() {
+            if (open === close) return Promise.reject('布尔值不能相同');
+            return Promise.resolve();
+          },
+        },
+      ];
+    },
+  },
+  {
+    field: FormField.LENGTH,
+    component: 'Input',
+    required: true,
+    label: '数据长度',
+    defaultValue: '10240',
+    colProps: {
+      span: 8,
+    },
+    componentProps: {
+      placeholder: '请输入数据长度',
+    },
+    renderComponentContent: () => {
+      return {
+        suffix: () => '字节',
+      };
+    },
+    ifShow: ({ values }) => values[FormField.TYPE] === DataTypeEnum.IS_STRING,
+  },
+  {
+    field: FormField.ACCESS_MODE,
+    component: 'ApiRadioGroup',
+    label: '读写类型',
+    required: true,
+    colProps: {
+      span: 24,
+    },
+    defaultValue: 'r',
+    componentProps: {
+      placeholder: '请选择读写类型',
+      api: findDictItemByCode,
+      params: {
+        dictCode: 'read_write_type',
+      },
+      labelField: 'itemText',
+      valueField: 'itemValue',
+    },
+  },
+  {
+    field: FormField.SPECS_LIST,
+    label: 'JSON对象',
+    component: 'StructForm',
+    valueField: 'value',
+    changeEvent: 'update:value',
+    colProps: { span: 24 },
+    ifShow: ({ values }) => values[FormField.TYPE] === DataTypeEnum.IS_STRUCT,
+    rules: [{ required: true, validator: validateJSON }],
+  },
+  {
+    field: FormField.REFARK,
+    label: '备注',
+    component: 'InputTextArea',
+    componentProps: {
+      rows: 4,
+      maxLength: 100,
+      placeholder: '请输入描述',
+    },
+  },
+];