简柏林 / thingskit-front · Commits

Commit 34bfa253bd9a588b5a9924c635746832f32fdbba

Authored by fengwotao
2 parents efa649c5 355a19bb

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

Inline Side-by-side
Showing 43 changed files with 521 additions and 158 deletions
@@ -25,6 +25,7 @@ module.exports = defineConfig({ @@ -25,6 +25,7 @@ module.exports = defineConfig({
25 'plugin:jest/recommended', 25 'plugin:jest/recommended',
26 ], 26 ],
27 rules: { 27 rules: {
  28 + 'no-console': 'off',
28 'vue/script-setup-uses-vars': 'error', 29 'vue/script-setup-uses-vars': 'error',
29 '@typescript-eslint/ban-ts-ignore': 'off', 30 '@typescript-eslint/ban-ts-ignore': 'off',
30 '@typescript-eslint/explicit-function-return-type': 'off', 31 '@typescript-eslint/explicit-function-return-type': 'off',
@@ -174,8 +174,7 @@ @@ -174,8 +174,7 @@
174 const handleFilterOption = async (inputValue: string, option: Recordable) => { 174 const handleFilterOption = async (inputValue: string, option: Recordable) => {
175 const { filterOption, fetchSearch } = props; 175 const { filterOption, fetchSearch } = props;
176 if (filterOption && isFunction(filterOption)) { 176 if (filterOption && isFunction(filterOption)) {
177 - filterOption?.(inputValue, option);  
178 - return; 177 + return filterOption?.(inputValue, option);
179 } 178 }
180 179
181 if (fetchSearch) { 180 if (fetchSearch) {
@@ -189,8 +188,9 @@ @@ -189,8 +188,9 @@
189 @dropdownVisibleChange="handleFetch" 188 @dropdownVisibleChange="handleFetch"
190 v-bind="attrs" 189 v-bind="attrs"
191 @change="handleChange" 190 @change="handleChange"
  191 + @filterOption="handleFilterOption"
192 :options="getOptions" 192 :options="getOptions"
193 - :filterOption="handleFilterOption" 193 + optionFilterProp="label"
194 :showSearch="true" 194 :showSearch="true"
195 v-model:value="state" 195 v-model:value="state"
196 @popup-scroll="debounceHandlePopupScroll" 196 @popup-scroll="debounceHandlePopupScroll"
@@ -3,24 +3,26 @@ @@ -3,24 +3,26 @@
3 <a-input 3 <a-input
4 placeholder="请输入参数key" 4 placeholder="请输入参数key"
5 v-model:value="param.label" 5 v-model:value="param.label"
  6 + :disabled="disabled"
6 style="width: 38%; margin-bottom: 5px" 7 style="width: 38%; margin-bottom: 5px"
7 @change="emitChange" 8 @change="emitChange"
8 /> 9 />
9 <a-input 10 <a-input
10 placeholder="请输入参数value" 11 placeholder="请输入参数value"
  12 + :disabled="disabled"
11 v-model:value="param.value" 13 v-model:value="param.value"
12 style="width: 38%; margin: 0 0 5px 60px" 14 style="width: 38%; margin: 0 0 5px 60px"
13 @change="emitChange" 15 @change="emitChange"
14 /> 16 />
15 <MinusCircleOutlined 17 <MinusCircleOutlined
16 - v-if="dynamicInput.params.length > min" 18 + v-if="dynamicInput.params.length > min && !disabled"
17 class="dynamic-delete-button" 19 class="dynamic-delete-button"
18 @click="remove(param)" 20 @click="remove(param)"
19 style="width: 50px" 21 style="width: 50px"
20 /> 22 />
21 </div> 23 </div>
22 <div> 24 <div>
23 - <a-button type="dashed" style="width: 38%" @click="add"> 25 + <a-button :disabled="disabled" type="dashed" style="width: 38%" @click="add">
24 <PlusOutlined /> 26 <PlusOutlined />
25 新增 27 新增
26 </a-button> 28 </a-button>
@@ -49,11 +51,17 @@ @@ -49,11 +51,17 @@
49 value: propTypes.object.def({}), 51 value: propTypes.object.def({}),
50 //自定义删除按钮多少才会显示 52 //自定义删除按钮多少才会显示
51 min: propTypes.integer.def(0), 53 min: propTypes.integer.def(0),
  54 + disabled: {
  55 + type: Boolean,
  56 + default: false,
  57 + },
52 }, 58 },
53 emits: ['change', 'update:value'], 59 emits: ['change', 'update:value'],
54 setup(props, { emit }) { 60 setup(props, { emit }) {
55 //input动态数据 61 //input动态数据
56 const dynamicInput: UnwrapRef<{ params: Params[] }> = reactive({ params: [] }); 62 const dynamicInput: UnwrapRef<{ params: Params[] }> = reactive({ params: [] });
  63 +
  64 + console.log(dynamicInput, 'dynamicInput');
57 //删除Input 65 //删除Input
58 const remove = (item: Params) => { 66 const remove = (item: Params) => {
59 let index = dynamicInput.params.indexOf(item); 67 let index = dynamicInput.params.indexOf(item);
@@ -63,6 +71,11 @@ @@ -63,6 +71,11 @@
63 emitChange(); 71 emitChange();
64 }; 72 };
65 73
  74 + // const disabled = computed(() => {
  75 + // const { disabled } = props || {};
  76 + // return disabled;
  77 + // });
  78 +
66 //新增Input 79 //新增Input
67 const add = () => { 80 const add = () => {
68 dynamicInput.params.push({ 81 dynamicInput.params.push({
@@ -108,6 +121,7 @@ @@ -108,6 +121,7 @@
108 emitChange, 121 emitChange,
109 remove, 122 remove,
110 add, 123 add,
  124 + // disabled,
111 }; 125 };
112 }, 126 },
113 }); 127 });
@@ -37,6 +37,7 @@ @@ -37,6 +37,7 @@
37 const getBindProps = computed<Recordable>(() => { 37 const getBindProps = computed<Recordable>(() => {
38 const { value, apiTreeSelectProps = {} } = props; 38 const { value, apiTreeSelectProps = {} } = props;
39 const { params = {} } = apiTreeSelectProps; 39 const { params = {} } = apiTreeSelectProps;
  40 + console.log(props, 'props');
40 return { 41 return {
41 replaceFields: { children: 'children', key: 'id', title: 'name', value: 'id' }, 42 replaceFields: { children: 'children', key: 'id', title: 'name', value: 'id' },
42 getPopupContainer: () => document.body, 43 getPopupContainer: () => document.body,
@@ -117,7 +117,7 @@ @@ -117,7 +117,7 @@
117 }; 117 };
118 118
119 const handleCheckCard = (item: ProfileRecord) => { 119 const handleCheckCard = (item: ProfileRecord) => {
120 - if (item.default) return; 120 + if (item.default || item.name == 'default') return;
121 item.checked = !item.checked; 121 item.checked = !item.checked;
122 }; 122 };
123 123
@@ -14,7 +14,11 @@ @@ -14,7 +14,11 @@
14 <!-- 设备选择 --> 14 <!-- 设备选择 -->
15 <template #devices="{ model }"> 15 <template #devices="{ model }">
16 <span class="hidden">{{ handleChangeOrg(model['organizationId']) }}</span> 16 <span class="hidden">{{ handleChangeOrg(model['organizationId']) }}</span>
17 - <SelectDevice ref="selectDeviceRef" :selectOptions="selectOptions" /> 17 + <SelectDevice
  18 + ref="selectDeviceRef"
  19 + :selectOptions="selectOptions"
  20 + v-model:disabled="deviceDisabled"
  21 + />
18 </template> 22 </template>
19 </BasicForm> 23 </BasicForm>
20 </BasicDrawer> 24 </BasicDrawer>
@@ -82,12 +86,14 @@ @@ -82,12 +86,14 @@
82 } 86 }
83 ); 87 );
84 88
85 - const [registerForm, { validate, resetFields, setFieldsValue, updateSchema }] = useForm({  
86 - labelWidth: 120,  
87 - schemas: formSchema,  
88 - showActionButtonGroup: false,  
89 - fieldMapToTime: [[SchemaFiled.DATE_RANGE, [SchemaFiled.START_TS, SchemaFiled.END_TS]]],  
90 - }); 89 + const [registerForm, { validate, resetFields, setFieldsValue, updateSchema, setProps }] = useForm(
  90 + {
  91 + labelWidth: 120,
  92 + schemas: formSchema,
  93 + showActionButtonGroup: false,
  94 + fieldMapToTime: [[SchemaFiled.DATE_RANGE, [SchemaFiled.START_TS, SchemaFiled.END_TS]]],
  95 + }
  96 + );
91 97
92 const businessText = ref(''); 98 const businessText = ref('');
93 99
@@ -95,11 +101,27 @@ @@ -95,11 +101,27 @@
95 data: {}, 101 data: {},
96 }); 102 });
97 103
  104 + const deviceDisabled = ref<boolean>(false);
  105 +
98 const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => { 106 const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
99 try { 107 try {
100 await nextTick(); 108 await nextTick();
101 handleClose(); 109 handleClose();
102 businessText.value = data.text; 110 businessText.value = data.text;
  111 + if (businessText.value == BusinessReportConfigTextEnum.BUSINESS_VIEW_TEXT) {
  112 + deviceDisabled.value = true;
  113 + setProps({ disabled: true });
  114 + updateSchema({
  115 + field: 'organizationId',
  116 + componentProps: { apiTreeSelectProps: { disabled: true } },
  117 + });
  118 + } else {
  119 + deviceDisabled.value = false;
  120 + updateSchema({
  121 + field: 'organizationId',
  122 + componentProps: { apiTreeSelectProps: { disabled: false } },
  123 + });
  124 + }
103 setFieldsValue(setDefaultTime()); 125 setFieldsValue(setDefaultTime());
104 updateSchema(disableCustomWeekly(BusinessExecutewayEnum.BUSINESS_EXECUTEWAY_IMMEDIATE)); 126 updateSchema(disableCustomWeekly(BusinessExecutewayEnum.BUSINESS_EXECUTEWAY_IMMEDIATE));
105 setDrawerProps(setPropsForModal(businessText.value)); 127 setDrawerProps(setPropsForModal(businessText.value));
@@ -11,6 +11,7 @@ @@ -11,6 +11,7 @@
11 v-model:value="param.attributes" 11 v-model:value="param.attributes"
12 style="width: 38%; margin-left: 1.8vw" 12 style="width: 38%; margin-left: 1.8vw"
13 :options="selectOptions" 13 :options="selectOptions"
  14 + :disabled="disabled"
14 @change="emitChange" 15 @change="emitChange"
15 mode="multiple" 16 mode="multiple"
16 allowClear 17 allowClear
@@ -31,6 +32,10 @@ @@ -31,6 +32,10 @@
31 32
32 const props = defineProps({ 33 const props = defineProps({
33 value: propTypes.object.def({}), 34 value: propTypes.object.def({}),
  35 + disabled: {
  36 + type: Boolean,
  37 + required: false,
  38 + },
34 }); 39 });
35 40
36 const selectOptions: any = ref([]); 41 const selectOptions: any = ref([]);
@@ -5,11 +5,17 @@ @@ -5,11 +5,17 @@
5 style="width: 100%" 5 style="width: 100%"
6 :options="selectOptions" 6 :options="selectOptions"
7 @change="handleDeviceChange" 7 @change="handleDeviceChange"
  8 + :disabled="disabled"
8 mode="multiple" 9 mode="multiple"
9 labelInValue 10 labelInValue
10 /> 11 />
11 <template v-for="(item, index) in deviceList" :key="item.value"> 12 <template v-for="(item, index) in deviceList" :key="item.value">
12 - <SelectAttributes :ref="bindDeviceRef.deviceAttrRef" :value="item" :index="index" /> 13 + <SelectAttributes
  14 + :ref="bindDeviceRef.deviceAttrRef"
  15 + :value="item"
  16 + :index="index"
  17 + :disabled="disabled"
  18 + />
13 </template> 19 </template>
14 </template> 20 </template>
15 <script lang="ts" setup name="SelectDevice"> 21 <script lang="ts" setup name="SelectDevice">
@@ -23,6 +29,10 @@ @@ -23,6 +29,10 @@
23 type: Array as PropType<TSelectOption[]>, 29 type: Array as PropType<TSelectOption[]>,
24 required: true, 30 required: true,
25 }, 31 },
  32 + disabled: {
  33 + type: Boolean,
  34 + required: false,
  35 + },
26 }); 36 });
27 37
28 const selectValue = ref([]); 38 const selectValue = ref([]);
@@ -41,7 +41,6 @@ @@ -41,7 +41,6 @@
41 const [register, { setModalProps, closeModal }] = useModalInner(async (data) => { 41 const [register, { setModalProps, closeModal }] = useModalInner(async (data) => {
42 setModalProps({ loading: true }); 42 setModalProps({ loading: true });
43 const { text, record } = data || {}; 43 const { text, record } = data || {};
44 - console.log(data, 'data');  
45 isUpdate.value = record ? true : false; 44 isUpdate.value = record ? true : false;
46 ruleTile.value = text; 45 ruleTile.value = text;
47 const { name, additionalInfo, debugMode } = record || {}; 46 const { name, additionalInfo, debugMode } = record || {};
@@ -31,7 +31,6 @@ export const searchFormSchema: FormSchema[] = [ @@ -31,7 +31,6 @@ export const searchFormSchema: FormSchema[] = [
31 field: 'textSearch', 31 field: 'textSearch',
32 label: '名称', 32 label: '名称',
33 component: 'Input', 33 component: 'Input',
34 -  
35 colProps: { span: 8 }, 34 colProps: { span: 8 },
36 componentProps: { 35 componentProps: {
37 placeholder: '请输入名称', 36 placeholder: '请输入名称',
@@ -30,11 +30,6 @@ @@ -30,11 +30,6 @@
30 icon: 'ant-design:eye-outlined', 30 icon: 'ant-design:eye-outlined',
31 onClick: handleView.bind(null, record), 31 onClick: handleView.bind(null, record),
32 }, 32 },
33 - // {  
34 - // label: '详情',  
35 - // icon: 'ant-design:field-time-outlined',  
36 - // onClick: handleDetail.bind(null, record),  
37 - // },  
38 { 33 {
39 label: '编辑', 34 label: '编辑',
40 icon: 'clarity:note-edit-line', 35 icon: 'clarity:note-edit-line',
@@ -103,9 +98,6 @@ @@ -103,9 +98,6 @@
103 import { useRouter } from 'vue-router'; 98 import { useRouter } from 'vue-router';
104 import { ref } from 'vue'; 99 import { ref } from 'vue';
105 import { isObject } from '/@/utils/is'; 100 import { isObject } from '/@/utils/is';
106 - // import { ChainDetailDrawer } from './chainDetail/index';  
107 - // import { useDrawer } from '/@/components/Drawer';  
108 -  
109 const [registerModal, { openModal }] = useModal(); 101 const [registerModal, { openModal }] = useModal();
110 const { createMessage } = useMessage(); 102 const { createMessage } = useMessage();
111 const { hasPermission } = usePermission(); 103 const { hasPermission } = usePermission();
@@ -4,18 +4,21 @@ @@ -4,18 +4,21 @@
4 <template #uploadFilesSlot="{ model }"> 4 <template #uploadFilesSlot="{ model }">
5 <UploadFile 5 <UploadFile
6 :url="credentialsFile.caCertFileName" 6 :url="credentialsFile.caCertFileName"
  7 + :disabled="disabled"
7 @fileUrlEmit="handleFileUrlEmitH" 8 @fileUrlEmit="handleFileUrlEmitH"
8 v-show="model['type'] === CredentialsEnum.IS_PEM" 9 v-show="model['type'] === CredentialsEnum.IS_PEM"
9 /> 10 />
10 <div class="h-4"></div> 11 <div class="h-4"></div>
11 <UploadFile 12 <UploadFile
12 :url="credentialsFile.certFileName" 13 :url="credentialsFile.certFileName"
  14 + :disabled="disabled"
13 @fileUrlEmit="handleFileUrlEmitC" 15 @fileUrlEmit="handleFileUrlEmitC"
14 v-show="model['type'] === CredentialsEnum.IS_PEM" 16 v-show="model['type'] === CredentialsEnum.IS_PEM"
15 /> 17 />
16 <div class="h-4"></div> 18 <div class="h-4"></div>
17 <UploadFile 19 <UploadFile
18 :url="credentialsFile.privateKeyFileName" 20 :url="credentialsFile.privateKeyFileName"
  21 + :disabled="disabled"
19 @fileUrlEmit="handleFileUrlEmitB" 22 @fileUrlEmit="handleFileUrlEmitB"
20 v-show="model['type'] === CredentialsEnum.IS_PEM" 23 v-show="model['type'] === CredentialsEnum.IS_PEM"
21 /> </template 24 /> </template
@@ -23,7 +26,7 @@ @@ -23,7 +26,7 @@
23 </div> 26 </div>
24 </template> 27 </template>
25 <script lang="ts" setup name="DataFlowMethodIsApi"> 28 <script lang="ts" setup name="DataFlowMethodIsApi">
26 - import { reactive } from 'vue'; 29 + import { reactive, ref } from 'vue';
27 import { BasicForm, useForm } from '/@/components/Form'; 30 import { BasicForm, useForm } from '/@/components/Form';
28 import { modeApiForm } from './config'; 31 import { modeApiForm } from './config';
29 import { modelFormPublicConfig } from '../../../dataflowmodal/config'; 32 import { modelFormPublicConfig } from '../../../dataflowmodal/config';
@@ -36,10 +39,11 @@ @@ -36,10 +39,11 @@
36 privateKeyFileName: undefined, 39 privateKeyFileName: undefined,
37 }); 40 });
38 41
39 - const [register, { validateFields, setFieldsValue, resetFields }] = useForm({  
40 - schemas: modeApiForm,  
41 - ...modelFormPublicConfig,  
42 - }); 42 + const [register, { validateFields, setFieldsValue, resetFields, setProps, updateSchema }] =
  43 + useForm({
  44 + schemas: modeApiForm,
  45 + ...modelFormPublicConfig,
  46 + });
43 47
44 const handleFileUrlEmitH = (fileUrl) => (credentialsFile.caCertFileName = fileUrl); 48 const handleFileUrlEmitH = (fileUrl) => (credentialsFile.caCertFileName = fileUrl);
45 49
@@ -78,10 +82,24 @@ @@ -78,10 +82,24 @@
78 }; 82 };
79 83
80 const resetValue = () => resetFields(); 84 const resetValue = () => resetFields();
  85 +
  86 + const disabled = ref<boolean>(false);
  87 + const setDisabledProps = (value) => {
  88 + setProps(value);
  89 + disabled.value = true;
  90 + updateSchema({ field: 'headers', componentProps: { disabled: false } });
  91 + };
  92 +
  93 + const setCancelDisabled = () => {
  94 + updateSchema({ field: 'headers', componentProps: { disabled: false } });
  95 + };
  96 +
81 defineExpose({ 97 defineExpose({
82 getValue, 98 getValue,
83 setValue, 99 setValue,
84 resetValue, 100 resetValue,
  101 + setDisabledProps,
  102 + setCancelDisabled,
85 }); 103 });
86 </script> 104 </script>
87 105
@@ -29,7 +29,7 @@ class ApiFormPartialConfig { @@ -29,7 +29,7 @@ class ApiFormPartialConfig {
29 return [ 29 return [
30 { label: 'Anonymous', value: 'anonymous' }, 30 { label: 'Anonymous', value: 'anonymous' },
31 { label: 'Basic', value: 'basic' }, 31 { label: 'Basic', value: 'basic' },
32 - { label: 'PEM', value: 'pem' }, 32 + { label: 'PEM', value: 'cert.PEM' },
33 ]; 33 ];
34 } 34 }
35 } 35 }
@@ -8,7 +8,7 @@ @@ -8,7 +8,7 @@
8 import { modelKafkaForm } from './config'; 8 import { modelKafkaForm } from './config';
9 import { modelFormPublicConfig } from '../../../dataflowmodal/config'; 9 import { modelFormPublicConfig } from '../../../dataflowmodal/config';
10 10
11 - const [register, { validate, setFieldsValue, resetFields }] = useForm({ 11 + const [register, { validate, setFieldsValue, resetFields, setProps, updateSchema }] = useForm({
12 schemas: modelKafkaForm, 12 schemas: modelKafkaForm,
13 ...modelFormPublicConfig, 13 ...modelFormPublicConfig,
14 }); 14 });
@@ -19,13 +19,28 @@ @@ -19,13 +19,28 @@
19 return values; 19 return values;
20 }; 20 };
21 21
22 - const setValue = (value) => setFieldsValue(value); 22 + const setValue = (value) => {
  23 + setFieldsValue(value);
  24 + };
  25 +
  26 + // 禁用表单
  27 + const setDisabledProps = (value) => {
  28 + setProps(value);
  29 + updateSchema({ field: 'otherProperties', componentProps: { disabled: true } });
  30 + };
  31 +
  32 + // 取消禁用
  33 + const setCancelDisabled = () => {
  34 + updateSchema({ field: 'otherProperties', componentProps: { disabled: false } });
  35 + };
