From b4668a820cb11703613c59d6529898e230be0b28 Mon Sep 17 00:00:00 2001 From: zhanghua <314079846@qq.com> Date: 星期一, 04 八月 2025 14:57:18 +0800 Subject: [PATCH] bug修改 --- src/layout/components/Navbar.vue | 132 ++++++++++++++++++++++++++++++++------------ 1 files changed, 96 insertions(+), 36 deletions(-) diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue index 0ca5cf6..e9918c7 100644 --- a/src/layout/components/Navbar.vue +++ b/src/layout/components/Navbar.vue @@ -3,27 +3,31 @@ <hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" /> <breadcrumb class="breadcrumb-container" /> + <!-- 鍥哄畾鍙充笂瑙� --> + <!-- <h3 style="position: fixed; top: 0; font-size: 16px; color: #5a5e66; " :style="'right:' + orgCss() ">{{ getOrgName() }}</h3> --> <div class="right-menu"> + <el-dropdown trigger="click" ref="eldrop" style="margin-right: 20px"> + <div class="avatar-wrapper" style="font-size: 20px"> + {{ selectStaff ? selectStaff.org.name : "" }}-{{ + selectStaff && selectStaff.sysRole ? selectStaff.sysRole.name : "" + }} + <i class="el-icon-caret-bottom"></i> + </div> + <el-dropdown-menu slot="dropdown" align="center"> + <el-dropdown-item v-for="item in staffs" @click.native="changeStaff(item)" :key="item.id"> + {{ item ? item.org.name : "" }}-{{ item && item.sysRole ? item.sysRole.name : "" }} + </el-dropdown-item> + </el-dropdown-menu> + </el-dropdown> <el-dropdown class="avatar-container" trigger="click"> <div class="avatar-wrapper"> - <img :src="avatar+'?imageView2/1/w/80/h/80'" class="user-avatar"> - <i class="el-icon-caret-bottom" /> + {{ "鎮ㄥソ锛�" + getUserName() }} + <i class="el-icon-caret-bottom"></i> </div> <el-dropdown-menu slot="dropdown" class="user-dropdown"> - <router-link to="/"> - <el-dropdown-item> - Home - </el-dropdown-item> - </router-link> - <a target="_blank" href="https://github.com/PanJiaChen/vue-admin-template/"> - <el-dropdown-item>Github</el-dropdown-item> - </a> - <a target="_blank" href="https://panjiachen.github.io/vue-element-admin-site/#/"> - <el-dropdown-item>Docs</el-dropdown-item> - </a> - <el-dropdown-item divided @click.native="logout"> - <span style="display:block;">Log Out</span> + <el-dropdown-item @click.native="logout"> + <span style="display: block">閫�鍑虹櫥褰�</span> </el-dropdown-item> </el-dropdown-menu> </el-dropdown> @@ -32,31 +36,79 @@ </template> <script> -import { mapGetters } from 'vuex' -import Breadcrumb from '@/components/Breadcrumb' -import Hamburger from '@/components/Hamburger' +import { mapGetters } from "vuex"; +import Breadcrumb from "@/components/Breadcrumb"; +import Hamburger from "@/components/Hamburger"; export default { + inject: ["reload"], // 渚濊禆娉ㄥ叆 + data() { + return { + selectStaff: { org: {} }, + staffs: [], + }; + }, components: { Breadcrumb, - Hamburger + Hamburger, }, computed: { - ...mapGetters([ - 'sidebar', - 'avatar' - ]) + ...mapGetters(["sidebar", "avatar"]), }, methods: { + changeStaff(item) { + this.selectStaff = item; + localStorage.setItem("selectStaff", JSON.stringify(item)); + // this.$router.go(0) + this.reload(); + }, + orgCss() { + return ( + JSON.parse(localStorage.getItem("user")).name.length * 20 + 100 + "px" + ); + }, + getOrgName() { + return JSON.parse(localStorage.getItem("selectStaff")).org.name; + }, + getUserName() { + return JSON.parse(localStorage.getItem("user")).name; + }, toggleSideBar() { - this.$store.dispatch('app/toggleSideBar') + this.$store.dispatch("app/toggleSideBar"); }, async logout() { - await this.$store.dispatch('user/logout') - this.$router.push(`/login?redirect=${this.$route.fullPath}`) - } - } -} + // await this.$store.dispatch('user/logout') + this.$router.push(`/login`); + }, + loadStaffs() { + const selectStaff = JSON.parse(localStorage.getItem("selectStaff")); + if (selectStaff) { + this.selectStaff = selectStaff; + } + const staffs = JSON.parse(localStorage.getItem("staffs")); + + console.log('Navbar-created'); + if (staffs) { + this.staffs = staffs; + } + }, + beforeCreate() { + const user = JSON.parse(localStorage.getItem("user")); + if (!user) { + this.$router.push(`/login`); + } + }, + }, + created() { + this.loadStaffs(); + }, + mounted() { + this.$EventBus.$on("updateStaffs", (data) => { + + this.loadStaffs(); + }); + }, +}; </script> <style lang="scss" scoped> @@ -65,18 +117,18 @@ overflow: hidden; position: relative; background: #fff; - box-shadow: 0 1px 4px rgba(0,21,41,.08); + box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08); .hamburger-container { line-height: 46px; height: 100%; float: left; cursor: pointer; - transition: background .3s; - -webkit-tap-highlight-color:transparent; + transition: background 0.3s; + -webkit-tap-highlight-color: transparent; &:hover { - background: rgba(0, 0, 0, .025) + background: rgba(0, 0, 0, 0.025); } } @@ -103,20 +155,21 @@ &.hover-effect { cursor: pointer; - transition: background .3s; + transition: background 0.3s; &:hover { - background: rgba(0, 0, 0, .025) + background: rgba(0, 0, 0, 0.025); } } } .avatar-container { - margin-right: 30px; + margin-right: 50px; .avatar-wrapper { margin-top: 5px; position: relative; + cursor: pointer; .user-avatar { cursor: pointer; @@ -136,4 +189,11 @@ } } } + +.el-dropdown-menu { + max-height: 400px; + /*璁剧疆鑿滃崟楂樺害涓�200px*/ + overflow-y: auto; + /*璁剧疆婊氬姩鏉�*/ +} </style> -- Gitblit v1.8.0