Showing
5 changed files
with
34 additions
and
4 deletions
1 | <script lang="ts" setup> | 1 | <script lang="ts" setup> |
2 | import { Card, Select, Tag, Form, Button } from 'ant-design-vue'; | 2 | import { Card, Select, Tag, Form, Button } from 'ant-design-vue'; |
3 | - import { ref, toRaw, unref, watch } from 'vue'; | 3 | + import { nextTick, ref, toRaw, unref, watch } from 'vue'; |
4 | import { MessageTypesEnum, MessageTypesNameEnum } from '../../../enum/form'; | 4 | import { MessageTypesEnum, MessageTypesNameEnum } from '../../../enum/form'; |
5 | import { JSONEditor } from '/@/components/CodeEditor'; | 5 | import { JSONEditor } from '/@/components/CodeEditor'; |
6 | import { Icon } from '/@/components/Icon'; | 6 | import { Icon } from '/@/components/Icon'; |
@@ -38,6 +38,8 @@ | @@ -38,6 +38,8 @@ | ||
38 | (eventName: 'save', value: Value): void; | 38 | (eventName: 'save', value: Value): void; |
39 | }>(); | 39 | }>(); |
40 | 40 | ||
41 | + const jsonEditor = ref<InstanceType<typeof JSONEditor>>(); | ||
42 | + | ||
41 | const messageType = ref(MessageTypesEnum.POST_TELEMETRY_REQUEST); | 43 | const messageType = ref(MessageTypesEnum.POST_TELEMETRY_REQUEST); |
42 | const messageTypeOptions = Object.keys(MessageTypesEnum).map((value) => ({ | 44 | const messageTypeOptions = Object.keys(MessageTypesEnum).map((value) => ({ |
43 | label: MessageTypesNameEnum[value], | 45 | label: MessageTypesNameEnum[value], |
@@ -118,6 +120,8 @@ | @@ -118,6 +120,8 @@ | ||
118 | const result = await executeTestScript(); | 120 | const result = await executeTestScript(); |
119 | 121 | ||
120 | outputContent.value = result; | 122 | outputContent.value = result; |
123 | + await nextTick(); | ||
124 | + unref(jsonEditor)?.handleFormat(); | ||
121 | }; | 125 | }; |
122 | 126 | ||
123 | const handleSave = async () => { | 127 | const handleSave = async () => { |
@@ -196,6 +200,7 @@ | @@ -196,6 +200,7 @@ | ||
196 | <Card class="w-full h-full"> | 200 | <Card class="w-full h-full"> |
197 | <JSONEditor | 201 | <JSONEditor |
198 | v-model:value="outputContent" | 202 | v-model:value="outputContent" |
203 | + ref="jsonEditor" | ||
199 | title="输出" | 204 | title="输出" |
200 | class="flex-auto" | 205 | class="flex-auto" |
201 | height="100%" | 206 | height="100%" |
@@ -2,6 +2,14 @@ import { BasicColumn, FormSchema } from '/@/components/Table'; | @@ -2,6 +2,14 @@ import { BasicColumn, FormSchema } from '/@/components/Table'; | ||
2 | import { h } from 'vue'; | 2 | import { h } from 'vue'; |
3 | import { Tag } from 'ant-design-vue'; | 3 | import { Tag } from 'ant-design-vue'; |
4 | import moment from 'moment'; | 4 | import moment from 'moment'; |
5 | +// import { | ||
6 | +// ClearAlarmFieldsEnum, | ||
7 | +// ClearAlarmFieldsNameEnum, | ||
8 | +// } from '../../designer/enum/formField/action'; | ||
9 | +import { useComponentRegister } from '/@/components/Form'; | ||
10 | +import { JavascriptEditorWithTestModal } from '../../designer/src/components/JavaScriptFilterModal'; | ||
11 | + | ||
12 | +useComponentRegister('JavascriptEditorWithTestModal', JavascriptEditorWithTestModal); | ||
5 | 13 | ||
6 | export enum StatusEnum { | 14 | export enum StatusEnum { |
7 | ENABLE = 1, | 15 | ENABLE = 1, |
@@ -129,11 +137,25 @@ export const formSchema: FormSchema[] = [ | @@ -129,11 +137,25 @@ export const formSchema: FormSchema[] = [ | ||
129 | placeholder: '请输入说明', | 137 | placeholder: '请输入说明', |
130 | }, | 138 | }, |
131 | }, | 139 | }, |
140 | + // { | ||
141 | + // field: 'function', | ||
142 | + // label: '', | ||
143 | + // component: 'Input', | ||
144 | + // slot: 'function', | ||
145 | + // }, | ||
132 | { | 146 | { |
133 | field: 'function', | 147 | field: 'function', |
134 | - label: '', | ||
135 | - component: 'Input', | ||
136 | - slot: 'function', | 148 | + component: 'JavascriptEditorWithTestModal', |
149 | + label: '转换函数', | ||
150 | + changeEvent: 'update:value', | ||
151 | + componentProps: { | ||
152 | + javaScriptEditorProps: { | ||
153 | + functionName: 'Details', | ||
154 | + paramsName: ['msg', 'metadata', 'msgType'], | ||
155 | + scriptType: 'json', | ||
156 | + }, | ||
157 | + buttonName: '测试转换功能', | ||
158 | + }, | ||
137 | }, | 159 | }, |
138 | { | 160 | { |
139 | field: 'id', | 161 | field: 'id', |
@@ -111,6 +111,7 @@ | @@ -111,6 +111,7 @@ | ||
111 | aceEditor.value.setValue( | 111 | aceEditor.value.setValue( |
112 | jsScript ?? 'return {msg: msg, metadata: metadata, msgType: msgType};' | 112 | jsScript ?? 'return {msg: msg, metadata: metadata, msgType: msgType};' |
113 | ); | 113 | ); |
114 | + setFieldsValue({ function: 'return {msg: msg, metadata: metadata, msgType: msgType};' }); | ||
114 | beautify(aceEditor.value.session); | 115 | beautify(aceEditor.value.session); |
115 | }; | 116 | }; |
116 | 117 |