136 lines
4.6 KiB
Plaintext
136 lines
4.6 KiB
Plaintext
<!-- 聊天页面 -->
|
||
<view class="chat-container">
|
||
<!-- 消息列表 -->
|
||
<scroll-view
|
||
class="message-list"
|
||
scroll-y="{{true}}"
|
||
scroll-into-view="{{lastMessageId}}"
|
||
enable-back-to-top="{{true}}"
|
||
bindscrolltolower="loadMoreHistory"
|
||
>
|
||
<!-- 系统消息 -->
|
||
<view wx:if="{{messages.length === 0}}" class="empty-message">
|
||
<text class="empty-text">开始与智控未来的对话吧</text>
|
||
</view>
|
||
|
||
<!-- 历史消息提示 -->
|
||
<view wx:if="{{showHistoryTip}}" class="history-tip">
|
||
<text>已加载历史消息</text>
|
||
</view>
|
||
|
||
<!-- 消息项 -->
|
||
<view
|
||
wx:for="{{messages}}"
|
||
wx:key="id"
|
||
id="{{item.id}}"
|
||
class="message-item {{item.isMe ? 'message-right' : 'message-left'}}"
|
||
bindlongpress="onMessageLongPress"
|
||
data-message-id="{{item.id}}"
|
||
>
|
||
<view class="message-avatar">
|
||
<image src="{{item.avatar}}" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="message-content">
|
||
<view wx:if="{{!item.isMe && item.nickname}}" class="message-header">
|
||
<text class="message-nickname">{{item.nickname}}</text>
|
||
</view>
|
||
<view class="message-body">
|
||
<!-- 文本消息 -->
|
||
<view wx:if="{{item.type === 'text' || item.type === 'richText'}}" class="message-text-container">
|
||
<rich-text wx:if="{{item.type === 'richText'}}" nodes="{{item.content}}"></rich-text>
|
||
<text wx:else class="message-text">{{item.content}}</text>
|
||
</view>
|
||
|
||
<!-- 图片消息 -->
|
||
<image wx:if="{{item.type === 'image'}}" class="message-image" src="{{item.content}}" mode="widthFix" bindtap="previewImage" data-url="{{item.content}}"></image>
|
||
|
||
<!-- 代码块 -->
|
||
<view wx:if="{{item.type === 'code'}}" class="message-code">
|
||
<view class="code-header">
|
||
<text class="code-language">{{item.language || '代码'}}</text>
|
||
<button class="copy-btn" bindtap="copyCode" data-content="{{item.content}}">
|
||
<text class="copy-icon">📋</text>
|
||
<text class="copy-text">复制</text>
|
||
</button>
|
||
</view>
|
||
<view class="code-body">
|
||
<text class="code-text">{{item.content}}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 按钮卡片 -->
|
||
<view wx:if="{{item.type === 'buttonCard'}}" class="message-button-card">
|
||
<view class="card-title">{{item.title}}</view>
|
||
<view class="card-buttons">
|
||
<button
|
||
wx:for="{{item.buttons}}"
|
||
wx:key="id"
|
||
class="card-button"
|
||
bindtap="onCardButtonTap"
|
||
data-action="{{item.buttons[index].action}}"
|
||
>
|
||
{{item.buttons[index].text}}
|
||
</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="message-footer">
|
||
<text class="message-time">{{item.time}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 加载中动画 -->
|
||
<view wx:if="{{isTyping}}" class="typing-container">
|
||
<view class="message-item message-left">
|
||
<view class="message-avatar">
|
||
<image src="/assets/images/ai-avatar.png" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="message-content">
|
||
<view class="message-body">
|
||
<view class="typing-indicator">
|
||
<view class="typing-dot"></view>
|
||
<view class="typing-dot"></view>
|
||
<view class="typing-dot"></view>
|
||
</view>
|
||
<text class="typing-text">正在输入...</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
|
||
<!-- 输入区域(tab-bar 聊天模式时由 tab-bar 接管,此处隐藏) -->
|
||
<view class="input-container" wx:if="{{false}}">
|
||
<view class="input-wrapper">
|
||
<input
|
||
class="message-input"
|
||
placeholder="请输入消息..."
|
||
value="{{inputValue}}"
|
||
bindinput="onInputChange"
|
||
bindconfirm="sendMessage"
|
||
confirm-type="send"
|
||
adjust-position="{{true}}"
|
||
maxlength="2000"
|
||
/>
|
||
<button
|
||
class="send-btn"
|
||
bindtap="sendMessage"
|
||
disabled="{{!inputValue.trim()}}"
|
||
loading="{{sending}}"
|
||
>
|
||
发送
|
||
</button>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 授权提示组件 -->
|
||
<auth-prompt
|
||
show="{{showAuthPrompt}}"
|
||
auth-type="{{authType}}"
|
||
bind:authSuccess="onAuthSuccess"
|
||
bind:authFail="onAuthFail"
|
||
bind:authCancel="onAuthCancel"
|
||
bind:settingsOpen="onSettingsOpen"
|
||
/>
|
||
</view> |