mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-15 17:31:18 +08:00
amis-saas-7974 静态展示框组件配置面板优化
Change-Id: I3e308743dc639c372f7aa8171c4138882876b43e
This commit is contained in:
jinye
parent
c6199b8f24
commit
5ad7b2d70d
@ -26,47 +26,45 @@ export class DatePlugin extends BasePlugin {
|
||||
};
|
||||
|
||||
panelTitle = '日期展示';
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
return [
|
||||
getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '常规',
|
||||
body: [
|
||||
title: '属性',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
type: 'input-date',
|
||||
name: 'value',
|
||||
label: '日期数值'
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
type: 'input-date',
|
||||
name: 'value',
|
||||
label: '日期数值'
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'format',
|
||||
label: '显示日期格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('YYYY-MM-DD')
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'valueFormat',
|
||||
label: '数据日期格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('X')
|
||||
},
|
||||
getSchemaTpl('placeholder', {
|
||||
pipeIn: defaultValue('-'),
|
||||
label: '占位符'
|
||||
})
|
||||
]
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'format',
|
||||
label: '显示日期格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('YYYY-MM-DD')
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'valueFormat',
|
||||
label: '数据日期格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('X')
|
||||
},
|
||||
{
|
||||
name: 'placeholder',
|
||||
type: 'input-text',
|
||||
pipeIn: defaultValue('-'),
|
||||
label: '占位符'
|
||||
}
|
||||
]
|
||||
getSchemaTpl('status')
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: [getSchemaTpl('className')]
|
||||
},
|
||||
{
|
||||
title: '显隐',
|
||||
body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
|
||||
}
|
||||
getSchemaTpl('onlyClassNameTab')
|
||||
])
|
||||
];
|
||||
};
|
||||
|
||||
@ -21,47 +21,45 @@ export class DatetimePlugin extends DatePlugin {
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
value: Math.round(Date.now() / 1000)
|
||||
};
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
return [
|
||||
getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '常规',
|
||||
body: [
|
||||
title: '属性',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
type: 'input-datetime',
|
||||
name: 'value',
|
||||
label: '日期时间数值'
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
type: 'input-datetime',
|
||||
name: 'value',
|
||||
label: '日期时间数值'
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'format',
|
||||
label: '显示日期时间格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('YYYY-MM-DD HH:mm:ss')
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'valueFormat',
|
||||
label: '数据日期格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('X')
|
||||
},
|
||||
getSchemaTpl('placeholder', {
|
||||
pipeIn: defaultValue('-'),
|
||||
label: '占位符'
|
||||
})
|
||||
]
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'format',
|
||||
label: '显示日期时间格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('YYYY-MM-DD HH:mm:ss')
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'valueFormat',
|
||||
label: '数据日期格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('X')
|
||||
},
|
||||
{
|
||||
name: 'placeholder',
|
||||
type: 'input-text',
|
||||
pipeIn: defaultValue('-'),
|
||||
label: '占位符'
|
||||
}
|
||||
]
|
||||
getSchemaTpl('status')
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: [getSchemaTpl('className')]
|
||||
},
|
||||
{
|
||||
title: '显隐',
|
||||
body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
|
||||
}
|
||||
getSchemaTpl('onlyClassNameTab')
|
||||
])
|
||||
];
|
||||
};
|
||||
|
||||
@ -1,11 +1,249 @@
|
||||
import React from 'react';
|
||||
import {Button} from 'amis';
|
||||
import {defaultValue, getSchemaTpl} from 'amis-editor-core';
|
||||
import {defaultValue, getSchemaTpl, setSchemaTpl, tipedLabel} from 'amis-editor-core';
|
||||
import {registerEditorPlugin} from 'amis-editor-core';
|
||||
import {BaseEventContext, BasePlugin} from 'amis-editor-core';
|
||||
import {EditorNodeType} from 'amis-editor-core';
|
||||
import {mockValue} from 'amis-editor-core';
|
||||
|
||||
// 快速编辑
|
||||
setSchemaTpl('quickEdit', {
|
||||
type: 'ae-switch-more',
|
||||
mode: 'normal',
|
||||
name: 'quickEdit',
|
||||
label: '可快速编辑',
|
||||
value: false,
|
||||
hiddenOnDefault: true,
|
||||
formType: 'extend',
|
||||
pipeIn: (value: any) => !!value,
|
||||
form: {
|
||||
body: [
|
||||
{
|
||||
label: '编辑模式',
|
||||
name: 'quickEdit.mode',
|
||||
type: 'button-group-select',
|
||||
inputClassName: 'items-center',
|
||||
visibleOn: 'data.quickEdit',
|
||||
pipeIn: defaultValue('popOver'),
|
||||
options: [
|
||||
{
|
||||
label: '下拉',
|
||||
value: 'popOver'
|
||||
},
|
||||
{
|
||||
label: '内嵌',
|
||||
value: 'inline'
|
||||
}
|
||||
]
|
||||
},
|
||||
getSchemaTpl('switch', {
|
||||
name: 'quickEdit.saveImmediately',
|
||||
label: tipedLabel('立即保存', '开启后修改即提交，而不是标记修改批量提交。'),
|
||||
visibleOn: 'data.quickEdit',
|
||||
pipeIn: (value: any) => !!value
|
||||
}),
|
||||
getSchemaTpl('apiControl', {
|
||||
name: 'quickEdit.saveImmediately.api',
|
||||
label: '保存接口',
|
||||
mode: 'row',
|
||||
description:
|
||||
'单独给立即保存配置接口，如果不配置，则默认使用quickSaveItemApi。',
|
||||
visibleOn: 'this.quickEdit && this.quickEdit.saveImmediately'
|
||||
}),
|
||||
{
|
||||
name: 'quickEdit',
|
||||
asFormItem: true,
|
||||
visibleOn: 'data.quickEdit',
|
||||
mode: 'row',
|
||||
children: ({value, onChange, data}: any) => {
|
||||
if (value === true) {
|
||||
value = {};
|
||||
}
|
||||
|
||||
const originMode = value.mode;
|
||||
|
||||
value = {
|
||||
type: 'input-text',
|
||||
name: data.name,
|
||||
...value
|
||||
};
|
||||
delete value.mode;
|
||||
|
||||
// todo 多个快速编辑表单模式看来只能代码模式编辑了。
|
||||
|
||||
return (
|
||||
<Button
|
||||
block
|
||||
level="primary"
|
||||
onClick={() => {
|
||||
this.manager.openSubEditor({
|
||||
title: '配置快速编辑类型',
|
||||
value: value,
|
||||
slot: {
|
||||
type: 'form',
|
||||
mode: 'normal',
|
||||
body: ['$$'],
|
||||
wrapWithPanel: false
|
||||
},
|
||||
onChange: value =>
|
||||
onChange(
|
||||
{
|
||||
...value,
|
||||
mode: originMode
|
||||
},
|
||||
'quickEdit'
|
||||
)
|
||||
});
|
||||
}}
|
||||
>
|
||||
配置快速编辑
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
// 查看更多
|
||||
setSchemaTpl('morePopOver', {
|
||||
type: 'ae-switch-more',
|
||||
mode: 'normal',
|
||||
name: 'popOver',
|
||||
label: '查看更多展示',
|
||||
value: false,
|
||||
hiddenOnDefault: true,
|
||||
formType: 'extend',
|
||||
pipeIn: (value: any) => !!value,
|
||||
form: {
|
||||
body: [
|
||||
{
|
||||
label: '弹出模式',
|
||||
name: 'popOver.mode',
|
||||
type: 'button-group-select',
|
||||
visibleOn: 'data.popOver',
|
||||
pipeIn: defaultValue('popOver'),
|
||||
options: [
|
||||
{
|
||||
label: '浮层',
|
||||
value: 'popOver'
|
||||
},
|
||||
|
||||
{
|
||||
label: '弹框',
|
||||
value: 'dialog'
|
||||
},
|
||||
|
||||
{
|
||||
label: '抽屉',
|
||||
value: 'drawer'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'popOver.position',
|
||||
label: '浮层位置',
|
||||
type: 'select',
|
||||
visibleOn: 'data.popOver && (data.popOver.mode === "popOver" || !data.popOver.mode)',
|
||||
pipeIn: defaultValue('center'),
|
||||
options: [
|
||||
{
|
||||
label: '目标左上角',
|
||||
value: 'left-top'
|
||||
},
|
||||
{
|
||||
label: '目标右上角',
|
||||
value: 'right-top'
|
||||
},
|
||||
{
|
||||
label: '目标中部',
|
||||
value: 'center'
|
||||
},
|
||||
{
|
||||
label: '目标左下角',
|
||||
value: 'left-bottom'
|
||||
},
|
||||
{
|
||||
label: '目标右下角',
|
||||
value: 'right-bottom'
|
||||
},
|
||||
{
|
||||
label: '页面左上角',
|
||||
value: 'fixed-left-top'
|
||||
},
|
||||
{
|
||||
label: '页面右上角',
|
||||
value: 'fixed-right-top'
|
||||
},
|
||||
{
|
||||
label: '页面左下角',
|
||||
value: 'fixed-left-bottom'
|
||||
},
|
||||
{
|
||||
label: '页面右下角',
|
||||
value: 'fixed-right-bottom'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
visibleOn: 'data.popOver',
|
||||
name: 'popOver',
|
||||
mode: 'row',
|
||||
asFormItem: true,
|
||||
children: ({value, onChange}: any) => {
|
||||
value = {
|
||||
type: 'panel',
|
||||
title: '查看详情',
|
||||
body: '内容详情',
|
||||
...value
|
||||
};
|
||||
|
||||
return (
|
||||
<Button
|
||||
block
|
||||
level="primary"
|
||||
onClick={() => {
|
||||
this.manager.openSubEditor({
|
||||
title: '配置查看更多展示内容',
|
||||
value: value,
|
||||
onChange: value => onChange(value, 'quickEdit')
|
||||
});
|
||||
}}
|
||||
>
|
||||
查看更多内容配置
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
// 可复制
|
||||
setSchemaTpl('copyable', {
|
||||
type: 'ae-switch-more',
|
||||
mode: 'normal',
|
||||
name: 'copyable',
|
||||
label: '可复制',
|
||||
value: false,
|
||||
hiddenOnDefault: true,
|
||||
formType: 'extend',
|
||||
pipeIn: (value: any) => !!value,
|
||||
form: {
|
||||
body: [
|
||||
{
|
||||
label: '复制内容模板',
|
||||
name: 'copyable.content',
|
||||
type: 'textarea',
|
||||
mode: 'row',
|
||||
maxRow: 2,
|
||||
visibleOn: 'data.copyable',
|
||||
description: '默认为当前字段值，可定制。'
|
||||
}
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
export class StaticControlPlugin extends BasePlugin {
|
||||
// 关联渲染器名字
|
||||
rendererName = 'static';
|
||||
@ -38,10 +276,9 @@ export class StaticControlPlugin extends BasePlugin {
|
||||
]
|
||||
};
|
||||
multifactor = true;
|
||||
|
||||
notRenderFormZone = true;
|
||||
|
||||
panelTitle = '静态展示';
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
const renderer: any = context.info.renderer;
|
||||
|
||||
@ -52,6 +289,13 @@ export class StaticControlPlugin extends BasePlugin {
|
||||
{
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
type: 'alert',
|
||||
inline: false,
|
||||
level: 'warning',
|
||||
className: 'text-sm',
|
||||
body: '<p>当前组件已停止维护，建议您使用<a href="https://aisuda.bce.baidu.com/amis/zh-CN/components/form/formitem#%E9%85%8D%E7%BD%AE%E9%9D%99%E6%80%81%E5%B1%95%E7%A4%BA" target="_blank">静态展示</a>新特性实现表单项及整个表单的静态展示。</p>'
|
||||
},
|
||||
getSchemaTpl('formItemName', {
|
||||
required: false
|
||||
}),
|
||||
@ -64,241 +308,15 @@ export class StaticControlPlugin extends BasePlugin {
|
||||
// ...context?.schema,
|
||||
// type: 'textarea', // 改用多行文本编辑
|
||||
// value: context?.schema.tpl // 避免默认值丢失
|
||||
// },
|
||||
mode: 'vertical' // 改成上下展示模式
|
||||
// }
|
||||
}),
|
||||
getSchemaTpl('switch', {
|
||||
name: 'quickEdit',
|
||||
label: '可快速编辑',
|
||||
pipeIn: (value: any) => !!value
|
||||
}),
|
||||
{
|
||||
label: '快速编辑模式',
|
||||
name: 'quickEdit.mode',
|
||||
type: 'button-group-select',
|
||||
size: 'sm',
|
||||
mode: 'row',
|
||||
className: 'ae-buttonGroupSelect--justify',
|
||||
visibleOn: 'data.quickEdit',
|
||||
pipeIn: defaultValue('popOver'),
|
||||
options: [
|
||||
{
|
||||
label: '下拉',
|
||||
value: 'popOver'
|
||||
},
|
||||
{
|
||||
label: '内嵌',
|
||||
value: 'inline'
|
||||
}
|
||||
]
|
||||
},
|
||||
getSchemaTpl('switch', {
|
||||
name: 'quickEdit.saveImmediately',
|
||||
label: '立即保存',
|
||||
visibleOn: 'data.quickEdit',
|
||||
labelRemark: {
|
||||
className: 'm-l-xs',
|
||||
trigger: 'click',
|
||||
rootClose: true,
|
||||
placement: 'left',
|
||||
content: '开启后修改即提交，而不是标记修改批量提交。'
|
||||
},
|
||||
pipeIn: (value: any) => !!value
|
||||
}),
|
||||
getSchemaTpl('apiControl', {
|
||||
name: 'quickEdit.saveImmediately.api',
|
||||
label: '立即保存接口',
|
||||
description:
|
||||
'是否单独给立即保存配置接口，如果不配置，则默认使用quickSaveItemApi。',
|
||||
visibleOn: 'this.quickEdit && this.quickEdit.saveImmediately'
|
||||
}),
|
||||
{
|
||||
name: 'quickEdit',
|
||||
asFormItem: true,
|
||||
visibleOn: 'data.quickEdit',
|
||||
children: ({value, onChange, data}: any) => {
|
||||
if (value === true) {
|
||||
value = {};
|
||||
}
|
||||
|
||||
const originMode = value.mode;
|
||||
|
||||
value = {
|
||||
type: 'input-text',
|
||||
name: data.name,
|
||||
...value
|
||||
};
|
||||
delete value.mode;
|
||||
|
||||
// todo 多个快速编辑表单模式看来只能代码模式编辑了。
|
||||
|
||||
return (
|
||||
<Button
|
||||
className="m-b ae-Button--enhance"
|
||||
size="sm"
|
||||
block
|
||||
onClick={() => {
|
||||
this.manager.openSubEditor({
|
||||
title: '配置快速编辑类型',
|
||||
value: value,
|
||||
slot: {
|
||||
type: 'form',
|
||||
mode: 'normal',
|
||||
body: ['$$'],
|
||||
wrapWithPanel: false
|
||||
},
|
||||
onChange: value =>
|
||||
onChange(
|
||||
{
|
||||
...value,
|
||||
mode: originMode
|
||||
},
|
||||
'quickEdit'
|
||||
)
|
||||
});
|
||||
}}
|
||||
>
|
||||
配置快速编辑
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
},
|
||||
getSchemaTpl('switch', {
|
||||
name: 'popOver',
|
||||
label: '查看更多展示',
|
||||
pipeIn: (value: any) => !!value
|
||||
}),
|
||||
{
|
||||
label: '弹出模式',
|
||||
name: 'popOver.mode',
|
||||
type: 'button-group-select',
|
||||
size: 'sm',
|
||||
mode: 'row',
|
||||
className: 'ae-buttonGroupSelect--justify',
|
||||
visibleOn: 'data.popOver',
|
||||
pipeIn: defaultValue('popOver'),
|
||||
options: [
|
||||
{
|
||||
label: '浮层',
|
||||
value: 'popOver'
|
||||
},
|
||||
|
||||
{
|
||||
label: '弹框',
|
||||
value: 'dialog'
|
||||
},
|
||||
|
||||
{
|
||||
label: '抽屉',
|
||||
value: 'drawer'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'popOver.position',
|
||||
label: '浮层位置',
|
||||
type: 'select',
|
||||
mode: 'row',
|
||||
visibleOn: 'data.popOver && data.popOver.mode === "popOver"',
|
||||
pipeIn: defaultValue('center'),
|
||||
options: [
|
||||
{
|
||||
label: '目标中部',
|
||||
value: 'center'
|
||||
},
|
||||
|
||||
{
|
||||
label: '目标左上角',
|
||||
value: 'left-top'
|
||||
},
|
||||
|
||||
{
|
||||
label: '目标右上角',
|
||||
value: 'right-top'
|
||||
},
|
||||
|
||||
{
|
||||
label: '目标左下角',
|
||||
value: 'left-bottom'
|
||||
},
|
||||
|
||||
{
|
||||
label: '目标右下角',
|
||||
value: 'right-bottom'
|
||||
},
|
||||
|
||||
{
|
||||
label: '页面左上角',
|
||||
value: 'fixed-left-top'
|
||||
},
|
||||
|
||||
{
|
||||
label: '页面右上角',
|
||||
value: 'fixed-right-top'
|
||||
},
|
||||
|
||||
{
|
||||
label: '页面左下角',
|
||||
value: 'fixed-left-bottom'
|
||||
},
|
||||
|
||||
{
|
||||
label: '页面右下角',
|
||||
value: 'fixed-right-bottom'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
visibleOn: 'data.popOver',
|
||||
name: 'popOver',
|
||||
asFormItem: true,
|
||||
children: ({value, onChange}: any) => {
|
||||
value = {
|
||||
type: 'panel',
|
||||
title: '查看详情',
|
||||
body: '内容详情',
|
||||
...value
|
||||
};
|
||||
|
||||
return (
|
||||
<Button
|
||||
className="m-b ae-Button--enhance"
|
||||
size="sm"
|
||||
block
|
||||
onClick={() => {
|
||||
this.manager.openSubEditor({
|
||||
title: '配置查看更多展示内容',
|
||||
value: value,
|
||||
onChange: value => onChange(value, 'quickEdit')
|
||||
});
|
||||
}}
|
||||
>
|
||||
查看更多内容配置
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
},
|
||||
getSchemaTpl('borderMode'),
|
||||
getSchemaTpl('switch', {
|
||||
name: 'copyable',
|
||||
label: '可复制',
|
||||
pipeIn: (value: any) => !!value
|
||||
}),
|
||||
|
||||
{
|
||||
label: '复制内容模板',
|
||||
name: 'copyable.content',
|
||||
type: 'textarea',
|
||||
mode: 'row',
|
||||
maxRow: 2,
|
||||
visibleOn: 'data.copyable',
|
||||
description: '默认为当前字段值，可定制。'
|
||||
},
|
||||
getSchemaTpl('quickEdit'),
|
||||
getSchemaTpl('morePopOver'),
|
||||
getSchemaTpl('copyable'),
|
||||
getSchemaTpl('labelRemark'),
|
||||
getSchemaTpl('remark'),
|
||||
getSchemaTpl('placeholder'),
|
||||
getSchemaTpl('description'),
|
||||
getSchemaTpl('autoFillApi')
|
||||
getSchemaTpl('description')
|
||||
/*{
|
||||
children: (
|
||||
<Button
|
||||
@ -314,14 +332,22 @@ export class StaticControlPlugin extends BasePlugin {
|
||||
},*/
|
||||
]
|
||||
},
|
||||
getSchemaTpl('status', {isFormItem: true}),
|
||||
getSchemaTpl('validation', {tag: '1'})
|
||||
getSchemaTpl('status', {
|
||||
isFormItem: true,
|
||||
unsupportStatic: true
|
||||
})
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
getSchemaTpl('style:formItem', {renderer}),
|
||||
{
|
||||
title: '控件',
|
||||
body: [
|
||||
getSchemaTpl('borderMode')
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'CSS类名',
|
||||
body: [
|
||||
|
||||
@ -32,167 +32,180 @@ export class ImagePlugin extends BasePlugin {
|
||||
};
|
||||
|
||||
panelTitle = '图片';
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
const isUnderField = /\/field\/\w+$/.test(context.path as string);
|
||||
return [
|
||||
getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '常规',
|
||||
body: [
|
||||
{
|
||||
name: 'imageMode',
|
||||
label: '展示模式',
|
||||
type: 'select',
|
||||
pipeIn: defaultValue('thumb'),
|
||||
options: [
|
||||
{
|
||||
label: '缩率图',
|
||||
value: 'thumb'
|
||||
},
|
||||
{
|
||||
label: '原图',
|
||||
value: 'original'
|
||||
return getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '属性',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
name: 'imageMode',
|
||||
label: '展示模式',
|
||||
type: 'select',
|
||||
pipeIn: defaultValue('thumb'),
|
||||
options: [
|
||||
{
|
||||
label: '缩率图',
|
||||
value: 'thumb'
|
||||
},
|
||||
{
|
||||
label: '原图',
|
||||
value: 'original'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'title',
|
||||
type: 'input-text',
|
||||
label: '图片标题'
|
||||
},
|
||||
{
|
||||
name: 'imageCaption',
|
||||
type: 'input-text',
|
||||
label: '图片描述'
|
||||
},
|
||||
|
||||
{
|
||||
name: 'width',
|
||||
label: '宽度',
|
||||
type: 'input-number'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
label: '高度',
|
||||
type: 'input-number'
|
||||
},
|
||||
|
||||
isUnderField
|
||||
? null
|
||||
: getSchemaTpl('imageUrl', {
|
||||
name: 'src',
|
||||
type: 'input-text',
|
||||
label: '缩略图地址',
|
||||
description: '如果已绑定字段名，可以不用设置，支持用变量。'
|
||||
}),
|
||||
{
|
||||
type: 'input-text',
|
||||
label: '打开外部链接',
|
||||
name: 'href'
|
||||
},
|
||||
getSchemaTpl('imageUrl', {
|
||||
name: 'defaultImage',
|
||||
label: '无数据时显示的图片'
|
||||
})
|
||||
]
|
||||
},
|
||||
getSchemaTpl('status')
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
type: 'ae-switch-more',
|
||||
mode: 'normal',
|
||||
name: 'enlargeAble',
|
||||
label: '图片放大功能',
|
||||
value: false,
|
||||
hiddenOnDefault: false,
|
||||
formType: 'extend',
|
||||
pipeIn: (value: any) => !!value,
|
||||
form: {
|
||||
body: [
|
||||
getSchemaTpl('imageUrl', {
|
||||
name: 'originalSrc',
|
||||
label: '原图地址',
|
||||
description: '如果不配置将默认使用缩略图地址。'
|
||||
})
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'title',
|
||||
type: 'input-text',
|
||||
label: '图片标题'
|
||||
},
|
||||
{
|
||||
name: 'imageCaption',
|
||||
type: 'input-text',
|
||||
label: '图片描述'
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
name: 'width',
|
||||
label: '宽度',
|
||||
type: 'input-number'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
label: '高度',
|
||||
type: 'input-number'
|
||||
},
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showDimensions',
|
||||
label: '显示图片尺寸'
|
||||
}),
|
||||
|
||||
isUnderField
|
||||
? null
|
||||
: getSchemaTpl('imageUrl', {
|
||||
name: 'src',
|
||||
type: 'input-text',
|
||||
label: '缩略图地址',
|
||||
description: '如果已绑定字段名，可以不用设置，支持用变量。'
|
||||
}),
|
||||
{
|
||||
type: 'input-text',
|
||||
label: '打开外部链接',
|
||||
name: 'href'
|
||||
},
|
||||
getSchemaTpl('imageUrl', {
|
||||
name: 'defaultImage',
|
||||
label: '无数据时显示的图片'
|
||||
})
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: [
|
||||
getSchemaTpl('switch', {
|
||||
name: 'enlargeAble',
|
||||
label: '开启图片放大功能'
|
||||
}),
|
||||
{
|
||||
name: 'thumbMode',
|
||||
type: 'select',
|
||||
label: '缩略图展示模式',
|
||||
pipeIn: defaultValue('contain'),
|
||||
options: [
|
||||
{
|
||||
label: '宽度占满',
|
||||
value: 'w-full'
|
||||
},
|
||||
|
||||
getSchemaTpl('imageUrl', {
|
||||
name: 'originalSrc',
|
||||
visibleOn: 'this.enlargeAble',
|
||||
label: '原图地址',
|
||||
description: '如果不配置将默认使用缩略图地址。'
|
||||
}),
|
||||
{
|
||||
label: '高度占满',
|
||||
value: 'h-full'
|
||||
},
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showDimensions',
|
||||
label: '是否显示图片尺寸'
|
||||
}),
|
||||
{
|
||||
label: '包含',
|
||||
value: 'contain'
|
||||
},
|
||||
|
||||
{
|
||||
name: 'thumbMode',
|
||||
type: 'button-group-select',
|
||||
label: '缩略图展示模式',
|
||||
size: 'sm',
|
||||
pipeIn: defaultValue('contain'),
|
||||
options: [
|
||||
{
|
||||
label: '宽度占满',
|
||||
value: 'w-full'
|
||||
},
|
||||
{
|
||||
label: '铺满',
|
||||
value: 'cover'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'thumbRatio',
|
||||
type: 'button-group-select',
|
||||
label: '缩略图比率',
|
||||
size: 'sm',
|
||||
pipeIn: defaultValue('1:1'),
|
||||
options: [
|
||||
{
|
||||
label: '1:1',
|
||||
value: '1:1'
|
||||
},
|
||||
|
||||
{
|
||||
label: '高度占满',
|
||||
value: 'h-full'
|
||||
},
|
||||
{
|
||||
label: '4:3',
|
||||
value: '4:3'
|
||||
},
|
||||
|
||||
{
|
||||
label: '包含',
|
||||
value: 'contain'
|
||||
},
|
||||
{
|
||||
label: '16:9',
|
||||
value: '16:9'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'CSS类名',
|
||||
body: [
|
||||
getSchemaTpl('className', {
|
||||
label: '外层'
|
||||
}),
|
||||
|
||||
{
|
||||
label: '铺满',
|
||||
value: 'cover'
|
||||
}
|
||||
]
|
||||
},
|
||||
getSchemaTpl('className', {
|
||||
name: 'imageClassName',
|
||||
label: '图片'
|
||||
}),
|
||||
|
||||
{
|
||||
name: 'thumbRatio',
|
||||
type: 'button-group-select',
|
||||
label: '缩略图比率',
|
||||
size: 'sm',
|
||||
pipeIn: defaultValue('1:1'),
|
||||
options: [
|
||||
{
|
||||
label: '1:1',
|
||||
value: '1:1'
|
||||
},
|
||||
|
||||
{
|
||||
label: '4:3',
|
||||
value: '4:3'
|
||||
},
|
||||
|
||||
{
|
||||
label: '16:9',
|
||||
value: '16:9'
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
getSchemaTpl('className', {
|
||||
autoComplete: false
|
||||
}),
|
||||
|
||||
getSchemaTpl('className', {
|
||||
name: 'imageClassName',
|
||||
label: '图片 CSS 类名'
|
||||
}),
|
||||
|
||||
getSchemaTpl('className', {
|
||||
name: 'thumbClassName',
|
||||
label: '缩略图 CSS 类名'
|
||||
})
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '显隐',
|
||||
body: [
|
||||
// getSchemaTpl('ref'),
|
||||
getSchemaTpl('visible')
|
||||
]
|
||||
}
|
||||
])
|
||||
];
|
||||
getSchemaTpl('className', {
|
||||
name: 'thumbClassName',
|
||||
label: '缩略图'
|
||||
})
|
||||
]
|
||||
}
|
||||
])
|
||||
}
|
||||
]);
|
||||
};
|
||||
|
||||
onActive(event: PluginEvent<ActiveEventContext>) {
|
||||
|
||||
@ -37,190 +37,203 @@ export class ImagesPlugin extends BasePlugin {
|
||||
};
|
||||
|
||||
panelTitle = '图片集';
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
const isUnderField = /\/field\/\w+$/.test(context.path as string);
|
||||
return [
|
||||
getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '常规',
|
||||
body: (isUnderField
|
||||
? []
|
||||
: [
|
||||
{
|
||||
type: 'formula',
|
||||
name: '__mode',
|
||||
autoSet: false,
|
||||
formula:
|
||||
'!this.name && !this.source && Array.isArray(this.options) ? 2 : 1'
|
||||
},
|
||||
{
|
||||
label: '数据源',
|
||||
name: '__mode',
|
||||
type: 'button-group-select',
|
||||
size: 'xs',
|
||||
mode: 'inline',
|
||||
className: 'w-full',
|
||||
options: [
|
||||
{
|
||||
label: '关联字段',
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
label: '静态设置',
|
||||
value: 2
|
||||
}
|
||||
],
|
||||
onChange: (
|
||||
value: any,
|
||||
oldValue: any,
|
||||
model: any,
|
||||
form: any
|
||||
) => {
|
||||
if (value !== oldValue && value == 1) {
|
||||
form.deleteValueByName('options');
|
||||
}
|
||||
return getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '属性',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
title: '基本',
|
||||
body: (isUnderField ? [] : [
|
||||
{
|
||||
type: 'formula',
|
||||
name: '__mode',
|
||||
autoSet: false,
|
||||
formula:
|
||||
'!this.name && !this.source && Array.isArray(this.options) ? 2 : 1'
|
||||
},
|
||||
{
|
||||
label: '数据源',
|
||||
name: '__mode',
|
||||
type: 'button-group-select',
|
||||
size: 'xs',
|
||||
mode: 'inline',
|
||||
className: 'w-full',
|
||||
options: [
|
||||
{
|
||||
label: '关联字段',
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
label: '静态设置',
|
||||
value: 2
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'source',
|
||||
type: 'input-text',
|
||||
label: '关联数据',
|
||||
description:
|
||||
'比如：\\${listVar}，用来关联作用域中的已有数据。',
|
||||
visibleOn: 'this.__mode == 1'
|
||||
},
|
||||
{
|
||||
type: 'combo',
|
||||
name: 'options',
|
||||
visibleOn: 'this.__mode == 2',
|
||||
minLength: 1,
|
||||
label: '图片集数据',
|
||||
multiple: true,
|
||||
multiLine: true,
|
||||
addable: true,
|
||||
removable: true,
|
||||
items: [
|
||||
getSchemaTpl('imageUrl', {
|
||||
name: 'image',
|
||||
label: '缩略图'
|
||||
}),
|
||||
getSchemaTpl('imageUrl', {
|
||||
name: 'src',
|
||||
label: '原图'
|
||||
}),
|
||||
],
|
||||
onChange: (
|
||||
value: any,
|
||||
oldValue: any,
|
||||
model: any,
|
||||
form: any
|
||||
) => {
|
||||
if (value !== oldValue && value == 1) {
|
||||
form.deleteValueByName('options');
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'source',
|
||||
type: 'input-text',
|
||||
label: '关联数据',
|
||||
description:
|
||||
'比如：\\${listVar}，用来关联作用域中的已有数据。',
|
||||
visibleOn: 'this.__mode == 1'
|
||||
},
|
||||
{
|
||||
type: 'combo',
|
||||
name: 'options',
|
||||
visibleOn: 'this.__mode == 2',
|
||||
minLength: 1,
|
||||
label: '图片集数据',
|
||||
multiple: true,
|
||||
multiLine: true,
|
||||
addable: true,
|
||||
removable: true,
|
||||
items: [
|
||||
getSchemaTpl('imageUrl', {
|
||||
name: 'image',
|
||||
label: '缩略图'
|
||||
}),
|
||||
getSchemaTpl('imageUrl', {
|
||||
name: 'src',
|
||||
label: '原图'
|
||||
}),
|
||||
{
|
||||
type: 'input-text',
|
||||
label: '图片标题',
|
||||
name: 'title'
|
||||
},
|
||||
{
|
||||
type: 'textarea',
|
||||
label: '图片描述',
|
||||
name: 'caption'
|
||||
}
|
||||
]
|
||||
}
|
||||
]).concat([
|
||||
getSchemaTpl('imageUrl', {
|
||||
name: 'defaultImage',
|
||||
label: '无数据时显示的图片'
|
||||
})
|
||||
])
|
||||
},
|
||||
getSchemaTpl('status')
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
type: 'ae-switch-more',
|
||||
mode: 'normal',
|
||||
name: 'enlargeAble',
|
||||
label: '图片放大功能',
|
||||
value: false,
|
||||
hiddenOnDefault: false,
|
||||
formType: 'extend',
|
||||
pipeIn: (value: any) => !!value,
|
||||
form: {
|
||||
body: [
|
||||
{
|
||||
name: 'originalSrc',
|
||||
visibleOn: 'this.enlargeAble',
|
||||
type: 'input-text',
|
||||
label: '图片标题',
|
||||
name: 'title'
|
||||
},
|
||||
{
|
||||
type: 'textarea',
|
||||
label: '图片描述',
|
||||
name: 'caption'
|
||||
label: '原图地址',
|
||||
description: '如果不配置将默认使用缩略图地址。'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
).concat([
|
||||
getSchemaTpl('imageUrl', {
|
||||
name: 'defaultImage',
|
||||
label: '无数据时显示的图片'
|
||||
})
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: [
|
||||
getSchemaTpl('switch', {
|
||||
name: 'enlargeAble',
|
||||
label: '开启图片放大功能'
|
||||
}),
|
||||
},
|
||||
|
||||
{
|
||||
name: 'originalSrc',
|
||||
visibleOn: 'this.enlargeAble',
|
||||
type: 'input-text',
|
||||
label: '原图地址',
|
||||
description: '如果不配置将默认使用缩略图地址。'
|
||||
},
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showDimensions',
|
||||
label: '显示图片尺寸'
|
||||
}),
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showDimensions',
|
||||
label: '是否显示图片尺寸'
|
||||
}),
|
||||
{
|
||||
name: 'thumbMode',
|
||||
type: 'select',
|
||||
label: '缩略图展示模式',
|
||||
pipeIn: defaultValue('contain'),
|
||||
options: [
|
||||
{
|
||||
label: '宽度占满',
|
||||
value: 'w-full'
|
||||
},
|
||||
|
||||
{
|
||||
name: 'thumbMode',
|
||||
type: 'button-group-select',
|
||||
label: '缩略图展示模式',
|
||||
size: 'sm',
|
||||
pipeIn: defaultValue('contain'),
|
||||
options: [
|
||||
{
|
||||
label: '宽度占满',
|
||||
value: 'w-full'
|
||||
},
|
||||
{
|
||||
label: '高度占满',
|
||||
value: 'h-full'
|
||||
},
|
||||
|
||||
{
|
||||
label: '高度占满',
|
||||
value: 'h-full'
|
||||
},
|
||||
{
|
||||
label: '包含',
|
||||
value: 'contain'
|
||||
},
|
||||
|
||||
{
|
||||
label: '包含',
|
||||
value: 'contain'
|
||||
},
|
||||
{
|
||||
label: '铺满',
|
||||
value: 'cover'
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
label: '铺满',
|
||||
value: 'cover'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'thumbRatio',
|
||||
type: 'button-group-select',
|
||||
label: '缩略图比率',
|
||||
size: 'sm',
|
||||
pipeIn: defaultValue('1:1'),
|
||||
options: [
|
||||
{
|
||||
label: '1:1',
|
||||
value: '1:1'
|
||||
},
|
||||
|
||||
{
|
||||
name: 'thumbRatio',
|
||||
type: 'button-group-select',
|
||||
label: '缩略图比率',
|
||||
size: 'sm',
|
||||
pipeIn: defaultValue('1:1'),
|
||||
options: [
|
||||
{
|
||||
label: '1:1',
|
||||
value: '1:1'
|
||||
},
|
||||
{
|
||||
label: '4:3',
|
||||
value: '4:3'
|
||||
},
|
||||
|
||||
{
|
||||
label: '4:3',
|
||||
value: '4:3'
|
||||
},
|
||||
{
|
||||
label: '16:9',
|
||||
value: '16:9'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'CSS类名',
|
||||
body: [
|
||||
getSchemaTpl('className', {
|
||||
autoComplete: false,
|
||||
label: '外层'
|
||||
}),
|
||||
|
||||
{
|
||||
label: '16:9',
|
||||
value: '16:9'
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
getSchemaTpl('className', {
|
||||
autoComplete: false
|
||||
}),
|
||||
|
||||
getSchemaTpl('className', {
|
||||
name: 'listClassName',
|
||||
label: '图片列表 CSS 类名'
|
||||
})
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '显隐',
|
||||
body: [
|
||||
// getSchemaTpl('ref'),
|
||||
getSchemaTpl('visible')
|
||||
]
|
||||
}
|
||||
])
|
||||
];
|
||||
getSchemaTpl('className', {
|
||||
name: 'listClassName',
|
||||
label: '图片列表'
|
||||
})
|
||||
]
|
||||
}
|
||||
])
|
||||
}
|
||||
]);
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -30,38 +30,38 @@ export class JsonPlugin extends BasePlugin {
|
||||
};
|
||||
|
||||
panelTitle = 'JSON';
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
const isUnderField = /\/field\/\w+$/.test(context.path as string);
|
||||
return [
|
||||
getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '常规',
|
||||
body: flatten([
|
||||
isUnderField
|
||||
? {
|
||||
type: 'tpl',
|
||||
inline: false,
|
||||
className: 'text-info text-sm',
|
||||
tpl: '<p>当前为字段内容节点配置，选择上层还有更多的配置。</p>'
|
||||
}
|
||||
: null,
|
||||
|
||||
title: '属性',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
name: 'levelExpand',
|
||||
type: 'input-number',
|
||||
label: '默认展开级别',
|
||||
pipeIn: defaultValue(1)
|
||||
}
|
||||
title: '基本',
|
||||
body: [
|
||||
isUnderField
|
||||
? {
|
||||
type: 'tpl',
|
||||
inline: false,
|
||||
className: 'text-info text-sm',
|
||||
tpl: '<p>当前为字段内容节点配置，选择上层还有更多配置</p>'
|
||||
}
|
||||
: null,
|
||||
|
||||
{
|
||||
name: 'levelExpand',
|
||||
type: 'input-number',
|
||||
label: '默认展开级别',
|
||||
pipeIn: defaultValue(1)
|
||||
}
|
||||
]
|
||||
},
|
||||
getSchemaTpl('status')
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: flatten([getSchemaTpl('className')])
|
||||
},
|
||||
{
|
||||
title: '显隐',
|
||||
body: flatten([getSchemaTpl('ref'), getSchemaTpl('visible')])
|
||||
}
|
||||
getSchemaTpl('onlyClassNameTab')
|
||||
])
|
||||
];
|
||||
};
|
||||
|
||||
@ -55,85 +55,96 @@ export class ListPlugin extends BasePlugin {
|
||||
};
|
||||
|
||||
panelTitle = '列表';
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
const isCRUDBody = context.schema.type === 'crud';
|
||||
|
||||
return getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '常规',
|
||||
body: [
|
||||
title: '属性',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
children: (
|
||||
<Button
|
||||
level="danger"
|
||||
size="sm"
|
||||
block
|
||||
onClick={this.editDetail.bind(this, context.id)}
|
||||
>
|
||||
配置成员详情
|
||||
</Button>
|
||||
)
|
||||
},
|
||||
{
|
||||
type: 'divider'
|
||||
},
|
||||
{
|
||||
name: 'title',
|
||||
type: 'input-text',
|
||||
label: '标题'
|
||||
},
|
||||
isCRUDBody
|
||||
? null
|
||||
: {
|
||||
name: 'source',
|
||||
type: 'input-text',
|
||||
label: '数据源',
|
||||
pipeIn: defaultValue('${items}'),
|
||||
description: '绑定当前环境变量'
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
children: (
|
||||
<Button
|
||||
level="danger"
|
||||
size="sm"
|
||||
block
|
||||
onClick={this.editDetail.bind(this, context.id)}
|
||||
>
|
||||
配置成员详情
|
||||
</Button>
|
||||
)
|
||||
},
|
||||
{
|
||||
name: 'placeholder',
|
||||
pipeIn: defaultValue('没有数据'),
|
||||
type: 'input-text',
|
||||
label: '无数据提示'
|
||||
}
|
||||
]
|
||||
{
|
||||
type: 'divider'
|
||||
},
|
||||
{
|
||||
name: 'title',
|
||||
type: 'input-text',
|
||||
label: '标题'
|
||||
},
|
||||
isCRUDBody
|
||||
? null
|
||||
: {
|
||||
name: 'source',
|
||||
type: 'input-text',
|
||||
label: '数据源',
|
||||
pipeIn: defaultValue('${items}'),
|
||||
description: '绑定当前环境变量'
|
||||
},
|
||||
{
|
||||
name: 'placeholder',
|
||||
pipeIn: defaultValue('没有数据'),
|
||||
type: 'input-text',
|
||||
label: '无数据提示'
|
||||
}
|
||||
]
|
||||
},
|
||||
getSchemaTpl('status')
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: [
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showHeader',
|
||||
label: '是否显示头部',
|
||||
pipeIn: defaultValue(true)
|
||||
}),
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
title: '基本',
|
||||
body: [
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showHeader',
|
||||
label: '是否显示头部',
|
||||
pipeIn: defaultValue(true)
|
||||
}),
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showFooter',
|
||||
label: '是否显示底部',
|
||||
pipeIn: defaultValue(true)
|
||||
}),
|
||||
|
||||
getSchemaTpl('className', {
|
||||
label: 'CSS 类名'
|
||||
}),
|
||||
getSchemaTpl('className', {
|
||||
name: 'listClassName',
|
||||
label: 'List div CSS 类名'
|
||||
}),
|
||||
getSchemaTpl('className', {
|
||||
name: 'headerClassName',
|
||||
label: '头部 CSS 类名'
|
||||
}),
|
||||
getSchemaTpl('className', {
|
||||
name: 'footerClassName',
|
||||
label: '底部 CSS 类名'
|
||||
})
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '显隐',
|
||||
body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showFooter',
|
||||
label: '是否显示底部',
|
||||
pipeIn: defaultValue(true)
|
||||
})
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'CSS类名',
|
||||
body: [
|
||||
getSchemaTpl('className', {
|
||||
label: '外层'
|
||||
}),
|
||||
getSchemaTpl('className', {
|
||||
name: 'listClassName',
|
||||
label: 'List'
|
||||
}),
|
||||
getSchemaTpl('className', {
|
||||
name: 'headerClassName',
|
||||
label: '头部'
|
||||
}),
|
||||
getSchemaTpl('className', {
|
||||
name: 'footerClassName',
|
||||
label: '底部'
|
||||
})
|
||||
]
|
||||
}
|
||||
])
|
||||
}
|
||||
]);
|
||||
};
|
||||
|
||||
@ -34,114 +34,112 @@ export class MappingPlugin extends BasePlugin {
|
||||
};
|
||||
|
||||
panelTitle = '映射';
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
const isUnderField = /\/field\/\w+$/.test(context.path as string);
|
||||
return [
|
||||
getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '常规',
|
||||
body: [
|
||||
isUnderField
|
||||
? {
|
||||
type: 'tpl',
|
||||
inline: false,
|
||||
className: 'text-info text-sm',
|
||||
tpl: '<p>当前为字段内容节点配置，选择上层还有更多的配置。</p>'
|
||||
}
|
||||
: null,
|
||||
|
||||
title: '属性',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
label: '映射表',
|
||||
type: 'combo',
|
||||
scaffold: {
|
||||
key: 'key-{index}',
|
||||
value: 'value-{index}'
|
||||
},
|
||||
required: true,
|
||||
name: 'map',
|
||||
descriptionClassName: 'help-block text-xs m-b-none',
|
||||
description:
|
||||
'<p>当值命中左侧 Key 时，展示右侧内容，当没有命中时，默认实现 Key 为 <code>*</code>的内容</div>(请确保key值唯一)',
|
||||
multiple: true,
|
||||
pipeIn: (value: any) => {
|
||||
if (!isObject(value)) {
|
||||
return [
|
||||
{
|
||||
key: '*',
|
||||
value: '通配值'
|
||||
title: '基本',
|
||||
body: [
|
||||
isUnderField
|
||||
? {
|
||||
type: 'tpl',
|
||||
inline: false,
|
||||
className: 'text-info text-sm',
|
||||
tpl: '<p>当前为字段内容节点配置，选择上层还有更多配置</p>'
|
||||
}
|
||||
];
|
||||
}
|
||||
: null,
|
||||
|
||||
let arr: Array<any> = [];
|
||||
|
||||
Object.keys(value).forEach(key => {
|
||||
arr.push({
|
||||
key: key || '',
|
||||
value:
|
||||
typeof value[key] === 'string'
|
||||
? value[key]
|
||||
: JSON.stringify(value[key])
|
||||
});
|
||||
});
|
||||
return arr;
|
||||
},
|
||||
pipeOut: (value: any) => {
|
||||
if (!Array.isArray(value)) {
|
||||
return value;
|
||||
}
|
||||
let obj: any = {};
|
||||
|
||||
value.forEach((item: any, idx: number) => {
|
||||
let key: string = item.key || '';
|
||||
let value: any = item.value;
|
||||
if (key === 'key-{index}' && value === 'value-{index}') {
|
||||
key = key.replace('-{index}', `${idx}`);
|
||||
value = value.replace('-{index}', `${idx}`);
|
||||
}
|
||||
try {
|
||||
value = JSON.parse(value);
|
||||
} catch (e) {}
|
||||
|
||||
obj[key] = value;
|
||||
});
|
||||
|
||||
return obj;
|
||||
},
|
||||
items: [
|
||||
{
|
||||
placeholder: 'Key',
|
||||
type: 'input-text',
|
||||
unique: true,
|
||||
name: 'key',
|
||||
label: '映射表',
|
||||
type: 'combo',
|
||||
mode: "col",
|
||||
scaffold: {
|
||||
key: 'key-{index}',
|
||||
value: 'value-{index}'
|
||||
},
|
||||
required: true,
|
||||
columnClassName: 'w-xs'
|
||||
},
|
||||
name: 'map',
|
||||
descriptionClassName: 'help-block text-xs m-b-none',
|
||||
description:
|
||||
'<p>当值命中左侧 Key 时，展示右侧内容，当没有命中时，默认实现 Key 为 <code>*</code>的内容</div>(请确保key值唯一)',
|
||||
multiple: true,
|
||||
pipeIn: (value: any) => {
|
||||
if (!isObject(value)) {
|
||||
return [
|
||||
{
|
||||
key: '*',
|
||||
value: '通配值'
|
||||
}
|
||||
];
|
||||
}
|
||||
|
||||
{
|
||||
placeholder: '内容',
|
||||
type: 'input-text',
|
||||
name: 'value'
|
||||
}
|
||||
let arr: Array<any> = [];
|
||||
|
||||
Object.keys(value).forEach(key => {
|
||||
arr.push({
|
||||
key: key || '',
|
||||
value:
|
||||
typeof value[key] === 'string'
|
||||
? value[key]
|
||||
: JSON.stringify(value[key])
|
||||
});
|
||||
});
|
||||
return arr;
|
||||
},
|
||||
pipeOut: (value: any) => {
|
||||
if (!Array.isArray(value)) {
|
||||
return value;
|
||||
}
|
||||
let obj: any = {};
|
||||
|
||||
value.forEach((item: any, idx: number) => {
|
||||
let key: string = item.key || '';
|
||||
let value: any = item.value;
|
||||
if (key === 'key-{index}' && value === 'value-{index}') {
|
||||
key = key.replace('-{index}', `${idx}`);
|
||||
value = value.replace('-{index}', `${idx}`);
|
||||
}
|
||||
try {
|
||||
value = JSON.parse(value);
|
||||
} catch (e) {}
|
||||
|
||||
obj[key] = value;
|
||||
});
|
||||
|
||||
return obj;
|
||||
},
|
||||
items: [
|
||||
{
|
||||
placeholder: 'Key',
|
||||
type: 'input-text',
|
||||
unique: true,
|
||||
name: 'key',
|
||||
required: true,
|
||||
columnClassName: 'w-xs'
|
||||
},
|
||||
|
||||
{
|
||||
placeholder: '内容',
|
||||
type: 'input-text',
|
||||
name: 'value'
|
||||
}
|
||||
]
|
||||
},
|
||||
getSchemaTpl('placeholder', {
|
||||
pipeIn: defaultValue('-'),
|
||||
label: '占位符'
|
||||
})
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
name: 'placeholder',
|
||||
type: 'input-text',
|
||||
pipeIn: defaultValue('-'),
|
||||
label: '占位符'
|
||||
}
|
||||
]
|
||||
getSchemaTpl('status')
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: [getSchemaTpl('className')]
|
||||
},
|
||||
{
|
||||
title: '显隐',
|
||||
body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
|
||||
}
|
||||
getSchemaTpl('onlyClassNameTab')
|
||||
])
|
||||
];
|
||||
};
|
||||
|
||||
@ -29,53 +29,58 @@ export class PlainPlugin extends BasePlugin {
|
||||
};
|
||||
|
||||
panelTitle = '纯文本';
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
const isTableCell = context.info.renderer.name === 'table-cell';
|
||||
|
||||
return getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '常规',
|
||||
body: [
|
||||
{
|
||||
label: '内容',
|
||||
type: 'textarea',
|
||||
pipeIn: (value: any, data: any) => value || (data && data.text),
|
||||
name: 'tpl',
|
||||
description:
|
||||
'如果当前字段有值，请不要设置，否则覆盖。支持使用 <code>\\${xxx}</code> 来获取变量，或者用 lodash.template 语法来写模板逻辑。<a target="_blank" href="/amis/zh-CN/docs/concepts/template">详情</a>'
|
||||
},
|
||||
|
||||
{
|
||||
name: 'placeholder',
|
||||
label: '占位符',
|
||||
type: 'input-text',
|
||||
pipeIn: defaultValue('-')
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
isTableCell
|
||||
? null
|
||||
: {
|
||||
title: '外观',
|
||||
body: [
|
||||
getSchemaTpl('switch', {
|
||||
name: 'inline',
|
||||
label: '内联模式',
|
||||
value: true
|
||||
}),
|
||||
|
||||
getSchemaTpl('className')
|
||||
]
|
||||
},
|
||||
|
||||
isTableCell
|
||||
? null
|
||||
: {
|
||||
title: '显隐',
|
||||
body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
|
||||
}
|
||||
]);
|
||||
return [
|
||||
getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '属性',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
label: '内容',
|
||||
type: 'textarea',
|
||||
mode: 'col',
|
||||
pipeIn: (value: any, data: any) => value || (data && data.text),
|
||||
name: 'tpl',
|
||||
description:
|
||||
'如果当前字段有值，请不要设置，否则覆盖。支持使用 <code>\\${xxx}</code> 来获取变量，或者用 lodash.template 语法来写模板逻辑。<a target="_blank" href="/amis/zh-CN/docs/concepts/template">详情</a>'
|
||||
},
|
||||
getSchemaTpl('placeholder', {
|
||||
pipeIn: defaultValue('-'),
|
||||
label: '占位符'
|
||||
})
|
||||
]
|
||||
},
|
||||
isTableCell ? null : getSchemaTpl('status')
|
||||
])
|
||||
},
|
||||
isTableCell ? null : {
|
||||
title: '外观',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
title: '基本',
|
||||
body: [
|
||||
getSchemaTpl('switch', {
|
||||
name: 'inline',
|
||||
label: '内联模式',
|
||||
value: true
|
||||
})
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'CSS类名',
|
||||
body: [
|
||||
getSchemaTpl('className')
|
||||
]
|
||||
}
|
||||
])
|
||||
}
|
||||
])
|
||||
];
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -333,194 +333,205 @@ export class TablePlugin extends BasePlugin {
|
||||
description: '开启表格拖拽排序功能'
|
||||
}
|
||||
];
|
||||
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
const isCRUDBody = context.schema.type === 'crud';
|
||||
|
||||
return getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '常规',
|
||||
body: [
|
||||
title: '属性',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
name: 'title',
|
||||
type: 'input-text',
|
||||
label: '标题'
|
||||
},
|
||||
|
||||
isCRUDBody
|
||||
? null
|
||||
: {
|
||||
name: 'source',
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
name: 'title',
|
||||
type: 'input-text',
|
||||
label: '数据源',
|
||||
pipeIn: defaultValue('${items}'),
|
||||
description: '绑定当前环境变量'
|
||||
label: '标题'
|
||||
},
|
||||
|
||||
{
|
||||
name: 'combineNum',
|
||||
label: '自动合并单元格',
|
||||
type: 'input-number',
|
||||
placeholder: '设置列数',
|
||||
description:
|
||||
'设置从左到右多少列内启用自动合并单元格，根据字段值是否相同来决定是否合并。'
|
||||
}
|
||||
isCRUDBody
|
||||
? null
|
||||
: {
|
||||
name: 'source',
|
||||
type: 'input-text',
|
||||
label: '数据源',
|
||||
pipeIn: defaultValue('${items}'),
|
||||
description: '绑定当前环境变量'
|
||||
},
|
||||
|
||||
// {
|
||||
// children: (
|
||||
// <div>
|
||||
// <Button
|
||||
// level="info"
|
||||
// size="sm"
|
||||
// className="m-b-sm"
|
||||
// block
|
||||
// onClick={this.handleAdd}
|
||||
// >
|
||||
// 新增一列
|
||||
// </Button>
|
||||
// </div>
|
||||
// )
|
||||
// },
|
||||
{
|
||||
name: 'combineNum',
|
||||
label: '自动合并单元格',
|
||||
type: 'input-number',
|
||||
placeholder: '设置列数',
|
||||
description:
|
||||
'设置从左到右多少列内启用自动合并单元格，根据字段值是否相同来决定是否合并。'
|
||||
}
|
||||
|
||||
// {
|
||||
// children: (
|
||||
// <div>
|
||||
// <Button
|
||||
// level="success"
|
||||
// size="sm"
|
||||
// block
|
||||
// onClick={this.handleColumnsQuickEdit.bind(this)}
|
||||
// >
|
||||
// 快速编辑列信息
|
||||
// </Button>
|
||||
// </div>
|
||||
// )
|
||||
// }
|
||||
]
|
||||
// {
|
||||
// children: (
|
||||
// <div>
|
||||
// <Button
|
||||
// level="info"
|
||||
// size="sm"
|
||||
// className="m-b-sm"
|
||||
// block
|
||||
// onClick={this.handleAdd}
|
||||
// >
|
||||
// 新增一列
|
||||
// </Button>
|
||||
// </div>
|
||||
// )
|
||||
// },
|
||||
|
||||
// {
|
||||
// children: (
|
||||
// <div>
|
||||
// <Button
|
||||
// level="success"
|
||||
// size="sm"
|
||||
// block
|
||||
// onClick={this.handleColumnsQuickEdit.bind(this)}
|
||||
// >
|
||||
// 快速编辑列信息
|
||||
// </Button>
|
||||
// </div>
|
||||
// )
|
||||
// }
|
||||
]
|
||||
},
|
||||
getSchemaTpl('status')
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: [
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
name: 'columnsTogglable',
|
||||
label: '展示列显示开关',
|
||||
type: 'button-group-select',
|
||||
pipeIn: defaultValue('auto'),
|
||||
mode: 'inline',
|
||||
className: 'w-full',
|
||||
size: 'xs',
|
||||
options: [
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
label: '自动',
|
||||
value: 'auto'
|
||||
name: 'columnsTogglable',
|
||||
label: '展示列显示开关',
|
||||
type: 'button-group-select',
|
||||
pipeIn: defaultValue('auto'),
|
||||
mode: 'inline',
|
||||
className: 'w-full',
|
||||
size: 'xs',
|
||||
options: [
|
||||
{
|
||||
label: '自动',
|
||||
value: 'auto'
|
||||
},
|
||||
|
||||
{
|
||||
label: '开启',
|
||||
value: true
|
||||
},
|
||||
|
||||
{
|
||||
label: '关闭',
|
||||
value: false
|
||||
}
|
||||
],
|
||||
description: '自动即列数量大于5个时自动开启'
|
||||
},
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'affixHeader',
|
||||
label: '是否固顶表头',
|
||||
pipeIn: defaultValue(true)
|
||||
}),
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showHeader',
|
||||
label: '是否显示头部',
|
||||
pipeIn: defaultValue(true)
|
||||
}),
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showFooter',
|
||||
label: '是否显示底部',
|
||||
pipeIn: defaultValue(true)
|
||||
}),
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'footable',
|
||||
label: '是否开启单条底部展示',
|
||||
description:
|
||||
'如果列太多显示会很臃肿，可以考虑把部分列放在当前行的底部展示',
|
||||
pipeIn: (value: any) => !!value
|
||||
}),
|
||||
|
||||
{
|
||||
name: 'footable.expand',
|
||||
type: 'button-group-select',
|
||||
size: 'xs',
|
||||
visibleOn: 'data.footable',
|
||||
label: '底部默认展开',
|
||||
pipeIn: defaultValue('none'),
|
||||
mode: 'inline',
|
||||
className: 'w-full',
|
||||
options: [
|
||||
{
|
||||
label: '第一条',
|
||||
value: 'first'
|
||||
},
|
||||
|
||||
{
|
||||
label: '所有',
|
||||
value: 'all'
|
||||
},
|
||||
|
||||
{
|
||||
label: '不展开',
|
||||
value: 'none'
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
label: '开启',
|
||||
value: true
|
||||
name: 'placeholder',
|
||||
pipeIn: defaultValue('暂无数据'),
|
||||
type: 'input-text',
|
||||
label: '无数据提示'
|
||||
},
|
||||
|
||||
{
|
||||
label: '关闭',
|
||||
value: false
|
||||
}
|
||||
],
|
||||
description: '自动即列数量大于5个时自动开启'
|
||||
},
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'affixHeader',
|
||||
label: '是否固顶表头',
|
||||
pipeIn: defaultValue(true)
|
||||
}),
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showHeader',
|
||||
label: '是否显示头部',
|
||||
pipeIn: defaultValue(true)
|
||||
}),
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'showFooter',
|
||||
label: '是否显示底部',
|
||||
pipeIn: defaultValue(true)
|
||||
}),
|
||||
|
||||
getSchemaTpl('switch', {
|
||||
name: 'footable',
|
||||
label: '是否开启单条底部展示',
|
||||
description:
|
||||
'如果列太多显示会很臃肿，可以考虑把部分列放在当前行的底部展示',
|
||||
pipeIn: (value: any) => !!value
|
||||
}),
|
||||
|
||||
{
|
||||
name: 'footable.expand',
|
||||
type: 'button-group-select',
|
||||
size: 'xs',
|
||||
visibleOn: 'data.footable',
|
||||
label: '底部默认展开',
|
||||
pipeIn: defaultValue('none'),
|
||||
mode: 'inline',
|
||||
className: 'w-full',
|
||||
options: [
|
||||
{
|
||||
label: '第一条',
|
||||
value: 'first'
|
||||
},
|
||||
|
||||
{
|
||||
label: '所有',
|
||||
value: 'all'
|
||||
},
|
||||
|
||||
{
|
||||
label: '不展开',
|
||||
value: 'none'
|
||||
name: 'rowClassNameExpr',
|
||||
type: 'input-text',
|
||||
label: '行高亮规则',
|
||||
placeholder: `支持模板语法，如 <%= data.id % 2 ? 'bg-success' : '' %>`
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
name: 'placeholder',
|
||||
pipeIn: defaultValue('暂无数据'),
|
||||
type: 'input-text',
|
||||
label: '无数据提示'
|
||||
},
|
||||
{
|
||||
name: 'rowClassNameExpr',
|
||||
type: 'input-text',
|
||||
label: '行高亮规则',
|
||||
placeholder: `支持模板语法，如 <%= data.id % 2 ? 'bg-success' : '' %>`
|
||||
},
|
||||
getSchemaTpl('className', {
|
||||
label: '外层 CSS 类名'
|
||||
}),
|
||||
title: 'CSS类名',
|
||||
body: [
|
||||
getSchemaTpl('className', {
|
||||
label: '外层'
|
||||
}),
|
||||
|
||||
getSchemaTpl('className', {
|
||||
name: 'tableClassName',
|
||||
label: '表格 CSS 类名'
|
||||
}),
|
||||
getSchemaTpl('className', {
|
||||
name: 'tableClassName',
|
||||
label: '表格'
|
||||
}),
|
||||
|
||||
getSchemaTpl('className', {
|
||||
name: 'headerClassName',
|
||||
label: '顶部外层 CSS 类名'
|
||||
}),
|
||||
getSchemaTpl('className', {
|
||||
name: 'headerClassName',
|
||||
label: '顶部外层'
|
||||
}),
|
||||
|
||||
getSchemaTpl('className', {
|
||||
name: 'footerClassName',
|
||||
label: '底部外层 CSS 类名'
|
||||
}),
|
||||
getSchemaTpl('className', {
|
||||
name: 'footerClassName',
|
||||
label: '底部外层'
|
||||
}),
|
||||
|
||||
getSchemaTpl('className', {
|
||||
name: 'toolbarClassName',
|
||||
label: '工具栏 CSS 类名'
|
||||
})
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '显隐',
|
||||
body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
|
||||
getSchemaTpl('className', {
|
||||
name: 'toolbarClassName',
|
||||
label: '工具栏'
|
||||
})
|
||||
]
|
||||
}
|
||||
])
|
||||
},
|
||||
isCRUDBody
|
||||
? null
|
||||
|
||||
@ -21,47 +21,45 @@ export class TimePlugin extends DatePlugin {
|
||||
format: 'HH:mm:ss',
|
||||
value: Math.round(Date.now() / 1000)
|
||||
};
|
||||
panelJustify = true;
|
||||
panelBodyCreator = (context: BaseEventContext) => {
|
||||
return [
|
||||
getSchemaTpl('tabs', [
|
||||
{
|
||||
title: '常规',
|
||||
body: [
|
||||
title: '属性',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
type: 'input-time',
|
||||
name: 'value',
|
||||
label: '时间数值'
|
||||
title: '基本',
|
||||
body: [
|
||||
{
|
||||
type: 'input-time',
|
||||
name: 'value',
|
||||
label: '时间数值'
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'format',
|
||||
label: '显示时间格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('HH:mm:ss')
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'valueFormat',
|
||||
label: '数据日期格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('X')
|
||||
},
|
||||
getSchemaTpl('placeholder', {
|
||||
pipeIn: defaultValue('-'),
|
||||
label: '占位符'
|
||||
})
|
||||
]
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'format',
|
||||
label: '显示时间格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('HH:mm:ss')
|
||||
},
|
||||
{
|
||||
type: 'input-text',
|
||||
name: 'valueFormat',
|
||||
label: '数据日期格式',
|
||||
description: '请参考 moment 中的格式用法。',
|
||||
pipeIn: defaultValue('X')
|
||||
},
|
||||
{
|
||||
name: 'placeholder',
|
||||
type: 'input-text',
|
||||
pipeIn: defaultValue('-'),
|
||||
label: '占位符'
|
||||
}
|
||||
]
|
||||
getSchemaTpl('status')
|
||||
])
|
||||
},
|
||||
{
|
||||
title: '外观',
|
||||
body: [getSchemaTpl('className')]
|
||||
},
|
||||
{
|
||||
title: '显隐',
|
||||
body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
|
||||
}
|
||||
getSchemaTpl('onlyClassNameTab')
|
||||
])
|
||||
];
|
||||
};
|
||||
|
||||
@ -664,6 +664,20 @@ setSchemaTpl('className', (schema: any) => {
|
||||
};
|
||||
});
|
||||
|
||||
setSchemaTpl('onlyClassNameTab', (label = '外层') => {
|
||||
return {
|
||||
title: '外观',
|
||||
body: getSchemaTpl('collapseGroup', [
|
||||
{
|
||||
title: 'CSS类名',
|
||||
body: [
|
||||
getSchemaTpl('className', {label})
|
||||
]
|
||||
}
|
||||
])
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* combo 组件样式包装调整
|
||||
*/
|
||||
|
||||
Loading…
Reference in New Issue
Block a user