feat: 注册页面添加注册账户类型信息

src/common-style.scss

@@ -1,7 +1,6 @@
 @import "~@/style/reset.scss";
 @import "~@/style/theme.scss";
 
-
 .title {
   display: flex;
   align-items: center;
@@ -38,6 +37,22 @@
   align-items: center;
 }
 
+.blue {
+  color: $theme-blue;
+}
+
+.red {
+  color: $theme-red;
+}
+
+.orange {
+  color: $theme-orange;
+}
+
+.green {
+  color: $theme-green;
+}
+
 .mb-8 {
   margin-bottom: 8px;
 }
@@ -75,8 +90,8 @@
 }
 
 .mr-2 {
-  margin-right: 2px;
-}
+   margin-right: 2px;
+ }
 
 .mr-4 {
   margin-right: 4px;
@@ -89,3 +104,19 @@
 .mr-16 {
   margin-right: 16px;
 }
+
+.ml-2 {
+  margin-left: 2px;
+}
+
+.ml-4 {
+  margin-left: 4px;
+}
+
+.ml-8 {
+  margin-left: 8px;
+}
+
+.ml-16 {
+  margin-left: 16px;
+}

src/components/Abstract/CardBasic.vue

@@ -0,0 +1,26 @@
+<template>
+  <div class="card-basic">
+    <slot></slot>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'CardBasic'
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/style/theme.scss";
+
+.card-basic {
+  padding: 8px;
+  border-radius: 12px;
+  transition: .2s;
+  cursor: pointer;
+
+  &:hover {
+    background-color: $card-background;
+  }
+}
+</style>

src/components/Abstract/CenterBox.vue

@@ -0,0 +1,32 @@
+<template>
+  <div class="center-box" :class="classList">
+    <slot></slot>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'CenterBox',
+  props: {
+    equalWidth: Boolean
+  },
+  computed: {
+    classList () {
+      return {
+        'equal-width': this.equalWidth
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.center-box {
+  display: flex;
+  align-items: center;
+}
+
+.equal-width {
+  justify-content: space-between;
+}
+</style>

src/components/Basic/CSelect.vue

@@ -1,10 +1,10 @@
 <template>
-  <component class="c-select" :class="value === '' && 'unfilled'" :is="'select'" :value="value" @change="$emit('input', $event.target.value)">
+  <select class="c-select" :class="value === '' && 'unfilled'" :value="value" @change="$emit('input', $event.target.value)">
     <option disabled :selected="value === ''" :value="''">{{disabledDisplay}}</option>
     <option v-for="item in list" :value="item.value" :key="item.value">
       {{ item.display }}
     </option>
-  </component>
+  </select>
 </template>
 
 <script>

src/components/Layouts/Background.vue

@@ -1,97 +0,0 @@
-<template>
-  <div class="background">
-    <div class="sun"></div>
-    <div class="mountain"></div>
-  </div>
-</template>
-
-<script>
-export default {}
-</script>
-
-<style lang="scss" scoped>
-@import "~@/style/theme.scss";
-
-.background {
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  z-index: -1;
-
-  .sun {
-    position: absolute;
-    right: 20vw;
-    top: 10vh;
-    background: $theme-orange;
-    width: 25vmin;
-    height: 25vmin;
-    border-radius: 1000px;
-  }
-
-  .mountain {
-    position: absolute;
-    bottom: 0;
-    left: 15vmax;
-    border-bottom: $theme-blue 30vmin solid;
-    border-right: transparent 30vmin solid;
-    border-top: transparent 30vmin solid;
-    border-left: transparent 30vmin solid;
-
-    &::after {
-      z-index: -1;
-      content: '';
-      display: block;
-      position: absolute;
-      top: -8vmin;
-      left: 8vmin;
-      border-bottom: lighten($theme-blue, 15) 20vmin solid;
-      border-right: transparent 24vmin solid;
-      border-top: transparent 24vmin solid;
-      border-left: transparent 24vmin solid;
-    }
-  }
-
-  @media (min-width: 600px) and (max-width: 1400px){
-    .mountain {
-      transform-origin: bottom;
-      transform: scale(.7);
-      left: 5vmin;
-    }
-    .sun {
-      right: 10vw;
-      top: 5vh;
-    }
-  }
-
-  @media (max-width: 700px) {
-    .mountain {
-      left: 5vmin;
-    }
-    .sun {
-      right: 10vw;
-      top: 5vh;
-    }
-  }
-}
-
-// todo 小屏幕下先完全隐藏
-@media (max-width: 700px) {
-  .mountain {
-    display: none;
-  }
-  .sun {
-    display: none;
-  }
-}
-
-@media (max-height: 700px) {
-  .mountain {
-    display: none;
-  }
-  .sun {
-    display: none;
-  }
-}
-</style>

src/router/main.js

@@ -1,13 +1,13 @@
 export default [{
   path: '/login',
   name: 'login',
-  component: () => import(/* webpackChunkName: "main" */ '../views/login/Login.vue')
+  component: () => import(/* webpackChunkName: "main" */ '@/views/login/Login.vue')
 }, {
   path: '/register',
   name: 'register',
-  component: () => import(/* webpackChunkName: "main" */ '../views/register/Register.vue')
+  component: () => import(/* webpackChunkName: "main" */ '@/views/register/Register.vue')
 }, {
   path: '/forget-password',
   name: 'forget-password',
-  component: () => import(/* webpackChunkName: "main" */ '../views/forget-password/ForgetPassword.vue')
+  component: () => import(/* webpackChunkName: "main" */ '@/views/forget-password/ForgetPassword.vue')
 }]

src/router/pdf.js

@@ -3,6 +3,6 @@ export default [
     meta: { roles: ['teacher', 'student'] },
     path: '/pdf-reader/:slideId',
     name: 'pdf-reader',
-    component: () => import(/* webpackChunkName: "pdf-reader" */ '../views/reader/PdfReader.vue')
+    component: () => import(/* webpackChunkName: "pdf-reader" */ '@/views/reader/PdfReader.vue')
   }
 ]

src/router/quiz.js

@@ -2,46 +2,46 @@ export default [{
   meta: { roles: ['teacher'] },
   path: '/quiz-setting/:slideId/create-quiz',
   name: 'teacher-quiz-create',
-  component: () => import(/* webpackChunkName: "teacher-quiz" */ '../views/quiz/CreateQuiz.vue')
+  component: () => import(/* webpackChunkName: "teacher-quiz" */ '@/views/quiz/CreateQuiz.vue')
 }, {
   meta: { roles: ['teacher'] },
   path: '/quiz-detail/:quizId',
   name: 'quiz-detail',
-  component: () => import(/* webpackChunkName: "teacher-quiz" */ '../views/quiz/QuizDetail.vue')
+  component: () => import(/* webpackChunkName: "teacher-quiz" */ '@/views/quiz/QuizDetail.vue')
 }, {
   meta: { roles: ['teacher'] },
   path: '/quiz-detail/:quizId/edit',
   name: 'edit-quiz',
-  component: () => import(/* webpackChunkName: "teacher-quiz" */ '../views/quiz/EditQuiz.vue')
+  component: () => import(/* webpackChunkName: "teacher-quiz" */ '@/views/quiz/EditQuiz.vue')
 }, {
   meta: { roles: ['teacher'] },
   path: '/questions',
   name: 'questions',
-  component: () => import(/* webpackChunkName: "teacher-quiz" */ '../views/quiz/Questions.vue')
+  component: () => import(/* webpackChunkName: "teacher-quiz" */ '@/views/quiz/Questions.vue')
 }, {
   meta: { roles: ['teacher'] },
   path: '/questions/:questionId',
   name: 'question-detail',
-  component: () => import(/* webpackChunkName: "teacher-quiz" */ '../views/quiz/QuestionDetail.vue')
+  component: () => import(/* webpackChunkName: "teacher-quiz" */ '@/views/quiz/QuestionDetail.vue')
 }, {
   meta: { roles: ['teacher'] },
   path: '/questions/:questionId/edit',
   name: 'edit-question',
-  component: () => import(/* webpackChunkName: "teacher-quiz" */ '../views/quiz/EditQuestion.vue')
+  component: () => import(/* webpackChunkName: "teacher-quiz" */ '@/views/quiz/EditQuestion.vue')
 }, {
   meta: { roles: ['teacher'] },
   path: '/create-question',
   name: 'create-question',
-  component: () => import(/* webpackChunkName: "teacher-quiz" */ '../views/quiz/CreateQuestion.vue')
+  component: () => import(/* webpackChunkName: "teacher-quiz" */ '@/views/quiz/CreateQuestion.vue')
 }, {
   meta: { roles: ['student'] },
   path: '/student/quiz/:quizId/do-quiz',
   name: 'student-do-quiz',
-  component: () => import(/* webpackChunkName: "student" */ '../views/quiz/StudentDoQuiz.vue')
+  component: () => import(/* webpackChunkName: "student" */ '@/views/quiz/StudentDoQuiz.vue')
 }, {
   meta: { roles: ['student'] },
   path: '/student/quiz/:quizId',
   name: 'student-quiz-detail',
-  component: () => import(/* webpackChunkName: "student" */ '../views/student/components/StudentQuizDetail.vue')
+  component: () => import(/* webpackChunkName: "student" */ '@/views/student/components/StudentQuizDetail.vue')
 }
 ]

src/router/student.js

@@ -3,64 +3,64 @@ export default [{
   path: '/student',
   name: 'student',
   redirect: '/student/explore',
-  component: () => import(/* webpackChunkName: "student" */ '../views/student/StudentHome.vue'),
+  component: () => import(/* webpackChunkName: "student" */ '@/views/student/StudentHome.vue'),
   children: [{
     // 学生主页
     path: 'explore',
     name: 'student-explore',
-    component: () => import(/* webpackChunkName: "student" */ '../views/student/tabs/StudentExplore.vue'),
+    component: () => import(/* webpackChunkName: "student" */ '@/views/student/tabs/StudentExplore.vue'),
     children: [{
       // 课程所属的所有课件信息
       path: 'course-slides/:courseId',
       name: 'student-course-slides',
-      component: () => import(/* webpackChunkName: "student" */ '../views/student/components/StudentCourseSlides.vue')
+      component: () => import(/* webpackChunkName: "student" */ '@/views/student/components/StudentCourseSlides.vue')
     }, {
       // 课件信息
       path: 'slide-detail/:slideId',
       name: 'student-explore-slide-detail',
-      component: () => import(/* webpackChunkName: "student" */ '../views/student/components/StudentSlideDetail.vue')
+      component: () => import(/* webpackChunkName: "student" */ '@/views/student/components/StudentSlideDetail.vue')
     }, {
       // 附件信息
       path: 'course-file-detail/:courseFileId',
       name: 'student-explore-course-file-detail',
-      component: () => import(/* webpackChunkName: "student" */ '../views/student/components/StudentCourseFileDetail.vue')
+      component: () => import(/* webpackChunkName: "student" */ '@/views/student/components/StudentCourseFileDetail.vue')
     }, {
       // 课件下的测试详情列表
       meta: { roles: ['student'] },
       path: 'quiz/:slideId',
       name: 'student-quiz-list',
-      component: () => import(/* webpackChunkName: "student-quiz" */ '../views/student/components/QuizView.vue')
+      component: () => import(/* webpackChunkName: "student-quiz" */ '@/views/student/components/QuizView.vue')
     }]
   }, {
     // 学生查看正在进行的和已经结束的所有测验（一个汇总的地方））
     path: 'quiz',
     name: 'student-quiz',
-    component: () => import(/* webpackChunkName: "student" */ '../views/student/tabs/StudentQuiz.vue')
+    component: () => import(/* webpackChunkName: "student" */ '@/views/student/tabs/StudentQuiz.vue')
   }, {
     // 学生课程管理界面
     path: 'courses',
     name: 'student-courses',
-    component: () => import(/* webpackChunkName: "student" */ '../views/student/tabs/StudentCoursesManager.vue'),
+    component: () => import(/* webpackChunkName: "student" */ '@/views/student/tabs/StudentCoursesManager.vue'),
     children: [{
       // 加入课程
       path: 'join-course/:courseId',
       name: 'join-course',
-      component: () => import(/* webpackChunkName: "student" */ '../views/student/components/JoinCourse.vue')
+      component: () => import(/* webpackChunkName: "student" */ '@/views/student/components/JoinCourse.vue')
     }, {
       // 课程详情，在这里可进行退课操作
       path: 'course-detail/:courseId',
       name: 'student-course-detail',
-      component: () => import(/* webpackChunkName: "student" */ '../views/student/components/StudentCourseDetail.vue')
+      component: () => import(/* webpackChunkName: "student" */ '@/views/student/components/StudentCourseDetail.vue')
     }]
   }, {
     // 消息汇总区域
     path: 'discussion',
     name: 'student-discussion',
-    component: () => import(/* webpackChunkName: "student" */ '../views/shared/Discussion.vue')
+    component: () => import(/* webpackChunkName: "student" */ '@/views/shared/Discussion.vue')
   }, {
     // 个人信息区域
     path: 'personal',
     name: 'student-personal',
-    component: () => import(/* webpackChunkName: "student" */ '../views/student/tabs/StudentPersonal.vue')
+    component: () => import(/* webpackChunkName: "student" */ '@/views/student/tabs/StudentPersonal.vue')
   }]
 }]

src/router/teacher.js

@@ -3,69 +3,69 @@ export default [{
   path: '/teacher',
   name: 'teacher',
   redirect: '/teacher/explore',
-  component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/TeacherHome.vue'),
+  component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/TeacherHome.vue'),
   children: [{
     // 教师主页
     path: 'explore',
     name: 'teacher-explore',
-    component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/tabs/TeacherExplore.vue'),
+    component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/tabs/TeacherExplore.vue'),
     children: [{
       // 课程下的的课件列表
       path: 'course-slides/:courseId',
       name: 'teacher-course-slides',
-      component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/components/TeacherCourseSlides.vue')
+      component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/components/TeacherCourseSlides.vue')
     }, {
       // 课件详情
       path: 'slide-detail/:slideId',
       name: 'teacher-explore-slide-detail',
-      component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/components/TeacherSlideDetail.vue')
+      component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/components/TeacherSlideDetail.vue')
     }, {
       // 附件详情
       path: 'course-file-detail/:courseFileId',
       name: 'teacher-explore-course-file-detail',
-      component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/components/TeacherCourseFileDetail.vue')
+      component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/components/TeacherCourseFileDetail.vue')
     }, {
       // 测试详情
       path: '/quiz-setting/:slideId',
       name: 'teacher-quiz-setting',
-      component: () => import(/* webpackChunkName: "teacher-quiz" */ '../views/teacher/components/TeacherQuizSetting.vue')
+      component: () => import(/* webpackChunkName: "teacher-quiz" */ '@/views/teacher/components/TeacherQuizSetting.vue')
     }]
   }, {
     // 教师创建幻灯片
     path: 'create-slide',
     name: 'create-slide',
-    component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/tabs/CreateSlide.vue')
+    component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/tabs/CreateSlide.vue')
   }, {
     // 教师幻灯片管理
     path: 'courses',
     name: 'teacher-courses',
-    component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/tabs/TeacherCoursesManager.vue'),
+    component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/tabs/TeacherCoursesManager.vue'),
     children: [{
       // 创建新课程
       path: 'create-new',
       name: 'create-new-course',
-      component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/components/CreateNewCourse.vue')
+      component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/components/CreateNewCourse.vue')
     }, {
       // 课程详情
       path: 'course-detail/:courseId',
       name: 'teacher-course-detail',
-      component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/components/TeacherCourseDetail.vue')
+      component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/components/TeacherCourseDetail.vue')
     }, {
       // 教师填写公告内容的页面
       meta: { roles: ['teacher'] },
       path: 'teacher-edit-notice/:noticeId/:courseId',
       name: 'teacher-edit-notice',
-      component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/components/EditNotice.vue')
+      component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/components/EditNotice.vue')
     }]
   }, {
     // 教师讨论区页面
     path: 'discussion',
     name: 'teacher-discussion',
-    component: () => import(/* webpackChunkName: "teacher" */ '../views/shared/Discussion.vue')
+    component: () => import(/* webpackChunkName: "teacher" */ '@/views/shared/Discussion.vue')
   }, {
     // 教师个人主页
     path: 'personal',
     name: 'teacher-personal',
-    component: () => import(/* webpackChunkName: "teacher" */ '../views/teacher/tabs/TeacherPersonal.vue')
+    component: () => import(/* webpackChunkName: "teacher" */ '@/views/teacher/tabs/TeacherPersonal.vue')
   }]
 }]

src/server/enums/user-type.js

@@ -1,5 +1,13 @@
-export default {
+export const userType = {
   teacher: 'TEACHER',
   student: 'STUDENT',
   admin: 'ADMIN'
 }
+
+export const userTypeNaming = {
+  [userType.teacher]: '教师',
+  [userType.student]: '学生',
+  [userType.admin]: '管理员'
+}
+
+export default userType

src/server/user.js

@@ -2,16 +2,18 @@ import {
   useUserServer
 } from '@/config/server-info'
 import axios from '@/plugins/axios'
+import userType from '@/server/enums/user-type'
 
-// 注册
-export function register ({ name, email, emailCode, phone, phoneCode, password }) {
+// 注册，默认为注册学生账号
+export function register ({ name, email, emailCode, phone, phoneCode, password, type = userType.student }) {
   const data = {
     name,
     email,
     emailCode,
     phone,
     phoneCode,
-    password
+    password,
+    type
   }
   return axios
     .post(useUserServer('/register'), data)

src/views/Home.vue

@@ -7,16 +7,14 @@
       <c-button @click="handleLogin" standout block theme="blue" class="mb-12">去登录</c-button>
       <c-button block theme="blue" @click="handleRegister">去注册</c-button>
     </div>
-    <background></background>
   </div>
 </template>
 
 <script>
 import CButton from '@/components/Basic/CButton'
-import Background from '@/components/Layouts/Background'
 
 export default {
-  components: { CButton, Background },
+  components: { CButton },
   methods: {
     handleLogin () {
       this.$router.push({ name: 'login' })

src/views/forget-password/ForgetPassword.vue

@@ -36,7 +36,7 @@ export default {
   methods: {
     handleSendEmailCode () {
       this.$setInfoMessage('正在尝试发送验证码')
-      if (this.email.match(/.+@(nju.edu.cn|smail.nju.edu.cn)/)) {
+      if (this.email.match(/.+@.*(edu.cn)/)) {
         this.setEmailCodeCd()
         sendEmailCode({ email: this.email }).then(res => {
           this.$setSuccessMessage('邮箱验证码发送成功')

src/views/login/Login.vue

@@ -5,19 +5,16 @@
       <router-link :to="{name: userInfo.type === 'TEACHER' ? 'teacher' : 'student'}">
         <c-button v-if="userInfo.name" block icon="face" theme="green" class="mb-16">已登录用户：{{userInfo.name}}</c-button>
       </router-link>
-      <c-input placeholder="邮箱" type="email" v-model="email"></c-input>
+      <c-input class="mb-8" placeholder="邮箱" type="email" v-model="email"></c-input>
       <section class="tip mb-24">
-        <div>关于邮箱的说明：</div>
-        <div>1. 邮箱需为南京大学校邮（@nju.edu.cn | @smail.nju.edu.cn）</div>
-        <div>2. 系统根据邮箱判定您的身份为教师还是学生</div>
+        <div>邮箱要求是国内教育邮箱（即以 edu.cn 结尾）</div>
       </section>
-      <c-input placeholder="密码" type="password" v-model="password"></c-input>
+      <c-input class="mb-24" placeholder="密码" type="password" v-model="password"></c-input>
       <div class="button-area">
         <c-button standout theme="blue" @click="handleSubmit" :no-click-warn="!formChecked()">登录</c-button>
         <c-button theme="blue" @click="handleToRegister">去注册</c-button>
       </div>
       <router-link class="link" to="/forget-password">忘记密码？</router-link>
-      <background></background>
     </div>
   </div>
 </template>
@@ -25,12 +22,11 @@
 <script>
 import CInput from '@/components/Basic/CInput'
 import CButton from '@/components/Basic/CButton'
-import Background from '@/components/Layouts/Background'
 import { getUserInfo, loginByEmail } from '@/server/user'
 import { SET_USER_INFO } from '@/store/types/main-types'
 
 export default {
-  components: { CButton, CInput, Background },
+  components: { CButton, CInput },
   data () {
     return {
       email: '',
@@ -104,10 +100,6 @@ export default {
   }
 }
 
-.c-input {
-  margin-bottom: 24px;
-}
-
 .button-area {
   display: flex;
   margin: 0 -8px;

src/views/register/Register.vue

@@ -7,42 +7,55 @@
           登录信息
           <span>1/2</span>
         </div>
-        <c-input placeholder="邮箱" type="email" v-model="email"></c-input>
+        <div class="mb-16">
+          <c-button @click="type = userType.student" icon="face" :theme="type === userType.student ? 'green' : 'normal'"
+                    class="mr-8" no-bold>
+            学生
+          </c-button>
+          <c-button @click="type = userType.teacher" icon="supervised_user_circle"
+                    :theme="type === userType.teacher ? 'orange' : 'normal'" no-bold>
+            教师 [ 需要管理员审核 ]
+          </c-button>
+        </div>
+        <c-input class="mb-8" placeholder="邮箱" type="email" v-model="email"></c-input>
+        <section class="tip mb-16">
+          <div>邮箱要求是国内教育邮箱（即以 edu.cn 结尾）</div>
+        </section>
         <div class="verified-code-wrapper">
           <c-input placeholder="邮箱验证码" type="number" v-model="emailCode"></c-input>
           <c-button :no-click-warn="typeof this.emailButtonContent === typeof 0" theme="blue"
                     @click="handleSendEmailCode">{{ emailButtonContent }}
           </c-button>
         </div>
-        <section class="tip mb-24">
-          <div>关于邮箱的说明：</div>
-          <div>1. 邮箱需为南京大学校邮（@nju.edu.cn | @smail.nju.edu.cn）</div>
-          <div>2. 系统根据邮箱判定您的身份为教师还是学生</div>
+        <c-input class="mb-16" placeholder="密码" type="password" v-model="password"></c-input>
+        <c-input placeholder="确认密码" class="mb-8" type="password" v-model="passwordEnsure"></c-input>
+        <section class="tip" v-if="passwordWarning">
+          <div class="red absolute">{{passwordWarning}}</div>
         </section>
-        <c-input placeholder="密码" type="password" v-model="password"></c-input>
-        <c-input placeholder="确认密码" type="password" v-model="passwordEnsure"></c-input>
-        <section class="tip absolute password-warning" v-if="passwordWarning">
-          <div>{{passwordWarning}}</div>
+        <section class="tip" v-else-if="password && passwordEnsure && !passwordWarning">
+          <div class="vertical-center green absolute">
+            <c-icon :right="4" bold theme="green" :size="14">check</c-icon>
+            密码验证通过
+          </div>
         </section>
-        <section class="tip absolute password-checked" v-if="password && passwordEnsure && !passwordWarning">
-          <div class="vertical-center"><c-icon :right="4" bold theme="green" :size="14">check</c-icon>密码验证通过</div>
-        </section>
-        <c-button theme="blue" block class="mb-16 mt-32" @click="step = 2">下一步</c-button>
+        <c-button theme="blue" block class="mt-32" @click="step = 2">下一步</c-button>
       </section>
+
       <section class="step=2" v-show="step === 2">
         <section class="tip mb-8">
-          <div>已填写的邮箱：{{email}}</div>
+          <div class="mb-8">已填写的邮箱：{{email ? email : '[ 未填写 ]'}}</div>
+          <div>注册身份为：{{type ? userTypeNaming[type] : '[ 未填写 ]'}}</div>
         </section>
         <c-button @click="step = 1" theme="orange" block class="mb-16">上一步</c-button>
         <div class="sub-title">
           其他信息
           <span>2/2</span>
         </div>
-        <c-input placeholder="姓名" v-model="name"></c-input>
+        <c-input placeholder="姓名" v-model="name" class="mb-8"></c-input>
         <section class="tip mb-16">
           <div>请使用真实姓名，便于学生、老师之间辨认</div>
         </section>
-        <c-input placeholder="手机" type="number" v-model="phone"></c-input>
+        <c-input placeholder="手机" type="number" v-model="phone" class="mb-16"></c-input>
         <div class="verified-code-wrapper">
           <c-input placeholder="手机验证码" type="number" v-model="phoneCode"></c-input>
           <c-button theme="blue" @click="handleSendPhoneCode"
@@ -53,7 +66,6 @@
           <c-button theme="blue" standout block :no-click-warn="!formChecked()" @click="handleSubmit">确认注册</c-button>
         </div>
       </section>
-      <background></background>
     </div>
   </div>
 </template>
@@ -61,16 +73,17 @@
 <script>
 import CInput from '@/components/Basic/CInput'
 import CButton from '@/components/Basic/CButton'
-import Background from '@/components/Layouts/Background'
 import { sendEmailCode, sendPhoneCode } from '@/server/code'
 import { register } from '@/server/user'
 import CIcon from '@/components/Basic/CIcon'
+import userType, { userTypeNaming } from '@/server/enums/user-type'
 
 export default {
-  components: { CIcon, CButton, CInput, Background },
+  components: { CIcon, CButton, CInput },
   data () {
     return {
       step: 1,
+      type: '',
       email: '',
       emailCode: '',
       emailButtonContent: '发送验证码',
@@ -81,7 +94,10 @@ export default {
       name: '',
       phone: '',
       phoneCode: '',
-      message: ''
+      message: '',
+
+      userType,
+      userTypeNaming
     }
   },
   watch: {
@@ -94,6 +110,11 @@ export default {
   },
   methods: {
     formChecked () {
+      if (this.type === '') {
+        this.message = '未选择用户类型'
+        return false
+      }
+
       if (!(this.email && this.emailCode && this.password && this.passwordEnsure)) {
         this.message = '上一页信息尚未完全填写'
         return false
@@ -125,7 +146,8 @@ export default {
           emailCode: this.emailCode,
           phone: this.phone,
           phoneCode: this.phoneCode,
-          password: this.password
+          password: this.password,
+          type: this.type
         }).then(() => {
           this.$setSuccessMessage('注册成功')
           this.$router.push({ name: 'login' })
@@ -136,7 +158,7 @@ export default {
     },
     handleSendEmailCode () {
       this.$setInfoMessage('正在尝试发送验证码')
-      if (this.email.match(/.+@(nju.edu.cn|smail.nju.edu.cn)/)) {
+      if (this.email.match(/.+@.*(edu.cn)/)) {
         this.setEmailCodeCd()
         sendEmailCode({ email: this.email }).then(res => {
           this.$setSuccessMessage('邮箱验证码发送成功')
@@ -204,6 +226,7 @@ export default {
 
 .title {
   color: #6a7a8a;
+
   span {
     font-family: 'Courier New', 'Courier', monospace;
     font-size: 1.15em;
@@ -213,6 +236,7 @@ export default {
     top: 2px;
   }
 }
+
 .sub-title {
   span {
     float: right;
@@ -225,11 +249,6 @@ export default {
 .tip {
   color: #7a8a9a;
   font-size: 12px;
-  margin-top: -12px;
-}
-
-.c-input {
-  margin-bottom: 16px;
 }
 
 .button-area {
@@ -261,14 +280,4 @@ export default {
 .absolute {
   position: absolute;
 }
-
-.password-warning {
-  color: $theme-orange;
-  font-family: 'iconfont', sans-serif;
-}
-
-.password-checked {
-  color: $theme-green;
-  font-family: 'iconfont', sans-serif;
-}
 </style>

src/views/student/tabs/StudentPersonal.vue

@@ -88,7 +88,7 @@ export default {
     momentFromNow,
     handleSendEmailCode () {
       this.$setInfoMessage('正在尝试发送验证码')
-      if (this.email.match(/.+@(nju.edu.cn|smail.nju.edu.cn)/)) {
+      if (this.email.match(/.+@.*(edu.cn)/)) {
         this.setEmailCodeCd()
         sendEmailCode({ email: this.email }).then(res => {
           this.$setSuccessMessage('邮箱验证码发送成功')

src/views/teacher/tabs/TeacherPersonal.vue

@@ -87,7 +87,7 @@ export default {
     momentFromNow,
     handleSendEmailCode () {
       this.$setInfoMessage('正在尝试发送验证码')
-      if (this.email.match(/.+@(nju.edu.cn|smail.nju.edu.cn)/)) {
+      if (this.email.match(/.+@.*(edu.cn)/)) {
         this.setEmailCodeCd()
         sendEmailCode({ email: this.email }).then(res => {
           this.$setSuccessMessage('邮箱验证码发送成功')