[update] 把头部的消息通知加回来

This commit is contained in:
lideqin
2024-03-04 14:14:29 +08:00
parent 9e1de3e359
commit 6c3486a3a1
2 changed files with 33 additions and 65 deletions
+29 -61
View File
@@ -9,61 +9,23 @@
:overlayStyle="{ width: '330px', top: '50px' }">
<template slot="content">
<a-spin :spinning="loadding">
<a-tabs>
<a-tab-pane :tab="msg1Title" key="1">
<!--<a-list>
<a-list-item>
<a-list-item-meta title="你收到了 14 份新周报" description="一年前">
<a-avatar style="background-color: white" slot="avatar" src="https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png"/>
</a-list-item-meta>
</a-list-item>
<a-list-item>
<a-list-item-meta title="你推荐的 IT大牛 已通过第三轮面试" description="一年前">
<a-avatar style="background-color: white" slot="avatar" src="https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png"/>
</a-list-item-meta>
</a-list-item>
<a-list-item>
<a-list-item-meta title="这种模板可以区分多种通知类型" description="一年前">
<a-avatar style="background-color: white" slot="avatar" src="https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png"/>
</a-list-item-meta>
</a-list-item>
</a-list>-->
<a-list>
<a-list-item :key="index" v-for="(record, index) in announcement1">
<div style="margin-left: 5%;width: 80%">
<p><a @click="showAnnouncement(record)">{{ record.titile }}</a></p>
<p style="color: rgba(0,0,0,.45);margin-bottom: 0">{{ record.createTime }} 发布</p>
</div>
<div style="text-align: right">
<a-tag @click="showAnnouncement(record)" v-if="record.priority === 'L'" color="blue">一般消息</a-tag>
<a-tag @click="showAnnouncement(record)" v-if="record.priority === 'M'" color="orange">重要消息</a-tag>
<a-tag @click="showAnnouncement(record)" v-if="record.priority === 'H'" color="red">紧急消息</a-tag>
</div>
</a-list-item>
<div style="margin-top: 5px;text-align: center">
<a-button @click="toMyAnnouncement()" type="dashed" block>{{ $t('header.lookMore') }}</a-button>
</div>
</a-list>
</a-tab-pane>
<a-tab-pane :tab="msg2Title" key="2">
<a-list>
<a-list-item :key="index" v-for="(record, index) in announcement2">
<div style="margin-left: 5%;width: 80%">
<p><a @click="showAnnouncement(record)">{{ record.titile }}</a></p>
<p style="color: rgba(0,0,0,.45);margin-bottom: 0">{{ record.createTime }} 发布</p>
</div>
<div style="text-align: right">
<a-tag @click="showAnnouncement(record)" v-if="record.priority === 'L'" color="blue">一般消息</a-tag>
<a-tag @click="showAnnouncement(record)" v-if="record.priority === 'M'" color="orange">重要消息</a-tag>
<a-tag @click="showAnnouncement(record)" v-if="record.priority === 'H'" color="red">紧急消息</a-tag>
</div>
</a-list-item>
<div style="margin-top: 5px;text-align: center">
<a-button @click="toMyAnnouncement()" type="dashed" block>{{ $t('header.lookMore') }}</a-button>
</div>
</a-list>
</a-tab-pane>
</a-tabs>
<div class="notice-title">系统通知</div>
<a-list>
<a-list-item :key="index" v-for="(record, index) in announcement2">
<div style="margin-left: 5%;width: 80%">
<p><a @click="showAnnouncement(record)">{{ record.titile }}</a></p>
<p style="color: rgba(0,0,0,.45);margin-bottom: 0">{{ record.createTime }} 发布</p>
</div>
<div style="text-align: right">
<a-tag @click="showAnnouncement(record)" v-if="record.priority === 'L'" color="blue">一般消息</a-tag>
<a-tag @click="showAnnouncement(record)" v-if="record.priority === 'M'" color="orange">重要消息</a-tag>
<a-tag @click="showAnnouncement(record)" v-if="record.priority === 'H'" color="red">紧急消息</a-tag>
</div>
</a-list-item>
<div style="margin-top: 5px;text-align: center">
<a-button @click="toMyAnnouncement()" type="dashed" block>{{ $t('header.lookMore') }}</a-button>
</div>
</a-list>
</a-spin>
</template>
<span @click="fetchNotice" class="header-notice">
@@ -323,12 +285,18 @@ export default {
}
</style>
<style lang="less" scoped>
.header-notice{
display: inline-block;
transition: all 0.3s;
.notice-title {
text-align: center;
padding: 3px 0;
border-bottom: 1px solid #e8e8e8;
letter-spacing: 1px;
}
.header-notice{
display: inline-block;
transition: all 0.3s;
span {
vertical-align: initial;
}
span {
vertical-align: initial;
}
}
</style>
+4 -4
View File
@@ -31,7 +31,7 @@
<!-- <a-icon type="question-circle-o"></a-icon>-->
<!-- </a>-->
<!--</span>-->
<!--<header-notice class="action"/>-->
<header-notice class="action"/>
<!--<span style="padding: 12px">-->
<!-- <a-avatar class="avatar" size="small" :src="getAvatar()"/>-->
<!--</span>-->
@@ -46,9 +46,9 @@
<!-- </span>-->
<!--</div>-->
<!--<a-dropdown>-->
<span class="action">
<span v-if="isDesktop()">{{ $t('header.welcome') }}{{ nickname() }}</span>
</span>
<span class="action">
<span v-if="isDesktop()">{{ $t('header.welcome') }}{{ nickname() }}</span>
</span>
<!-- <a-menu slot="overlay" class="user-dropdown-menu-wrapper">-->
<!-- <a-menu-item key="0">-->
<!-- <router-link :to="{ name: 'account-center' }">-->