| | |
| | | class="MenuIcon" |
| | | :class="{ lefMenuActive: showMenuFlag == item.id }" |
| | | > |
| | | <div |
| | | class="menuDiv" |
| | | :title="item.name" |
| | | @click="setMenuChange(item)" |
| | | > |
| | | <div |
| | | class="menuImage" |
| | | :class="item.class" |
| | | ></div> |
| | | <div class="menuDiv" :title="item.name" @click="setMenuChange(item)"> |
| | | <div class="menuImage" :class="item.class"></div> |
| | | </div> |
| | | </div> |
| | | |
| | | </div> |
| | | <div class="rightContent"> |
| | | <div |
| | | class="left_main" |
| | | :class="{ left_main_show: !openStatus }" |
| | | > |
| | | <div class="left_main" :class="{ left_main_show: !openStatus }"> |
| | | <div class="right_Map"> |
| | | <left-menu></left-menu> |
| | | </div> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { getPerms } from '../../api/api'; |
| | | import mapdiv from '../../components/MapDiv.vue'; |
| | | import leftMenu from './LeftMenu.vue'; |
| | | import maplayer from '../Tools/maplayer.vue'; |
| | | import { getPerms } from "../../api/api"; |
| | | import mapdiv from "../../components/MapDiv.vue"; |
| | | import leftMenu from "./LeftMenu.vue"; |
| | | import maplayer from "../Tools/maplayer.vue"; |
| | | export default { |
| | | components: { |
| | | mapdiv, |
| | |
| | | menuOption: [ |
| | | { |
| | | id: 1, |
| | | name: '菜单', |
| | | class: 'menu_img1', |
| | | name: "菜单", |
| | | class: "menu_img1", |
| | | show: true, |
| | | }, |
| | | { |
| | | id: 2, |
| | | name: '图层', |
| | | class: 'menu_img2', |
| | | name: "图层", |
| | | class: "menu_img2", |
| | | show: false, |
| | | }, |
| | | { |
| | | id: 3, |
| | | name: '视图', |
| | | class: 'menu_img3', |
| | | name: "视图", |
| | | class: "menu_img3", |
| | | show: false, |
| | | }, |
| | | { |
| | | id: 4, |
| | | name: '漫游', |
| | | class: 'menu_img4', |
| | | name: "漫游", |
| | | class: "menu_img4", |
| | | show: false, |
| | | }, |
| | | { |
| | | id: 5, |
| | | name: '分析', |
| | | class: 'menu_img5', |
| | | name: "分析", |
| | | class: "menu_img5", |
| | | show: false, |
| | | }, |
| | | { |
| | | id: 6, |
| | | name: '查询', |
| | | class: 'menu_img6', |
| | | name: "查询", |
| | | class: "menu_img6", |
| | | show: false, |
| | | }, |
| | | { |
| | | id: 7, |
| | | name: '定位', |
| | | class: 'menu_img7', |
| | | name: "定位", |
| | | class: "menu_img7", |
| | | show: false, |
| | | }, |
| | | { |
| | | id: 8, |
| | | name: '测量', |
| | | class: 'menu_img8', |
| | | name: "测量", |
| | | class: "menu_img8", |
| | | show: false, |
| | | }, |
| | | { |
| | | id: 9, |
| | | name: '标绘', |
| | | class: 'menu_img9', |
| | | name: "标绘", |
| | | class: "menu_img9", |
| | | show: false, |
| | | }, { |
| | | }, |
| | | { |
| | | id: 10, |
| | | name: '场景', |
| | | class: 'menu_img10', |
| | | name: "场景", |
| | | class: "menu_img10", |
| | | show: false, |
| | | }, |
| | | ], |
| | |
| | | ClearAlayse(); |
| | | |
| | | switch (res.id) { |
| | | |
| | | case 1: |
| | | if (this.showMenuFlag == null) return; |
| | | this.openStatus = !this.openStatus; |
| | |
| | | if (this.showMenuFlag == null) { |
| | | this.openStatus = false; |
| | | } |
| | | this.$bus.$emit('setChangeTwoMenu', res.id - 2); |
| | | this.$bus.$emit("setChangeTwoMenu", res.id - 2); |
| | | break; |
| | | default: { |
| | | this.openStatus = true; |
| | | this.$bus.$emit('setChangeTwoMenu', res.id - 2); |
| | | this.$bus.$emit("setChangeTwoMenu", res.id - 2); |
| | | this.showMenuFlag = res.id; |
| | | } |
| | | } |
| | | }, |
| | | //初始化菜单授权 |
| | | async getPermsMenu() { |
| | | |
| | | if (this.$store.state.currentPerms == '' || this.$store.state.currentPerms != '/comprehensive') { |
| | | this.$store.state.currentPerms = '/comprehensive'; |
| | | if ( |
| | | this.$store.state.currentPerms == "" || |
| | | this.$store.state.currentPerms != "/comprehensive" |
| | | ) { |
| | | this.$store.state.currentPerms = "/comprehensive"; |
| | | } |
| | | if (this.$store.state.permsEntity.length == 0) { |
| | | const data = await getPerms(); |
| | |
| | | } |
| | | |
| | | for (var i in this.menuOption) { |
| | | |
| | | if (this.menuOption[i].show != false) { |
| | | this.showMenuList.push(this.menuOption[i]); |
| | | } |
| | |
| | | //初始化二级菜单 |
| | | if (this.showMenuList.length > 1) { |
| | | var index = this.showMenuList[1].id; |
| | | this.$bus.$emit('setChangeTwoMenu', index - 2); |
| | | this.$bus.$emit("setChangeTwoMenu", index - 2); |
| | | } |
| | | }, |
| | | showMenuChange(res, result) { |
| | |
| | | var std = []; |
| | | std.push(this.menuOption[0]); |
| | | for (var i = 1; i < this.menuOption.length; i++) { |
| | | |
| | | if (this.menuOption[i].name == res.cnName) { |
| | | this.menuOption[i].show = true; |
| | | } |
| | |
| | | width: 63px; |
| | | height: 100%; |
| | | overflow-y: auto; |
| | | background: #3B4D6E; |
| | | background: #3b4d6e; |
| | | position: absolute; |
| | | z-index: 30; |
| | | .MenuIcon { |
| | |
| | | display: flex; |
| | | .left_main { |
| | | margin: 0; |
| | | width: 300px; |
| | | width: 255px; |
| | | height: auto; |
| | | transition: width 2s; |
| | | } |