feat: improve quoted message rendering in dashboard

This commit is contained in:
liuwei
2026-04-07 17:35:03 +08:00
parent 3d56b3895a
commit 867f00435c
3 changed files with 115 additions and 28 deletions

View File

@@ -94,6 +94,14 @@
<div v-else class="message-text-preview is-muted">
{% raw %}{{ scope.row.content || `【消息类型: ${scope.row.message_type}】` }}{% endraw %}
<div v-if="scope.row.quoted_type === 'image' && scope.row.quoted_preview_image" class="quoted-media-preview">
<div class="message-media-label">【引用图片】</div>
<img :src="scope.row.quoted_preview_image" class="message-thumb" @click="showQuotedImage(scope.row.quoted_preview_image)">
</div>
<div v-else-if="scope.row.quoted_type === 'video' && scope.row.quoted_preview_video_thumb" class="quoted-media-preview">
<div class="message-media-label">【引用视频】</div>
<img :src="scope.row.quoted_preview_video_thumb" class="message-thumb">
</div>
</div>
</div>
</template>
@@ -198,7 +206,8 @@
},
detailDialogVisible: false,
imageDialogVisible: false,
selectedMessage: null
selectedMessage: null,
quotedPreviewUrl: ''
}
},
mounted() {
@@ -309,6 +318,10 @@
this.selectedMessage = message;
this.imageDialogVisible = true;
},
showQuotedImage(url) {
this.selectedMessage = { image_path: '', message_thumb: url };
this.imageDialogVisible = true;
},
showVideo(message) {
this.selectedMessage = message;
this.detailDialogVisible = true;
@@ -444,6 +457,13 @@
gap: 8px;
}
.quoted-media-preview {
margin-top: 8px;
display: flex;
flex-direction: column;
gap: 8px;
}
.message-media-label {
font-size: 12px;
color: #64748b;