style: 学生题库样式

src/router/quiz.js

@@ -43,5 +43,23 @@ export default [{
   path: '/student/quiz/:quizId',
   name: 'student-quiz-detail',
   component: () => import(/* webpackChunkName: "student" */ '@/views/student/components/StudentQuizDetail.vue')
+}, {
+  meta: { roles: ['student'] },
+  path: '/student/questions',
+  name: 'student-question-table',
+  component: () => import(/* webpackChunkName: "student" */ '@/views/quiz/StudentQuestionTable.vue'),
+  children: [{
+    path: 'completed',
+    name: 'student-question-table-completed',
+    component: () => import(/* webpackChunkName: "student" */ '@/views/quiz/student-question-table-component/CompletedQuestions.vue')
+  }, {
+    path: 'marked',
+    name: 'student-question-table-marked',
+    component: () => import(/* webpackChunkName: "student" */ '@/views/quiz/student-question-table-component/MarkedQuestions.vue')
+  }, {
+    path: 'rated',
+    name: 'student-question-table-rated',
+    component: () => import(/* webpackChunkName: "student" */ '@/views/quiz/student-question-table-component/RatedQuestions.vue')
+  }]
 }
 ]

src/views/quiz/StudentQuestionTable.vue

@@ -0,0 +1,82 @@
+<template>
+  <div class="student-question-table">
+    <back-title>
+      我的题库
+      <c-tag theme="green">学生</c-tag>
+    </back-title>
+    <div class="questions-router-card">
+      <div class="actions">
+        <router-link :to="{ name: 'student-question-table-completed' }">
+          <icon-button no-bold theme="blue">assignment</icon-button>
+        </router-link>
+        <router-link :to="{ name: 'student-question-table-marked' }">
+          <icon-button no-bold theme="blue">bookmarks</icon-button>
+        </router-link>
+        <router-link :to="{ name: 'student-question-table-rated' }">
+          <icon-button no-bold theme="blue">stars</icon-button>
+        </router-link>
+      </div>
+      <div class="views">
+        <router-view></router-view>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import BackTitle from '@/components/Basic/BackTitle'
+import CTag from '@/components/Basic/CTag'
+import IconButton from '@/components/Basic/IconButton'
+
+export default {
+  components: { IconButton, CTag, BackTitle }
+}
+</script>
+
+<style lang="scss" scoped>
+.student-question-table {
+  background-color: #f8f8f8;
+  box-shadow: 0 0 0 1000px #f8f8f8;
+  margin: 0 auto;
+  max-width: 1000px;
+  padding: 32px 24px 32px 24px;
+}
+
+@media (min-width: 500px) {
+  .questions-router-card {
+    height: calc(100vh - 192px);
+    border-radius: 16px;
+    background-color: white;
+    box-shadow: 3px 6px 6px rgba(0, 0, 0, .03), -2px -2px 2px rgba(255, 255, 255, .6);
+
+    display: flex;
+
+    .actions {
+      display: flex;
+      flex-direction: column;
+      justify-content: space-around;
+      align-items: center;
+      width: 60px;
+      background-color: #e0efff;
+      border-radius: 16px 0 0 16px;
+    }
+
+    .views {
+      flex: 1;
+      padding: 16px 24px;
+      overflow: auto;
+    }
+  }
+}
+
+@media (max-width: 500px) {
+  .actions {
+    display: flex;
+    justify-content: space-evenly;
+    align-items: center;
+    transform: translateY(-16px);
+    background-color: #e0efff;
+    border-radius: 16px;
+  }
+}
+</style>

src/views/quiz/student-question-table-component/CompletedQuestions.vue

@@ -0,0 +1,16 @@
+<template>
+  <div>
+    <question-table></question-table>
+  </div>
+</template>
+
+<script>
+import QuestionTable from '@/views/quiz/components/QuestionTable'
+export default {
+  components: { QuestionTable }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/quiz/student-question-table-component/MarkedQuestions.vue

@@ -0,0 +1,13 @@
+<template>
+  <div>
+    2
+  </div>
+</template>
+
+<script>
+export default {}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/quiz/student-question-table-component/RatedQuestions.vue

@@ -0,0 +1,13 @@
+<template>
+  <div>
+    3
+  </div>
+</template>
+
+<script>
+export default {}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/student/tabs/StudentQuiz.vue

@@ -3,8 +3,8 @@
     <div class="left">
       <h1 class="title">
         课程测验
-        <router-link>
-          <c-button icon=""></c-button>
+        <router-link :to="{ name: 'student-question-table' }">
+          <c-button icon="assignment" :left="12" theme="blue" text>我的题库</c-button>
         </router-link>
       </h1>
       <div class="show-quiz-type-bar mb-24">