diff --git a/backend/pick_student/.idea/vcs.xml b/backend/pick_student/.idea/vcs.xml
new file mode 100644
index 0000000..b2bdec2
--- /dev/null
+++ b/backend/pick_student/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$/../.." vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/backend/pick_student/pick_student.sqlite3 b/backend/pick_student/pick_student.sqlite3
new file mode 100644
index 0000000..5f08fdb
Binary files /dev/null and b/backend/pick_student/pick_student.sqlite3 differ
diff --git a/frontend/roll-book/package.json b/frontend/roll-book/package.json
index ecaad5f..821dbf2 100644
--- a/frontend/roll-book/package.json
+++ b/frontend/roll-book/package.json
@@ -9,6 +9,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@vue/devtools-api": "^7.4.6",
     "axios": "^1.7.7",
     "vue": "^3.5.10",
     "vue-router": "^4.4.5"
diff --git a/frontend/roll-book/src/components/Register.vue b/frontend/roll-book/src/components/Register.vue
deleted file mode 100644
index bf27dd5..0000000
--- a/frontend/roll-book/src/components/Register.vue
+++ /dev/null
@@ -1,96 +0,0 @@
-<template>
-    <div id="app">
-      <div class="register-container">
-        <img src="../assets/rabbit.png" alt="背景图片" class="background-image" />
-        <form @submit.prevent="register">
-          <h3>欢迎注册萝卜册</h3>
-          <div><input type="text" placeholder="昵称" v-model="nickname" /></div>
-          <div><input type="password" placeholder="密码" v-model="password" /></div>
-          <button type="submit">注册</button>
-          <p v-if="message">{{ message }}</p>
-          <p>已有账号? <a href="#">马上登录</a></p>
-        </form>
-      </div>
-    </div>
-  </template>
-  
-  <script>
-  import axios from 'axios';
-  export default {
-    data() {
-      return {
-        nickname: '',
-        password: '',
-        message: ''
-      };
-    },
-    methods: {
-        async register() {
-            try {
-                const params = new URLSearchParams();
-                params.append('username', this.nickname);
-                params.append('password', this.password);
-
-                const response = await axios.post('http://127.0.0.1:8000/teacher/jwt/register', params);
-                this.message = '注册成功，正在跳转到登录页面...';
-                console.log(response.data);
-                
-                // 注册成功后跳转到登录页面
-                setTimeout(() => {
-                    window.location.href = 'login.html'; // 假设登录页面为 login.html
-                }, 2000); // 等待 2 秒后跳转
-            } catch (error) {
-                // 如果后端返回了响应，则提取错误信息，否则使用默认的错误信息
-                if (error.response && error.response.data && error.response.data.detail) {
-                    this.message = `注册失败: ${error.response.data.detail}`;
-                } else {
-                    this.message = '注册失败，请重试';
-                }
-                console.error(error);
-            }
-        }
-    }
-  };
-  </script>
-  
-  <style scoped>
-  .register-container {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    margin-top: 50px;
-  }
-  input {
-    margin: 10px 0;
-    padding: 8px;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-  }
-  button {
-    padding: 10px;
-    background-color: #42b983;
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-  }
-  button:hover {
-    background-color: #368b75;
-  }
-  a {
-    color: #42b983;
-    text-decoration: none;
-  }
-  a:hover {
-    text-decoration: underline;
-  }
-
-  .background-image {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 400px;
-  height: 1024px;
-  z-index: 1;
-}
-  </style>
\ No newline at end of file
diff --git a/frontend/roll-book/src/views/CreateClass.vue b/frontend/roll-book/src/views/CreateClass.vue
index 207f32c..1cefdad 100644
--- a/frontend/roll-book/src/views/CreateClass.vue
+++ b/frontend/roll-book/src/views/CreateClass.vue
@@ -1,15 +1,15 @@
 <template>
-    <div class="v32_21">
-        <div class="v32_22"></div>
-        <div class="v32_23"></div>
-        <div class="v32_37"></div>
-        <h2 class="v32_24">新建班级</h2>
-        <h4 class="v32_30">班级名称</h4>
-        <h4 class="v32_31">上课时间</h4>
+    <div class="Create_Class">
+        <div class="bgstyle_1"></div>
+        <div class="bgstyle_2"></div>
+        <div class="bgstyle_3"></div>
+        <h2 class="newClass">新建班级</h2>
+        <h4 class="NameClass">班级名称</h4>
+        <h4 class="TimeClass">上课时间</h4>
         <div @submit.prevent="createClass">
-            <input type="text" v-model="className" class="v32_25">
-            <input type="text" v-model="classTime" class="v32_26">
-            <button class="v32_28" @click="createClass">创建班级</button>
+            <input type="text" v-model="className" class="name_input">
+            <input type="text" v-model="classTime" class="time_input">
+            <button class="createNew" @click="createClass">创建班级</button>
         </div>
         <p class="error-message" v-if="errorMessage">{{ errorMessage }}</p>
         
