| | |
| | | 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 |
| | | class="MenuIcon menu-class" |
| | | :class="{ lefMenuActive: showMenuFlag == menuItem.id }" |
| | | > |
| | | <div |
| | | class="menuDiv" |
| | | :title="menuItem.name" |
| | | @click="setMenuChange(menuItem)" |
| | | > |
| | | <div |
| | | class="menuImage" |
| | | :class="menuItem.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> |
| | |
| | | isActive: false, |
| | | showMenuList: [], |
| | | menuOption: [ |
| | | { |
| | | id: 1, |
| | | name: "菜单", |
| | | class: "menu_img1", |
| | | show: true, |
| | | }, |
| | | // { |
| | | // id: 1, |
| | | // name: "菜单", |
| | | // class: "menu_img1", |
| | | // show: true, |
| | | // }, |
| | | { |
| | | id: 2, |
| | | name: "图层", |
| | | class: "menu_img2", |
| | | show: false, |
| | | show: true, |
| | | // show: false, |
| | | }, |
| | | { |
| | | id: 3, |
| | | name: "视图", |
| | | class: "menu_img3", |
| | | show: false, |
| | | }, |
| | | // { |
| | | // id: 3, |
| | | // name: "视图", |
| | | // class: "menu_img3", |
| | | // show: false, |
| | | // }, |
| | | { |
| | | id: 4, |
| | | name: "漫游", |
| | |
| | | show: false, |
| | | }, |
| | | ], |
| | | menuItem: { |
| | | id: 1, |
| | | name: "折叠", |
| | | class: "menu_img1", |
| | | show: true, |
| | | }, |
| | | }; |
| | | }, |
| | | watch: {}, |
| | |
| | | methods: { |
| | | //左侧菜单滑动显隐 |
| | | setMenuChange(res) { |
| | | if (res.id == this.showMenuFlag) { |
| | | return; |
| | | } |
| | | //清除查询弹窗 |
| | | this.$store.state.mapMenuBoolean = false; |
| | | this.$store.state.mapMenuBoxFlag = ""; |
| | | //清除分析模块的全局变量 |
| | | ClearAlayse(); |
| | | |
| | | switch (res.id) { |
| | | case 1: |
| | | if (this.showMenuFlag == null) return; |
| | |
| | | this.showMenuChange(permsEntity[i], permsEntity); |
| | | } |
| | | } |
| | | |
| | | for (var i in this.menuOption) { |
| | | if (this.menuOption[i].show != false) { |
| | | this.showMenuList.push(this.menuOption[i]); |
| | |
| | | }, |
| | | mounted() { |
| | | // this.$bus.$emit('showLeftMenu', true); |
| | | window.sgworld.navControl("nav", true); |
| | | this.$store.state.mapMenuBoolean = false; |
| | | this.$store.state.mapMenuBoxFlag = null; |
| | | this.$store.state.mapPopBoolean = false; |
| | |
| | | center; |
| | | } |
| | | .menu_img4 { |
| | | background: url("../../assets/img/synthesis/图层 8 拷贝 2.png") |
| | | no-repeat center; |
| | | background: url("../../assets/img/synthesis/图层 3.png") no-repeat |
| | | center; |
| | | } |
| | | .menu_img5 { |
| | | background: url("../../assets/img/synthesis/矢量智能对象 拷贝 3.png") |
| | |
| | | display: flex; |
| | | .left_main { |
| | | margin: 0; |
| | | width: 255px; |
| | | height: auto; |
| | | transition: width 2s; |
| | | //width: 255px; |
| | | width: 140px; |
| | | // padding-bottom: 10px; |
| | | height: 100%; |
| | | |
| | | overflow-y: auto; |
| | | //height: auto; |
| | | transition: width 1s; |
| | | // background: #f4f8ff; |
| | | } |
| | | |
| | | .right_main { |
| | |
| | | border-radius: 5px; |
| | | } |
| | | } |
| | | |
| | | .menu-class { |
| | | position: absolute; |
| | | bottom: 10px; |
| | | left: 0; |
| | | } |
| | | /deep/.el-loading-spinner i { |
| | | color: #1890ff; |
| | | } |