下拉菜单项逻辑

.env

@@ -2,8 +2,8 @@
 VITE_APP_TITLE=AI课程网
 
 # 请求路径
-# VITE_BASE_URL='http://59.110.91.129/admin-api'
-VITE_BASE_URL='http://192.168.110.8:8080/admin-api'
+VITE_BASE_URL='http://59.110.91.129/admin-api'
+# VITE_BASE_URL='http://192.168.110.8:8080/admin-api'
 
 # 默认账户密码
 VITE_APP_DEFAULT_LOGIN_TENANT = 博雅智算

src/components/HomePage.vue

@@ -5,20 +5,19 @@
         <span>京华实验学校</span>
         <div class="dropdown-box">
           <!-- 下拉菜单 -->
-          <el-dropdown v-model="selectedGrade">
+          <el-dropdown v-model="selectedGrade" @command="handleGradeSelect">
             <el-button type="primary">
-              {{ selectedGrade
-              }}<el-icon class="el-icon--right"><ArrowDown /></el-icon>
+              {{ selectedGrade }}
+              <el-icon class="el-icon--right"><ArrowDown /></el-icon>
             </el-button>
             <template #dropdown>
               <el-dropdown-menu class="dropdown-menu">
                 <el-dropdown-item
                   v-for="item in classData"
                   :key="item.id"
-                  :value="item.ctType"
+                  :command="item.ctType"
                   >{{ item.ctType }}</el-dropdown-item
                 >
-                <!-- <el-dropdown-item>小学高年级</el-dropdown-item> -->
               </el-dropdown-menu>
             </template>
           </el-dropdown>
@@ -37,22 +36,28 @@
             round
             class="top-right-btn"
             :class="{ 'is-active': selectedButton === 'AI写作课' }"
-            @click="selectedButton = 'AI通识课'; Message().notifyWarning('演示版未开放此功能！！', true); "
+            @click="
+              ;(selectedButton = 'AI通识课'),
+                Message().notifyWarning('演示版未开放此功能！！', true)
+            "
             >AI写作课</el-button
           >
           <el-button
             round
             class="top-right-btn"
             :class="{ 'is-active': selectedButton === 'AI艺术课' }"
-            @click="selectedButton = 'AI通识课'; Message().notifyWarning('演示版未开放此功能！', true); "
+            @click="
+              ;(selectedButton = 'AI通识课'),
+                Message().notifyWarning('演示版未开放此功能！', true)
+            "
             >AI艺术课</el-button
           >
           <!-- 退出登录 -->
-             <!-- <div class="logout-box"> -->
-            <el-button round class="logout-box-btn" @click="LogoutClick()">
-              <img :src="logoutIcon" alt="Logout" />
-              退出登录
-            </el-button>
+          <!-- <div class="logout-box"> -->
+          <el-button round class="logout-box-btn" @click="LogoutClick()">
+            <img :src="logoutIcon" alt="Logout" />
+            退出登录
+          </el-button>
           <!-- </div> -->
         </div>
       </div>
@@ -99,20 +104,19 @@ import { ClassList } from '@/api/class.js'
 import { ArrowDown, ArrowRightBold } from '@element-plus/icons-vue'
 import { Search, ArrowLeftBold } from '@element-plus/icons-vue'
 
-
 // 导入图片
 import intelligenceImg from '@/assets/images/intelligence.png'
 import roomImg from '@/assets/images/room.png'
 import testImg from '@/assets/images/test.png'
 import studyImg from '@/assets/images/study.png'
 
-// 退出图标
+// 退出登录图标
 import logoutIcon from '@/assets/icon/logout.png'
-import {Message} from "@/utils/message/Message.js";
+import { Message } from '@/utils/message/Message.js'
 
 // 获取当前路由对象
 const router = useRouter()
