调整了页面命名和组织

2026-05-27 15:33:11 +08:00
parent afc0e4d2e2
commit a93a75b3c6
24 changed files with 16 additions and 16 deletions
--- a/pages/ai/aichat.wxss
+++ b/pages/ai/aichat.wxss
@@ -0,0 +1,278 @@
+.chat-container {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  background-color: #F5F5F5;
+  position: relative;
+}
+
+/* 清空按钮 */
+.clear-btn {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 6rpx;
+  padding: 12rpx 24rpx;
+  background-color: #FFFFFF;
+  border-top: 1rpx solid #EEEEEE;
+}
+
+.clear-btn:active {
+  opacity: 0.7;
+}
+
+.clear-text {
+  font-size: 22rpx;
+  color: #999999;
+}
+
+/* 消息列表区域 */
+.message-list {
+  flex: 1;
+  padding: 20rpx 0;
+}
+
+.message-list.has-messages {
+  padding-top: 20rpx;
+}
+
+/* 欢迎区域 */
+.welcome-area {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 80rpx 40rpx;
+  text-align: center;
+}
+
+.welcome-icon {
+  width: 160rpx;
+  height: 160rpx;
+  border-radius: 50%;
+  background: linear-gradient(135deg, #FF9B33 0%, #FF7A33 100%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 40rpx;
+  box-shadow: 0 8rpx 32rpx rgba(255, 155, 51, 0.3);
+}
+
+.welcome-title {
+  font-size: 40rpx;
+  font-weight: 600;
+  color: #333333;
+  margin-bottom: 16rpx;
+}
+
+.welcome-desc {
+  font-size: 28rpx;
+  color: #999999;
+  margin-bottom: 60rpx;
+  line-height: 1.6;
+}
+
+.quick-questions {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 20rpx;
+}
+
+.quick-item {
+  background-color: #FFFFFF;
+  padding: 28rpx 32rpx;
+  border-radius: 16rpx;
+  font-size: 28rpx;
+  color: #333333;
+  text-align: left;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
+  transition: all 0.2s ease;
+}
+
+.quick-item:active {
+  transform: scale(0.98);
+  background-color: #FFF8F0;
+}
+
+/* 消息项 */
+.message-item {
+  display: flex;
+  padding: 16rpx 24rpx;
+  align-items: flex-start;
+}
+
+.message-item.ai {
+  justify-content: flex-start;
+}
+
+.message-item.user {
+  justify-content: flex-end;
+}
+
+/* 头像 */
+.avatar {
+  width: 72rpx;
+  height: 72rpx;
+  border-radius: 40%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.ai-avatar {
+  background: linear-gradient(135deg, #FF9B33 0%, #FF7A33 100%);
+  margin-right: 16rpx;
+  padding: 16rpx;
+  width: 46rpx;
+  height: 46rpx;
+}
+
+.user-avatar {
+  background: linear-gradient(135deg, #4CAF50 0%, #45A049 100%);
+  margin-left: 16rpx;
+}
+
+/* 消息内容 */
+.message-content {
+  display: flex;
+  flex-direction: column;
+  max-width: 70%;
+}
+
+.message-item.user .message-content {
+  align-items: flex-end;
+}
+
+.message-item.ai .message-content {
+  align-items: flex-start;
+}
+
+/* 消息气泡 */
+.message-bubble {
+  padding: 20rpx 24rpx;
+  border-radius: 16rpx;
+  word-wrap: break-word;
+  word-break: break-all;
+}
+
+.message-item.ai .message-bubble {
+  background-color: #FFFFFF;
+  border-top-left-radius: 4rpx;
+}
+
+.message-item.user .message-bubble {
+  background: linear-gradient(135deg, #FF9B33 0%, #FF7A33 100%);
+  border-top-right-radius: 4rpx;
+}
+
+.message-text {
+  font-size: 28rpx;
+  line-height: 1.6;
+}
+
+.message-item.ai .message-text {
+  color: #333333;
+}
+
+.message-item.user .message-text {
+  color: #FFFFFF;
+}
+
+.message-image {
+  max-width: 400rpx;
+  border-radius: 8rpx;
+}
+
+.message-time {
+  font-size: 20rpx;
+  color: #999999;
+  margin-top: 8rpx;
+}
+
+/* 正在输入指示器 */
+.typing-bubble {
+  padding: 24rpx 32rpx;
+}
+
+.typing-indicator {
+  display: flex;
+  align-items: center;
+  gap: 12rpx;
+}
+
+.dot {
+  width: 16rpx;
+  height: 16rpx;
+  border-radius: 50%;
+  background-color: #CCCCCC;
+  animation: typing 1.4s infinite ease-in-out both;
+}
+
+.dot:nth-child(1) {
+  animation-delay: -0.32s;
+}
+
+.dot:nth-child(2) {
+  animation-delay: -0.16s;
+}
+
+@keyframes typing {
+  0%, 80%, 100% {
+    transform: scale(0.6);
+    opacity: 0.5;
+  }
+  40% {
+    transform: scale(1);
+    opacity: 1;
+  }
+}
+
+/* 输入区域 */
+.input-area {
+  background-color: #FFFFFF;
+  padding: 20rpx 24rpx;
+  padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
+  border-top: 1rpx solid #EEEEEE;
+}
+
+.input-wrapper {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+}
+
+.message-input {
+  flex: 1;
+  height: 72rpx;
+  background-color: #F5F5F5;
+  border-radius: 16rpx;
+  padding: 0 28rpx;
+  font-size: 28rpx;
+  color: #333333;
+}
+
+.input-placeholder {
+  color: #AAAAAA;
+}
+
+.input-actions {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+}
+
+.action-btn {
+  width: 72rpx;
+  height: 72rpx;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #F5F5F5;
+  transition: all 0.2s ease;
+}
+
+.send-btn.active {
+  background: linear-gradient(135deg, #FF9B33 0%, #FF7A33 100%);
+}