Compare commits

...

2 Commits

View File

@@ -54,7 +54,6 @@
</el-row>
</el-form>
</div>
<el-row :gutter="10" class="mb8">
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@@ -114,14 +113,6 @@
<div v-for="message in chatMessages" :key="message.id" class="message-item">
<div class="message-header">
<span class="message-time">{{ parseTime(message.created_at * 1000, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
<div class="feedback-status" v-if="message.feedback">
<el-tag v-if="message.feedback && message.feedback.rating === 'like'" type="success" size="mini">
<i class="el-icon-thumb-up"></i> 点赞
</el-tag>
<el-tag v-else-if="message.feedback && message.feedback.rating === 'dislike'" type="danger" size="mini">
<i class="el-icon-thumb-down"></i> 点踩
</el-tag>
</div>
</div>
<div class="message-content">
@@ -132,10 +123,25 @@
<div class="ai-message">
<div class="message-label">AI回答</div>
<div class="message-text ai-text" :class="{
'feedback-like': message.feedback && message.feedback.rating === 'like',
'feedback-dislike': message.feedback && message.feedback.rating === 'dislike'
}" v-html="renderMarkdown(message.answer)"></div>
<div class="ai-message-wrapper" style="position: relative;">
<div class="message-text ai-text ai-message-container" :class="{
'feedback-like': message.feedback && message.feedback.rating === 'like',
'feedback-dislike': message.feedback && message.feedback.rating === 'dislike'
}" v-html="renderMarkdown(message.answer)"></div>
<!-- 反馈图标显示在右下角 -->
<div v-if="message.feedback" class="feedback-icon" style="position: absolute; bottom: 8px; right: 8px; z-index: 10;">
<!-- 点赞图标 -->
<svg v-if="message.feedback.rating === 'like'" class="feedback-like-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" style="width: 16px; height: 16px; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.1));">
<path d="M424.6 811.9c13.4 0 24.3-10.9 24.3-24.3V631c0-13.4-10.9-24.3-24.3-24.3s-24.3 10.9-24.3 24.3v156.6c-0.1 13.4 10.8 24.3 24.3 24.3z" fill="#FF4E7D"></path>
<path d="M875.2 467.3c-12.4-16-31.1-25.2-51.3-25.2H598.8c-4.3 0-7.8-1.9-10-5.6-2.2-3.7-2.2-8.1-0.2-12 14.1-26 22.8-52 26-77.1 3.7-29.1 10.1-123.8-8.9-175.9-5.2-14.5-18.9-52.9-72.5-56.2h-0.7l-0.7 0.1c-25.2 1.9-44.5 11-57.5 27.1-10.5 13-13.9 27-15.6 33.8-2.1 8.3-4.2 17.9-6.4 28.1l-0.2 0.7c-8.5 38.7-20.1 91.8-40.5 127.3-32.9 57.5-103.8 98.1-127.1 110.2-1.1-0.1-2.2-0.1-3.3-0.1h-92.1c-28.6 0-52 23.3-52 52v364.3c0 28.6 23.3 52 52 52h92.1c0.8 0 1.7 0 2.6-0.1l455.8-0.4c27.5 0 51.5-18.6 58.5-45.3l88.4-341.6c5.2-19.7 1.1-40.1-11.3-56.1z m-546.4 6c35-20.9 93.6-61.7 125.1-116.8 24-42 36.6-99.3 45.8-141.1 2.4-10.9 4.4-19.8 6.3-27.6 2.8-11.3 5.4-21.9 26.8-23.8 19.1 1.5 22.5 10.9 28 26.4 12.1 33 11 108.9 5.6 150.9-2.4 19.1-9.4 39.4-20.6 60.1-10.3 19-9.8 41.5 1.2 60 10.9 18.4 30.3 29.3 51.8 29.3h225.1c5 0 9.7 2.3 12.8 6.3s4.1 9.1 2.8 14.1l-88.4 341.6c-1.3 5.2-6 8.8-11.4 8.8l-406.5 0.4c0.1-1.1 0.1-2.1 0.1-3.2V494.4c0-7.3-1.6-14.5-4.5-21.1z m-142.9 21.1c0-1.8 1.5-3.3 3.3-3.3h92.1c1.8 0 3.3 1.5 3.3 3.3v364.3c0 1.6-1.1 3-2.7 3.3h-11.5l-5 0.1h-76.2c-1.8 0-3.3-1.5-3.3-3.3V494.4z" fill="#4E30DC"></path>
</svg>
<!-- 点踩图标 -->
<svg v-else-if="message.feedback.rating === 'dislike'" class="feedback-dislike-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" style="width: 16px; height: 16px; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.1));">
<path d="M932.059429 689.005714c-39.350857 10.24-134.144 10.24-271.36 13.165715 5.851429 29.257143 7.314286 57.051429 7.314285 105.325714C669.549714 923.062857 586.459429 1024 512 1024c-52.516571 0-94.866286-42.422857-96.329143-95.085714-1.462857-64.365714-20.406857-175.542857-126.829714-232.594286-7.314286-4.388571-30.72-14.628571-33.645714-16.091429l1.462857-1.462857c-17.408 16.091429-40.813714 24.868571-64.146286 24.868572H96.256C43.739429 703.634286 0 661.211429 0 607.085714v-512C1.462857 43.885714 43.739429 0 97.718857 0h96.256c36.498286 0 70.070857 21.942857 84.626286 55.588571h1.462857l7.314286-1.462857h1.462857c19.017143-4.388571 53.906286-13.165714 129.828571-30.72 16.018286-4.388571 102.107429-21.942857 191.049143-21.942857h175.030857c52.516571 0 91.940571 20.48 113.810286 61.44C920.429714 99.474286 1024 299.885714 1024 580.754286c0 39.497143-29.184 90.697143-91.940571 108.251428z m-705.974858-592.457143c0-17.554286-14.628571-32.182857-32.109714-32.182857H97.718857c-17.554286 0-32.109714 14.628571-32.109714 32.182857v512c0 17.554286 14.628571 32.182857 32.182857 32.182858h96.182857c17.554286 0 32.109714-14.628571 32.109714-32.182858v-512z m732.233143 462.262858c-12.434286-304.859429-106.057143-450.925714-115.858285-465.408l-0.804572-1.243429c-10.24-17.554286-24.795429-27.794286-58.368-27.794286H609.718857c-87.552 0-175.030857 20.48-176.493714 20.48-69.046857 16.018286-104.155429 24.429714-122.953143 29.110857l-7.606857 1.828572c-10.971429 2.779429-13.897143 3.584-16.822857 4.169143l4.388571 469.577143 0.073143 16.310857c0.073143 8.923429 0.292571 14.262857 0.365714 17.334857v1.682286l-0.438857-0.219429c145.92 59.977143 189.659429 193.097143 191.122286 302.811429 0 17.554286 14.628571 32.182857 32.109714 32.182857 33.499429 0 93.330286-67.291429 93.330286-152.137143 0-76.068571-2.925714-89.234286-29.184-168.228572h60.928c207.872-0.512 247.954286-3.364571 269.897143-8.045714l3.803428-0.804571 3.657143-0.950857 3.657143-0.950858 3.730286-0.950857a49.737143 49.737143 0 0 0 37.961143-49.737143c-1.462857-10.24-1.462857-8.777143-2.925715-19.017142z" fill="#3B6FF4"></path>
</svg>
</div>
</div>
</div>
</div>
</div>
@@ -170,7 +176,6 @@ import { getMessagesToAdmin } from "@/api/aitutor/chat";
import { listGrade } from "@/api/stuCQS/basedata/grade";
import { getDeptName } from "@/api/system/dept";
import { marked } from 'marked';
export default {
name: "ChatHistory",
dicts: ['srs_stu_status'],
@@ -412,7 +417,8 @@ export default {
};
return marked(content, { renderer });
}
},
}
};
</script>
@@ -874,4 +880,41 @@ export default {
.el-divider--horizontal {
margin: 16px 0;
}
/* AI消息容器样式 */
.ai-message-container {
position: relative;
}
/* 反馈图标样式 */
.feedback-icon {
position: absolute;
bottom: 8px;
right: 8px;
z-index: 10;
}
.feedback-like-icon {
width: 16px;
height: 16px;
opacity: 0.8;
transition: all 0.3s ease;
}
.feedback-like-icon:hover {
opacity: 1;
transform: scale(1.1);
}
.feedback-dislike-icon {
width: 16px;
height: 16px;
opacity: 0.8;
transition: all 0.3s ease;
}
.feedback-dislike-icon:hover {
opacity: 1;
transform: scale(1.1);
}
</style>