feat: 代码调整

This commit is contained in:
2025-07-24 23:59:31 +08:00
parent 17f4f0fb8b
commit 5321b27176
5 changed files with 68 additions and 26 deletions

View File

@@ -1,14 +1,13 @@
<template> <template>
<view class="chat-ai"> <view class="chat-ai">
<!-- <text>{{ text }}</text> --> <ChatMarkdown :text="text"></ChatMarkdown>
<!-- <XMarkdown :markdown="text"/> -->
<ua-markdown :source="text" />
<slot></slot> <slot></slot>
</view> </view>
</template> </template>
<script setup> <script setup>
import { defineProps } from "vue"; import { defineProps } from "vue";
import ChatMarkdown from "./ChatMarkdown.vue";
defineProps({ defineProps({
text: { text: {

View File

@@ -0,0 +1,37 @@
<template>
<view class="chat-other">
<text>{{ text }}</text>
<slot></slot>
</view>
</template>
<script setup>
import { defineProps } from "vue";
defineProps({
text: {
type: String,
default: ''
}
})
</script>
<style lang="scss" scoped>
.chat-other {
display: flex;
justify-content: center;
background-color: white;
margin: 6px 12px;
padding: 8px 24px;
border-radius: 4px;
font-size: 14px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
text {
font-family: PingFang SC, PingFang SC;
font-weight: 400;
font-size: 14px;
color: #333333;
}
}
</style>

View File

@@ -23,19 +23,20 @@
<view class="area-msg-list-content" v-for="item in chatMsgList" :key="item.msgId" :id="item.msgId"> <view class="area-msg-list-content" v-for="item in chatMsgList" :key="item.msgId" :id="item.msgId">
<template v-if="item.msgType === MessageRole.AI"> <template v-if="item.msgType === MessageRole.AI">
<ChatCardAI class="message-item message-item-ai" :text="item.msg"> <ChatCardAI class="message-item-ai" :text="item.msg">
<image v-if="item.msgContent && item.msgContent.type === MessageType.IMAGE" src="/static/logo.png" style="width: 100px;height: 100px;"></image> <image v-if="item.msgContent && item.msgContent.type === MessageType.IMAGE" src="/static/logo.png" style="width: 100px;height: 100px;"></image>
</ChatCardAI> </ChatCardAI>
</template> </template>
<template v-else-if="item.msgType === MessageRole.ME"> <template v-else-if="item.msgType === MessageRole.ME">
<ChatCardMine class="message-item message-item-mine" :text="item.msg"> <ChatCardMine class="message-item-mine" :text="item.msg">
</ChatCardMine> </ChatCardMine>
</template> </template>
<template v-else> <template v-else>
<text class="message-item message-item-other">{{item.msg}}</text> <ChatCardOther class="message-item-other" :text="item.msg"></ChatCardOther>
</template> </template>
</view> </view>
<!-- 底部锚点用于滚动到底部 --> <!-- 底部锚点用于滚动到底部 -->
<view :id="lastMsgId"></view> <view :id="lastMsgId"></view>
</scroll-view> </scroll-view>
@@ -65,6 +66,7 @@
import ChatTopNavBar from './ChatTopNavBar.vue'; import ChatTopNavBar from './ChatTopNavBar.vue';
import ChatCardAI from './ChatCardAI.vue'; import ChatCardAI from './ChatCardAI.vue';
import ChatCardMine from './ChatCardMine.vue'; import ChatCardMine from './ChatCardMine.vue';
import ChatCardOther from './ChatCardOther.vue';
import ChatQuickAccess from './ChatQuickAccess.vue'; import ChatQuickAccess from './ChatQuickAccess.vue';
import ChatMoreTips from './ChatMoreTips.vue'; import ChatMoreTips from './ChatMoreTips.vue';
import ChatInputArea from './ChatInputArea.vue' import ChatInputArea from './ChatInputArea.vue'
@@ -167,10 +169,9 @@
} }
chatMsgList.value.push(newMsg) chatMsgList.value.push(newMsg)
sendChat('酒店一共有哪些温泉?')
console.log("发送的新消息:",JSON.stringify(newMsg)) console.log("发送的新消息:",JSON.stringify(newMsg))
sendChat(text)
} }
const scrollToBottom = () => { const scrollToBottom = () => {

View File

@@ -0,0 +1,19 @@
<template>
<view>
<ua-markdown :source="text" />
</view>
</template>
<script setup>
import { defineProps } from "vue";
defineProps({
text: {
type: String,
default: ''
}
})
</script>
<style>
</style>

View File

@@ -54,33 +54,19 @@
} }
} }
.message-item {
display: flex;
}
.message-item-ai { .message-item-ai {
display: flex;
justify-content: flex-start; justify-content: flex-start;
} }
.message-item-mine { .message-item-mine {
display: flex;
justify-content: flex-end; justify-content: flex-end;
} }
.message-item-other { .message-item-other {
display: flex;
justify-content: center; justify-content: center;
background-color: white;
margin: 6px 12px;
padding: 8px 24px;
border-radius: 4px;
font-size: 14px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
text {
font-family: PingFang SC, PingFang SC;
font-weight: 400;
font-size: 14px;
color: #333333;
}
} }
} }
} }