From c34fe6f588045e527bccfd4c67b9764b2a141ea2 Mon Sep 17 00:00:00 2001 From: chenrui <1187576398@qq.com> Date: 星期三, 26 二月 2025 15:24:41 +0800 Subject: [PATCH] 设施和环境条件代码迁移 --- src/layout/components/Navbar.vue | 149 ++++++++++++++++++++++++++----------------------- 1 files changed, 80 insertions(+), 69 deletions(-) diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue index 5b45e3c..da89cf9 100644 --- a/src/layout/components/Navbar.vue +++ b/src/layout/components/Navbar.vue @@ -1,7 +1,7 @@ <template> <div class="navbar"> -<!-- <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>--> -<!-- <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/>--> + <!-- <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>--> + <!-- <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/>--> <div class="logo"> <img src="@/assets/logo/ZTTlogo.png" /> </div> @@ -10,56 +10,61 @@ </div> <div class="right-menu"> <div class="avatar-wrapper"> - <img :src="avatar" class="user-avatar"> - <span class="userName">Admin</span> - <img class="logoout" src="@/assets/images/logoout.png" @click="logout" title="閫�鍑鸿处鍙�" /> + <img :src="avatar" class="user-avatar" /> + <span class="userName">{{ nickName }}</span> + <img + class="logoout" + src="@/assets/images/logoout.png" + @click="logout" + title="閫�鍑鸿处鍙�" + /> </div> -<!-- <template v-if="device!=='mobile'">--> -<!-- <search id="header-search" class="right-menu-item" />--> + <!-- <template v-if="device!=='mobile'">--> + <!-- <search id="header-search" class="right-menu-item" />--> -<!-- <el-tooltip content="婧愮爜鍦板潃" effect="dark" placement="bottom">--> -<!-- <ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />--> -<!-- </el-tooltip>--> + <!-- <el-tooltip content="婧愮爜鍦板潃" effect="dark" placement="bottom">--> + <!-- <ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />--> + <!-- </el-tooltip>--> -<!-- <el-tooltip content="鏂囨。鍦板潃" effect="dark" placement="bottom">--> -<!-- <ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />--> -<!-- </el-tooltip>--> + <!-- <el-tooltip content="鏂囨。鍦板潃" effect="dark" placement="bottom">--> + <!-- <ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />--> + <!-- </el-tooltip>--> -<!-- <screenfull id="screenfull" class="right-menu-item hover-effect" />--> + <!-- <screenfull id="screenfull" class="right-menu-item hover-effect" />--> -<!-- <el-tooltip content="甯冨眬澶у皬" effect="dark" placement="bottom">--> -<!-- <size-select id="size-select" class="right-menu-item hover-effect" />--> -<!-- </el-tooltip>--> + <!-- <el-tooltip content="甯冨眬澶у皬" effect="dark" placement="bottom">--> + <!-- <size-select id="size-select" class="right-menu-item hover-effect" />--> + <!-- </el-tooltip>--> -<!-- </template>--> + <!-- </template>--> -<!-- <div class="avatar-container">--> -<!-- <el-dropdown-menu slot="dropdown">--> -<!-- <router-link to="/user/profile">--> -<!-- <el-dropdown-item>涓汉涓績</el-dropdown-item>--> -<!-- </router-link>--> -<!-- <el-dropdown-item @click.native="setting = true">--> -<!-- <span>甯冨眬璁剧疆</span>--> -<!-- </el-dropdown-item>--> -<!-- <el-dropdown-item divided @click.native="logout">--> -<!-- <span>閫�鍑虹櫥褰�</span>--> -<!-- </el-dropdown-item>--> -<!-- </el-dropdown-menu>--> -<!-- </div>--> + <!-- <div class="avatar-container">--> + <!-- <el-dropdown-menu slot="dropdown">--> + <!-- <router-link to="/user/profile">--> + <!-- <el-dropdown-item>涓汉涓績</el-dropdown-item>--> + <!-- </router-link>--> + <!-- <el-dropdown-item @click.native="setting = true">--> + <!-- <span>甯冨眬璁剧疆</span>--> + <!-- </el-dropdown-item>--> + <!-- <el-dropdown-item divided @click.native="logout">--> + <!-- <span>閫�鍑虹櫥褰�</span>--> + <!-- </el-dropdown-item>--> + <!-- </el-dropdown-menu>--> + <!-- </div>--> </div> </div> </template> <script> -import { mapGetters } from 'vuex' -import Breadcrumb from '@/components/Breadcrumb' -import TopNav from '@/components/TopNav' -import Hamburger from '@/components/Hamburger' -import Screenfull from '@/components/Screenfull' -import SizeSelect from '@/components/SizeSelect' -import Search from '@/components/HeaderSearch' -import RuoYiGit from '@/components/RuoYi/Git' -import RuoYiDoc from '@/components/RuoYi/Doc' +import { mapGetters } from "vuex"; +import Breadcrumb from "@/components/Breadcrumb"; +import TopNav from "@/components/TopNav"; +import Hamburger from "@/components/Hamburger"; +import Screenfull from "@/components/Screenfull"; +import SizeSelect from "@/components/SizeSelect"; +import Search from "@/components/HeaderSearch"; +import RuoYiGit from "@/components/RuoYi/Git"; +import RuoYiDoc from "@/components/RuoYi/Doc"; export default { components: { @@ -70,53 +75,57 @@ SizeSelect, Search, RuoYiGit, - RuoYiDoc + RuoYiDoc, }, computed: { - ...mapGetters([ - 'avatar', - 'device' - ]), + ...mapGetters(["avatar", "device", "nickName"]), setting: { get() { - return this.$store.state.settings.showSettings + return this.$store.state.settings.showSettings; }, set(val) { - this.$store.dispatch('settings/changeSetting', { - key: 'showSettings', - value: val - }) - } + this.$store.dispatch("settings/changeSetting", { + key: "showSettings", + value: val, + }); + }, }, topNav: { get() { - return this.$store.state.settings.topNav - } - } + return this.$store.state.settings.topNav; + }, + }, }, methods: { async logout() { - this.$confirm('纭畾娉ㄩ攢骞堕��鍑虹郴缁熷悧锛�', '鎻愮ず', { - confirmButtonText: '纭畾', - cancelButtonText: '鍙栨秷', - type: 'warning' - }).then(() => { - this.$store.dispatch('LogOut').then(() => { - location.href = '/index'; + this.$confirm("纭畾娉ㄩ攢骞堕��鍑虹郴缁熷悧锛�", "鎻愮ず", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning", + }) + .then(() => { + this.$store.dispatch("LogOut").then(() => { + location.href = "/index"; + }); }) - }).catch(() => {}); - } - } -} + .catch(() => {}); + }, + }, +}; </script> <style lang="scss" scoped> .navbar { height: 50px; overflow: hidden; - position: relative; + //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); + position: fixed; /* 灏嗗ご閮ㄥ浐瀹� */ + top: 0; /* 鍦ㄩ《閮ㄥ浐瀹� */ + width: 100%; /* 瀹藉害100%锛岃鐩栨暣涓鍙� */ + //background-color: #f8f9fa; /* 璁剧疆鑳屾櫙棰滆壊锛屼互渚挎洿鏄庢樉鍦扮湅鍒版晥鏋� */ + z-index: 1000; /* 纭繚澶撮儴鍦ㄥ叾浠栧唴瀹逛箣涓� */ display: flex; align-items: center; justify-content: space-between; @@ -125,6 +134,8 @@ width: 118px; height: 40px; img { + width: 118px; + height: 40px; margin-left: 20px; cursor: pointer; } @@ -192,10 +203,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.9.3