fix: 合并解决冲突,冲突文件位置src/views/rule/linkedge/cpns/action.vue

@@ -25,6 +25,7 @@ module.exports = defineConfig({
     'plugin:jest/recommended',
   ],
   rules: {
+    'no-console': 'off',
     'vue/script-setup-uses-vars': 'error',
     '@typescript-eslint/ban-ts-ignore': 'off',
     '@typescript-eslint/explicit-function-return-type': 'off',

@@ -174,8 +174,7 @@
   const handleFilterOption = async (inputValue: string, option: Recordable) => {
     const { filterOption, fetchSearch } = props;
     if (filterOption && isFunction(filterOption)) {
-      filterOption?.(inputValue, option);
-      return;
+      return filterOption?.(inputValue, option);
     }
 
     if (fetchSearch) {
@@ -189,8 +188,9 @@
     @dropdownVisibleChange="handleFetch"
     v-bind="attrs"
     @change="handleChange"
+    @filterOption="handleFilterOption"
     :options="getOptions"
-    :filterOption="handleFilterOption"
+    optionFilterProp="label"
     :showSearch="true"
     v-model:value="state"
     @popup-scroll="debounceHandlePopupScroll"

@@ -3,24 +3,26 @@
     <a-input
       placeholder="请输入参数key"
       v-model:value="param.label"
+      :disabled="disabled"
       style="width: 38%; margin-bottom: 5px"
       @change="emitChange"
     />
     <a-input
       placeholder="请输入参数value"
+      :disabled="disabled"
       v-model:value="param.value"
       style="width: 38%; margin: 0 0 5px 60px"
       @change="emitChange"
     />
     <MinusCircleOutlined
-      v-if="dynamicInput.params.length > min"
+      v-if="dynamicInput.params.length > min && !disabled"
       class="dynamic-delete-button"
       @click="remove(param)"
       style="width: 50px"
     />
   </div>
   <div>
-    <a-button type="dashed" style="width: 38%" @click="add">
+    <a-button :disabled="disabled" type="dashed" style="width: 38%" @click="add">
       <PlusOutlined />
       新增
     </a-button>
@@ -49,11 +51,17 @@
       value: propTypes.object.def({}),
       //自定义删除按钮多少才会显示
       min: propTypes.integer.def(0),
+      disabled: {
+        type: Boolean,
+        default: false,
+      },
     },
     emits: ['change', 'update:value'],
     setup(props, { emit }) {
       //input动态数据
       const dynamicInput: UnwrapRef<{ params: Params[] }> = reactive({ params: [] });
+
+      console.log(dynamicInput, 'dynamicInput');
       //删除Input
       const remove = (item: Params) => {
         let index = dynamicInput.params.indexOf(item);
@@ -63,6 +71,11 @@
         emitChange();
       };
 
+      // const disabled = computed(() => {
+      //   const { disabled } = props || {};
+      //   return disabled;
+      // });
+
       //新增Input
       const add = () => {
         dynamicInput.params.push({
@@ -108,6 +121,7 @@
         emitChange,
         remove,
         add,
+        // disabled,
       };
     },
   });

@@ -37,6 +37,7 @@
   const getBindProps = computed<Recordable>(() => {
     const { value, apiTreeSelectProps = {} } = props;
     const { params = {} } = apiTreeSelectProps;
+    console.log(props, 'props');
     return {
       replaceFields: { children: 'children', key: 'id', title: 'name', value: 'id' },
       getPopupContainer: () => document.body,

@@ -117,7 +117,7 @@
   };
 
   const handleCheckCard = (item: ProfileRecord) => {
-    if (item.default) return;
+    if (item.default || item.name == 'default') return;
     item.checked = !item.checked;
   };
 

@@ -14,7 +14,11 @@
       <!-- 设备选择 -->
       <template #devices="{ model }">
         <span class="hidden">{{ handleChangeOrg(model['organizationId']) }}</span>
-        <SelectDevice ref="selectDeviceRef" :selectOptions="selectOptions" />
+        <SelectDevice
+          ref="selectDeviceRef"
+          :selectOptions="selectOptions"
+          v-model:disabled="deviceDisabled"
+        />
       </template>
     </BasicForm>
   </BasicDrawer>
@@ -82,12 +86,14 @@
     }
   );
 
-  const [registerForm, { validate, resetFields, setFieldsValue, updateSchema }] = useForm({
-    labelWidth: 120,
-    schemas: formSchema,
-    showActionButtonGroup: false,
-    fieldMapToTime: [[SchemaFiled.DATE_RANGE, [SchemaFiled.START_TS, SchemaFiled.END_TS]]],
-  });
+  const [registerForm, { validate, resetFields, setFieldsValue, updateSchema, setProps }] = useForm(
+    {
+      labelWidth: 120,
+      schemas: formSchema,
+      showActionButtonGroup: false,
+      fieldMapToTime: [[SchemaFiled.DATE_RANGE, [SchemaFiled.START_TS, SchemaFiled.END_TS]]],
+    }
+  );
 
   const businessText = ref('');
 
@@ -95,11 +101,27 @@
     data: {},
   });
 
+  const deviceDisabled = ref<boolean>(false);
+
   const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
     try {
       await nextTick();
       handleClose();
       businessText.value = data.text;
+      if (businessText.value == BusinessReportConfigTextEnum.BUSINESS_VIEW_TEXT) {
+        deviceDisabled.value = true;
+        setProps({ disabled: true });
+        updateSchema({
+          field: 'organizationId',
+          componentProps: { apiTreeSelectProps: { disabled: true } },
+        });
+      } else {
+        deviceDisabled.value = false;
+        updateSchema({
+          field: 'organizationId',
+          componentProps: { apiTreeSelectProps: { disabled: false } },
+        });
+      }
       setFieldsValue(setDefaultTime());
       updateSchema(disableCustomWeekly(BusinessExecutewayEnum.BUSINESS_EXECUTEWAY_IMMEDIATE));
       setDrawerProps(setPropsForModal(businessText.value));

@@ -11,6 +11,7 @@
       v-model:value="param.attributes"
       style="width: 38%; margin-left: 1.8vw"
       :options="selectOptions"
+      :disabled="disabled"
       @change="emitChange"
       mode="multiple"
       allowClear
@@ -31,6 +32,10 @@
 
   const props = defineProps({
     value: propTypes.object.def({}),
+    disabled: {
+      type: Boolean,
+      required: false,
+    },
   });
 
   const selectOptions: any = ref([]);

@@ -5,11 +5,17 @@
     style="width: 100%"
     :options="selectOptions"
     @change="handleDeviceChange"
+    :disabled="disabled"
     mode="multiple"
     labelInValue
   />
   <template v-for="(item, index) in deviceList" :key="item.value">
-    <SelectAttributes :ref="bindDeviceRef.deviceAttrRef" :value="item" :index="index" />
+    <SelectAttributes
+      :ref="bindDeviceRef.deviceAttrRef"
+      :value="item"
+      :index="index"
+      :disabled="disabled"
+    />
   </template>
 </template>
 <script lang="ts" setup name="SelectDevice">
@@ -23,6 +29,10 @@
       type: Array as PropType<TSelectOption[]>,
       required: true,
     },
+    disabled: {
+      type: Boolean,
+      required: false,
+    },
   });
 
   const selectValue = ref([]);

