first commit

2025-06-04 11:51:25 +08:00
commit 07300ed9bc
2649 changed files with 596772 additions and 0 deletions
@@ -0,0 +1,111 @@
+<template>
+    <div class="ele-admin-sidebar-menus">
+        <el-scrollbar>
+            <el-menu unique-opened :default-active="activeMenuIndex" :default-openeds="openedMenus" @select="menuSelect" class="ele-menu-dark">
+                <menu-list :menus="leftMenus" :depth="0" :key="$store.state.activeMenuModuleId"></menu-list>
+            </el-menu>
+        </el-scrollbar>
+    </div>
+</template>
+
+<script>
+module.exports = {
+    name: "SideBarLeftMenu",
+    store,
+    components: {
+        "menu-list": {
+            name: "menu-list",
+            template:
+                /*language=HTML*/
+                `
+                    <div>
+                        <template v-for="(item, index) in menus">
+                            <el-submenu :index="item.id" v-if="item.children && item.children.length > 0">
+                                <template #title>
+                                    <svg-icon :name="item.icon" v-if="item.icon" :size="18"></svg-icon>
+                                    <i v-else class="el-icon-paperclip"></i>
+                                    <span>{{ item.name }}</span>
+                                </template>
+                                <menu-list :menus="item.children" :depth="depth + 1" />
+                            </el-submenu>
+                            <el-menu-item :index="item.id" v-else>
+                                <a :href="item.href" data-pjax>
+                                    <svg-icon :name="item.icon" v-if="item.icon" :size="18"></svg-icon>
+                                    <i v-else :class="item.icon ? item.icon : 'el-icon-menu'"></i>
+                                    <span>{{ item.name }}</span>
+                                </a>
+                            </el-menu-item>
+                        </template>
+                    </div>
+                `,
+            props: ["menus", "depth"]
+        }
+    },
+    computed: {
+        //模块
+        pcModuleMenus() {
+            return this.$store.getters.pcModules
+        },
+        //左侧菜单 根据模块id动态变化
+        leftMenus() {
+            const activeMenuModuleId = this.$store.state.activeMenuModuleId
+            if (activeMenuModuleId) {
+                if (this.pcModuleMenus) {
+                    return this.pcModuleMenus.find((module) => module.id === activeMenuModuleId)?.menus
+                }
+                return []
+            }
+            return []
+        },
+        //当前选中菜单
+        activeMenuIndex() {
+            return this.$store.state.activeMenuIndex
+        },
+        //当前打开的菜单 数组 包含所有父菜单
+        openedMenus() {
+            return this.$store.state.openedMenus
+        }
+    },
+    methods: {
+        //点击菜单
+        menuSelect(index, indexPath) {
+            this.$store.commit("setActiveMenuIndex", index)
+            this.$store.commit("setOpenedMenus", indexPath)
+            this.$store.commit("addHistoryMenuId", index)
+        },
+        onResize() {
+            if (window.innerWidth < 768) {
+                $("#ele-admin-header.ele-admin-header .ele-admin-header-tool .ele-admin-header-tool-item.collapse-menu")[0].style.display = "flex"
+                document.querySelector("body >div > div.ele-admin-layout").classList.add("ele-admin-collapse")
+            } else {
+                $("#ele-admin-header.ele-admin-header .ele-admin-header-tool .ele-admin-header-tool-item.collapse-menu")[0].style.display = "none"
+                document.querySelector("body >div > div.ele-admin-layout").classList.remove("ele-admin-collapse")
+            }
+        }
+    },
+    created() {
+        this.$store.dispatch("pjaxRoute", window.location)
+    },
+    mounted() {
+        // 监听窗口大小 并且使用节流
+        this.onResize()
+        this.handleResize = MinDash.throttle(this.onResize, 500)
+        $(window).resize(() => {
+            this.handleResize()
+        })
+    },
+    beforeDestroy() {
+        $(window).off("resize", this.handleResize)
+    }
+}
+</script>
+
+<style scoped>
+.menu-link {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+}
+</style>