From 319631590cc62a5b6e0deb47279710199603df37 Mon Sep 17 00:00:00 2001
From: GuanMo <13216698987@163.com>
Date: Sat, 12 Apr 2025 13:32:10 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=AE=9E=E7=8E=B0=E5=85=A8=E5=B1=80?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=E7=AE=A1=E7=90=86=E6=9C=BA=E5=88=B6=201.=20?=
 =?UTF-8?q?=E9=87=8D=E6=9E=84=E5=85=A8=E5=B1=80=E7=8A=B6=E6=80=81=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=EF=BC=8C=E5=B0=86=E5=A4=9A=E4=B8=AA=E7=8B=AC=E7=AB=8B?=
 =?UTF-8?q?=20store=20=E5=90=88=E5=B9=B6=E4=B8=BA=E5=8D=95=E4=B8=80=20glob?=
 =?UTF-8?q?alState=202.=20=E5=9C=A8=20schema=20=E4=B8=AD=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=20globalState=20=E5=BC=95=E7=94=A8=EF=BC=8C=E6=8C=87=E5=90=91?=
 =?UTF-8?q?=20stores=20=E4=BB=A5=E6=94=AF=E6=8C=81=E5=85=A8=E5=B1=80?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=E8=AE=BF=E9=97=AE=203.=20=E4=BF=AE=E6=94=B9?=
 =?UTF-8?q?=E5=8F=98=E9=87=8F=E9=85=8D=E7=BD=AE=E5=99=A8=E4=B8=AD=E7=9A=84?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=E5=BC=95=E7=94=A8=E8=B7=AF=E5=BE=84=E4=BB=8E?=
 =?UTF-8?q?=20this.stores=20=E6=94=B9=E4=B8=BA=20this.globalState=204.=20?=
 =?UTF-8?q?=E6=9B=B4=E6=96=B0=E9=A1=B5=E9=9D=A2=E7=94=9F=E6=88=90=E5=99=A8?=
 =?UTF-8?q?=EF=BC=8C=E5=9C=A8=E4=B8=8A=E4=B8=8B=E6=96=87=E4=B8=AD=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=20globalState=20=E6=94=AF=E6=8C=81=205.=20=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=20genGlobalState=20=E6=8F=92=E4=BB=B6=EF=BC=8C?=
 =?UTF-8?q?=E7=94=9F=E6=88=90=E7=BB=9F=E4=B8=80=E7=9A=84=E5=85=A8=E5=B1=80?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=E7=AE=A1=E7=90=86=E6=96=87=E4=BB=B6=206.=20?=
 =?UTF-8?q?=E5=9C=A8=20lowcode.js=20=E4=B8=AD=E9=9B=86=E6=88=90=20globalSt?=
 =?UTF-8?q?ate=20=E5=B9=B6=E6=9A=B4=E9=9C=B2=E7=BB=99=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E4=BD=BF=E7=94=A8=20=E6=AD=A4=E6=9B=B4=E6=96=B0=E4=BD=BF?=
 =?UTF-8?q?=E4=BD=8E=E4=BB=A3=E7=A0=81=E5=B9=B3=E5=8F=B0=E5=85=B7=E5=A4=87?=
 =?UTF-8?q?=E6=9B=B4=E7=BB=9F=E4=B8=80=E3=80=81=E6=9B=B4=E7=9B=B4=E8=A7=82?=
 =?UTF-8?q?=E7=9A=84=E5=85=A8=E5=B1=80=E7=8A=B6=E6=80=81=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E8=83=BD=E5=8A=9B=EF=BC=8C=E7=AE=80=E5=8C=96=E4=BA=86=E7=8A=B6?=
 =?UTF-8?q?=E6=80=81=E8=AE=BF=E9=97=AE=E8=B7=AF=E5=BE=84=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../render/src/page-block-function/schema.ts  |  2 +
 .../VariableConfigurator.vue                  |  2 +-
 packages/vue-generator/src/generator/page.js  |  4 +-
 .../src/plugins/genGlobalState.js             | 93 ++++++++++---------
 .../src/lowcodeConfig/lowcode.js              |  4 +-
 5 files changed, 57 insertions(+), 48 deletions(-)

