feat(chat): 聊天排版升级微信标准(左右分侧+头像+绿气泡)+is_send数据修复
- is_send 根因:云客消息方向在 mine 字段(isSend 全 null),归一化加 fallback +存量回填 60.7 万行(51万收/16万发)——分侧数据首次完整 - MessageBubble:头像(对方=raw headUrl 在左/自己=默认在右)、自己侧隐藏昵称、 接收白底描边/发送微信绿 #95ec69、气泡列 max-width 78% - 实测混合对话:13发(绿+头像右)/7收(白+头像左)全部正确 Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
+41
-7
@@ -142,7 +142,7 @@ a {
|
||||
.yk-msg {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
padding: 6px 0;
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
.yk-msg--send {
|
||||
@@ -151,14 +151,46 @@ a {
|
||||
|
||||
.yk-msg__row {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: 70%;
|
||||
max-width: 78%;
|
||||
gap: 10px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.yk-msg--send .yk-msg__row {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
.yk-msg__body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.yk-msg--send .yk-msg__body {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
/* 头像(微信式):对方在左/自己在右(row-reverse),小圆角方形 */
|
||||
.yk-msg__avatar-wrap {
|
||||
flex: none;
|
||||
}
|
||||
|
||||
.yk-msg__avatar {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
border-radius: 4px;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
background: #f2f3f5;
|
||||
}
|
||||
|
||||
.yk-msg__avatar--ph {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #a8abb2;
|
||||
}
|
||||
|
||||
/* Clickable bubble row — opens the all-fields drawer. Subtle hover so users
|
||||
* discover the interaction without changing the bubble's own look. */
|
||||
.yk-msg__row--clickable {
|
||||
@@ -186,8 +218,9 @@ a {
|
||||
|
||||
.yk-msg__bubble {
|
||||
padding: 8px 12px;
|
||||
border-radius: 10px;
|
||||
background: #f4f4f5;
|
||||
border-radius: 8px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #e5e6eb;
|
||||
color: #303133;
|
||||
line-height: 1.5;
|
||||
word-break: break-word;
|
||||
@@ -195,8 +228,9 @@ a {
|
||||
}
|
||||
|
||||
.yk-msg--send .yk-msg__bubble {
|
||||
background: var(--el-color-primary-light-8, #d9ecff);
|
||||
color: #1d2129;
|
||||
background: #95ec69;
|
||||
border-color: #95ec69;
|
||||
color: #0f170a;
|
||||
}
|
||||
|
||||
.yk-msg__image {
|
||||
|
||||
Reference in New Issue
Block a user