From fd989d2af98e1ba50d82bbe9db6ce0a24a074bbf Mon Sep 17 00:00:00 2001 From: zhanghua <314079846@qq.com> Date: 星期三, 18 九月 2024 14:22:09 +0800 Subject: [PATCH] 学员导入功能 --- src/layout/components/Navbar.vue | 90 +++++++++++++++++++++++++++++++++------------ 1 files changed, 66 insertions(+), 24 deletions(-) diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue index 53ce25c..6330837 100644 --- a/src/layout/components/Navbar.vue +++ b/src/layout/components/Navbar.vue @@ -1,19 +1,39 @@ <template> <div class="navbar"> - <hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" /> + <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> + <!-- <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.org.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.org.name }} + </el-dropdown-item> + </el-dropdown-menu> + </el-dropdown> <el-dropdown class="avatar-container" trigger="click"> <div class="avatar-wrapper"> - {{ '浣犲ソ锛�' + getUserName() }} + {{ "鎮ㄥソ锛�" + getUserName() }} <i class="el-icon-caret-bottom"></i> </div> <el-dropdown-menu slot="dropdown" class="user-dropdown"> <el-dropdown-item @click.native="logout"> - <span style="display:block;">閫�鍑虹櫥褰�</span> + <span style="display: block">閫�鍑虹櫥褰�</span> </el-dropdown-item> </el-dropdown-menu> </el-dropdown> @@ -22,40 +42,62 @@ </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'; + return ( + JSON.parse(localStorage.getItem("user")).name.length * 20 + 100 + "px" + ); }, getOrgName() { - return JSON.parse(localStorage.getItem("user")).staffs[0].org.name; + 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`) + this.$router.push(`/login`); + }, + }, + created() { + const selectStaff = JSON.parse(localStorage.getItem("selectStaff")); + if (selectStaff) { + this.selectStaff = selectStaff; } - } -} + const staffs = JSON.parse(localStorage.getItem("staffs")); + if (staffs) { + this.staffs = staffs; + } + }, +}; </script> <style lang="scss" scoped> @@ -64,18 +106,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); } } @@ -102,10 +144,10 @@ &.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); } } } -- Gitblit v1.8.0