修改优化
This commit is contained in:
@@ -8,12 +8,13 @@
|
||||
<div>
|
||||
<svg-icon class-name="size-icon" icon-class="size" />
|
||||
</div>
|
||||
<el-dropdown-menu #dropdown>
|
||||
<el-dropdown-item v-for="item of sizeOptions" :key="item.value" :disabled="size===item.value" :command="item.value">
|
||||
{{
|
||||
item.label }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item v-for="item of sizeOptions" :key="item.value" :disabled="size===item.value" :command="item.value">
|
||||
{{ item.label }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
|
||||
@@ -23,9 +24,8 @@ export default {
|
||||
return {
|
||||
sizeOptions: [
|
||||
{ label: '默认', value: 'default' },
|
||||
{ label: '中等', value: 'medium' },
|
||||
{ label: '小', value: 'small' },
|
||||
{ label: '极小', value: 'mini' }
|
||||
{ label: '大号', value: 'large' },
|
||||
{ label: '小号', value: 'small' }
|
||||
]
|
||||
}
|
||||
},
|
||||
@@ -37,23 +37,8 @@ export default {
|
||||
methods: {
|
||||
handleSetSize(size) {
|
||||
this.$store.dispatch('app/setSize', size)
|
||||
this.refreshView()
|
||||
this.$message({
|
||||
message: '字体切换成功!',
|
||||
type: 'success'
|
||||
})
|
||||
},
|
||||
refreshView() {
|
||||
// In order to make the cached page re-rendered
|
||||
this.$store.dispatch('tagsView/delAllCachedViews', this.$route)
|
||||
|
||||
const { fullPath } = this.$route
|
||||
|
||||
this.$nextTick(() => {
|
||||
this.$router.replace({
|
||||
path: '/redirect' + fullPath
|
||||
})
|
||||
})
|
||||
// Element Plus size is set at app init, need full reload to apply
|
||||
window.location.reload()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -5,11 +5,11 @@
|
||||
-->
|
||||
<template>
|
||||
<section class="app-main">
|
||||
<transition name="fade-transform" mode="out-in">
|
||||
<router-view v-slot="{ Component, route }">
|
||||
<keep-alive :include="cachedViews">
|
||||
<router-view :key="key" />
|
||||
<component :is="Component" :key="route.path" />
|
||||
</keep-alive>
|
||||
</transition>
|
||||
</router-view>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
@@ -19,9 +19,6 @@ export default {
|
||||
computed: {
|
||||
cachedViews() {
|
||||
return this.$store.state.tagsView.cachedViews
|
||||
},
|
||||
key() {
|
||||
return this.$route.path
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -17,25 +17,23 @@
|
||||
|
||||
<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>
|
||||
<size-select id="size-select" class="right-menu-item hover-effect" />
|
||||
|
||||
</template>
|
||||
|
||||
<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
|
||||
<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click" @command="handleCommand">
|
||||
<div class="avatar-wrapper">
|
||||
{{ realName }}
|
||||
<el-icon class="el-icon-caret-bottom"><ArrowDown /></el-icon>
|
||||
</div>
|
||||
<el-dropdown-menu #dropdown>
|
||||
<router-link to="/profile/index">
|
||||
<el-dropdown-item>个人资料</el-dropdown-item>
|
||||
</router-link>
|
||||
<el-dropdown-item divided>
|
||||
<span style="display:block;" @click="logout">退出登录</span>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<router-link to="/profile/index">
|
||||
<el-dropdown-item>个人资料</el-dropdown-item>
|
||||
</router-link>
|
||||
<el-dropdown-item divided command="logout">退出登录</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
</div>
|
||||
@@ -73,9 +71,12 @@ export default {
|
||||
toggleSideBar() {
|
||||
this.$store.dispatch('app/toggleSideBar')
|
||||
},
|
||||
async logout() {
|
||||
await this.$store.dispatch('user/logout')
|
||||
this.$router.push(`/login?redirect=${this.$route.fullPath}`)
|
||||
handleCommand(command) {
|
||||
if (command === 'logout') {
|
||||
this.$store.dispatch('user/logout').finally(() => {
|
||||
this.$router.push(`/login?redirect=${this.$route.fullPath}`)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -82,6 +82,10 @@ export default {
|
||||
.sidebar-logo {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
.sidebar-title {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
</app-link>
|
||||
</template>
|
||||
|
||||
<el-submenu v-else ref="subMenu" :index="resolvePath(item.path)" teleported>
|
||||
<el-sub-menu v-else ref="subMenu" :index="resolvePath(item.path)" teleported>
|
||||
<template #title>
|
||||
<item v-if="item.meta" :icon="item.meta && item.meta.icon" :title="item.meta.title" />
|
||||
</template>
|
||||
@@ -25,7 +25,7 @@
|
||||
:base-path="resolvePath(child.path)"
|
||||
class="nest-menu"
|
||||
/>
|
||||
</el-submenu>
|
||||
</el-sub-menu>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
@date 20260616
|
||||
-->
|
||||
<template>
|
||||
<div :class="{'has-logo':showLogo}">
|
||||
<div :class="{'has-logo':showLogo}" :style="isCollapse ? { width: '54px', overflow: 'hidden', flex: '0 0 54px' } : {}">
|
||||
<logo v-if="showLogo" :collapse="isCollapse" />
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper">
|
||||
<el-menu
|
||||
@@ -15,6 +15,7 @@
|
||||
:unique-opened="false"
|
||||
:active-text-color="variables.menuActiveText"
|
||||
:collapse-transition="false"
|
||||
:style="isCollapse ? { width: '54px' } : {}"
|
||||
mode="vertical"
|
||||
>
|
||||
<sidebar-item v-for="route in permission_routes" :key="route.path" :item="route" :base-path="route.path" />
|
||||
|
||||
@@ -273,15 +273,19 @@ const router = createRouter({
|
||||
})
|
||||
|
||||
export function resetRouter() {
|
||||
const newRouter = createRouter({
|
||||
history: createWebHashHistory(),
|
||||
scrollBehavior: () => ({ top: 0 }),
|
||||
routes: constantRoutes
|
||||
})
|
||||
// 注意:Vue Router 4 没有 matcher,通过移除所有路由再重新添加来重置
|
||||
const currentRoutes = router.getRoutes()
|
||||
currentRoutes.forEach(route => {
|
||||
if (route.name && !constantRoutes.find(cr => cr.name === route.name)) {
|
||||
// 递归收集 constantRoutes 中所有路由名称(含嵌套子路由),避免误删 Login 等常量子路由
|
||||
const constantNames = new Set()
|
||||
const collectNames = (routes) => {
|
||||
routes.forEach(route => {
|
||||
if (route.name) constantNames.add(route.name)
|
||||
if (route.children) collectNames(route.children)
|
||||
})
|
||||
}
|
||||
collectNames(constantRoutes)
|
||||
|
||||
// 仅移除动态添加的路由(asyncRoutes),保留 constantRoutes 中的全部路由
|
||||
router.getRoutes().forEach(route => {
|
||||
if (route.name && !constantNames.has(route.name)) {
|
||||
router.removeRoute(route.name)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
* @date 20260615
|
||||
*/
|
||||
export default {
|
||||
title: '校园管藏图书数字化运维系统',
|
||||
title: '校园馆藏图书数字化运维系统',
|
||||
|
||||
/**
|
||||
* @type {boolean} true | false
|
||||
|
||||
@@ -11,7 +11,7 @@ const state = {
|
||||
withoutAnimation: false
|
||||
},
|
||||
device: 'desktop',
|
||||
size: Cookies.get('size') || 'medium'
|
||||
size: Cookies.get('size') || 'default'
|
||||
}
|
||||
|
||||
const mutations = {
|
||||
|
||||
@@ -122,19 +122,17 @@ const actions = {
|
||||
|
||||
// user logout
|
||||
logout({ commit, state, dispatch }) {
|
||||
return new Promise((resolve, reject) => {
|
||||
logout(state.token).then(() => {
|
||||
return new Promise((resolve) => {
|
||||
logout(state.token).finally(() => {
|
||||
commit('SET_TOKEN', '')
|
||||
commit('SET_ROLES', [])
|
||||
removeToken()
|
||||
resetRouter()
|
||||
|
||||
// reset visited views and cached views
|
||||
dispatch('tagsView/delAllViews', null, { root: true })
|
||||
dispatch('tagsView/delAllViews', null, { root: true })
|
||||
|
||||
resolve()
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
@@ -27,11 +27,6 @@
|
||||
z-index: 1001;
|
||||
overflow: hidden;
|
||||
|
||||
// reset element-ui css
|
||||
.horizontal-collapse-transition {
|
||||
transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
|
||||
}
|
||||
|
||||
.scrollbar-wrapper {
|
||||
overflow-x: hidden !important;
|
||||
}
|
||||
@@ -67,23 +62,22 @@
|
||||
.el-menu {
|
||||
border: none;
|
||||
height: 100%;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
// menu hover
|
||||
.submenu-title-noDropdown,
|
||||
.el-submenu__title {
|
||||
.el-menu-item,
|
||||
.el-sub-menu__title {
|
||||
&:hover {
|
||||
background-color: v.$menuHover !important;
|
||||
}
|
||||
}
|
||||
|
||||
.is-active>.el-submenu__title {
|
||||
.is-active > .el-sub-menu__title {
|
||||
color: v.$subMenuActiveText !important;
|
||||
}
|
||||
|
||||
& .nest-menu .el-submenu>.el-submenu__title,
|
||||
& .el-submenu .el-menu-item {
|
||||
& .nest-menu .el-sub-menu > .el-sub-menu__title,
|
||||
& .el-sub-menu .el-menu-item {
|
||||
min-width: v.$sideBarWidth !important;
|
||||
background-color: v.$subMenuBg !important;
|
||||
|
||||
@@ -93,61 +87,42 @@
|
||||
}
|
||||
}
|
||||
|
||||
// ===== 侧边栏收缩状态 =====
|
||||
.hideSidebar {
|
||||
.sidebar-container {
|
||||
width: 54px !important;
|
||||
max-width: 54px !important;
|
||||
min-width: 54px !important;
|
||||
}
|
||||
|
||||
.main-container {
|
||||
margin-left: 54px;
|
||||
}
|
||||
|
||||
.submenu-title-noDropdown {
|
||||
padding: 0 !important;
|
||||
position: relative;
|
||||
|
||||
.el-tooltip {
|
||||
padding: 0 !important;
|
||||
|
||||
.svg-icon {
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-submenu {
|
||||
overflow: hidden;
|
||||
|
||||
&>.el-submenu__title {
|
||||
padding: 0 !important;
|
||||
|
||||
.svg-icon {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.el-submenu__icon-arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
// Element Plus el-scrollbar 在收缩时也要限制宽度
|
||||
.sidebar-container .el-scrollbar {
|
||||
width: 54px !important;
|
||||
max-width: 54px !important;
|
||||
}
|
||||
|
||||
// 通过 CSS 变量覆盖 Element Plus 默认的 64px 收缩宽度,并用 !important 强制 54px
|
||||
.el-menu--collapse {
|
||||
.el-submenu {
|
||||
&>.el-submenu__title {
|
||||
&>span {
|
||||
height: 0;
|
||||
width: 0;
|
||||
overflow: hidden;
|
||||
visibility: hidden;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
--el-menu-icon-width: 24px;
|
||||
--el-menu-base-level-padding: 15px;
|
||||
width: 54px !important;
|
||||
max-width: 54px !important;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.el-menu--collapse .el-menu .el-submenu {
|
||||
min-width: v.$sideBarWidth !important;
|
||||
// 覆盖 Element Plus 的 .el-menu .el-sub-menu { min-width: 200px },防止子菜单撑开收缩后的侧边栏
|
||||
.sidebar-container .el-sub-menu {
|
||||
min-width: 54px !important;
|
||||
}
|
||||
|
||||
// 收缩时图标居中,去掉右边距
|
||||
.el-menu--collapse .svg-icon {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// mobile responsive
|
||||
@@ -180,24 +155,23 @@
|
||||
}
|
||||
}
|
||||
|
||||
// when menu collapsed
|
||||
// when menu collapsed, submenu popup styles
|
||||
.el-menu--vertical {
|
||||
&>.el-menu {
|
||||
& > .el-menu {
|
||||
.svg-icon {
|
||||
margin-right: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.nest-menu .el-submenu>.el-submenu__title,
|
||||
.nest-menu .el-sub-menu > .el-sub-menu__title,
|
||||
.el-menu-item {
|
||||
&:hover {
|
||||
// you can use v.$subMenuHover
|
||||
background-color: v.$menuHover !important;
|
||||
}
|
||||
}
|
||||
|
||||
// the scroll bar appears when the subMenu is too long
|
||||
>.el-menu--popup {
|
||||
> .el-menu--popup {
|
||||
max-height: 100vh;
|
||||
overflow-y: auto;
|
||||
|
||||
|
||||
@@ -50,18 +50,16 @@
|
||||
<el-card class="box">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>支持信息</span>
|
||||
<span>系统信息</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div>
|
||||
|
||||
<div class="title" style="padding-top: 0px">商业咨询</div>
|
||||
<div style="display: flex;">
|
||||
<div style="flex-grow: 1;">
|
||||
<div>校园管藏图书数字化运维系统</div>
|
||||
<div>校园管藏图书数字化运维系统</div>
|
||||
<div>校园管藏图书数字化运维系统</div>
|
||||
<div>墨韵智枢</div>
|
||||
<div>校园馆藏图书数字化运维系统</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<app-main />
|
||||
<router-view />
|
||||
|
||||
</div>
|
||||
|
||||
@@ -30,11 +30,10 @@
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import AppMain from '@/layout/components/AppMain.vue'
|
||||
|
||||
export default {
|
||||
name: 'LoginLayout',
|
||||
components: { AppMain },
|
||||
components: {},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'siteData'
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!--
|
||||
@description 用户信息卡片组件,展示头像、昵称等个人资料摘要
|
||||
@description 用户信息卡片组件,展示头像、昵称等个人资料摘要 效果不好 暂时删除
|
||||
@author D吕贺034244311
|
||||
@date 20260620
|
||||
-->
|
||||
@@ -13,10 +13,10 @@
|
||||
|
||||
<div class="user-profile">
|
||||
<div class="box-center">
|
||||
<pan-thumb :image="user.avatar" :height="'100px'" :width="'100px'" :hoverable="false">
|
||||
<div>欢迎</div>
|
||||
{{ user.role }}
|
||||
</pan-thumb>
|
||||
<!-- <pan-thumb :image="user.avatar" :height="'100px'" :width="'100px'" :hoverable="false">-->
|
||||
<!-- <div>欢迎</div>-->
|
||||
<!-- {{ user.role }}-->
|
||||
<!-- </pan-thumb>-->
|
||||
</div>
|
||||
<div class="box-center">
|
||||
<div class="user-name text-center">{{ user.name }}</div>
|
||||
|
||||
@@ -8,11 +8,11 @@
|
||||
<div v-if="user">
|
||||
<el-row :gutter="20">
|
||||
|
||||
<el-col :span="6" :xs="24">
|
||||
<user-card :user="user" />
|
||||
</el-col>
|
||||
<!-- <el-col :span="6" :xs="24">-->
|
||||
<!-- <user-card :user="user" />-->
|
||||
<!-- </el-col>-->
|
||||
|
||||
<el-col :span="18" :xs="24">
|
||||
<el-col :span="6" :xs="24">
|
||||
<el-card>
|
||||
<el-tabs v-model="activeTab">
|
||||
<el-tab-pane label="修改资料" name="account">
|
||||
@@ -34,7 +34,7 @@ import Account from './components/Account.vue'
|
||||
|
||||
export default {
|
||||
name: 'Profile',
|
||||
components: { UserCard, Account },
|
||||
components: { Account },
|
||||
data() {
|
||||
return {
|
||||
user: {},
|
||||
|
||||
@@ -14,7 +14,6 @@
|
||||
@multi-actions="handleMultiAction"
|
||||
>
|
||||
<template #filter-content>
|
||||
<el-input v-model="listQuery.params.id" style="width: 200px" placeholder="搜索公告编码" class="filter-item"/>
|
||||
<el-input v-model="listQuery.params.title" style="width: 200px" placeholder="搜索公告标题" class="filter-item"/>
|
||||
<el-input v-model="listQuery.params.text" style="width: 200px" placeholder="搜索公告内容" class="filter-item" />
|
||||
<label>开始时间</label>
|
||||
@@ -35,12 +34,6 @@
|
||||
|
||||
</template>
|
||||
<template #data-columns>
|
||||
<el-table-column align="center" label="公告编号" prop="id">
|
||||
<template #default="scope">
|
||||
<a style="color: #1890ff" @click="handleUpdate(scope.row)">{{ scope.row.id }}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column align="center" label="公告标题" prop="title"/>
|
||||
<el-table-column align="center" label="公告内容" prop="text"/>
|
||||
|
||||
@@ -14,7 +14,6 @@
|
||||
@multi-actions="handleMultiAction"
|
||||
>
|
||||
<template #filter-content>
|
||||
<el-input v-model="listQuery.params.id" style="width: 200px" placeholder="搜索留言编码" class="filter-item"/>
|
||||
<el-input v-model="listQuery.params.itemname" style="width: 200px" placeholder="搜索发布人昵称" class="filter-item"/>
|
||||
<el-input v-model="listQuery.params.text" style="width: 200px" placeholder="搜索留言内容" class="filter-item" />
|
||||
<label>开始时间</label>
|
||||
@@ -38,11 +37,6 @@
|
||||
|
||||
</template>
|
||||
<template #data-columns>
|
||||
<el-table-column align="center" label="留言编号" prop="id">
|
||||
<template #default="scope">
|
||||
<a style="color: #1890ff" @click="handleUpdate(scope.row)">{{ scope.row.id }}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="留言人昵称" prop="itemname"/>
|
||||
<el-table-column align="center" label="留言内容" prop="text"/>
|
||||
|
||||
Reference in New Issue
Block a user