mirror of
https://github.com/jeecgboot/JeecgBoot.git
synced 2025-12-23 06:16:42 +08:00
前端和后端源码,合并到一个git仓库中,方便用户下载,避免前后端不匹配的问题
This commit is contained in:
81
jeecgboot-vue3/src/views/demo/comp/modal/Modal4.vue
Normal file
81
jeecgboot-vue3/src/views/demo/comp/modal/Modal4.vue
Normal file
@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<BasicModal v-bind="$attrs" @register="register" title="Modal Title" @visible-change="handleVisibleChange">
|
||||
<div class="pt-3px pr-3px">
|
||||
<BasicForm @register="registerForm" :model="model" />
|
||||
</div>
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref, nextTick } from 'vue';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
|
||||
|
||||
const schemas: FormSchema[] = [
|
||||
{
|
||||
field: 'field1',
|
||||
component: 'Input',
|
||||
label: '字段1',
|
||||
colProps: {
|
||||
span: 24,
|
||||
},
|
||||
defaultValue: '111',
|
||||
},
|
||||
{
|
||||
field: 'field2',
|
||||
component: 'Input',
|
||||
label: '字段2',
|
||||
colProps: {
|
||||
span: 24,
|
||||
},
|
||||
},
|
||||
];
|
||||
export default defineComponent({
|
||||
components: { BasicModal, BasicForm },
|
||||
props: {
|
||||
userData: { type: Object },
|
||||
},
|
||||
setup(props) {
|
||||
const modelRef = ref({});
|
||||
const [
|
||||
registerForm,
|
||||
{
|
||||
// setFieldsValue,
|
||||
// setProps
|
||||
},
|
||||
] = useForm({
|
||||
labelWidth: 120,
|
||||
schemas,
|
||||
showActionButtonGroup: false,
|
||||
actionColOptions: {
|
||||
span: 24,
|
||||
},
|
||||
});
|
||||
|
||||
const [register] = useModalInner((data) => {
|
||||
data && onDataReceive(data);
|
||||
});
|
||||
|
||||
function onDataReceive(data) {
|
||||
console.log('Data Received', data);
|
||||
// 方式1;
|
||||
// setFieldsValue({
|
||||
// field2: data.data,
|
||||
// field1: data.info,
|
||||
// });
|
||||
|
||||
// // 方式2
|
||||
modelRef.value = { field2: data.data, field1: data.info };
|
||||
|
||||
// setProps({
|
||||
// model:{ field2: data.data, field1: data.info }
|
||||
// })
|
||||
}
|
||||
|
||||
function handleVisibleChange(v) {
|
||||
v && props.userData && nextTick(() => onDataReceive(props.userData));
|
||||
}
|
||||
|
||||
return { register, schemas, registerForm, model: modelRef, handleVisibleChange };
|
||||
},
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user