|
@@ -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>
|