1
|
<script lang="ts" setup>
|
1
|
<script lang="ts" setup>
|
2
|
import { Button } from 'ant-design-vue';
|
2
|
import { Button } from 'ant-design-vue';
|
3
|
import { nextTick, ref, watch } from 'vue';
|
3
|
import { nextTick, ref, watch } from 'vue';
|
|
|
4
|
+ import { findDictItemByCode } from '/@/api/system/dict';
|
4
|
import { BasicForm, useForm } from '/@/components/Form';
|
5
|
import { BasicForm, useForm } from '/@/components/Form';
|
5
|
import { BasicModal } from '/@/components/Modal';
|
6
|
import { BasicModal } from '/@/components/Modal';
|
6
|
-
|
7
|
+ import { DictEnum } from '/@/enums/dictEnum';
|
|
|
8
|
+ import { PlusCircleOutlined } from '@ant-design/icons-vue';
|
7
|
const show = ref(false);
|
9
|
const show = ref(false);
|
8
|
|
10
|
|
9
|
const props = withDefaults(
|
11
|
const props = withDefaults(
|
|
@@ -18,28 +20,48 @@ |
|
@@ -18,28 +20,48 @@ |
18
|
|
20
|
|
19
|
const emit = defineEmits(['update:value']);
|
21
|
const emit = defineEmits(['update:value']);
|
20
|
|
22
|
|
21
|
- const [registerForm, { setFieldsValue, getFieldsValue, setProps }] = useForm({
|
|
|
22
|
- schemas: [
|
|
|
23
|
- {
|
|
|
24
|
- field: 'registerAddress',
|
|
|
25
|
- component: 'Input',
|
|
|
26
|
- label: '寄存器地址',
|
|
|
27
|
- componentProps: {
|
|
|
28
|
- placeholder: '请输入寄存器地址',
|
23
|
+ const [registerForm, { setFieldsValue, getFieldsValue, setProps, validate, resetFields }] =
|
|
|
24
|
+ useForm({
|
|
|
25
|
+ schemas: [
|
|
|
26
|
+ {
|
|
|
27
|
+ field: 'registerAddress',
|
|
|
28
|
+ component: 'InputNumber',
|
|
|
29
|
+ label: '寄存器地址',
|
|
|
30
|
+ rules: [{ message: '请输入寄存器地址', required: true }],
|
|
|
31
|
+ componentProps: {
|
|
|
32
|
+ max: parseInt('ffff', 16),
|
|
|
33
|
+ placeholder: '请输入寄存器地址',
|
|
|
34
|
+ },
|
|
|
35
|
+ },
|
|
|
36
|
+ {
|
|
|
37
|
+ field: 'dataType',
|
|
|
38
|
+ component: 'ApiSelect',
|
|
|
39
|
+ label: '数据格式',
|
|
|
40
|
+ rules: [{ message: '请选择数据格式', required: true }],
|
|
|
41
|
+ componentProps: {
|
|
|
42
|
+ api: findDictItemByCode,
|
|
|
43
|
+ params: {
|
|
|
44
|
+ dictCode: DictEnum.REGISTER_DATA_FORMAT,
|
|
|
45
|
+ },
|
|
|
46
|
+ labelField: 'itemText',
|
|
|
47
|
+ valueField: 'itemValue',
|
|
|
48
|
+ placeholder: '请选择数据格式',
|
|
|
49
|
+ },
|
29
|
},
|
50
|
},
|
30
|
- },
|
|
|
31
|
- ],
|
|
|
32
|
- showActionButtonGroup: false,
|
|
|
33
|
- });
|
51
|
+ ],
|
|
|
52
|
+ showActionButtonGroup: false,
|
|
|
53
|
+ });
|
34
|
|
54
|
|
35
|
const handleClick = async () => {
|
55
|
const handleClick = async () => {
|
36
|
show.value = true;
|
56
|
show.value = true;
|
37
|
await nextTick();
|
57
|
await nextTick();
|
|
|
58
|
+ resetFields();
|
38
|
setProps({ disabled: props.disabled });
|
59
|
setProps({ disabled: props.disabled });
|
39
|
setFieldsValue(props.value);
|
60
|
setFieldsValue(props.value);
|
40
|
};
|
61
|
};
|
41
|
|
62
|
|
42
|
- const handleSubmit = () => {
|
63
|
+ const handleSubmit = async () => {
|
|
|
64
|
+ await validate();
|
43
|
const value = getFieldsValue();
|
65
|
const value = getFieldsValue();
|
44
|
emit('update:value', value);
|
66
|
emit('update:value', value);
|
45
|
show.value = false;
|
67
|
show.value = false;
|
|
@@ -55,9 +77,17 @@ |
|
@@ -55,9 +77,17 @@ |
55
|
|
77
|
|
56
|
<template>
|
78
|
<template>
|
57
|
<section>
|
79
|
<section>
|
58
|
- <Button type="link" @click="handleClick">新增扩展描述</Button>
|
80
|
+ <Button type="link" @click="handleClick"><PlusCircleOutlined />新增扩展描述</Button>
|
59
|
<BasicModal title="扩展描述" v-model:visible="show" @ok="handleSubmit">
|
81
|
<BasicModal title="扩展描述" v-model:visible="show" @ok="handleSubmit">
|
60
|
- <BasicForm @register="registerForm" />
|
82
|
+ <BasicForm class="extension-form" @register="registerForm" />
|
61
|
</BasicModal>
|
83
|
</BasicModal>
|
62
|
</section>
|
84
|
</section>
|
63
|
</template>
|
85
|
</template>
|
|
|
86
|
+
|
|
|
87
|
+<style lang="less" scoped>
|
|
|
88
|
+ .extension-form {
|
|
|
89
|
+ :deep(.ant-input-number) {
|
|
|
90
|
+ width: 100%;
|
|
|
91
|
+ }
|
|
|
92
|
+ }
|
|
|
93
|
+</style> |