|
@@ -0,0 +1,85 @@
|
|
|
+<template lang="html">
|
|
|
+ <div id="sideMenu">
|
|
|
+ <div id="menuBox">
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-menu :unique-opened="true">
|
|
|
+ <el-submenu v-for="(item, index) in menu" :key="index" :index="`${index}`">
|
|
|
+ <template slot="title">
|
|
|
+ <i class="el-icon-s-grid"></i>
|
|
|
+ <span>{{ item.name }}</span>
|
|
|
+ </template>
|
|
|
+ <a v-for="(menu_item, menu_index) in item.menu" :key="menu_index" @click="turnTo(menu_item.uri)">
|
|
|
+ <el-menu-item :index="`${index}-${menu_index}`"
|
|
|
+ > <i class="el-icon-s-grid"></i>{{ menu_item.name }}</el-menu-item
|
|
|
+ >
|
|
|
+ </a>
|
|
|
+ </el-submenu>
|
|
|
+ </el-menu>
|
|
|
+ </el-col>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { system, personnel, government, record, serve, enterprise, duijiehui, site, user, links, permission, dictionary } from '@/util/role_menu.js';
|
|
|
+import * as menus from '@/util/role_menu.js';
|
|
|
+import { mapState } from 'vuex';
|
|
|
+import _ from 'lodash';
|
|
|
+export default {
|
|
|
+ name: 'sideMenu',
|
|
|
+ components: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ menu: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState({
|
|
|
+ menuList: state => state.publics.menuList,
|
|
|
+ }),
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.serrch();
|
|
|
+ if (this.menu.length === 0) this.getMenuList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ turnTo(uri) {
|
|
|
+ this.$router.push({ path: uri });
|
|
|
+ },
|
|
|
+ async serrch() {
|
|
|
+ this.menu.push(system);
|
|
|
+ this.menu.push(personnel);
|
|
|
+ this.menu.push(government);
|
|
|
+ this.menu.push(record);
|
|
|
+ this.menu.push(serve);
|
|
|
+ this.menu.push(enterprise);
|
|
|
+ this.menu.push(duijiehui);
|
|
|
+ this.menu.push(site);
|
|
|
+ this.menu.push(user);
|
|
|
+ this.menu.push(links);
|
|
|
+ this.menu.push(permission);
|
|
|
+ this.menu.push(dictionary);
|
|
|
+
|
|
|
+ this.$set(this, `menu`, this.menu);
|
|
|
+ },
|
|
|
+ getMenuList() {
|
|
|
+ let res = _.uniqBy(this.menuList, 'menu_id');
|
|
|
+ for (const item of res) {
|
|
|
+ this.menu.push(_.get(menus, item.code));
|
|
|
+ }
|
|
|
+ },
|
|
|
+ openMenuList(index) {
|
|
|
+ if (!this.$refs.collapse[index].show) {
|
|
|
+ this.$refs.collapse.forEach(item => {
|
|
|
+ item.show = false;
|
|
|
+ });
|
|
|
+ this.$refs.collapse[index].show = true;
|
|
|
+ } else {
|
|
|
+ this.$refs.collapse[index].show = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped></style>
|