@@ -41,7 +41,6 @@
   const [register, { setModalProps, closeModal }] = useModalInner(async (data) => {
     setModalProps({ loading: true });
     const { text, record } = data || {};
-    console.log(data, 'data');
     isUpdate.value = record ? true : false;
     ruleTile.value = text;
     const { name, additionalInfo, debugMode } = record || {};

@@ -31,7 +31,6 @@ export const searchFormSchema: FormSchema[] = [
     field: 'textSearch',
     label: '名称',
     component: 'Input',
-
     colProps: { span: 8 },
     componentProps: {
       placeholder: '请输入名称',

@@ -30,11 +30,6 @@
               icon: 'ant-design:eye-outlined',
               onClick: handleView.bind(null, record),
             },
-            // {
-            //   label: '详情',
-            //   icon: 'ant-design:field-time-outlined',
-            //   onClick: handleDetail.bind(null, record),
-            // },
             {
               label: '编辑',
               icon: 'clarity:note-edit-line',
@@ -103,9 +98,6 @@
   import { useRouter } from 'vue-router';
   import { ref } from 'vue';
   import { isObject } from '/@/utils/is';
-  // import { ChainDetailDrawer } from './chainDetail/index';
-  // import { useDrawer } from '/@/components/Drawer';
-
   const [registerModal, { openModal }] = useModal();
   const { createMessage } = useMessage();
   const { hasPermission } = usePermission();

@@ -4,18 +4,21 @@
       <template #uploadFilesSlot="{ model }">
         <UploadFile
           :url="credentialsFile.caCertFileName"
+          :disabled="disabled"
           @fileUrlEmit="handleFileUrlEmitH"
           v-show="model['type'] === CredentialsEnum.IS_PEM"
         />
         <div class="h-4"></div>
         <UploadFile
           :url="credentialsFile.certFileName"
+          :disabled="disabled"
           @fileUrlEmit="handleFileUrlEmitC"
           v-show="model['type'] === CredentialsEnum.IS_PEM"
         />
         <div class="h-4"></div>
         <UploadFile
           :url="credentialsFile.privateKeyFileName"
+          :disabled="disabled"
           @fileUrlEmit="handleFileUrlEmitB"
           v-show="model['type'] === CredentialsEnum.IS_PEM"
         /> </template
@@ -23,7 +26,7 @@
   </div>
 </template>
 <script lang="ts" setup name="DataFlowMethodIsApi">
-  import { reactive } from 'vue';
+  import { reactive, ref } from 'vue';
   import { BasicForm, useForm } from '/@/components/Form';
   import { modeApiForm } from './config';
   import { modelFormPublicConfig } from '../../../dataflowmodal/config';
@@ -36,10 +39,11 @@
     privateKeyFileName: undefined,
   });
 
-  const [register, { validateFields, setFieldsValue, resetFields }] = useForm({
-    schemas: modeApiForm,
-    ...modelFormPublicConfig,
-  });
+  const [register, { validateFields, setFieldsValue, resetFields, setProps, updateSchema }] =
+    useForm({
+      schemas: modeApiForm,
+      ...modelFormPublicConfig,
+    });
 
   const handleFileUrlEmitH = (fileUrl) => (credentialsFile.caCertFileName = fileUrl);
 
@@ -78,10 +82,24 @@
   };
 
   const resetValue = () => resetFields();
+
+  const disabled = ref<boolean>(false);
+  const setDisabledProps = (value) => {
+    setProps(value);
+    disabled.value = true;
+    updateSchema({ field: 'headers', componentProps: { disabled: false } });
+  };
+
+  const setCancelDisabled = () => {
+    updateSchema({ field: 'headers', componentProps: { disabled: false } });
+  };
+
   defineExpose({
     getValue,
     setValue,
     resetValue,
+    setDisabledProps,
+    setCancelDisabled,
   });
 </script>
 

@@ -29,7 +29,7 @@ class ApiFormPartialConfig {
     return [
       { label: 'Anonymous', value: 'anonymous' },
       { label: 'Basic', value: 'basic' },
-      { label: 'PEM', value: 'pem' },
+      { label: 'PEM', value: 'cert.PEM' },
     ];
   }
 }

@@ -8,7 +8,7 @@
   import { modelKafkaForm } from './config';
   import { modelFormPublicConfig } from '../../../dataflowmodal/config';
 
-  const [register, { validate, setFieldsValue, resetFields }] = useForm({
+  const [register, { validate, setFieldsValue, resetFields, setProps, updateSchema }] = useForm({
     schemas: modelKafkaForm,
     ...modelFormPublicConfig,
   });
@@ -19,13 +19,28 @@
     return values;
   };
 
-  const setValue = (value) => setFieldsValue(value);
+  const setValue = (value) => {
+    setFieldsValue(value);
+  };
+
+  // 禁用表单
+  const setDisabledProps = (value) => {
+    setProps(value);
+    updateSchema({ field: 'otherProperties', componentProps: { disabled: true } });
+  };
+
+  // 取消禁用
+  const setCancelDisabled = () => {
+    updateSchema({ field: 'otherProperties', componentProps: { disabled: false } });
+  };
 
   const resetValue = () => resetFields();
   defineExpose({
     getValue,
     setValue,
     resetValue,
+    setDisabledProps,
+    setCancelDisabled,
   });
 </script>
 

@@ -4,18 +4,21 @@
       <template #uploadFilesSlot="{ model }">
         <UploadFile
           :url="credentialsFile.caCertFileName"
+          :disabled="disabled"
           @fileUrlEmit="handleFileUrlEmitH"
           v-show="model['type'] === CredentialsEnum.IS_PEM"
         />
         <div class="h-4"></div>
         <UploadFile
           :url="credentialsFile.certFileName"
+          :disabled="disabled"
           @fileUrlEmit="handleFileUrlEmitC"
           v-show="model['type'] === CredentialsEnum.IS_PEM"
         />
         <div class="h-4"></div>
         <UploadFile
           :url="credentialsFile.privateKeyFileName"
+          :disabled="disabled"
           @fileUrlEmit="handleFileUrlEmitB"
           v-show="model['type'] === CredentialsEnum.IS_PEM"
         />
@@ -24,7 +27,7 @@
   </div>
 </template>
 <script lang="ts" setup name="DataFlowMethodIsMqtt">
-  import { reactive } from 'vue';
+  import { reactive, ref } from 'vue';
   import { BasicForm, useForm } from '/@/components/Form';
   import { modeMqttForm } from './config';
   import { UploadFile } from '../../../uploadfile';
@@ -37,7 +40,7 @@
     privateKeyFileName: undefined,
   });
 
