chore: 移动路由相对路径转换

- 处理 VueCropper 打开报错问题

Author: sendya

src/config/router.config.js

@@ -20,7 +20,7 @@ export const asyncRouterMap = [
         meta: { title: '仪表盘', keepAlive: true, icon: bxAnaalyse, permission: [ 'dashboard' ] },
         children: [
           {
-            path: 'analysis',
+            path: 'analysis/:pageNo([1-9]\\d*)?',
             name: 'Analysis',
             component: () => import('@/views/dashboard/Analysis'),
             meta: { title: '分析页', keepAlive: false, permission: [ 'dashboard' ] }
@@ -232,31 +232,31 @@ export const asyncRouterMap = [
                 path: '/account/settings/base',
                 name: 'BaseSettings',
                 component: () => import('@/views/account/settings/BaseSetting'),
-                meta: { title: '基本设置', permission: [ 'user' ] }
+                meta: { title: '基本设置', hidden: true, permission: [ 'user' ] }
               },
               {
                 path: '/account/settings/security',
                 name: 'SecuritySettings',
                 component: () => import('@/views/account/settings/Security'),
-                meta: { title: '安全设置', keepAlive: true, permission: [ 'user' ] }
+                meta: { title: '安全设置', hidden: true, keepAlive: true, permission: [ 'user' ] }
               },
               {
                 path: '/account/settings/custom',
                 name: 'CustomSettings',
                 component: () => import('@/views/account/settings/Custom'),
-                meta: { title: '个性化设置', keepAlive: true, permission: [ 'user' ] }
+                meta: { title: '个性化设置', hidden: true, keepAlive: true, permission: [ 'user' ] }
               },
               {
                 path: '/account/settings/binding',
                 name: 'BindingSettings',
                 component: () => import('@/views/account/settings/Binding'),
-                meta: { title: '账户绑定', keepAlive: true, permission: [ 'user' ] }
+                meta: { title: '账户绑定', hidden: true, keepAlive: true, permission: [ 'user' ] }
               },
               {
                 path: '/account/settings/notification',
                 name: 'NotificationSettings',
                 component: () => import('@/views/account/settings/Notification'),
-                meta: { title: '新消息通知', keepAlive: true, permission: [ 'user' ] }
+                meta: { title: '新消息通知', hidden: true, keepAlive: true, permission: [ 'user' ] }
               }
             ]
           }

src/core/lazy_use.js

@@ -8,6 +8,7 @@ import Viser from 'viser-vue'
 
 // ext library
 import VueClipboard from 'vue-clipboard2'
+import VueCropper from 'vue-cropper'
 import MultiTab from '@/components/MultiTab'
 import PageLoading from '@/components/PageLoading'
 import PermissionHelper from '@/utils/helper/permission'
@@ -21,3 +22,4 @@ Vue.use(PageLoading)
 Vue.use(VueStorage, config.storageOptions)
 Vue.use(VueClipboard)
 Vue.use(PermissionHelper)
+Vue.use(VueCropper)

src/layouts/BasicLayout.vue

@@ -70,36 +70,7 @@ import SideMenu from '@/components/Menu/SideMenu'
 import GlobalHeader from '@/components/GlobalHeader'
 import GlobalFooter from '@/components/GlobalFooter'
 import SettingDrawer from '@/components/SettingDrawer'
-import cloneDeep from 'lodash.clonedeep'
-
-function convertRoutes (nodes) {
-  if (!nodes) return null
-
-  nodes = cloneDeep(nodes)
-
-  let queue = Array.isArray(nodes) ? nodes.concat() : [nodes]
-
-  while (queue.length) {
-    const levelSize = queue.length
-
-    for (let i = 0; i < levelSize; i++) {
-      const node = queue.shift()
-
-      if (!node.children || !node.children.length) continue
-
-      node.children.forEach(child => {
-        // 转化相对路径
-        if (child.path[0] !== '/') {
-          child.path = node.path.replace(/(\w*)[/]*$/, `$1/${child.path}`)
-        }
-      })
-
-      queue = queue.concat(node.children)
-    }
-  }
-
-  return nodes
-}
+import { convertRoutes } from '@/utils/routeConvert'
 
 export default {
   name: 'BasicLayout',

src/utils/routeConvert.js

@@ -0,0 +1,32 @@
+import cloneDeep from 'lodash.clonedeep'
+
+export function convertRoutes (nodes) {
+  if (!nodes) return null
+
+  nodes = cloneDeep(nodes)
+
+  let queue = Array.isArray(nodes) ? nodes.concat() : [nodes]
+
+  while (queue.length) {
+    const levelSize = queue.length
+
+    for (let i = 0; i < levelSize; i++) {
+      const node = queue.shift()
+
+      if (!node.children || !node.children.length) continue
+
+      node.children.forEach(child => {
+        console.log('child', child)
+        // 转化相对路径
+        if (child.path[0] !== '/' && !child.path.startsWith('http')) {
+          child.path = node.path.replace(/(\w*)[/]*$/, `$1/${child.path}`)
+          console.log('child.path', child.path)
+        }
+      })
+
+      queue = queue.concat(node.children)
+    }
+  }
+
+  return nodes
+}

src/views/account/settings/AvatarModal.vue

@@ -55,12 +55,7 @@
 
 </template>
 <script>
-import { VueCropper } from 'vue-cropper'
-
 export default {
-  components: {
-    VueCropper
-  },
   data () {
     return {
       visible: false,

src/views/account/settings/Index.vue

@@ -87,7 +87,7 @@ export default {
       pageTitle: ''
     }
   },
-  created () {
+  mounted () {
     this.updateMenu()
   },
   methods: {