From 558008606290e8ef2cc48a8a28a13885af6325ed Mon Sep 17 00:00:00 2001 From: hexqi Date: Mon, 29 Jul 2024 11:36:02 +0800 Subject: [PATCH 1/6] feat: add canvas lifeCycle config --- packages/canvas/render/src/runner.js | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/packages/canvas/render/src/runner.js b/packages/canvas/render/src/runner.js index 136352723..9cfd91c02 100644 --- a/packages/canvas/render/src/runner.js +++ b/packages/canvas/render/src/runner.js @@ -46,7 +46,11 @@ const renderer = { ...api } -const create = () => { +const create = async (config) => { + const { beforeAppCreate, appCreated } = config.lifeCycles || {} + if (typeof beforeAppCreate === 'function') { + await beforeAppCreate() + } App && App.unmount() App = null @@ -61,6 +65,9 @@ const create = () => { App = createApp(Main).use(TinyI18nHost).provide(I18nInjectionKey, TinyI18nHost) App.config.globalProperties.lowcodeConfig = window.parent.TinyGlobalConfig App.mount(document.querySelector('#app')) + if (typeof appCreated === 'function') { + await appCreated(App) + } new ResizeObserver(() => { dispatch('canvasResize') @@ -78,5 +85,5 @@ export const createRender = (config) => { Promise.all([ ...thirdScripts.map(dynamicImportComponents), ...scripts.map((src) => addScript(src)).concat([...thirdStyles, ...styles].map((src) => addStyle(src))) - ]).finally(create) + ]).finally(() => create(config)) } From 98cb649f0db0d39c9dd5f163ebac64c3572b3b12 Mon Sep 17 00:00:00 2001 From: yaoyun8 <142570291+yaoyun8@users.noreply.github.com> Date: Tue, 30 Jul 2024 01:56:53 -0700 Subject: [PATCH 2/6] =?UTF-8?q?feat:=20UniBuy=E7=94=BB=E5=B8=83=E6=B8=B2?= =?UTF-8?q?=E6=9F=93=20(#2)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat: unibuy-render * fix：eslint报错 --- .../get/app-center/v1/apps/schema/918.json | 85 +------------------ packages/canvas/render/src/RenderMain.js | 5 +- packages/canvas/render/src/runner.js | 10 ++- 3 files changed, 10 insertions(+), 90 deletions(-) diff --git a/mockServer/src/mock/get/app-center/v1/apps/schema/918.json b/mockServer/src/mock/get/app-center/v1/apps/schema/918.json index e5351b18e..d3fda570f 100644 --- a/mockServer/src/mock/get/app-center/v1/apps/schema/918.json +++ b/mockServer/src/mock/get/app-center/v1/apps/schema/918.json @@ -2048,90 +2048,7 @@ } ], "bridge": [], - "utils": [ - { - "name": "axios", - "type": "npm", - "content": { - "type": "JSFunction", - "value": "", - "package": "axios", - "destructuring": false, - "exportName": "axios" - } - }, - { - "name": "Button", - "type": "npm", - "content": { - "package": "@opentiny/vue", - "version": "", - "exportName": "Button", - "subName": "", - "destructuring": true, - "main": "" - } - }, - { - "name": "Menu", - "type": "npm", - "content": { - "type": "JSFunction", - "value": "", - "package": "@opentiny/vue", - "exportName": "NavMenu", - "destructuring": true - } - }, - { - "name": "Modal ", - "type": "npm", - "content": { - "package": "@opentiny/vue", - "version": "", - "exportName": "Modal ", - "subName": "", - "destructuring": true, - "main": "" - } - }, - { - "name": "npm", - "type": "function", - "content": { - "type": "JSFunction", - "value": "''" - } - }, - { - "name": "Pager", - "type": "npm", - "content": { - "package": "@opentiny/vue", - "version": "", - "exportName": "Pager", - "subName": "", - "destructuring": true, - "main": "" - } - }, - { - "name": "test", - "type": "function", - "content": { - "type": "JSFunction", - "value": "function test() {\r\n return 'test'\r\n}" - } - }, - { - "name": "util", - "type": "function", - "content": { - "type": "JSFunction", - "value": "function util () {\r\n console.log(321)\r\n}" - } - } - ], + "utils": [], "config": { "sdkVersion": "1.0.3", "historyMode": "hash", diff --git a/packages/canvas/render/src/RenderMain.js b/packages/canvas/render/src/RenderMain.js index b02335f67..370d6ca63 100644 --- a/packages/canvas/render/src/RenderMain.js +++ b/packages/canvas/render/src/RenderMain.js @@ -17,7 +17,7 @@ import * as TinyVueIcon from '@opentiny/vue-icon' import { useBroadcastChannel } from '@vueuse/core' import { constants, utils as commonUtils } from '@opentiny/tiny-engine-utils' import renderer, { parseData, setConfigure, setController, globalNotify, isStateAccessor } from './render' -import { getNode as getNodeById, clearNodes, getRoot, setContext, getContext, setCondition, context } from './context' +import { getNode as getNodeById, clearNodes, getRoot, setContext, getContext, setCondition, context, setNode } from './context' import CanvasEmpty from './CanvasEmpty.vue' const { BROADCAST_CHANNEL } = constants @@ -424,5 +424,6 @@ export const api = { getGlobalState, getDataSourceMap, setDataSourceMap, - setGlobalState + setGlobalState, + setNode, } diff --git a/packages/canvas/render/src/runner.js b/packages/canvas/render/src/runner.js index 9cfd91c02..dab5021e3 100644 --- a/packages/canvas/render/src/runner.js +++ b/packages/canvas/render/src/runner.js @@ -10,7 +10,7 @@ * */ -import { createApp } from 'vue' +import { createApp, h } from 'vue' import { addScript, addStyle, dynamicImportComponents, updateDependencies } from '../../common' import TinyI18nHost, { I18nInjectionKey } from '@opentiny/tiny-engine-common/js/i18n' import Main, { api } from './RenderMain' @@ -49,7 +49,7 @@ const renderer = { const create = async (config) => { const { beforeAppCreate, appCreated } = config.lifeCycles || {} if (typeof beforeAppCreate === 'function') { - await beforeAppCreate() + await beforeAppCreate({ Vue: { h }, canvasWin: window, api }) } App && App.unmount() App = null @@ -63,12 +63,14 @@ const create = async (config) => { dispatch('canvasReady', { detail: renderer }) App = createApp(Main).use(TinyI18nHost).provide(I18nInjectionKey, TinyI18nHost) - App.config.globalProperties.lowcodeConfig = window.parent.TinyGlobalConfig - App.mount(document.querySelector('#app')) + if (typeof appCreated === 'function') { await appCreated(App) } + App.config.globalProperties.lowcodeConfig = window.parent.TinyGlobalConfig + App.mount(document.querySelector('#app')) + new ResizeObserver(() => { dispatch('canvasResize') }).observe(document.body) From 20a3a97da34e4002f73b4d066c98e65b65c4b4ff Mon Sep 17 00:00:00 2001 From: yaoyun8 <142570291+yaoyun8@users.noreply.github.com> Date: Tue, 30 Jul 2024 02:45:58 -0700 Subject: [PATCH 3/6] Unibuy/yy (#3) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat: unibuy-render * fix：eslint报错 * fix：增加导出钩子函数 --- packages/canvas/render/src/RenderMain.js | 58 +++++++++++++++++------- 1 file changed, 41 insertions(+), 17 deletions(-) diff --git a/packages/canvas/render/src/RenderMain.js b/packages/canvas/render/src/RenderMain.js index 370d6ca63..59ae4170b 100644 --- a/packages/canvas/render/src/RenderMain.js +++ b/packages/canvas/render/src/RenderMain.js @@ -347,6 +347,42 @@ const setSchema = async (data) => { const getNode = (id, parent) => (id ? getNodeById(id, parent) : schema) +let canvasRenderer = null + +const defaultRenderer = function() { + // 渲染画布增加根节点，与出码和预览保持一致 + const rootChildrenSchema = { + componentName: 'div', + props: schema.props, + children: schema.children + } + + return h( + 'tiny-i18n-host', + { + locale: 'zh_CN', + key: refreshKey.value, + ref: 'page', + className: 'design-page' + }, + schema.children?.length ? h(renderer, { schema: rootChildrenSchema, parent: schema }) : [h(CanvasEmpty)] + ) +} + +const getRenderer = () => canvasRenderer || defaultRenderer + +const setRenderer = (fn) => { + canvasRenderer = fn +} + +let rendererMounted + +const getRendererMounted = () => rendererMounted || function() {} + +const setRendererMounted = (fn) => { + rendererMounted = fn +} + export default { setup() { provide('rootSchema', schema) @@ -378,23 +414,7 @@ export default { ) }, render() { - // 渲染画布增加根节点，与出码和预览保持一致 - const rootChildrenSchema = { - componentName: 'div', - props: schema.props, - children: schema.children - } - - return h( - 'tiny-i18n-host', - { - locale: 'zh_CN', - key: refreshKey.value, - ref: 'page', - className: 'design-page' - }, - schema.children?.length ? h(renderer, { schema: rootChildrenSchema, parent: schema }) : [h(CanvasEmpty)] - ) + return getRenderer().call(this) } } @@ -426,4 +446,8 @@ export const api = { setDataSourceMap, setGlobalState, setNode, + getRenderer, + setRenderer, + getRendererMounted, + setRendererMounted } From a805ebbe8df07faac46cd1b6707b7fba1bc16901 Mon Sep 17 00:00:00 2001 From: hexqi Date: Tue, 30 Jul 2024 20:04:34 +0800 Subject: [PATCH 4/6] fix: remove utils change --- .../get/app-center/v1/apps/schema/918.json | 85 ++++++++++++++++++- 1 file changed, 84 insertions(+), 1 deletion(-) diff --git a/mockServer/src/mock/get/app-center/v1/apps/schema/918.json b/mockServer/src/mock/get/app-center/v1/apps/schema/918.json index d3fda570f..e5351b18e 100644 --- a/mockServer/src/mock/get/app-center/v1/apps/schema/918.json +++ b/mockServer/src/mock/get/app-center/v1/apps/schema/918.json @@ -2048,7 +2048,90 @@ } ], "bridge": [], - "utils": [], + "utils": [ + { + "name": "axios", + "type": "npm", + "content": { + "type": "JSFunction", + "value": "", + "package": "axios", + "destructuring": false, + "exportName": "axios" + } + }, + { + "name": "Button", + "type": "npm", + "content": { + "package": "@opentiny/vue", + "version": "", + "exportName": "Button", + "subName": "", + "destructuring": true, + "main": "" + } + }, + { + "name": "Menu", + "type": "npm", + "content": { + "type": "JSFunction", + "value": "", + "package": "@opentiny/vue", + "exportName": "NavMenu", + "destructuring": true + } + }, + { + "name": "Modal ", + "type": "npm", + "content": { + "package": "@opentiny/vue", + "version": "", + "exportName": "Modal ", + "subName": "", + "destructuring": true, + "main": "" + } + }, + { + "name": "npm", + "type": "function", + "content": { + "type": "JSFunction", + "value": "''" + } + }, + { + "name": "Pager", + "type": "npm", + "content": { + "package": "@opentiny/vue", + "version": "", + "exportName": "Pager", + "subName": "", + "destructuring": true, + "main": "" + } + }, + { + "name": "test", + "type": "function", + "content": { + "type": "JSFunction", + "value": "function test() {\r\n return 'test'\r\n}" + } + }, + { + "name": "util", + "type": "function", + "content": { + "type": "JSFunction", + "value": "function util () {\r\n console.log(321)\r\n}" + } + } + ], "config": { "sdkVersion": "1.0.3", "historyMode": "hash", From 86b436963eecd20b663143b3415feadda0b2afe4 Mon Sep 17 00:00:00 2001 From: yaoyun8 <142570291+yaoyun8@users.noreply.github.com> Date: Tue, 30 Jul 2024 23:04:22 -0700 Subject: [PATCH 5/6] =?UTF-8?q?fix=EF=BC=9Agetters=E5=A4=84=E7=90=86?= =?UTF-8?q?=E4=BC=98=E5=8C=96=20(#4)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat: unibuy-render * fix：eslint报错 * fix：增加导出钩子函数 * fix：getters处理优化 --- packages/canvas/render/src/RenderMain.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/packages/canvas/render/src/RenderMain.js b/packages/canvas/render/src/RenderMain.js index 59ae4170b..24962e0e6 100644 --- a/packages/canvas/render/src/RenderMain.js +++ b/packages/canvas/render/src/RenderMain.js @@ -39,15 +39,13 @@ const globalState = ref([]) const stores = shallowReactive({}) const dataSourceMap = shallowReactive({}) -const Func = Function - watchEffect(() => { reset(stores) globalState.value.forEach(({ id, state = {}, getters = {} }) => { const computedGetters = Object.keys(getters).reduce( (acc, key) => ({ ...acc, - [key]: new Func('return ' + getters[key].value)().call(acc, state) + [key]: parseData(getters[key], state, acc) }), {} ) From f396562fdfb266e229a24d0cf297b99faab50549 Mon Sep 17 00:00:00 2001 From: hexqi Date: Tue, 3 Sep 2024 16:17:54 +0800 Subject: [PATCH 6/6] refactor: render --- packages/canvas/render/src/RenderMain.js | 25 ++++++++++++------------ 1 file changed, 12 insertions(+), 13 deletions(-) diff --git a/packages/canvas/render/src/RenderMain.js b/packages/canvas/render/src/RenderMain.js index 24962e0e6..190287bfb 100644 --- a/packages/canvas/render/src/RenderMain.js +++ b/packages/canvas/render/src/RenderMain.js @@ -17,7 +17,16 @@ import * as TinyVueIcon from '@opentiny/vue-icon' import { useBroadcastChannel } from '@vueuse/core' import { constants, utils as commonUtils } from '@opentiny/tiny-engine-utils' import renderer, { parseData, setConfigure, setController, globalNotify, isStateAccessor } from './render' -import { getNode as getNodeById, clearNodes, getRoot, setContext, getContext, setCondition, context, setNode } from './context' +import { + getNode as getNodeById, + clearNodes, + getRoot, + setContext, + getContext, + setCondition, + context, + setNode +} from './context' import CanvasEmpty from './CanvasEmpty.vue' const { BROADCAST_CHANNEL } = constants @@ -347,7 +356,7 @@ const getNode = (id, parent) => (id ? getNodeById(id, parent) : schema) let canvasRenderer = null -const defaultRenderer = function() { +const defaultRenderer = function () { // 渲染画布增加根节点，与出码和预览保持一致 const rootChildrenSchema = { componentName: 'div', @@ -373,14 +382,6 @@ const setRenderer = (fn) => { canvasRenderer = fn } -let rendererMounted - -const getRendererMounted = () => rendererMounted || function() {} - -const setRendererMounted = (fn) => { - rendererMounted = fn -} - export default { setup() { provide('rootSchema', schema) @@ -445,7 +446,5 @@ export const api = { setGlobalState, setNode, getRenderer, - setRenderer, - getRendererMounted, - setRendererMounted + setRenderer }