feat: integrate openModeAction into PopupActionModel and ViewActionModel

This commit is contained in:
Zeke Zhang 2025-06-19 07:39:42 +08:00
parent 45b23bd526
commit 7151737911
3 changed files with 69 additions and 117 deletions

View 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 />,
});
},
};

View File

@ -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,
},
});

View File

@ -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,
},
});