tachybase_todo/packages/plugins/import/src/client/ImportDesigner.tsx
被雨水过滤的空气-Rairn fd36c970bc
refactor(client)!: upgrade antd to v5 (#2078)
* refactor: change moment to dayjs

* refactor: remove antd css

* refactor: change @formily/antd to @formily/antd-v5

* chore: add dep

* chore: upgrade babel/core and typescript

* refactor: rename moment to dayjs

* fix(dayjs): add plugins

* refactor: fix type errors

* refactor: change default export to named export

* chore: upgrade ts-loader

* refactor: rename moment to dayjs

* refactor: fix type errors

* chore: upgrade deps for build

* fix: fix build errors

* fix: add antd reset css

* fix: fix build error

* chore: add __builtins__

* chore: optimize genStyleHook

* refactor(Calendar): less to css-in-js

* refactor(acl): less to css-in-js

* refactor(board): less to css-in-js

* chore: add antd-style

* refactor(acl): use antd-style

* refactor(board): use antd-style

* refactor: schema-initializer

* refactor: refactor genStyleHook

* refactor: kanban

* refactor: filter

* refactor: upload

* refactor: markdown

* refactor: rename className to componentCls

* refactor: rich-text

* style: fix style

* fix: fix merge error

* chore: update yarn.lock

* chore: upgrade formily

* style: fix pageHeader

* style: fix add button style

* style: fix header menu color

* chore: update yarn.lock

* chore: upgrade deps

* test: fix tests

* test: fix tests

* fix: fix build error

* fix: fix style of plugin doc

* fix: fix tests

* fix: fix drag bug

* refactor: remove useless code

* fix: fix Modal style (T-621)

* fix: fix box-shadow of subMenu (T-622)

* fix: fix style of linkage rules (T-623)

* fix: fix style of DataTemplate

* fix: fix style of variable (T-620)

* chore: update yarn.lock

* fix: avoid test failed

* test: fix error

* chore: update yarn.lock

* test: fix error

* test(dayjs): fix error

* fix: should delay show menu to avoid the menu not hidden

* test: skip failure test

* fix(mouseEnterDelay): change default value from 100 to 150

* test: avoid failed

* refactor: rename component names

* chore: optimize types

* chore: lock antd version

* fix: fix build

* fix: fix build

* fix: layout bg color use variable

* fix: fix style of buttons

* feat: remove theme config

* fix(calendar): fix style

* fix(mobile-client): fix dialog style

* fix: fix test

* refactor: make code gooder

* chore: change code

* fix: fix T-847

* fix: fix T-845

* fix: display block

* fix: danger button

* refactor: make tester better

* fix: change moment to dayjs

* fix: build error

* fix: import dayjs/plugin/isSameOrBefore

* refactor: downgrade @testing-library/react to fix warning

* fix: fix CI

* fix: upgrade deps to fix build

* fix: fix test

* fix: skip some filed tests to avoid error

* fix: fix build errors that maked by merge code

* refactor: remove moment

* fix: error

* feat: update doc

---------

Co-authored-by: chenos <chenlinxh@gmail.com>
2023-07-08 08:26:27 +08:00

122 lines
4.4 KiB
TypeScript

import { ArrayItems } from '@formily/antd-v5';
import type { ISchema } from '@formily/react';
import { useField, useFieldSchema } from '@formily/react';
import { GeneralSchemaDesigner, SchemaSettings, useDesignable } from '@nocobase/client';
import React, { useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { useShared } from './useShared';
export const ImportDesigner = () => {
const field = useField();
const fieldSchema = useFieldSchema();
const { t } = useTranslation();
const { dn } = useDesignable();
const [schema, setSchema] = useState<ISchema>();
const { importSettingsSchema } = useShared();
useEffect(() => {
setSchema(importSettingsSchema);
}, [field.address, fieldSchema?.['x-action-settings']?.['importSettings']]);
return (
<GeneralSchemaDesigner disableInitializer>
<SchemaSettings.ModalItem
title={t('Edit button')}
schema={
{
type: 'object',
title: t('Edit button'),
properties: {
title: {
'x-decorator': 'FormItem',
'x-component': 'Input',
title: t('Button title'),
default: fieldSchema.title,
'x-component-props': {},
// description: `原字段标题:${collectionField?.uiSchema?.title}`,
},
icon: {
'x-decorator': 'FormItem',
'x-component': 'IconPicker',
title: t('Button icon'),
default: fieldSchema?.['x-component-props']?.icon,
'x-component-props': {},
// description: `原字段标题:${collectionField?.uiSchema?.title}`,
},
type: {
'x-decorator': 'FormItem',
'x-component': 'Radio.Group',
title: t('Button background color'),
default: fieldSchema?.['x-component-props']?.danger
? 'danger'
: fieldSchema?.['x-component-props']?.type === 'primary'
? 'primary'
: 'default',
enum: [
{ value: 'default', label: '{{t("Default")}}' },
{ value: 'primary', label: '{{t("Highlight")}}' },
{ value: 'danger', label: '{{t("Danger red")}}' },
],
},
},
} as ISchema
}
onSubmit={({ title, icon, type }) => {
fieldSchema.title = title;
field.title = title;
field.componentProps.icon = icon;
field.componentProps.danger = type === 'danger';
field.componentProps.type = type;
fieldSchema['x-component-props'] = fieldSchema['x-component-props'] || {};
fieldSchema['x-component-props'].icon = icon;
fieldSchema['x-component-props'].danger = type === 'danger';
fieldSchema['x-component-props'].type = type;
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
title,
'x-component-props': {
...fieldSchema['x-component-props'],
},
},
});
dn.refresh();
}}
/>
<SchemaSettings.ActionModalItem
title={t('Importable fields')}
schema={schema}
initialValues={{ ...(fieldSchema?.['x-action-settings']?.importSettings ?? {}) }}
components={{ ArrayItems }}
onSubmit={({ importColumns, explain }) => {
const columns = importColumns
?.filter((fieldItem) => fieldItem?.dataIndex?.length)
.map((item) => ({
dataIndex: item.dataIndex.map((di) => di.name ?? di),
title: item.title,
}));
fieldSchema['x-action-settings']['importSettings'] = { importColumns: columns, explain };
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
'x-action-settings': fieldSchema['x-action-settings'],
},
});
dn.refresh();
}}
/>
<SchemaSettings.Divider />
<SchemaSettings.Remove
removeParentsIfNoChildren
breakRemoveOn={(s) => {
return s['x-component'] === 'Space' || s['x-component'].endsWith('ActionBar');
}}
confirm={{
title: t('Delete action'),
}}
/>
</GeneralSchemaDesigner>
);
};