From ce58040e3959fc8b23fce4289b170a6dbc2e71a4 Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期四, 25 四月 2024 16:49:48 +0800 Subject: [PATCH] 增加用户名的显示和退出登录的操作 --- src/components/layout/components/appHeader/index.vue | 118 ++++++++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 101 insertions(+), 17 deletions(-) diff --git a/src/components/layout/components/appHeader/index.vue b/src/components/layout/components/appHeader/index.vue index 3381afa..f965e6a 100644 --- a/src/components/layout/components/appHeader/index.vue +++ b/src/components/layout/components/appHeader/index.vue @@ -1,25 +1,110 @@ <template> <div class="sales-lead"> <div class="header-title">{{ headerTitle }}</div> - <div class="header-user-info"></div> + <div class="header-user-info"> + <div class="avatar"><el-avatar icon="el-icon-user-solid"></el-avatar></div> + <el-dropdown @command="handleCommand"> + <div class="el-dropdown-link">浣犲ソ {{ username }}<i class="el-icon-arrow-down el-icon--right"></i></div> + <el-dropdown-menu slot="dropdown"> + <el-dropdown-item command="logout">閫�鍑�</el-dropdown-item> + <!-- <el-dropdown-item @click.native="updatePwd"> + <d2-icon name="unlock" class="d2-mr-5" /> + 淇敼瀵嗙爜 + </el-dropdown-item> --> + </el-dropdown-menu> + </el-dropdown> + <UpdatePassWord :editCommonConfig="editConfig"></UpdatePassWord> + </div> </div> </template> <script> +import Cookies from "js-cookie" +import UpdatePassWord from "./components/updatePassWord" export default { - name: "SalesLead", + name: "SalesLeads", props: { - headerTitle: String + headerTitle: { + type:String, + default:'' + } + }, + components:{ + UpdatePassWord, }, data() { - return {} + return { + username: "", + editConfig:{ + dialogVisible:false, + userId:"", + } + } + }, + created(){ + const userObj = Cookies.get('userObj'); + if (userObj) { + let userInfo = JSON.parse(userObj); + this.editConfig.userId=userInfo.id + this.username=userInfo.nickName + } else { + console.log('Object not found in cookie'); + } + }, + mounted() { + // this.username = document.cookie.replace(/(?:(?:^|.*;\s*)username\s*=\s*([^;]*).*$)|^.*$/, "$1") }, methods: { - handleCommand(command) { - console.log(command) - if (command === "logout") { - this.$router.push({ path: "/login" }) + environmentType() { + let type + if (location.href.includes("192.168.20.119")) { + type = "test" + } else if (location.href.includes("192.168") || location.href.includes("localhost")) { + type = "dev" + } else { + type = "prod" } + + return type + }, + getApsPage() { + // 棣栭〉閮ㄧ讲鍦ㄥ悇涓幆澧冪殑绔彛 + const loginPathMap = { + prod: `//${window.location.hostname}:9080`, + test: `//192.168.20.119:9080`, + // 鎯宠烦鍒版湰鍦板惎鍔ㄧ殑鐧诲綍椤电殑璇濋渶瑕佹妸dev鏀规垚浣犳湰鍦伴」鐩矾寰� + dev: `//192.168.8.113:8080` + } + return loginPathMap[this.environmentType()] + }, + handleCommand(command) { + if (command === "logout") { + // this.$router.push({ path: "/login" }) + document.cookie = "cookieName=; path=/;" + this.$confirm("纭畾瑕佹敞閿�褰撳墠鐢ㄦ埛鍚�?", "娉ㄩ攢鐢ㄦ埛", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning" + }) + .then(() => { + Cookies.remove("token") + // window.location.href = 'http://localhost:8080/login'; //鏈湴鐨勬櫤鎱у伐鍘�-鐧诲綍椤� + window.location.href = "http:" + this.getApsPage() + "/login" + this.$message({ + type: "success", + message: "娉ㄩ攢鎴愬姛!" + }) + }) + .catch(() => { + this.$message({ + type: "info", + message: "宸插彇娑堟敞閿�" + }) + }) + } + }, + updatePwd(){ + this.editConfig.dialogVisible=true } } } @@ -29,24 +114,23 @@ <style lang="scss" scoped> .sales-lead { display: flex; - height: 66px; + height: 50px; box-sizing: border-box; - line-height: 66px; - background-color: #fff; - box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.0588235294117647); + line-height: 50px; + background-color: $color-bg; + border: 1px solid #ccc; .header-title { - padding-left: 30px; + padding-left: 16px; font-size: 18px; - font-family: "Arial Negreta", "Arial Normal", "Arial"; - font-weight: 700; - color: #227bde; + font-weight: bold; + color: #171718; } .header-user-info { margin-left: auto; margin-right: 20px; display: flex; .avatar { - margin-top: 8px; + margin-top: 4px; margin-right: 10px; } } -- Gitblit v1.8.0