mirror of
https://gitee.com/nocobase/nocobase.git
synced 2025-07-01 18:52:20 +08:00
feat: integrate openModeAction into PopupActionModel and ViewActionModel
This commit is contained in:
parent
45b23bd526
commit
7151737911
65
packages/core/client/src/flow/actions/openModeAction.tsx
Normal file
65
packages/core/client/src/flow/actions/openModeAction.tsx
Normal file
@ -0,0 +1,65 @@
|
||||
import React from 'react';
|
||||
import { FlowPageComponent } from '../FlowPage';
|
||||
|
||||
export const openModeAction = {
|
||||
title: '打开方式',
|
||||
uiSchema: {
|
||||
mode: {
|
||||
type: 'string',
|
||||
title: '打开方式',
|
||||
enum: [
|
||||
{ label: 'Drawer', value: 'drawer' },
|
||||
{ label: 'Modal', value: 'modal' },
|
||||
],
|
||||
'x-decorator': 'FormItem',
|
||||
'x-component': 'Radio.Group',
|
||||
},
|
||||
size: {
|
||||
type: 'string',
|
||||
title: '弹窗尺寸',
|
||||
enum: [
|
||||
{ label: '小', value: 'small' },
|
||||
{ label: '中', value: 'medium' },
|
||||
{ label: '大', value: 'large' },
|
||||
],
|
||||
'x-decorator': 'FormItem',
|
||||
'x-component': 'Radio.Group',
|
||||
},
|
||||
},
|
||||
defaultParams(ctx) {
|
||||
return {
|
||||
mode: 'drawer',
|
||||
size: 'medium',
|
||||
};
|
||||
},
|
||||
handler(ctx, params) {
|
||||
// eslint-disable-next-line prefer-const
|
||||
let currentDrawer: any;
|
||||
|
||||
function DrawerContent() {
|
||||
return (
|
||||
<div>
|
||||
<FlowPageComponent
|
||||
parentId={ctx.model.uid}
|
||||
sharedContext={{
|
||||
...ctx.extra,
|
||||
currentDrawer,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const sizeToWidthMap: Record<string, number> = {
|
||||
small: 480,
|
||||
medium: 800,
|
||||
large: 1200,
|
||||
};
|
||||
|
||||
currentDrawer = ctx.globals[params.mode].open({
|
||||
title: '命令式 Drawer',
|
||||
width: sizeToWidthMap[params.size],
|
||||
content: <DrawerContent />,
|
||||
});
|
||||
},
|
||||
};
|
@ -8,9 +8,8 @@
|
||||
*/
|
||||
|
||||
import type { ButtonProps } from 'antd/es/button';
|
||||
import React from 'react';
|
||||
import { FlowPageComponent } from '../FlowPage';
|
||||
import { ActionModel } from './ActionModel';
|
||||
import { openModeAction } from '../actions/openModeAction';
|
||||
|
||||
export class PopupActionModel extends ActionModel {
|
||||
defaultProps: ButtonProps = {
|
||||
@ -26,62 +25,6 @@ PopupActionModel.registerFlow({
|
||||
eventName: 'click',
|
||||
},
|
||||
steps: {
|
||||
open: {
|
||||
title: '打开方式',
|
||||
uiSchema: {
|
||||
mode: {
|
||||
type: 'string',
|
||||
title: '打开方式',
|
||||
enum: [
|
||||
{ label: 'Drawer', value: 'drawer' },
|
||||
{ label: 'Drawer', value: 'drawer' },
|
||||
{ label: 'Modal', value: 'modal' },
|
||||
],
|
||||
'x-decorator': 'FormItem',
|
||||
'x-component': 'Radio.Group',
|
||||
},
|
||||
size: {
|
||||
type: 'string',
|
||||
title: '弹窗尺寸',
|
||||
enum: [
|
||||
{ label: '小', value: 'small' },
|
||||
{ label: '中', value: 'medium' },
|
||||
{ label: '大', value: 'large' },
|
||||
],
|
||||
'x-decorator': 'FormItem',
|
||||
'x-component': 'Radio.Group',
|
||||
},
|
||||
},
|
||||
defaultParams(ctx) {
|
||||
return {
|
||||
mode: 'drawer',
|
||||
size: 'medium',
|
||||
};
|
||||
},
|
||||
handler(ctx, params) {
|
||||
// eslint-disable-next-line prefer-const
|
||||
let currentDrawer: any;
|
||||
|
||||
function DrawerContent() {
|
||||
return (
|
||||
<div>
|
||||
<FlowPageComponent parentId={ctx.model.uid} sharedContext={{ ...ctx.extra, currentDrawer }} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const sizeToWidthMap: Record<string, number> = {
|
||||
small: 480,
|
||||
medium: 800,
|
||||
large: 1200,
|
||||
};
|
||||
|
||||
currentDrawer = ctx.globals[params.mode].open({
|
||||
title: '命令式 Drawer',
|
||||
width: sizeToWidthMap[params.size],
|
||||
content: <DrawerContent />,
|
||||
});
|
||||
},
|
||||
},
|
||||
open: openModeAction,
|
||||
},
|
||||
});
|
||||
|
@ -8,9 +8,8 @@
|
||||
*/
|
||||
|
||||
import type { ButtonProps } from 'antd/es/button';
|
||||
import React from 'react';
|
||||
import { FlowPageComponent } from '../FlowPage';
|
||||
import { ActionModel } from './ActionModel';
|
||||
import { openModeAction } from '../actions/openModeAction';
|
||||
|
||||
export class ViewActionModel extends ActionModel {
|
||||
defaultProps: ButtonProps = {
|
||||
@ -26,61 +25,6 @@ ViewActionModel.registerFlow({
|
||||
eventName: 'click',
|
||||
},
|
||||
steps: {
|
||||
open: {
|
||||
title: '打开方式',
|
||||
uiSchema: {
|
||||
mode: {
|
||||
type: 'string',
|
||||
title: '打开方式',
|
||||
enum: [
|
||||
{ label: 'Drawer', value: 'drawer' },
|
||||
{ label: 'Modal', value: 'modal' },
|
||||
],
|
||||
'x-decorator': 'FormItem',
|
||||
'x-component': 'Radio.Group',
|
||||
},
|
||||
size: {
|
||||
type: 'string',
|
||||
title: '弹窗尺寸',
|
||||
enum: [
|
||||
{ label: '小', value: 'small' },
|
||||
{ label: '中', value: 'medium' },
|
||||
{ label: '大', value: 'large' },
|
||||
],
|
||||
'x-decorator': 'FormItem',
|
||||
'x-component': 'Radio.Group',
|
||||
},
|
||||
},
|
||||
defaultParams(ctx) {
|
||||
return {
|
||||
mode: 'drawer',
|
||||
size: 'medium',
|
||||
};
|
||||
},
|
||||
handler(ctx, params) {
|
||||
// eslint-disable-next-line prefer-const
|
||||
let currentDrawer: any;
|
||||
|
||||
function DrawerContent() {
|
||||
return (
|
||||
<div>
|
||||
<FlowPageComponent parentId={ctx.model.uid} sharedContext={{ ...ctx.extra, currentDrawer }} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const sizeToWidthMap: Record<string, number> = {
|
||||
small: 480,
|
||||
medium: 800,
|
||||
large: 1200,
|
||||
};
|
||||
|
||||
currentDrawer = ctx.globals[params.mode].open({
|
||||
title: '命令式 Drawer',
|
||||
width: sizeToWidthMap[params.size],
|
||||
content: <DrawerContent />,
|
||||
});
|
||||
},
|
||||
},
|
||||
open: openModeAction,
|
||||
},
|
||||
});
|
||||
|
Loading…
x
Reference in New Issue
Block a user