daikins/.svn/pristine/93/93bc23b305d98d6033adb8ecf2f...

133 lines
3.1 KiB
Plaintext

<script setup lang="ts">
import { useUserStore } from "@/stores/modules/user";
import { NDropdown, NPopover } from "naive-ui";
import { getAllNoticeList } from "@/api/daikin/base";
import { useDate } from "@/views/home/hooks/useDate";
const { day, week } = useDate();
// 全屏
const { toggle } = inject<any>("fullscreen");
const { push } = useRouter();
const store = useUserStore();
const route = useRoute();
const noticeData = ref();
const flgs = ref(false);
async function getNoticeList() {
const { data } = await getAllNoticeList();
noticeData.value = data;
}
onMounted(() => {
getNoticeList();
// console.log( flgs.value,flg)
});
watchEffect(() => {
// console.log( flgs.value,store.user.type)
flgs.value = [1, 2, 3, 4].includes(store.user.type);
});
const options = [
{ label: "个人中心", key: "ucenter" },
,
{
label: "修改密码",
key: "ChangePWD",
props: {
onclick: () => {
console.log(route.path);
const pth = route.path === "/external" ? "modify" : "modifys";
push({ name: pth });
},
},
},
{
key: "logout",
label: "退出登录",
props: {
style: { width: "150px" },
onClick: () => {
store.LogOut();
},
},
},
];
</script>
<template>
<div class="w-full">
<div class="h-full max-w600px float-left">
<div class="font-600 flex items-end">
<div class="text-36px">调达Database</div>
<div class="text-18px ml40px mr25px">{{ day }}</div>
<div class="text-18px">{{ week }}</div>
</div>
</div>
<div class="cursor-pointer inline-block items-center float-right">
<div class="flex inline-block items-center">
<div @click="push({ name: 'Home' })">
<img src="@/assets/images/home.png" class="mt--5px" /><span
class="ml10px mr15px"
>首页 </span
>|
</div>
<NDropdown
show-arrow
placement="bottom-end"
size="huge"
:options="options"
>
<div>
<img
src="@/assets/images/icon-user.svg"
class="ml20px mr16px w60px h60px"
/>
<!-- @click="toggle" -->
<span>{{ store.user.nikeName ?? "游客" }}</span>
<img src="@/assets/images/icon-more.svg" class="ml30px w13px" />
</div>
</NDropdown>
</div>
</div>
</div>
</template>
<style scoped lang="less">
.notice {
position: absolute;
top: 52px;
left: -3px;
width: 200px;
background: rgb(255, 255, 255);
max-height: 520px;
z-index: 500;
font-size: 18px;
border-radius: 15px;
padding: 10px;
color: rgb(26, 25, 25);
box-shadow: 1px 1px 5px 1px #d9d5d5;
.box:hover {
background: #e5e5e5;
border-radius: 5px;
color: #1836c3;
span {
color: #ffffff;
background: red;
}
}
span {
color: #1836c3;
padding: 2px 7px;
border-radius: 50px;
}
}
.popover-grid {
display: grid;
grid-template-columns: auto auto auto auto auto;
grid-gap: 12px;
justify-content: center;
align-items: center;
}
</style>