1

src/layout/components/Navbar/index.vue

@@ -18,7 +18,7 @@
           <svg-icon icon-class="modules" class-name="modules__toggler" @click="isShowMenuMobile = !isShowMenuMobile" />
 
           <transition name="fade">
-            <el-button v-if="isMenuScroll && scrollOffset > 0" class="navbar-module__scroll--lf" type="primary" icon="el-icon-caret-left" circle size="mini" @click="menuScroll('prev')" />
+            <el-button v-if="isMenuScroll && scrollOffset > 0 && device === 'desktop'" class="navbar-module__scroll--lf" type="primary" icon="el-icon-caret-left" circle size="mini" @click="menuScroll('prev')" />
           </transition>
           <el-menu
             id="navbar-menu"
@@ -31,7 +31,7 @@
             <Item v-for="(item) in permission_routes" :key="item.key" :item="item" :base-path="item.path" />
           </el-menu>
           <transition name="fade">
-            <el-button v-if="isMenuScroll && (scrollOffset < scrollMaxWidth)" class="navbar-module__scroll--rt" type="primary" icon="el-icon-caret-right" circle size="mini" @click="menuScroll('next')" />
+            <el-button v-if="isMenuScroll && (scrollOffset < scrollMaxWidth) && device === 'desktop'" class="navbar-module__scroll--rt" type="primary" icon="el-icon-caret-right" circle size="mini" @click="menuScroll('next')" />
           </transition>
 
         </div>
@@ -222,7 +222,7 @@ export default {
         const container = document.querySelector('#navbar-menu')
         this.isMenuScroll = container.scrollWidth > container.clientWidth
         this.scrollMaxWidth = container.scrollWidth - container.clientWidth
-        if (this.isMenuScroll) {
+        if (this.isMenuScroll && this.device === 'desktop') {
           container.addEventListener('scroll', e => this.menuScrollListener(e))
         }
       }

src/views/dashboard/index.vue

@@ -67,7 +67,7 @@ export default {
   computed: {},
   created() {
     this.$store.dispatch('app/getLayout').then(res => {
-      this.layoutList = res?.map(item => {
+      this.layoutList = res?.filter(item => layout.find(lay => lay.i === item.i)).map(item => {
         layout.forEach(lay => {
           lay.i === item.i ? item.component = lay.component : ''
         })

src/views/system/DashboardComponents/quickMenu.vue

@@ -26,8 +26,8 @@
 
     <template v-if="/^\/system+/.test($route.path)">
       <vxe-modal
-        transfer
         v-model="isShow"
+        transfer
         show-footer
         title="快捷菜单"
         show-confirm-button
@@ -55,6 +55,23 @@
                 children: node.children,
                 isDefaultExpanded: true
               })"
+              @select="treeSelected"
+            />
+          </el-form-item>
+          <el-form-item v-if="moduleMenus.length > 0" label="模块菜单" prop="url">
+            <Treeselect
+              v-model="form.module_url"
+              :disable-branch-nodes="true"
+              :options="moduleMenus"
+              :multiple="false"
+              no-children-text="无子菜单"
+              :normalizer="node => ({
+                id: /^#+/g.test(node.path) ? node.id : node.path,
+                key: node.id,
+                label: node.name,
+                children: node.children,
+                isDefaultExpanded: true
+              })"
             />
           </el-form-item>
           <el-form-item label="排序" prop="sort">
@@ -82,12 +99,13 @@
 </template>
 
 <script>
-
+import { index as moduleIndex } from '@/api/module'
 import { index, save, destroy } from '@/api/diyMenu'
 import { deepCopy } from '@/utils'
 import { permissions } from '@/api/me'
 import SvgIcon from '@/components/SvgIcon/index.vue'
 import { defaultModalSize } from '@/settings'
+import { menu } from '@/api/module'
 export default {
   name: 'QuickMenu',
   components: {
@@ -110,8 +128,11 @@ export default {
       myMenus: [],
       isShow: false,
       menus: [],
+      modules: [],
+      moduleMenus: [],
       form: {
         url: '',
+        module_url: '',
         name: '',
         sort: '',
         status: '',
@@ -132,10 +153,51 @@ export default {
   computed: {
   },
   created() {
+    this.getModule()
     this.getMenu()
     this.getDiymenu()
   },
   methods: {
+    async getModule() {
+      try {
+        const res = await moduleIndex()
+        this.modules = res.rows
+      } catch (err) {
+        console.error(err)
+      }
+    },
+
+    treeSelected(node) {
+      if (!/\//.test(node.path)) {
+        const module = this.modules.find(i => i.name === node.path)
+        if (module) {
+          this.getModuleMenu(module.id)
+        }
+      }
+    },
+
+    async getModuleMenu(module_id) {
+      try {
+        const res = await menu({
+          with_root: 1,
+          data_only: 1,
+          module_id
+        })
+        console.log(res)
+        const formatMenu = (arr) => {
+          arr.forEach(item => {
+            if (item.children) {
+              item.children.length === 0 ? delete item.children : formatMenu(item.children)
+            }
+          })
+        }
+        formatMenu(res)
+        this.moduleMenus = res
+      } catch (err) {
+        console.error(err)
+      }
+    },
+
     linkTo(item) {
       if (item.method === 'self') {
         this.$router.push(item.url)
@@ -207,6 +269,9 @@ export default {
 
     async submit() {
       this.form.image_id = this.fileList[0]?.response?.id
+      if (!/\//.test(this.form.url) && this.form.url && this.form.module_url) {
+        this.form.url = `/${this.form.url}?to=${this.form.module_url}`
+      }
       await save(this.form)
       this.$message({
         type: 'success',