@@ -70,7 +70,7 @@ export default{
 body {
   font-size: 14px;
 }
-.v32_21 {
+.Create_Class {
   width: 100%;
   height: 1024px;
   background: rgba(250,250,250,1);
@@ -80,7 +80,7 @@ body {
   left: 0px;
   overflow: hidden;
 }
-.v32_22 {
+.bgstyle_1 {
   width: 80%;
   height: 48px;
   background: rgba(241,248,255,1);
@@ -90,7 +90,7 @@ body {
   left: 120px;
   overflow: hidden;
 }
-.v32_23 {
+.bgstyle_2 {
   width: 80%;
   height: 500px;
   background: rgba(255,255,255,1);
@@ -100,7 +100,7 @@ body {
   left: 120px;
   overflow: hidden;
 }
-.v32_28 {
+.createNew {
   width: 100px;
   height: 48px;
   background: rgba(24,144,255,1);
@@ -120,7 +120,7 @@ body {
   font-size: 20px;
   text-align: center;
 }
-.v32_24 {
+.newClass {
   width: 400px;
   color: rgba(0,0,0,1);
   position: absolute;
@@ -132,7 +132,7 @@ body {
   opacity: 1;
   text-align: center;
 }
-.v32_25 {
+.name_input {
   width: 400px;
   height: 60px;
   background: rgba(255,255,255,1);
@@ -147,7 +147,7 @@ body {
   border-bottom-right-radius: 5px;
   overflow: hidden;
 }
-.v32_26 {
+.time_input {
   width: 700px;
   height: 60px;
   background: rgba(255,255,255,1);
@@ -162,7 +162,7 @@ body {
   border-bottom-right-radius: 5px;
   overflow: hidden;
 }
-.v32_30 {
+.NameClass {
   width: 200px;
   color: rgba(0,0,0,1);
   position: absolute;
@@ -174,7 +174,7 @@ body {
   opacity: 1;
   text-align: center;
 }
-.v32_31 {
+.TimeClass {
   width: 200px;
   color: rgba(0,0,0,1);
   position: absolute;
@@ -186,20 +186,8 @@ body {
   opacity: 1;
   text-align: center;
 }
-.v32_34 {
-  width: 100px;
-  color: rgba(255,255,255,1);
-  position: absolute;
-  top: 686px;
-  left: 160px;
-  
-  font-family: Microsoft Himalaya;
-  font-weight: Regular;
-  font-size: 20px;
-  opacity: 1;
-  text-align: center;
-}
-.v32_37 {
+
+.bgstyle_3 {
   width: 100%;
   height: 300px;
   background: rgba(94,162,218,1);
diff --git a/frontend/roll-book/src/views/RollBook.vue b/frontend/roll-book/src/views/RollBook.vue
index 75f6dbb..7326d2b 100644
--- a/frontend/roll-book/src/views/RollBook.vue
+++ b/frontend/roll-book/src/views/RollBook.vue
@@ -1,5 +1,8 @@
 <template>
     <div class="RollBook_page">
+        <router-link to="/">
+          <div class="arrow_picture"></div>
+        </router-link>
         <span class="text_DigRadish">哪个萝卜被挖出来了？</span>
         <div class="rabbit_picture"></div>
         <div v-if="selectedStudent && selectedStudent.is_master" class="show_master"></div>
@@ -359,62 +362,7 @@ button {
   left: 476px;
   overflow: hidden;
 }
-.v2004_36 {
-  width: 120px;
-  height: 97px;
-  background: linear-gradient(rgba(146,188,153,1), rgba(226,175,105,1));
-  opacity: 1;
-  position: absolute;
-  top: 828px;
-  left: 656px;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  border-bottom-left-radius: 10px;
-  border-bottom-right-radius: 10px;
-  overflow: hidden;
-}
-.v2004_59 {
-  width: 40px;
-  height: 20px;
-  background: rgba(179,185,187,1);
-  opacity: 1;
-  position: absolute;
-  top: 108px;
-  left: 1189px;
-  border-top-left-radius: 34px;
-  border-top-right-radius: 34px;
-  border-bottom-left-radius: 34px;
-  border-bottom-right-radius: 34px;
-  overflow: hidden;
-}
-.v2004_61 {
-  width: 120px;
-  height: 68px;
-  background: rgba(24,144,255,1);
-  opacity: 1;
-  position: absolute;
-  top: 842px;
-  left: 1176px;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  border-bottom-left-radius: 10px;
-  border-bottom-right-radius: 10px;
-  overflow: hidden;
-}
-.v2004_39 {
-  width: 160px;
-  height: 68px;
-  background: rgba(24,144,255,1);
-  opacity: 1;
-  position: absolute;
-  top: 842px;
-  left: 919px;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  border-bottom-left-radius: 10px;
-  border-bottom-right-radius: 10px;
-  overflow: hidden;
-}
+
 .randomPick {
   width: 120px;
   height: 97px;
@@ -436,33 +384,7 @@ button {
   text-align: center;
   overflow: hidden;
 }
-.v2004_47 {
-  width: 160px;
-  color: rgba(255,255,255,1);
-  position: absolute;
-  top: 852px;
-  left: 919px;
-  font-family: Microsoft Himalaya;
-  font-weight: Regular;
-  font-size: 32px;
-  opacity: 1;
-  text-align: center;
-}
-.v2004_48 {
-  width: 211px;
-  height: 48px;
-  background: rgba(255,255,255,0);
-  opacity: 1;
-  position: absolute;
-  top: 608px;
-  left: 619px;
-  border: 1px solid rgba(0,0,0,0.20000000298023224);
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  border-bottom-left-radius: 10px;
-  border-bottom-right-radius: 10px;
-  overflow: hidden;
-}
+
 .student {
   width: 243px;
   color: rgba(0,0,0,1);
@@ -475,60 +397,8 @@ button {
   opacity: 1;
   text-align: center;
 }
-.v2004_49 {
-  width: 120px;
-  height: 68px;
-  background: rgba(24,144,255,1);
-  opacity: 1;
-  position: absolute;
-  top: 722px;
-  left: 1175px;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  border-bottom-left-radius: 10px;
-  border-bottom-right-radius: 10px;
-  overflow: hidden;
-}
-.v2004_51 {
-  width: 120px;
-  color: rgba(255,255,255,1);
-  position: absolute;
-  top: 718px;
-  left: 1175px;
-  font-family: Microsoft YaHei;
-  font-weight: Regular;
-  font-size: 32px;
-  opacity: 1;
-  text-align: center;
-}
-.v2004_55 {
-  width: 160px;
-  height: 48px;
-  background: rgba(179,185,187,1);
-  opacity: 1;
-  position: absolute;
-  top: 722px;
-  left: 640px;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  border-bottom-left-radius: 10px;
-  border-bottom-right-radius: 10px;
-  overflow: hidden;
-}
-.v2004_65 {
-  width: 160px;
-  height: 48px;
-  background: rgba(179,185,187,1);
-  opacity: 1;
-  position: absolute;
-  top: 722px;
-  left: 919px;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  border-bottom-left-radius: 10px;
-  border-bottom-right-radius: 10px;
-  overflow: hidden;
-}
+
+
 .totalScore {
   width: 163px;
   color: rgba(0,0,0,1);
@@ -541,18 +411,7 @@ button {
   opacity: 1;
   text-align: center;
 }
-.v2004_58 {
-  width: 161px;
-  color: rgba(255,255,255,1);
-  position: absolute;
-  top: 724px;
-  left: 639px;
-  font-family: Microsoft Himalaya;
-  font-weight: Regular;
-  font-size: 36px;
-  opacity: 1;
-  text-align: center;
-}
+
 .answerScore {
   width: 192px;
   color: rgba(0,0,0,1);
@@ -565,52 +424,8 @@ button {
   opacity: 1;
   text-align: center;
 }
-.v2004_67 {
-  width: 152px;
-  color: rgba(0,0,0,1);
-  position: absolute;
-  top: 728px;
-  left: 919px;
-  font-family: Microsoft Himalaya;
-  font-weight: Regular;
-  font-size: 36px;
-  opacity: 1;
-  text-align: center;
-}
-.v2004_68 {
-  width: 121px;
-  color: rgba(255,255,255,1);
-  position: absolute;
-  top: 842px;
-  left: 1175px;
-  font-family: Microsoft YaHei;
-  font-weight: Regular;
-  font-size: 32px;
-  opacity: 1;
-  text-align: center;
-}
-.v2004_45 {
-  width: 100px;
-  color: rgba(0,0,0,1);
-  position: absolute;
-  top: 100px;
-  left: 1095px;
-  font-family: Microsoft YaHei;
-  font-weight: Regular;
-  font-size: 20px;
-  opacity: 1;
-  text-align: center;
-}
-.v2052_2 {
-  width: 20px;
-  height: 20px;
-  background: rgba(0,108,108,1);
-  opacity: 1;
-  position: absolute;
-  top: 108px;
-  left: 1189px;
-  border-radius: 50%;
-}
+
+
 
 .success-message {
   position: absolute; /* 确保位置是绝对的 */
@@ -626,5 +441,20 @@ button {
   color: red; /* 你可以添加更多样式，比如颜色 */
 }
 
+.arrow_picture {
+  width: 40px;
+  height: 30px;
+  background: url("../assets/arrow.png");
+  background-repeat: no-repeat;
+  background-position: center center;
+  background-size: cover;
+  z-index: 10;
+  opacity: 1;
+  position: relative;
+  top: 55px;
+  left: 100px;
+  overflow: hidden;
+}
+
 
 </style>
\ No newline at end of file