67 lines
2.3 KiB
Plaintext
67 lines
2.3 KiB
Plaintext
<view class="chat-container">
|
|
<scroll-view class="message-list" scroll-y scroll-into-view="{{scrollToMessage}}" scroll-with-animation>
|
|
<view class="quick-questions" wx:if="{{messages.length === 0}}">
|
|
<view class="welcome-text">您好，我是您的AI助手，有什么可以帮您？</view>
|
|
<view class="quick-list">
|
|
<view class="quick-item" wx:for="{{quickQuestions}}" wx:key="*this" data-question="{{item}}" bindtap="onQuickQuestionTap">
|
|
{{item}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="message-item {{item.type}}" wx:for="{{messages}}" wx:key="id" id="msg-{{item.id}}">
|
|
<view class="avatar {{item.type}}-avatar">
|
|
<text class="avatar-text">{{item.type === 'user' ? '我' : 'AI'}}</text>
|
|
</view>
|
|
<view class="message-content">
|
|
<view class="message-bubble {{item.type}}-bubble">
|
|
<t-chat-markdown
|
|
wx:if="{{item.contentType === 'text' && item.type === 'ai'}}"
|
|
class="message-markdown"
|
|
content="{{item.content}}"
|
|
/>
|
|
<text class="message-text" wx:elif="{{item.contentType === 'text'}}">{{item.content}}</text>
|
|
</view>
|
|
<text class="message-time" wx:if="{{item.time}}">{{item.time}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="typing-indicator" wx:if="{{isTyping}}">
|
|
<view class="avatar ai-avatar">
|
|
<text class="avatar-text">AI</text>
|
|
</view>
|
|
<view class="typing-bubble">
|
|
<view class="dot"></view>
|
|
<view class="dot"></view>
|
|
<view class="dot"></view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
|
|
<view class="chat-footer">
|
|
<view class="chat-toolbar" wx:if="{{messages.length > 0}}">
|
|
<view class="chat-toolbar-action" bindtap="clearChat">
|
|
<text>清空记录</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="input-area">
|
|
<input
|
|
class="chat-input"
|
|
type="text"
|
|
placeholder="请输入您的问题..."
|
|
value="{{inputValue}}"
|
|
bindinput="onInputChange"
|
|
confirm-type="send"
|
|
bindconfirm="sendMessage"
|
|
adjust-position="{{true}}"
|
|
cursor-spacing="20"
|
|
hold-keyboard="{{true}}"
|
|
/>
|
|
<view class="send-btn {{canSend ? 'active' : ''}}" bindtap="sendMessage">
|
|
<text class="send-text">发送</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|