| | |
| | | element-loading-background="rgba(0, 0, 0, 0.8)" |
| | | > |
| | | <div class="lefIcon"> |
| | | <ul> |
| | | <div |
| | | v-for="item in showMenuList" |
| | | class="MenuIcon" |
| | | :class="{ lefMenuActive: showMenuFlag == item.id }" |
| | | > |
| | | <div |
| | | class="menuDiv" |
| | | :title="item.name" |
| | | @click="setMenuChange(item)" |
| | | > |
| | | <div |
| | | class="menuImage" |
| | | :class="item.class" |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | <!-- <ul> |
| | | <li |
| | | v-for="item in showMenuList" |
| | | :class="{ lefMenuActive: showMenuFlag == item.id }" |
| | |
| | | ></div> |
| | | </div> |
| | | </li> |
| | | </ul> |
| | | </ul> --> |
| | | </div> |
| | | <div class="rightContent"> |
| | | <div |
| | |
| | | }; |
| | | }, |
| | | watch: {}, |
| | | created() { }, |
| | | |
| | | methods: { |
| | | //左侧菜单滑动显隐 |
| | | setMenuChange(res) { |
| | |
| | | }, |
| | | //初始化菜单授权 |
| | | async getPermsMenu() { |
| | | |
| | | if (this.$store.state.currentPerms == '') { |
| | | |
| | | if (this.$store.state.currentPerms == '' || this.$store.state.currentPerms != '/comprehensive') { |
| | | this.$store.state.currentPerms = '/comprehensive'; |
| | | } |
| | | if (this.$store.state.permsEntity.length == 0) { |
| | |
| | | } |
| | | var val = this.$store.state.currentPerms; |
| | | var permsEntity = this.$store.state.permsEntity; |
| | | debugger |
| | | |
| | | for (var i = 0; i < permsEntity.length; i++) { |
| | | if (permsEntity[i].perms == val) { |
| | | this.showMenuChange(permsEntity[i], permsEntity); |
| | | } |
| | | } |
| | | |
| | | for (var i in this.menuOption) { |
| | | |
| | | if (this.menuOption[i].show != false) { |
| | |
| | | }, |
| | | }, |
| | | mounted() { |
| | | this.getPermsMenu(); |
| | | this.$store.state.layerMnage = false |
| | | this.$bus.$emit('showLeftMenu', true); |
| | | this.$store.state.mapMenuBoolean = false; |
| | | this.$store.state.mapMenuBoxFlag = null; |
| | |
| | | }, |
| | | //初始化菜单授权 |
| | | created() { |
| | | // this.getPermsMenu(); |
| | | this.getPermsMenu(); |
| | | }, |
| | | }; |
| | | </script> |
| | |
| | | .lefIcon { |
| | | width: 63px; |
| | | height: 100%; |
| | | overflow-y: auto; |
| | | background: #353535; |
| | | position: absolute; |
| | | z-index: 30; |
| | | |
| | | .MenuIcon { |
| | | width: calc(100% - 2px); |
| | | height: 50px; |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | border: 1px solid rgba(53, 53, 53, 0); |
| | | } |
| | | .menuDiv { |
| | | width: 60px; |
| | | height: 60px; |
| | | height: 50px; |
| | | border: 1px solid rgba(53, 53, 53, 0); |
| | | |
| | | .menuImage { |
| | | width: 26px; |
| | | height: 26px; |
| | | margin-left: 17px; |
| | | margin-top: 17px; |
| | | width: 40px; |
| | | height: 40px; |
| | | margin-left: 8px; |
| | | margin-top: 6px; |
| | | } |
| | | |
| | | .menu_img1 { |
| | |
| | | border-radius: 5px; |
| | | } |
| | | } |
| | | /deep/.el-loading-spinner i{ |
| | | color: #1890FF; |
| | | /deep/.el-loading-spinner i { |
| | | color: #1890ff; |
| | | } |
| | | } |
| | | </style> |