| | |
| | | <el-aside :width="isCollapse?'70px':'250px'"> |
| | | <el-col :gutter="20"> |
| | | <el-row :span="4"> |
| | | <div class="logo"> |
| | | <div class="sys-name" v-show="!isCollapse">{{ $t('northglassMESsystem') }}</div> |
| | | </div> |
| | | <div class="logo" @click="goToHome"> |
| | | <div class="sys-name" v-show="!isCollapse">{{ $t('northglassMESsystem') }}</div> |
| | | </div> |
| | | </el-row> |
| | | <el-row :span="20"> |
| | | <el-menu :default-active="activePath" class="el-menu-vertical-demo" |
| | | 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"> |
| | | <template slot="title"> |
| | | <!--图标--> |
| | | <i class="el-icon-menu"></i> |
| | | <!--文本--> |
| | | <span>{{ $t('home') }}</span> |
| | | </template> |
| | | </el-menu-item> |
| | | |
| | | <!--一级菜单--> |
| | | <el-submenu :index="item.id.toString()" v-for="item in menuList" :key="item.id"> |
| | | <!--一级菜单模板区域--> |
| | | <template slot="title"> |
| | |
| | | <!--二级菜单--> |
| | | <el-menu-item :index="'/'+menu.router" |
| | | v-for="menu in item.menuLists" :key="menu.id" |
| | | @click="saveNavState('/'+menu.router)"> |
| | | @click="saveNavState('/'+menu.router)" @select="saveNavState" :default-active="$route.path"> |
| | | <template slot="title"> |
| | | <!--图标--> |
| | | <i :class="menu.icon"></i> |
| | |
| | | <span>{{ menu.name }}</span> |
| | | </template> |
| | | </el-menu-item> |
| | | |
| | | </el-submenu> |
| | | |
| | | </el-menu> |
| | | </el-row> |
| | | </el-col> |
| | | </el-aside> |
| | | </div> |
| | | <el-container> |
| | | |
| | | <div> |
| | | |
| | | </div> |
| | | <el-header class="header-container"> |
| | | <!-- <div class="tagContainer"> |
| | | <tag></tag> |
| | | |
| | | </div> --> |
| | | </div> --> |
| | | |
| | | <div class="tagContainer"> |
| | | <tag v-for="(tag, index) in tags" :key="index" :tag="tag" @removeTag="removeTag"></tag> |
| | | </div> |
| | | <el-menu :default-active="activePath1" class="el-menu-demo" mode="horizontal" |
| | | background-color="#576574" text-color="#fff" active-text-color="#ffd04b"> |
| | | <div class="header-left"> |
| | |
| | | <el-submenu index="1" class="user-icon"> |
| | | |
| | | <template slot="title"> |
| | | <el-avatar src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"> |
| | | <el-avatar src="../assets/emi.png"> |
| | | </el-avatar> |
| | | </template> |
| | | <el-menu-item index="1-1" @click="logout">{{ $t('exit') }}</el-menu-item> |
| | |
| | | import {changePassword} from '../api/user' |
| | | import {removeToken} from "../utils/auth"; |
| | | import LanguageMixin from '../lang/LanguageMixin' |
| | | // import Tag from '../layout/tag.vue'; |
| | | import { mapState, mapMutations } from 'vuex'; |
| | | import Tag from '../layout/tag.vue'; |
| | | import store from '../store'; |
| | | |
| | | export default { |
| | | name: "Layout", |
| | | store, |
| | | mixins: [LanguageMixin], |
| | | data() { |
| | | return { |
| | | |
| | | activeTag: '', // 当前激活的标签 |
| | | dialogVisible: false, |
| | | formData: { |
| | | oldPassword: '', |
| | |
| | | } |
| | | } |
| | | }, |
| | | // components: { |
| | | // Tag |
| | | // }, |
| | | components: { |
| | | Tag |
| | | }, |
| | | created() { |
| | | selectList(this.menuListForm).then(res => { |
| | | this.menuList = res.data |
| | |
| | | this.activePath = window.sessionStorage.getItem('activePath') |
| | | }); |
| | | }, |
| | | computed: { |
| | | ...mapState('tags', ['tags']) |
| | | }, |
| | | methods: { |
| | | logout: function () { |
| | | removeToken() |
| | | this.$router.push('/login') |
| | | }, |
| | | goToHome() { |
| | | this.$router.push('/home'); |
| | | }, |
| | | // 使用 mapMutations 辅助函数调用 Store 中的 mutations |
| | | ...mapMutations('tags', ['addTag', 'removeTag']), |
| | | // 切换标签时触发的方法 |
| | | saveNavState(activePath) { |
| | | window.sessionStorage.setItem('activePath', activePath); |
| | | |
| | | const menuItem = this.menuList.find(item => item.menuLists.some(menu => menu.router === activePath)); |
| | | if (menuItem) { |
| | | const submenuItem = menuItem.menuLists.find(menu => menu.router === activePath); |
| | | if (submenuItem) { |
| | | const tag = submenuItem.name; |
| | | this.$store.commit('tags/addTag', tag); // 调用 Vuex Store 中的 addTag mutation |
| | | } |
| | | } |
| | | }, |
| | | // 关闭标签时触发的方法 |
| | | removeTag(tag) { |
| | | this.removeTag(tag); // 从 Vuex Store 中移除标签 |
| | | }, |
| | | |
| | | |
| | | showChangePasswordDialog() { |
| | |
| | | toggleCollapse: function () { |
| | | this.isCollapse = !this.isCollapse; |
| | | }, |
| | | saveNavState: function (activePath) { |
| | | window.sessionStorage.setItem('activePath', activePath) |
| | | }, |
| | | // saveNavState: function (activePath) { |
| | | // window.sessionStorage.setItem('activePath', activePath) |
| | | // }, |
| | | replaceChineseWithEnglish(menuData) { |
| | | // 定义中英文对照关系对象 |
| | | const translation = { |