Showing
9 changed files
with
113 additions
and
10 deletions
@@ -51,6 +51,7 @@ export interface ModelOfMatterParams { | @@ -51,6 +51,7 @@ export interface ModelOfMatterParams { | ||
51 | callType?: string; | 51 | callType?: string; |
52 | eventType?: string; | 52 | eventType?: string; |
53 | accessMode?: string; | 53 | accessMode?: string; |
54 | + extensionDesc?: Recordable; | ||
54 | } | 55 | } |
55 | 56 | ||
56 | export interface GetModelTslParams { | 57 | export interface GetModelTslParams { |
@@ -39,6 +39,8 @@ import CustomMinMaxInput from './externalCompns/components/CustomMinMaxInput.vue | @@ -39,6 +39,8 @@ import CustomMinMaxInput from './externalCompns/components/CustomMinMaxInput.vue | ||
39 | import StructForm from './externalCompns/components/StructForm/StructForm.vue'; | 39 | import StructForm from './externalCompns/components/StructForm/StructForm.vue'; |
40 | import ApiSelectScrollLoad from './components/ApiSelectScrollLoad.vue'; | 40 | import ApiSelectScrollLoad from './components/ApiSelectScrollLoad.vue'; |
41 | import InputGroup from './components/InputGroup.vue'; | 41 | import InputGroup from './components/InputGroup.vue'; |
42 | +import RegisterAddressInput from '/@/views/task/center/components/PollCommandInput/RegisterAddressInput.vue'; | ||
43 | +import ExtendDesc from '/@/components/Form/src/externalCompns/components/ExtendDesc/index.vue'; | ||
42 | 44 | ||
43 | const componentMap = new Map<ComponentType, Component>(); | 45 | const componentMap = new Map<ComponentType, Component>(); |
44 | 46 | ||
@@ -85,6 +87,8 @@ componentMap.set('CustomMinMaxInput', CustomMinMaxInput); | @@ -85,6 +87,8 @@ componentMap.set('CustomMinMaxInput', CustomMinMaxInput); | ||
85 | componentMap.set('StructForm', StructForm); | 87 | componentMap.set('StructForm', StructForm); |
86 | componentMap.set('ApiSelectScrollLoad', ApiSelectScrollLoad); | 88 | componentMap.set('ApiSelectScrollLoad', ApiSelectScrollLoad); |
87 | componentMap.set('InputGroup', InputGroup); | 89 | componentMap.set('InputGroup', InputGroup); |
90 | +componentMap.set('RegisterAddressInput', RegisterAddressInput); | ||
91 | +componentMap.set('ExtendDesc', ExtendDesc); | ||
88 | 92 | ||
89 | export function add(compName: ComponentType, component: Component) { | 93 | export function add(compName: ComponentType, component: Component) { |
90 | componentMap.set(compName, component); | 94 | componentMap.set(compName, component); |
1 | +<script lang="ts" setup> | ||
2 | + import { Button } from 'ant-design-vue'; | ||
3 | + import { nextTick, ref, watch } from 'vue'; | ||
4 | + import { BasicForm, useForm } from '/@/components/Form'; | ||
5 | + import { BasicModal } from '/@/components/Modal'; | ||
6 | + | ||
7 | + const show = ref(false); | ||
8 | + | ||
9 | + const props = withDefaults( | ||
10 | + defineProps<{ | ||
11 | + value?: object; | ||
12 | + disabled?: boolean; | ||
13 | + }>(), | ||
14 | + { | ||
15 | + value: () => ({}), | ||
16 | + } | ||
17 | + ); | ||
18 | + | ||
19 | + const emit = defineEmits(['update:value']); | ||
20 | + | ||
21 | + const [registerForm, { setFieldsValue, getFieldsValue, setProps }] = useForm({ | ||
22 | + schemas: [ | ||
23 | + { | ||
24 | + field: 'registerAddress', | ||
25 | + component: 'Input', | ||
26 | + label: '寄存器地址', | ||
27 | + componentProps: { | ||
28 | + placeholder: '请输入寄存器地址', | ||
29 | + }, | ||
30 | + }, | ||
31 | + ], | ||
32 | + showActionButtonGroup: false, | ||
33 | + }); | ||
34 | + | ||
35 | + const handleClick = async () => { | ||
36 | + show.value = true; | ||
37 | + await nextTick(); | ||
38 | + setProps({ disabled: props.disabled }); | ||
39 | + setFieldsValue(props.value); | ||
40 | + }; | ||
41 | + | ||
42 | + const handleSubmit = () => { | ||
43 | + const value = getFieldsValue(); | ||
44 | + emit('update:value', value); | ||
45 | + show.value = false; | ||
46 | + }; | ||
47 | + | ||
48 | + watch( | ||
49 | + () => props.value, | ||
50 | + (value) => { | ||
51 | + setFieldsValue(value); | ||
52 | + } | ||
53 | + ); | ||
54 | +</script> | ||
55 | + | ||
56 | +<template> | ||
57 | + <section> | ||
58 | + <Button type="link" @click="handleClick">新增扩展描述</Button> | ||
59 | + <BasicModal title="扩展描述" v-model:visible="show" @ok="handleSubmit"> | ||
60 | + <BasicForm @register="registerForm" /> | ||
61 | + </BasicModal> | ||
62 | + </section> | ||
63 | +</template> |
@@ -28,7 +28,7 @@ export const validateJSON = (_rule, value = [] as ModelOfMatterParams[], _callba | @@ -28,7 +28,7 @@ export const validateJSON = (_rule, value = [] as ModelOfMatterParams[], _callba | ||
28 | return Promise.reject('JSON对象不能为空'); | 28 | return Promise.reject('JSON对象不能为空'); |
29 | }; | 29 | }; |
30 | 30 | ||
31 | -export const formSchemas = (hasStructForm: boolean): FormSchema[] => { | 31 | +export const formSchemas = (hasStructForm: boolean, isTcp = false): FormSchema[] => { |
32 | return [ | 32 | return [ |
33 | { | 33 | { |
34 | field: FormField.FUNCTION_NAME, | 34 | field: FormField.FUNCTION_NAME, |
@@ -276,6 +276,27 @@ export const formSchemas = (hasStructForm: boolean): FormSchema[] => { | @@ -276,6 +276,27 @@ export const formSchemas = (hasStructForm: boolean): FormSchema[] => { | ||
276 | ifShow: ({ values }) => values[FormField.TYPE] === DataTypeEnum.IS_STRING, | 276 | ifShow: ({ values }) => values[FormField.TYPE] === DataTypeEnum.IS_STRING, |
277 | }, | 277 | }, |
278 | { | 278 | { |
279 | + field: FormField.EXTENSION_DESC, | ||
280 | + component: 'ExtendDesc', | ||
281 | + label: '扩展描述', | ||
282 | + valueField: 'value', | ||
283 | + changeEvent: 'update:value', | ||
284 | + rules: [ | ||
285 | + { | ||
286 | + message: '请输入扩展描述', | ||
287 | + required: true, | ||
288 | + validator(_rule, value, _callback) { | ||
289 | + if (!value?.['registerAddress']) return Promise.reject('请输入寄存器地址'); | ||
290 | + return Promise.resolve(); | ||
291 | + }, | ||
292 | + }, | ||
293 | + ], | ||
294 | + ifShow: isTcp, | ||
295 | + colProps: { | ||
296 | + span: 16, | ||
297 | + }, | ||
298 | + }, | ||
299 | + { | ||
279 | field: FormField.ACCESS_MODE, | 300 | field: FormField.ACCESS_MODE, |
280 | component: 'ApiRadioGroup', | 301 | component: 'ApiRadioGroup', |
281 | label: '读写类型', | 302 | label: '读写类型', |
@@ -129,4 +129,5 @@ export type ComponentType = | @@ -129,4 +129,5 @@ export type ComponentType = | ||
129 | | 'RegisterAddressInput' | 129 | | 'RegisterAddressInput' |
130 | | 'ControlGroup' | 130 | | 'ControlGroup' |
131 | | 'JSONEditor' | 131 | | 'JSONEditor' |
132 | - | 'OrgTreeSelect'; | 132 | + | 'OrgTreeSelect' |
133 | + | 'ExtendDesc'; |
@@ -30,6 +30,7 @@ | @@ -30,6 +30,7 @@ | ||
30 | <Attribute | 30 | <Attribute |
31 | v-if="activeKey === FunctionType.PROPERTIES" | 31 | v-if="activeKey === FunctionType.PROPERTIES" |
32 | :openModalMode="openModalMode" | 32 | :openModalMode="openModalMode" |
33 | + :transportType="record.transportType" | ||
33 | ref="AttrRef" | 34 | ref="AttrRef" |
34 | /> | 35 | /> |
35 | <Service | 36 | <Service |
@@ -13,12 +13,13 @@ | @@ -13,12 +13,13 @@ | ||
13 | import { isArray } from 'lodash'; | 13 | import { isArray } from 'lodash'; |
14 | import { OpenModelMode } from '../types'; | 14 | import { OpenModelMode } from '../types'; |
15 | import { formSchemas } from '/@/components/Form/src/externalCompns/components/StructForm/config'; | 15 | import { formSchemas } from '/@/components/Form/src/externalCompns/components/StructForm/config'; |
16 | + import { TransportTypeEnum } from '../../../../components/TransportDescript/const'; | ||
16 | 17 | ||
17 | - defineProps<{ openModalMode: OpenModelMode }>(); | 18 | + const props = defineProps<{ openModalMode: OpenModelMode; transportType: string }>(); |
18 | 19 | ||
19 | const [register, { validate, resetFields, setFieldsValue, setProps }] = useForm({ | 20 | const [register, { validate, resetFields, setFieldsValue, setProps }] = useForm({ |
20 | labelWidth: 100, | 21 | labelWidth: 100, |
21 | - schemas: formSchemas(false), | 22 | + schemas: formSchemas(false, props.transportType === TransportTypeEnum.TCP), |
22 | actionColOptions: { | 23 | actionColOptions: { |
23 | span: 14, | 24 | span: 14, |
24 | }, | 25 | }, |
@@ -37,13 +38,13 @@ | @@ -37,13 +38,13 @@ | ||
37 | const { functionName, remark, identifier, accessMode } = _values; | 38 | const { functionName, remark, identifier, accessMode } = _values; |
38 | const structJSON = transfromToStructJSON(_values); | 39 | const structJSON = transfromToStructJSON(_values); |
39 | const dataType = excludeIdInStructJSON(structJSON.dataType!); | 40 | const dataType = excludeIdInStructJSON(structJSON.dataType!); |
40 | - | ||
41 | const value = { | 41 | const value = { |
42 | functionName, | 42 | functionName, |
43 | functionType: FunctionType.PROPERTIES, | 43 | functionType: FunctionType.PROPERTIES, |
44 | remark, | 44 | remark, |
45 | identifier, | 45 | identifier, |
46 | accessMode, | 46 | accessMode, |
47 | + extensionDesc: _values.extensionDesc, | ||
47 | functionJson: { | 48 | functionJson: { |
48 | dataType: dataType, | 49 | dataType: dataType, |
49 | }, | 50 | }, |
@@ -67,7 +68,6 @@ | @@ -67,7 +68,6 @@ | ||
67 | ...dataType, | 68 | ...dataType, |
68 | ...(isArray(specs) ? specs : { ...specs }), | 69 | ...(isArray(specs) ? specs : { ...specs }), |
69 | }; | 70 | }; |
70 | - | ||
71 | setFieldsValue(value); | 71 | setFieldsValue(value); |
72 | }; | 72 | }; |
73 | 73 |
@@ -24,7 +24,8 @@ export enum FormField { | @@ -24,7 +24,8 @@ export enum FormField { | ||
24 | EVENT_TYPE = 'eventType', | 24 | EVENT_TYPE = 'eventType', |
25 | SERVICE_COMMAND = 'serviceCommand', | 25 | SERVICE_COMMAND = 'serviceCommand', |
26 | ACCESS_MODE = 'accessMode', | 26 | ACCESS_MODE = 'accessMode', |
27 | - | 27 | + REGISTER_ADDRESS = 'registerAddress', |
28 | + EXTENSION_DESC = 'extensionDesc', | ||
28 | STRUCT = 'struct', | 29 | STRUCT = 'struct', |
29 | } | 30 | } |
30 | 31 |
1 | <script lang="ts" setup> | 1 | <script lang="ts" setup> |
2 | import { InputGroup, InputNumber, Select, Input } from 'ant-design-vue'; | 2 | import { InputGroup, InputNumber, Select, Input } from 'ant-design-vue'; |
3 | - import { unref } from 'vue'; | 3 | + import { unref, watch } from 'vue'; |
4 | import { computed } from 'vue'; | 4 | import { computed } from 'vue'; |
5 | import { ref } from 'vue'; | 5 | import { ref } from 'vue'; |
6 | 6 | ||
@@ -13,10 +13,11 @@ | @@ -13,10 +13,11 @@ | ||
13 | 13 | ||
14 | const DEC_MAX_VALUE = parseInt('0xffff', 16); | 14 | const DEC_MAX_VALUE = parseInt('0xffff', 16); |
15 | 15 | ||
16 | - withDefaults( | 16 | + const props = withDefaults( |
17 | defineProps<{ | 17 | defineProps<{ |
18 | value?: number | string; | 18 | value?: number | string; |
19 | inputProps?: Recordable; | 19 | inputProps?: Recordable; |
20 | + disabled?: boolean; | ||
20 | }>(), | 21 | }>(), |
21 | { | 22 | { |
22 | value: 0, | 23 | value: 0, |
@@ -31,7 +32,7 @@ | @@ -31,7 +32,7 @@ | ||
31 | 32 | ||
32 | const type = ref(AddressTypeEnum.DEC); | 33 | const type = ref(AddressTypeEnum.DEC); |
33 | 34 | ||
34 | - const inputValue = ref<number | string>(0); | 35 | + const inputValue = ref<number | string>(props.value); |
35 | 36 | ||
36 | const getHexValue = computed(() => { | 37 | const getHexValue = computed(() => { |
37 | return parseInt(unref(inputValue) || 0, 16); | 38 | return parseInt(unref(inputValue) || 0, 16); |
@@ -61,6 +62,14 @@ | @@ -61,6 +62,14 @@ | ||
61 | inputValue.value = syncValue; | 62 | inputValue.value = syncValue; |
62 | emit('update:value', toDEC(syncValue)); | 63 | emit('update:value', toDEC(syncValue)); |
63 | }; | 64 | }; |
65 | + | ||
66 | + const stop = watch( | ||
67 | + () => props.value, | ||
68 | + (value) => { | ||
69 | + inputValue.value = value; | ||
70 | + stop(); | ||
71 | + } | ||
72 | + ); | ||
64 | </script> | 73 | </script> |
65 | 74 | ||
66 | <template> | 75 | <template> |
@@ -69,6 +78,7 @@ | @@ -69,6 +78,7 @@ | ||
69 | v-model:value="type" | 78 | v-model:value="type" |
70 | :options="addressTypeOptions" | 79 | :options="addressTypeOptions" |
71 | @change="handleChange" | 80 | @change="handleChange" |
81 | + :disabled="disabled" | ||
72 | class="bg-gray-200 max-w-20" | 82 | class="bg-gray-200 max-w-20" |
73 | /> | 83 | /> |
74 | <InputNumber | 84 | <InputNumber |
@@ -76,6 +86,7 @@ | @@ -76,6 +86,7 @@ | ||
76 | v-model:value="inputValue" | 86 | v-model:value="inputValue" |
77 | :step="1" | 87 | :step="1" |
78 | class="flex-1" | 88 | class="flex-1" |
89 | + :disabled="disabled" | ||
79 | v-bind="inputProps" | 90 | v-bind="inputProps" |
80 | @change="handleEmit" | 91 | @change="handleEmit" |
81 | /> | 92 | /> |