23 36
24 const resetValue = () => resetFields(); 37 const resetValue = () => resetFields();
25 defineExpose({ 38 defineExpose({
26 getValue, 39 getValue,
27 setValue, 40 setValue,
28 resetValue, 41 resetValue,
  42 + setDisabledProps,
  43 + setCancelDisabled,
29 }); 44 });
30 </script> 45 </script>
31 46
@@ -4,18 +4,21 @@ @@ -4,18 +4,21 @@
4 <template #uploadFilesSlot="{ model }"> 4 <template #uploadFilesSlot="{ model }">
5 <UploadFile 5 <UploadFile
6 :url="credentialsFile.caCertFileName" 6 :url="credentialsFile.caCertFileName"
  7 + :disabled="disabled"
7 @fileUrlEmit="handleFileUrlEmitH" 8 @fileUrlEmit="handleFileUrlEmitH"
8 v-show="model['type'] === CredentialsEnum.IS_PEM" 9 v-show="model['type'] === CredentialsEnum.IS_PEM"
9 /> 10 />
10 <div class="h-4"></div> 11 <div class="h-4"></div>
11 <UploadFile 12 <UploadFile
12 :url="credentialsFile.certFileName" 13 :url="credentialsFile.certFileName"
  14 + :disabled="disabled"
