|
|
@@ -2,145 +2,22 @@
|
|
|
<div class="header">
|
|
|
<div class="header-left">
|
|
|
<img src="@/assets/imgs/OA/zdww.png" alt="" />
|
|
|
- <p
|
|
|
- >{{ titleName }}
|
|
|
- <!-- <span v-if="menuUlShow">|</span> {{ headerTitleName }} -->
|
|
|
- </p>
|
|
|
+ <p>{{ titleName }} </p>
|
|
|
+ </div>
|
|
|
+ <div class="header-right">
|
|
|
+ <Weather />
|
|
|
</div>
|
|
|
- <!-- <div class="header-right">
|
|
|
- <ul class="menuUl" v-if="menuUlShow">
|
|
|
- <li v-for="(item, index) in reactiveData.routes" :key="index" v-show="item.alwaysShow">
|
|
|
- <router-link :to="'/oaSystem/' + pathBossName + '/' + item.path">
|
|
|
- <span>{{ item.name }}</span>
|
|
|
- </router-link>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <div class="header-user">
|
|
|
- <ElDropdown class="custom-hover" :class="prefixCls" trigger="click">
|
|
|
- <div class="flex items-center">
|
|
|
- <ElAvatar
|
|
|
- :src="avatar"
|
|
|
- alt=""
|
|
|
- class="w-[calc(var(--logo-height)-25px)] rounded-[50%]"
|
|
|
- />
|
|
|
- <span class="pl-[5px] c-white ml-5px text-14px <lg:hidden">
|
|
|
- {{ userName }}
|
|
|
- </span>
|
|
|
- </div>
|
|
|
- <template #dropdown>
|
|
|
- <ElDropdownMenu>
|
|
|
- <ElDropdownItem>
|
|
|
- <Icon icon="ep:tools" />
|
|
|
- <div @click="toProfile">{{ t('common.profile') }}</div>
|
|
|
- </ElDropdownItem>
|
|
|
- <ElDropdownItem divided @click="loginOut">
|
|
|
- <Icon icon="ep:switch-button" />
|
|
|
- <div>{{ t('common.loginOut') }}</div>
|
|
|
- </ElDropdownItem>
|
|
|
- </ElDropdownMenu>
|
|
|
- </template>
|
|
|
- </ElDropdown>
|
|
|
- </div>
|
|
|
- </div> -->
|
|
|
</div>
|
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
|
-import { useRouter } from 'vue-router'
|
|
|
-import { ElMessageBox } from 'element-plus'
|
|
|
-import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
|
|
|
-import { useDesign } from '@/hooks/web/useDesign'
|
|
|
-import avatarImg from '@/assets/imgs/avatar.gif'
|
|
|
-import { useUserStore } from '@/store/modules/user'
|
|
|
-import { useTagsViewStore } from '@/store/modules/tagsView'
|
|
|
import { useAppStore } from '@/store/modules/app'
|
|
|
+import Weather from './weather.vue'
|
|
|
defineOptions({ name: 'Header' })
|
|
|
-const { t } = useI18n()
|
|
|
-
|
|
|
-const { wsCache } = useCache()
|
|
|
-
|
|
|
-const { push, replace } = useRouter()
|
|
|
-
|
|
|
-const userStore = useUserStore()
|
|
|
const appStore = useAppStore()
|
|
|
-const tagsViewStore = useTagsViewStore()
|
|
|
-
|
|
|
-const { getPrefixCls } = useDesign()
|
|
|
-
|
|
|
-const prefixCls = getPrefixCls('user-info')
|
|
|
-
|
|
|
-const user = wsCache.get(CACHE_KEY.USER)
|
|
|
-
|
|
|
-const avatar = user.user.avatar ? user.user.avatar : avatarImg
|
|
|
-
|
|
|
-const userName = user.user.nickname ? user.user.nickname : 'Admin'
|
|
|
const titleName = ref(appStore.title)
|
|
|
-const loginOut = () => {
|
|
|
- ElMessageBox.confirm(t('common.loginOutMessage'), t('common.reminder'), {
|
|
|
- confirmButtonText: t('common.ok'),
|
|
|
- cancelButtonText: t('common.cancel'),
|
|
|
- type: 'warning'
|
|
|
- })
|
|
|
- .then(async () => {
|
|
|
- await userStore.loginOut()
|
|
|
- tagsViewStore.delAllViews()
|
|
|
- replace('/login?redirect=/index')
|
|
|
- })
|
|
|
- .catch(() => {})
|
|
|
-}
|
|
|
-const toProfile = async () => {
|
|
|
- push('/user/profile')
|
|
|
-}
|
|
|
-
|
|
|
-const reactiveData: any = reactive({
|
|
|
- routes: []
|
|
|
-})
|
|
|
-const menuUlShow = ref(false) // 菜单列表是否显示，是首页就不显示
|
|
|
-const headerTitleName: any = ref('') // 标题名称
|
|
|
-const router = useRouter()
|
|
|
-
|
|
|
-const pathBossName = ref('')
|
|
|
-const initMenus = async () => {
|
|
|
- const uid = router.currentRoute.value
|
|
|
- let locals: any = localStorage.getItem('roleRouters')
|
|
|
- let roleRouters = JSON.parse(JSON.parse(locals).v)[0].children
|
|
|
|
|
|
- if (uid.path == '/oaSystem/home' || uid.path.indexOf('projectDetail') != -1) {
|
|
|
- menuUlShow.value = false
|
|
|
- reactiveData.routes = roleRouters
|
|
|
- } else {
|
|
|
- menuUlShow.value = true
|
|
|
-
|
|
|
- let childName = uid.name
|
|
|
- let childArr = roleRouters.slice(1, roleRouters.length)
|
|
|
- await childFun(childName, childArr)
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-const childFun = async (name: any, arr: any) => {
|
|
|
- reactiveData.routes = []
|
|
|
- for (let i = 0; i < arr.length; i++) {
|
|
|
- if (arr[i].children != null && arr[i].children) {
|
|
|
- for (let j = 0; j < arr[i].children.length; j++) {
|
|
|
- if (arr[i].children[j].path == name) {
|
|
|
- pathBossName.value = arr[i].path
|
|
|
- headerTitleName.value = arr[i].name
|
|
|
- reactiveData.routes = arr[i].children
|
|
|
- }
|
|
|
- }
|
|
|
- } else {
|
|
|
- if (arr[i].path == name) {
|
|
|
- headerTitleName.value = arr[i].name
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-watch(() => {
|
|
|
- initMenus()
|
|
|
-})
|
|
|
/** 初始化 **/
|
|
|
-onMounted(() => {
|
|
|
- initMenus()
|
|
|
-})
|
|
|
+onMounted(() => {})
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
.header {
|
|
|
@@ -169,42 +46,6 @@ onMounted(() => {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
height: 100%;
|
|
|
- .menuUl {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- height: 100%;
|
|
|
- margin: 0;
|
|
|
- border-right: 1px solid #45638e;
|
|
|
- li {
|
|
|
- width: 136px;
|
|
|
- list-style: none;
|
|
|
- height: 100%;
|
|
|
- a {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- display: block;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- text-decoration: none;
|
|
|
- span {
|
|
|
- color: #fff;
|
|
|
- font-size: 16px;
|
|
|
- }
|
|
|
- }
|
|
|
- .router-link-active {
|
|
|
- background-color: #4e6e9e;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .header-user {
|
|
|
- margin-left: 25px;
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
-.custom-hover {
|
|
|
- background-color: transparent;
|
|
|
-}
|
|
|
</style>
|
wuhongbo
