@ywfe/materials-design
Version:
YwDesign for lowcode
439 lines (438 loc) • 14.6 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _base = require("../_base");
var _utils = require("../_utils");
var confirmModalProps = [{
name: 'componentProps',
title: {
label: '配置项',
tip: 'componentProps | 配置项'
},
setter: {
componentName: 'ObjectSetter',
props: {
config: {
items: [{
name: 'title',
title: {
label: '提示',
tip: 'title | 提示'
},
setter: 'StringSetter',
supportVariable: false,
getValue: function getValue(_, v) {
return v || '提示';
}
}, {
name: '_content',
title: {
label: '内容',
tip: 'content | 提示内容 通过${this.record.xxxxx} 获取动态值'
},
isRequired: true,
setter: {
componentName: 'MixedSetter',
props: {
setters: [{
componentName: 'StringSetter'
}, {
componentName: 'VariableSetter'
}]
}
},
extraProps: {
getValue: function getValue(_, v) {
return v || '确认删除该数据吗？';
},
setValue: function setValue(target, v) {
var value = v.value || "'" + v + "'";
target.parent.setPropValue('content', {
type: 'JSExpression',
value: "()=>" + value
});
}
}
}, {
name: 'onOk',
title: {
label: '确认事件',
tip: 'onOk | 确认事件'
},
setter: {
componentName: 'MixedSetter',
props: {
setters: [{
componentName: 'SchemaFunctionSetter',
props: {
title: 'onOk',
async: true,
properties: {
input: {
type: 'object',
properties: {
value: {
type: 'object'
},
reload: {
type: 'object'
}
},
required: ['value', 'reload']
},
body: {
type: 'array',
items: [{
type: 'Function',
properties: {
template: 'RequestFunction',
variable: 'requestRes',
extraProps: {
params: {
id: '{{value.id}}'
},
_params: false,
_paramsArr: [{
name: 'id',
value: '{{value.id}}'
}]
}
}
}, {
type: 'JSExpression',
run: 'if (requestRes) reload()'
}]
}
}
}
}, {
componentName: 'VariableSetter'
}]
}
}
}]
}
}
}
}];
var buttonsProps = [].concat(_base.YwButtonBaseProps, [{
name: 'disabeld',
title: {
label: '是否禁用',
tip: 'disabeld | 是否禁用'
},
// 条件渲染setter 后面补充
setter: 'BoolSetter'
}, {
name: 'onClick',
title: {
label: '点击回调',
tip: '点击按钮时的回调'
},
propType: 'func',
setter: {
componentName: 'FunctionSetter',
props: {
template: 'function (record,index,reload)=>{}'
}
}
}]);
var historyProps = [{
title: {
label: '按钮文字',
tip: 'btnText | 按钮文字'
},
name: 'btnText',
description: '按钮文字',
supportVariable: false,
setter: {
componentName: 'StringSetter',
initialValue: '按钮'
}
}, {
title: {
label: '跳转地址',
tip: '_url | 跳转地址 如 /a/b/c, 查询参数用${record.xx}表示'
},
name: '_url',
setter: {
componentName: 'MixedSetter',
props: {
setters: [{
componentName: 'StringSetter'
}, {
componentName: 'VariableSetter'
}]
}
},
extraProps: {
getValue: function getValue(target, value) {
return value || '/';
},
setValue: function setValue(target, v) {
var type = (0, _utils.getPropValueWithPath)(target, '.__optionType');
var value = v.value || "'" + v + "'";
var func = {
HistoryPush: "function (_,record){this.props.appHelper.history.push(" + value + ")}",
HistoryOpen: "function(_,record){this.props.appHelper.history.open(" + value + ")}"
};
target.parent.setPropValue('onClick', {
type: 'JSExpression',
value: func[type]
});
}
}
}];
var TableMultipleMeta = {
componentName: 'TableOperates',
title: '操作列',
docUrl: '',
screenshot: '',
devMode: 'proCode',
group: '基础组件',
category: '表格子元素',
npm: {
"package": '@ywfe/materials-design',
version: '0.1.0',
exportName: 'TableOperates',
main: 'src/index.tsx',
destructuring: true,
subName: ''
},
configure: {
props: [{
name: 'value',
title: {
label: '操作按钮配置',
tip: '操作按钮配置'
},
setter: {
componentName: 'ArraySetter',
props: {
itemSetter: {
componentName: 'ObjectSetter',
props: {
descriptor: 'key',
config: {
items: [{
name: '__optionType',
title: {
label: '操作类型',
tip: '__optionType | 操作类型'
},
setter: {
componentName: 'SelectSetter',
isRequired: true,
props: {
options: [{
label: '普通按钮',
value: 'Button'
}, {
label: '页面跳转(当前页)',
value: 'HistoryPush'
}, {
label: '页面跳转(新开页面)',
value: 'HistoryOpen'
}, {
label: '查看数据(弹窗)',
value: 'DataDetailDialog'
}, {
label: '编辑数据(弹窗)',
value: 'DataEditDialog'
}, {
label: '删除数据',
value: 'ConfirmModal'
}, {
label: '自定义操作',
value: ''
}]
}
},
extraProps: {
setValue: function setValue(target, v) {
switch (v) {
case 'ConfirmModal':
target.parent.setPropValue('type', 'danger');
target.parent.setPropValue('btnText', '删除');
target.parent.setPropValue('render', null);
target.parent.setPropValue('btnType', 'link');
target.parent.setPropValue('component', 'ConfirmModal');
break;
case 'HistoryPush':
target.parent.setPropValue('btnText', '查看详情');
target.parent.setPropValue('render', null);
target.parent.setPropValue('btnType', 'link');
break;
case 'HistoryOpen':
target.parent.setPropValue('btnText', '查看详情');
target.parent.setPropValue('render', null);
target.parent.setPropValue('btnType', 'link');
break;
case 'DataEditDialog':
target.parent.setPropValue('render', {
type: 'JSSlot',
params: ['initialValues', 'index', 'reload'],
value: [{
componentName: 'DataEditDialog',
id: "node_" + (0, _utils.uuid)(),
props: {
btnText: '编辑',
btnType: 'link',
title: '编辑数据',
reload: {
type: 'JSExpression',
value: 'this.reload'
},
initialValues: {
type: 'JSExpression',
value: 'this.initialValues'
},
items: [{
component: 'Input',
title: '表单项',
name: "input_" + (0, _utils.uuid)()
}]
}
}],
id: "node_" + (0, _utils.uuid)()
});
break;
case 'DataDetailDialog':
target.parent.setPropValue('render', {
type: 'JSSlot',
params: ['initialValues', 'index', 'reload'],
value: [{
componentName: 'DataEditDialog',
id: "node_" + (0, _utils.uuid)(),
props: {
btnText: '编辑',
btnType: 'link',
title: '编辑数据',
reload: {
type: 'JSExpression',
value: 'this.reload'
},
initialValues: {
type: 'JSExpression',
value: 'this.initialValues'
},
items: [{
component: 'Input',
title: '表单项',
name: "input_" + (0, _utils.uuid)()
}]
}
}],
id: "node_" + (0, _utils.uuid)()
});
break;
default:
break;
}
}
}
}, {
name: 'visible',
title: {
label: '是否显示',
tip: 'visible | 是否显示'
},
setter: 'BoolSetter'
}].concat((0, _utils.getPropsByDependence)(confirmModalProps, ['ConfirmModal'], '.__optionType'), (0, _utils.getPropsByDependence)(historyProps, ['HistoryPush', 'HistoryOpen'], '.__optionType'), (0, _utils.getPropsByDependence)(buttonsProps, ['Button'], '.__optionType'), [{
name: 'render',
title: {
label: '自定义操作',
tip: 'render | 自定义操作按钮'
},
propType: 'func',
setter: {
componentName: 'SlotSetter',
title: '自定义操作按钮',
props: {
hideParams: false
},
initialValue: {
type: 'JSSlot',
hideParams: false,
supportParams: true,
params: ['initialValues', 'index', 'reload'],
value: []
}
},
condition: function condition(target) {
return !(0, _utils.getPropValueWithPath)(target, '.__optionType');
}
}])
}
},
initialValue: {
render: {
type: 'JSSlot',
hideParams: false,
supportParams: true,
params: ['initialValues', 'index', 'reload'],
value: []
}
}
}
}
}
}],
supports: {
style: true,
events: [{
name: 'handeBatchClick',
// 批量操作事件
template: 'handeBatchClick(keys,data,reload){ console.log(keys);reload()}'
}, {
name: 'handeActionClick',
// 批量操作事件
template: 'handeBatchClick(reload){ reload() }'
}]
},
component: {}
}
};
var snippets = [{
title: '操作列',
screenshot: 'https://yw-fed-static.oss-cn-hangzhou.aliyuncs.com/lowcode/tableOpration',
schema: {
componentName: 'TableOperates',
props: {
record: {
type: 'JSExpression',
value: 'this.record'
},
index: {
type: 'JSExpression',
value: 'this.index'
},
tableRef: {
type: 'JSExpression',
value: 'this.tableRef'
},
reload: {
type: 'JSExpression',
value: 'this.tableRef.current.reload'
},
refresh: {
type: 'JSExpression',
value: 'this.tableRef.current.refresh'
},
value: [{
render: {
type: 'JSSlot',
hideParams: false,
supportParams: true,
params: ['_', 'record', 'reload'],
value: []
}
}]
}
}
}];
var _default = exports["default"] = (0, _extends2["default"])({}, TableMultipleMeta, {
snippets: snippets
});