temp

src/pages/ai.vue

@@ -3,7 +3,7 @@ import { onMounted, ref } from 'vue'
 
 const userMessage = ref('')
 const messages = ref([
-  { sender: 'ai', text: 'Welcome! How can I assist you today?' },
+  { sender: 'ai', text: '欢迎！请问有什么可以帮助您的吗？' },
 ])
 
 function sendMessage() {
@@ -12,42 +12,62 @@ function sendMessage() {
 
   messages.value.push({ sender: 'user', text: userMessage.value })
 
-  // Simulate AI response (for example purposes)
+  // AI 统一回复（中文套话）
   setTimeout(() => {
     messages.value.push({
       sender: 'ai',
-      text: `I'm here to assist with your questions: "${userMessage.value}"`,
+      text: '感谢您的提问！我们会尽力为您提供帮助。',
     })
   }, 1000)
 
   userMessage.value = ''
 }
+const safeAreaTop = ref(44)
+onShow(() => {
+  uni.getSystemInfo({
+    success: (res) => {
+      if (res.safeArea && res.safeArea.top) {
+        safeAreaTop.value = res.safeArea.top // 设置安全区顶部距离
+      }
+    },
+  })
+})
 </script>
 
 <template>
-  <view class="chat-page mx-4 flex flex-col rounded-xl shadow-lg">
-    <view class="chat-window flex-1 overflow-auto border p-4">
-      <view v-for="(message, index) in messages" :key="index" class="mb-2">
-        <view
-          v-if="message.sender === 'ai'"
-          class="inline-block max-w-max rounded-xl bg-white p-2 text-left text-green-600 font-medium shadow-md"
-        >
-          <span>AI:</span> {{ message.text }}
-        </view>
-        <view
-          v-else
-          class="ml-auto inline-block max-w-max rounded-xl from-purple-400 via-pink-500 to-red-500 bg-gradient-to-r p-2 text-right text-white font-medium shadow-md"
-        >
-          <span>User:</span> {{ message.text }}
+  <view class="box-border min-h-screen from-blue-100 to-white bg-gradient-to-b" style="paddingTop:44px">
+    <view class="chat-page mx-4 flex flex-col rounded-xl shadow-lg">
+      <view class="chat-window flex-1 overflow-auto border p-4">
+        <view v-for="(message, index) in messages" :key="index" class="mb-2">
+          <view
+            v-if="message.sender === 'ai'"
+            class="inline-block max-w-max rounded-xl bg-white p-2 text-left text-green-600 font-medium shadow-md"
+          >
+            {{ message.text }}
+          </view>
+          <view
+            v-else
+            class="ml-auto inline-block max-w-max rounded-xl from-sky-300 via-sky-300 to-sky-300 bg-gradient-to-r p-2 text-right text-white font-medium shadow-md"
+          >
+            {{ message.text }}
+          </view>
         </view>
       </view>
+      <view class="input-area mx-2 flex items-center gap-2 p-4">
+        <wd-input v-model="userMessage" placeholder="请输入您的问题..." class="flex-1" size="large" />
+        <wd-button custom-class="shadow" type="primary" @click="sendMessage">
+          发送
+        </wd-button>
+      </view>
     </view>
-    <view class="input-area mx-2 flex items-center gap-2 p-4">
-      <wd-input v-model="userMessage" placeholder="Type your message..." class="flex-1" size="large" />
-      <wd-button custom-class="shadow" type="primary" @click="sendMessage">
-        发送
-      </wd-button>
-    </view>
+  </view>
+  <view class="disclaimer">
+    <a href="https://beian.miit.gov.cn">
+      备案号：琼ICP备2024038584号-2
+    </a>
+    <div>
+      海南省学宇思网络科技有限公司版权所有
+    </div>
   </view>
 </template>
 
@@ -62,16 +82,6 @@ function sendMessage() {
   // #endif
 
 }
-
-// .chat-window {
-//   flex-grow: 1;
-//   overflow-y: auto;
-//   overflow-x: hidden;
-// }
-
-// .input-area {
-//   flex-shrink: 0;
-// }
 </style>
 
 <route lang="json">