Преглед изворни кода

家长课堂加入登出功能那妞
登录页加入重定向为家长课堂的登录页

liyanbo пре 2 месеци
родитељ
комит
a8139c0e25
2 измењених фајлова са 37 додато и 10 уклоњено
  1. 1 3
      src/views/Login-Mobile.vue
  2. 36 7
      src/views/ParentMobile/ParentMobileCourse.vue

+ 1 - 3
src/views/Login-Mobile.vue

@@ -192,10 +192,8 @@ onMounted(() => {
 
 
   // 原有逻辑:清理登录页的 query 参数,保持登录页干净
   // 原有逻辑:清理登录页的 query 参数,保持登录页干净
   if (Object.keys(query).length > 0) {
   if (Object.keys(query).length > 0) {
-    router.replace(homeRoutes.login)
+    router.replace("/login-mobile")
   }
   }
-
-
   // 获取路由参数中的重定向路径
   // 获取路由参数中的重定向路径
   // 优先使用查询参数,如果没有则使用路由元数据中的默认值
   // 优先使用查询参数,如果没有则使用路由元数据中的默认值
   const currentRoute = router.currentRoute.value;
   const currentRoute = router.currentRoute.value;

+ 36 - 7
src/views/ParentMobile/ParentMobileCourse.vue

@@ -4,8 +4,18 @@
     <!-- 页面标题和返回按钮 -->
     <!-- 页面标题和返回按钮 -->
     <div class="page-header">
     <div class="page-header">
       <h1 class="page-title">家长课堂</h1>
       <h1 class="page-title">家长课堂</h1>
+      <!-- 移动端右上角退出登录按钮 -->
+      <el-button
+          v-if="isMobile"
+          class="logout-btn"
+          type="text"
+          icon="SwitchButton"
+          @click="handleLogout"
+      >
+        退出登录
+      </el-button>
     </div>
     </div>
-    
+
     <!-- 搜索框 -->
     <!-- 搜索框 -->
     <div class="search-section">
     <div class="search-section">
       <el-autocomplete
       <el-autocomplete
@@ -87,9 +97,9 @@
 import { ref, onMounted } from 'vue'
 import { ref, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
 import { useRouter } from 'vue-router'
 import { ClassList, ClassOutline } from '@/api/class.js'
 import { ClassList, ClassOutline } from '@/api/class.js'
-import { Search, ArrowLeftBold } from '@element-plus/icons-vue'
+import { Search, ArrowLeftBold, SwitchButton } from '@element-plus/icons-vue'
 import { Message } from '@/utils/message/Message.js'
 import { Message } from '@/utils/message/Message.js'
-import { CONFIG } from '@/utils/roleUtils.js'
+import {logoutLogic} from '@/utils/loginUtils.js'
 import '@/styles/parentMobileCourse.css'
 import '@/styles/parentMobileCourse.css'
 
 
 const router = useRouter()
 const router = useRouter()
@@ -114,6 +124,12 @@ const checkIsMobile = () => {
   return false;
   return false;
 }
 }
 
 
+// 退出登录方法
+const handleLogout = async () => {
+  // 获取用户登录的页面路径
+  await logoutLogic(router, "/login-mobile")
+}
+
 // 获取家长课堂-手机端数据
 // 获取家长课堂-手机端数据
 const fetchParentMobileCourseData = async () => {
 const fetchParentMobileCourseData = async () => {
   try {
   try {
@@ -121,11 +137,11 @@ const fetchParentMobileCourseData = async () => {
     const classResponse = await ClassList()
     const classResponse = await ClassList()
     if (classResponse.code === 0) {
     if (classResponse.code === 0) {
       const classData = classResponse.data
       const classData = classResponse.data
-      
+
       // 获取到数据,优先从localStorage读取选中值
       // 获取到数据,优先从localStorage读取选中值
       const savedGrade = localStorage.getItem('selectedGrade')
       const savedGrade = localStorage.getItem('selectedGrade')
       const selectedGrade = savedGrade || (classData.length > 0 ? classData[0].ctType : '')
       const selectedGrade = savedGrade || (classData.length > 0 ? classData[0].ctType : '')
-      
+
       // 查找对应的年级ID
       // 查找对应的年级ID
       const selectedItem = classData.find(item => item.ctType === selectedGrade) || classData[0]
       const selectedItem = classData.find(item => item.ctType === selectedGrade) || classData[0]
       if (selectedItem) {
       if (selectedItem) {
@@ -183,7 +199,7 @@ const goToParentMobileCourse = (outlineData) => {
 onMounted(() => {
 onMounted(() => {
   // 检测是否为移动设备
   // 检测是否为移动设备
   isMobile.value = checkIsMobile();
   isMobile.value = checkIsMobile();
-  
+
   // 获取家长课堂-手机端数据
   // 获取家长课堂-手机端数据
   fetchParentMobileCourseData()
   fetchParentMobileCourseData()
 })
 })
@@ -216,10 +232,23 @@ onMounted(() => {
 }
 }
 
 
 .page-header {
 .page-header {
+  display: flex;
   align-items: center;
   align-items: center;
+  justify-content: center;
+  position: relative;
   margin-bottom: rpx(30);
   margin-bottom: rpx(30);
   padding: rpx(20);
   padding: rpx(20);
   border-bottom: 1px solid #dcdcff;
   border-bottom: 1px solid #dcdcff;
+
+  .logout-btn {
+    position: absolute;
+    right: rpx(10);
+    top: 50%;
+    transform: translateY(-50%);
+    font-size: rpx(24);
+    color: #44449c;
+    padding: rpx(8) rpx(12);
+  }
 }
 }
 
 
 .page-title {
 .page-title {
@@ -408,4 +437,4 @@ onMounted(() => {
   color: #999;
   color: #999;
   font-size: rpx(28);
   font-size: rpx(28);
 }
 }
-</style>
+</style>