From 56bd996bd42fec53fa4cdd1b31bb3c7347c6849f Mon Sep 17 00:00:00 2001 From: Junyi Date: Sat, 20 Aug 2022 18:03:51 +0800 Subject: [PATCH] refactor(client): split schema-initializer items into multiple files (#744) --- .../items/ActionInitializer.tsx | 7 + .../items/BlockInitializer.tsx | 17 + .../items/BulkDestroyActionInitializer.tsx | 21 + .../items/CalendarBlockInitializer.tsx | 88 ++ .../items/CollectionFieldInitializer.tsx | 9 + .../items/CreateActionInitializer.tsx | 53 + .../items/CreateFormBlockInitializer.tsx | 49 + .../items/CreateSubmitActionInitializer.tsx | 18 + .../items/CustomizeActionInitializer.tsx | 7 + .../items/DataBlockInitializer.tsx | 30 + .../items/DestroyActionInitializer.tsx | 21 + .../items/DetailsBlockInitializer.tsx | 23 + .../items/FilterActionInitializer.tsx | 18 + .../items/FormBlockInitializer.tsx | 25 + .../items/G2PlotInitializer.tsx | 17 + .../items/InitializerWithSwitch.tsx | 24 + .../items/KanbanBlockInitializer.tsx | 91 ++ .../items/MarkdownBlockInitializer.tsx | 28 + .../items/PrintActionInitializer.tsx | 17 + .../RecordAssociationBlockInitializer.tsx | 38 + ...ordAssociationCalendarBlockInitializer.tsx | 100 ++ ...cordAssociationDetailsBlockInitializer.tsx | 38 + .../RecordAssociationFormBlockInitializer.tsx | 61 + .../items/RecordFormBlockInitializer.tsx | 55 + ...dPrettyAssociationFormBlockInitializer.tsx | 61 + .../RecordReadPrettyFormBlockInitializer.tsx | 59 + .../items/SubmitActionInitializer.tsx | 18 + .../items/TableActionColumnInitializer.tsx | 27 + .../items/TableBlockInitializer.tsx | 23 + .../items/TableCollectionFieldInitializer.tsx | 9 + .../items/TableSelectorInitializer.tsx | 29 + .../items/UpdateActionInitializer.tsx | 53 + .../items/UpdateSubmitActionInitializer.tsx | 18 + .../items/ViewActionInitializer.tsx | 52 + .../src/schema-initializer/items/index.tsx | 1104 +---------------- 35 files changed, 1238 insertions(+), 1070 deletions(-) create mode 100644 packages/core/client/src/schema-initializer/items/ActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/BlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/BulkDestroyActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/CalendarBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/CollectionFieldInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/CreateActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/CreateFormBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/CreateSubmitActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/CustomizeActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/DataBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/DestroyActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/DetailsBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/FilterActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/FormBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/G2PlotInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/InitializerWithSwitch.tsx create mode 100644 packages/core/client/src/schema-initializer/items/KanbanBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/MarkdownBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/PrintActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/RecordAssociationBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/RecordAssociationCalendarBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/RecordAssociationDetailsBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/RecordAssociationFormBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/RecordFormBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/RecordReadPrettyAssociationFormBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/RecordReadPrettyFormBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/SubmitActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/TableActionColumnInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/TableBlockInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/TableCollectionFieldInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/TableSelectorInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/UpdateActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/UpdateSubmitActionInitializer.tsx create mode 100644 packages/core/client/src/schema-initializer/items/ViewActionInitializer.tsx diff --git a/packages/core/client/src/schema-initializer/items/ActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/ActionInitializer.tsx new file mode 100644 index 000000000..a33f56770 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/ActionInitializer.tsx @@ -0,0 +1,7 @@ +import React from 'react'; + +import { InitializerWithSwitch } from './InitializerWithSwitch'; + +export const ActionInitializer = (props) => { + return ; +}; diff --git a/packages/core/client/src/schema-initializer/items/BlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/BlockInitializer.tsx new file mode 100644 index 000000000..8e7d6b772 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/BlockInitializer.tsx @@ -0,0 +1,17 @@ +import React from 'react'; + +import { SchemaInitializer } from ".."; + +// Block +export const BlockInitializer = (props) => { + const { item, insert } = props; + return ( + { + insert({ + ...item.schema, + }); + }} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/BulkDestroyActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/BulkDestroyActionInitializer.tsx new file mode 100644 index 000000000..3a8de2872 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/BulkDestroyActionInitializer.tsx @@ -0,0 +1,21 @@ +import React from "react"; + +import { ActionInitializer } from "./ActionInitializer"; + +export const BulkDestroyActionInitializer = (props) => { + const schema = { + title: '{{ t("Delete") }}', + 'x-action': 'destroy', + 'x-component': 'Action', + 'x-designer': 'Action.Designer', + 'x-component-props': { + icon: 'DeleteOutlined', + confirm: { + title: "{{t('Delete record')}}", + content: "{{t('Are you sure you want to delete it?')}}", + }, + useProps: '{{ useBulkDestroyActionProps }}', + }, + }; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/CalendarBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/CalendarBlockInitializer.tsx new file mode 100644 index 000000000..aec48e115 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/CalendarBlockInitializer.tsx @@ -0,0 +1,88 @@ +import React, { useContext } from "react"; +import { FormDialog, FormLayout } from "@formily/antd"; +import { FormOutlined } from '@ant-design/icons'; +import { SchemaOptionsContext } from "@formily/react"; +import { useTranslation } from "react-i18next"; + +import { useCollectionManager } from "../../collection-manager"; +import { SchemaComponent, SchemaComponentOptions } from "../../schema-component"; +import { createCalendarBlockSchema } from "../utils"; +import { DataBlockInitializer } from "./DataBlockInitializer"; + +export const CalendarBlockInitializer = (props) => { + const { insert } = props; + const { t } = useTranslation(); + const { getCollection } = useCollectionManager(); + const options = useContext(SchemaOptionsContext); + return ( + } + onCreateBlockSchema={async ({ item }) => { + const collection = getCollection(item.name); + const stringFields = collection?.fields + ?.filter((field) => field.type === 'string') + ?.map((field) => { + return { + label: field?.uiSchema?.title, + value: field.name, + }; + }); + const dateFields = collection?.fields + ?.filter((field) => field.type === 'date') + ?.map((field) => { + return { + label: field?.uiSchema?.title, + value: field.name, + }; + }); + const values = await FormDialog(t('Create calendar block'), () => { + return ( + + + + + + ); + }).open({ + initialValues: {}, + }); + insert( + createCalendarBlockSchema({ + collection: item.name, + fieldNames: { + ...values, + }, + }), + ); + }} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/CollectionFieldInitializer.tsx b/packages/core/client/src/schema-initializer/items/CollectionFieldInitializer.tsx new file mode 100644 index 000000000..43255fde1 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/CollectionFieldInitializer.tsx @@ -0,0 +1,9 @@ +import React from "react"; +import { ISchema } from "@formily/react"; + +import { InitializerWithSwitch } from "./InitializerWithSwitch"; + +export const CollectionFieldInitializer = (props) => { + const schema: ISchema = {}; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/CreateActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/CreateActionInitializer.tsx new file mode 100644 index 000000000..697ace75b --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/CreateActionInitializer.tsx @@ -0,0 +1,53 @@ +import React from "react"; +import { ActionInitializer } from "./ActionInitializer"; + +export const CreateActionInitializer = (props) => { + const schema = { + type: 'void', + title: '{{ t("Add new") }}', + 'x-action': 'create', + 'x-designer': 'Action.Designer', + 'x-component': 'Action', + 'x-component-props': { + icon: 'PlusOutlined', + openMode: 'drawer', + type: 'primary', + }, + properties: { + drawer: { + type: 'void', + title: '{{ t("Add record") }}', + 'x-component': 'Action.Container', + 'x-component-props': { + className: 'nb-action-popup', + }, + properties: { + tabs: { + type: 'void', + 'x-component': 'Tabs', + 'x-component-props': {}, + 'x-initializer': 'TabPaneInitializers', + properties: { + tab1: { + type: 'void', + title: '{{t("Add new")}}', + 'x-component': 'Tabs.TabPane', + 'x-designer': 'Tabs.Designer', + 'x-component-props': {}, + properties: { + grid: { + type: 'void', + 'x-component': 'Grid', + 'x-initializer': 'CreateFormBlockInitializers', + properties: {}, + }, + }, + }, + }, + }, + }, + }, + }, + }; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/CreateFormBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/CreateFormBlockInitializer.tsx new file mode 100644 index 000000000..5ae60bcad --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/CreateFormBlockInitializer.tsx @@ -0,0 +1,49 @@ +import React from "react"; +import { FormOutlined } from '@ant-design/icons'; + +import { useBlockAssociationContext } from "../../block-provider"; +import { useCollection } from "../../collection-manager"; +import { useSchemaTemplateManager } from "../../schema-templates"; +import { SchemaInitializer } from "../SchemaInitializer"; +import { createFormBlockSchema, useRecordCollectionDataSourceItems } from "../utils"; + +export const CreateFormBlockInitializer = (props) => { + const { onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; + const { getTemplateSchemaByMode } = useSchemaTemplateManager(); + const association = useBlockAssociationContext(); + const collection = useCollection(); + return ( + } + {...others} + onClick={async ({ item }) => { + if (item.template) { + const s = await getTemplateSchemaByMode(item); + if (item.template.componentName === 'FormItem') { + const blockSchema = createFormBlockSchema({ + actionInitializers: 'CreateFormActionInitializers', + association, + collection: collection.name, + template: s, + }); + if (item.mode === 'reference') { + blockSchema['x-template-key'] = item.template.key; + } + insert(blockSchema); + } else { + insert(s); + } + } else { + insert( + createFormBlockSchema({ + actionInitializers: 'CreateFormActionInitializers', + association, + collection: collection.name, + }), + ); + } + }} + items={useRecordCollectionDataSourceItems('FormItem')} + /> + ); + }; diff --git a/packages/core/client/src/schema-initializer/items/CreateSubmitActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/CreateSubmitActionInitializer.tsx new file mode 100644 index 000000000..b845f9adb --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/CreateSubmitActionInitializer.tsx @@ -0,0 +1,18 @@ +import React from "react"; + +import { ActionInitializer } from "./ActionInitializer"; + +export const CreateSubmitActionInitializer = (props) => { + const schema = { + title: '{{ t("Submit") }}', + 'x-action': 'submit', + 'x-component': 'Action', + 'x-designer': 'Action.Designer', + 'x-component-props': { + type: 'primary', + htmlType: 'submit', + useProps: '{{ useCreateActionProps }}', + }, + }; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/CustomizeActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/CustomizeActionInitializer.tsx new file mode 100644 index 000000000..2e4152647 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/CustomizeActionInitializer.tsx @@ -0,0 +1,7 @@ +import React from 'react'; + +import { BlockInitializer } from '.'; + +export const CustomizeActionInitializer = (props) => { + return ; +}; diff --git a/packages/core/client/src/schema-initializer/items/DataBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/DataBlockInitializer.tsx new file mode 100644 index 000000000..9b7857cb3 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/DataBlockInitializer.tsx @@ -0,0 +1,30 @@ +import React from "react"; +import { TableOutlined } from '@ant-design/icons'; + +import { SchemaInitializer } from ".."; +import { useSchemaTemplateManager } from "../../schema-templates"; +import { useCollectionDataSourceItems } from "../utils"; + +export const DataBlockInitializer = (props) => { + const { templateWrap, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; + const { getTemplateSchemaByMode } = useSchemaTemplateManager(); + return ( + } + {...others} + onClick={async ({ item }) => { + if (item.template) { + const s = await getTemplateSchemaByMode(item); + templateWrap ? insert(templateWrap(s, { item })) : insert(s); + } else { + if (onCreateBlockSchema) { + onCreateBlockSchema({ item }); + } else if (createBlockSchema) { + insert(createBlockSchema({ collection: item.name })); + } + } + }} + items={useCollectionDataSourceItems(componentType)} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/DestroyActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/DestroyActionInitializer.tsx new file mode 100644 index 000000000..80a85c93f --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/DestroyActionInitializer.tsx @@ -0,0 +1,21 @@ +import React from "react"; + +import { ActionInitializer } from "./ActionInitializer"; + +export const DestroyActionInitializer = (props) => { + const schema = { + title: '{{ t("Delete") }}', + 'x-action': 'destroy', + 'x-component': 'Action', + 'x-designer': 'Action.Designer', + 'x-component-props': { + icon: 'DeleteOutlined', + confirm: { + title: "{{t('Delete record')}}", + content: "{{t('Are you sure you want to delete it?')}}", + }, + useProps: '{{ useDestroyActionProps }}', + }, + }; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/DetailsBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/DetailsBlockInitializer.tsx new file mode 100644 index 000000000..dd2bd7392 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/DetailsBlockInitializer.tsx @@ -0,0 +1,23 @@ +import React from "react"; +import { TableOutlined } from '@ant-design/icons'; + +import { useCollectionManager } from "../../collection-manager"; +import { createDetailsBlockSchema } from "../utils"; +import { DataBlockInitializer } from "./DataBlockInitializer"; + +export const DetailsBlockInitializer = (props) => { + const { insert } = props; + const { getCollection } = useCollectionManager(); + return ( + } + componentType={'Details'} + onCreateBlockSchema={async ({ item }) => { + const collection = getCollection(item.name); + const schema = createDetailsBlockSchema({ collection: item.name, rowKey: collection.filterTargetKey || 'id' }); + insert(schema); + }} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/FilterActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/FilterActionInitializer.tsx new file mode 100644 index 000000000..00e0ca4d8 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/FilterActionInitializer.tsx @@ -0,0 +1,18 @@ +import React from "react"; + +import { ActionInitializer } from "./ActionInitializer"; + +export const FilterActionInitializer = (props) => { + const schema = { + type: 'void', + title: '{{ t("Filter") }}', + 'x-action': 'filter', + 'x-designer': 'Filter.Action.Designer', + 'x-component': 'Filter.Action', + 'x-component-props': { + icon: 'FilterOutlined', + useProps: '{{ useFilterActionProps }}', + }, + }; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/FormBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/FormBlockInitializer.tsx new file mode 100644 index 000000000..3d1c07743 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/FormBlockInitializer.tsx @@ -0,0 +1,25 @@ +import React from "react"; +import { FormOutlined } from '@ant-design/icons'; +import { createFormBlockSchema } from "../utils"; +import { DataBlockInitializer } from "./DataBlockInitializer"; + +export const FormBlockInitializer = (props) => { + return ( + } + componentType={'FormItem'} + templateWrap={(templateSchema, { item }) => { + const s = createFormBlockSchema({ + template: templateSchema, + collection: item.name, + }); + if (item.template && item.mode === 'reference') { + s['x-template-key'] = item.template.key; + } + return s; + }} + createBlockSchema={createFormBlockSchema} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/G2PlotInitializer.tsx b/packages/core/client/src/schema-initializer/items/G2PlotInitializer.tsx new file mode 100644 index 000000000..0281c8b96 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/G2PlotInitializer.tsx @@ -0,0 +1,17 @@ +import React from 'react'; + +import { SchemaInitializer } from ".."; + +export const G2PlotInitializer = (props) => { + const { item, insert, ...others } = props; + return ( + { + insert({ + ...item.schema, + }); + }} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/InitializerWithSwitch.tsx b/packages/core/client/src/schema-initializer/items/InitializerWithSwitch.tsx new file mode 100644 index 000000000..03895a1e1 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/InitializerWithSwitch.tsx @@ -0,0 +1,24 @@ +import React from 'react'; +import { merge } from '@formily/shared'; + +import { SchemaInitializer } from ".."; +import { useCurrentSchema } from '../utils'; + +export const InitializerWithSwitch = (props) => { + const { type, schema, item, insert } = props; + const { exists, remove } = useCurrentSchema(schema?.[type] || item?.schema?.[type], type, item.find, item.remove); + return ( + { + if (exists) { + return remove(); + } + const s = merge(schema || {}, item.schema || {}); + item?.schemaInitialize?.(s); + insert(s); + }} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/KanbanBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/KanbanBlockInitializer.tsx new file mode 100644 index 000000000..3d78066d7 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/KanbanBlockInitializer.tsx @@ -0,0 +1,91 @@ +import React, { useContext } from "react"; +import { FormDialog, FormLayout } from "@formily/antd"; +import { FormOutlined } from '@ant-design/icons'; +import { SchemaOptionsContext } from "@formily/react"; +import { useTranslation } from "react-i18next"; + +import { useAPIClient } from "../../api-client"; +import { useCollectionManager } from "../../collection-manager"; +import { createKanbanBlockSchema } from "../utils"; +import { DataBlockInitializer } from "./DataBlockInitializer"; +import { SchemaComponent, SchemaComponentOptions } from "../../schema-component"; + +export const KanbanBlockInitializer = (props) => { + const { insert } = props; + const { t } = useTranslation(); + const { getCollection } = useCollectionManager(); + const options = useContext(SchemaOptionsContext); + const api = useAPIClient(); + return ( + } + onCreateBlockSchema={async ({ item }) => { + const collection = getCollection(item.name); + const fields = collection?.fields + ?.filter((field) => ['select', 'radioGroup'].includes(field.interface)) + ?.map((field) => { + return { + label: field?.uiSchema?.title, + value: field.name, + uiSchema: { + ...field.uiSchema, + name: field.name, + }, + }; + }); + const values = await FormDialog(t('Create kanban block'), () => { + return ( + + + + + + ); + }).open({ + initialValues: {}, + }); + const sortName = `${values.groupField.value}_sort`; + const exists = collection?.fields?.find((field) => field.name === sortName); + if (!exists) { + await api.resource('collections.fields', item.name).create({ + values: { + type: 'sort', + name: sortName, + hidden: true, + scopeKey: values.groupField.value, + }, + }); + } + insert( + createKanbanBlockSchema({ + groupField: values.groupField.value, + collection: item.name, + params: { + sort: [sortName], + paginate: false, + }, + }), + ); + }} + /> + ); + }; diff --git a/packages/core/client/src/schema-initializer/items/MarkdownBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/MarkdownBlockInitializer.tsx new file mode 100644 index 000000000..1c84a71eb --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/MarkdownBlockInitializer.tsx @@ -0,0 +1,28 @@ +import React from "react"; +import { FormOutlined } from '@ant-design/icons'; +import { useTranslation } from "react-i18next"; + +import { SchemaInitializer } from "../SchemaInitializer"; + +export const MarkdownBlockInitializer = (props) => { + const { insert } = props; + const { t } = useTranslation(); + return ( + } + onClick={() => { + insert({ + type: 'void', + 'x-designer': 'Markdown.Void.Designer', + 'x-decorator': 'CardItem', + 'x-component': 'Markdown.Void', + 'x-editable': false, + 'x-component-props': { + content: t('This is a demo text, **supports Markdown syntax**.'), + }, + }); + }} + /> + ); + }; diff --git a/packages/core/client/src/schema-initializer/items/PrintActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/PrintActionInitializer.tsx new file mode 100644 index 000000000..a7bb8168e --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/PrintActionInitializer.tsx @@ -0,0 +1,17 @@ +import React from "react"; + +import { ActionInitializer } from "./ActionInitializer"; + +export const PrintActionInitializer = (props) => { + const schema = { + title: '{{ t("Print") }}', + 'x-action': 'print', + 'x-component': 'Action', + 'x-designer': 'Action.Designer', + 'x-component-props': { + icon: 'PrinterOutlined', + useProps: '{{ useDetailPrintActionProps }}', + }, + }; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/RecordAssociationBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/RecordAssociationBlockInitializer.tsx new file mode 100644 index 000000000..2eade5ec2 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/RecordAssociationBlockInitializer.tsx @@ -0,0 +1,38 @@ +import React from "react"; +import { TableOutlined } from '@ant-design/icons'; + +import { useCollectionManager } from "../../collection-manager"; +import { useSchemaTemplateManager } from "../../schema-templates"; +import { SchemaInitializer } from "../SchemaInitializer"; +import { createTableBlockSchema, useRecordCollectionDataSourceItems } from "../utils"; + +export const RecordAssociationBlockInitializer = (props) => { + const { item, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; + const { getTemplateSchemaByMode } = useSchemaTemplateManager(); + const { getCollection } = useCollectionManager(); + const field = item.field; + const collection = getCollection(field.target); + const resource = `${field.collectionName}.${field.name}`; + return ( + } + {...others} + onClick={async ({ item }) => { + if (item.template) { + const s = await getTemplateSchemaByMode(item); + insert(s); + } else { + insert( + createTableBlockSchema({ + rowKey: collection.filterTargetKey, + collection: field.target, + resource, + association: resource, + }), + ); + } + }} + items={useRecordCollectionDataSourceItems('Table', item, field.target, resource)} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/RecordAssociationCalendarBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/RecordAssociationCalendarBlockInitializer.tsx new file mode 100644 index 000000000..bf4b3de07 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/RecordAssociationCalendarBlockInitializer.tsx @@ -0,0 +1,100 @@ +import React, { useContext } from "react"; +import { FormDialog, FormLayout } from "@formily/antd"; +import { SchemaOptionsContext } from "@formily/react"; +import { useTranslation } from "react-i18next"; +import { TableOutlined } from '@ant-design/icons'; + +import { useCollectionManager } from "../../collection-manager"; +import { useSchemaTemplateManager } from "../../schema-templates"; +import { SchemaInitializer } from "../SchemaInitializer"; +import { createCalendarBlockSchema, useRecordCollectionDataSourceItems } from "../utils"; +import { SchemaComponent, SchemaComponentOptions } from "../../schema-component"; + +export const RecordAssociationCalendarBlockInitializer = (props) => { + const { item, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; + const { getTemplateSchemaByMode } = useSchemaTemplateManager(); + const { t } = useTranslation(); + const options = useContext(SchemaOptionsContext); + const { getCollection } = useCollectionManager(); + const field = item.field; + const collection = getCollection(field.target); + const resource = `${field.collectionName}.${field.name}`; + + return ( + } + {...others} + onClick={async ({ item }) => { + if (item.template) { + const s = await getTemplateSchemaByMode(item); + insert(s); + } else { + const stringFields = collection?.fields + ?.filter((field) => field.type === 'string') + ?.map((field) => { + return { + label: field?.uiSchema?.title, + value: field.name, + }; + }); + const dateFields = collection?.fields + ?.filter((field) => field.type === 'date') + ?.map((field) => { + return { + label: field?.uiSchema?.title, + value: field.name, + }; + }); + const values = await FormDialog(t('Create calendar block'), () => { + return ( + + + + + + ); + }).open({ + initialValues: {}, + }); + insert( + createCalendarBlockSchema({ + collection: field.target, + resource, + association: resource, + fieldNames: { + ...values, + }, + }), + ); + } + }} + items={useRecordCollectionDataSourceItems('Calendar', item, field.target, resource)} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/RecordAssociationDetailsBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/RecordAssociationDetailsBlockInitializer.tsx new file mode 100644 index 000000000..0116d70f8 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/RecordAssociationDetailsBlockInitializer.tsx @@ -0,0 +1,38 @@ +import React from "react"; +import { FormOutlined } from '@ant-design/icons'; + +import { useCollectionManager } from "../../collection-manager"; +import { useSchemaTemplateManager } from "../../schema-templates"; +import { SchemaInitializer } from "../SchemaInitializer"; +import { createDetailsBlockSchema, useRecordCollectionDataSourceItems } from "../utils"; + +export const RecordAssociationDetailsBlockInitializer = (props) => { + const { item, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; + const { getTemplateSchemaByMode } = useSchemaTemplateManager(); + const { getCollection } = useCollectionManager(); + const field = item.field; + const collection = getCollection(field.target); + const resource = `${field.collectionName}.${field.name}`; + return ( + } + {...others} + onClick={async ({ item }) => { + if (item.template) { + const s = await getTemplateSchemaByMode(item); + insert(s); + } else { + insert( + createDetailsBlockSchema({ + collection: field.target, + resource, + association: resource, + rowKey: collection.filterTargetKey || 'id', + }), + ); + } + }} + items={useRecordCollectionDataSourceItems('Details', item, field.target, resource)} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/RecordAssociationFormBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/RecordAssociationFormBlockInitializer.tsx new file mode 100644 index 000000000..e33cf5a05 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/RecordAssociationFormBlockInitializer.tsx @@ -0,0 +1,61 @@ +import React from "react"; +import { FormOutlined } from '@ant-design/icons'; + +import { useSchemaTemplateManager } from "../../schema-templates"; +import { SchemaInitializer } from "../SchemaInitializer"; +import { createFormBlockSchema, useRecordCollectionDataSourceItems } from "../utils"; + +export const RecordAssociationFormBlockInitializer = (props) => { + const { item, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; + const { getTemplateSchemaByMode } = useSchemaTemplateManager(); + const field = item.field; + const collection = field.target; + const resource = `${field.collectionName}.${field.name}`; + return ( + } + {...others} + onClick={async ({ item }) => { + const action = ['hasOne', 'belongsTo'].includes(field.type) ? 'get' : null; + const actionInitializers = ['hasOne', 'belongsTo'].includes(field.type) + ? 'UpdateFormActionInitializers' + : 'CreateFormActionInitializers'; + + if (item.template) { + const s = await getTemplateSchemaByMode(item); + if (item.template.componentName === 'FormItem') { + const blockSchema = createFormBlockSchema({ + collection, + resource, + association: resource, + action, + useSourceId: '{{ useSourceIdFromParentRecord }}', + useParams: '{{ useParamsFromRecord }}', + actionInitializers, + template: s, + }); + if (item.mode === 'reference') { + blockSchema['x-template-key'] = item.template.key; + } + insert(blockSchema); + } else { + insert(s); + } + } else { + insert( + createFormBlockSchema({ + collection, + resource, + association: resource, + action, + useSourceId: '{{ useSourceIdFromParentRecord }}', + useParams: '{{ useParamsFromRecord }}', + actionInitializers, + }), + ); + } + }} + items={useRecordCollectionDataSourceItems('FormItem', item, collection, resource)} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/RecordFormBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/RecordFormBlockInitializer.tsx new file mode 100644 index 000000000..950e15cde --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/RecordFormBlockInitializer.tsx @@ -0,0 +1,55 @@ +import React from "react"; +import { FormOutlined } from '@ant-design/icons'; +import { useBlockAssociationContext } from "../../block-provider"; +import { useCollection } from "../../collection-manager"; +import { useSchemaTemplateManager } from "../../schema-templates"; +import { SchemaInitializer } from "../SchemaInitializer"; +import { createFormBlockSchema, useRecordCollectionDataSourceItems } from "../utils"; + +export const RecordFormBlockInitializer = (props) => { + const { onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; + const { getTemplateSchemaByMode } = useSchemaTemplateManager(); + const collection = useCollection(); + const association = useBlockAssociationContext(); + console.log('RecordFormBlockInitializer', collection, association); + return ( + } + {...others} + onClick={async ({ item }) => { + if (item.template) { + const s = await getTemplateSchemaByMode(item); + if (item.template.componentName === 'FormItem') { + const blockSchema = createFormBlockSchema({ + association, + collection: collection.name, + action: 'get', + useSourceId: '{{ useSourceIdFromParentRecord }}', + useParams: '{{ useParamsFromRecord }}', + actionInitializers: 'UpdateFormActionInitializers', + template: s, + }); + if (item.mode === 'reference') { + blockSchema['x-template-key'] = item.template.key; + } + insert(blockSchema); + } else { + insert(s); + } + } else { + insert( + createFormBlockSchema({ + association, + collection: collection.name, + action: 'get', + useSourceId: '{{ useSourceIdFromParentRecord }}', + useParams: '{{ useParamsFromRecord }}', + actionInitializers: 'UpdateFormActionInitializers', + }), + ); + } + }} + items={useRecordCollectionDataSourceItems('FormItem')} + /> + ); + }; diff --git a/packages/core/client/src/schema-initializer/items/RecordReadPrettyAssociationFormBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/RecordReadPrettyAssociationFormBlockInitializer.tsx new file mode 100644 index 000000000..2f458b872 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/RecordReadPrettyAssociationFormBlockInitializer.tsx @@ -0,0 +1,61 @@ +import React from "react"; +import { FormOutlined } from '@ant-design/icons'; + +import { useBlockRequestContext } from "../../block-provider"; +import { useSchemaTemplateManager } from "../../schema-templates"; +import { SchemaInitializer } from "../SchemaInitializer"; +import { createReadPrettyFormBlockSchema, useRecordCollectionDataSourceItems } from "../utils"; + +export const RecordReadPrettyAssociationFormBlockInitializer = (props) => { + const { item, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; + const { getTemplateSchemaByMode } = useSchemaTemplateManager(); + + const field = item.field; + const collection = field.target; + const resource = `${field.collectionName}.${field.name}`; + const { block } = useBlockRequestContext(); + const actionInitializers = block !== 'TableField' ? 'ReadPrettyFormActionInitializers' : null; + + return ( + } + {...others} + onClick={async ({ item }) => { + if (item.template) { + const s = await getTemplateSchemaByMode(item); + if (item.template.componentName === 'ReadPrettyFormItem') { + const blockSchema = createReadPrettyFormBlockSchema({ + actionInitializers, + collection, + resource, + association: resource, + action: 'get', + useSourceId: '{{ useSourceIdFromParentRecord }}', + useParams: '{{ useParamsFromRecord }}', + template: s, + }); + if (item.mode === 'reference') { + blockSchema['x-template-key'] = item.template.key; + } + insert(blockSchema); + } else { + insert(s); + } + } else { + insert( + createReadPrettyFormBlockSchema({ + actionInitializers, + collection, + resource, + association: resource, + action: 'get', + useSourceId: '{{ useSourceIdFromParentRecord }}', + useParams: '{{ useParamsFromRecord }}', + }), + ); + } + }} + items={useRecordCollectionDataSourceItems('ReadPrettyFormItem', item, collection, resource)} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/RecordReadPrettyFormBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/RecordReadPrettyFormBlockInitializer.tsx new file mode 100644 index 000000000..3dc1a7c74 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/RecordReadPrettyFormBlockInitializer.tsx @@ -0,0 +1,59 @@ +import React from "react"; +import { FormOutlined } from '@ant-design/icons'; +import { useBlockAssociationContext, useBlockRequestContext } from "../../block-provider"; +import { useCollection } from "../../collection-manager"; +import { useSchemaTemplateManager } from "../../schema-templates"; +import { SchemaInitializer } from "../SchemaInitializer"; +import { createReadPrettyFormBlockSchema, useRecordCollectionDataSourceItems } from "../utils"; + +export const RecordReadPrettyFormBlockInitializer = (props) => { + const { onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; + + const { getTemplateSchemaByMode } = useSchemaTemplateManager(); + const collection = useCollection(); + const association = useBlockAssociationContext(); + const { block } = useBlockRequestContext(); + const actionInitializers = block !== 'TableField' ? 'ReadPrettyFormActionInitializers' : null; + + return ( + } + {...others} + key={'123'} + onClick={async ({ item }) => { + if (item.template) { + const s = await getTemplateSchemaByMode(item); + if (item.template.componentName === 'ReadPrettyFormItem') { + const blockSchema = createReadPrettyFormBlockSchema({ + actionInitializers, + association, + collection: collection.name, + action: 'get', + useSourceId: '{{ useSourceIdFromParentRecord }}', + useParams: '{{ useParamsFromRecord }}', + template: s, + }); + if (item.mode === 'reference') { + blockSchema['x-template-key'] = item.template.key; + } + insert(blockSchema); + } else { + insert(s); + } + } else { + insert( + createReadPrettyFormBlockSchema({ + actionInitializers, + association, + collection: collection.name, + action: 'get', + useSourceId: '{{ useSourceIdFromParentRecord }}', + useParams: '{{ useParamsFromRecord }}', + }), + ); + } + }} + items={useRecordCollectionDataSourceItems('ReadPrettyFormItem')} + /> + ); + }; diff --git a/packages/core/client/src/schema-initializer/items/SubmitActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/SubmitActionInitializer.tsx new file mode 100644 index 000000000..94dc236d2 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/SubmitActionInitializer.tsx @@ -0,0 +1,18 @@ +import React from "react"; + +import { ActionInitializer } from "./ActionInitializer"; + +export const SubmitActionInitializer = (props) => { + const schema = { + title: '{{ t("Submit") }}', + 'x-action': 'submit', + 'x-component': 'Action', + 'x-designer': 'Action.Designer', + 'x-component-props': { + type: 'primary', + htmlType: 'submit', + // useProps: '{{ bp.useSubmitActionProps }}', + }, + }; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/TableActionColumnInitializer.tsx b/packages/core/client/src/schema-initializer/items/TableActionColumnInitializer.tsx new file mode 100644 index 000000000..bfe323b25 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/TableActionColumnInitializer.tsx @@ -0,0 +1,27 @@ +import React from "react"; + +import { InitializerWithSwitch } from "./InitializerWithSwitch"; + +export const TableActionColumnInitializer = (props) => { + const schema = { + type: 'void', + title: '{{ t("Actions") }}', + 'x-decorator': 'TableV2.Column.ActionBar', + 'x-component': 'TableV2.Column', + 'x-designer': 'TableV2.ActionColumnDesigner', + 'x-initializer': 'TableActionColumnInitializers', + 'x-action-column': 'actions', + properties: { + actions: { + type: 'void', + 'x-decorator': 'DndContext', + 'x-component': 'Space', + 'x-component-props': { + split: '|', + }, + properties: {}, + }, + }, + }; + return ; +}; diff --git a/packages/core/client/src/schema-initializer/items/TableBlockInitializer.tsx b/packages/core/client/src/schema-initializer/items/TableBlockInitializer.tsx new file mode 100644 index 000000000..71004f942 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/TableBlockInitializer.tsx @@ -0,0 +1,23 @@ +import React from "react"; +import { TableOutlined } from '@ant-design/icons'; + +import { useCollectionManager } from "../../collection-manager"; +import { DataBlockInitializer } from "./DataBlockInitializer"; +import { createTableBlockSchema } from "../utils"; + +export const TableBlockInitializer = (props) => { + const { insert } = props; + const { getCollection } = useCollectionManager(); + return ( + } + componentType={'Table'} + onCreateBlockSchema={async ({ item }) => { + const collection = getCollection(item.name); + const schema = createTableBlockSchema({ collection: item.name, rowKey: collection.filterTargetKey || 'id' }); + insert(schema); + }} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/TableCollectionFieldInitializer.tsx b/packages/core/client/src/schema-initializer/items/TableCollectionFieldInitializer.tsx new file mode 100644 index 000000000..0344652ae --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/TableCollectionFieldInitializer.tsx @@ -0,0 +1,9 @@ +import React from "react"; +import { ISchema } from "@formily/react"; + +import { InitializerWithSwitch } from "./InitializerWithSwitch"; + +export const TableCollectionFieldInitializer = (props) => { + const schema: ISchema = {}; + return ; +}; diff --git a/packages/core/client/src/schema-initializer/items/TableSelectorInitializer.tsx b/packages/core/client/src/schema-initializer/items/TableSelectorInitializer.tsx new file mode 100644 index 000000000..84dde5242 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/TableSelectorInitializer.tsx @@ -0,0 +1,29 @@ +import React from "react"; +import { FormOutlined } from '@ant-design/icons'; + +import { useCollection } from "../../collection-manager"; +import { useSchemaTemplateManager } from "../../schema-templates"; +import { SchemaInitializer } from "../SchemaInitializer"; +import { createTableSelectorSchema } from "../utils"; + +export const TableSelectorInitializer = (props) => { + const { onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; + const { getTemplateSchemaByMode } = useSchemaTemplateManager(); + const collection = useCollection(); + return ( + } + {...others} + onClick={async ({ item }) => { + const field = item.field; + insert( + createTableSelectorSchema({ + rowKey: collection.filterTargetKey, + collection: collection.name, + resource: collection.name, + }), + ); + }} + /> + ); +}; diff --git a/packages/core/client/src/schema-initializer/items/UpdateActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/UpdateActionInitializer.tsx new file mode 100644 index 000000000..9a66c5602 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/UpdateActionInitializer.tsx @@ -0,0 +1,53 @@ +import React from "react"; + +import { ActionInitializer } from "./ActionInitializer"; + +export const UpdateActionInitializer = (props) => { + const schema = { + type: 'void', + title: '{{ t("Edit") }}', + 'x-action': 'update', + 'x-designer': 'Action.Designer', + 'x-component': 'Action', + 'x-component-props': { + openMode: 'drawer', + icon: 'EditOutlined', + }, + properties: { + drawer: { + type: 'void', + title: '{{ t("Edit record") }}', + 'x-component': 'Action.Container', + 'x-component-props': { + className: 'nb-action-popup', + }, + properties: { + tabs: { + type: 'void', + 'x-component': 'Tabs', + 'x-component-props': {}, + 'x-initializer': 'TabPaneInitializers', + properties: { + tab1: { + type: 'void', + title: '{{t("Edit")}}', + 'x-component': 'Tabs.TabPane', + 'x-designer': 'Tabs.Designer', + 'x-component-props': {}, + properties: { + grid: { + type: 'void', + 'x-component': 'Grid', + 'x-initializer': 'RecordBlockInitializers', + properties: {}, + }, + }, + }, + }, + }, + }, + }, + }, + }; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/UpdateSubmitActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/UpdateSubmitActionInitializer.tsx new file mode 100644 index 000000000..b1584fd54 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/UpdateSubmitActionInitializer.tsx @@ -0,0 +1,18 @@ +import React from "react"; + +import { ActionInitializer } from "./ActionInitializer"; + +export const UpdateSubmitActionInitializer = (props) => { + const schema = { + title: '{{ t("Submit") }}', + 'x-action': 'submit', + 'x-component': 'Action', + 'x-designer': 'Action.Designer', + 'x-component-props': { + type: 'primary', + htmlType: 'submit', + useProps: '{{ useUpdateActionProps }}', + }, + }; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/ViewActionInitializer.tsx b/packages/core/client/src/schema-initializer/items/ViewActionInitializer.tsx new file mode 100644 index 000000000..a4bc70548 --- /dev/null +++ b/packages/core/client/src/schema-initializer/items/ViewActionInitializer.tsx @@ -0,0 +1,52 @@ +import React from "react"; + +import { ActionInitializer } from "./ActionInitializer"; + +export const ViewActionInitializer = (props) => { + const schema = { + type: 'void', + title: '{{ t("View") }}', + 'x-action': 'view', + 'x-designer': 'Action.Designer', + 'x-component': 'Action', + 'x-component-props': { + openMode: 'drawer', + }, + properties: { + drawer: { + type: 'void', + title: '{{ t("View record") }}', + 'x-component': 'Action.Container', + 'x-component-props': { + className: 'nb-action-popup', + }, + properties: { + tabs: { + type: 'void', + 'x-component': 'Tabs', + 'x-component-props': {}, + 'x-initializer': 'TabPaneInitializers', + properties: { + tab1: { + type: 'void', + title: '{{t("Details")}}', + 'x-component': 'Tabs.TabPane', + 'x-designer': 'Tabs.Designer', + 'x-component-props': {}, + properties: { + grid: { + type: 'void', + 'x-component': 'Grid', + 'x-initializer': 'RecordBlockInitializers', + properties: {}, + }, + }, + }, + }, + }, + }, + }, + }, + }; + return ; + }; diff --git a/packages/core/client/src/schema-initializer/items/index.tsx b/packages/core/client/src/schema-initializer/items/index.tsx index eb48c87fd..3770fe17d 100644 --- a/packages/core/client/src/schema-initializer/items/index.tsx +++ b/packages/core/client/src/schema-initializer/items/index.tsx @@ -1,1070 +1,34 @@ -import { FormOutlined, TableOutlined } from '@ant-design/icons'; -import { FormDialog, FormLayout } from '@formily/antd'; -import { ISchema, SchemaOptionsContext } from '@formily/react'; -import { merge } from '@formily/shared'; -import React, { useContext } from 'react'; -import { useTranslation } from 'react-i18next'; -import { useAPIClient } from '../../api-client'; -import { useBlockAssociationContext, useBlockRequestContext } from '../../block-provider'; -import { useCollection, useCollectionManager } from '../../collection-manager'; -import { SchemaComponent, SchemaComponentOptions } from '../../schema-component'; -import { useSchemaTemplateManager } from '../../schema-templates'; -import { SchemaInitializer } from '../SchemaInitializer'; -import { - createCalendarBlockSchema, - createDetailsBlockSchema, - createFormBlockSchema, - createKanbanBlockSchema, - createReadPrettyFormBlockSchema, - createTableBlockSchema, - createTableSelectorSchema, - useCollectionDataSourceItems, - useCurrentSchema, - useRecordCollectionDataSourceItems -} from '../utils'; - -// Block -export const BlockInitializer = (props) => { - const { item, insert } = props; - return ( - { - insert({ - ...item.schema, - }); - }} - /> - ); -}; - -export const G2PlotInitializer = (props) => { - const { item, insert, ...others } = props; - return ( - { - insert({ - ...item.schema, - }); - }} - /> - ); -}; - -export const CustomizeActionInitializer = (props) => { - return ; -}; - -export const InitializerWithSwitch = (props) => { - const { type, schema, item, insert } = props; - const { exists, remove } = useCurrentSchema(schema?.[type] || item?.schema?.[type], type, item.find, item.remove); - return ( - { - if (exists) { - return remove(); - } - const s = merge(schema || {}, item.schema || {}); - item?.schemaInitialize?.(s); - insert(s); - }} - /> - ); -}; - -export const ActionInitializer = (props) => { - return ; -}; - -export const DataBlockInitializer = (props) => { - const { templateWrap, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; - const { getTemplateSchemaByMode } = useSchemaTemplateManager(); - return ( - } - {...others} - onClick={async ({ item }) => { - if (item.template) { - const s = await getTemplateSchemaByMode(item); - templateWrap ? insert(templateWrap(s, { item })) : insert(s); - } else { - if (onCreateBlockSchema) { - onCreateBlockSchema({ item }); - } else if (createBlockSchema) { - insert(createBlockSchema({ collection: item.name })); - } - } - }} - items={useCollectionDataSourceItems(componentType)} - /> - ); -}; - -export const TableBlockInitializer = (props) => { - const { insert } = props; - const { getCollection } = useCollectionManager(); - return ( - } - componentType={'Table'} - onCreateBlockSchema={async ({ item }) => { - const collection = getCollection(item.name); - const schema = createTableBlockSchema({ collection: item.name, rowKey: collection.filterTargetKey || 'id' }); - insert(schema); - }} - /> - ); -}; - -export const FormBlockInitializer = (props) => { - return ( - } - componentType={'FormItem'} - templateWrap={(templateSchema, { item }) => { - const s = createFormBlockSchema({ - template: templateSchema, - collection: item.name, - }); - if (item.template && item.mode === 'reference') { - s['x-template-key'] = item.template.key; - } - return s; - }} - createBlockSchema={createFormBlockSchema} - /> - ); -}; - -export const DetailsBlockInitializer = (props) => { - const { insert } = props; - const { getCollection } = useCollectionManager(); - return ( - } - componentType={'Details'} - onCreateBlockSchema={async ({ item }) => { - const collection = getCollection(item.name); - const schema = createDetailsBlockSchema({ collection: item.name, rowKey: collection.filterTargetKey || 'id' }); - insert(schema); - }} - /> - ); -}; - -export const CalendarBlockInitializer = (props) => { - const { insert } = props; - const { t } = useTranslation(); - const { getCollection } = useCollectionManager(); - const options = useContext(SchemaOptionsContext); - return ( - } - onCreateBlockSchema={async ({ item }) => { - const collection = getCollection(item.name); - const stringFields = collection?.fields - ?.filter((field) => field.type === 'string') - ?.map((field) => { - return { - label: field?.uiSchema?.title, - value: field.name, - }; - }); - const dateFields = collection?.fields - ?.filter((field) => field.type === 'date') - ?.map((field) => { - return { - label: field?.uiSchema?.title, - value: field.name, - }; - }); - const values = await FormDialog(t('Create calendar block'), () => { - return ( - - - - - - ); - }).open({ - initialValues: {}, - }); - insert( - createCalendarBlockSchema({ - collection: item.name, - fieldNames: { - ...values, - }, - }), - ); - }} - /> - ); -}; - -export const KanbanBlockInitializer = (props) => { - const { insert } = props; - const { t } = useTranslation(); - const { getCollection } = useCollectionManager(); - const options = useContext(SchemaOptionsContext); - const api = useAPIClient(); - return ( - } - onCreateBlockSchema={async ({ item }) => { - const collection = getCollection(item.name); - const fields = collection?.fields - ?.filter((field) => ['select', 'radioGroup'].includes(field.interface)) - ?.map((field) => { - return { - label: field?.uiSchema?.title, - value: field.name, - uiSchema: { - ...field.uiSchema, - name: field.name, - }, - }; - }); - const values = await FormDialog(t('Create kanban block'), () => { - return ( - - - - - - ); - }).open({ - initialValues: {}, - }); - const sortName = `${values.groupField.value}_sort`; - const exists = collection?.fields?.find((field) => field.name === sortName); - if (!exists) { - await api.resource('collections.fields', item.name).create({ - values: { - type: 'sort', - name: sortName, - hidden: true, - scopeKey: values.groupField.value, - }, - }); - } - insert( - createKanbanBlockSchema({ - groupField: values.groupField.value, - collection: item.name, - params: { - sort: [sortName], - paginate: false, - }, - }), - ); - }} - /> - ); -}; - -export const MarkdownBlockInitializer = (props) => { - const { insert } = props; - const { t } = useTranslation(); - return ( - } - onClick={() => { - insert({ - type: 'void', - 'x-designer': 'Markdown.Void.Designer', - 'x-decorator': 'CardItem', - 'x-component': 'Markdown.Void', - 'x-editable': false, - 'x-component-props': { - content: t('This is a demo text, **supports Markdown syntax**.'), - }, - }); - }} - /> - ); -}; - -export const FilterActionInitializer = (props) => { - const schema = { - type: 'void', - title: '{{ t("Filter") }}', - 'x-action': 'filter', - 'x-designer': 'Filter.Action.Designer', - 'x-component': 'Filter.Action', - 'x-component-props': { - icon: 'FilterOutlined', - useProps: '{{ useFilterActionProps }}', - }, - }; - return ; -}; - -export const CreateActionInitializer = (props) => { - const schema = { - type: 'void', - title: '{{ t("Add new") }}', - 'x-action': 'create', - 'x-designer': 'Action.Designer', - 'x-component': 'Action', - 'x-component-props': { - icon: 'PlusOutlined', - openMode: 'drawer', - type: 'primary', - }, - properties: { - drawer: { - type: 'void', - title: '{{ t("Add record") }}', - 'x-component': 'Action.Container', - 'x-component-props': { - className: 'nb-action-popup', - }, - properties: { - tabs: { - type: 'void', - 'x-component': 'Tabs', - 'x-component-props': {}, - 'x-initializer': 'TabPaneInitializers', - properties: { - tab1: { - type: 'void', - title: '{{t("Add new")}}', - 'x-component': 'Tabs.TabPane', - 'x-designer': 'Tabs.Designer', - 'x-component-props': {}, - properties: { - grid: { - type: 'void', - 'x-component': 'Grid', - 'x-initializer': 'CreateFormBlockInitializers', - properties: {}, - }, - }, - }, - }, - }, - }, - }, - }, - }; - return ; -}; - -export const ViewActionInitializer = (props) => { - const schema = { - type: 'void', - title: '{{ t("View") }}', - 'x-action': 'view', - 'x-designer': 'Action.Designer', - 'x-component': 'Action', - 'x-component-props': { - openMode: 'drawer', - }, - properties: { - drawer: { - type: 'void', - title: '{{ t("View record") }}', - 'x-component': 'Action.Container', - 'x-component-props': { - className: 'nb-action-popup', - }, - properties: { - tabs: { - type: 'void', - 'x-component': 'Tabs', - 'x-component-props': {}, - 'x-initializer': 'TabPaneInitializers', - properties: { - tab1: { - type: 'void', - title: '{{t("Details")}}', - 'x-component': 'Tabs.TabPane', - 'x-designer': 'Tabs.Designer', - 'x-component-props': {}, - properties: { - grid: { - type: 'void', - 'x-component': 'Grid', - 'x-initializer': 'RecordBlockInitializers', - properties: {}, - }, - }, - }, - }, - }, - }, - }, - }, - }; - return ; -}; - -export const UpdateActionInitializer = (props) => { - const schema = { - type: 'void', - title: '{{ t("Edit") }}', - 'x-action': 'update', - 'x-designer': 'Action.Designer', - 'x-component': 'Action', - 'x-component-props': { - openMode: 'drawer', - icon: 'EditOutlined', - }, - properties: { - drawer: { - type: 'void', - title: '{{ t("Edit record") }}', - 'x-component': 'Action.Container', - 'x-component-props': { - className: 'nb-action-popup', - }, - properties: { - tabs: { - type: 'void', - 'x-component': 'Tabs', - 'x-component-props': {}, - 'x-initializer': 'TabPaneInitializers', - properties: { - tab1: { - type: 'void', - title: '{{t("Edit")}}', - 'x-component': 'Tabs.TabPane', - 'x-designer': 'Tabs.Designer', - 'x-component-props': {}, - properties: { - grid: { - type: 'void', - 'x-component': 'Grid', - 'x-initializer': 'RecordBlockInitializers', - properties: {}, - }, - }, - }, - }, - }, - }, - }, - }, - }; - return ; -}; - -export const DestroyActionInitializer = (props) => { - const schema = { - title: '{{ t("Delete") }}', - 'x-action': 'destroy', - 'x-component': 'Action', - 'x-designer': 'Action.Designer', - 'x-component-props': { - icon: 'DeleteOutlined', - confirm: { - title: "{{t('Delete record')}}", - content: "{{t('Are you sure you want to delete it?')}}", - }, - useProps: '{{ useDestroyActionProps }}', - }, - }; - return ; -}; - -export const PrintActionInitializer = (props) => { - const schema = { - title: '{{ t("Print") }}', - 'x-action': 'print', - 'x-component': 'Action', - 'x-designer': 'Action.Designer', - 'x-component-props': { - icon: 'PrinterOutlined', - useProps: '{{ useDetailPrintActionProps }}', - }, - }; - return ; -}; - -export const BulkDestroyActionInitializer = (props) => { - const schema = { - title: '{{ t("Delete") }}', - 'x-action': 'destroy', - 'x-component': 'Action', - 'x-designer': 'Action.Designer', - 'x-component-props': { - icon: 'DeleteOutlined', - confirm: { - title: "{{t('Delete record')}}", - content: "{{t('Are you sure you want to delete it?')}}", - }, - useProps: '{{ useBulkDestroyActionProps }}', - }, - }; - return ; -}; - -export const RefreshActionInitializer = (props) => { - const schema = { - title: '{{ t("Refresh") }}', - 'x-action': 'refresh', - 'x-component': 'Action', - 'x-designer': 'Action.Designer', - 'x-component-props': { - icon: 'ReloadOutlined', - useProps: '{{ useRefreshActionProps }}', - }, - }; - return ; -}; - -export const SubmitActionInitializer = (props) => { - const schema = { - title: '{{ t("Submit") }}', - 'x-action': 'submit', - 'x-component': 'Action', - 'x-designer': 'Action.Designer', - 'x-component-props': { - type: 'primary', - htmlType: 'submit', - // useProps: '{{ bp.useSubmitActionProps }}', - }, - }; - return ; -}; - -export const CreateSubmitActionInitializer = (props) => { - const schema = { - title: '{{ t("Submit") }}', - 'x-action': 'submit', - 'x-component': 'Action', - 'x-designer': 'Action.Designer', - 'x-component-props': { - type: 'primary', - htmlType: 'submit', - useProps: '{{ useCreateActionProps }}', - }, - }; - return ; -}; - -export const UpdateSubmitActionInitializer = (props) => { - const schema = { - title: '{{ t("Submit") }}', - 'x-action': 'submit', - 'x-component': 'Action', - 'x-designer': 'Action.Designer', - 'x-component-props': { - type: 'primary', - htmlType: 'submit', - useProps: '{{ useUpdateActionProps }}', - }, - }; - return ; -}; - -export const CreateFormBlockInitializer = (props) => { - const { onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; - const { getTemplateSchemaByMode } = useSchemaTemplateManager(); - const association = useBlockAssociationContext(); - const collection = useCollection(); - return ( - } - {...others} - onClick={async ({ item }) => { - if (item.template) { - const s = await getTemplateSchemaByMode(item); - if (item.template.componentName === 'FormItem') { - const blockSchema = createFormBlockSchema({ - actionInitializers: 'CreateFormActionInitializers', - association, - collection: collection.name, - template: s, - }); - if (item.mode === 'reference') { - blockSchema['x-template-key'] = item.template.key; - } - insert(blockSchema); - } else { - insert(s); - } - } else { - insert( - createFormBlockSchema({ - actionInitializers: 'CreateFormActionInitializers', - association, - collection: collection.name, - }), - ); - } - }} - items={useRecordCollectionDataSourceItems('FormItem')} - /> - ); -}; - -export const RecordFormBlockInitializer = (props) => { - const { onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; - const { getTemplateSchemaByMode } = useSchemaTemplateManager(); - const collection = useCollection(); - const association = useBlockAssociationContext(); - console.log('RecordFormBlockInitializer', collection, association); - return ( - } - {...others} - onClick={async ({ item }) => { - if (item.template) { - const s = await getTemplateSchemaByMode(item); - if (item.template.componentName === 'FormItem') { - const blockSchema = createFormBlockSchema({ - association, - collection: collection.name, - action: 'get', - useSourceId: '{{ useSourceIdFromParentRecord }}', - useParams: '{{ useParamsFromRecord }}', - actionInitializers: 'UpdateFormActionInitializers', - template: s, - }); - if (item.mode === 'reference') { - blockSchema['x-template-key'] = item.template.key; - } - insert(blockSchema); - } else { - insert(s); - } - } else { - insert( - createFormBlockSchema({ - association, - collection: collection.name, - action: 'get', - useSourceId: '{{ useSourceIdFromParentRecord }}', - useParams: '{{ useParamsFromRecord }}', - actionInitializers: 'UpdateFormActionInitializers', - }), - ); - } - }} - items={useRecordCollectionDataSourceItems('FormItem')} - /> - ); -}; - -export const RecordReadPrettyFormBlockInitializer = (props) => { - const { onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; - - const { getTemplateSchemaByMode } = useSchemaTemplateManager(); - const collection = useCollection(); - const association = useBlockAssociationContext(); - const { block } = useBlockRequestContext(); - const actionInitializers = block !== 'TableField' ? 'ReadPrettyFormActionInitializers' : null; - - return ( - } - {...others} - key={'123'} - onClick={async ({ item }) => { - if (item.template) { - const s = await getTemplateSchemaByMode(item); - if (item.template.componentName === 'ReadPrettyFormItem') { - const blockSchema = createReadPrettyFormBlockSchema({ - actionInitializers, - association, - collection: collection.name, - action: 'get', - useSourceId: '{{ useSourceIdFromParentRecord }}', - useParams: '{{ useParamsFromRecord }}', - template: s, - }); - if (item.mode === 'reference') { - blockSchema['x-template-key'] = item.template.key; - } - insert(blockSchema); - } else { - insert(s); - } - } else { - insert( - createReadPrettyFormBlockSchema({ - actionInitializers, - association, - collection: collection.name, - action: 'get', - useSourceId: '{{ useSourceIdFromParentRecord }}', - useParams: '{{ useParamsFromRecord }}', - }), - ); - } - }} - items={useRecordCollectionDataSourceItems('ReadPrettyFormItem')} - /> - ); -}; - -export const RecordAssociationFormBlockInitializer = (props) => { - const { item, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; - const { getTemplateSchemaByMode } = useSchemaTemplateManager(); - const field = item.field; - const collection = field.target; - const resource = `${field.collectionName}.${field.name}`; - return ( - } - {...others} - onClick={async ({ item }) => { - const action = ['hasOne', 'belongsTo'].includes(field.type) ? 'get' : null; - const actionInitializers = ['hasOne', 'belongsTo'].includes(field.type) - ? 'UpdateFormActionInitializers' - : 'CreateFormActionInitializers'; - - if (item.template) { - const s = await getTemplateSchemaByMode(item); - if (item.template.componentName === 'FormItem') { - const blockSchema = createFormBlockSchema({ - collection, - resource, - association: resource, - action, - useSourceId: '{{ useSourceIdFromParentRecord }}', - useParams: '{{ useParamsFromRecord }}', - actionInitializers, - template: s, - }); - if (item.mode === 'reference') { - blockSchema['x-template-key'] = item.template.key; - } - insert(blockSchema); - } else { - insert(s); - } - } else { - insert( - createFormBlockSchema({ - collection, - resource, - association: resource, - action, - useSourceId: '{{ useSourceIdFromParentRecord }}', - useParams: '{{ useParamsFromRecord }}', - actionInitializers, - }), - ); - } - }} - items={useRecordCollectionDataSourceItems('FormItem', item, collection, resource)} - /> - ); -}; - -export const RecordReadPrettyAssociationFormBlockInitializer = (props) => { - const { item, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; - const { getTemplateSchemaByMode } = useSchemaTemplateManager(); - - const field = item.field; - const collection = field.target; - const resource = `${field.collectionName}.${field.name}`; - const { block } = useBlockRequestContext(); - const actionInitializers = block !== 'TableField' ? 'ReadPrettyFormActionInitializers' : null; - - return ( - } - {...others} - onClick={async ({ item }) => { - if (item.template) { - const s = await getTemplateSchemaByMode(item); - if (item.template.componentName === 'ReadPrettyFormItem') { - const blockSchema = createReadPrettyFormBlockSchema({ - actionInitializers, - collection, - resource, - association: resource, - action: 'get', - useSourceId: '{{ useSourceIdFromParentRecord }}', - useParams: '{{ useParamsFromRecord }}', - template: s, - }); - if (item.mode === 'reference') { - blockSchema['x-template-key'] = item.template.key; - } - insert(blockSchema); - } else { - insert(s); - } - } else { - insert( - createReadPrettyFormBlockSchema({ - actionInitializers, - collection, - resource, - association: resource, - action: 'get', - useSourceId: '{{ useSourceIdFromParentRecord }}', - useParams: '{{ useParamsFromRecord }}', - }), - ); - } - }} - items={useRecordCollectionDataSourceItems('ReadPrettyFormItem', item, collection, resource)} - /> - ); -}; - -export const RecordAssociationDetailsBlockInitializer = (props) => { - const { item, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; - const { getTemplateSchemaByMode } = useSchemaTemplateManager(); - const { getCollection } = useCollectionManager(); - const field = item.field; - const collection = getCollection(field.target); - const resource = `${field.collectionName}.${field.name}`; - return ( - } - {...others} - onClick={async ({ item }) => { - if (item.template) { - const s = await getTemplateSchemaByMode(item); - insert(s); - } else { - insert( - createDetailsBlockSchema({ - collection: field.target, - resource, - association: resource, - rowKey: collection.filterTargetKey || 'id', - }), - ); - } - }} - items={useRecordCollectionDataSourceItems('Details', item, field.target, resource)} - /> - ); -}; - -export const RecordAssociationCalendarBlockInitializer = (props) => { - const { item, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; - const { getTemplateSchemaByMode } = useSchemaTemplateManager(); - const { t } = useTranslation(); - const options = useContext(SchemaOptionsContext); - const { getCollection } = useCollectionManager(); - const field = item.field; - const collection = getCollection(field.target); - const resource = `${field.collectionName}.${field.name}`; - - return ( - } - {...others} - onClick={async ({ item }) => { - if (item.template) { - const s = await getTemplateSchemaByMode(item); - insert(s); - } else { - const stringFields = collection?.fields - ?.filter((field) => field.type === 'string') - ?.map((field) => { - return { - label: field?.uiSchema?.title, - value: field.name, - }; - }); - const dateFields = collection?.fields - ?.filter((field) => field.type === 'date') - ?.map((field) => { - return { - label: field?.uiSchema?.title, - value: field.name, - }; - }); - const values = await FormDialog(t('Create calendar block'), () => { - return ( - - - - - - ); - }).open({ - initialValues: {}, - }); - insert( - createCalendarBlockSchema({ - collection: field.target, - resource, - association: resource, - fieldNames: { - ...values, - }, - }), - ); - } - }} - items={useRecordCollectionDataSourceItems('Calendar', item, field.target, resource)} - /> - ); -}; - -export const RecordAssociationBlockInitializer = (props) => { - const { item, onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; - const { getTemplateSchemaByMode } = useSchemaTemplateManager(); - const { getCollection } = useCollectionManager(); - const field = item.field; - const collection = getCollection(field.target); - const resource = `${field.collectionName}.${field.name}`; - return ( - } - {...others} - onClick={async ({ item }) => { - if (item.template) { - const s = await getTemplateSchemaByMode(item); - insert(s); - } else { - insert( - createTableBlockSchema({ - rowKey: collection.filterTargetKey, - collection: field.target, - resource, - association: resource, - }), - ); - } - }} - items={useRecordCollectionDataSourceItems('Table', item, field.target, resource)} - /> - ); -}; - -export const TableActionColumnInitializer = (props) => { - const schema = { - type: 'void', - title: '{{ t("Actions") }}', - 'x-decorator': 'TableV2.Column.ActionBar', - 'x-component': 'TableV2.Column', - 'x-designer': 'TableV2.ActionColumnDesigner', - 'x-initializer': 'TableActionColumnInitializers', - 'x-action-column': 'actions', - properties: { - actions: { - type: 'void', - 'x-decorator': 'DndContext', - 'x-component': 'Space', - 'x-component-props': { - split: '|', - }, - properties: {}, - }, - }, - }; - return ; -}; - -export const TableCollectionFieldInitializer = (props) => { - const schema: ISchema = {}; - return ; -}; - -export const CollectionFieldInitializer = (props) => { - const schema: ISchema = {}; - return ; -}; - -export const TableSelectorInitializer = (props) => { - const { onCreateBlockSchema, componentType, createBlockSchema, insert, ...others } = props; - const { getTemplateSchemaByMode } = useSchemaTemplateManager(); - const collection = useCollection(); - return ( - } - {...others} - onClick={async ({ item }) => { - const field = item.field; - insert( - createTableSelectorSchema({ - rowKey: collection.filterTargetKey, - collection: collection.name, - resource: collection.name, - }), - ); - }} - /> - ); -}; +export * from './ActionInitializer'; +export * from './BlockInitializer'; +export * from './BulkDestroyActionInitializer'; +export * from './CalendarBlockInitializer'; +export * from './CollectionFieldInitializer'; +export * from './CreateActionInitializer'; +export * from './CreateFormBlockInitializer'; +export * from './CreateSubmitActionInitializer'; +export * from './CustomizeActionInitializer'; +export * from './DataBlockInitializer'; +export * from './DestroyActionInitializer'; +export * from './DetailsBlockInitializer'; +export * from './FilterActionInitializer'; +export * from './FormBlockInitializer'; +export * from './G2PlotInitializer'; +export * from './InitializerWithSwitch'; +export * from './KanbanBlockInitializer'; +export * from './MarkdownBlockInitializer'; +export * from './PrintActionInitializer'; +export * from './RecordAssociationBlockInitializer'; +export * from './RecordAssociationCalendarBlockInitializer'; +export * from './RecordAssociationDetailsBlockInitializer'; +export * from './RecordAssociationFormBlockInitializer'; +export * from './RecordFormBlockInitializer'; +export * from './RecordReadPrettyAssociationFormBlockInitializer'; +export * from './RecordReadPrettyFormBlockInitializer'; +export * from './SubmitActionInitializer'; +export * from './TableActionColumnInitializer'; +export * from './TableBlockInitializer'; +export * from './TableCollectionFieldInitializer'; +export * from './TableSelectorInitializer'; +export * from './UpdateActionInitializer'; +export * from './UpdateSubmitActionInitializer'; +export * from './ViewActionInitializer';