feat: improve code
This commit is contained in:
chenos
parent
ac4c8f031d
commit
46873d5b1e
@ -1,5 +1,5 @@
|
||||
import { uid } from '@formily/shared';
|
||||
import { defaultProps } from './properties';
|
||||
import { defaultProps, operators } from './properties';
|
||||
import { IField } from './types';
|
||||
|
||||
export const attachment: IField = {
|
||||
@ -50,13 +50,23 @@ export const attachment: IField = {
|
||||
},
|
||||
filterable: {
|
||||
children: [
|
||||
{
|
||||
name: 'id',
|
||||
title: '{{t("Exists")}}',
|
||||
operators: [
|
||||
{ label: '{{t("exists")}}', value: '$exists', noValue: true },
|
||||
{ label: '{{t("not exists")}}', value: '$notExists', noValue: true },
|
||||
],
|
||||
schema: {
|
||||
title: '{{t("Exists")}}',
|
||||
type: 'string',
|
||||
'x-component': 'Input',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'filename',
|
||||
title: '{{t("Filename")}}',
|
||||
operators: [
|
||||
{ label: 'empty', value: '$empty' },
|
||||
{ label: 'notEmpty', value: '$notEmpty' },
|
||||
],
|
||||
operators: operators.string,
|
||||
schema: {
|
||||
title: '{{t("Filename")}}',
|
||||
type: 'string',
|
||||
|
||||
@ -71,5 +71,20 @@ export const linkTo: IField = {
|
||||
},
|
||||
filterable: {
|
||||
nested: true,
|
||||
children: [
|
||||
{
|
||||
name: 'id',
|
||||
title: '{{t("Exists")}}',
|
||||
operators: [
|
||||
{ label: '{{t("exists")}}', value: '$exists', noValue: true },
|
||||
{ label: '{{t("not exists")}}', value: '$notExists', noValue: true },
|
||||
],
|
||||
schema: {
|
||||
title: '{{t("Exists")}}',
|
||||
type: 'string',
|
||||
'x-component': 'Input',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
|
||||
@ -6,3 +6,87 @@ group:
|
||||
---
|
||||
|
||||
# Kanban <Badge>待定</Badge>
|
||||
|
||||
## 参数说明
|
||||
|
||||
- dataSource 数据源
|
||||
- groupField 分组字段，dataSource 以哪个字段作为分组
|
||||
- useDataSource，动态数据源
|
||||
- useGroupField，动态的分组字段
|
||||
|
||||
## 示例
|
||||
|
||||
### 静态数据
|
||||
|
||||
```ts
|
||||
{
|
||||
'x-component': 'Kanban',
|
||||
'x-component-props': {
|
||||
dataSource: [],
|
||||
groupField: {
|
||||
name: 'status',
|
||||
enum: [
|
||||
{ label: '进行中', value: 'running' }
|
||||
{ label: '已完成', value: 'done', }
|
||||
],
|
||||
},
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
### 动态数据
|
||||
|
||||
```ts
|
||||
{
|
||||
'x-component': 'Kanban',
|
||||
'x-component-props': {
|
||||
useDataSource: (options) => {
|
||||
// 与表格、日历类似
|
||||
return useRequest(() => Promise.resolve({ data: [] }), options);
|
||||
},
|
||||
useGroupField: () => {
|
||||
// 从上下文获取
|
||||
return {
|
||||
name: 'status',
|
||||
enum: [
|
||||
{ label: '进行中', value: 'running' }
|
||||
{ label: '已完成', value: 'done', }
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
### 特殊节点
|
||||
|
||||
- Kanban.Card 卡片的 schema
|
||||
- Kanban.CardViewer 卡片点击打开的详情
|
||||
- Kanban.CardAdder 添加卡片的按钮
|
||||
|
||||
```ts
|
||||
{
|
||||
'x-component': 'Kanban',
|
||||
'x-component-props': {
|
||||
dataSource: [],
|
||||
groupField: {
|
||||
name: 'status',
|
||||
enum: [
|
||||
{ label: '进行中', value: 'running' }
|
||||
{ label: '已完成', value: 'done', }
|
||||
],
|
||||
},
|
||||
},
|
||||
properties: {
|
||||
card: {
|
||||
'x-component': 'Kanban.Card',
|
||||
},
|
||||
viewer: {
|
||||
'x-component': 'Kanban.CardViewer',
|
||||
},
|
||||
adder: {
|
||||
'x-component': 'Kanban.CardAdder',
|
||||
},
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
@ -58,27 +58,31 @@ const createSchema = (collectionName, { title, start, end }) => {
|
||||
useValues: '{{ cm.useValuesFromRecord }}',
|
||||
},
|
||||
'x-component': 'Action.Drawer',
|
||||
title: '{{ t("Edit record") }}',
|
||||
'x-component-props': {
|
||||
className: 'nb-action-popup',
|
||||
},
|
||||
title: '{{ t("View record") }}',
|
||||
properties: {
|
||||
grid: {
|
||||
tabs: {
|
||||
type: 'void',
|
||||
'x-component': 'Grid',
|
||||
'x-initializer': 'GridFormItemInitializers',
|
||||
properties: {},
|
||||
},
|
||||
footer: {
|
||||
type: 'void',
|
||||
'x-component': 'Action.Drawer.Footer',
|
||||
'x-component': 'Tabs',
|
||||
'x-component-props': {},
|
||||
'x-initializer': 'TabPaneInitializers',
|
||||
properties: {
|
||||
actions: {
|
||||
tab1: {
|
||||
type: 'void',
|
||||
'x-initializer': 'PopupFormActionInitializers',
|
||||
'x-decorator': 'DndContext',
|
||||
'x-component': 'ActionBar',
|
||||
'x-component-props': {
|
||||
layout: 'one-column',
|
||||
title: '详情',
|
||||
'x-component': 'Tabs.TabPane',
|
||||
'x-designer': 'Tabs.Designer',
|
||||
'x-component-props': {},
|
||||
properties: {
|
||||
grid: {
|
||||
type: 'void',
|
||||
'x-component': 'Grid',
|
||||
'x-initializer': 'RecordBlockInitializers',
|
||||
properties: {},
|
||||
},
|
||||
},
|
||||
properties: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
@ -104,12 +108,22 @@ export const CalendarBlockInitializer = (props) => {
|
||||
icon={<FormOutlined />}
|
||||
onClick={async ({ item }) => {
|
||||
const collection = getCollection(item.name);
|
||||
const fieldEnum = collection?.fields?.map((field) => {
|
||||
return {
|
||||
label: field?.uiSchema?.title,
|
||||
value: field.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('创建日历区块', () => {
|
||||
return (
|
||||
<SchemaComponentOptions scope={options.scope} components={{ ...options.components }}>
|
||||
@ -119,21 +133,22 @@ export const CalendarBlockInitializer = (props) => {
|
||||
properties: {
|
||||
title: {
|
||||
title: '标题字段',
|
||||
enum: fieldEnum,
|
||||
enum: stringFields,
|
||||
required: true,
|
||||
'x-component': 'Select',
|
||||
'x-decorator': 'FormItem',
|
||||
},
|
||||
start: {
|
||||
title: '开始日期字段',
|
||||
enum: fieldEnum,
|
||||
enum: dateFields,
|
||||
required: true,
|
||||
default: 'createdAt',
|
||||
'x-component': 'Select',
|
||||
'x-decorator': 'FormItem',
|
||||
},
|
||||
end: {
|
||||
title: '结束日期字段',
|
||||
enum: fieldEnum,
|
||||
enum: dateFields,
|
||||
'x-component': 'Select',
|
||||
'x-decorator': 'FormItem',
|
||||
},
|
||||
|
||||
@ -115,6 +115,7 @@ export const LinkToFieldInitializer = (props) => {
|
||||
drawer1: {
|
||||
'x-component': 'Action.Drawer',
|
||||
'x-component-props': {
|
||||
className: 'nb-action-popup',
|
||||
},
|
||||
type: 'void',
|
||||
title: 'Drawer Title',
|
||||
|
||||
@ -31,7 +31,7 @@ export const RecordBlockInitializers = (props: any) => {
|
||||
items={[
|
||||
{
|
||||
type: 'itemGroup',
|
||||
title: 'Data blocks',
|
||||
title: '当前数据区块',
|
||||
children: [
|
||||
{
|
||||
type: 'item',
|
||||
|
||||
@ -12,7 +12,7 @@ export const TabPaneInitializers = () => {
|
||||
const ctx = useActionContext();
|
||||
return {
|
||||
async run() {
|
||||
form.submit();
|
||||
await form.submit();
|
||||
const { title } = form.values;
|
||||
insertBeforeEnd({
|
||||
type: 'void',
|
||||
@ -29,6 +29,7 @@ export const TabPaneInitializers = () => {
|
||||
},
|
||||
},
|
||||
});
|
||||
await form.reset();
|
||||
ctx.setVisible(false);
|
||||
},
|
||||
};
|
||||
|
||||
Loading…
Reference in New Issue
Block a user