diff --git a/packages/editor/src/components/CodeDraftEditor.vue b/packages/editor/src/components/CodeDraftEditor.vue index 5b4c22aa..239f18f4 100644 --- a/packages/editor/src/components/CodeDraftEditor.vue +++ b/packages/editor/src/components/CodeDraftEditor.vue @@ -17,7 +17,7 @@ - diff --git a/packages/editor/src/layouts/sidebar/code-block/CodeBlockList.vue b/packages/editor/src/layouts/sidebar/code-block/CodeBlockList.vue index b7dd377c..8f06bdcd 100644 --- a/packages/editor/src/layouts/sidebar/code-block/CodeBlockList.vue +++ b/packages/editor/src/layouts/sidebar/code-block/CodeBlockList.vue @@ -145,7 +145,7 @@ const initList = async () => { }; watch( - [() => services?.codeBlockService.getCodeDsl(), () => services?.codeBlockService.refreshCombineInfo()], + [() => services?.codeBlockService.getCodeDslSync(), () => services?.codeBlockService.refreshCombineInfo()], () => { initList(); }, @@ -165,6 +165,7 @@ const createCodeBlock = async () => { const codeConfig: CodeBlockContent = { name: '代码块', content: `() => {\n // place your code here\n}`, + params: [], }; await codeBlockService.setMode(CodeEditorMode.EDITOR); const id = await codeBlockService.getUniqueId(); diff --git a/packages/editor/src/services/codeBlock.ts b/packages/editor/src/services/codeBlock.ts index 4ce2ff41..3a064e06 100644 --- a/packages/editor/src/services/codeBlock.ts +++ b/packages/editor/src/services/codeBlock.ts @@ -71,12 +71,17 @@ class CodeBlock extends BaseService { /** * 获取活动的代码块dsl数据源(默认从dsl中的codeBlocks字段读取) + * 方法要支持钩子添加扩展,会被重写为异步方法,因此这里显示写为异步以提醒调用者需以异步形式调用 * @param {boolean} forceRefresh 是否强制从活动dsl拉取刷新 * @returns {CodeBlockDSL | null} */ public async getCodeDsl(forceRefresh = false): Promise { + return this.getCodeDslSync(forceRefresh); + } + + public getCodeDslSync(forceRefresh = false): CodeBlockDSL | null { if (!this.state.codeDsl || forceRefresh) { - this.state.codeDsl = await editorService.getCodeDsl(); + this.state.codeDsl = editorService.getCodeDslSync(); } return this.state.codeDsl; } diff --git a/packages/editor/src/services/editor.ts b/packages/editor/src/services/editor.ts index b5a0e6ae..219b0bc0 100644 --- a/packages/editor/src/services/editor.ts +++ b/packages/editor/src/services/editor.ts @@ -788,6 +788,12 @@ class Editor extends BaseService { return root.codeBlocks || null; } + public getCodeDslSync(): CodeBlockDSL | null { + const root = this.get('root'); + if (!root) return null; + return root.codeBlocks || null; + } + /** * 设置代码块到dsl的codeBlocks字段 * @param {CodeBlockDSL} codeDsl 代码DSL diff --git a/packages/editor/src/theme/code-block.scss b/packages/editor/src/theme/code-block.scss index 07a3057d..9caad5e4 100644 --- a/packages/editor/src/theme/code-block.scss +++ b/packages/editor/src/theme/code-block.scss @@ -87,7 +87,7 @@ height: 100%; background: #fff; .el-card__body { - height: calc(100% - 80px); + height: 100%; background: #fff; } } @@ -127,6 +127,7 @@ display: flex; align-items: center; font-size: 16px; + margin-bottom: 10px; .code-name-label { margin-right: 10px; } @@ -148,7 +149,7 @@ position: absolute; top: 0; left: 4px; - width: calc(100% - 9px); + width: 100%; height: 100%; z-index: 10; background: #fff; @@ -160,14 +161,17 @@ .m-editor-wrapper { height: 100%; .m-editor-container { - height: calc(100% - 70px); + height: calc(100% - 65px); } .m-editor-content-bottom { - height: 40px; + height: 45px; width: 100%; display: flex; justify-content: end; background: #fff; + position: absolute; + right: 20px; + bottom: 0; > button { height: 30px; margin-top: 15px; diff --git a/packages/editor/src/type.ts b/packages/editor/src/type.ts index 66048208..2711f6a9 100644 --- a/packages/editor/src/type.ts +++ b/packages/editor/src/type.ts @@ -383,3 +383,10 @@ export enum CodeDeleteErrorType { // 代码块草稿localStorage key export const CODE_DRAFT_STORAGE_KEY = 'magicCodeDraft'; + +export interface CodeParamStatement { + /** 参数名称 */ + name: string; + /** 参数类型 */ + type?: string; +} diff --git a/packages/form/src/containers/Table.vue b/packages/form/src/containers/Table.vue index 813a97a6..9db6d064 100644 --- a/packages/form/src/containers/Table.vue +++ b/packages/form/src/containers/Table.vue @@ -101,7 +101,7 @@ labelWidth="0" :prop="getProp(scope.$index)" :rules="column.rules" - :config="makeConfig(column)" + :config="makeConfig(column, scope.row)" :model="scope.row" :size="size" @change="$emit('change', model[modelName])" @@ -432,8 +432,11 @@ const toggleRowSelection = (row: any, selected: boolean) => { tMagicTable.value?.toggleRowSelection.call(tMagicTable.value, row, selected); }; -const makeConfig = (config: ColumnConfig) => { +const makeConfig = (config: ColumnConfig, row: any) => { const newConfig = cloneDeep(config); + if (typeof config.itemsFunction === 'function') { + newConfig.items = config.itemsFunction(row); + } delete newConfig.display; return newConfig; }; diff --git a/packages/schema/src/index.ts b/packages/schema/src/index.ts index 0ec68bda..d128253f 100644 --- a/packages/schema/src/index.ts +++ b/packages/schema/src/index.ts @@ -81,10 +81,16 @@ export interface CodeBlockContent { name: string; /** 代码块内容 */ content: any; + /** 参数定义 */ + params: CodeParam[] | []; /** 扩展字段 */ [propName: string]: any; } +export interface CodeParam { + /** 参数名 */ + name: string; +} export interface PastePosition { left?: number; top?: number; diff --git a/playground/src/configs/dsl.ts b/playground/src/configs/dsl.ts index b099b806..128d332c 100644 --- a/playground/src/configs/dsl.ts +++ b/playground/src/configs/dsl.ts @@ -24,13 +24,21 @@ export default { code_5336: { name: 'getData', // eslint-disable-next-line no-eval - content: eval(`(vm, params) => {\n console.log("this is getData function",vm,params)\n}`), - params: ['name', 'age'], + content: eval(`(vm, params) => {\n console.log("this is getData function",params)\n}`), + params: [ + { + name: 'age', + }, + { + name: 'studentName', + }, + ], }, code_5316: { name: 'getList', // eslint-disable-next-line no-eval content: eval(`(vm) => {\n console.log("this is getList function")\n}`), + params: [], }, }, items: [ @@ -63,20 +71,13 @@ export default { { codeId: 'code_5336', params: { - name: 'lisa', - age: 12, + studentName: 'lisa', + age: 14, }, }, { codeId: 'code_5316', - }, - ], - }, - mounted: { - hookType: 'code', - hookData: [ - { - codeId: 'code_5316', + params: {}, }, ], }, @@ -104,14 +105,6 @@ export default { text: 'Tmagic editor 营销活动编辑器', multiple: true, events: [], - created: { - hookType: 'code', - hookData: [ - { - codeId: 'code_5316', - }, - ], - }, }, { type: 'qrcode',