feat: improve tab schema designer

This commit is contained in:
chenos 2022-03-06 20:38:02 +08:00
parent e76eb1edac
commit b1aee77d10
2 changed files with 41 additions and 17 deletions

View File

@ -1,23 +1,47 @@
import { useField } from '@formily/react';
import { ISchema, useField, useFieldSchema } from '@formily/react';
import React from 'react';
import { useTranslation } from 'react-i18next';
import { useDesignable } from '../..';
import { GeneralSchemaDesigner, SchemaSettings } from '../../../';
export const TabsDesigner = () => {
const field = useField();
const fieldSchema = useFieldSchema();
const { dn } = useDesignable();
const { t } = useTranslation();
return (
<GeneralSchemaDesigner>
<SchemaSettings.Popup
schema={{
type: 'void',
'x-component': 'Action.Modal',
'x-decorator': 'Form',
'x-component-props': {
title: '标题',
<SchemaSettings.ModalItem
title={t('Edit')}
schema={
{
type: 'object',
title: t('Edit tab'),
properties: {
title: {
title: t('Tab name'),
'x-decorator': 'FormItem',
'x-component': 'Input',
'x-component-props': {},
},
},
} as ISchema
}
initialValues={{ title: field.title }}
onSubmit={({ title }) => {
if (title) {
fieldSchema.title = title;
field.title = title;
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
title,
},
});
dn.refresh();
}
}}
>
</SchemaSettings.Popup>
/>
<SchemaSettings.Divider />
<SchemaSettings.Remove />
</GeneralSchemaDesigner>

View File

@ -49,16 +49,16 @@ export const TabPaneInitializers = () => {
},
type: 'dashed',
},
title: '添加标签页',
title: '{{t("Add tab")}}',
properties: {
drawer1: {
'x-decorator': 'Form',
'x-component': 'Action.Modal',
type: 'void',
title: 'Drawer Title',
title: '{{t("Add tab")}}',
properties: {
title: {
title: '标题',
title: '{{t("Tab name")}}',
required: true,
'x-component': 'Input',
'x-decorator': 'FormItem',
@ -68,7 +68,7 @@ export const TabPaneInitializers = () => {
type: 'void',
properties: {
cancel: {
title: 'Cancel',
title: '{{t("Cancel")}}',
'x-component': 'Action',
'x-component-props': {
useAction: () => {
@ -82,7 +82,7 @@ export const TabPaneInitializers = () => {
},
},
submit: {
title: 'Submit',
title: '{{t("Submit")}}',
'x-component': 'Action',
'x-component-props': {
type: 'primary',