feat(Menu.vue): 菜单路由添加外链支持

src/router/index.ts

@@ -44,6 +44,17 @@ export const constantRoutes: Array<RouteRecordRaw> = [
             }
         ]
     },
+    // 外部链接
+    /*{
+        path: '/external-link',
+        component: Layout,
+        children: [
+            {
+                path: 'https://www.cnblogs.com/haoxianrui/',
+                meta: { title: '外部链接', icon: 'link' }
+            }
+        ]
+    }*/
     // 多级嵌套路由
     /* {
          path: '/nested',

src/utils/validate.ts

@@ -6,7 +6,8 @@
  * @param {string} path
  * @returns {Boolean}
  */
-export function isExternal(path : string) {
+export function isExternal(path: string) {
-  return /^(https?:|mailto:|tel:)/.test(path)
+    const isExternal = /^(https?:|http?:|mailto:|tel:)/.test(path)
+    return isExternal
 }
 

src/views/system/menu/components/Menu.vue

@@ -104,10 +104,20 @@
           <el-input v-model="formData.name" placeholder="请输入菜单名称"/>
         </el-form-item>
 
-        <el-form-item label="页面路径" prop="component">
+        <el-form-item label="是否外链" >
+          <el-radio-group v-model="isExternal">
+            <el-radio :label="false">否</el-radio>
+            <el-radio :label="true">是</el-radio>
+          </el-radio-group>
+        </el-form-item>
+
+        <el-form-item v-if="isExternal" label="外链地址" prop="path">
+          <el-input v-model="formData.path" placeholder="请输入外链完整路径"/>
+        </el-form-item>
+
+        <el-form-item v-if="!isExternal" label="页面路径" prop="component">
           <el-input
               v-model="formData.component"
-              :readonly="formData.parentId==0?true:false"
               placeholder="system/user/index"
               style="width: 95%"
           >
@@ -116,7 +126,7 @@
           </el-input>
 
           <el-tooltip effect="dark"
-                      content="请输入页面路径，如果是父级菜单请填写 Layout 即可"
+                      content="请输入组件路径，如果是父组件填写 Layout 即可"
                       placement="right">
             <i class="el-icon-info" style="margin-left: 10px;color:darkseagreen"></i>
           </el-tooltip>
@@ -232,10 +242,11 @@ const state = reactive({
     ]
   },
   menuOptions: [] as any[],
-  currentRow: undefined
+  currentRow: undefined,
+  isExternal: false
 })
 
-const {loading, single, multiple, queryParams, menuList, total, dialog, formData, rules, menuOptions} = toRefs(state)
+const {loading, single, multiple, queryParams, menuList, total, dialog, formData, rules, menuOptions,isExternal} = toRefs(state)
 
 function handleQuery() {
   // 重置父组件