13 @fileUrlEmit="handleFileUrlEmitC" 15 @fileUrlEmit="handleFileUrlEmitC"
14 v-show="model['type'] === CredentialsEnum.IS_PEM" 16 v-show="model['type'] === CredentialsEnum.IS_PEM"
15 /> 17 />
16 <div class="h-4"></div> 18 <div class="h-4"></div>
17 <UploadFile 19 <UploadFile
18 :url="credentialsFile.privateKeyFileName" 20 :url="credentialsFile.privateKeyFileName"
  21 + :disabled="disabled"
19 @fileUrlEmit="handleFileUrlEmitB" 22 @fileUrlEmit="handleFileUrlEmitB"
20 v-show="model['type'] === CredentialsEnum.IS_PEM" 23 v-show="model['type'] === CredentialsEnum.IS_PEM"
21 /> 24 />
@@ -24,7 +27,7 @@ @@ -24,7 +27,7 @@
24 </div> 27 </div>
25 </template> 28 </template>
26 <script lang="ts" setup name="DataFlowMethodIsMqtt"> 29 <script lang="ts" setup name="DataFlowMethodIsMqtt">
27 - import { reactive } from 'vue'; 30 + import { reactive, ref } from 'vue';
28 import { BasicForm, useForm } from '/@/components/Form'; 31 import { BasicForm, useForm } from '/@/components/Form';
29 import { modeMqttForm } from './config'; 32 import { modeMqttForm } from './config';
30 import { UploadFile } from '../../../uploadfile'; 33 import { UploadFile } from '../../../uploadfile';
@@ -37,7 +40,7 @@ @@ -37,7 +40,7 @@
37 privateKeyFileName: undefined, 40 privateKeyFileName: undefined,
38 }); 41 });
39 42
40 - const [register, { validateFields, setFieldsValue, resetFields }] = useForm({ 43 + const [register, { validateFields, setFieldsValue, resetFields, setProps }] = useForm({
41 schemas: modeMqttForm, 44 schemas: modeMqttForm,
42 ...modelFormPublicConfig, 45 ...modelFormPublicConfig,
43 }); 46 });
@@ -81,11 +84,18 @@ @@ -81,11 +84,18 @@
81 }); 84 });
82 }; 85 };
83 86
  87 + const disabled = ref<boolean>(false);
  88 + const setDisabledProps = (value) => {
  89 + setProps(value);
  90 + disabled.value = true;
  91 + };
  92 +
