| | |
| | | <template> |
| | | <el-container style="flex: 1;"> |
| | | <el-container style="flex: 1;height:100%;"> |
| | | <div style="width: 200px;background-color: #222f3e" :style="{width: isCollapse?'70px':'250px'}"> |
| | | <el-aside :width="isCollapse?'70px':'250px'"> |
| | | <el-col :gutter="20"> |
| | |
| | | background-color="#222f3e" text-color="#fff" active-text-color="#ffd04b" |
| | | :collapse="isCollapse" :unique-opened="true" |
| | | :collapse-transition="false" :router="true"> |
| | | <el-menu-item index="/" @click="goToHome"> |
| | | <!-- <el-menu-item index="/" @click="youhua"> |
| | | <template slot="title"> |
| | | <!--图标--> |
| | | |
| | | <i class="el-icon-menu"></i> |
| | | <!--文本--> |
| | | <span>{{ $t('home') }}</span> |
| | | |
| | | <span>优化</span> |
| | | </template> |
| | | </el-menu-item> |
| | | </el-menu-item> --> |
| | | <!--一级菜单--> |
| | | <el-submenu :index="item.id.toString()" v-for="item in menuList" :key="item.id"> |
| | | <!--一级菜单模板区域--> |
| | |
| | | |
| | | <el-menu-item :index="'/'+menu.router" |
| | | v-for="menu in item.menuLists" :key="menu.id" |
| | | @click="addTag(menu.router)"> |
| | | > |
| | | <template slot="title"> |
| | | <!--图标--> |
| | | <i :class="menu.icon"></i> |
| | |
| | | <div class="header-left"> |
| | | <el-button :icon="isCollapse ? 'el-icon-s-unfold' : 'el-icon-s-fold'" @click="toggleCollapse" style="height:30px;"></el-button> |
| | | </div> |
| | | <div class="tagContainer" style="display: flex;"> |
| | | <!-- <div class="tagContainer" style="display: flex;"> |
| | | <tag v-for="(tag, index) in tags" :key="index" :tag="tag" @removeTag="removeTag(index)" @switchTag="switchTag(index)"></tag> |
| | | </div> |
| | | </div> --> |
| | | <template> |
| | | <el-submenu index="1" class="custom-submenu" > |
| | | <template slot="title"> |
| | |
| | | import { changePassword } from '../api/user' |
| | | import { removeToken } from "../utils/auth"; |
| | | import LanguageMixin from '../lang/LanguageMixin' |
| | | import { mapState, mapMutations } from 'vuex'; |
| | | import Tag from '../layout/tag.vue'; |
| | | import store from '../store'; |
| | | // import { mapState, mapMutations } from 'vuex'; |
| | | // import Tag from '../layout/tag.vue'; |
| | | // import store from '../store'; |
| | | |
| | | export default { |
| | | name: "Layout", |
| | | store, |
| | | // store, |
| | | mixins: [LanguageMixin], |
| | | data() { |
| | | return { |
| | |
| | | } |
| | | } |
| | | }, |
| | | components: { |
| | | Tag |
| | | }, |
| | | // components: { |
| | | // Tag |
| | | // }, |
| | | created() { |
| | | selectList(this.menuListForm).then(res => { |
| | | this.menuList = res.data |
| | |
| | | this.replaceChineseWithEnglish(this.menuList); |
| | | } |
| | | // 记录上一次激活的菜单 |
| | | this.activePath = window.sessionStorage.getItem('activePath') |
| | | // this.activePath = window.sessionStorage.getItem('activePath') |
| | | }); |
| | | }, |
| | | computed: { |
| | | ...mapState('tags', ['tags']) |
| | | // ...mapState('tags', ['tags']) |
| | | }, |
| | | methods: { |
| | | |
| | |
| | | goToHome() { |
| | | this.$router.push('/home'); |
| | | }, |
| | | ...mapMutations('tags', ['addTag', 'removeTag', 'switchTag']), |
| | | addTag(router) { |
| | | let submenuItem; |
| | | const menuItem = this.menuList.find(item => item.menuLists.some(menu => menu.router === router)); |
| | | if (menuItem) { |
| | | submenuItem = menuItem.menuLists.find(menu => menu.router === router); |
| | | } |
| | | if (submenuItem) { |
| | | const tag = submenuItem.router; |
| | | this.$store.commit('tags/addTag', tag); |
| | | } |
| | | |
| | | // ...mapMutations('tags', ['addTag', 'removeTag', 'switchTag']), |
| | | addTag() { |
| | | // let submenuItem; |
| | | // const menuItem = this.menuList.find(item => item.menuLists.some(menu => menu.router === router)); |
| | | // if (menuItem) { |
| | | // submenuItem = menuItem.menuLists.find(menu => menu.router === router); |
| | | // } |
| | | // if (submenuItem) { |
| | | // const tag = submenuItem.router; |
| | | // this.$store.commit('tags/addTag', tag); |
| | | // } |
| | | }, |
| | | |
| | | |
| | | removeTag(index) { |
| | | this.$store.commit('tags/removeTag', index); // 从 Vuex Store 中移除标签 |
| | | removeTag() { |
| | | // this.$store.commit('tags/removeTag', index); // 从 Vuex Store 中移除标签 |
| | | }, |
| | | showChangePasswordDialog() { |
| | | this.dialogVisible = true; |
| | |
| | | '用户管理': 'UserManagement', |
| | | '用户列表': 'UserList', |
| | | '设备管理': 'DeviceManagement', |
| | | '报警信息': 'AlarmInformation', |
| | | '参数下发': 'ParameterSetting', |
| | | '开关控制': 'SwitchControl', |
| | | 'I/O状态': 'I/O Status', |
| | | '报警信息': 'Alarm', |
| | | '参数下发': 'Parameter', |
| | | '开关控制': 'Action', |
| | | 'IO状态': 'Sign', |
| | | '权限管理': 'PermissionManagement', |
| | | '权限列表': 'PermissionList', |
| | | '角色管理': 'RoleManagement', |
| | | '角色列表': 'RoleList', |
| | | '电气管理': 'Electrical management' |
| | | '电气管理': 'Electrical management', |
| | | '设备状态':'State', |
| | | |
| | | '主页': 'Home' |
| | | // 根据实际需求继续添加对照关系 |
| | | }; |
| | | |