|
@@ -2,16 +2,16 @@
|
|
|
<template>
|
|
<template>
|
|
|
<div class="top-navbar">
|
|
<div class="top-navbar">
|
|
|
<div class="logo-area">
|
|
<div class="logo-area">
|
|
|
- <span class="logo-text">水利工程运行管理系统</span>
|
|
|
|
|
|
|
+ <img src="@/assets/images/tba-slgc-run-logo.png" alt="logo"/>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="menu-area">
|
|
<div class="menu-area">
|
|
|
<!-- 动态菜单 -->
|
|
<!-- 动态菜单 -->
|
|
|
<div
|
|
<div
|
|
|
- v-for="item in topMenus"
|
|
|
|
|
- :key="item.path"
|
|
|
|
|
- :class="['menu-link', { active: isActive(item.path) }]"
|
|
|
|
|
- @click="handleMenuClick(item.path)"
|
|
|
|
|
|
|
+ v-for="item in topMenus"
|
|
|
|
|
+ :key="item.path"
|
|
|
|
|
+ :class="['menu-link', { active: isActive(item.path) }]"
|
|
|
|
|
+ @click="handleMenuClick(item.path)"
|
|
|
>
|
|
>
|
|
|
{{ item.meta?.title }}
|
|
{{ item.meta?.title }}
|
|
|
</div>
|
|
</div>
|
|
@@ -19,23 +19,23 @@
|
|
|
|
|
|
|
|
<div class="right-menu">
|
|
<div class="right-menu">
|
|
|
<el-dropdown
|
|
<el-dropdown
|
|
|
- @command="handleCommand"
|
|
|
|
|
- class="avatar-container"
|
|
|
|
|
- trigger="hover"
|
|
|
|
|
|
|
+ @command="handleCommand"
|
|
|
|
|
+ class="avatar-container"
|
|
|
|
|
+ trigger="hover"
|
|
|
>
|
|
>
|
|
|
<div class="avatar-wrapper">
|
|
<div class="avatar-wrapper">
|
|
|
<!-- 用户图标 -->
|
|
<!-- 用户图标 -->
|
|
|
- <svg-icon icon-class="user" class="user-icon" />
|
|
|
|
|
|
|
+ <svg-icon icon-class="user" class="user-icon"/>
|
|
|
<!-- 用户名 - 添加溢出处理 -->
|
|
<!-- 用户名 - 添加溢出处理 -->
|
|
|
<span
|
|
<span
|
|
|
- class="user-nickname"
|
|
|
|
|
- :title="userStore.nickName || userStore.name"
|
|
|
|
|
|
|
+ class="user-nickname"
|
|
|
|
|
+ :title="userStore.nickName || userStore.name"
|
|
|
>
|
|
>
|
|
|
{{ userStore.nickName || userStore.name }}
|
|
{{ userStore.nickName || userStore.name }}
|
|
|
</span>
|
|
</span>
|
|
|
<!-- 下拉箭头 -->
|
|
<!-- 下拉箭头 -->
|
|
|
<el-icon class="dropdown-icon">
|
|
<el-icon class="dropdown-icon">
|
|
|
- <ArrowDown />
|
|
|
|
|
|
|
+ <ArrowDown/>
|
|
|
</el-icon>
|
|
</el-icon>
|
|
|
</div>
|
|
</div>
|
|
|
<template #dropdown>
|
|
<template #dropdown>
|
|
@@ -44,8 +44,8 @@
|
|
|
<el-dropdown-item>个人中心</el-dropdown-item>
|
|
<el-dropdown-item>个人中心</el-dropdown-item>
|
|
|
</router-link>
|
|
</router-link>
|
|
|
<el-dropdown-item
|
|
<el-dropdown-item
|
|
|
- command="setLayout"
|
|
|
|
|
- v-if="settingsStore.showSettings"
|
|
|
|
|
|
|
+ command="setLayout"
|
|
|
|
|
+ v-if="settingsStore.showSettings"
|
|
|
>
|
|
>
|
|
|
<span>布局设置</span>
|
|
<span>布局设置</span>
|
|
|
</el-dropdown-item>
|
|
</el-dropdown-item>
|
|
@@ -63,10 +63,10 @@
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
-import { computed, ref } from "vue";
|
|
|
|
|
-import { useRoute, useRouter } from "vue-router";
|
|
|
|
|
-import { ElMessageBox } from "element-plus";
|
|
|
|
|
-import { ArrowDown } from "@element-plus/icons-vue";
|
|
|
|
|
|
|
+import {computed, ref} from "vue";
|
|
|
|
|
+import {useRoute, useRouter} from "vue-router";
|
|
|
|
|
+import {ElMessageBox} from "element-plus";
|
|
|
|
|
+import {ArrowDown} from "@element-plus/icons-vue";
|
|
|
import usePermissionStore from "@/store/modules/permission";
|
|
import usePermissionStore from "@/store/modules/permission";
|
|
|
import useUserStore from "@/store/modules/user";
|
|
import useUserStore from "@/store/modules/user";
|
|
|
import useSettingsStore from "@/store/modules/settings";
|
|
import useSettingsStore from "@/store/modules/settings";
|
|
@@ -84,7 +84,7 @@ export default {
|
|
|
},
|
|
},
|
|
|
},
|
|
},
|
|
|
emits: ["menu-click", "setLayout"],
|
|
emits: ["menu-click", "setLayout"],
|
|
|
- setup(props, { emit }) {
|
|
|
|
|
|
|
+ setup(props, {emit}) {
|
|
|
const route = useRoute();
|
|
const route = useRoute();
|
|
|
const router = useRouter();
|
|
const router = useRouter();
|
|
|
const permissionStore = usePermissionStore();
|
|
const permissionStore = usePermissionStore();
|
|
@@ -139,12 +139,13 @@ export default {
|
|
|
cancelButtonText: "取消",
|
|
cancelButtonText: "取消",
|
|
|
type: "warning",
|
|
type: "warning",
|
|
|
})
|
|
})
|
|
|
- .then(() => {
|
|
|
|
|
- userStore.logOut().then(() => {
|
|
|
|
|
- location.href = import.meta.env.VITE_APP_BASE_TITLE + "/index";
|
|
|
|
|
|
|
+ .then(() => {
|
|
|
|
|
+ userStore.logOut().then(() => {
|
|
|
|
|
+ location.href = import.meta.env.VITE_APP_BASE_TITLE + "/index";
|
|
|
|
|
+ });
|
|
|
|
|
+ })
|
|
|
|
|
+ .catch(() => {
|
|
|
});
|
|
});
|
|
|
- })
|
|
|
|
|
- .catch(() => {});
|
|
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
return {
|
|
return {
|
|
@@ -172,10 +173,17 @@ export default {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.logo-area {
|
|
.logo-area {
|
|
|
- width: 260px;
|
|
|
|
|
flex-shrink: 0;
|
|
flex-shrink: 0;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+.logo-area img {
|
|
|
|
|
+ height: 45px;
|
|
|
|
|
+ width: auto;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
.logo-text {
|
|
.logo-text {
|
|
|
color: #fff;
|
|
color: #fff;
|
|
|
font-size: 20px;
|
|
font-size: 20px;
|