diff --git a/packages/canvas/render/src/page-block-function/schema.ts b/packages/canvas/render/src/page-block-function/schema.ts
index 380fb8a94..f959f8a84 100644
--- a/packages/canvas/render/src/page-block-function/schema.ts
+++ b/packages/canvas/render/src/page-block-function/schema.ts
@@ -72,6 +72,8 @@ export function useSchema(
       bridge,
       stores,
       state,
+      // 追加一个 globalState，指向 stores，用于全局状态管理
+      globalState: stores,
       props,
       dataSourceMap: {},
       emit: () => {} // 兼容访问器中getter和setter中this.emit写法
diff --git a/packages/configurator/src/variable-configurator/VariableConfigurator.vue b/packages/configurator/src/variable-configurator/VariableConfigurator.vue
index c60a1c0fe..26ad40900 100644
--- a/packages/configurator/src/variable-configurator/VariableConfigurator.vue
+++ b/packages/configurator/src/variable-configurator/VariableConfigurator.vue
@@ -142,7 +142,7 @@ const { EXPRESSION_TYPE } = constants
 const CONSTANTS = {
   THIS: 'this.',
   STATE: 'this.state.',
-  STORE: 'this.stores.',
+  STORE: 'this.globalState.',
   PROPS: 'this.props.',
   COLLECTION: 'Collection',
   ITEM: 'item',
diff --git a/packages/vue-generator/src/generator/page.js b/packages/vue-generator/src/generator/page.js
index 6f36b7ebd..bde13144b 100644
--- a/packages/vue-generator/src/generator/page.js
+++ b/packages/vue-generator/src/generator/page.js
@@ -407,7 +407,7 @@ const generateVueCode = ({ schema, name, type, componentsMap }) => {
     ? `const [${componentNames.join(',')}] = [${exportNames.map((name) => `${name}()`).join(',')}]`
     : ''
 
-  const contextArr = ['stores', 'state', ...methodsName]
+  const contextArr = ['stores', 'state', 'globalState', ...methodsName]
 
   const result = `
 <template>
@@ -420,7 +420,7 @@ ${imports.join('\n')}
 const props = defineProps({${propsArr.join(',\n')}})
 const emit = defineEmits(${JSON.stringify(emitsArr)})
 
-const { t, lowcodeWrap, stores } = vue.inject(I18nInjectionKey).lowcode()
+const { t, lowcodeWrap, stores, globalState } = vue.inject(I18nInjectionKey).lowcode()
 const wrap = lowcodeWrap(props, { emit })
 
 ${iconStatement}
diff --git a/packages/vue-generator/src/plugins/genGlobalState.js b/packages/vue-generator/src/plugins/genGlobalState.js
index 3e680a0c8..d39402f60 100644
--- a/packages/vue-generator/src/plugins/genGlobalState.js
+++ b/packages/vue-generator/src/plugins/genGlobalState.js
@@ -31,63 +31,68 @@ function genDependenciesPlugin(options = {}) {
     run(schema) {
       const globalState = parseSchema(schema)
 
+      let importStatement = "import { defineStore } from 'pinia'"
+      const state = {}
+      const getters = {}
+      const actions = {}
+
       const res = []
-      const ids = []
 
       for (const stateItem of globalState) {
-        let importStatement = "import { defineStore } from 'pinia'"
-        const { id, state, getters, actions } = stateItem
-
-        ids.push(id)
+        const { id, state: stateValue, getters: gettersValue = [], actions: actionsValue = [] } = stateItem
 
-        const stateExpression = `() => ({ ${Object.entries(state)
-          .map((item) => {
-            let [key, value] = item
-
-            if (typeof value === 'string') {
-              value = `'${value}'`
+        state[id] = stateValue
+        Object.keys(gettersValue).forEach((key) => {
+          if (typeof gettersValue[key] === 'object' && gettersValue[key].type === 'JSFunction') {
+            if (gettersValue[key].value.includes('this')) {
+              gettersValue[key].value = gettersValue[key].value.replace(/this\./g, `this.${id}.`)
             }
-
-            if (value && typeof value === 'object') {
-              value = JSON.stringify(value)
+            getters[key] = gettersValue[key].value
+          }
+        })
+        Object.keys(actionsValue).forEach((key) => {
+          if (typeof actionsValue[key] === 'object' && actionsValue[key].type === 'JSFunction') {
+            if (actionsValue[key].value.includes('this')) {
+              actionsValue[key].value = actionsValue[key].value.replace(/this\./g, `this.${id}.`)
             }
-
-            return [key, value].join(':')
-          })
-          .join(',')} })`
-
-        const getterExpression = Object.entries(getters)
-          .filter((item) => item[1]?.type === 'JSFunction')
-          .map(([key, value]) => `${key}: ${value.value}`)
-          .join(',')
-
-        const actionExpressions = Object.entries(actions)
-          .filter((item) => item[1]?.type === 'JSFunction')
-          .map(([key, value]) => `${key}: ${value.value}`)
-          .join(',')
-
-        const storeFiles = `
-         ${importStatement}
-         export const ${id} = defineStore({
-           id: '${id}',
-           state: ${stateExpression},
-           getters: { ${getterExpression} },
-           actions: { ${actionExpressions} }
-         })
-        `
-        res.push({
-          fileType: 'js',
-          fileName: `${id}.js`,
-          path,
-          fileContent: storeFiles
+            actions[key] = actionsValue[key].value
+          }
         })
       }
 
+      const globalStateFiles = `
+        ${importStatement}
+        export const globalState = defineStore('globalState', {
+           state: () => (${JSON.stringify(state, null, 2)}),
+           getters: {${Object.entries(getters)
+             .map(([key, value]) => `${key}: ${value}`)
+             .join(',')}},
+           actions: {${Object.entries(actions)
+             .map(([key, value]) => `${key}: ${value}`)
+             .join(',')}}
+         })
+        
+         export const useGlobalState = () => {
+            // 获取 globalState 实例
+            const globalStateInstance = globalState();
+
+            return globalStateInstance;
+          };
+
+      `
+
+      res.push({
+        fileType: 'js',
+        fileName: 'globalState.js',
+        path: './src/stores',
+        fileContent: globalStateFiles
+      })
+
       res.push({
         fileType: 'js',
         fileName: 'index.js',
         path,
-        fileContent: ids.map((item) => `export { ${item} } from './${item}'`).join('\n')
+        fileContent: `export { globalState } from './globalState'`
       })
 
       return res
diff --git a/packages/vue-generator/src/templates/vue-template/templateFiles/src/lowcodeConfig/lowcode.js b/packages/vue-generator/src/templates/vue-template/templateFiles/src/lowcodeConfig/lowcode.js
index 29da8186b..4e3369df7 100644
--- a/packages/vue-generator/src/templates/vue-template/templateFiles/src/lowcodeConfig/lowcode.js
+++ b/packages/vue-generator/src/templates/vue-template/templateFiles/src/lowcodeConfig/lowcode.js
@@ -17,6 +17,7 @@ import dataSourceMap from './dataSource'
 import * as utils from '../utils'
 import * as bridge from './bridge'
 import { useStores } from './store'
+import { useGlobalState } from '@/stores/globalState'
 
 export const lowcodeWrap = (props, context) => {
   const global = {}
@@ -81,6 +82,7 @@ export default () => {
   provide(I18nInjectionKey, i18n)
 
   const stores = useStores()
+  const globalState = useGlobalState()
 
-  return { t: i18n.global.t, lowcodeWrap, stores }
+  return { t: i18n.global.t, lowcodeWrap, stores, globalState }
 }