study/uTools-quickcommand
1
0
Fork 0
mirror of https://github.com/fofolee/uTools-quickcommand.git synced 2025-06-09 06:54:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

ai组手添加是否渲染md为html选项

Browse Source
This commit is contained in:
fofolee 2025-03-15 11:23:58 +08:00
parent 04b08be60b
commit a27e928cc4
2 changed files with 49 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/components/ai/AIAssistantSideBar.vue
View File

@ -19,6 +19,7 @@
<AIChatHistory <AIChatHistory
:messages="chatHistory" :messages="chatHistory"
@update-code="(...event) => $emit('update-code', ...event)" @update-code="(...event) => $emit('update-code', ...event)"
:render-md="renderMd"
/> />
<!-- 输入区域 --> <!-- 输入区域 -->
@ -38,8 +39,18 @@
</div> </div>
<div class="row items-center justify-between q-gutter-x-xs"> <div class="row items-center justify-between q-gutter-x-xs">
<div class="row items-center q-gutter-x-xs"> <div class="row items-center q-gutter-x-xs">
<q-btn flat dense size="sm" icon="clear_all" @click="clearHistory"> <q-btn
<q-tooltip>清空对话</q-tooltip> flat
dense
size="sm"
icon="html"
:color="renderMd ? 'primary' : 'grey'"
@click="renderMd = !renderMd"
>
<q-tooltip>
是否渲染md为html<br />
状态：{{ renderMd ? "已开启" : "已关闭" }}
</q-tooltip>
</q-btn> </q-btn>
<q-btn <q-btn
flat flat
@ -87,6 +98,10 @@
</q-tooltip> </q-tooltip>
</q-btn> </q-btn>
</div> </div>
<div class="row items-center q-gutter-x-xs">
<q-btn flat dense size="sm" icon="clear_all" @click="clearHistory">
<q-tooltip>清空对话</q-tooltip>
</q-btn>
<q-btn <q-btn
flat flat
dense dense
@ -103,6 +118,7 @@
</q-btn> </q-btn>
</div> </div>
</div> </div>
</div>
</q-card> </q-card>
</template> </template>
@ -144,6 +160,7 @@ export default defineComponent({
autoUpdateCode: localStorage.getItem("ai_auto_update") !== "false", autoUpdateCode: localStorage.getItem("ai_auto_update") !== "false",
sendCode: false, sendCode: false,
submitDocs: true, submitDocs: true,
renderMd: true,
}; };
}, },
props: { props: {

20
src/components/ai/AIChatHistory.vue
View File

@ -18,13 +18,18 @@
<div :class="['chat-message', message.role]"> <div :class="['chat-message', message.role]">
<div class="message-bubble"> <div class="message-bubble">
<div <div
v-if="message.role === 'assistant'" v-if="message.role === 'assistant' && renderMd"
class="message-content markdown" class="message-content markdown"
v-html="getAssistantMsg(message.content)" v-html="getAssistantMsg(message.content)"
/> />
<div
v-else-if="message.role === 'assistant' && !renderMd"
class="message-content pre-text"
v-text="message.content"
/>
<div <div
v-else v-else
class="message-content" class="message-content pre-text"
v-text="getUserMsg(message.content)" v-text="getUserMsg(message.content)"
/> />
</div> </div>
@ -45,6 +50,10 @@ export default defineComponent({
type: Array, type: Array,
default: () => [], default: () => [],
}, },
renderMd: {
type: Boolean,
default: true,
},
}, },
emits: ["update-code"], emits: ["update-code"],
data() { data() {
@ -199,8 +208,6 @@ export default defineComponent({
.chat-message.user .message-bubble { .chat-message.user .message-bubble {
color: var(--q-primary); color: var(--q-primary);
word-break: break-all;
white-space: pre-wrap;
} }
.message-content { .message-content {
@ -208,6 +215,11 @@ export default defineComponent({
line-height: 1.5; line-height: 1.5;
} }
.message-content.pre-text {
word-break: break-all;
white-space: pre-wrap;
}
/* 代码块样式优化 */ /* 代码块样式优化 */
.message-content :deep(pre) { .message-content :deep(pre) {
margin: 4px 0; margin: 4px 0;