|
|
|
@ -2,14 +2,13 @@ |
|
|
|
<div> |
|
|
|
<div class="m-tx"> |
|
|
|
<div class="wrap"> |
|
|
|
<div class="tabs"> |
|
|
|
<el-tabs v-model="type" @tab-click="handleClickTab"> |
|
|
|
<el-tab-pane label="全部" name="all"></el-tab-pane> |
|
|
|
<el-tab-pane label="已读" name="readed"></el-tab-pane> |
|
|
|
<el-tab-pane label="未读" name="unreaded"></el-tab-pane> |
|
|
|
</el-tabs> |
|
|
|
<div class="header"> |
|
|
|
<div class="title">全部提醒</div> |
|
|
|
<div class="btn-clear" @click="read"> |
|
|
|
<img src="~@/assets/images/main/clear.png" /> |
|
|
|
全部标记已读 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- <div class="btn-clear">清除未读</div> --> |
|
|
|
<div class="cnt" v-if="noticeData.length > 0"> |
|
|
|
<div |
|
|
|
@click="handleClickNotice(item, index)" |
|
|
|
@ -18,13 +17,19 @@ |
|
|
|
:key="'notice' + item.targetId + index" |
|
|
|
v-for="(item, index) in noticeData" |
|
|
|
> |
|
|
|
<img |
|
|
|
class="item-tag" |
|
|
|
src="@/assets/images/index/title-icon-zntb.png" |
|
|
|
/> |
|
|
|
<i class="i-tag" v-if="item.readFlag == 1">已读</i> |
|
|
|
<i class="i-tag" v-else>未读</i> |
|
|
|
<div class="item-title"> |
|
|
|
{{ item.content }} |
|
|
|
</div> |
|
|
|
<div |
|
|
|
v-if="item.readFlag != 1" |
|
|
|
@click.stop="read(item)" |
|
|
|
class="item-btn-clear" |
|
|
|
> |
|
|
|
<img src="~@/assets/images/main/clear.png" /> |
|
|
|
标记已读 |
|
|
|
</div> |
|
|
|
<div class="item-date">{{ item.createdTime }}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -75,7 +80,7 @@ export default { |
|
|
|
}, |
|
|
|
computed: {}, |
|
|
|
watch: {}, |
|
|
|
mounted() { |
|
|
|
activated() { |
|
|
|
this.getList(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
@ -89,21 +94,21 @@ export default { |
|
|
|
this.read(item, index); |
|
|
|
}, |
|
|
|
|
|
|
|
async read(item) { |
|
|
|
if (item.readFlag == 1) return; |
|
|
|
async read(item, index) { |
|
|
|
if (item && item.readFlag == 1) return; |
|
|
|
|
|
|
|
const url = "/message/intelligentMessage/msg/clear"; |
|
|
|
let params = { |
|
|
|
id: item.id, |
|
|
|
}; |
|
|
|
let params = {}; |
|
|
|
|
|
|
|
if (item.id) { |
|
|
|
params.id = item.id; |
|
|
|
} |
|
|
|
|
|
|
|
const { data, code, msg } = await requestPost(url, params); |
|
|
|
|
|
|
|
if (code === 0) { |
|
|
|
const { noticeData } = this; |
|
|
|
noticeData[index].readFlag = 1; |
|
|
|
this.noticeData = noticeData; |
|
|
|
console.log("消息已读"); |
|
|
|
this.getList(); |
|
|
|
} else { |
|
|
|
this.$message.error(msg); |
|
|
|
} |
|
|
|
@ -183,6 +188,7 @@ export default { |
|
|
|
} |
|
|
|
|
|
|
|
.item { |
|
|
|
position: relative; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
padding: 16px 0 12px; |
|
|
|
@ -191,12 +197,31 @@ export default { |
|
|
|
border-bottom: none; |
|
|
|
} |
|
|
|
|
|
|
|
.item-tag { |
|
|
|
&:hover { |
|
|
|
.item-title { |
|
|
|
color: #0056d6; |
|
|
|
} |
|
|
|
.item-btn-clear { |
|
|
|
display: block; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.i-tag { |
|
|
|
display: block; |
|
|
|
margin-right: 15px; |
|
|
|
width: 24px; |
|
|
|
height: 24px; |
|
|
|
width: 40px; |
|
|
|
height: 22px; |
|
|
|
border-radius: 4px; |
|
|
|
border: 1px solid rgba(0, 0, 0, 0.15); |
|
|
|
font-size: 12px; |
|
|
|
font-family: PingFangSC-Regular, PingFang SC; |
|
|
|
font-weight: 400; |
|
|
|
color: rgba(0, 0, 0, 0.88); |
|
|
|
line-height: 20px; |
|
|
|
font-style: normal; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
|
|
|
|
.item-title { |
|
|
|
// @include toe; |
|
|
|
width: 60%; |
|
|
|
@ -207,7 +232,29 @@ export default { |
|
|
|
color: rgba(0, 0, 0, 0.85); |
|
|
|
line-height: 22px; |
|
|
|
} |
|
|
|
|
|
|
|
.item-btn-clear { |
|
|
|
position: absolute; |
|
|
|
display: none; |
|
|
|
top: 50%; |
|
|
|
left: 65%; |
|
|
|
width: 80px; |
|
|
|
font-size: 14px; |
|
|
|
font-family: PingFangSC-Regular, PingFang SC; |
|
|
|
font-weight: 400; |
|
|
|
color: #0042a3; |
|
|
|
line-height: 16px; |
|
|
|
cursor: pointer; |
|
|
|
transform: translateY(-50%); |
|
|
|
|
|
|
|
img { |
|
|
|
width: 16px; |
|
|
|
margin-right: 3px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.item-date { |
|
|
|
margin-left: 100px; |
|
|
|
font-size: 12px; |
|
|
|
font-family: PingFangSC-Regular, PingFang SC; |
|
|
|
font-weight: 400; |
|
|
|
@ -216,21 +263,32 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.header { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
padding: 12px 0; |
|
|
|
margin-bottom: 10px; |
|
|
|
border-bottom: 1px solid #f0f5fa; |
|
|
|
.title { |
|
|
|
height: 22px; |
|
|
|
font-size: 16px; |
|
|
|
font-family: PingFangSC-Medium, PingFang SC; |
|
|
|
font-weight: 500; |
|
|
|
color: rgba(0, 0, 0, 0.85); |
|
|
|
line-height: 22px; |
|
|
|
} |
|
|
|
.btn-clear { |
|
|
|
position: absolute; |
|
|
|
top: 14px; |
|
|
|
right: 15px; |
|
|
|
width: 32px; |
|
|
|
height: 12px; |
|
|
|
width: 75px; |
|
|
|
height: 25px; |
|
|
|
background: linear-gradient(0deg, #db3b3b 1%, #ff8080 100%); |
|
|
|
border-radius: 3px; |
|
|
|
font-size: 14px; |
|
|
|
font-weight: 500; |
|
|
|
color: #ffffff; |
|
|
|
line-height: 25px; |
|
|
|
text-align: center; |
|
|
|
font-family: PingFangSC-Regular, PingFang SC; |
|
|
|
font-weight: 400; |
|
|
|
color: #0042a3; |
|
|
|
line-height: 16px; |
|
|
|
cursor: pointer; |
|
|
|
img { |
|
|
|
width: 16px; |
|
|
|
margin-right: 3px; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|