diff --git a/pages_tool/ai-chat/ai-chat-message.vue b/pages_tool/ai-chat/ai-chat-message.vue index 7730b65..df83164 100644 --- a/pages_tool/ai-chat/ai-chat-message.vue +++ b/pages_tool/ai-chat/ai-chat-message.vue @@ -188,14 +188,6 @@ - - - - diff --git a/pages_tool/ai-chat/index.vue b/pages_tool/ai-chat/index.vue index 76900e0..e3b65fc 100644 --- a/pages_tool/ai-chat/index.vue +++ b/pages_tool/ai-chat/index.vue @@ -44,6 +44,41 @@ @product-view="onProductView" @input-change="onInputChange" /> + + + + + + + 设置 + + ✕ + + + + + + 📷 + + + 更换头像 + 自定义您的聊天头像 + + › + + + + ✏️ + + + 更换昵称 + 自定义您的昵称 + + › + + + + @@ -81,6 +116,7 @@ export default { showCustomNavbar: true, // 是否显示自定义导航栏 showBackButton: false, // 是否显示返回按钮 showMenuButton: true, // 是否显示设置菜单按钮 + showSettingsPanel: false, // 是否显示设置面板 // --- 聊天内容区域 --- scrollViewHeight: '0px', @@ -330,9 +366,21 @@ export default { }, showSettings() { - uni.navigateTo({ - url: '/pages/settings/index' - }); + this.showSettingsPanel = true; + }, + + hideSettings() { + this.showSettingsPanel = false; + }, + + openAvatarSelector() { + this.hideSettings(); + this.$refs.chat.openAvatarSelector(); + }, + + openNicknameEditor() { + this.hideSettings(); + this.$refs.chat.openNicknameEditor(); }, showHelp() { @@ -611,4 +659,128 @@ export default { width: 100%; background-color: transparent; } + +/* 设置面板 */ +.settings-popup { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: 1000; + + .settings-mask { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-color: rgba(0, 0, 0, 0.4); + backdrop-filter: blur(6rpx); + } + + .settings-panel { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background-color: #ffffff; + border-radius: 24rpx; + padding: 32rpx; + width: calc(100% - 80rpx); + max-width: 520rpx; + box-shadow: 0 8rpx 36rpx rgba(0, 0, 0, 0.15); + box-sizing: border-box; + + .settings-header { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 24rpx; + border-bottom: 2rpx solid #f0f4f8; + padding-bottom: 16rpx; + + .settings-title { + font-size: 34rpx; + font-weight: 600; + color: #333; + } + + .close-btn { + width: 56rpx; + height: 56rpx; + border-radius: 50%; + background-color: #f8fafc; + display: flex; + align-items: center; + justify-content: center; + font-size: 32rpx; + color: #999; + transition: all 0.2s ease; + + &:hover { + background-color: #e9edf2; + } + } + } + + .settings-content { + display: flex; + flex-direction: column; + gap: 16rpx; + + .setting-item { + display: flex; + align-items: center; + padding: 24rpx; + border-radius: 16rpx; + background-color: #f8fafc; + border: 2rpx solid #f0f4f8; + transition: all 0.2s ease; + + &:hover { + background-color: #e9edf2; + border-color: #d9e3ed; + } + + .setting-icon { + width: 72rpx; + height: 72rpx; + border-radius: 50%; + background-color: #c4e0ff; + display: flex; + align-items: center; + justify-content: center; + font-size: 32rpx; + flex-shrink: 0; + } + + .setting-info { + flex: 1; + margin-left: 20rpx; + display: flex; + flex-direction: column; + gap: 4rpx; + + .setting-label { + font-size: 28rpx; + font-weight: 500; + color: #333; + } + + .setting-desc { + font-size: 22rpx; + color: #999; + } + } + + .iconfont.icon-right { + font-size: 36rpx; + color: #ccc; + flex-shrink: 0; + } + } + } + } +} \ No newline at end of file