手机端的下方模型选择使用el-select组件。

src/views/homePage.vue

@@ -95,6 +95,24 @@ const activeIndex = ref(
   parseInt(sessionStorage.getItem("activeIndexAI") || "0")
 );
 
+// 手机端选择器的值，与activeTab保持同步
+const activeTabMobile = ref(activeTab.value);
+
+// 监听activeTab变化，同步到activeTabMobile
+watch(activeTab, (newVal) => {
+  activeTabMobile.value = newVal;
+});
+
+// 手机端选择器变化处理
+const handleMobileTabChange = (value) => {
+  const tabIndexMap = {
+    "AIchat": 0,
+    "AiEmotion": 1,
+    "deepNine": 2
+  };
+  setActiveTab(value, tabIndexMap[value]);
+};
+
 const tabs = computed(() => [
   {
     name: "AIchat",
@@ -1480,6 +1498,8 @@ onUnmounted(() => {
             <!-- <img v-if="isThinking" :src="thinkActive" @click="toggleThink" class="action-btn" />
             <img v-else :src="thinkNoActive" @click="toggleThink" class="action-btn" />
             <img :src="languageBtn" @click="changeLanguage" class="action-btn" /> -->
+            <!-- PC端按钮 -->
+            <template v-if="!isMobile">
               <!-- 夺宝奇兵大模型按钮 -->
               <img
                 :src="activeTab === 'AIchat' ? dbqbButton01 : dbqbButton02"
@@ -1505,6 +1525,16 @@ onUnmounted(() => {
                 class="action-btn model-btn"
                 alt="深度九大模型"
               />
+            </template>
+            
+            <!-- 手机端下拉选择 -->
+            <template v-else>
+              <el-select v-model="activeTabMobile" class="mobile-model-select" @change="handleMobileTabChange">
+                <el-option label="夺宝奇兵大模型" value="AIchat" />
+                <el-option label="AI情绪大模型" value="AiEmotion" />
+                <el-option label="深度九大模型" value="deepNine" />
+              </el-select>
+            </template>
             <!-- <img v-if="
               getCurrentAudioStore().isVoiceEnabled &&
               getCurrentAudioStore().isPlaying
@@ -2319,6 +2349,17 @@ body {
   transform: scale(1.1);
 }
 
+/* 手机端模型选择器样式 */
+.mobile-model-select {
+  width: 180px;
+  --el-select-border-color-hover: var(--el-border-color-hover);
+  --el-select-disabled-border: var(--el-disabled-border-color);
+  --el-select-font-size: var(--el-font-size-base);
+  --el-select-close-hover-color: var(--el-text-color-secondary);
+  --el-select-input-focus-border-color: var(--el-color-primary);
+  --el-select-input-font-size: 14px;
+}
+
 .send-btn {
   margin-left: 10px;
   height: 33px !important;