-  const [register, { validateFields, setFieldsValue, resetFields }] = useForm({
+  const [register, { validateFields, setFieldsValue, resetFields, setProps }] = useForm({
     schemas: modeMqttForm,
     ...modelFormPublicConfig,
   });
@@ -81,11 +84,18 @@
     });
   };
 
+  const disabled = ref<boolean>(false);
+  const setDisabledProps = (value) => {
+    setProps(value);
+    disabled.value = true;
+  };
+
   const resetValue = () => resetFields();
   defineExpose({
     getValue,
     setValue,
     resetValue,
+    setDisabledProps,
   });
 </script>
 

@@ -145,7 +145,6 @@ export const modeMqttForm: FormSchema[] = [
         options: MqttFormPartialConfig.getType(),
         onChange(e) {
           if (e) {
-            console.log('执行');
             setFieldsValue({
               password: undefined,
               username: undefined,

@@ -8,10 +8,11 @@
   import { modeRabbitMqForm } from './config';
   import { modelFormPublicConfig } from '../../../dataflowmodal/config';
 
-  const [register, { validateFields, setFieldsValue, resetFields }] = useForm({
-    schemas: modeRabbitMqForm,
-    ...modelFormPublicConfig,
-  });
+  const [register, { validateFields, setFieldsValue, resetFields, setProps, updateSchema }] =
+    useForm({
+      schemas: modeRabbitMqForm,
+      ...modelFormPublicConfig,
+    });
 
   const getValue = async () => {
     const values = await validateFields();
@@ -22,10 +23,22 @@
   const setValue = (value) => setFieldsValue(value);
 
   const resetValue = () => resetFields();
+
+  const setDisabledProps = (value) => {
+    setProps(value);
+    updateSchema({ field: 'clientProperties', componentProps: { disabled: true } });
+  };
+
+  const setCancelDisabled = () => {
+    updateSchema({ field: 'clientProperties', componentProps: { disabled: false } });
+  };
+
   defineExpose({
     getValue,
     setValue,
     resetValue,
+    setDisabledProps,
+    setCancelDisabled,
   });
 </script>
 <style lang="less" scoped></style>

@@ -25,7 +25,7 @@
 
   const emit = defineEmits(['currentDataFlowMethodEmitNext']);
 
-  const [register, { validateFields, setFieldsValue, resetFields }] = useForm({
+  const [register, { validateFields, setFieldsValue, resetFields, setProps }] = useForm({
     schemas: modeForm(props.saveContent),
     ...modelFormPublicConfig,
   });
@@ -66,6 +66,7 @@
     getValue,
     setValue,
     resetValue,
+    setProps,
   });
 </script>
 <style lang="less" scoped>

@@ -74,6 +74,9 @@
     resetValue();
     const { text, record } = data;
     businessText.value = text;
+    if (businessText.value == BusinessDataFlowTextEnum.BUSINESS_MODAL_VIEW_TEXT) {
+      dataFlowMethodRef.value?.setProps({ disabled: true });
+    }
     restData.data = record;
     setModalProps(modalProps(businessText.value));
     if (!record) return;
@@ -161,6 +164,12 @@
 
   //下一步
   const handleNextDataFlowParams = async (value) => {
+    //判断是否是查看 查看禁用表单
+    if (businessText.value == BusinessDataFlowTextEnum.BUSINESS_MODAL_VIEW_TEXT) {
+      dataFlowParamsRef.value?.setProps();
+    } else {
+      dataFlowParamsRef.value?.setCancelDisabled();
+    }
     value
       .then(async (res) => {
         currentStep.value = 1;

@@ -104,10 +104,35 @@
     if (!findDateFlow) return;
     findDateFlow[3](0);
   };
+
+  const setProps = async () => {
+    await nextTick();
+    props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_KAFKA &&
+      dataFlowMethodIsKafkaRef.value?.setDisabledProps({ disabled: true });
+    props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_MQTT &&
+      dataFlowMethodIsMqttRef.value?.setDisabledProps({ disabled: true });
+    props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_RABBITMQ &&
+      dataFlowMethodIsRabbitMqRef.value?.setDisabledProps({ disabled: true });
+    props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_REST_API &&
+      dataFlowMethodIsApiRef.value?.setDisabledProps({ disabled: true });
+  };
+
+  const setCancelDisabled = async () => {
+    await nextTick();
+    props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_KAFKA &&
+      dataFlowMethodIsKafkaRef.value?.setCancelDisabled();
+    props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_RABBITMQ &&
+      dataFlowMethodIsRabbitMqRef.value?.setCancelDisabled();
+    props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_REST_API &&
+      dataFlowMethodIsApiRef.value?.setCancelDisabled();
+  };
+
   defineExpose({
     getValue,
     setValue,
     resetValue,
+    setCancelDisabled,
+    setProps,
   });
 </script>
 <style lang="less" scoped>

@@ -3,6 +3,7 @@
     <a-upload-dragger
       v-model:fileList="fileList.list"
       name="file"
+      :disabled="disabled"
       :multiple="false"
       @change="handleChange($event)"
       :before-upload="() => false"
@@ -37,6 +38,10 @@
       type: String,
       default: '',
     },
+    disabled: {
+      type: Boolean,
+      default: false,
+    },
   });
 
   const emit = defineEmits(['fileUrlEmit']);

@@ -13,6 +13,9 @@ import { EntryCategoryComponentEnum } from '../enum/category';
 
 const ignoreNodeKeys: string[] = [EntryCategoryComponentEnum.INPUT];
 
+export const SOURCE_HANDLE = '__handle-right';
+export const TARGET_HANDLE = '__handle-left';
+
 export function useBasicDataTransform() {
   const nodeConfigMap = new Map<string, NodeData>();
 
@@ -21,7 +24,7 @@ export function useBasicDataTransform() {
       const category = allComponents[key as RuleNodeTypeEnum];
       for (const nodeConfig of category.components) {
         const { clazz } = nodeConfig;
-        nodeConfigMap.set(clazz, { config: nodeConfig, category: category.category });
+        nodeConfigMap.set(clazz, { config: nodeConfig, categoryConfig: category.category });
       }
     }
   }
@@ -49,8 +52,7 @@ export function useBasicDataTransform() {
     const { connections, nodes, firstNodeIndex } = unref(ruleChain);
     const indexMap = new Map<number, BasicNodeBindData>();
     const groupByConnections = new Map<string, string[]>();
-    const SOURCE_HANDLE = '__handle-right';
-    const TARGET_HANDLE = '__handle-left';
+
     const SEPARATOR = ',';
     const edges: Elements = [];
     const { getAddedgesParams } = useAddEdges();
@@ -207,6 +209,8 @@ export function useBasicDataTransform() {
   function getNodes(nodesRef: Ref<GraphNode[]> | GraphNode[], removeId: boolean) {
     const nodes: BasicNodeBindData[] = [];
 
+    let offsetX = 0;
+    let offsetY = 0;
     for (const node of unref(nodesRef)) {
       const nodeData = node.data as NodeData;
 
@@ -214,16 +218,31 @@ export function useBasicDataTransform() {
 
       const data = nodeData.data;
 
-      nodes.push(
-        Object.assign(
-          mergeData(data, nodeData, node),
-          nodeData.created && !removeId
-            ? ({
-                id: { id: node.id, entityType: RuleChainEntityType.RULE_NODE },
-              } as BasicNodeBindData)
-            : {}
-        )
+      const resultNode = Object.assign(
+        mergeData(data, nodeData, node),
+        nodeData.created && !removeId
+          ? ({
+              id: { id: node.id, entityType: RuleChainEntityType.RULE_NODE },
+            } as BasicNodeBindData)
+          : {}
       );
+
+      if (resultNode.additionalInfo.layoutX < offsetX) offsetX = resultNode.additionalInfo.layoutX;
+      if (resultNode.additionalInfo.layoutY < offsetY) offsetY = resultNode.additionalInfo.layoutY;
+
+      nodes.push(resultNode);
+    }
+
+    /**
+     * compatible thingsboard rule chain designer.
+     * thingsboard rule chain designer does not have negative coordinated.
+     */
+    if (offsetX < 0 || offsetY < 0) {
+      nodes.forEach((node) => {
+        const { layoutX = 0, layoutY = 0 } = node.additionalInfo || {};
+        node.additionalInfo!.layoutX = layoutX + Math.abs(offsetX);
+        node.additionalInfo!.layoutY = layoutY + Math.abs(offsetY);
+      });
     }
 
     return nodes;
@@ -266,9 +285,22 @@ export function useBasicDataTransform() {
     nodes: Ref<GraphNode[]> | GraphNode[] = [],
     edges: Ref<GraphEdge[]> | GraphEdge[] = []
   ) {
+    let flag = true;
+
+    if (unref(nodes).length <= 1) flag = false;
+
     const rootNode: GraphNode[] = [];
 
-    let flag = true;
+    for (const edge of unref(edges)) {
+      if (!unref(nodes).find((node) => node.id === edge.source)) rootNode.push(edge.targetNode);
+    }
+
+    for (const node of unref(nodes)) {
+      if (!unref(edges).some((edge) => edge.target === node.id)) rootNode.push(node);
+    }
+
+    if (rootNode.length > 1) return { flag: false, firstNode: null };
+
     for (const node of unref(nodes)) {
       const list = unref(edges).filter(
         (edge) => edge.source === node.id || edge.target === node.id
@@ -278,14 +310,6 @@ export function useBasicDataTransform() {
         flag = false;
         break;
       }
-
-      if (!list.filter((edge) => edge.target === node.id).length) {
-        if (!rootNode.length) rootNode.push(node);
-        else {
-          flag = false;
-          break;
-        }
-      }
     }
 
     return { flag, firstNode: rootNode[0] || null };

@@ -5,7 +5,7 @@ import { useAddNodes } from './useAddNodes';
 import { buildUUID } from '/@/utils/uuid';
 import { Ref, toRaw, unref } from 'vue';
 import { useSaveAndRedo } from './useSaveAndRedo';
-import { isUnDef } from '/@/utils/is';
+import { isNullOrUnDef, isUnDef } from '/@/utils/is';
 import { useAddEdges } from './useAddEdges';
 import { EdgeData } from '../types/node';
 import { CreateNodeModal } from '../src/components/CreateNodeModal';
@@ -13,9 +13,11 @@ import { CreateEdgeModal } from '../src/components/CreateEdgeModal';
 import { UpdateNodeDrawer } from '../src/components/UpdateNodeDrawer';
 import { UpdateEdgeDrawer } from '../src/components/UpdateEdgeDrawer';
 import { CreateRuleChainModal } from '../src/components/CreateRuleChainModal';
-import { useBasicDataTransform } from './useBasicDataTransform';
+import { SOURCE_HANDLE, TARGET_HANDLE, useBasicDataTransform } from './useBasicDataTransform';
 import { cloneDeep } from 'lodash-es';
 import { useNewNode } from './useNewNode';
+import { RuleChainDetail } from '../types/ruleNode';
+import { saveRuleChainData, saveRuleChainDetail } from '/@/api/ruleDesigner';
 
 interface HandleContextMenuActionParamsType {
   menuType: RuleContextMenuEnum;
@@ -47,11 +49,15 @@ export function transformToRuleChain(
   const outputEdges = unref(edgesRef).filter((edge) => !nodeMap.has(edge.target));
   const outputEdgesId = outputEdges.map((edge) => edge.id);
 
+  const inputEdges = unref(edgesRef).filter((edge) => !nodeMap.has(edge.source));
+  const inputEdgesId = inputEdges.map((edge) => edge.id);
+
   const { getOutputNodeConfig } = useNewNode();
   const outputNode = outputEdges.map((edge) => {
     const id = buildUUID();
     const name = (edge.data as EdgeData).data?.type?.join(' / ') || '';
     edge.target = id;
+    edge.targetHandle = `${id}${TARGET_HANDLE}`;
     return getOutputNodeConfig(name, edge.targetNode.position, id);
   });
 
@@ -61,9 +67,9 @@ export function transformToRuleChain(
 
   const { firstNode } = validateCanCreateRuleChain(nodesRef, edgesRef);
 
-  const firstNodeIndex = nodesRef.findIndex((node) => node.id === firstNode.id);
+  const firstNodeIndex = nodesRef.findIndex((node) => node.id === firstNode?.id);
 
-  return { connections, nodes, firstNodeIndex, outputEdgesId };
+  return { connections, nodes, firstNodeIndex, outputEdgesId, inputEdgesId };
 }
 
 export const NODE_WIDTH = 176;
@@ -87,20 +93,13 @@ function getElementsCenter(nodes: Ref<GraphNode[]> | GraphNode[] = []) {
       continue;
     }
 
-    if (x < leftTopX!) {
-      leftTopX = x;
-      if (y < leftTopY!) {
-        leftTopY = y;
-      }
-      continue;
-    }
+    if (x < leftTopX!) leftTopX = x;
 
-    if (x + NODE_WIDTH > rightBottomX!) {
-      rightBottomX = x + NODE_WIDTH;
-      if (y + NODE_HEIGHT > rightBottomY!) {
-        rightBottomY = y + NODE_HEIGHT;
-      }
-    }
+    if (y < leftTopY!) leftTopY = y;
+
+    if (x + NODE_WIDTH > rightBottomX!) rightBottomX = x + NODE_WIDTH;
+
+    if (y + NODE_HEIGHT > rightBottomY!) rightBottomY = y + NODE_HEIGHT;
   }
 
   return {
@@ -109,6 +108,60 @@ function getElementsCenter(nodes: Ref<GraphNode[]> | GraphNode[] = []) {
   };
 }
 
+function createRuleChainNode({
+  originX,
+  originY,
+  outputEdges,
+  inputEdges,
+  ruleChainDetail,
+}: {
+  originX: number;
+  originY: number;
+  ruleChainDetail: RuleChainDetail;
+  outputEdges: Ref<(GraphEdge | undefined)[]> | (GraphEdge | undefined)[];
+  inputEdges: Ref<(GraphEdge | undefined)[]> | (GraphEdge | undefined)[];
+}) {
+  const { getRuleChainNodeConfig } = useNewNode();
+  const { getAddedgesParams } = useAddEdges();
+  const nodeId = buildUUID();
+
+  const ruleChainNode = getRuleChainNodeConfig({
+    name: ruleChainDetail.name,
+    position: { x: originX - NODE_WIDTH / 2, y: originY - NODE_HEIGHT / 2 },
+    ruleChainId: ruleChainDetail.id.id,
+    id: nodeId,
+  });
+
+  const newInputEdges = unref(inputEdges).map((edge) =>
+    getAddedgesParams(
+      {
+        source: edge!.source,
+        target: nodeId,
+        sourceHandle: `${edge?.source}${SOURCE_HANDLE}`,
+        targetHandle: `${nodeId}${TARGET_HANDLE}`,
+      },
+      toRaw(unref(edge!.data as EdgeData).data)
+    )
+  );
+
+  const newOutputEdges = unref(outputEdges).map((edge) =>
+    getAddedgesParams(
+      {
+        source: nodeId,
+        target: edge!.target,
+        sourceHandle: `${nodeId}${SOURCE_HANDLE}`,
+        targetHandle: `${edge?.target}${TARGET_HANDLE}`,
+      },
+      toRaw(unref(edge!.data as EdgeData).data)
+    )
+  );
+
+  return {
+    nodes: [ruleChainNode],
+    edges: [...newInputEdges, ...newOutputEdges],
+  };
+}
+
 export function useContextMenuAction() {
   const copy = (params: HandleContextMenuActionParamsType) => {
     const { node } = params;
@@ -248,35 +301,51 @@ export function useContextMenuAction() {
     useSaveAndRedoActionType?.handleRedoChange(flowActionType!);
   };
 
-  const createRuleChain = async (_params: HandleContextMenuActionParamsType) => {
-    // const { useSaveAndRedoActionType, modalActionType, flowActionType } = params;
-    // const { createRuleChainModalActionType } = modalActionType;
-    // const result = (await unref(createRuleChainModalActionType)?.openCreateRuleChainModal()) as {
-    //   name: string;
-    //   additionalInfo: { description: string };
-    // };
-    // const ruleChainDetail = await saveRuleChainDetail(
-    //   Object.assign(result, { debugger: false, type: 'CORE' }) as Partial<RuleChainDetail>
-    // );
-    // const selectedNodes = unref(flowActionType?.getSelectedNodes);
-    // const selectedEdges = unref(flowActionType?.getSelectedEdges);
-    // const { firstNodeIndex, connections, nodes, outputEdgesId } = transformToRuleChain(
-    //   selectedNodes,
-    //   selectedEdges
-    // );
-    // await saveRuleChainData({
-    //   firstNodeIndex,
-    //   connections,
-    //   nodes,
-    //   ruleChainId: ruleChainDetail.id,
-    // });
-    // const outputEdges = outputEdgesId.map((id) => flowActionType?.findEdge(id));
-    // console.log(getElementsCenter(unref(selectedNodes)));
-    // const { originX, originY } = getElementsCenter(unref(selectedNodes));
-    // const {} = useNewNode();
-    // flowActionType?.removeNodes(selectedNodes || []);
-    // flowActionType?.removeEdges(selectedEdges || []);
-    // useSaveAndRedoActionType?.triggerChange();
+  const createRuleChain = async (params: HandleContextMenuActionParamsType) => {
+    const { useSaveAndRedoActionType, modalActionType, flowActionType } = params;
+    const { createRuleChainModalActionType } = modalActionType;
+    const result = (await unref(createRuleChainModalActionType)?.openCreateRuleChainModal()) as {
+      name: string;
+      additionalInfo: { description: string };
+    };
+
+    const ruleChainDetail = await saveRuleChainDetail(
+      Object.assign(result, { debugger: false, type: 'CORE' }) as Partial<RuleChainDetail>
+    );
+
+    const selectedNodes = unref(flowActionType?.getSelectedNodes);
+    const selectedEdges = unref(flowActionType?.getSelectedEdges);
+    const { firstNodeIndex, connections, nodes, outputEdgesId, inputEdgesId } =
+      transformToRuleChain(selectedNodes, selectedEdges);
+
+    await saveRuleChainData({
+      firstNodeIndex,
+      connections: connections.filter(
+        (connection) => !isNullOrUnDef(connection.fromIndex) && !isNullOrUnDef(connection.toIndex)
+      ),
+      nodes,
+      ruleChainId: ruleChainDetail.id,
+    });
+
+    const outputEdges = outputEdgesId.map((id) => flowActionType?.findEdge(id));
+    const inputEdges = inputEdgesId.map((id) => flowActionType?.findEdge(id));
+
+    const { originX, originY } = getElementsCenter(unref(selectedNodes));
+
+    flowActionType?.removeNodes(selectedNodes || []);
+    flowActionType?.removeEdges(selectedEdges || []);
+
+    const { nodes: newNode, edges: newEdges } = createRuleChainNode({
+      originX,
+      originY,
+      outputEdges,
+      inputEdges,
+      ruleChainDetail,
+    });
+
+    flowActionType?.addNodes(newNode);
+    flowActionType?.addEdges(newEdges);
+    useSaveAndRedoActionType?.triggerChange();
   };
 
   const handleContextMenuAction = (params: HandleContextMenuActionParamsType) => {

@@ -40,13 +40,23 @@ export function useNewNode() {
     return newNode;
   };
 
-  const getRuleChainNodeConfig = (name: string, position: XYPosition, id?: string) => {
+  const getRuleChainNodeConfig = ({
+    name,
+    position,
+    ruleChainId,
+    id,
+  }: {
+    name: string;
+    position: XYPosition;
+    ruleChainId: string;
+    id?: string;
+  }) => {
     const { getAddNodesParams } = useAddNodes();
     const newNode = getAddNodesParams(
       position,
       {
         ...new RuleChainConfig(),
-        data: { name },
+        data: { name, configuration: { ruleChainId } },
       },
       {
         id,

@@ -65,6 +65,7 @@ export function useRuleFlow(options: UseRuleFlowOptionsType) {
     minZoom: 1,
     panOnScroll: true,
     selectionMode: SelectionMode.Partial,
+
     nodeTypes: {
       [NodeTypeEnum.CUSTOM]: markRaw(BasicNode) as NodeComponent,
     },
@@ -79,14 +80,16 @@ export function useRuleFlow(options: UseRuleFlowOptionsType) {
       y: 0,
     },
     isValidConnection(connection, elements) {
+      if (!elements.targetNode || !elements.sourceNode) return false;
+
       const validateList = [validateInputAndOutput];
       const targetData = elements.targetNode.data as NodeData;
 
       if (
-        targetData.category?.validateConnection &&
-        isFunction(targetData.category.validateConnection)
+        targetData.categoryConfig?.validateConnection &&
+        isFunction(targetData.categoryConfig.validateConnection)
       )
-        validateList.push(targetData.category?.validateConnection);
+        validateList.push(targetData.categoryConfig?.validateConnection);
 
       if (targetData.config?.validateConnection && isFunction(targetData.config.validateConnection))
         validateList.push(targetData.config.validateConnection);

@@ -47,7 +47,6 @@
 
   const setValue: CreateModalDefineExposeType['setFieldsValue'] = (value) => {
     resetFields();
-    console.log(value);
     setFieldsValue({
       ...value,
       ...(value?.[RelatedDeviceAttributeFieldsEnum.DEVICE_RELATIONS_QUERY] || {}),

@@ -14,6 +14,7 @@ export const RuleChainConfig: NodeItemConfigType = {
   clazz: 'org.thingsboard.rule.engine.flow.TbRuleChainInputNode',
   categoryType: RuleNodeTypeEnum.FLOW,
   name: 'rule chain',
+  // backgroundColor: '#d6c4f1',
   configurationDescriptor: {
     nodeDefinition: {
       details:

@@ -14,7 +14,7 @@
   const handleClick = () => {
     const { data } = props.nodeProps?.data || ({} as NodeData);
     const { configuration } = (data || {}) as { configuration: Record<'ruleChainId', string> };
-    if (configuration.ruleChainId) {
+    if (configuration?.ruleChainId) {
       ROUTER.push(`/rule/chain/${configuration.ruleChainId}`);
     }
   };

@@ -36,8 +36,8 @@
 
   const getIcon = computed(() => {
     const { icon } = unref(getNodeDefinition);
-    const { category } = unref(getData);
-    const { icon: categoryIcon } = category || {};
+    const { categoryConfig } = unref(getData);
+    const { icon: categoryIcon } = categoryConfig || {};
     return icon || categoryIcon || 'tabler:circuit-ground';
   });
 
@@ -47,8 +47,8 @@
   });
 
   const getBackgroundColor = computed(() => {
-    const { config, category } = unref(getData);
-    const { backgroundColor: categoryBackgroundColor } = category || {};
+    const { config, categoryConfig } = unref(getData);
+    const { backgroundColor: categoryBackgroundColor } = categoryConfig || {};
     const { backgroundColor } = config || {};
     return backgroundColor || categoryBackgroundColor;
   });
@@ -60,8 +60,8 @@
       <section class="text-dark-900 text-xs">
         <p class="mb-0 font-bold"> {{ getData?.data?.name }} </p>
         <p class="mb-0 mt-2 text-gray-500 italic">
-          {{ getData.category?.title }}
-          {{ getData?.category?.title && getData.config?.name ? '-' : '' }}
+          {{ getData.categoryConfig?.title }}
+          {{ getData?.categoryConfig?.title && getData.config?.name ? '-' : '' }}
           {{ getData.config?.name }}
         </p>
         <p class="mt-1 mb-0 text-gray-500">{{ getData.data?.description }}</p>

@@ -48,7 +48,7 @@
         v-for="config in getCurrentCategoryNode.components"
         :key="config.clazz"
         :config="config"
-        :category="getCurrentCategoryNode.category"
+        :categoryConfig="getCurrentCategoryNode.category"
       />
     </body>
   </section>

@@ -5,7 +5,7 @@
   import { CategoryConfigType, NodeItemConfigType } from '../../../types/node';
 
   const props = defineProps<{
-    category?: CategoryConfigType;
+    categoryConfig?: CategoryConfigType;
     config?: NodeItemConfigType;
   }>();
 
@@ -20,7 +20,7 @@
 
   const getIcon = computed(() => {
     const { icon } = unref(getNodeDefinition);
-    const { icon: categoryIcon } = props.category || {};
+    const { icon: categoryIcon } = props.categoryConfig || {};
     return icon || categoryIcon || 'tabler:circuit-ground';
   });
 
@@ -30,9 +30,9 @@
   });
 
   const getBackgroundColor = computed(() => {
-    const { config, category } = props;
+    const { config, categoryConfig } = props;
     const { backgroundColor } = config || {};
-    const { backgroundColor: categoryBackgroundColor } = category || {};
+    const { backgroundColor: categoryBackgroundColor } = categoryConfig || {};
     return backgroundColor || categoryBackgroundColor;
   });
 
@@ -87,8 +87,8 @@
           {{ config?.name }}
         </span>
       </div>
-      <div class="w-4 h-4 bg-dark-50 rounded-1 border absolute -left-2 border-light-50"></div>
-      <div class="w-4 h-4 bg-dark-50 rounded-1 border absolute -right-2 border-light-50"></div>
+      <div class="w-4 h-4 bg-gray-300 rounded-md border absolute -left-3 border-gray-500"></div>
+      <div class="w-4 h-4 bg-gray-300 rounded-md border absolute -right-3 border-gray-500"></div>
     </main>
   </Tooltip>
 </template>

@@ -64,8 +64,8 @@
 
   const getNodeIcon = computed(() => {
     const { nodeData } = props;
-    const { category, config } = nodeData;
-    const { icon: categoryIcon } = category || {};
+    const { categoryConfig, config } = nodeData;
+    const { icon: categoryIcon } = categoryConfig || {};
     const { configurationDescriptor } = config || {};
     const { nodeDefinition } = configurationDescriptor || {};
     const { icon } = nodeDefinition || {};
@@ -74,8 +74,8 @@
   });
 
   const getTitleBackgroundColor = computed(() => {
-    const { category, config } = props.nodeData;
-    const { backgroundColor: categoryBackgroundColor } = category || {};
+    const { categoryConfig, config } = props.nodeData;
+    const { backgroundColor: categoryBackgroundColor } = categoryConfig || {};
     const { backgroundColor } = config || {};
     return categoryBackgroundColor || backgroundColor;
   });

@@ -90,7 +90,7 @@
     <template #title>
       <h2 class="font-bold text-2xl truncate">{{ nodeData?.data?.name }}</h2>
       <p class="mb-0 text-gray-700">
-        <span> {{ nodeData?.category?.title }}</span>
+        <span> {{ nodeData?.categoryConfig?.title }}</span>
         <span class="mx-1">-</span>
         <span>{{ nodeData?.config?.name }}</span>
       </p>

 .vue-flow__handle {
   width: 16px;
   height: 16px;
+  border-radius: 6px;
+  background-color: #d1d5db;
+  border-color: #6b7280;
+}
+
+.vue-flow__handle:hover{
+  background-color: #000;
 }
 
 .vue-flow__handle-right {
-  right: -8px;
+  right: -12px;
 }
 
 .vue-flow__handle-left {
-  left: -8px; 
+  left: -12px; 
 }
 
 .vue-flow__background.vue-flow__container {

@@ -134,7 +134,7 @@ export interface DragTransferData {
 }
 
 export interface NodeData<T = BasicNodeFormData> {
-  category?: CategoryConfigType;
+  categoryConfig?: CategoryConfigType;
   config?: NodeItemConfigType;
   data?: T;
   created?: boolean;

@@ -153,11 +153,14 @@
   let getActionFormValue = ref([]);
   const editEntryIdData = ref([]);
   const editAlarmConfigData = ref([]);
-  const isUpdate = ref(false);
+  const isUpdate = ref<boolean | number>(false);
   const id = ref(undefined);
   const tenantId = ref(undefined);
   const isView = ref(true);
-  const [registerForm, { resetFields, validate, setFieldsValue, getFieldsValue }] = useForm({
+  const [
+    registerForm,
+    { resetFields, validate, setFieldsValue, getFieldsValue, setProps, updateSchema },
+  ] = useForm({
     labelWidth: 120,
     schemas: formSchema,
     showActionButtonGroup: false,
@@ -532,6 +535,37 @@
       showFooter: unref(isView),
       loading: false,
     });
+
+    if (isUpdate.value == 3) {
+      setProps({ disabled: true });
+      updateSchema({
+        field: 'organizationId',
+        componentProps: { apiTreeSelectProps: { disabled: true } },
+      });
+      await nextTick();
+      unref(skipUnwrap.triggerItemRefs)?.forEach((item) => {
+        item.setDisabledProps({ disabled: true });
+      });
+
+      unref(skipUnwrap.conditionItemRefs)?.forEach((item) => {
+        item.setDisabledProps({ disabled: true });
+      });
+
+      unref(skipUnwrap.actionItemRefs)?.forEach((item) => {
+        item.setDisabledProps({ disabled: true });
+      });
+    } else {
+      updateSchema({
+        field: 'organizationId',
+        componentProps: { apiTreeSelectProps: { disabled: false } },
+      });
+      unref(skipUnwrap.triggerItemRefs)?.forEach((item) => {
+        item.setCancelDisabled();
+      });
+      unref(skipUnwrap.conditionItemRefs)?.forEach((item) => {
+        item.setCancelDisabled();
+      });
+    }
   });
 
   // 设置设备的options

@@ -29,6 +29,7 @@
         <template #operationType="{ model, field }">
           <Select
             :options="options"
+            :disabled="disabled"
             v-model:value="model[field]"
             @change="operationType = model[field]"
             placeholder="请选择比较类型"
@@ -39,6 +40,7 @@
           <Input v-model:value="model[field]" placeholder="请输入持续时间">
             <template #addonAfter>
               <Select
+                :disabled="disabled"
                 v-model:value="model[`timeUnit`]"
                 :options="timeUnitOptions"
                 style="width: 60px"
@@ -58,7 +60,7 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { ref, provide, nextTick } from 'vue';
+  import { ref, provide, nextTick, unref } from 'vue';
   import { CollapseContainer } from '/@/components/Container/index';
   import { BasicForm, useForm } from '/@/components/Form/index';
   import { Card, Select, Input, Tooltip } from 'ant-design-vue';
@@ -86,12 +88,13 @@
   const emit = defineEmits(['delete']);
   const isUpdate = ref(false);
   const conditionScreeningRef = ref();
-  const [registerForm, { resetFields, getFieldsValue, updateSchema, setFieldsValue }] = useForm({
-    //TODO-wenwei-修复
-    schemas: cloneDeep(trigger_condition_schema),
-    //TODO-wenwei-修复
-    showActionButtonGroup: false,
-  });
+  const [registerForm, { resetFields, getFieldsValue, updateSchema, setFieldsValue, setProps }] =
+    useForm({
+      //TODO-wenwei-修复
+      schemas: cloneDeep(trigger_condition_schema),
+      //TODO-wenwei-修复
+      showActionButtonGroup: false,
+    });
 
   const alarmScheduleRef = ref<InstanceType<typeof AlarmSchedule>>();
   const getFieldsValueFunc = () => {
@@ -144,6 +147,7 @@
   const currentIndex = ref(0);
   const [registerModal, { openModal }] = useModal();
   const handleScheduleChange = (value) => {
+    if (unref(disabled)) return;
     const index = scheduleOptions.findIndex((item) => item.value === value);
     // 报警日程弹窗
     if (index !== 0) {
@@ -164,6 +168,16 @@
     currentIndex.value = index;
   };
   const scheduleData = ref(null);
+
+  const disabled = ref<boolean>(false);
+  const setDisabledProps = (value) => {
+    setProps(value);
+    disabled.value = true;
+  };
+
+  const setCancelDisabled = () => {
+    disabled.value = false;
+  };
   defineExpose({
     getFieldsValue,
     updateFieldDeviceId,
@@ -182,6 +196,8 @@
     isUpdate,
     alarmScheduleRef,
     updateFieldAttributeFunc,
+    setDisabledProps,
+    setCancelDisabled,
   });
 </script>
 <style>

@@ -31,8 +31,11 @@
   const emit = defineEmits(['deleteConditionForm']);
   const operationType = inject('operationType');
   let schemas = ref([]);
+  const isViewDisabledBtn = window.localStorage.getItem('isViewDisabledBtn');
   onMounted(() => {
     schemas.value = isType(operationType.value);
+
+    if (isViewDisabledBtn == 'isView') setProps({ disabled: true });
   });
   watch(operationType, (newValue) => {
     schemas.value = isType(newValue);
@@ -47,6 +50,7 @@
       getFieldsValue,
       setFieldsValue,
       validate,
+      setProps,
     },
   ] = useForm({
     showActionButtonGroup: false,
@@ -55,6 +59,7 @@
     schemas,
   });
   const deleteConditionForm = (index: number) => {
+    if (isViewDisabledBtn == 'isView') return;
     emit('deleteConditionForm', index);
   };
   // ft add

@@ -8,7 +8,8 @@
             <template v-for="(item, scheduleIndex) in scheduleOptions" :key="item.label">
               <div
                 :class="{ 'ml-4': scheduleIndex >= 1, active: scheduleIndex === currentIndex }"
-                class="cursor-pointer"
+                class="cursor-pointer !p-0"
+                :disabled="disabled"
                 @click="handleScheduleChange(item.value)"
                 >{{ item.label }}</div
               >
@@ -28,6 +29,7 @@
         <template #operationType="{ model, field }">
           <Select
             :options="options"
+            :disabled="disabled"
             v-model:value="model[field]"
             @change="operationType = model[field]"
             placeholder="请选择比较类型"
@@ -38,6 +40,7 @@
           <Input v-model:value="model[field]" placeholder="请输入持续时间">
             <template #addonAfter>
               <Select
+                :disabled="disabled"
                 v-model:value="model[`timeUnit`]"
                 :options="timeUnitOptions"
                 style="width: 60px"
@@ -71,6 +74,7 @@
   import { Icon } from '/@/components/Icon';
   import { useModal } from '/@/components/Modal';
   import { useMessage } from '/@/hooks/web/useMessage';
+  import { unref } from 'vue';
 
   const { useByProductGetAttribute } = useCommonFun();
   defineProps({
@@ -92,12 +96,13 @@
 
   const isUpdate = ref(false);
   const conditionScreeningRef = ref();
-  const [registerForm, { resetFields, getFieldsValue, updateSchema, setFieldsValue }] = useForm({
-    //TODO-wenwei-修复
-    schemas: cloneDeep(trigger_condition_schema),
-    //TODO-wenwei-修复
-    showActionButtonGroup: false,
-  });
+  const [registerForm, { resetFields, getFieldsValue, updateSchema, setFieldsValue, setProps }] =
+    useForm({
+      //TODO-wenwei-修复
+      schemas: cloneDeep(trigger_condition_schema),
+      //TODO-wenwei-修复
+      showActionButtonGroup: false,
+    });
 
   const alarmScheduleRef = ref<InstanceType<typeof AlarmSchedule>>();
 
@@ -168,6 +173,7 @@
   };
   //TODO-fengtao
   const handleDelete = (params: { index: number; title: string }) => {
+    if (unref(disabled)) return;
     emit('delete', params);
   };
   const operationType = ref<string>('');
@@ -192,6 +198,7 @@
   const [registerModal, { openModal }] = useModal();
   const currentIndex = ref(0);
   const handleScheduleChange = (value) => {
+    if (unref(disabled)) return;
     const index = scheduleOptions.findIndex((item) => item.value === value);
     // 报警日程弹窗
     if (index !== 0) {
@@ -223,6 +230,16 @@
     // console.log(alarmConfigList);
   };
 
+  const disabled = ref<boolean>(false);
+  const setDisabledProps = (value) => {
+    setProps(value);
+    disabled.value = true;
+  };
+
+  const setCancelDisabled = () => {
+    disabled.value = false;
+  };
+
   defineExpose({
     getFieldsValueFunc,
     updateFieldDeviceId,
@@ -240,6 +257,8 @@
     updateFieldAttributeFunc,
     updateFieldAlarmConfig,
     updateEditFieldAlarmConfig,
+    setDisabledProps,
+    setCancelDisabled,
   });
 </script>
 

@@ -13,6 +13,7 @@
     <BasicForm @register="registerAction">
       <template #outTarget="{ model, field }">
         <Select
+          :disabled="disabled"
           :options="options"
           v-model:value="model[field]"
           @change="changeOutTarget"
@@ -24,6 +25,7 @@
       <template #alarmConfigSlot="{ model, field }">
         <a-select
           allowClear
+          :disabled="disabled"
           placeholder="请选择告警配置"
           v-model:value="model[field]"
           style="width: 205px; margin-left: 10px"
@@ -41,14 +43,22 @@
       </template>
       <template #doContext="{ model, field }">
         <div v-if="model['transportType'] === TransportTypeEnum.TCP">
-          <Input v-model:value="model[field]" placeholder="请输入自定义命令" />
+          <Input v-model:value="model[field]" :disabled="disabled" placeholder="请输入自定义命令" />
         </div>
         <div
           v-show="model['transportType'] !== TransportTypeEnum.TCP"
           class="flex"
           style="align-items: center"
         >
-          <div ref="jsoneditorRef" style="height: 100%; width: 100%"></div>
+          <div v-show="!disabled" ref="jsoneditorRef" style="height: 100%; width: 100%"></div>
+
+          <a-textarea
+            v-show="disabled"
+            :disabled="true"
+            :value="JSON.stringify(disabledValue)"
+            :rows="4"
+          />
+
           <a-button style="margin: -5px 0" type="text" @click="handlePremitter">格式化</a-button>
           <Tooltip
             :title="
@@ -64,7 +74,9 @@
         </div>
       </template>
       <template #clearAlarm>
-        <Checkbox v-model:checked="checked" @change="handleCheckedChange"> 清除告警 </Checkbox>
+        <Checkbox v-model:checked="checked" :disabled="disabled" @change="handleCheckedChange">
+          清除告警
+        </Checkbox>
         <Tooltip title="清除告警与触发器一一对应">
           <QuestionCircleOutlined />
         </Tooltip>
@@ -374,6 +386,7 @@
   };
 
   const handleDelete = (actionIndex) => {
+    if (unref(disabled)) return;
     emit('deleteAction', actionIndex);
   };
 
@@ -409,6 +422,8 @@
   const jsoneditorRef = ref();
   const jsonValue = ref({});
   const jsonInstance = ref();
+
+  const disabledValue = ref(); //查看时使用表单全部禁用使用这个来获取表单数据
   onMounted(() => {
     nextTick(() => {
       let options = {
@@ -425,6 +440,7 @@
   const getJsonValue = () => unref(jsonInstance).get();
   const setJsonValue = (Json) => {
     nextTick(() => {
+      disabledValue.value = Json;
       unref(jsonInstance).set(Json);
     });
   };
@@ -452,6 +468,23 @@
     emit('getActionFormArr');
   };
 
+  const disabled = ref<boolean>(false);
+  const setDisabledProps = async (value) => {
+    setProps(value);
+    disabled.value = true;
+    await nextTick();
+    unref(refItem.clearRuleRefs)?.forEach((item) => {
+      item.setDisabledProps(value);
+    });
+  };
+
+  const setCancelDisabled = () => {
+    disabled.value = false;
+    unref(refItem.clearRuleRefs)?.forEach((item) => {
+      item.setCancelDisabled();
+    });
+  };
+
   defineExpose({
     getFieldsValue,
     getFieldsValueFunc,
@@ -472,6 +505,8 @@
     clearRuleList,
     resetConditionForm,
     handleDropdownVisibleChange,
+    setDisabledProps,
+    setCancelDisabled,
   });
 </script>
 

@@ -153,6 +153,7 @@
               title: '是否确认删除操作?',
               onConfirm: handleDelete.bind(null),
             },
+            disabled: !!getRecord.state,
           },
         ]"
       />

@@ -293,12 +293,13 @@ export const commonDataSourceSchemas = (): FormSchema[] => {
                   (item) => item.itemValue == CommandTypeEnum.ATTRIBUTE.toString()
                 );
               }
-
               // TCP网关子 --> 不能要服务命令类型
               if (deviceType == 'SENSOR' && transportType == 'TCP') {
-                return record.filter(
-                  (item) => item.itemValue == CommandTypeEnum.ATTRIBUTE.toString()
-                );
+                return codeType == 'MODBUS_RTU'
+                  ? record.filter((item) => item.itemValue == CommandTypeEnum.ATTRIBUTE.toString())
+                  : codeType == 'CUSTOM'
+                  ? record.filter((item) => item.itemValue == CommandTypeEnum.CUSTOM.toString())
+                  : [];
               }
 
               if (codeType == TaskTypeEnum.MODBUS_RTU) {

@@ -286,6 +286,7 @@ export const useSocket = (dataSourceRef: Ref<WidgetDataType[]>) => {
         throw Error(error as string);
       }
     },
+    autoReconnect: true,
   });
 
   const initSubscribe = () => {