import { IPublicTypeComponentMetadata, IPublicTypeSnippet, IPublicModelSettingField } from '@alilc/lowcode-types'; import { common } from '@alilc/lowcode-engine'; const OadpEntityTableMeta: IPublicTypeComponentMetadata = { "componentName": "OadpEntityTable", "title": "实体表格", "docUrl": "", "category": "高级组件", "group": "低代码组件", "screenshot": "https://img.alicdn.com/tfs/TB1ZU1HuVT7gK0jSZFpXXaTkpXa-112-64.png", "devMode": "proCode", "npm": { "package": "oadp-material", "version": "{{version}}", "exportName": "OadpEntityTable", "main": "src/index.tsx", "destructuring": true, "subName": "" }, "configure": { "props": [ { "name": "DataSetting", "title": "数据设置", "type": "group", "display": "block", "items": [ { "name": "name", "title": { "label": { "type": "i18n", "zh_CN": "表单标识", "en_US": "Name", }, "tip": { "type": "i18n", "zh_CN": "属性: name | 说明: 表单标识", "en_US": "prop: name | description: switch name", }, }, "setter": "StringSetter", "supportVariable": false, }, { "name": "id", "title": { "label": { "type": "i18n", "zh_CN": "唯一标识", "en_US": "ID", }, "tip": { "type": "i18n", "zh_CN": "属性: id | 说明: 唯一标识", "en_US": "prop: id | description: switch id", }, }, "setter": "StringSetter" }, { "name": "entity", "title": { "label": { "type": "i18n", "en-US": "Entity", "zh-CN": "绑定实体" }, "tip": { "type": "i18n", "zh_CN": "属性: entity | 说明:绑定实体", "en_US": "prop: entity | description: Set Entity.", }, }, "description": "绑定实体", "setter": "OadpEntitySetter", "supportVariable": true, "extraProps": { setValue: (target, value) => { // console.log('OadpEntityTable entity Prop setValue', value); // console.log('OadpEntityTable entity Prop', target.node, target.node?.id); let tableQueryBarProp = target.getProps().getPropValue('tableQueryBar'); // console.log('OadpEntityTable entity Prop tableQueryBarProp', tableQueryBarProp); let oadpTabList = tableQueryBarProp.value; if (oadpTabList) { let oadpTab = oadpTabList[0]; let OadpTabItemList = oadpTab.children; OadpTabItemList.forEach((oadpTabItem: any) => { let oadpButtonList = oadpTabItem.children; oadpButtonList.forEach((oadpButton: any) => { oadpButton.props.entity = value; oadpButton.props.tableComponentRefId = target.node?.id; }); }); } console.log('OadpEntityTable entity Prop tableQueryBarProp after update', tableQueryBarProp); target.getProps().setPropValue('tableQueryBar', tableQueryBarProp); let tableButtonBarProp = target.getProps().getPropValue('tableButtonBar'); console.log('OadpEntityTable entity Prop tableButtonBarProp', tableButtonBarProp); let tableButtonBarList = tableButtonBarProp.value; if (tableButtonBarList) { tableButtonBarList.forEach(oadpButtonBar => { let oadpButtonList = oadpButtonBar.children; oadpButtonList.forEach(oadpButton => { oadpButton.props.entity = value; oadpButton.props.tableComponentRefId = target.node?.id; }); }); }; console.log('OadpEntityTable entity Prop tableButtonBarProp after update ', tableButtonBarProp); target.getProps().setPropValue('tableButtonBar', tableButtonBarProp); let rowButtonBarProp = target.getProps().getPropValue('rowButtonBar'); console.log('OadpEntityTable entity Prop rowButtonBarProp', rowButtonBarProp); let rowButtonBarList = rowButtonBarProp.value; if (rowButtonBarList) { rowButtonBarList.forEach(oadpButtonBar => { let oadpButtonList = oadpButtonBar.children; oadpButtonList.forEach(oadpButton => { oadpButton.props.entity = value; oadpButton.props.tableComponentRefId = target.node?.id; }); }); }; console.log('OadpEntityTable entity Prop rowButtonBarProp after update ', rowButtonBarProp); target.getProps().setPropValue('rowButtonBar', rowButtonBarProp); // console.log('OadpEntityTable entity target ', target); console.log('OadpEntityTable entity Prop ', target.getProps()); return target.getProps().setPropValue('page', value); }, }, }, { "name": "filterRule", "title": { "label": { "type": "i18n", "zh_CN": "过滤规则", "en_US": "Filtler Rule", }, "tip": { "type": "i18n", "zh_CN": "属性: filterRule | 说明: 过滤规则", "en_US": "prop: filterRule | description: Filtler Rule", }, }, "setter": { "componentName": "OadpEntityFilterSetter", "props": (target: IPublicModelSettingField) => ({ "entity": target.parent.getPropValue('entity'), }), }, "supportVariable": true, "description": "过滤规则", }, ] }, { "name": "DisplaySetting", "title": "显示设置", "type": "group", "display": "block", "items": [ { "name": "tableWidth", "title": { "label": { "type": "i18n", "en-US": "tableWidth", "zh-CN": "表格宽度" }, "tip": { "type": "i18n", "zh_CN": "属性: tableWidth | 说明: 表格宽度。", "en_US": "prop: tableWidth | Description: tableWidth.", }, }, "setter": { "componentName": "NumberSetter", "isRequired": false, } } ] }, { "name": "InteractionSetting", "title": "交互设置", "type": "group", "display": "block", "items": [ { "title": { "label": { "type": "i18n", "en-US": "Enable Table Query Bar", "zh-CN": "启用表查询" }, "tip": "enableTableQueryBar | 启用表查询" }, "name": "enableTableQueryBar", "description": "启用表查询", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": true } }, { "name": "tableQueryBar", "title": { "label": { "type": "i18n", "en-US": "table query bar", "zh-CN": "表查询栏" }, "tip": { "type": "i18n", "zh_CN": "属性: tableQueryBar | 说明: 表查询栏", "en_US": "prop: tableQueryBar | description: table query Bar", }, }, "description": "表查询栏", "setter": { "componentName": "SlotSetter", "isRequired": true, "initialValue": { "type": "JSSlot", "params": ["value", "index", "record"], "value": [ { "componentName": "OadpTab", "props": { "shape": "text", "size": "medium", "excessMode": "slide", "items": [ { "primaryKey": "tab-item-1", "title": "快速查询" }, { "primaryKey": "tab-item-2", "title": "高级查询" } ], "style": {} }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "OadpTabItem", "props": { "title": "快速查询", "primaryKey": "tab-item-1" }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "OadpButtonBar", "props": { "direction": "row", "justify": "center", "align": "center" }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "OadpEntityButtonReadFast", "props": { "label": "快速查询", "type": "primary", "size": "medium", "disabled": false, "onClick": { "type": "JSExpression", "value": "function() {\n const self = this;\n try {\n return (function (v,e){ return this.utils.eventUtil.onReadFast.apply(this,Array.prototype.slice.call(arguments).concat([{\n\t\"schema\": this.schema\n}])) }).apply(self, arguments);\n } catch(e) {\n console.warn('call function which parsed by lowcode failed: ', e);\n return e.message;\n }\n }" }, "__events": { "eventDataList": [ { "type": "componentEvent", "name": "onClick", "relatedEventName": "onClick", "paramStr": "{\n\t\"schema\": this.schema\n}" } ], "eventList": [ { "name": "onClick", "disabled": true } ] }, "style": { "marginRight": "5px" }, }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" } ] } ] }, { "componentName": "OadpTabItem", "id": "node_ocm806zkq83", "props": { "title": "高级查询", "primaryKey": "tab-item-2" }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "OadpEntityButtonReadRule", "props": { "label": "高级查询", "type": "primary", "size": "medium", "disabled": false, "onClick": { "type": "JSExpression", "value": "function() {\n const self = this;\n try {\n return (function (v,e){ return this.utils.eventUtil.onReadRule.apply(this,Array.prototype.slice.call(arguments).concat([{\n\t\"schema\": this.schema\n}])) }).apply(self, arguments);\n } catch(e) {\n console.warn('call function which parsed by lowcode failed: ', e);\n return e.message;\n }\n }" }, "__events": { "eventDataList": [ { "type": "componentEvent", "name": "onClick", "relatedEventName": "onClick", "paramStr": "{\n\t\"schema\": this.schema\n}" } ], "eventList": [ { "name": "onClick", "disabled": true } ] }, "style": { "marginRight": "5px" }, }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" } ] } ] }, ] } }, "condition": () => false, }, { "title": { "label": { "type": "i18n", "en-US": "Enable Table Button Bar", "zh-CN": "启用表操作" }, "tip": "enableTableButtonBar | 启用表操作" }, "name": "enableTableButtonBar", "description": "启用表操作", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": true } }, { "name": "tableButtonBar", "title": { "label": { "type": "i18n", "en-US": "Table Button Bar", "zh-CN": "表按钮栏" }, "tip": { "type": "i18n", "zh_CN": "属性: tableButtonBar | 说明: 表按钮栏", "en_US": "prop: tableButtonBar | description: table button Bar", }, }, "description": "表按钮栏", "setter": { "componentName": "SlotSetter", "isRequired": true, "initialValue": { "type": "JSSlot", "params": ["value", "index", "record"], "value": [ { "componentName": "OadpButtonBar", "props": { "direction": "row", "justify": "start", "align": "center" }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "OadpEntityButtonCreate", "props": { "label": "新增", "type": "primary", "size": "medium", "disabled": false, "text": false, "style": { "marginLeft": "5px", "marginRight": "5px" } }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" }, { "componentName": "OadpEntityButtonBatchDelete", "props": { "label": "批量删除", "type": "secondary", "size": "medium", "disabled": false, "text": false, "onClick": { "type": "JSExpression", "value": "function() {\n const self = this;\n try {\n return (function (v,e){ return this.utils.eventUtil.onBatchDelete.apply(this,Array.prototype.slice.call(arguments).concat([{\n\t\"schema\": this.schema\n}])) }).apply(self, arguments);\n } catch(e) {\n console.warn('call function which parsed by lowcode failed: ', e);\n return e.message;\n }\n }" }, "__events": { "eventDataList": [ { "type": "componentEvent", "name": "onClick", "relatedEventName": "onClick", "paramStr": "{\n\t\"schema\": this.schema\n}" } ], "eventList": [ { "name": "onClick", "disabled": true } ] }, "style": { "marginRight": "5px" }, }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" }, { "componentName": "OadpEntityButtonSettingTable", "props": { "label": "设置", "type": "primary", "size": "medium", "disabled": false, "text": false, "style": { "marginLeft": "5px" }, }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" } ] } ] } }, "condition": () => false, }, { "title": { "label": { "type": "i18n", "en-US": "Enable Row Button Bar", "zh-CN": "启用行操作" }, "tip": "enableRowButtonBar | 启用行操作" }, "name": "enableRowButtonBar", "description": "启用行操作", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": true } }, { "name": "rowButtonBar", "title": { "label": { "type": "i18n", "en-US": "Row Button Bar", "zh-CN": "行按钮栏" }, "tip": { "type": "i18n", "zh_CN": "属性: rowButtonBar | 说明: 行按钮栏", "en_US": "prop: rowButtonBar | description: row button Bar", }, }, "description": "行按钮栏", "setter": { "componentName": "SlotSetter", "isRequired": true, "initialValue": { "type": "JSSlot", "params": ["value", "index", "record"], "value": [ { "componentName": "OadpButtonBar", "props": { "direction": "row", "justify": "center", "align": "center" }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "OadpEntityButtonUpdate", "props": { "label": "修改", "type": "primary", "size": "medium", "disabled": false, "text": true, "style": { "marginLeft": "5px", "marginRight": "5px" } }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" }, { "componentName": "OadpEntityButtonDelete", "props": { "label": "删除", "type": "primary", "size": "medium", "disabled": false, "text": true, "style": { "marginLeft": "5px", "marginRight": "5px" } }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" } ] } ] } }, "condition": () => false, }, { "title": { "label": { "type": "i18n", "en-US": "Enable Serial Number", "zh-CN": "启用序号" }, "tip": "enableSerialNumber | 启用序号" }, "name": "enableSerialNumber", "description": "启用序号", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": true } }, { "name": "rowSelectionMode", "title": { "label": { "type": "i18n", "en-US": "Row Selection Mode", "zh-CN": "选择模式" }, "tip": { "type": "i18n", "zh_CN": "属性: rowSelectionMode | 说明: 选择模式", "en_US": "prop: rowSelectionMode | description: Row Selection Mode", }, }, "description": "选择模式", "setter": { "componentName": "RadioGroupSetter", "props": { "dataSource": [ { "label": "未启用", "value": "disabled" }, { "label": "单选", "value": "single" }, { "label": "多选", "value": "multiple" } ], "options": [ { "label": "未启用", "value": "disabled" }, { "label": "单选", "value": "single" }, { "label": "多选", "value": "multiple" } ] }, "initialValue": "multiple" } }, { "title": { "label": { "type": "i18n", "en-US": "Pre Lock Attribute List", "zh-CN": "前置锁定" }, "tip": { "type": "i18n", "zh_CN": "属性: preLockAttributeList | 说明: 前置锁定", "en_US": "prop: preLockAttributeList | description: Pre Lock Attribute List.", }, }, "name": "preLockAttributeList", "description": "前置锁定", "setter": { "componentName": "ArraySetter", "props": { "itemSetter": { "componentName": "OadpAttributeSetter", "props": (target: IPublicModelSettingField) => ({ "entity": target.getProps().getPropValue('entity'), }), } }, "initialValue": [] }, "supportVariable": true, }, { "title": { "label": { "type": "i18n", "en-US": "Post Lock Attribute List", "zh-CN": "后置锁定" }, "tip": { "type": "i18n", "zh_CN": "属性: postLockAttributeList | 说明: 后置锁定", "en_US": "prop: postLockAttributeList | description: Post Lock Attribute List.", }, }, "name": "postLockAttributeList", "description": "后置锁定", "setter": { "componentName": "ArraySetter", "props": { "itemSetter": { "componentName": "OadpAttributeSetter", "props": (target: IPublicModelSettingField) => ({ "entity": target.getProps().getPropValue('entity'), }), } }, "initialValue": [] }, "supportVariable": true, }, ] }, { "name": "PageSetting", "title": "分页设置", "type": "group", "display": "block", "items": [ { "name": "pageType", "title": { "label": { "type": "i18n", "en-US": "pageType", "zh-CN": "分页类型" }, "tip": { "type": "i18n", "zh_CN": "属性: pageType | 说明: 分页类型，可选值:normal=常规模式, simple=简单模式, mini=迷你模式。默认为:normal。", "en_US": "prop: pageType | description: Page Type, Set to fixed to indicate that the content will not affect the layout of the column. Optional values: fixed=fixed mode, auto=automatic mode. The default is: auto.", }, }, "description": "分页类型", "setter": { "componentName": "RadioGroupSetter", "props": { "dataSource": [ { "label": "常规模式", "value": "normal" }, { "label": "简单模式", "value": "simple" }, { "label": "迷你模式", "value": "mini" } ], "options": [ { "label": "常规模式", "value": "normal" }, { "label": "简单模式", "value": "simple" }, { "label": "迷你模式", "value": "mini" } ] }, "initialValue": "simple" } }, { "name": "pageButton", "title": { "label": { "type": "i18n", "en-US": "pageButton", "zh-CN": "分页按钮" }, "tip": { "type": "i18n", "zh_CN": "属性: pageButton | 说明:分页按钮，可选值:normal=常规, arrow-only=仅箭头, no-border=无边框。默认为:arrow-only。", "en_US": "prop: pageButton | Description: Page Button style, optional values: normal=regular, arrow only=arrow only, no order=no border. The default is: arrow-only.", }, }, "setter": { "componentName": "RadioGroupSetter", "props": { "dataSource": [ { "label": "常规", "value": "normal" }, { "label": "仅箭头", "value": "arrow-only" }, { "label": "无边框", "value": "no-border" } ], "options": [ { "label": "常规", "value": "normal" }, { "label": "仅箭头", "value": "arrow-only" }, { "label": "无边框", "value": "no-border" } ] }, "initialValue": "arrow-only" } }, { "name": "pageShowCount", "title": { "label": { "type": "i18n", "en-US": "pageShowCount", "zh-CN": "显示页数" }, "tip": { "type": "i18n", "zh_CN": "属性: pageShowCount | 说明:显示页数。", "en_US": "prop: pageShowCount | Description: pageShowCount.", }, }, "setter": { "componentName": "NumberSetter", "isRequired": false, "initialValue": 3 } }, { "name": "pageSize", "title": { "label": { "type": "i18n", "en-US": "pageSize", "zh-CN": "每页条数" }, "tip": { "type": "i18n", "zh_CN": "属性: pageSize | 说明:每页条数。", "en_US": "prop: pageSize | Description: pageSize.", }, }, "setter": { "componentName": "NumberSetter", "isRequired": false, "initialValue": 20 } }, { "title": { "label": { "type": "i18n", "en-US": "pageSizeSelector", "zh-CN": "每页显示选择类型" }, "tip": { "type": "i18n", "zh_CN": "属性: pageSizeSelector | 说明:每页显示选择类型，可选值:false=无, filter=选择, dropdown=下拉。默认为:false。", "en_US": "prop: pageSizeSelector | Description: pageSizeSelector.", }, }, "name": "pageSizeSelector", "setter": { "componentName": "RadioGroupSetter", "props": { "dataSource": [ { "label": "无", "value": false }, { "label": "选择", "value": "filter" }, { "label": "下拉", "value": "dropdown" } ], "options": [ { "label": "无", "value": false }, { "label": "选择", "value": "filter" }, { "label": "下拉", "value": "dropdown" } ] }, "initialValue": "dropdown" } }, { "title": { "label": { "type": "i18n", "en-US": "pageSizeList", "zh-CN": "每页显示可选条数" }, "tip": { "type": "i18n", "zh_CN": "属性: pageSizeList | 说明:每页显示可选条数。", "en_US": "prop: pageSizeList | Description: pageSizeList.", }, }, "name": "pageSizeList", "setter": { "componentName": "ArraySetter", "props": { "itemSetter": { "componentName": "NumberSetter", "isRequired": false, "initialValue": 20 } }, "initialValue": [ 20, 50, 100, 500] }, }, ] }, ], "supports": { "style": true }, "component": { "isContainer": true }, "advanced": { "callbacks": { "onNodeAdd": (dragment, currentNode) => { console.log('OadpEntityTable onNodeAdd with ', dragment, currentNode); if ( dragment?.parent?.componentName === 'Slot' && dragment?.parent?.parent?.componentName === 'OadpEntityButtonReadCondition' ) { console.log('OadpEntityTable onNodeAdd 目标是 OadpEntityButtonReadCondition, 跳过处理'); return; } // 检查 dragment 是否为 null if (!dragment) { console.error('dragment is null'); return; } // 检查 currentNode 是否为 null if (!currentNode) { console.error('currentNode is null'); return; } // 检查 currentNode.document 是否为 null if (!currentNode.document) { console.error('currentNode.document is null'); return; } const dragmentSchema = dragment?.exportSchema(common.designerCabin.TransformStage.Save); console.log('OadpEntityTable dragment.exportSchema()', dragmentSchema); if (dragmentSchema.componentName === 'OadpEntityButtonCreate' || dragmentSchema.componentName === 'OadpEntityButtonDelete' || dragmentSchema.componentName === 'OadpEntityButtonUpdate' || dragmentSchema.componentName === 'OadpEntityButtonReadFast' || dragmentSchema.componentName === 'OadpEntityButtonReadCondition' || dragmentSchema.componentName === 'OadpEntityButtonReadRule' || dragmentSchema.componentName === 'OadpEntityButtonBatchDelete' || dragmentSchema.componentName === 'OadpEntityButtonSettingTable' || dragmentSchema.componentName === 'OadpEntityPagination') { const currentNodeSchema = currentNode?.exportSchema(common.designerCabin.TransformStage.Save); console.log('OadpEntityTable currentNodeSchema ', currentNodeSchema); const entity = currentNodeSchema?.props?.entity; dragment.setPropValue('entity', entity); dragment.setPropValue('tableComponentRefId', currentNodeSchema.id); console.log('OadpEntityTable dragment update exportSchema()', dragment?.exportSchema(common.designerCabin.TransformStage.Save)); } if (dragmentSchema.componentName === 'OadpAttribute') { const name = dragmentSchema?.props?.name ?? "默认名称"; const logicalName = dragmentSchema?.props?.logicalName ?? "默认逻辑名称"; const attributeType = dragmentSchema?.props?.attributeType ?? "STRING"; const referEntity = dragmentSchema?.props?.referEntity; const referAttribute = dragmentSchema?.props?.referAttribute; let dataIndex = logicalName; if (attributeType === "REFER" && referAttribute && typeof referAttribute === 'object' && 'logicalName' in referAttribute) { dataIndex = logicalName + '.name' ; } console.log('OadpEntityTable dragment.exportSchema() dataIndex', dataIndex); // 如果拖拽到表格内，需要转换元素为表格列 const layoutPNode = currentNode.document.createNode({ "componentName": "OadpTableColumn", "props": { "title": name, "dataIndex": dataIndex, "htmlTitle": logicalName, "alignHeader": "center", "width": 200, "align": "center", "wordBreak": "all", } }); console.log('OadpEntityTable onNodeAdd layoutPNode', layoutPNode); // 检查 layoutPNode 是否为 null if (!layoutPNode) { console.error('OadpEntityTable layoutPNode is null'); return; } // 当前dragment还未添加入node子节点,需要setTimeout处理 setTimeout(() => { currentNode.replaceChild( dragment, layoutPNode.exportSchema(common.designerCabin.TransformStage.Save) ); }, 1); } }, }, }, } }; const snippets: IPublicTypeSnippet[] = [ { "title": "实体表格", "screenshot": "https://img.alicdn.com/tfs/TB1ZU1HuVT7gK0jSZFpXXaTkpXa-112-64.png", "schema": { "componentName": "OadpEntityTable", "props": { }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "", "children": [ { "componentName": "OadpTableColumn", "props": { "dataIndex": "name", "title": "名称", "htmlTitle": "name", "alignHeader": "center", "align": "center", "width": 200, "lock": false, "wordBreak": "all" }, "hidden": false, "isLocked": false, "condition": true, "conditionGroup": "", "title": "" }, { "componentName": "OadpTableColumn", "props": { "dataIndex": "code", "title": "编码", "htmlTitle": "code", "alignHeader": "center", "align": "center", "width": 200, "lock": false, "wordBreak": "all" }, "hidden": false, "isLocked": false, "condition": true, "conditionGroup": "", "title": "" }, ] } } ]; export default { ...OadpEntityTableMeta, snippets };