-// 退出
+// 退出登录
 const LogoutClick = () => {
   // 清空 token 和登录状态
   localStorage.removeItem('token')
@@ -132,11 +136,15 @@ const goToAIGeneralCourse = title => {
 }
 //AI实验室
 const goToAILab = () => {
-  router.push({ path: '/ai-laboratory' })
+  router.push({
+    path: '/ai-laboratory',
+    // 跳转页面携带下拉菜单选中项的值
+    query: { grade: selectedGrade.value }
+  })
 }
 
 // 添加下拉菜单选中项
-const selectedGrade = ref('')
+const selectedGrade = ref(localStorage.getItem('selectedGrade') || '')
 // 获取年级
 const classData = ref([])
 const fetchCtTypes = async () => {
@@ -145,8 +153,9 @@ const fetchCtTypes = async () => {
     if (response.code === 0) {
       classData.value = response.data
       // 获取到数据，将第一个选项的值作为默认选中值
-      if (classData.value.length > 0) {
+      if (classData.value.length > 0 && !selectedGrade.value) {
         selectedGrade.value = classData.value[0].ctType
+        localStorage.setItem('selectedGrade', selectedGrade.value)
       }
     }
   } catch (error) {
@@ -154,25 +163,28 @@ const fetchCtTypes = async () => {
   }
 }
 
+// 监听 selectedGrade 变化，保存到 localStorage
+watch(selectedGrade, (newValue) => {
+  if (newValue) {
+    localStorage.setItem('selectedGrade', newValue)
+  }
+})
+
+// 处理下拉菜单选择
+const handleGradeSelect = (command) => {
+  selectedGrade.value = command
+}
 
 //AI实验室
 const notOpen = () => {
-  Message().notifyWarning(localStorage.getItem('userName') === "aiTest" ? '您的账号并未开放此功能！' : '演示版未开放此功能！', true)
+  Message().notifyWarning(
+    localStorage.getItem('userName') === 'aiTest'
+      ? '您的账号并未开放此功能！'
+      : '演示版未开放此功能！',
+    true
+  )
 }
 
-// 添加 watch 监听 selectedGrade 的变化
-watch(selectedGrade, newValue => {
-  // 根据 id 切换高年级或低年级
-  const selectedItem = classData.value.find(item => item.ctType === newValue)
-  if (selectedItem) {
-    if (selectedItem.id === 3) {
-      selectedGrade.value = '小学高年级'
-    } else if (selectedItem.id === 1) {
-      selectedGrade.value = '小学低年级'
-    }
-  }
-})
-
 onMounted(() => {
   fetchCtTypes()
 })

src/views/AIGeneralCourse.vue

@@ -57,7 +57,7 @@
           </div>
           <div class="dropdown-box">
             <!-- 下拉菜单 -->
-            <el-dropdown v-model="selectedGrade">
+            <el-dropdown v-model="selectedGrade" @command="handleGradeSelect">
               <el-button type="primary">
                 {{ selectedGrade
                 }}<el-icon class="el-icon--right"><arrow-down /></el-icon>
@@ -67,7 +67,7 @@
                   <el-dropdown-item
                     v-for="item in classData"
                     :key="item.id"
-                    :value="item.ctType"
+                    :command="item.ctType"
                     >{{ item.ctType }}</el-dropdown-item
                   >
                   <!-- <el-dropdown-item>小学高年级</el-dropdown-item> -->
@@ -141,6 +141,11 @@ const selectedGrade = ref('')
 
 // 添加抽屉显示状态
 const drawerVisible = ref(true)
+// 处理下拉菜单选择
+const handleGradeSelect = (command) => {
+  selectedGrade.value = command
+}
+
 
 // 添加切换抽屉显示状态的函数
 const toggleDrawer = () => {
@@ -166,25 +171,6 @@ const fetchCtTypes = async () => {
   }
 }
 
-// 添加 watch 监听 selectedGrade 的变化
-watch(selectedGrade, newValue => {
-  // 根据 id 切换高年级或低年级
-  const selectedItem = classData.value.find(item => item.ctType === newValue)
-  if (selectedItem) {
-    if (selectedItem.id === 1) {
-      selectedGrade.value = '小学低年级'
-    } else if (selectedItem.id === 3) {
-      selectedGrade.value = '小学高年级'
-    }
-    // 调用获取教学大纲函数并传入年级id
-    ClassOutline(selectedItem.id).then(res => {
-      if (res.code === 0) {
-        classOutlineData.value = res.data
-      }
-    })
-  }
-})
-
 // 添加获取课程标题
 const getCourseTitle = index => {
   if (

src/views/AILaboratory.vue

@@ -73,7 +73,7 @@
 
 <script setup>
 import { ref, onMounted } from 'vue'
-import { useRouter } from 'vue-router'
+import { useRouter,useRoute } from 'vue-router'
 import {
   Document,
   Menu as IconMenu,
@@ -97,6 +97,7 @@ const toggleDrawer = () => {
   drawerVisible.value = !drawerVisible.value
 }
 const router = useRouter()
+const route = useRoute()
 
 // 返回上一页
 const goBack = () => {
@@ -113,8 +114,10 @@ const peopleList = ref([])
 
 onMounted(async () => {
   try {
+     const grade = route.query.grade || '小学低年级'
+     console.log(grade);
     // 获取小学低年级数据
-    const juniorRes = await teacherList({ category: '小学低年级' })
+    const juniorRes = await teacherList({ category: grade })
     peopleList.value = juniorRes.data.list.map(person => ({
       id: person.id,
       name: person.name,
@@ -140,8 +143,10 @@ const personId10 = ref([])
 const navigateToAI = async (group) => {
   if (group.title === '智能问答') {
     try {
+       const grade = route.query.grade || '小学低年级AI'
+     console.log(grade);
       // 获取小学低年级AI数据
-      const juniorAIRes = await teacherList({ category: '小学低年级AI' })
+      const juniorAIRes = await teacherList({ category: grade })
       const aiPerson = juniorAIRes.data.list.find(person => person.id === 10)
       if (aiPerson) {
         personId10.value = {