Commit 5d00b4036f7db61f99f10d2803736d3535a338d0

Authored by loveumiko
1 parent 80350bc2

fix: 修复脚本管理规则链转换脚本数据保存问题

... ... @@ -6,22 +6,10 @@
6 6 @register="register"
7 7 width="500px"
8 8 @ok="handleSubmit"
  9 + destroyOnClose
9 10 showFooter
10 11 >
11   - <BasicForm @register="registerForm">
12   - <template #function>
13   - <Card title="转换函数" :bodyStyle="{ padding: 0, height: '280px' }">
14   - <template #extra>
15   - <Tag color="blue">Transform Function</Tag>
16   - <a-button @click="handleFormat" size="small">格式化</a-button>
17   - </template>
18   - <div class="ml-8">function Transform(msg, metadata, msgType) {</div>
19   - <div ref="aceRef" class="overflow-hidden"></div>
20   - <div class="ml-7">}</div>
21   - </Card>
22   - <a-button type="primary" class="mt-4" @click="testTransformFunc">测试转换功能</a-button>
23   - </template>
24   - </BasicForm>
  12 + <BasicForm @register="registerForm" />
25 13 </BasicDrawer>
26 14 </div>
27 15 </template>
... ... @@ -31,30 +19,19 @@
31 19 import { useDrawerInner, BasicDrawer } from '/@/components/Drawer/index';
32 20 import { useForm, BasicForm } from '/@/components/Form/index';
33 21 import { formSchema } from '../config/config.data';
34   - import { Card, Tag } from 'ant-design-vue';
35 22 import { createOrEditTransformScriptApi } from '/@/api/device/TransformScriptApi';
36 23 import { useMessage } from '/@/hooks/web/useMessage';
37   - import ace from 'ace-builds';
38   - import 'ace-builds/src-noconflict/theme-chrome'; // 默认设置的主题
39   - import 'ace-builds/src-noconflict/theme-terminal'; // 默认设置的主题
40   - import 'ace-builds/src-noconflict/mode-javascript'; // 默认设置的语言模式
41   - import { beautify } from 'ace-builds/src-noconflict/ext-beautify.js';
42   - import { useAppStore } from '/@/store/modules/app';
43 24
44 25 const emit = defineEmits(['register', 'isStatus', 'success']);
45   - const userStore = useAppStore();
46   - const getAceClass = computed((): string => userStore.getDarkMode);
47 26 const isUpdate: any = ref(false);
48 27 const isView = ref(true);
49   - const aceEditor = ref();
50   - const aceRef = ref();
51 28 const getTitle = computed(() => (isUpdate.value ? '编辑转换脚本' : '新增转换脚本'));
52 29 const editId = ref('');
  30 +
53 31 const [register, { setDrawerProps, closeDrawer }] = useDrawerInner((data) => {
54 32 resetFields();
55 33 setDrawerProps({ confirmLoading: false });
56 34 isUpdate.value = data.isUpdate;
57   - initEditor(data.record?.configuration.jsScript);
58 35 switch (isUpdate.value) {
59 36 case 'view':
60 37 isView.value = false;
... ... @@ -64,7 +41,7 @@
64 41 loading: false,
65 42 });
66 43 editId.value = data.record.id;
67   - setFieldsValue(data.record);
  44 + setFieldsValue({ ...data.record, function: data.record?.configuration?.jsScript });
68 45 break;
69 46 case true:
70 47 isView.value = true;
... ... @@ -74,7 +51,7 @@
74 51 loading: false,
75 52 });
76 53 editId.value = data.record.id;
77   - setFieldsValue(data.record);
  54 + setFieldsValue({ ...data.record, function: data.record?.configuration?.jsScript });
78 55 break;
79 56 case false:
80 57 isView.value = true;
... ... @@ -88,38 +65,10 @@
88 65 });
89 66 const [registerForm, { validate, setFieldsValue, resetFields }] = useForm({
90 67 showActionButtonGroup: false,
91   - colProps: { span: 24 },
  68 + baseColProps: { span: 24 },
92 69 schemas: formSchema,
93 70 });
94 71
95   - // 初始化编辑器
96   - const initEditor = (jsScript?: string) => {
97   - aceEditor.value = ace.edit(aceRef.value, {
98   - maxLines: 12, // 最大行数,超过会自动出现滚动条
99   - minLines: 12, // 最小行数,还未到最大行数时,编辑器会自动伸缩大小
100   - fontSize: 14, // 编辑器内字体大小
101   - theme: 'ace/theme/chrome', // 默认设置的主题
102   - mode: 'ace/mode/javascript', // 默认设置的语言模式
103   - tabSize: 2, // 制表符设置为 4 个空格大小
104   - });
105   -
106   - aceEditor.value.setOptions({
107   - enableBasicAutocompletion: true,
108   - enableLiveAutocompletion: true,
109   - theme: getAceClass.value === 'dark' ? 'ace/theme/terminal' : 'ace/theme/chrome',
110   - });
111   - aceEditor.value.setValue(
112   - jsScript ?? 'return {msg: msg, metadata: metadata, msgType: msgType};'
113   - );
114   - setFieldsValue({ function: 'return {msg: msg, metadata: metadata, msgType: msgType};' });
115   - beautify(aceEditor.value.session);
116   - };
117   -
118   - const testTransformFunc = () => {
119   - closeDrawer();
120   - const jsCode = aceEditor.value.getValue();
121   - emit('isStatus', { status: 1, jsCode });
122   - };
123 72 const handleSubmit = async () => {
124 73 const editIdPost = isUpdate.value ? { id: editId.value } : {};
125 74 try {
... ... @@ -128,7 +77,7 @@
128 77 if (!fieldsValue) return;
129 78 await createOrEditTransformScriptApi({
130 79 configuration: {
131   - jsScript: aceEditor.value.getValue(),
  80 + jsScript: fieldsValue.function,
132 81 },
133 82 type: 'org.thingsboard.rule.engine.transform.TbTransformMsgNode',
134 83 ...fieldsValue,
... ... @@ -145,8 +94,4 @@
145 94 }, 300);
146 95 }
147 96 };
148   - const handleFormat = () => {
149   - beautify(aceEditor.value.session);
150   - };
151   - defineExpose({ aceEditor });
152 97 </script>
... ...