84 const resetValue = () => resetFields(); 93 const resetValue = () => resetFields();
85 defineExpose({ 94 defineExpose({
86 getValue, 95 getValue,
87 setValue, 96 setValue,
88 resetValue, 97 resetValue,
  98 + setDisabledProps,
89 }); 99 });
90 </script> 100 </script>
91 101
@@ -145,7 +145,6 @@ export const modeMqttForm: FormSchema[] = [ @@ -145,7 +145,6 @@ export const modeMqttForm: FormSchema[] = [
145 options: MqttFormPartialConfig.getType(), 145 options: MqttFormPartialConfig.getType(),
146 onChange(e) { 146 onChange(e) {
147 if (e) { 147 if (e) {
148 - console.log('执行');  
149 setFieldsValue({ 148 setFieldsValue({
150 password: undefined, 149 password: undefined,
151 username: undefined, 150 username: undefined,
@@ -8,10 +8,11 @@ @@ -8,10 +8,11 @@
8 import { modeRabbitMqForm } from './config'; 8 import { modeRabbitMqForm } from './config';
9 import { modelFormPublicConfig } from '../../../dataflowmodal/config'; 9 import { modelFormPublicConfig } from '../../../dataflowmodal/config';
10 10
11 - const [register, { validateFields, setFieldsValue, resetFields }] = useForm({  
12 - schemas: modeRabbitMqForm,  
13 - ...modelFormPublicConfig,  
14 - }); 11 + const [register, { validateFields, setFieldsValue, resetFields, setProps, updateSchema }] =
  12 + useForm({
  13 + schemas: modeRabbitMqForm,
  14 + ...modelFormPublicConfig,
  15 + });
15 16
16 const getValue = async () => { 17 const getValue = async () => {
17 const values = await validateFields(); 18 const values = await validateFields();
@@ -22,10 +23,22 @@ @@ -22,10 +23,22 @@
22 const setValue = (value) => setFieldsValue(value); 23 const setValue = (value) => setFieldsValue(value);
23 24
24 const resetValue = () => resetFields(); 25 const resetValue = () => resetFields();
  26 +
  27 + const setDisabledProps = (value) => {
  28 + setProps(value);
  29 + updateSchema({ field: 'clientProperties', componentProps: { disabled: true } });
  30 + };
  31 +
  32 + const setCancelDisabled = () => {
  33 + updateSchema({ field: 'clientProperties', componentProps: { disabled: false } });
  34 + };
  35 +
25 defineExpose({ 36 defineExpose({
26 getValue, 37 getValue,
27 setValue, 38 setValue,
28 resetValue, 39 resetValue,
  40 + setDisabledProps,
  41 + setCancelDisabled,
29 }); 42 });
30 </script> 43 </script>
31 <style lang="less" scoped></style> 44 <style lang="less" scoped></style>
@@ -25,7 +25,7 @@ @@ -25,7 +25,7 @@
25 25
26 const emit = defineEmits(['currentDataFlowMethodEmitNext']); 26 const emit = defineEmits(['currentDataFlowMethodEmitNext']);
27 27
28 - const [register, { validateFields, setFieldsValue, resetFields }] = useForm({ 28 + const [register, { validateFields, setFieldsValue, resetFields, setProps }] = useForm({
29 schemas: modeForm(props.saveContent), 29 schemas: modeForm(props.saveContent),
30 ...modelFormPublicConfig, 30 ...modelFormPublicConfig,
31 }); 31 });
@@ -66,6 +66,7 @@ @@ -66,6 +66,7 @@
66 getValue, 66 getValue,
67 setValue, 67 setValue,
68 resetValue, 68 resetValue,
  69 + setProps,
69 }); 70 });
70 </script> 71 </script>
71 <style lang="less" scoped> 72 <style lang="less" scoped>
@@ -74,6 +74,9 @@ @@ -74,6 +74,9 @@
74 resetValue(); 74 resetValue();
75 const { text, record } = data; 75 const { text, record } = data;
76 businessText.value = text; 76 businessText.value = text;
  77 + if (businessText.value == BusinessDataFlowTextEnum.BUSINESS_MODAL_VIEW_TEXT) {
  78 + dataFlowMethodRef.value?.setProps({ disabled: true });
  79 + }
77 restData.data = record; 80 restData.data = record;
78 setModalProps(modalProps(businessText.value)); 81 setModalProps(modalProps(businessText.value));
79 if (!record) return; 82 if (!record) return;
@@ -161,6 +164,12 @@ @@ -161,6 +164,12 @@
161 164
162 //下一步 165 //下一步
163 const handleNextDataFlowParams = async (value) => { 166 const handleNextDataFlowParams = async (value) => {
  167 + //判断是否是查看 查看禁用表单
  168 + if (businessText.value == BusinessDataFlowTextEnum.BUSINESS_MODAL_VIEW_TEXT) {
  169 + dataFlowParamsRef.value?.setProps();
  170 + } else {
  171 + dataFlowParamsRef.value?.setCancelDisabled();
  172 + }
164 value 173 value
165 .then(async (res) => { 174 .then(async (res) => {
166 currentStep.value = 1; 175 currentStep.value = 1;
@@ -104,10 +104,35 @@ @@ -104,10 +104,35 @@
104 if (!findDateFlow) return; 104 if (!findDateFlow) return;
105 findDateFlow[3](0); 105 findDateFlow[3](0);
106 }; 106 };
  107 +
  108 + const setProps = async () => {
  109 + await nextTick();
  110 + props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_KAFKA &&
  111 + dataFlowMethodIsKafkaRef.value?.setDisabledProps({ disabled: true });
  112 + props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_MQTT &&
  113 + dataFlowMethodIsMqttRef.value?.setDisabledProps({ disabled: true });
  114 + props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_RABBITMQ &&
  115 + dataFlowMethodIsRabbitMqRef.value?.setDisabledProps({ disabled: true });
  116 + props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_REST_API &&
  117 + dataFlowMethodIsApiRef.value?.setDisabledProps({ disabled: true });
  118 + };
  119 +
  120 + const setCancelDisabled = async () => {
  121 + await nextTick();
  122 + props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_KAFKA &&
  123 + dataFlowMethodIsKafkaRef.value?.setCancelDisabled();
  124 + props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_RABBITMQ &&
  125 + dataFlowMethodIsRabbitMqRef.value?.setCancelDisabled();
  126 + props.dataFlowType === BusinessDataFlowMethodEnum.DATAFLOW_METHOD_REST_API &&
  127 + dataFlowMethodIsApiRef.value?.setCancelDisabled();
  128 + };
  129 +
107 defineExpose({ 130 defineExpose({
108 getValue, 131 getValue,
109 setValue, 132 setValue,
110 resetValue, 133 resetValue,
  134 + setCancelDisabled,
  135 + setProps,
111 }); 136 });
112 </script> 137 </script>
113 <style lang="less" scoped> 138 <style lang="less" scoped>
@@ -3,6 +3,7 @@ @@ -3,6 +3,7 @@
3 <a-upload-dragger 3 <a-upload-dragger
4 v-model:fileList="fileList.list" 4 v-model:fileList="fileList.list"
5 name="file" 5 name="file"
  6 + :disabled="disabled"
6 :multiple="false" 7 :multiple="false"
7 @change="handleChange($event)" 8 @change="handleChange($event)"
8 :before-upload="() => false" 9 :before-upload="() => false"
@@ -37,6 +38,10 @@ @@ -37,6 +38,10 @@
37 type: String, 38 type: String,
38 default: '', 39 default: '',
39 }, 40 },
  41 + disabled: {
  42 + type: Boolean,
  43 + default: false,
  44 + },
40 }); 45 });
41 46
42 const emit = defineEmits(['fileUrlEmit']); 47 const emit = defineEmits(['fileUrlEmit']);
@@ -13,6 +13,9 @@ import { EntryCategoryComponentEnum } from '../enum/category'; @@ -13,6 +13,9 @@ import { EntryCategoryComponentEnum } from '../enum/category';
13 13
14 const ignoreNodeKeys: string[] = [EntryCategoryComponentEnum.INPUT]; 14 const ignoreNodeKeys: string[] = [EntryCategoryComponentEnum.INPUT];
15 15
  16 +export const SOURCE_HANDLE = '__handle-right';
  17 +export const TARGET_HANDLE = '__handle-left';
  18 +
16 export function useBasicDataTransform() { 19 export function useBasicDataTransform() {
17 const nodeConfigMap = new Map<string, NodeData>(); 20 const nodeConfigMap = new Map<string, NodeData>();
18 21
@@ -21,7 +24,7 @@ export function useBasicDataTransform() { @@ -21,7 +24,7 @@ export function useBasicDataTransform() {
21 const category = allComponents[key as RuleNodeTypeEnum]; 24 const category = allComponents[key as RuleNodeTypeEnum];
22 for (const nodeConfig of category.components) { 25 for (const nodeConfig of category.components) {
23 const { clazz } = nodeConfig; 26 const { clazz } = nodeConfig;
24 - nodeConfigMap.set(clazz, { config: nodeConfig, category: category.category }); 27 + nodeConfigMap.set(clazz, { config: nodeConfig, categoryConfig: category.category });
25 } 28 }
26 } 29 }
27 } 30 }
@@ -49,8 +52,7 @@ export function useBasicDataTransform() { @@ -49,8 +52,7 @@ export function useBasicDataTransform() {
49 const { connections, nodes, firstNodeIndex } = unref(ruleChain); 52 const { connections, nodes, firstNodeIndex } = unref(ruleChain);
50 const indexMap = new Map<number, BasicNodeBindData>(); 53 const indexMap = new Map<number, BasicNodeBindData>();
51 const groupByConnections = new Map<string, string[]>(); 54 const groupByConnections = new Map<string, string[]>();
52 - const SOURCE_HANDLE = '__handle-right';  
53 - const TARGET_HANDLE = '__handle-left'; 55 +
54 const SEPARATOR = ','; 56 const SEPARATOR = ',';
55 const edges: Elements = []; 57 const edges: Elements = [];
56 const { getAddedgesParams } = useAddEdges(); 58 const { getAddedgesParams } = useAddEdges();
@@ -207,6 +209,8 @@ export function useBasicDataTransform() { @@ -207,6 +209,8 @@ export function useBasicDataTransform() {
207 function getNodes(nodesRef: Ref<GraphNode[]> | GraphNode[], removeId: boolean) { 209 function getNodes(nodesRef: Ref<GraphNode[]> | GraphNode[], removeId: boolean) {
208 const nodes: BasicNodeBindData[] = []; 210 const nodes: BasicNodeBindData[] = [];
209 211
  212 + let offsetX = 0;
  213 + let offsetY = 0;
210 for (const node of unref(nodesRef)) { 214 for (const node of unref(nodesRef)) {
211 const nodeData = node.data as NodeData; 215 const nodeData = node.data as NodeData;
212 216
@@ -214,16 +218,31 @@ export function useBasicDataTransform() { @@ -214,16 +218,31 @@ export function useBasicDataTransform() {
214 218
215 const data = nodeData.data; 219 const data = nodeData.data;
216 220
217 - nodes.push(  
218 - Object.assign(  
219 - mergeData(data, nodeData, node),  
220 - nodeData.created && !removeId  
221 - ? ({  
222 - id: { id: node.id, entityType: RuleChainEntityType.RULE_NODE },  
223 - } as BasicNodeBindData)  
224 - : {}  
225 - ) 221 + const resultNode = Object.assign(
  222 + mergeData(data, nodeData, node),
  223 + nodeData.created && !removeId
  224 + ? ({
  225 + id: { id: node.id, entityType: RuleChainEntityType.RULE_NODE },
  226 + } as BasicNodeBindData)
  227 + : {}
226 ); 228 );
  229 +
  230 + if (resultNode.additionalInfo.layoutX < offsetX) offsetX = resultNode.additionalInfo.layoutX;
  231 + if (resultNode.additionalInfo.layoutY < offsetY) offsetY = resultNode.additionalInfo.layoutY;
  232 +
  233 + nodes.push(resultNode);
  234 + }
  235 +
  236 + /**
  237 + * compatible thingsboard rule chain designer.
  238 + * thingsboard rule chain designer does not have negative coordinated.
  239 + */
  240 + if (offsetX < 0 || offsetY < 0) {
  241 + nodes.forEach((node) => {
  242 + const { layoutX = 0, layoutY = 0 } = node.additionalInfo || {};
  243 + node.additionalInfo!.layoutX = layoutX + Math.abs(offsetX);
  244 + node.additionalInfo!.layoutY = layoutY + Math.abs(offsetY);
  245 + });
227 } 246 }
228 247
229 return nodes; 248 return nodes;
@@ -266,9 +285,22 @@ export function useBasicDataTransform() { @@ -266,9 +285,22 @@ export function useBasicDataTransform() {
266 nodes: Ref<GraphNode[]> | GraphNode[] = [], 285 nodes: Ref<GraphNode[]> | GraphNode[] = [],
267 edges: Ref<GraphEdge[]> | GraphEdge[] = [] 286 edges: Ref<GraphEdge[]> | GraphEdge[] = []
268 ) { 287 ) {
  288 + let flag = true;
  289 +
  290 + if (unref(nodes).length <= 1) flag = false;
  291 +
269 const rootNode: GraphNode[] = []; 292 const rootNode: GraphNode[] = [];
270 293
271 - let flag = true; 294 + for (const edge of unref(edges)) {
  295 + if (!unref(nodes).find((node) => node.id === edge.source)) rootNode.push(edge.targetNode);
  296 + }
  297 +
  298 + for (const node of unref(nodes)) {
  299 + if (!unref(edges).some((edge) => edge.target === node.id)) rootNode.push(node);
  300 + }
  301 +
  302 + if (rootNode.length > 1) return { flag: false, firstNode: null };
  303 +
272 for (const node of unref(nodes)) { 304 for (const node of unref(nodes)) {
273 const list = unref(edges).filter( 305 const list = unref(edges).filter(
274 (edge) => edge.source === node.id || edge.target === node.id 306 (edge) => edge.source === node.id || edge.target === node.id
@@ -278,14 +310,6 @@ export function useBasicDataTransform() { @@ -278,14 +310,6 @@ export function useBasicDataTransform() {
278 flag = false; 310 flag = false;
279 break; 311 break;
280 } 312 }
281 -  
282 - if (!list.filter((edge) => edge.target === node.id).length) {  
283 - if (!rootNode.length) rootNode.push(node);  
284 - else {  
285 - flag = false;  
286 - break;  
287 - }  
288 - }  
289 } 313 }
290 314
291 return { flag, firstNode: rootNode[0] || null }; 315 return { flag, firstNode: rootNode[0] || null };
@@ -5,7 +5,7 @@ import { useAddNodes } from './useAddNodes'; @@ -5,7 +5,7 @@ import { useAddNodes } from './useAddNodes';
5 import { buildUUID } from '/@/utils/uuid'; 5 import { buildUUID } from '/@/utils/uuid';
6 import { Ref, toRaw, unref } from 'vue'; 6 import { Ref, toRaw, unref } from 'vue';
7 import { useSaveAndRedo } from './useSaveAndRedo'; 7 import { useSaveAndRedo } from './useSaveAndRedo';
8 -import { isUnDef } from '/@/utils/is'; 8 +import { isNullOrUnDef, isUnDef } from '/@/utils/is';
9 import { useAddEdges } from './useAddEdges'; 9 import { useAddEdges } from './useAddEdges';
10 import { EdgeData } from '../types/node'; 10 import { EdgeData } from '../types/node';
11 import { CreateNodeModal } from '../src/components/CreateNodeModal'; 11 import { CreateNodeModal } from '../src/components/CreateNodeModal';
@@ -13,9 +13,11 @@ import { CreateEdgeModal } from '../src/components/CreateEdgeModal'; @@ -13,9 +13,11 @@ import { CreateEdgeModal } from '../src/components/CreateEdgeModal';
13 import { UpdateNodeDrawer } from '../src/components/UpdateNodeDrawer'; 13 import { UpdateNodeDrawer } from '../src/components/UpdateNodeDrawer';
14 import { UpdateEdgeDrawer } from '../src/components/UpdateEdgeDrawer'; 14 import { UpdateEdgeDrawer } from '../src/components/UpdateEdgeDrawer';
15 import { CreateRuleChainModal } from '../src/components/CreateRuleChainModal'; 15 import { CreateRuleChainModal } from '../src/components/CreateRuleChainModal';
16 -import { useBasicDataTransform } from './useBasicDataTransform'; 16 +import { SOURCE_HANDLE, TARGET_HANDLE, useBasicDataTransform } from './useBasicDataTransform';
17 import { cloneDeep } from 'lodash-es'; 17 import { cloneDeep } from 'lodash-es';
18 import { useNewNode } from './useNewNode'; 18 import { useNewNode } from './useNewNode';
  19 +import { RuleChainDetail } from '../types/ruleNode';
  20 +import { saveRuleChainData, saveRuleChainDetail } from '/@/api/ruleDesigner';
19 21
20 interface HandleContextMenuActionParamsType { 22 interface HandleContextMenuActionParamsType {
21 menuType: RuleContextMenuEnum; 23 menuType: RuleContextMenuEnum;
@@ -47,11 +49,15 @@ export function transformToRuleChain( @@ -47,11 +49,15 @@ export function transformToRuleChain(
47 const outputEdges = unref(edgesRef).filter((edge) => !nodeMap.has(edge.target)); 49 const outputEdges = unref(edgesRef).filter((edge) => !nodeMap.has(edge.target));
48 const outputEdgesId = outputEdges.map((edge) => edge.id); 50 const outputEdgesId = outputEdges.map((edge) => edge.id);
49 51
  52 + const inputEdges = unref(edgesRef).filter((edge) => !nodeMap.has(edge.source));
  53 + const inputEdgesId = inputEdges.map((edge) => edge.id);
  54 +
50 const { getOutputNodeConfig } = useNewNode(); 55 const { getOutputNodeConfig } = useNewNode();
51 const outputNode = outputEdges.map((edge) => { 56 const outputNode = outputEdges.map((edge) => {
52 const id = buildUUID(); 57 const id = buildUUID();
53 const name = (edge.data as EdgeData).data?.type?.join(' / ') || ''; 58 const name = (edge.data as EdgeData).data?.type?.join(' / ') || '';
54 edge.target = id; 59 edge.target = id;
  60 + edge.targetHandle = `${id}${TARGET_HANDLE}`;
55 return getOutputNodeConfig(name, edge.targetNode.position, id); 61 return getOutputNodeConfig(name, edge.targetNode.position, id);
56 }); 62 });
57 63
@@ -61,9 +67,9 @@ export function transformToRuleChain( @@ -61,9 +67,9 @@ export function transformToRuleChain(
61 67
62 const { firstNode } = validateCanCreateRuleChain(nodesRef, edgesRef); 68 const { firstNode } = validateCanCreateRuleChain(nodesRef, edgesRef);
63 69
64 - const firstNodeIndex = nodesRef.findIndex((node) => node.id === firstNode.id); 70 + const firstNodeIndex = nodesRef.findIndex((node) => node.id === firstNode?.id);
65 71
66 - return { connections, nodes, firstNodeIndex, outputEdgesId }; 72 + return { connections, nodes, firstNodeIndex, outputEdgesId, inputEdgesId };
67 } 73 }
68 74
69 export const NODE_WIDTH = 176; 75 export const NODE_WIDTH = 176;
@@ -87,20 +93,13 @@ function getElementsCenter(nodes: Ref<GraphNode[]> | GraphNode[] = []) { @@ -87,20 +93,13 @@ function getElementsCenter(nodes: Ref<GraphNode[]> | GraphNode[] = []) {
87 continue; 93 continue;
88 } 94 }
89 95
90 - if (x < leftTopX!) {  
91 - leftTopX = x;  
92 - if (y < leftTopY!) {  
93 - leftTopY = y;  
94 - }  
95 - continue;  
96 - } 96 + if (x < leftTopX!) leftTopX = x;
97 97
98 - if (x + NODE_WIDTH > rightBottomX!) {  
99 - rightBottomX = x + NODE_WIDTH;  
100 - if (y + NODE_HEIGHT > rightBottomY!) {  
101 - rightBottomY = y + NODE_HEIGHT;  
102 - }  
103 - } 98 + if (y < leftTopY!) leftTopY = y;
  99 +
  100 + if (x + NODE_WIDTH > rightBottomX!) rightBottomX = x + NODE_WIDTH;
  101 +
  102 + if (y + NODE_HEIGHT > rightBottomY!) rightBottomY = y + NODE_HEIGHT;
104 } 103 }
105 104
106 return { 105 return {
@@ -109,6 +108,60 @@ function getElementsCenter(nodes: Ref<GraphNode[]> | GraphNode[] = []) { @@ -109,6 +108,60 @@ function getElementsCenter(nodes: Ref<GraphNode[]> | GraphNode[] = []) {
109 }; 108 };
110 } 109 }
111 110
  111 +function createRuleChainNode({
  112 + originX,
  113 + originY,
  114 + outputEdges,
  115 + inputEdges,
  116 + ruleChainDetail,
  117 +}: {
  118 + originX: number;
  119 + originY: number;
  120 + ruleChainDetail: RuleChainDetail;
  121 + outputEdges: Ref<(GraphEdge | undefined)[]> | (GraphEdge | undefined)[];
  122 + inputEdges: Ref<(GraphEdge | undefined)[]> | (GraphEdge | undefined)[];
  123 +}) {
  124 + const { getRuleChainNodeConfig } = useNewNode();
  125 + const { getAddedgesParams } = useAddEdges();
  126 + const nodeId = buildUUID();
  127 +
  128 + const ruleChainNode = getRuleChainNodeConfig({
  129 + name: ruleChainDetail.name,
  130 + position: { x: originX - NODE_WIDTH / 2, y: originY - NODE_HEIGHT / 2 },
  131 + ruleChainId: ruleChainDetail.id.id,
  132 + id: nodeId,
  133 + });
  134 +
  135 + const newInputEdges = unref(inputEdges).map((edge) =>
  136 + getAddedgesParams(
  137 + {
  138 + source: edge!.source,
  139 + target: nodeId,
  140 + sourceHandle: `${edge?.source}${SOURCE_HANDLE}`,
  141 + targetHandle: `${nodeId}${TARGET_HANDLE}`,
  142 + },
  143 + toRaw(unref(edge!.data as EdgeData).data)
  144 + )
  145 + );
  146 +
  147 + const newOutputEdges = unref(outputEdges).map((edge) =>
  148 + getAddedgesParams(
  149 + {
  150 + source: nodeId,
  151 + target: edge!.target,
  152 + sourceHandle: `${nodeId}${SOURCE_HANDLE}`,
  153 + targetHandle: `${edge?.target}${TARGET_HANDLE}`,
  154 + },
  155 + toRaw(unref(edge!.data as EdgeData).data)
  156 + )
  157 + );
  158 +
  159 + return {
  160 + nodes: [ruleChainNode],
  161 + edges: [...newInputEdges, ...newOutputEdges],
  162 + };
  163 +}
  164 +
112 export function useContextMenuAction() { 165 export function useContextMenuAction() {
113 const copy = (params: HandleContextMenuActionParamsType) => { 166 const copy = (params: HandleContextMenuActionParamsType) => {
114 const { node } = params; 167 const { node } = params;
@@ -248,35 +301,51 @@ export function useContextMenuAction() { @@ -248,35 +301,51 @@ export function useContextMenuAction() {
248 useSaveAndRedoActionType?.handleRedoChange(flowActionType!); 301 useSaveAndRedoActionType?.handleRedoChange(flowActionType!);
249 }; 302 };
250 303
251 - const createRuleChain = async (_params: HandleContextMenuActionParamsType) => {  
252 - // const { useSaveAndRedoActionType, modalActionType, flowActionType } = params;  
253 - // const { createRuleChainModalActionType } = modalActionType;  
254 - // const result = (await unref(createRuleChainModalActionType)?.openCreateRuleChainModal()) as {  
255 - // name: string;  
256 - // additionalInfo: { description: string };  
257 - // };  
258 - // const ruleChainDetail = await saveRuleChainDetail(  
259 - // Object.assign(result, { debugger: false, type: 'CORE' }) as Partial<RuleChainDetail>  
260 - // );  
261 - // const selectedNodes = unref(flowActionType?.getSelectedNodes);  
262 - // const selectedEdges = unref(flowActionType?.getSelectedEdges);  
263 - // const { firstNodeIndex, connections, nodes, outputEdgesId } = transformToRuleChain(  
264 - // selectedNodes,  
265 - // selectedEdges  
266 - // );  
267 - // await saveRuleChainData({  
268 - // firstNodeIndex,  
269 - // connections,  
270 - // nodes,  
271 - // ruleChainId: ruleChainDetail.id,  
272 - // });  
273 - // const outputEdges = outputEdgesId.map((id) => flowActionType?.findEdge(id));  
274 - // console.log(getElementsCenter(unref(selectedNodes)));  
275 - // const { originX, originY } = getElementsCenter(unref(selectedNodes));  
276 - // const {} = useNewNode();  
277 - // flowActionType?.removeNodes(selectedNodes || []);  
278 - // flowActionType?.removeEdges(selectedEdges || []);  
279 - // useSaveAndRedoActionType?.triggerChange(); 304 + const createRuleChain = async (params: HandleContextMenuActionParamsType) => {
  305 + const { useSaveAndRedoActionType, modalActionType, flowActionType } = params;
  306 + const { createRuleChainModalActionType } = modalActionType;
  307 + const result = (await unref(createRuleChainModalActionType)?.openCreateRuleChainModal()) as {
  308 + name: string;
  309 + additionalInfo: { description: string };
  310 + };
  311 +
  312 + const ruleChainDetail = await saveRuleChainDetail(
  313 + Object.assign(result, { debugger: false, type: 'CORE' }) as Partial<RuleChainDetail>
  314 + );
  315 +
  316 + const selectedNodes = unref(flowActionType?.getSelectedNodes);
  317 + const selectedEdges = unref(flowActionType?.getSelectedEdges);
  318 + const { firstNodeIndex, connections, nodes, outputEdgesId, inputEdgesId } =
  319 + transformToRuleChain(selectedNodes, selectedEdges);
  320 +
  321 + await saveRuleChainData({
  322 + firstNodeIndex,
  323 + connections: connections.filter(
  324 + (connection) => !isNullOrUnDef(connection.fromIndex) && !isNullOrUnDef(connection.toIndex)
  325 + ),
  326 + nodes,
  327 + ruleChainId: ruleChainDetail.id,
  328 + });
  329 +
  330 + const outputEdges = outputEdgesId.map((id) => flowActionType?.findEdge(id));
  331 + const inputEdges = inputEdgesId.map((id) => flowActionType?.findEdge(id));
  332 +
  333 + const { originX, originY } = getElementsCenter(unref(selectedNodes));
  334 +
  335 + flowActionType?.removeNodes(selectedNodes || []);
  336 + flowActionType?.removeEdges(selectedEdges || []);
  337 +
  338 + const { nodes: newNode, edges: newEdges } = createRuleChainNode({
  339 + originX,
  340 + originY,
  341 + outputEdges,
  342 + inputEdges,
  343 + ruleChainDetail,
  344 + });
  345 +
  346 + flowActionType?.addNodes(newNode);
  347 + flowActionType?.addEdges(newEdges);
  348 + useSaveAndRedoActionType?.triggerChange();
280 }; 349 };
281 350
282 const handleContextMenuAction = (params: HandleContextMenuActionParamsType) => { 351 const handleContextMenuAction = (params: HandleContextMenuActionParamsType) => {
@@ -40,13 +40,23 @@ export function useNewNode() { @@ -40,13 +40,23 @@ export function useNewNode() {
40 return newNode; 40 return newNode;
41 }; 41 };
42 42
43 - const getRuleChainNodeConfig = (name: string, position: XYPosition, id?: string) => { 43 + const getRuleChainNodeConfig = ({
  44 + name,
  45 + position,
  46 + ruleChainId,
  47 + id,
  48 + }: {
  49 + name: string;
  50 + position: XYPosition;
  51 + ruleChainId: string;
  52 + id?: string;
  53 + }) => {
44 const { getAddNodesParams } = useAddNodes(); 54 const { getAddNodesParams } = useAddNodes();
45 const newNode = getAddNodesParams( 55 const newNode = getAddNodesParams(
46 position, 56 position,
47 { 57 {
48 ...new RuleChainConfig(), 58 ...new RuleChainConfig(),
49 - data: { name }, 59 + data: { name, configuration: { ruleChainId } },
50 }, 60 },
51 { 61 {
52 id, 62 id,
@@ -65,6 +65,7 @@ export function useRuleFlow(options: UseRuleFlowOptionsType) { @@ -65,6 +65,7 @@ export function useRuleFlow(options: UseRuleFlowOptionsType) {
65 minZoom: 1, 65 minZoom: 1,
66 panOnScroll: true, 66 panOnScroll: true,
67 selectionMode: SelectionMode.Partial, 67 selectionMode: SelectionMode.Partial,
  68 +
68 nodeTypes: { 69 nodeTypes: {
69 [NodeTypeEnum.CUSTOM]: markRaw(BasicNode) as NodeComponent, 70 [NodeTypeEnum.CUSTOM]: markRaw(BasicNode) as NodeComponent,
70 }, 71 },
@@ -79,14 +80,16 @@ export function useRuleFlow(options: UseRuleFlowOptionsType) { @@ -79,14 +80,16 @@ export function useRuleFlow(options: UseRuleFlowOptionsType) {
79 y: 0, 80 y: 0,
80 }, 81 },
81 isValidConnection(connection, elements) { 82 isValidConnection(connection, elements) {
  83 + if (!elements.targetNode || !elements.sourceNode) return false;
  84 +
82 const validateList = [validateInputAndOutput]; 85 const validateList = [validateInputAndOutput];
83 const targetData = elements.targetNode.data as NodeData; 86 const targetData = elements.targetNode.data as NodeData;
84 87
85 if ( 88 if (
86 - targetData.category?.validateConnection &&  
87 - isFunction(targetData.category.validateConnection) 89 + targetData.categoryConfig?.validateConnection &&
  90 + isFunction(targetData.categoryConfig.validateConnection)
88 ) 91 )
89 - validateList.push(targetData.category?.validateConnection); 92 + validateList.push(targetData.categoryConfig?.validateConnection);
90 93
91 if (targetData.config?.validateConnection && isFunction(targetData.config.validateConnection)) 94 if (targetData.config?.validateConnection && isFunction(targetData.config.validateConnection))
92 validateList.push(targetData.config.validateConnection); 95 validateList.push(targetData.config.validateConnection);
@@ -47,7 +47,6 @@ @@ -47,7 +47,6 @@
47 47
48 const setValue: CreateModalDefineExposeType['setFieldsValue'] = (value) => { 48 const setValue: CreateModalDefineExposeType['setFieldsValue'] = (value) => {
49 resetFields(); 49 resetFields();
50 - console.log(value);  
51 setFieldsValue({ 50 setFieldsValue({
52 ...value, 51 ...value,
53 ...(value?.[RelatedDeviceAttributeFieldsEnum.DEVICE_RELATIONS_QUERY] || {}), 52 ...(value?.[RelatedDeviceAttributeFieldsEnum.DEVICE_RELATIONS_QUERY] || {}),
@@ -14,6 +14,7 @@ export const RuleChainConfig: NodeItemConfigType = { @@ -14,6 +14,7 @@ export const RuleChainConfig: NodeItemConfigType = {
14 clazz: 'org.thingsboard.rule.engine.flow.TbRuleChainInputNode', 14 clazz: 'org.thingsboard.rule.engine.flow.TbRuleChainInputNode',
15 categoryType: RuleNodeTypeEnum.FLOW, 15 categoryType: RuleNodeTypeEnum.FLOW,
16 name: 'rule chain', 16 name: 'rule chain',
  17 + // backgroundColor: '#d6c4f1',
17 configurationDescriptor: { 18 configurationDescriptor: {
18 nodeDefinition: { 19 nodeDefinition: {
19 details: 20 details:
@@ -14,7 +14,7 @@ @@ -14,7 +14,7 @@
14 const handleClick = () => { 14 const handleClick = () => {
15 const { data } = props.nodeProps?.data || ({} as NodeData); 15 const { data } = props.nodeProps?.data || ({} as NodeData);
16 const { configuration } = (data || {}) as { configuration: Record<'ruleChainId', string> }; 16 const { configuration } = (data || {}) as { configuration: Record<'ruleChainId', string> };
17 - if (configuration.ruleChainId) { 17 + if (configuration?.ruleChainId) {
18 ROUTER.push(`/rule/chain/${configuration.ruleChainId}`); 18 ROUTER.push(`/rule/chain/${configuration.ruleChainId}`);
19 } 19 }
20 }; 20 };
@@ -36,8 +36,8 @@ @@ -36,8 +36,8 @@
36 36
37 const getIcon = computed(() => { 37 const getIcon = computed(() => {
38 const { icon } = unref(getNodeDefinition); 38 const { icon } = unref(getNodeDefinition);
39 - const { category } = unref(getData);  
40 - const { icon: categoryIcon } = category || {}; 39 + const { categoryConfig } = unref(getData);
  40 + const { icon: categoryIcon } = categoryConfig || {};
41 return icon || categoryIcon || 'tabler:circuit-ground'; 41 return icon || categoryIcon || 'tabler:circuit-ground';
42 }); 42 });
43 43
@@ -47,8 +47,8 @@ @@ -47,8 +47,8 @@
47 }); 47 });
48 48
49 const getBackgroundColor = computed(() => { 49 const getBackgroundColor = computed(() => {
50 - const { config, category } = unref(getData);  
51 - const { backgroundColor: categoryBackgroundColor } = category || {}; 50 + const { config, categoryConfig } = unref(getData);
  51 + const { backgroundColor: categoryBackgroundColor } = categoryConfig || {};
52 const { backgroundColor } = config || {}; 52 const { backgroundColor } = config || {};
53 return backgroundColor || categoryBackgroundColor; 53 return backgroundColor || categoryBackgroundColor;
54 }); 54 });
@@ -60,8 +60,8 @@ @@ -60,8 +60,8 @@
60 <section class="text-dark-900 text-xs"> 60 <section class="text-dark-900 text-xs">
61 <p class="mb-0 font-bold"> {{ getData?.data?.name }} </p> 61 <p class="mb-0 font-bold"> {{ getData?.data?.name }} </p>
62 <p class="mb-0 mt-2 text-gray-500 italic"> 62 <p class="mb-0 mt-2 text-gray-500 italic">
63 - {{ getData.category?.title }}  
64 - {{ getData?.category?.title && getData.config?.name ? '-' : '' }} 63 + {{ getData.categoryConfig?.title }}
  64 + {{ getData?.categoryConfig?.title && getData.config?.name ? '-' : '' }}
65 {{ getData.config?.name }} 65 {{ getData.config?.name }}
66 </p> 66 </p>
67 <p class="mt-1 mb-0 text-gray-500">{{ getData.data?.description }}</p> 67 <p class="mt-1 mb-0 text-gray-500">{{ getData.data?.description }}</p>
@@ -48,7 +48,7 @@ @@ -48,7 +48,7 @@
48 v-for="config in getCurrentCategoryNode.components" 48 v-for="config in getCurrentCategoryNode.components"
49 :key="config.clazz" 49 :key="config.clazz"
50 :config="config" 50 :config="config"
51 - :category="getCurrentCategoryNode.category" 51 + :categoryConfig="getCurrentCategoryNode.category"
52 /> 52 />
53 </body> 53 </body>
54 </section> 54 </section>
@@ -5,7 +5,7 @@ @@ -5,7 +5,7 @@
5 import { CategoryConfigType, NodeItemConfigType } from '../../../types/node'; 5 import { CategoryConfigType, NodeItemConfigType } from '../../../types/node';
6 6
7 const props = defineProps<{ 7 const props = defineProps<{
8 - category?: CategoryConfigType; 8 + categoryConfig?: CategoryConfigType;
9 config?: NodeItemConfigType; 9 config?: NodeItemConfigType;
10 }>(); 10 }>();
11 11
@@ -20,7 +20,7 @@ @@ -20,7 +20,7 @@
20 20
21 const getIcon = computed(() => { 21 const getIcon = computed(() => {
22 const { icon } = unref(getNodeDefinition); 22 const { icon } = unref(getNodeDefinition);
23 - const { icon: categoryIcon } = props.category || {}; 23 + const { icon: categoryIcon } = props.categoryConfig || {};
24 return icon || categoryIcon || 'tabler:circuit-ground'; 24 return icon || categoryIcon || 'tabler:circuit-ground';
25 }); 25 });
26 26
@@ -30,9 +30,9 @@ @@ -30,9 +30,9 @@
30 }); 30 });
31 31
32 const getBackgroundColor = computed(() => { 32 const getBackgroundColor = computed(() => {
33 - const { config, category } = props; 33 + const { config, categoryConfig } = props;
34 const { backgroundColor } = config || {}; 34 const { backgroundColor } = config || {};
35 - const { backgroundColor: categoryBackgroundColor } = category || {}; 35 + const { backgroundColor: categoryBackgroundColor } = categoryConfig || {};
36 return backgroundColor || categoryBackgroundColor; 36 return backgroundColor || categoryBackgroundColor;
37 }); 37 });
38 38
@@ -87,8 +87,8 @@ @@ -87,8 +87,8 @@
87 {{ config?.name }} 87 {{ config?.name }}
88 </span> 88 </span>
89 </div> 89 </div>
90 - <div class="w-4 h-4 bg-dark-50 rounded-1 border absolute -left-2 border-light-50"></div>  
91 - <div class="w-4 h-4 bg-dark-50 rounded-1 border absolute -right-2 border-light-50"></div> 90 + <div class="w-4 h-4 bg-gray-300 rounded-md border absolute -left-3 border-gray-500"></div>
  91 + <div class="w-4 h-4 bg-gray-300 rounded-md border absolute -right-3 border-gray-500"></div>
92 </main> 92 </main>
93 </Tooltip> 93 </Tooltip>
94 </template> 94 </template>
@@ -64,8 +64,8 @@ @@ -64,8 +64,8 @@
64 64
65 const getNodeIcon = computed(() => { 65 const getNodeIcon = computed(() => {
66 const { nodeData } = props; 66 const { nodeData } = props;
67 - const { category, config } = nodeData;  
68 - const { icon: categoryIcon } = category || {}; 67 + const { categoryConfig, config } = nodeData;
  68 + const { icon: categoryIcon } = categoryConfig || {};
69 const { configurationDescriptor } = config || {}; 69 const { configurationDescriptor } = config || {};
70 const { nodeDefinition } = configurationDescriptor || {}; 70 const { nodeDefinition } = configurationDescriptor || {};
71 const { icon } = nodeDefinition || {}; 71 const { icon } = nodeDefinition || {};
@@ -74,8 +74,8 @@ @@ -74,8 +74,8 @@
74 }); 74 });
75 75
76 const getTitleBackgroundColor = computed(() => { 76 const getTitleBackgroundColor = computed(() => {
77 - const { category, config } = props.nodeData;  
78 - const { backgroundColor: categoryBackgroundColor } = category || {}; 77 + const { categoryConfig, config } = props.nodeData;
  78 + const { backgroundColor: categoryBackgroundColor } = categoryConfig || {};
79 const { backgroundColor } = config || {}; 79 const { backgroundColor } = config || {};
80 return categoryBackgroundColor || backgroundColor; 80 return categoryBackgroundColor || backgroundColor;
81 }); 81 });
@@ -90,7 +90,7 @@ @@ -90,7 +90,7 @@
90 <template #title> 90 <template #title>
91 <h2 class="font-bold text-2xl truncate">{{ nodeData?.data?.name }}</h2> 91 <h2 class="font-bold text-2xl truncate">{{ nodeData?.data?.name }}</h2>
92 <p class="mb-0 text-gray-700"> 92 <p class="mb-0 text-gray-700">
93 - <span> {{ nodeData?.category?.title }}</span> 93 + <span> {{ nodeData?.categoryConfig?.title }}</span>
94 <span class="mx-1">-</span> 94 <span class="mx-1">-</span>
95 <span>{{ nodeData?.config?.name }}</span> 95 <span>{{ nodeData?.config?.name }}</span>
96 </p> 96 </p>
1 .vue-flow__handle { 1 .vue-flow__handle {
2 width: 16px; 2 width: 16px;
3 height: 16px; 3 height: 16px;
  4 + border-radius: 6px;
  5 + background-color: #d1d5db;
  6 + border-color: #6b7280;
  7 +}
  8 +
  9 +.vue-flow__handle:hover{
  10 + background-color: #000;
4 } 11 }
5 12
6 .vue-flow__handle-right { 13 .vue-flow__handle-right {
7 - right: -8px; 14 + right: -12px;
8 } 15 }
9 16
10 .vue-flow__handle-left { 17 .vue-flow__handle-left {
11 - left: -8px; 18 + left: -12px;
12 } 19 }
13 20
14 .vue-flow__background.vue-flow__container { 21 .vue-flow__background.vue-flow__container {
@@ -134,7 +134,7 @@ export interface DragTransferData { @@ -134,7 +134,7 @@ export interface DragTransferData {
134 } 134 }
135 135
136 export interface NodeData<T = BasicNodeFormData> { 136 export interface NodeData<T = BasicNodeFormData> {
137 - category?: CategoryConfigType; 137 + categoryConfig?: CategoryConfigType;
138 config?: NodeItemConfigType; 138 config?: NodeItemConfigType;
139 data?: T; 139 data?: T;
140 created?: boolean; 140 created?: boolean;
@@ -153,11 +153,14 @@ @@ -153,11 +153,14 @@
153 let getActionFormValue = ref([]); 153 let getActionFormValue = ref([]);
154 const editEntryIdData = ref([]); 154 const editEntryIdData = ref([]);
155 const editAlarmConfigData = ref([]); 155 const editAlarmConfigData = ref([]);
156 - const isUpdate = ref(false); 156 + const isUpdate = ref<boolean | number>(false);
157 const id = ref(undefined); 157 const id = ref(undefined);
158 const tenantId = ref(undefined); 158 const tenantId = ref(undefined);
159 const isView = ref(true); 159 const isView = ref(true);
160 - const [registerForm, { resetFields, validate, setFieldsValue, getFieldsValue }] = useForm({ 160 + const [
  161 + registerForm,
  162 + { resetFields, validate, setFieldsValue, getFieldsValue, setProps, updateSchema },
  163 + ] = useForm({
161 labelWidth: 120, 164 labelWidth: 120,
162 schemas: formSchema, 165 schemas: formSchema,
163 showActionButtonGroup: false, 166 showActionButtonGroup: false,
@@ -532,6 +535,37 @@ @@ -532,6 +535,37 @@
532 showFooter: unref(isView), 535 showFooter: unref(isView),
533 loading: false, 536 loading: false,
534 }); 537 });
  538 +
  539 + if (isUpdate.value == 3) {
  540 + setProps({ disabled: true });
  541 + updateSchema({
  542 + field: 'organizationId',
  543 + componentProps: { apiTreeSelectProps: { disabled: true } },
  544 + });
  545 + await nextTick();
  546 + unref(skipUnwrap.triggerItemRefs)?.forEach((item) => {
  547 + item.setDisabledProps({ disabled: true });
  548 + });
  549 +
  550 + unref(skipUnwrap.conditionItemRefs)?.forEach((item) => {
  551 + item.setDisabledProps({ disabled: true });
  552 + });
  553 +
  554 + unref(skipUnwrap.actionItemRefs)?.forEach((item) => {
  555 + item.setDisabledProps({ disabled: true });
  556 + });
  557 + } else {
  558 + updateSchema({
  559 + field: 'organizationId',
  560 + componentProps: { apiTreeSelectProps: { disabled: false } },
  561 + });
  562 + unref(skipUnwrap.triggerItemRefs)?.forEach((item) => {
  563 + item.setCancelDisabled();
  564 + });
  565 + unref(skipUnwrap.conditionItemRefs)?.forEach((item) => {
  566 + item.setCancelDisabled();
  567 + });
  568 + }
535 }); 569 });
536 570
537 // 设置设备的options 571 // 设置设备的options
@@ -29,6 +29,7 @@ @@ -29,6 +29,7 @@
29 <template #operationType="{ model, field }"> 29 <template #operationType="{ model, field }">
30 <Select 30 <Select
31 :options="options" 31 :options="options"
  32 + :disabled="disabled"
32 v-model:value="model[field]" 33 v-model:value="model[field]"
33 @change="operationType = model[field]" 34 @change="operationType = model[field]"
34 placeholder="请选择比较类型" 35 placeholder="请选择比较类型"
@@ -39,6 +40,7 @@ @@ -39,6 +40,7 @@
39 <Input v-model:value="model[field]" placeholder="请输入持续时间"> 40 <Input v-model:value="model[field]" placeholder="请输入持续时间">
40 <template #addonAfter> 41 <template #addonAfter>
41 <Select 42 <Select
  43 + :disabled="disabled"
42 v-model:value="model[`timeUnit`]" 44 v-model:value="model[`timeUnit`]"
43 :options="timeUnitOptions" 45 :options="timeUnitOptions"
44 style="width: 60px" 46 style="width: 60px"
@@ -58,7 +60,7 @@ @@ -58,7 +60,7 @@
58 </div> 60 </div>
59 </template> 61 </template>
60 <script lang="ts" setup> 62 <script lang="ts" setup>
61 - import { ref, provide, nextTick } from 'vue'; 63 + import { ref, provide, nextTick, unref } from 'vue';
62 import { CollapseContainer } from '/@/components/Container/index'; 64 import { CollapseContainer } from '/@/components/Container/index';
63 import { BasicForm, useForm } from '/@/components/Form/index'; 65 import { BasicForm, useForm } from '/@/components/Form/index';
64 import { Card, Select, Input, Tooltip } from 'ant-design-vue'; 66 import { Card, Select, Input, Tooltip } from 'ant-design-vue';
@@ -86,12 +88,13 @@ @@ -86,12 +88,13 @@
86 const emit = defineEmits(['delete']); 88 const emit = defineEmits(['delete']);
87 const isUpdate = ref(false); 89 const isUpdate = ref(false);
88 const conditionScreeningRef = ref(); 90 const conditionScreeningRef = ref();
89 - const [registerForm, { resetFields, getFieldsValue, updateSchema, setFieldsValue }] = useForm({  
90 - //TODO-wenwei-修复  
91 - schemas: cloneDeep(trigger_condition_schema),  
92 - //TODO-wenwei-修复  
93 - showActionButtonGroup: false,  
94 - }); 91 + const [registerForm, { resetFields, getFieldsValue, updateSchema, setFieldsValue, setProps }] =
  92 + useForm({
  93 + //TODO-wenwei-修复
  94 + schemas: cloneDeep(trigger_condition_schema),
  95 + //TODO-wenwei-修复
  96 + showActionButtonGroup: false,
  97 + });
95 98
96 const alarmScheduleRef = ref<InstanceType<typeof AlarmSchedule>>(); 99 const alarmScheduleRef = ref<InstanceType<typeof AlarmSchedule>>();
97 const getFieldsValueFunc = () => { 100 const getFieldsValueFunc = () => {
@@ -144,6 +147,7 @@ @@ -144,6 +147,7 @@
144 const currentIndex = ref(0); 147 const currentIndex = ref(0);
145 const [registerModal, { openModal }] = useModal(); 148 const [registerModal, { openModal }] = useModal();
146 const handleScheduleChange = (value) => { 149 const handleScheduleChange = (value) => {
  150 + if (unref(disabled)) return;
147 const index = scheduleOptions.findIndex((item) => item.value === value); 151 const index = scheduleOptions.findIndex((item) => item.value === value);
148 // 报警日程弹窗 152 // 报警日程弹窗
149 if (index !== 0) { 153 if (index !== 0) {
@@ -164,6 +168,16 @@ @@ -164,6 +168,16 @@
164 currentIndex.value = index; 168 currentIndex.value = index;
165 }; 169 };
166 const scheduleData = ref(null); 170 const scheduleData = ref(null);
  171 +
  172 + const disabled = ref<boolean>(false);
  173 + const setDisabledProps = (value) => {
  174 + setProps(value);
  175 + disabled.value = true;
  176 + };
  177 +
  178 + const setCancelDisabled = () => {
  179 + disabled.value = false;
  180 + };
167 defineExpose({ 181 defineExpose({
168 getFieldsValue, 182 getFieldsValue,
169 updateFieldDeviceId, 183 updateFieldDeviceId,
@@ -182,6 +196,8 @@ @@ -182,6 +196,8 @@
182 isUpdate, 196 isUpdate,
183 alarmScheduleRef, 197 alarmScheduleRef,
184 updateFieldAttributeFunc, 198 updateFieldAttributeFunc,
  199 + setDisabledProps,
  200 + setCancelDisabled,
185 }); 201 });
186 </script> 202 </script>
187 <style> 203 <style>
@@ -31,8 +31,11 @@ @@ -31,8 +31,11 @@
31 const emit = defineEmits(['deleteConditionForm']); 31 const emit = defineEmits(['deleteConditionForm']);
32 const operationType = inject('operationType'); 32 const operationType = inject('operationType');
33 let schemas = ref([]); 33 let schemas = ref([]);
  34 + const isViewDisabledBtn = window.localStorage.getItem('isViewDisabledBtn');
34 onMounted(() => { 35 onMounted(() => {
35 schemas.value = isType(operationType.value); 36 schemas.value = isType(operationType.value);
  37 +
  38 + if (isViewDisabledBtn == 'isView') setProps({ disabled: true });
36 }); 39 });
37 watch(operationType, (newValue) => { 40 watch(operationType, (newValue) => {
38 schemas.value = isType(newValue); 41 schemas.value = isType(newValue);
@@ -47,6 +50,7 @@ @@ -47,6 +50,7 @@
47 getFieldsValue, 50 getFieldsValue,
48 setFieldsValue, 51 setFieldsValue,
49 validate, 52 validate,
  53 + setProps,
50 }, 54 },
51 ] = useForm({ 55 ] = useForm({
52 showActionButtonGroup: false, 56 showActionButtonGroup: false,
@@ -55,6 +59,7 @@ @@ -55,6 +59,7 @@
55 schemas, 59 schemas,
56 }); 60 });
57 const deleteConditionForm = (index: number) => { 61 const deleteConditionForm = (index: number) => {
  62 + if (isViewDisabledBtn == 'isView') return;
58 emit('deleteConditionForm', index); 63 emit('deleteConditionForm', index);
59 }; 64 };
60 // ft add 65 // ft add
@@ -8,7 +8,8 @@ @@ -8,7 +8,8 @@
8 <template v-for="(item, scheduleIndex) in scheduleOptions" :key="item.label"> 8 <template v-for="(item, scheduleIndex) in scheduleOptions" :key="item.label">
9 <div 9 <div
10 :class="{ 'ml-4': scheduleIndex >= 1, active: scheduleIndex === currentIndex }" 10 :class="{ 'ml-4': scheduleIndex >= 1, active: scheduleIndex === currentIndex }"
11 - class="cursor-pointer" 11 + class="cursor-pointer !p-0"
  12 + :disabled="disabled"
12 @click="handleScheduleChange(item.value)" 13 @click="handleScheduleChange(item.value)"
13 >{{ item.label }}</div 14 >{{ item.label }}</div
14 > 15 >
@@ -28,6 +29,7 @@ @@ -28,6 +29,7 @@
28 <template #operationType="{ model, field }"> 29 <template #operationType="{ model, field }">
29 <Select 30 <Select
30 :options="options" 31 :options="options"
  32 + :disabled="disabled"
31 v-model:value="model[field]" 33 v-model:value="model[field]"
32 @change="operationType = model[field]" 34 @change="operationType = model[field]"
33 placeholder="请选择比较类型" 35 placeholder="请选择比较类型"
@@ -38,6 +40,7 @@ @@ -38,6 +40,7 @@
38 <Input v-model:value="model[field]" placeholder="请输入持续时间"> 40 <Input v-model:value="model[field]" placeholder="请输入持续时间">
39 <template #addonAfter> 41 <template #addonAfter>
40 <Select 42 <Select
  43 + :disabled="disabled"
41 v-model:value="model[`timeUnit`]" 44 v-model:value="model[`timeUnit`]"
42 :options="timeUnitOptions" 45 :options="timeUnitOptions"
43 style="width: 60px" 46 style="width: 60px"
@@ -71,6 +74,7 @@ @@ -71,6 +74,7 @@
71 import { Icon } from '/@/components/Icon'; 74 import { Icon } from '/@/components/Icon';
72 import { useModal } from '/@/components/Modal'; 75 import { useModal } from '/@/components/Modal';
73 import { useMessage } from '/@/hooks/web/useMessage'; 76 import { useMessage } from '/@/hooks/web/useMessage';
  77 + import { unref } from 'vue';
74 78
75 const { useByProductGetAttribute } = useCommonFun(); 79 const { useByProductGetAttribute } = useCommonFun();
76 defineProps({ 80 defineProps({
@@ -92,12 +96,13 @@ @@ -92,12 +96,13 @@
92 96
93 const isUpdate = ref(false); 97 const isUpdate = ref(false);
94 const conditionScreeningRef = ref(); 98 const conditionScreeningRef = ref();
95 - const [registerForm, { resetFields, getFieldsValue, updateSchema, setFieldsValue }] = useForm({  
96 - //TODO-wenwei-修复  
97 - schemas: cloneDeep(trigger_condition_schema),  
98 - //TODO-wenwei-修复  
99 - showActionButtonGroup: false,  
100 - }); 99 + const [registerForm, { resetFields, getFieldsValue, updateSchema, setFieldsValue, setProps }] =
  100 + useForm({
  101 + //TODO-wenwei-修复
  102 + schemas: cloneDeep(trigger_condition_schema),
  103 + //TODO-wenwei-修复
  104 + showActionButtonGroup: false,
  105 + });
101 106
102 const alarmScheduleRef = ref<InstanceType<typeof AlarmSchedule>>(); 107 const alarmScheduleRef = ref<InstanceType<typeof AlarmSchedule>>();
103 108
@@ -168,6 +173,7 @@ @@ -168,6 +173,7 @@
168 }; 173 };
169 //TODO-fengtao 174 //TODO-fengtao
170 const handleDelete = (params: { index: number; title: string }) => { 175 const handleDelete = (params: { index: number; title: string }) => {
  176 + if (unref(disabled)) return;
171 emit('delete', params); 177 emit('delete', params);
172 }; 178 };
173 const operationType = ref<string>(''); 179 const operationType = ref<string>('');
@@ -192,6 +198,7 @@ @@ -192,6 +198,7 @@
192 const [registerModal, { openModal }] = useModal(); 198 const [registerModal, { openModal }] = useModal();
193 const currentIndex = ref(0); 199 const currentIndex = ref(0);
194 const handleScheduleChange = (value) => { 200 const handleScheduleChange = (value) => {
  201 + if (unref(disabled)) return;
195 const index = scheduleOptions.findIndex((item) => item.value === value); 202 const index = scheduleOptions.findIndex((item) => item.value === value);
196 // 报警日程弹窗 203 // 报警日程弹窗
197 if (index !== 0) { 204 if (index !== 0) {
@@ -223,6 +230,16 @@ @@ -223,6 +230,16 @@
223 // console.log(alarmConfigList); 230 // console.log(alarmConfigList);
224 }; 231 };
225 232
  233 + const disabled = ref<boolean>(false);
  234 + const setDisabledProps = (value) => {
  235 + setProps(value);
  236 + disabled.value = true;
  237 + };
  238 +
  239 + const setCancelDisabled = () => {
  240 + disabled.value = false;
  241 + };
  242 +
226 defineExpose({ 243 defineExpose({
227 getFieldsValueFunc, 244 getFieldsValueFunc,
228 updateFieldDeviceId, 245 updateFieldDeviceId,
@@ -240,6 +257,8 @@ @@ -240,6 +257,8 @@
240 updateFieldAttributeFunc, 257 updateFieldAttributeFunc,
241 updateFieldAlarmConfig, 258 updateFieldAlarmConfig,
242 updateEditFieldAlarmConfig, 259 updateEditFieldAlarmConfig,
  260 + setDisabledProps,
  261 + setCancelDisabled,
243 }); 262 });
244 </script> 263 </script>
245 264
@@ -13,6 +13,7 @@ @@ -13,6 +13,7 @@
13 <BasicForm @register="registerAction"> 13 <BasicForm @register="registerAction">
14 <template #outTarget="{ model, field }"> 14 <template #outTarget="{ model, field }">
15 <Select 15 <Select
  16 + :disabled="disabled"
16 :options="options" 17 :options="options"
17 v-model:value="model[field]" 18 v-model:value="model[field]"
18 @change="changeOutTarget" 19 @change="changeOutTarget"
@@ -24,6 +25,7 @@ @@ -24,6 +25,7 @@
24 <template #alarmConfigSlot="{ model, field }"> 25 <template #alarmConfigSlot="{ model, field }">
25 <a-select 26 <a-select
26 allowClear 27 allowClear
  28 + :disabled="disabled"
27 placeholder="请选择告警配置" 29 placeholder="请选择告警配置"
28 v-model:value="model[field]" 30 v-model:value="model[field]"
29 style="width: 205px; margin-left: 10px" 31 style="width: 205px; margin-left: 10px"
@@ -41,14 +43,22 @@ @@ -41,14 +43,22 @@
41 </template> 43 </template>
42 <template #doContext="{ model, field }"> 44 <template #doContext="{ model, field }">
43 <div v-if="model['transportType'] === TransportTypeEnum.TCP"> 45 <div v-if="model['transportType'] === TransportTypeEnum.TCP">
44 - <Input v-model:value="model[field]" placeholder="请输入自定义命令" /> 46 + <Input v-model:value="model[field]" :disabled="disabled" placeholder="请输入自定义命令" />
45 </div> 47 </div>
46 <div 48 <div
47 v-show="model['transportType'] !== TransportTypeEnum.TCP" 49 v-show="model['transportType'] !== TransportTypeEnum.TCP"
48 class="flex" 50 class="flex"
49 style="align-items: center" 51 style="align-items: center"
50 > 52 >
51 - <div ref="jsoneditorRef" style="height: 100%; width: 100%"></div> 53 + <div v-show="!disabled" ref="jsoneditorRef" style="height: 100%; width: 100%"></div>
  54 +
  55 + <a-textarea
  56 + v-show="disabled"
  57 + :disabled="true"
  58 + :value="JSON.stringify(disabledValue)"
  59 + :rows="4"
  60 + />
  61 +
52 <a-button style="margin: -5px 0" type="text" @click="handlePremitter">格式化</a-button> 62 <a-button style="margin: -5px 0" type="text" @click="handlePremitter">格式化</a-button>
53 <Tooltip 63 <Tooltip
54 :title=" 64 :title="
@@ -64,7 +74,9 @@ @@ -64,7 +74,9 @@
64 </div> 74 </div>
65 </template> 75 </template>
66 <template #clearAlarm> 76 <template #clearAlarm>
67 - <Checkbox v-model:checked="checked" @change="handleCheckedChange"> 清除告警 </Checkbox> 77 + <Checkbox v-model:checked="checked" :disabled="disabled" @change="handleCheckedChange">
  78 + 清除告警
  79 + </Checkbox>
68 <Tooltip title="清除告警与触发器一一对应"> 80 <Tooltip title="清除告警与触发器一一对应">
69 <QuestionCircleOutlined /> 81 <QuestionCircleOutlined />
70 </Tooltip> 82 </Tooltip>
@@ -374,6 +386,7 @@ @@ -374,6 +386,7 @@
374 }; 386 };
375 387
376 const handleDelete = (actionIndex) => { 388 const handleDelete = (actionIndex) => {
  389 + if (unref(disabled)) return;
377 emit('deleteAction', actionIndex); 390 emit('deleteAction', actionIndex);
378 }; 391 };
379 392
@@ -409,6 +422,8 @@ @@ -409,6 +422,8 @@
409 const jsoneditorRef = ref(); 422 const jsoneditorRef = ref();
410 const jsonValue = ref({}); 423 const jsonValue = ref({});
411 const jsonInstance = ref(); 424 const jsonInstance = ref();
  425 +
  426 + const disabledValue = ref(); //查看时使用表单全部禁用使用这个来获取表单数据
412 onMounted(() => { 427 onMounted(() => {
413 nextTick(() => { 428 nextTick(() => {
414 let options = { 429 let options = {
@@ -425,6 +440,7 @@ @@ -425,6 +440,7 @@
425 const getJsonValue = () => unref(jsonInstance).get(); 440 const getJsonValue = () => unref(jsonInstance).get();
426 const setJsonValue = (Json) => { 441 const setJsonValue = (Json) => {
427 nextTick(() => { 442 nextTick(() => {
  443 + disabledValue.value = Json;
428 unref(jsonInstance).set(Json); 444 unref(jsonInstance).set(Json);
429 }); 445 });
430 }; 446 };
@@ -452,6 +468,23 @@ @@ -452,6 +468,23 @@
452 emit('getActionFormArr'); 468 emit('getActionFormArr');
453 }; 469 };
454 470
  471 + const disabled = ref<boolean>(false);
  472 + const setDisabledProps = async (value) => {
  473 + setProps(value);
  474 + disabled.value = true;
  475 + await nextTick();
  476 + unref(refItem.clearRuleRefs)?.forEach((item) => {
  477 + item.setDisabledProps(value);
  478 + });
  479 + };
  480 +
  481 + const setCancelDisabled = () => {
  482 + disabled.value = false;
  483 + unref(refItem.clearRuleRefs)?.forEach((item) => {
  484 + item.setCancelDisabled();
  485 + });
  486 + };
  487 +
455 defineExpose({ 488 defineExpose({
456 getFieldsValue, 489 getFieldsValue,
457 getFieldsValueFunc, 490 getFieldsValueFunc,
@@ -472,6 +505,8 @@ @@ -472,6 +505,8 @@
472 clearRuleList, 505 clearRuleList,
473 resetConditionForm, 506 resetConditionForm,
474 handleDropdownVisibleChange, 507 handleDropdownVisibleChange,
  508 + setDisabledProps,
  509 + setCancelDisabled,
475 }); 510 });
476 </script> 511 </script>
477 512
@@ -153,6 +153,7 @@ @@ -153,6 +153,7 @@
153 title: '是否确认删除操作?', 153 title: '是否确认删除操作?',
154 onConfirm: handleDelete.bind(null), 154 onConfirm: handleDelete.bind(null),
155 }, 155 },
  156 + disabled: !!getRecord.state,
156 }, 157 },
157 ]" 158 ]"
158 /> 159 />
@@ -293,12 +293,13 @@ export const commonDataSourceSchemas = (): FormSchema[] => { @@ -293,12 +293,13 @@ export const commonDataSourceSchemas = (): FormSchema[] => {
293 (item) => item.itemValue == CommandTypeEnum.ATTRIBUTE.toString() 293 (item) => item.itemValue == CommandTypeEnum.ATTRIBUTE.toString()
294 ); 294 );
295 } 295 }
296 -  
297 // TCP网关子 --> 不能要服务命令类型 296 // TCP网关子 --> 不能要服务命令类型
298 if (deviceType == 'SENSOR' && transportType == 'TCP') { 297 if (deviceType == 'SENSOR' && transportType == 'TCP') {
299 - return record.filter(  
300 - (item) => item.itemValue == CommandTypeEnum.ATTRIBUTE.toString()  
301 - ); 298 + return codeType == 'MODBUS_RTU'
  299 + ? record.filter((item) => item.itemValue == CommandTypeEnum.ATTRIBUTE.toString())
  300 + : codeType == 'CUSTOM'
  301 + ? record.filter((item) => item.itemValue == CommandTypeEnum.CUSTOM.toString())
  302 + : [];
302 } 303 }
303 304
304 if (codeType == TaskTypeEnum.MODBUS_RTU) { 305 if (codeType == TaskTypeEnum.MODBUS_RTU) {
@@ -286,6 +286,7 @@ export const useSocket = (dataSourceRef: Ref<WidgetDataType[]>) => { @@ -286,6 +286,7 @@ export const useSocket = (dataSourceRef: Ref<WidgetDataType[]>) => {
286 throw Error(error as string); 286 throw Error(error as string);
287 } 287 }
288 }, 288 },
  289 + autoReconnect: true,
289 }); 290 });
290 291
291 const initSubscribe = () => { 292 const initSubscribe = () => {