|
|
@@ -12,10 +12,10 @@
|
|
|
<view class="list-box">
|
|
|
<view class="list-item-box" v-for="item in list" :key="item.id" @click="onChatClick(item)">
|
|
|
<view class="main-box">
|
|
|
- <view class="icon-box">
|
|
|
+ <!-- <view class="icon-box">
|
|
|
<cover-image class="icon" :src="`/static/chat-icon/${item.type}.png`"></cover-image>
|
|
|
<view class="tag" v-show="item.isRead"></view>
|
|
|
- </view>
|
|
|
+ </view> -->
|
|
|
<view class="content-box">
|
|
|
<view class="title">
|
|
|
{{item.title}}
|
|
|
@@ -23,6 +23,7 @@
|
|
|
<view class="text">
|
|
|
{{item.content}}
|
|
|
</view>
|
|
|
+ <view class="tag" v-show="item.isRead"></view>
|
|
|
</view>
|
|
|
<view class="other-box">
|
|
|
<view class="date">
|
|
|
@@ -135,32 +136,33 @@
|
|
|
&:active {
|
|
|
background-color: $uni-bg-color-hover;
|
|
|
}
|
|
|
- .icon-box {
|
|
|
- width: 15%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- position: relative;
|
|
|
- .icon {
|
|
|
- width: 70rpx;
|
|
|
- height: 70rpx;
|
|
|
- }
|
|
|
- .tag {
|
|
|
- position: absolute;
|
|
|
- right: 5rpx;
|
|
|
- top: -3rpx;
|
|
|
- width: 15rpx;
|
|
|
- height: 15rpx;
|
|
|
- background-color: $uni-color-error;
|
|
|
- border-radius: 50%;
|
|
|
- }
|
|
|
- }
|
|
|
+ // .icon-box {
|
|
|
+ // width: 15%;
|
|
|
+ // display: flex;
|
|
|
+ // justify-content: center;
|
|
|
+ // align-items: center;
|
|
|
+ // position: relative;
|
|
|
+ // .icon {
|
|
|
+ // width: 70rpx;
|
|
|
+ // height: 70rpx;
|
|
|
+ // }
|
|
|
+ // .tag {
|
|
|
+ // position: absolute;
|
|
|
+ // right: 5rpx;
|
|
|
+ // top: -3rpx;
|
|
|
+ // width: 15rpx;
|
|
|
+ // height: 15rpx;
|
|
|
+ // background-color: $uni-color-error;
|
|
|
+ // border-radius: 50%;
|
|
|
+ // }
|
|
|
+ // }
|
|
|
.content-box {
|
|
|
- width: 67%;
|
|
|
+ width: 85%;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
justify-content: space-around;
|
|
|
gap: 10rpx;
|
|
|
+ position: relative;
|
|
|
.title {
|
|
|
height: calc(70% - 5rpx);
|
|
|
font-size: $uni-title-font-size-2;
|
|
|
@@ -168,20 +170,29 @@
|
|
|
}
|
|
|
.text {
|
|
|
height: calc(30% - 5rpx);
|
|
|
- font-size: $uni-font-size-3;
|
|
|
+ font-size: $uni-font-size-2;
|
|
|
color: $uni-text-color-grey;
|
|
|
@include text-overflow();
|
|
|
}
|
|
|
+ .tag {
|
|
|
+ position: absolute;
|
|
|
+ left: -14rpx;
|
|
|
+ top: -3rpx;
|
|
|
+ width: 15rpx;
|
|
|
+ height: 15rpx;
|
|
|
+ background-color: $uni-color-error;
|
|
|
+ border-radius: 50%;
|
|
|
+ }
|
|
|
}
|
|
|
.other-box {
|
|
|
- width: 18%;
|
|
|
+ width: 15%;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
- justify-content: space-around;
|
|
|
+ justify-content: flex-end;
|
|
|
align-items: center;
|
|
|
gap: 10rpx;
|
|
|
.date {
|
|
|
- font-size: $uni-font-size-3;
|
|
|
+ font-size: $uni-font-size-2;
|
|
|
color: $uni-text-color-grey;
|
|
|
}
|
|
|
}
|
