|
@@ -1,7 +1,9 @@
|
|
<template>
|
|
<template>
|
|
<message-component>
|
|
<message-component>
|
|
<div ref="messageIcon" class="message-icon">
|
|
<div ref="messageIcon" class="message-icon">
|
|
- <span v-show="unReadMessages?.newCount" class="un-read-num"></span>
|
|
|
|
|
|
+ <span v-show="unReadMessages?.newCount" class="un-read-num">
|
|
|
|
+ {{ Math.min(unReadMessages?.newCount || 0, 99) }}
|
|
|
|
+ </span>
|
|
<svg-icon name="message"></svg-icon>
|
|
<svg-icon name="message"></svg-icon>
|
|
</div>
|
|
</div>
|
|
<el-popover
|
|
<el-popover
|
|
@@ -141,10 +143,14 @@ const onSendMessage = () => {
|
|
position: relative;
|
|
position: relative;
|
|
.un-read-num {
|
|
.un-read-num {
|
|
position: absolute;
|
|
position: absolute;
|
|
- width: 8px;
|
|
|
|
- height: 8px;
|
|
|
|
- right: -2px;
|
|
|
|
- top: -2px;
|
|
|
|
|
|
+ width: 16px;
|
|
|
|
+ height: 16px;
|
|
|
|
+ line-height: 16px;
|
|
|
|
+ right: -8px;
|
|
|
|
+ top: -8px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ color: $color--white;
|
|
|
|
+ font-size: 10px;
|
|
border-radius: 50%;
|
|
border-radius: 50%;
|
|
background-color: $DangerColor;
|
|
background-color: $DangerColor;
|
|
}
|
|
}
|