From 1c4b6403e758bd31ff896dfcc799f3951afc3299 Mon Sep 17 00:00:00 2001 From: GuanMo <13216698987@163.com> Date: Thu, 27 Feb 2025 10:00:47 +0800 Subject: [PATCH 1/4] feat: update material generation and database connection for component libraries - Add support for TinyVue and Element Plus component libraries in material generation - Update database connection script with new table and column names - Modify component insertion logic to match new database schema - Add version and script details for third-party component libraries --- scripts/buildMaterials.mjs | 36 ++++++++++++++++++++++++--- scripts/connection.mjs | 50 ++++++++++++++++++++++++++++---------- 2 files changed, 70 insertions(+), 16 deletions(-) diff --git a/scripts/buildMaterials.mjs b/scripts/buildMaterials.mjs index 4f8a05b73b..da4969c0b6 100644 --- a/scripts/buildMaterials.mjs +++ b/scripts/buildMaterials.mjs @@ -93,7 +93,25 @@ const generateComponents = () => { materials: { components: [], blocks: [], - snippets: [] + snippets: [], + packages: [ + { + name: 'TinyVue组件库', + package: '@opentiny/vue', + version: '3.20.0', + destructuring: true, + script: 'https://unpkg.com/@opentiny/vue@~3.14/runtime/tiny-vue.mjs', + css: 'https://unpkg.com/@opentiny/vue-theme@~3.14/index.css' + }, + { + name: 'element-plus组件库', + package: 'element-plus', + version: '2.4.2', + script: 'https://unpkg.com/element-plus@2.4.2/dist/index.full.mjs', + css: 'https://unpkg.com/element-plus@2.4.2/dist/index.css' + }, + // 请按照实际业务情况填写所需的第三方组件库 + ] } } } @@ -150,14 +168,26 @@ const generateComponents = () => { componentsMap.push({ component, npm }) + const { package: packageName = '', version = '', exportName = '' } = npm || {} + if (connection.connected) { + if (material.npm) { + // 给组件添加 npm 来源详细信息 + const packageItem = packages.find((item) => item.package === packageName) + + if (packageItem) { + material.npm.version = packageItem.version + material.npm.script = packageItem.script + material.npm.css = packageItem.css + material.npm.destructuring = packageItem.destructuring + } + } + connection.initDB(material) } appInfo.materialHistory.components = componentsMap - const { package: packageName = '', version = '', exportName = '' } = npm || {} - const mapItem = { componentName: component, package: packageName, diff --git a/scripts/connection.mjs b/scripts/connection.mjs index a06c5623ee..8ae5a68b1f 100644 --- a/scripts/connection.mjs +++ b/scripts/connection.mjs @@ -15,9 +15,9 @@ dotenv.config({ path: `${pathsDotenv}.local` }) const { SQL_HOST, SQL_PORT, SQL_USER, SQL_PASSWORD, SQL_DATABASE } = process.env // 组件表名称 -const componentsTableName = 'user_components' +const componentsTableName = 't_component' // 组件关联到物料资产包的id -const materialHistoryId = 639 +const materialHistoryId = 1 // 数据库配置 const mysqlConfig = { host: SQL_HOST, // 主机名（服务器地址） @@ -202,9 +202,10 @@ class MysqlConnection { /** * 新建的组件关联物料资产包 + * @deprecated 物料资产包已废弃，使用relationMaterialHistory替代 * @param {number} id 新建的组件id */ - relationMaterialHistory(id) { + relationMaterialBlockHistory(id) { const uniqSql = `SELECT * FROM \`material_histories_components__user_components_mhs\` WHERE \`material-history_id\`=${materialHistoryId} AND \`user-component_id\`=${id}` this.query(uniqSql).then((result) => { if (!result.length) { @@ -215,6 +216,20 @@ class MysqlConnection { }) } + /** + * 新建的组件关联物料资产包 + * @param {number} id 新建的组件id + */ + relationMaterialHistory(id) { + const uniqSql = `SELECT * FROM \`r_material_history_component\` WHERE \`material_history_id\`=${materialHistoryId} AND \`component_id\`=${id}` + this.query(uniqSql).then((result) => { + if (!result.length) { + const sqlContent = `INSERT INTO \`r_material_history_component\` (\`material_history_id\`, \`component_id\`) VALUES (${materialHistoryId}, ${id})` + this.query(sqlContent) + } + }) + } + /** * 生成新增组件的sql语句 * @param {object} component 组件数据 @@ -282,10 +297,15 @@ class MysqlConnection { isOfficial = 0, isDefault = 0, tiny_reserved = 0, - tenant = 1, - createBy = 86, - updatedBy = 86 + component_metadata = null, + library_id = 1, + tenant_id = 1, + renter_id = 1, + site_id = 1, + created_by = 1, + last_updated_by = 1 } = component + const values = `('${version}', '${this.formatSingleQuoteValue(JSON.stringify(name))}', '${componentName}', @@ -308,15 +328,19 @@ class MysqlConnection { '${isOfficial}', '${isDefault}', '${tiny_reserved}', - '${tenant}', - '${createBy}', - '${updatedBy}' + '${component_metadata}', + '${library_id}', + '${tenant_id}', + '${renter_id}', + '${site_id}', + '${created_by}', + '${last_updated_by}' );` - const sqlContent = `INSERT INTO ${componentsTableName} (version, name, component, icon, description, doc_url, + const sqlContent = `INSERT INTO ${componentsTableName} (version, name, name_en, icon, description, doc_url, screenshot, tags, keywords, dev_mode, npm, \`group\`, \`category\`, priority, snippets, - schema_fragment, configure, \`public\`, framework, isOfficial, isDefault, tiny_reserved, - tenant, createdBy, updatedBy) VALUES ${values}`.replace(/\n/g, '') + schema_fragment, configure, \`public\`, framework, is_official, is_default, tiny_reserved,component_metadata, + library_id, tenant_id, renter_id, site_id, created_by, last_updated_by) VALUES ${values}`.replace(/\n/g, '') this.query(sqlContent, componentName) .then((result) => { @@ -335,7 +359,7 @@ class MysqlConnection { * @param {object} component 组件数据 */ initDB(component) { - const selectSqlContent = `SELECT * FROM ${this.config.database}.${componentsTableName} WHERE component = '${component.component}'` + const selectSqlContent = `SELECT * FROM ${this.config.database}.${componentsTableName} WHERE name_en = '${component.component}'` this.query(selectSqlContent) .then((result) => { From 67760dc869e3b7b0534ed414727912f3952e3ec4 Mon Sep 17 00:00:00 2001 From: GuanMo <13216698987@163.com> Date: Thu, 27 Feb 2025 10:50:55 +0800 Subject: [PATCH 2/4] refactor: remove hardcoded component library configurations --- scripts/buildMaterials.mjs | 32 +------------------------------- 1 file changed, 1 insertion(+), 31 deletions(-) diff --git a/scripts/buildMaterials.mjs b/scripts/buildMaterials.mjs index da4969c0b6..0cffaf3b9d 100644 --- a/scripts/buildMaterials.mjs +++ b/scripts/buildMaterials.mjs @@ -93,25 +93,7 @@ const generateComponents = () => { materials: { components: [], blocks: [], - snippets: [], - packages: [ - { - name: 'TinyVue组件库', - package: '@opentiny/vue', - version: '3.20.0', - destructuring: true, - script: 'https://unpkg.com/@opentiny/vue@~3.14/runtime/tiny-vue.mjs', - css: 'https://unpkg.com/@opentiny/vue-theme@~3.14/index.css' - }, - { - name: 'element-plus组件库', - package: 'element-plus', - version: '2.4.2', - script: 'https://unpkg.com/element-plus@2.4.2/dist/index.full.mjs', - css: 'https://unpkg.com/element-plus@2.4.2/dist/index.css' - }, - // 请按照实际业务情况填写所需的第三方组件库 - ] + snippets: [] } } } @@ -171,18 +153,6 @@ const generateComponents = () => { const { package: packageName = '', version = '', exportName = '' } = npm || {} if (connection.connected) { - if (material.npm) { - // 给组件添加 npm 来源详细信息 - const packageItem = packages.find((item) => item.package === packageName) - - if (packageItem) { - material.npm.version = packageItem.version - material.npm.script = packageItem.script - material.npm.css = packageItem.css - material.npm.destructuring = packageItem.destructuring - } - } - connection.initDB(material) } From 3ab1c1b0c7b0e719284eaa80ae3cd2f10c29cfc1 Mon Sep 17 00:00:00 2001 From: Ljhhhhhh <30891695+Ljhhhhhh@users.noreply.github.com> Date: Thu, 6 Mar 2025 15:42:07 +0800 Subject: [PATCH 3/4] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E6=96=87=E6=A1=88?= =?UTF-8?q?=E4=B8=BA=E7=A9=BA=E6=97=B6=20i18n=20=E4=B8=8B=E7=9A=84?= =?UTF-8?q?=E6=96=87=E6=A1=88=E4=B8=BA=20null=20=E5=AF=BC=E8=87=B4?= =?UTF-8?q?=E5=87=BA=E7=A0=81=E5=BC=82=E5=B8=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 新增判断条件，默认为空对象 --- packages/toolbars/generate-code/src/Main.vue | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/packages/toolbars/generate-code/src/Main.vue b/packages/toolbars/generate-code/src/Main.vue index cb27a69556..9c91434b32 100644 --- a/packages/toolbars/generate-code/src/Main.vue +++ b/packages/toolbars/generate-code/src/Main.vue @@ -127,6 +127,15 @@ export default { } }) + // 处理 i18n 对象中可能为 null 的情况 + if (metaData.i18n) { + Object.keys(metaData.i18n).forEach((langKey) => { + metaData.i18n[langKey] = metaData.i18n[langKey] || {} + }) + } else { + metaData.i18n = {} + } + const appSchema = { // metaData 包含dataSource、utils、i18n、globalState ...metaData, From 27b4320253a49bfafbbdc1d21d0d1269d67162d6 Mon Sep 17 00:00:00 2001 From: GuanMo <13216698987@163.com> Date: Sat, 8 Mar 2025 14:05:14 +0800 Subject: [PATCH 4/4] =?UTF-8?q?fix:=20=E4=BC=98=E5=8C=96=E5=85=A8=E5=B1=80?= =?UTF-8?q?=E7=8A=B6=E6=80=81=E5=A4=84=E7=90=86=E5=92=8C=E8=B5=84=E6=BA=90?= =?UTF-8?q?=E5=8A=A0=E8=BD=BD=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 重构 global-state.ts 中的状态处理，支持数组和对象类型的状态计算 - 修改 VariableConfigurator.vue 中的变量加载方式 - 更新 useResource 中的应用状态获取逻辑，增加兼容性 --- .../src/application-function/global-state.ts | 45 +++++++++++++++---- .../VariableConfigurator.vue | 19 ++++---- .../materials/src/composable/useResource.js | 4 +- 3 files changed, 50 insertions(+), 18 deletions(-) diff --git a/packages/canvas/render/src/application-function/global-state.ts b/packages/canvas/render/src/application-function/global-state.ts index 9e8f84ae82..3e1623967b 100644 --- a/packages/canvas/render/src/application-function/global-state.ts +++ b/packages/canvas/render/src/application-function/global-state.ts @@ -13,14 +13,43 @@ export function useGlobalState() { watchEffect(() => { reset(stores) globalState.value.forEach(({ id, state = {}, getters = {} }) => { - const computedGetters = Object.keys(getters).reduce( - (acc, key) => ({ - ...acc, - [key]: new Func('return ' + getters[key])().call(acc, state) // parseData(getters[key], null, acc)?.call?.(acc, state) //理论上不应该走parseData, unibuy代码遗留 - }), - {} - ) - stores[id] = { ...state, ...computedGetters } + const hasGetters = Object.keys(getters).length > 0 + + if (Array.isArray(state)) { + if (!hasGetters) { + stores[id] = [...state] + } else { + const computedGetters = {} + Object.keys(getters).forEach((key) => { + try { + computedGetters[key] = new Func('return ' + getters[key])().call(computedGetters, state) + } catch (error) { + computedGetters[key] = undefined + } + }) + + const arrayWithGetters = [...state] + Object.assign(arrayWithGetters, computedGetters) + stores[id] = arrayWithGetters + } + } else if (typeof state !== 'object' || state === null) { + stores[id] = state + } else { + if (!hasGetters) { + stores[id] = { ...state } + } else { + const computedGetters = {} + Object.keys(getters).forEach((key) => { + try { + computedGetters[key] = new Func('return ' + getters[key])().call(computedGetters, state) + } catch (error) { + computedGetters[key] = undefined + } + }) + + stores[id] = Object.assign({}, state, computedGetters) + } + } }) }) return { diff --git a/packages/configurator/src/variable-configurator/VariableConfigurator.vue b/packages/configurator/src/variable-configurator/VariableConfigurator.vue index 43860532d5..6246572531 100644 --- a/packages/configurator/src/variable-configurator/VariableConfigurator.vue +++ b/packages/configurator/src/variable-configurator/VariableConfigurator.vue @@ -505,14 +505,17 @@ export default { state.variables = {} const stores = useResource().appSchemaState.globalState - stores.forEach(({ id, state: storeState = {}, getters = {} }) => { - const loadProp = (prop) => { - const propBinding = `${id}.${prop}` - state.variables[propBinding] = propBinding - } - - Object.keys(storeState).forEach(loadProp) - Object.keys(getters).forEach(loadProp) + stores.forEach(({ id, state: _storeState = {}, _getters = {} }) => { + state.variables[id] = id + // fix: store 列表错误渲染成子属性列表 + // store 值处理迁移到 global-state.ts 进行处理 + // const loadProp = (prop) => { + // const propBinding = `${id}.${prop}` + // state.variables[propBinding] = propBinding + // } + + // Object.keys(storeState).forEach(loadProp) + // Object.keys(getters).forEach(loadProp) }) } else if (item.id === 'loop') { state.bindPrefix = '' diff --git a/packages/plugins/materials/src/composable/useResource.js b/packages/plugins/materials/src/composable/useResource.js index 10577ebd3f..9cfab9a4a4 100644 --- a/packages/plugins/materials/src/composable/useResource.js +++ b/packages/plugins/materials/src/composable/useResource.js @@ -143,8 +143,8 @@ const fetchAppState = async () => { appSchemaState.bridge = appData.bridge appSchemaState.utils = appData.utils - appSchemaState.isDemo = appData.meta?.is_demo - appSchemaState.globalState = appData?.meta.global_state + appSchemaState.isDemo = appData.meta?.isDemo || appData.meta?.is_demo + appSchemaState.globalState = appData?.meta.globalState || appData?.meta.global_state // 词条语言为空时使用默认的语言 const defaultLocales = [