Feat support router subpage

package.json

@@ -24,6 +24,7 @@
   "devDependencies": {
     "@babel/eslint-parser": "^7.21.3",
     "@types/node": "^18.0.0",
+    "@vue/eslint-config-typescript": "^11.0.3",
     "chokidar": "^3.5.3",
     "concurrently": "^8.2.0",
     "cross-env": "^7.0.3",

packages/build/vite-config/src/default-config.js

@@ -29,7 +29,7 @@ const getDefaultConfig = (engineConfig) => {
     base: './',
     publicDir: path.resolve(root, './public'),
     resolve: {
-      extensions: ['.js', '.jsx', '.vue'],
+      extensions: ['.js', '.jsx', '.vue', '.ts', '.tsx'],
       alias: {}
     },
     server: {

packages/build/vite-config/src/vite-plugins/devAliasPlugin.js

@@ -53,7 +53,7 @@ const getDevAlias = (useSourceAlias) => {
     '@opentiny/tiny-engine-theme-light': path.resolve(basePath, 'packages/theme/light/index.less'),
     '@opentiny/tiny-engine-theme-base': path.resolve(basePath, 'packages/theme/base/src/index.js'),
     '@opentiny/tiny-engine-svgs': path.resolve(basePath, 'packages/svgs/index.js'),
-    '@opentiny/tiny-engine-canvas/render': path.resolve(basePath, 'packages/canvas/render/index.js'),
+    '@opentiny/tiny-engine-canvas/render': path.resolve(basePath, 'packages/canvas/render/index.ts'),
     '@opentiny/tiny-engine-canvas': path.resolve(basePath, 'packages/canvas/index.js'),
     '@opentiny/tiny-engine-utils': path.resolve(basePath, 'packages/utils/src/index.js'),
     '@opentiny/tiny-engine-webcomponent-core': path.resolve(basePath, 'packages/webcomponent/src/lib.js'),

packages/canvas/.eslintrc.cjs

@@ -9,24 +9,23 @@
 * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
 *
 */
-
 module.exports = {
   env: {
     browser: true,
     es2015: true,
     node: true,
     jest: true
   },
-  extends: ['eslint:recommended', 'plugin:vue/vue3-essential'],
+  extends: ['eslint:recommended', 'plugin:vue/vue3-essential', '@vue/eslint-config-typescript'],
   parser: 'vue-eslint-parser',
   parserOptions: {
-    parser: '@babel/eslint-parser',
+    parser: '@typescript-eslint/parser',
     ecmaVersion: 'latest',
     sourceType: 'module',
     requireConfigFile: false,
     babelOptions: {
       parserOpts: {
-        plugins: ['jsx']
+        plugins: ['jsx', 'typescript']
       }
     }
   },
@@ -37,6 +36,8 @@ module.exports = {
     'space-before-function-paren': 'off',
     'vue/multi-word-component-names': 'off',
     'no-use-before-define': 'error',
-    'no-unused-vars': ['error', { ignoreRestSiblings: true, varsIgnorePattern: '^_', argsIgnorePattern: '^_' }]
+    'no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-vars': ['error', { ignoreRestSiblings: true, varsIgnorePattern: '^_', argsIgnorePattern: '^_' }],
+    'import/no-inner-modules': 'off'
   }
 }

packages/canvas/DesignCanvas/src/DesignCanvas.vue

@@ -18,19 +18,22 @@
 </template>
 
 <script>
-import { ref, watch, onUnmounted } from 'vue'
+import { ref, watch, onUnmounted, onMounted } from 'vue'
 import {
   useProperties,
   useCanvas,
   useLayout,
   useMaterial,
   useHistory,
   useModal,
+  usePage,
+  useMessage,
   getMergeRegistry,
   getMergeMeta,
   getOptions,
   getMetaApi,
-  META_SERVICE
+  META_SERVICE,
+  META_APP
 } from '@opentiny/tiny-engine-meta-register'
 import { constants } from '@opentiny/tiny-engine-utils'
 import * as ast from '@opentiny/tiny-engine-common/js/ast'
@@ -169,6 +172,29 @@ export default {
       canvasResizeObserver?.disconnect?.()
     })
 
+    const { addToCallbackFns: addHistoryDataChangedCallback } = (function () {
+      const callbackFns = new Set()
+
+      const { subscribe, unsubscribe } = useMessage()
+      const topic = 'locationHistoryChanged'
+      const callback = (value) => callbackFns.forEach((cb) => cb(value))
+
+      onMounted(() => {
+        subscribe({ topic, callback })
+      })
+
+      onUnmounted(() => {
+        unsubscribe({ topic, callback })
+      })
+      function addToCallbackFns(cb) {
+        callbackFns.add(cb)
+        return () => callbackFns.delete(cb)
+      }
+      return {
+        addToCallbackFns
+      }
+    })()
+
     return {
       removeNode,
       canvasSrc,
@@ -183,6 +209,10 @@ export default {
         addHistory: useHistory().addHistory,
         registerBlock: useMaterial().registerBlock,
         request: getMetaApi(META_SERVICE.Http).getHttp(),
+        getPageById: getMetaApi(META_APP.AppManage).getPageById,
+        getPageAncestors: usePage().getAncestors,
+        getBaseInfo: () => getMetaApi(META_SERVICE.GlobalService).getBaseInfo(),
+        addHistoryDataChangedCallback,
         ast
       },
       CanvasLayout,

packages/canvas/package.json

@@ -38,13 +38,16 @@
     "@babel/core": "7.18.13",
     "@opentiny/tiny-engine-builtin-component": "workspace:*",
     "@opentiny/tiny-engine-common": "workspace:*",
+    "@opentiny/tiny-engine-dsl-vue": "workspace:*",
     "@opentiny/tiny-engine-i18n-host": "workspace:*",
     "@opentiny/tiny-engine-meta-register": "workspace:*",
     "@opentiny/tiny-engine-utils": "workspace:*",
     "@opentiny/tiny-engine-webcomponent-core": "workspace:*",
     "@vue/babel-plugin-jsx": "1.1.1",
     "@vue/shared": "^3.3.4",
-    "@vueuse/core": "^9.6.0"
+    "@vueuse/core": "^9.6.0",
+    "postcss": "^8.4.31",
+    "postcss-selector-parser": "^7.0.0"
   },
   "devDependencies": {
     "@opentiny/tiny-engine-vite-plugin-meta-comments": "workspace:*",