From 23f1bf22c42a904c05cee63e10c9fd8b60dfe8f5 Mon Sep 17 00:00:00 2001 From: Admin <978517621@qq.com> Date: 星期二, 20 九月 2022 14:54:56 +0800 Subject: [PATCH] Default Changelist --- src/layout/navBars/breadcrumb/user.vue | 200 +++++++++++++++++++++++++++++++++++-------------- 1 files changed, 143 insertions(+), 57 deletions(-) diff --git a/src/layout/navBars/breadcrumb/user.vue b/src/layout/navBars/breadcrumb/user.vue index 7601048..b838098 100644 --- a/src/layout/navBars/breadcrumb/user.vue +++ b/src/layout/navBars/breadcrumb/user.vue @@ -1,10 +1,11 @@ <template> <div class="layout-navbars-breadcrumb-user pr15" :style="{ flex: layoutUserFlexNum }"> <div class="logo"> - <img src="../../../assets/menu/companyLogo.jpg" /> - <span style="font-size: 16px; color: #333; font-weight: bolder"> | {{ systemName }}</span> + <img @click="toHome" src="../../../assets/menu/companyLogo.png" /> + <span>{{ systemName }}</span> </div> - <div style="display: flex; padding-right: 5px"> + <div style="display: flex; align-items: center; padding-right: 5px"> + <div @click="backToMenu()" class="backBtn">返回首页</div> <el-dropdown :show-timeout="70" :hide-timeout="50" trigger="click" @command="onComponentSizeChange"> <div class="layout-navbars-breadcrumb-user-icon"> <i class="iconfont icon-ziti" :title="$t('message.user.title0')"></i> @@ -56,7 +57,7 @@ </div> <el-dropdown :show-timeout="70" :hide-timeout="50" @command="onHandleCommandClick"> <span class="layout-navbars-breadcrumb-user-link"> - <img :src="userInfos.photo" class="layout-navbars-breadcrumb-user-link-photo mr5" /> + <img src="../../../assets/avator.png" class="layout-navbars-breadcrumb-user-link-photo mr5" style="width: 24px;height: 24px"/> {{ userInfos.userName }} <el-icon class="el-icon--right"> <ele-ArrowDown /> @@ -64,7 +65,7 @@ </span> <template #dropdown> <el-dropdown-menu> - <el-dropdown-item command="/homeMenu">{{ $t('message.user.dropdown1') }}</el-dropdown-item> + <el-dropdown-item command="/newMenu">{{ $t('message.user.dropdown1') }}</el-dropdown-item> <!-- <el-dropdown-item command="wareHouse">{{ $t('message.user.dropdown6') }}</el-dropdown-item>--> <!-- <el-dropdown-item command="/personal">{{ $t('message.user.dropdown2') }}</el-dropdown-item>--> <!-- <el-dropdown-item command="/404">{{ $t('message.user.dropdown3') }}</el-dropdown-item>--> @@ -92,15 +93,15 @@ import UserNews from '/@/layout/navBars/breadcrumb/userNews.vue'; import Search from '/@/layout/navBars/breadcrumb/search.vue'; import { useLoginApi } from '/@/api/login'; -import { Session } from '/@/utils/storage'; import { useMenuApi } from '/@/api/systemManage/menu/index'; -import { ElMessage } from 'element-plus'; const menuApi = useMenuApi(); import { backEndComponent, getBackEndControlRoutes, initBackEndControlRoutes, setAddRoute, setFilterMenuAndCacheTagsViewRoutes } from '../../../router/backEnd'; import { NextLoading } from '/@/utils/loading'; import { useRequestOldRoutes } from '/@/stores/requestOldRoutes'; import { dynamicRoutes } from '/@/router/route'; +import Cookies from 'js-cookie'; +import {useRoutesList} from "/@/stores/routesList"; export default defineComponent({ name: 'layoutBreadcrumbUser', @@ -110,6 +111,7 @@ const { proxy } = <any>getCurrentInstance(); const router = useRouter(); const stores = useUserInfo(); + const routeList = storeToRefs(useRoutesList()) const storesThemeConfig = useThemeConfig(); const { userInfos } = storeToRefs(stores); const { themeConfig } = storeToRefs(storesThemeConfig); @@ -251,14 +253,23 @@ const getSysName = async () => { if (window.nextLoading === undefined) NextLoading.start(); - if (!Session.get('token')) return false; - const res = await menuApi.getMenuAdmin(Session.get('projectId') === null ? '' : Session.get('projectId')); + if (!Cookies.get('token')) return false; + const res = await menuApi.getMenuAdmin(Cookies.get('projectId') === null ? '' : Cookies.get('projectId')); if (res.data.code === '200') { state.systemName = res.data.data[1].project.projectName; console.log(state.systemName); } else { console.log('有问题'); } + }; + const backToMenu = () => { + router.push({ path: 'newMenu' }).then(()=>{ + routeList.routesList.value = [] + console.log(routeList); + }); + }; + const toHome = () => { + router.push({ path: 'newMenu' }); }; // 页面加载时 onMounted(() => { @@ -270,6 +281,8 @@ }); return { userInfos, + backToMenu, + toHome, onLayoutSetingClick, onHandleCommandClick, onScreenfullClick, @@ -285,60 +298,133 @@ </script> <style scoped lang="scss"> -.layout-navbars-breadcrumb-user { - display: flex; - align-items: center; - justify-content: space-between; + @media screen and (min-width: 1400px) { + .logo{ + img { + height: 100%; + cursor: pointer; + } + span{ + font-size: 32px; + color: #409eff; + font-weight: bolder; + border-left: 2px solid #409eff; + padding-left: 10px + } + } + .backBtn { + font-size: 16px; + cursor: pointer; + margin-right: 20px; - .logo { - height: 50px; - padding: 5px 10px; - display: flex; - align-items: center; - overflow: hidden; - box-sizing: border-box; - img { - height: 100%; - } - } - &-link { - height: 100%; - display: flex; - align-items: center; - white-space: nowrap; - &-photo { - width: 25px; - height: 25px; - border-radius: 100%; - } - } - &-icon { - padding: 0 10px; - cursor: pointer; - color: var(--next-bg-topBarColor); - height: 50px; - line-height: 50px; - display: flex; - align-items: center; - &:hover { - background: var(--next-color-user-hover); - i { - display: inline-block; - animation: logoAnimation 0.3s ease-in-out; + &:hover { + color: #409eff; + font-weight: bolder; } } } - ::v-deep(.el-dropdown) { - color: var(--next-bg-topBarColor); + @media screen and (min-width: 1200px) and (max-width: 1400px) { + .logo{ + img { + height: 90%; + cursor: pointer; + } + span{ + font-size: 28px; + color: #409eff; + font-weight: bolder; + border-left: 2px solid #409eff; + padding-left: 10px + } + } + .backBtn { + font-size: 14px; + cursor: pointer; + margin-right: 20px; + + &:hover { + color: #409eff; + font-weight: bolder; + } + } } - ::v-deep(.el-badge) { - height: 40px; - line-height: 40px; + @media screen and (max-width: 1024px) { + .logo{ + img { + width: 60%; + height: auto; + cursor: pointer; + } + span{ + font-size: 22px; + color: #409eff; + font-weight: bolder; + border-left: 2px solid #409eff; + padding-left: 10px + } + } + .backBtn { + font-size: 12px; + cursor: pointer; + margin-right: 20px; + + &:hover { + color: #409eff; + font-weight: bolder; + } + } + } + .layout-navbars-breadcrumb-user { display: flex; align-items: center; + justify-content: space-between; + + .logo { + height: 75%; + padding: 5px 10px; + display: flex; + align-items: center; + overflow: hidden; + box-sizing: border-box; + } + &-link { + height: 100%; + display: flex; + align-items: center; + white-space: nowrap; + &-photo { + width: 25px; + height: 25px; + border-radius: 100%; + } + } + &-icon { + padding: 0 10px; + cursor: pointer; + color: var(--next-bg-topBarColor); + height: 80px; + line-height: 80px; + display: flex; + align-items: center; + &:hover { + background: var(--next-color-user-hover); + i { + display: inline-block; + animation: logoAnimation 0.3s ease-in-out; + } + } + } + ::v-deep(.el-dropdown) { + color: var(--next-bg-topBarColor); + } + ::v-deep(.el-badge) { + height: 40px; + line-height: 40px; + display: flex; + align-items: center; + } + ::v-deep(.el-badge__content.is-fixed) { + top: 12px; + } } - ::v-deep(.el-badge__content.is-fixed) { - top: 12px; - } -} </style> -- Gitblit v1.9.2