Merge branch 'develop'

src/common-style.scss

@@ -37,6 +37,11 @@
   align-items: center;
 }
 
+.spacer {
+  flex: 1;
+  width: 1px;
+}
+
 .blue {
   color: $theme-blue;
 }

src/components/Cards/QuizCard.vue

@@ -114,10 +114,6 @@ export default {
   line-height: 1.8;
   transition: .2s;
 
-  .spacer {
-    flex: 1;
-  }
-
   .c-button {
     padding: 6px 12px;
     float: right;

src/components/Discussion/CommentToolBar.vue

@@ -5,7 +5,7 @@
       <c-button v-if="isTeacher && topNumber" @click="handleCancelToTop" theme="green" text icon="close">取消置顶</c-button>
       <c-button v-if="isTeacher && !hasReply" @click="handleShowHideReplyInput" theme="blue" text icon="reply">回复</c-button>
       <c-button v-if="isTeacher && hasReply" @click="handleDeleteReply" theme="red" text icon="cancel">删除回复</c-button>
-      <c-button v-if="canDelete" @click="handleDeleteComment" theme="red" text icon="delete">删除回复</c-button>
+      <c-button v-if="canDelete" @click="handleDeleteComment" theme="red" text icon="delete">删除讨论</c-button>
     </div>
     <div v-show="replyInputShow && !hasReply" class="reply-input-wrapper">
       <c-input placeholder="在此输入回复内容" v-model="replyContent"></c-input>
@@ -69,7 +69,7 @@ export default {
 <style lang="scss" scoped>
 @import '~@/style/theme.scss';
 .comment-tool-bar {
-  margin: 0 -16px;
+  margin: 0 -12px;
 }
 
 .reply-input-wrapper {

src/components/DiscussionTab/CMessage.vue

@@ -156,11 +156,6 @@ export default {
   color: #5a6a7a;
 }
 
-.spacer {
-  width: 0;
-  flex: 1;
-}
-
 @media (max-width: 600px) {
   .link {
     display: none;

src/server/user.js

@@ -40,9 +40,9 @@ export function logout () {
 }
 
 // 修改用户信息（目前只有姓名）
-export function modifyUser ({ name }) {
+export function modifyUser ({ name, type }) {
   const data = {
-    name
+    name, type
   }
   return axios
     .put(useUserServer(), data)
@@ -50,7 +50,7 @@ export function modifyUser ({ name }) {
 }
 
 // 通过邮箱验证重设密码
-export function resetPasswordByEmail({ email, code, password }) {
+export function resetPasswordByEmail ({ email, code, password }) {
   const data = {
     username: email,
     code,

src/views/admin/Admin.vue

@@ -128,9 +128,4 @@ export default {
   max-width: 800px;
   padding: 0 24px;
 }
-
-.spacer {
-  width: 1px;
-  flex: 1;
-}
 </style>

src/views/quiz/components/QuestionCard.vue

@@ -76,10 +76,6 @@ export default {
     display: flex;
     align-items: center;
   }
-
-  .spacer {
-    flex: 1;
-  }
 }
 
 .c-button {

src/views/quiz/components/QuizEditor.vue

@@ -210,10 +210,6 @@ export default {
   font-size: 12px;
   background: white;
 
-  .spacer {
-    flex: 1;
-  }
-
   &-header {
     font-size: 16px;
     display: flex;

src/views/shared/Personal.vue

@@ -0,0 +1,185 @@
+<template>
+  <div class="tab complex-tab">
+    <div class="left">
+      <h1 class="title">
+        个人信息设置
+        <c-tag :theme="roleTagTheme">{{userTypeNaming[role]}}</c-tag>
+      </h1>
+      <div class="info">
+        <div>邮箱：{{userInfo.email}}</div>
+        <div>手机：{{userInfo.phone}}</div>
+        <div>姓名：{{userInfo.name}}</div>
+        <div>加入时间：{{momentFromNow(userInfo.createAt)}}</div>
+      </div>
+      <div class="sub-title">
+        修改资料
+        <c-button :theme="showChangeProfile ? 'blue' : 'normal'" :left="8" text
+                  :icon="showChangeProfile ? 'unfold_less' : 'unfold_more'"
+                  @click="showChangeProfile = !showChangeProfile">
+          {{showChangeProfile ? '收起' : '展开'}}
+        </c-button>
+      </div>
+      <show-transition>
+        <div v-if="showChangeProfile">
+          <c-input :placeholder="'目前资料中的姓名：' + userInfo.name" class="mb-16" v-model="newName"></c-input>
+          <c-button theme="green" block class="mb-32" @click="handleModifyName" icon="check">确认修改姓名</c-button>
+        </div>
+      </show-transition>
+      <div class="sub-title">
+        修改密码
+        <c-button :theme="showChangePassword ? 'blue' : 'normal'" :left="8" text
+                  :icon="showChangePassword ? 'unfold_less' : 'unfold_more'"
+                  @click="showChangePassword = !showChangePassword">
+          {{showChangePassword ? '收起' : '展开'}}
+        </c-button>
+      </div>
+      <show-transition>
+        <div v-if="showChangePassword">
+          <div class="verified-code-wrapper">
+            <c-input placeholder="邮箱验证码" type="number" v-model="code"></c-input>
+            <c-button theme="blue" :no-click-warn="typeof emailButtonContent === typeof 0"
+                      @click="handleSendEmailCode">{{ emailButtonContent }}
+            </c-button>
+          </div>
+          <c-input placeholder="新密码" type="password" class="mb-16" v-model="password"></c-input>
+          <c-input placeholder="确认新密码" type="password" class="mb-16" v-model="passwordEnsure"></c-input>
+          <c-button block theme="orange" @click="handleModifyPassword" icon="check">确认修改密码</c-button>
+        </div>
+      </show-transition>
+    </div>
+    <slide-in-different-transition>
+      <router-view/>
+    </slide-in-different-transition>
+  </div>
+</template>
+
+<script>
+import CButton from '@/components/Basic/CButton'
+import CInput from '@/components/Basic/CInput'
+import { sendEmailCode } from '@/server/code'
+import { modifyUser, resetPasswordByEmail } from '@/server/user'
+import { mapState } from 'vuex'
+import CTag from '@/components/Basic/CTag'
+import SlideInDifferentTransition from '@/animations/SlideInDifferentTransition'
+import ShowTransition from '@/animations/ShowTransition'
+import momentFromNow from '@/utils/moment-from-now'
+import { userTypeNaming } from '@/enums/user-type'
+import { SET_USER_INFO } from '@/store/types/main-types'
+
+export default {
+  props: {
+    role: String,
+    roleTagTheme: String
+  },
+  components: { CTag, CInput, CButton, SlideInDifferentTransition, ShowTransition },
+  data () {
+    return {
+      emailButtonContent: '发送验证码',
+      newName: '',
+      password: '',
+      code: '',
+      passwordEnsure: '',
+      showChangeProfile: false,
+      showChangePassword: false,
+
+      userTypeNaming
+    }
+  },
+  computed: {
+    ...mapState({
+      userInfo: state => state.main.userInfo
+    }),
+    email () {
+      return this.userInfo.email
+    }
+  },
+  methods: {
+    momentFromNow,
+    handleSendEmailCode () {
+      this.$setInfoMessage('正在尝试发送验证码')
+      if (this.email.match(/.+@.*(edu.cn)/)) {
+        this.setEmailCodeCd()
+        sendEmailCode({ email: this.email }).then(res => {
+          this.$setSuccessMessage('邮箱验证码发送成功')
+        }).catch(err => {
+          this.$setErrorMessage(err.response.data.msg)
+        })
+      } else {
+        this.$setErrorMessage('本邮箱不符合南京大学校邮格式')
+      }
+    },
+    setEmailCodeCd () {
+      this._emailCodeCdInterval && clearInterval(this._emailCodeCdInterval)
+      this.emailButtonContent = 60
+      this._emailCodeCdInterval = setInterval(() => {
+        this.emailButtonContent--
+        if (typeof this.emailButtonContent !== typeof 0 || this.emailButtonContent <= 0) {
+          clearInterval(this._emailCodeCdInterval)
+          this.emailButtonContent = '发送验证码'
+        }
+      }, 1000)
+    },
+    handleModifyPassword () {
+      if (!this.password || this.password !== this.passwordEnsure) {
+        this.$setInfoMessage('两次输入的密码不一致')
+        return
+      }
+
+      resetPasswordByEmail({ email: this.email, code: this.code, password: this.password }).then(res => {
+        this.$setSuccessMessage('密码修改成功')
+      }).catch(err => {
+        this.$setErrorMessage(err.response.data.msg)
+      })
+    },
+    handleModifyName () {
+      if (!this.newName) {
+        this.$setInfoMessage('输入的新用户名为空')
+        return
+      }
+
+      modifyUser({ name: this.newName, type: this.role }).then(res => {
+        this.$setSuccessMessage('修改用户名成功')
+        this.$store.commit(SET_USER_INFO, { userInfo: res })
+      }).catch(err => {
+        this.$setErrorMessage(err.response.data.msg)
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/style/theme.scss";
+@import "~@/views/shared/tab-common";
+
+.sub-title {
+  font-size: 20px;
+  display: flex;
+  align-items: center;
+}
+
+.verified-code-wrapper {
+  margin-bottom: 16px;
+  display: flex;
+  align-items: center;
+  flex: 1;
+
+  .c-input {
+    margin-bottom: unset;
+    flex: 1;
+  }
+
+  .c-button {
+    margin-left: 12px;
+  }
+}
+
+.info {
+  font-size: 14px;
+  padding: 4px 12px;
+  background-color: #f4f4f4;
+  color: #7a8a9a;
+  line-height: 2;
+  margin-bottom: 16px;
+}
+</style>

src/views/student/components/StudentSlideDetail.vue

@@ -7,16 +7,22 @@
         {{showMore ? '收起' : '显示'}}详情
       </c-button>
     </back-title>
+    <div class="slide-name mb-24">
+      {{slide.name}}
+    </div>
     <show-transition>
       <slide-detail v-if="showMore" :slide="slide"></slide-detail>
     </show-transition>
-    <c-button block standout theme="blue" class="mb-16" @click="handleReadSlide" icon="play_arrow">浏览课件</c-button>
-    <a :href="slideUrl">
-      <c-button block theme="blue" class="mb-16" icon="cloud_download">
-        下载课件
+    <div class="vertical-center">
+      <c-button block theme="blue" standout class="mb-16" @click="handleReadSlide" icon="play_arrow" no-bold>浏览课件
       </c-button>
-    </a>
-    <c-button block theme="green" class="mb-16" @click="handleToQuiz" icon="edit">查看测验</c-button>
+      <a :href="slideUrl">
+        <c-button text theme="green" :left="8" no-bold class="mb-16" icon="cloud_download">
+          下载
+        </c-button>
+      </a>
+    </div>
+    <c-button block theme="green" @click="handleToQuiz" icon="edit">查看测验</c-button>
   </tab-side-component>
 </template>
 
@@ -35,7 +41,7 @@ export default {
   data () {
     return {
       slideUrl: '',
-      showMore: true
+      showMore: false
     }
   },
   computed: {
@@ -81,6 +87,11 @@ export default {
   }
 }
 
+.slide-name {
+  font-size: 18px;
+  color: #6a7a8a;
+}
+
 .sub-title {
   margin-bottom: 24px;
 }

src/views/student/tabs/StudentPersonal.vue

@@ -1,177 +1,21 @@
 <template>
-  <div class="tab complex-tab">
-    <div class="left">
-      <h1 class="title">
-        个人信息设置
-        <c-tag theme="green">学生</c-tag>
-      </h1>
-      <div class="info">
-        <div>邮箱：{{userInfo.email}}</div>
-        <div>手机：{{userInfo.phone}}</div>
-        <div>姓名：{{userInfo.name}}</div>
-        <div>加入时间：{{momentFromNow(userInfo.createAt)}}</div>
-      </div>
-      <div class="sub-title">
-        修改资料
-        <c-button :theme="showChangeProfile ? 'blue' : 'normal'" :left="8" text
-                  :icon="showChangeProfile ? 'unfold_less' : 'unfold_more'"
-                  @click="showChangeProfile = !showChangeProfile">
-          {{showChangeProfile ? '收起' : '展开'}}
-        </c-button>
-      </div>
-      <show-transition>
-        <div v-if="showChangeProfile">
-          <c-input :placeholder="'目前资料中的姓名：' + userInfo.name" class="mb-16" v-model="newName"></c-input>
-          <c-button theme="green" block class="mb-32" @click="handleModifyName" icon="check">确认修改姓名</c-button>
-        </div>
-      </show-transition>
-      <div class="sub-title">
-        修改密码
-        <c-button :theme="showChangePassword ? 'blue' : 'normal'" :left="8" text :icon="showChangePassword ? 'unfold_less' : 'unfold_more'"
-                  @click="showChangePassword = !showChangePassword">
-          {{showChangePassword ? '收起' : '展开'}}
-        </c-button>
-      </div>
-      <show-transition>
-        <div v-if="showChangePassword">
-          <div class="verified-code-wrapper">
-            <c-input placeholder="邮箱验证码" type="number" v-model="code"></c-input>
-            <c-button theme="blue" :no-click-warn="typeof emailButtonContent === typeof 0"
-                      @click="handleSendEmailCode">{{ emailButtonContent }}
-            </c-button>
-          </div>
-          <c-input placeholder="新密码" type="password" class="mb-16" v-model="password"></c-input>
-          <c-input placeholder="确认新密码" type="password" class="mb-16" v-model="passwordEnsure"></c-input>
-          <c-button block theme="orange" @click="handleModifyPassword" icon="check">确认修改密码</c-button>
-        </div>
-      </show-transition>
-    </div>
-    <slide-in-different-transition>
-      <router-view/>
-    </slide-in-different-transition>
-  </div>
+  <personal :role="userType.student" role-tag-theme="green"></personal>
 </template>
 
 <script>
-import CButton from '@/components/Basic/CButton'
-import CInput from '@/components/Basic/CInput'
-import { sendEmailCode } from '@/server/code'
-import { logout, modifyUser, resetPasswordByEmail } from '@/server/user'
-import { mapState } from 'vuex'
-import CTag from '@/components/Basic/CTag'
-import SlideInDifferentTransition from '@/animations/SlideInDifferentTransition'
-import ShowTransition from '@/animations/ShowTransition'
-import momentFromNow from '@/utils/moment-from-now'
+import Personal from '@/views/shared/Personal'
+import userType from '@/enums/user-type'
 
 export default {
-  components: { CTag, CInput, CButton, SlideInDifferentTransition, ShowTransition },
+  components: { Personal },
   data () {
     return {
-      emailButtonContent: '发送验证码',
-      newName: '',
-      code: '',
-      password: '',
-      passwordEnsure: '',
-      showChangeProfile: false,
-      showChangePassword: false
-    }
-  },
-  computed: {
-    ...mapState({
-      userInfo: state => state.main.userInfo
-    }),
-    email () {
-      return this.userInfo.email
-    }
-  },
-  methods: {
-    momentFromNow,
-    handleSendEmailCode () {
-      this.$setInfoMessage('正在尝试发送验证码')
-      if (this.email.match(/.+@.*(edu.cn)/)) {
-        this.setEmailCodeCd()
-        sendEmailCode({ email: this.email }).then(res => {
-          this.$setSuccessMessage('邮箱验证码发送成功')
-        }).catch(err => {
-          this.$setErrorMessage(err.response.data.msg)
-        })
-      } else {
-        this.$setErrorMessage('本邮箱不符合南京大学校邮格式')
-      }
-    },
-    setEmailCodeCd () {
-      this._emailCodeCdInterval && clearInterval(this._emailCodeCdInterval)
-      this.emailButtonContent = 60
-      this._emailCodeCdInterval = setInterval(() => {
-        this.emailButtonContent--
-        if (typeof this.emailButtonContent !== typeof 0 || this.emailButtonContent <= 0) {
-          clearInterval(this._emailCodeCdInterval)
-          this.emailButtonContent = '发送验证码'
-        }
-      }, 1000)
-    },
-    handleLogout () {
-      logout()
-      this.$setSuccessMessage('您已退出登录')
-      this.$router.push({ name: 'login' })
-    },
-    handleModifyPassword () {
-      if (!this.password || this.password !== this.passwordEnsure) {
-        this.$setInfoMessage('两次输入的密码不一致')
-        return
-      }
-
-      resetPasswordByEmail({ email: this.email, code: this.code, password: this.password }).then(res => {
-        this.$setSuccessMessage('密码修改成功')
-      }).catch(err => {
-        this.$setErrorMessage(err.response.data.msg)
-      })
-    },
-    handleModifyName () {
-      if (!this.newName) {
-        this.$setInfoMessage('输入的新用户名为空')
-        return
-      }
-
-      modifyUser({ name: this.newName }).then(res => {
-        this.$setSuccessMessage('修改用户名成功')
-      })
+      userType
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-@import "~@/style/theme.scss";
-@import "~@/views/shared/tab-common";
-
-.sub-title {
-  font-size: 20px;
-  display: flex;
-  align-items: center;
-}
 
-.verified-code-wrapper {
-  margin-bottom: 16px;
-  display: flex;
-  align-items: center;
-  flex: 1;
-
-  .c-input {
-    margin-bottom: unset;
-    flex: 1;
-  }
-
-  .c-button {
-    margin-left: 12px;
-  }
-}
-.info {
-  font-size: 14px;
-  padding: 4px 12px;
-  background-color: #f4f4f4;
-  color: #7a8a9a;
-  line-height: 2;
-  margin-bottom: 16px;
-}
 </style>

src/views/teacher/components/TeacherSlideDetail.vue

@@ -12,7 +12,7 @@
     </show-transition>
     <div class="mb-12 vertical-center">
       <strong class="slide-name">{{slide.name}}</strong>
-      <c-button text theme="red" :left="8" @click="handleDeleteSlide" icon="close">删除课件</c-button>
+      <c-button text theme="red" :left="8" @click="handleDeleteSlide" icon="close">删除</c-button>
     </div>
     <div class="vertical-center">
       <c-button block theme="blue" standout class="mb-12" @click="handleReadSlide" icon="play_arrow" no-bold>浏览课件

src/views/teacher/tabs/TeacherPersonal.vue

@@ -1,173 +1,21 @@
 <template>
-  <div class="tab">
-    <div class="left">
-      <h1 class="title">
-        个人信息设置
-        <c-tag theme="blue">教师</c-tag>
-      </h1>
-      <div class="info">
-        <div>邮箱：{{userInfo.email}}</div>
-        <div>手机：{{userInfo.phone}}</div>
-        <div>姓名：{{userInfo.name}}</div>
-        <div>加入时间：{{momentFromNow(userInfo.createAt)}}</div>
-      </div>
-      <div class="sub-title">
-        修改资料
-        <c-button :theme="showChangeProfile ? 'blue' : 'normal'" :left="8" text :icon="showChangeProfile ? 'unfold_less' : 'unfold_more'"
-                  @click="showChangeProfile = !showChangeProfile">
-          {{showChangeProfile ? '收起' : '展开'}}
-        </c-button>
-      </div>
-      <show-transition>
-        <div v-if="showChangeProfile">
-          <c-input :placeholder="'目前资料中的姓名：' + userInfo.name" class="mb-16" v-model="newName"></c-input>
-          <c-button theme="green" block class="mb-32" @click="handleModifyName" icon="check">确认修改姓名</c-button>
-        </div>
-      </show-transition>
-      <div class="sub-title">
-        修改密码
-        <c-button :theme="showChangePassword ? 'blue' : 'normal'" :left="8" text :icon="showChangePassword ? 'unfold_less' : 'unfold_more'"
-                  @click="showChangePassword = !showChangePassword">
-          {{showChangePassword ? '收起' : '展开'}}
-        </c-button>
-      </div>
-      <show-transition>
-        <div v-if="showChangePassword">
-          <div class="verified-code-wrapper">
-            <c-input placeholder="邮箱验证码" type="number" v-model="code"></c-input>
-            <c-button theme="blue" :no-click-warn="typeof emailButtonContent === typeof 0"
-                      @click="handleSendEmailCode">{{ emailButtonContent }}
-            </c-button>
-          </div>
-          <c-input placeholder="新密码" type="password" class="mb-16" v-model="password"></c-input>
-          <c-input placeholder="确认新密码" type="password" class="mb-16" v-model="passwordEnsure"></c-input>
-          <c-button block theme="orange" @click="handleModifyPassword" icon="check">确认修改密码</c-button>
-        </div>
-      </show-transition>
-    </div>
-    <slide-in-different-transition>
-      <router-view/>
-    </slide-in-different-transition>
-  </div>
+  <personal :role="userType.teacher" role-tag-theme="green"></personal>
 </template>
 
 <script>
-import CButton from '@/components/Basic/CButton'
-import CInput from '@/components/Basic/CInput'
-import { sendEmailCode } from '@/server/code'
-import { modifyUser, resetPasswordByEmail } from '@/server/user'
-import { mapState } from 'vuex'
-import CTag from '@/components/Basic/CTag'
-import SlideInDifferentTransition from '@/animations/SlideInDifferentTransition'
-import ShowTransition from '@/animations/ShowTransition'
-import momentFromNow from '@/utils/moment-from-now'
+import Personal from '@/views/shared/Personal'
+import userType from '@/enums/user-type'
 
 export default {
-  components: { CTag, CInput, CButton, SlideInDifferentTransition, ShowTransition },
+  components: { Personal },
   data () {
     return {
-      emailButtonContent: '发送验证码',
-      newName: '',
-      password: '',
-      code: '',
-      passwordEnsure: '',
-      showChangeProfile: false,
-      showChangePassword: false
-    }
-  },
-  computed: {
-    ...mapState({
-      userInfo: state => state.main.userInfo
-    }),
-    email () {
-      return this.userInfo.email
-    }
-  },
-  methods: {
-    momentFromNow,
-    handleSendEmailCode () {
-      this.$setInfoMessage('正在尝试发送验证码')
-      if (this.email.match(/.+@.*(edu.cn)/)) {
-        this.setEmailCodeCd()
-        sendEmailCode({ email: this.email }).then(res => {
-          this.$setSuccessMessage('邮箱验证码发送成功')
-        }).catch(err => {
-          this.$setErrorMessage(err.response.data.msg)
-        })
-      } else {
-        this.$setErrorMessage('本邮箱不符合南京大学校邮格式')
-      }
-    },
-    setEmailCodeCd () {
-      this._emailCodeCdInterval && clearInterval(this._emailCodeCdInterval)
-      this.emailButtonContent = 60
-      this._emailCodeCdInterval = setInterval(() => {
-        this.emailButtonContent--
-        if (typeof this.emailButtonContent !== typeof 0 || this.emailButtonContent <= 0) {
-          clearInterval(this._emailCodeCdInterval)
-          this.emailButtonContent = '发送验证码'
-        }
-      }, 1000)
-    },
-    handleModifyPassword () {
-      if (!this.password || this.password !== this.passwordEnsure) {
-        this.$setInfoMessage('两次输入的密码不一致')
-        return
-      }
-
-      resetPasswordByEmail({ email: this.email, code: this.code, password: this.password }).then(res => {
-        this.$setSuccessMessage('密码修改成功')
-      }).catch(err => {
-        this.$setErrorMessage(err.response.data.msg)
-      })
-    },
-    handleModifyName () {
-      if (!this.newName) {
-        this.$setInfoMessage('输入的新用户名为空')
-        return
-      }
-
-      modifyUser({ name: this.newName }).then(res => {
-        this.$setSuccessMessage('修改用户名成功')
-      }).catch(err => {
-        this.$setErrorMessage(err.response.data.msg)
-      })
+      userType
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-@import "~@/style/theme.scss";
-@import "~@/views/shared/tab-common";
-
-.sub-title {
-  font-size: 20px;
-  display: flex;
-  align-items: center;
-}
 
-.verified-code-wrapper {
-  margin-bottom: 16px;
-  display: flex;
-  align-items: center;
-  flex: 1;
-
-  .c-input {
-    margin-bottom: unset;
-    flex: 1;
-  }
-
-  .c-button {
-    margin-left: 12px;
-  }
-}
-.info {
-  font-size: 14px;
-  padding: 4px 12px;
-  background-color: #f4f4f4;
-  color: #7a8a9a;
-  line-height: 2;
-  margin-bottom: 16px;
-}
 </style>