perf: 移动端聊天窗口返回按钮显示未读信息数

This commit is contained in:
kuaifan 2022-05-24 01:01:11 +08:00
parent a6425c2859
commit edd8988961
2 changed files with 35 additions and 2 deletions

View File

@ -9,6 +9,7 @@
<div class="dialog-nav" :class="{completed:$A.dialogCompleted(dialogData)}">
<div class="dialog-back" @click="goBack">
<i class="taskfont">&#xe72d;</i>
<div v-if="msgUnreadOnly" class="back-num">{{msgUnreadOnly}}</div>
</div>
<div class="dialog-block">
@ -289,7 +290,21 @@ export default {
return ['multiple'];
}
return [];
}
},
msgUnreadOnly() {
let num = 0;
this.cacheDialogs.some(dialog => {
num += $A.getDialogUnread(dialog);
})
if (num <= 0) {
return '';
}
if (num > 99) {
num = "99+"
}
return String(num);
},
},
watch: {

View File

@ -857,14 +857,32 @@
justify-content: center;
}
.dialog-back {
padding-right: 6px;
right: auto;
left: 0;
> i {
font-size: 26px;
}
.back-num {
font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
position: absolute;
top: 50%;
left: 32px;
background: #e6ebf1;
color: $primary-title-color;
transform: translate(0, -50%);
font-weight: 500;
font-size: 14px;
border-radius: 12px;
min-width: 24px;
height: 24px;
line-height: 24px;
text-align: center;
padding: 0 6px;
}
}
.dialog-block {
margin: 0 52px;
margin: 0 80px;
justify-content: center;
.dialog-avatar {
display: none;