fix: :zap: 修复浏览器兼容性问题

src/api/student/index.ts

@@ -4,7 +4,7 @@ import {StudentBoard, StudentList, StudentManage, StudentParams} from "@/api/stu
 
 /**
  * 学生管理
- * //school_id=95&grade_id=35&search=略&page_no=1&page_size=10
+ * //school_id=95&grade_id=35&search=略&page=1&page_size=10
  */
 export function getStudentLists(params: StudentParams): AxiosPromise<StudentManage> {
   return request({

src/api/student/types.ts

@@ -6,7 +6,7 @@ import {TeacherItem} from "@/api/teacher/types";
 export interface StudentParams {
   school_id: number;
   grade_id: number;
-  page_no: number;
+  page: number;
   page_size: number;
   // 学生名称/手机号
   search: string;

src/api/teacher/types.ts

@@ -18,6 +18,7 @@ export interface TeacherList {
 export interface TeacherItem extends TeacherList {
   // 注册时间
   create_time: string;
+  phone: string;
   // 折叠面板使用
   active: number[];
   // 教师的设备

src/api/training/types.ts

@@ -11,7 +11,7 @@ export interface TrainingParams {
   is_formal: number;
   // 学生名称/手机号
   search: string;
-  page_no: number;
+  page: number;
   page_size: number;
 }
 

src/layout/components/Navbar/SchoolSelect.vue

@@ -17,7 +17,6 @@ async function getSchoolData() {
       schoolData.value = data;
       if (userStore.schoolId == 0) {
         schoolId.value = data[0].school_id;
-        //schoolNum.value = data[0].num;
         userStore.changeSchool(schoolId.value, data[0].num);
       }
     })
@@ -42,15 +41,15 @@ onMounted(() => {
 <template>
   <!-- 学校选择下拉框 -->
   <div class="nav-select">
-    <template v-if="(schoolData?.length || 0) > 1">
-      <el-select v-model="schoolId" size="large" placeholder="请选择学校" @change="changeMySchool()">
-        <el-option v-for="item in schoolData" :key="item.school_id" :label="item.name" :value="item.school_id" />
-      </el-select>
-    </template>
-    <template v-else>
-      <span class="single">{{ schoolData?.[0].name }}</span>
-    </template>
-    <span class="school">学校编码：{{ userStore.schoolNum }}</span>
+    <!--    <template v-if="(schoolData?.length || 0) > 1">-->
+    <el-select v-model="schoolId" size="large" placeholder="请选择学校" @change="changeMySchool()">
+      <el-option v-for="item in schoolData" :key="item.school_id" :label="item.name" :value="item.school_id" />
+    </el-select>
+    <!--    </template>-->
+    <!--    <template v-else>-->
+    <!--      <span class="single">{{ schoolData?.[0].name }}</span>-->
+    <!--    </template>-->
+    <span class="school">学校编码：{{ userStore?.schoolNum }}</span>
   </div>
 </template>
 <style scoped lang="scss">

src/views/dashboard/components/DataCard.vue

@@ -95,13 +95,15 @@ watchEffect(() => {
   </el-row>
 </template>
 <style lang="scss" scoped>
-@media only screen and (width >= 768px) {
-  .el-col-5 {
-    display: block;
-    flex: 0 0 20%;
-    min-width: 285px;
-    max-width: 20%;
-  }
+.el-col-5 {
+  flex: 0 0 20%;
+  min-width: 285px;
+  max-width: 20%;
+}
+
+.mobile .el-col-5 {
+  flex: 0 0 20.8333%;
+  max-width: 20.8333%;
 }
 
 .data-card {

src/views/dashboard/example.vue

@@ -10,7 +10,7 @@ defineOptions({
     <div class="example">
       <div class="title">
         <img src="../../assets/example/huiwen.png" alt="慧文幼儿园" />
-        <span>示例学校：深圳市福田区惠文幼儿园</span>
+        <span>示例学校：深圳市福田区慧文幼儿园</span>
       </div>
       <div class="content">
         <p>
@@ -80,7 +80,7 @@ defineOptions({
       </div>
       <div class="content">
         <p>
-          学员数量：从2021年秋季学期开始开展水母星球课程，迄今为止，共开展4个学期，每期2个班级，分为大班和中班。每个班级人数8-12人，共约为100人次开展专注力课程教学。次从中随机抽取18人数据进行展示。
+          学员数量：从2021年秋季学期开始开展水母星球课程，迄今为止，共开展4个学期，每期2个班级，分为大班和中班。每个班级人数8-12人，共约为100人次开展专注力课程教学。从中随机抽取18人数据进行展示。
         </p>
         <p>教师配置：2名/班，主教老师由深圳职业技术大学毕业的专业外派教师担任；助教老师由幼儿园本园班主任担任。</p>
         <p>

src/views/grade/index.vue

@@ -124,8 +124,9 @@ onMounted(() => {
         <p v-if="dataStatus == 0">加载中...</p>
         <template v-if="dataStatus == 2">
           <p v-if="gradeType == 0">您的学校还未创建任何班级！</p>
-          <p v-if="gradeType == 1">您的学校还没有任何未结课班级！</p>
-          <p v-if="gradeType == 2">您的学校还没有任何已结课班级！</p>
+          <p v-else>暂无班级记录</p>
+          <!--          <p v-if="gradeType == 1">您的学校还没有任何未结课班级！</p>-->
+          <!--          <p v-if="gradeType == 2">您的学校还没有任何已结课班级！</p>-->
         </template>
       </div>
     </template>

src/views/login/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="login-container">
+  <div :class="classObj" class="login-container">
     <el-form ref="loginFormRef" :model="loginData" :rules="loginRules" class="login-form">
       <div class="title">
         <span>登录</span>
@@ -53,10 +53,17 @@ import {useUserStore} from "@/store/modules/user";
 // API依赖
 import {LocationQuery, LocationQueryValue, useRoute} from "vue-router";
 import {LoginData} from "@/api/auth/types";
+import {useWindowSize} from "@vueuse/core";
+import {computed} from "vue";
 
+const {width} = useWindowSize();
 const userStore = useUserStore();
 const route = useRoute();
 
+const classObj = computed(() => ({
+  pad: width.value >= 768 && width.value < 1080,
+  mobile: width.value < 768,
+}));
 /**
  * 按钮loading
  */
@@ -69,7 +76,7 @@ const passwordVisible = ref(false);
  * 登录表单引用
  */
 const loginFormRef = ref(ElForm);
-const autoLogin = ref(false);
+const autoLogin = ref(!!localStorage.getItem("autoName"));
 const loginData = ref<LoginData>({
   // phone: "18770033942",
   // password: "123456",
@@ -135,8 +142,9 @@ function handleLogin() {
         })
         .catch((error) => {
           console.log("登录", error);
+          //ElMessage.error(error.message || "您输入的账号或密码错误！");
           // 验证失败，重新生成验证码
-          new Error("您输入的密码错误");
+          new Error("您输入的账号或密码错误");
         })
         .finally(() => {
           loading.value = false;
@@ -153,6 +161,7 @@ function handleLogin() {
   height: 100%;
   min-height: 750px;
   padding-top: 260px;
+  padding-left: 660px;
   overflow: hidden;
   background: #eaf7fd url("../../assets/login/login.jpg") no-repeat left top;
   background-size: auto 100%;
@@ -203,27 +212,17 @@ function handleLogin() {
       background: #006eff;
     }
   }
-}
 
-@media only screen and (width >= 1080px) {
-  .login-container {
-    padding-left: 660px;
-  }
-}
-
-@media only screen and (width <= 1080px) {
-  .login-container {
+  &.pad {
     padding: 400px 0;
     background-position: center center;
   }
-}
 
-@media only screen and (width <= 768px) {
-  .login-container {
+  &.mobile {
     box-sizing: border-box;
     width: 750px;
     height: 1080px;
-    padding-top: 420px;
+    padding: 420px 0 0;
     background-size: cover;
 
     .login-form {

src/views/student/index.vue

@@ -36,7 +36,7 @@ const studentSearch: StudentParams = reactive({
   school_id: userStore.schoolId,
   grade_id: 0,
   search: "",
-  page_no: 1,
+  page: 1,
   page_size: 10,
 });
 const dataMessage = ref("加载中...");
@@ -131,7 +131,7 @@ onMounted(() => {
       <pagination
         v-if="studentCount > 0"
         v-model:total="studentCount"
-        v-model:page="studentSearch.page_no"
+        v-model:page="studentSearch.page"
         v-model:limit="studentSearch.page_size"
         @pagination="getStudentSearch()" />
     </div>

src/views/teacher/index.vue

@@ -108,8 +108,9 @@ onMounted(() => {
           <el-collapse-item :name="teacher.id">
             <template #title>
               <div class="title">
-                <span class="blue mr-10">{{ teacher.name }}</span>
-                <span>注册时间：{{ teacher.create_time }}</span>
+                <span class="blue first mr-10">{{ teacher.name }}</span>
+                <span class="mr-10">注册时间：{{ teacher.create_time }}</span>
+                <span>手机号码：{{ teacher.phone }}</span>
                 <span class="blue fr"
                   >负责班级 & 绑定设备
                   <el-icon :class="teacher.active && teacher.active.includes(teacher.id) ? 'is-active' : ''"
@@ -229,6 +230,11 @@ onMounted(() => {
     width: 100%;
     font-size: 18px;
 
+    span.first {
+      display: inline-block;
+      min-width: 4em;
+    }
+
     .blue {
       color: #4284f2;
     }

src/views/training/index.vue

@@ -16,7 +16,7 @@ const pageParams: TrainingParams = reactive({
   school_id: userStore.schoolId,
   is_formal: 1, // 1正式，2非正式
   grade_id: 0,
-  page_no: 1,
+  page: 1,
   page_size: 10,
   // 学生名称/手机号
   search: "",
@@ -51,7 +51,10 @@ async function getTrainingData(schoolId: number) {
       trainingCount.value = count;
       if (!(count && count > 0 && lists.length > 0)) {
         dataMessage.value = "没有符合搜索条件的记录！";
-        if (pageParams.grade_id == 0 && pageParams.is_formal == 0 && pageParams.search == "") {
+        if (pageParams.is_formal == 2 && pageParams.search == "") {
+          dataMessage.value = "还没有任何体验用户训练记录！";
+        }
+        if (pageParams.is_formal == 1 && pageParams.grade_id == 0 && pageParams.search == "") {
           dataMessage.value = "还没有任何学生训练记录！";
         }
       }
@@ -125,7 +128,7 @@ onMounted(() => {
                 >报告详情</router-link
               >
             </template>
-            <button v-else class="table-btn disabled" @click="alertError()">训练效果分析</button>
+            <button v-else class="table-btn disabled" @click="alertError()">报告详情</button>
           </template>
         </el-table-column>
         <!-- 无数据插槽 -->
@@ -140,7 +143,7 @@ onMounted(() => {
     <pagination
       v-if="trainingCount > 0"
       v-model:total="trainingCount"
-      v-model:page="pageParams.page_no"
+      v-model:page="pageParams.page"
       v-model:limit="pageParams.page_size"
       @pagination="getTrainingSearch()" />
   </div>

src/views/training/result.vue

@@ -251,12 +251,12 @@ onMounted(() => {
           </el-col>
           <el-col :xs="24" :span="8">
             <div class="box-card">
-              <div class="tit">专注力稳定度</div>
+              <div class="tit">专注唤醒效率</div>
               <div class="content">
                 <div :class="'star s' + games.stable_content?.star"></div>
                 <p>{{ games.stable_content?.content }}</p>
                 <p class="note">
-                  在专注平均值相同时，第一种是专注值高低错落，跳跃明显。第二种是无限接近平均值，显然此种状态代表专注力更加稳定，操控专注力能力更强；在平均专注值高时，稳定度越高越好。
+                  专注唤醒效率表示当任务来临时，身体感觉器官是否警觉的接收任务信息，是否做好了准备启动专注力应对机制，前额叶皮层是否兴奋，启动专注任务的时长越短，代表唤醒效率越高。
                 </p>
               </div>
             </div>
@@ -264,24 +264,24 @@ onMounted(() => {
 
           <el-col :xs="24" :span="8">
             <div class="box-card">
-              <div class="tit">专注唤醒效率</div>
+              <div class="tit">整体和谐度</div>
               <div class="content">
                 <div :class="'star s' + games.awaken_content?.star"></div>
                 <p>{{ games.awaken_content?.content }}</p>
                 <p class="note">
-                  通过脑电检测技术，将各项脑波数值的AI算法分析得出专注力平均值，反应了大脑专注集中在某件事上的程度。
+                  既专注又紧张，这种状态在考试和上台表演中比较常见，耗能过高不能长期保持；既专注又轻松，此种状态情绪相对稳定，焦虑值更低，提倡长期保持。和谐度记录的是专注值和放松值的同步率，和谐度越高越好。
                 </p>
               </div>
             </div>
           </el-col>
           <el-col :xs="24" :span="8">
             <div class="box-card">
-              <div class="tit">整体和谐度</div>
+              <div class="tit">专注力稳定度</div>
               <div class="content">
                 <div :class="'star s' + games.linemed_content?.star"></div>
                 <p>{{ games.linemed_content?.content }}</p>
                 <p class="note">
-                  既专注又紧张，这种状态在考试和上台表演中比较常见，耗能过高不能长期保持；既专注又轻松，此种状态情绪相对稳定，焦虑值更低，提倡长期保持。和谐度记录的是专注值和放松值的同步率，和谐度越高越好。
+                  在专注平均值相同时，第一种是专注值高低错落，跳跃明显。第二种是无限接近平均值，显然此种状态代表专注力更加稳定，操控专注力能力更强；在平均专注值高时，稳定度越高越好。
                 </p>
               </div>
             </div>
@@ -445,7 +445,7 @@ onMounted(() => {
     }
 
     .content {
-      height: 224px;
+      min-height: 240px;
 
       .star {
         width: 162px;

tsconfig.json

@@ -1,15 +1,15 @@
 {
   "compilerOptions": {
-    "target": "esnext",
+    "target": "es2022",
     "useDefineForClassFields": true,
-    "module": "esnext",
+    "module": "es2022",
     "moduleResolution": "node",
     "strict": true,
     "jsx": "preserve",
     "sourceMap": true,
     "resolveJsonModule": true,
     "esModuleInterop": true,
-    "lib": ["esnext", "dom"],
+    "lib": ["es2022", "dom"],
     "baseUrl": ".",
     "allowJs": true,
     "paths": {