fix: UI更新，调节Coder测试页按钮大小

顶部栏字体大小
UI规则

UI规则.md

@@ -0,0 +1,26 @@
+# UI规则 更新中
+
+## 1 字体
+
+### 1.1 大小
+
+1. 32px
+2. 24px
+3. 16px
+4. 12px
+
+## 2 色彩
+
+### 2.1 系统主题色
+
+![img.png](img.png)
+
+从左至右的颜色分别为
+
+<font color="#f3a64a">橙色：#f3a64a</font>
+
+<font color="#71bbdb">天蓝色：#71bbdb</font>
+
+<font color="#50a879">绿色：#50a879</font>
+
+<font color="#3a85bb">海蓝色：#fcfdfe</font>

src/components/GlobalHeader/GlobalHeader.vue

@@ -33,8 +33,8 @@
           </sup>
           <svg height="32" viewBox="0 0 1024 1024" width="32" xmlns="http://www.w3.org/2000/svg">
             <path
-                    d="M849.6 713.4c8.4-0.4 16.7 1.8 23.8 6.4-28.9-18.5-46.4-50.4-46.3-84.8V436c0-145.9-105.7-267.6-246.9-297.5v-7.2c0-37.1-30.1-67.1-67.2-67.1h-0.1c-37.1 0-67.3 30.1-67.3 67.2v7C304.3 168.4 198.7 290 198.7 436v199.1c0 35.7-18.6 66.9-46.4 84.8 7-4.6 15.4-6.9 23.8-6.4-24.7-0.9-45.5 18.4-46.4 43.1-0.9 24.7 18.4 45.5 43.1 46.4h676.6c24.7 0.1 44.8-20 44.9-44.7 0.1-24.8-19.9-44.9-44.7-44.9zM513 959.8c62 0 112.2-50.2 112.2-111.9H400.7c0 61.7 50.2 111.9 112.3 111.9z"
-                    fill="#E8AA5B"></path>
+              d="M849.6 713.4c8.4-0.4 16.7 1.8 23.8 6.4-28.9-18.5-46.4-50.4-46.3-84.8V436c0-145.9-105.7-267.6-246.9-297.5v-7.2c0-37.1-30.1-67.1-67.2-67.1h-0.1c-37.1 0-67.3 30.1-67.3 67.2v7C304.3 168.4 198.7 290 198.7 436v199.1c0 35.7-18.6 66.9-46.4 84.8 7-4.6 15.4-6.9 23.8-6.4-24.7-0.9-45.5 18.4-46.4 43.1-0.9 24.7 18.4 45.5 43.1 46.4h676.6c24.7 0.1 44.8-20 44.9-44.7 0.1-24.8-19.9-44.9-44.7-44.9zM513 959.8c62 0 112.2-50.2 112.2-111.9H400.7c0 61.7 50.2 111.9 112.3 111.9z"
+              fill="#E8AA5B"></path>
           </svg>
         </div>
       </el-tooltip>
@@ -50,12 +50,12 @@
               <div v-else>
                 <svg height="32" viewBox="0 0 1025 1024" width="32" xmlns="http://www.w3.org/2000/svg">
                   <path
-                          d="M511.999723 331.913794m-117.748854 0a117.748854 117.748854 0 1 0 235.497708 0 117.748854 117.748854 0 1 0-235.497708 0Z"
-                          fill="#82BAD8"></path>
+                    d="M511.999723 331.913794m-117.748854 0a117.748854 117.748854 0 1 0 235.497708 0 117.748854 117.748854 0 1 0-235.497708 0Z"
+                    fill="#82BAD8"></path>
                   <path
-                          d="M511.999723 0.000554A511.999723 511.999723 0 1 0 1025.10767 512.000277 512.276779 512.276779 0 0 0 511.999723 0.000554zM792.380524 779.636496a24.935051 24.935051 0 0 1-24.935052-24.935052
+                    d="M511.999723 0.000554A511.999723 511.999723 0 1 0 1025.10767 512.000277 512.276779 512.276779 0 0 0 511.999723 0.000554zM792.380524 779.636496a24.935051 24.935051 0 0 1-24.935052-24.935052
                   255.445749 255.445749 0 0 0-510.614442 0 24.935051 24.935051 0 0 1-49.870103 0 304.76174 304.76174 0 0 1 205.29859-288.138372 167.896013 167.896013 0 1 1 199.480412 0 304.76174 304.76174 0 0 1 205.575646 288.138372 24.935051 24.935051 0 0 1-24.935051 24.935052z"
-                          fill="#82BAD8"></path>
+                    fill="#82BAD8"></path>
                 </svg>
               </div>
             </template>
@@ -68,195 +68,201 @@
 </template>
 
 <script>
-  import InfoCard from "@/components/GlobalHeader/InfoCard.vue";
+import InfoCard from "@/components/GlobalHeader/InfoCard.vue";
 
-  export default {
-    name: "GlobalHeader",
-    components: { InfoCard },
-    data() {
-      return {
-        menuIndex: [
-          ["1", "Portal"],
-          ["2", "Task"],
-          ["3", "Course"],
-          ["4", "Project"],
-          ["5", "Test"],
-          ["6", "Home"],
-          ["7", "Manage"],
-          ["8", "Problem"],
-          ["9", "CourseDetail"],
+export default {
+  name: "GlobalHeader",
+  components: {InfoCard},
+  data() {
+    return {
+      menuIndex: [
+        ["1", "Portal"],
+        ["2", "Task"],
+        ["3", "Course"],
+        ["4", "Project"],
+        ["5", "Test"],
+        ["6", "Home"],
+        ["7", "Manage"],
+        ["8", "Problem"],
+        ["9", "CourseDetail"],
 
-        ]
-      };
+      ]
+    };
+  },
+  computed: {
+    isLogin() {
+      return this.$store.getters.isLogin;
     },
-    computed: {
-      isLogin() {
-        return this.$store.getters.isLogin;
-      },
-      name() {
-        return this.$store.state.user.name || "无名氏";
-      },
-      singleName() {
-        return this.name.substring(0, 1);
-      },
-      isTeacher() {
-        return this.$store.getters.isTeacher;
-      },
-      isStudent() {
-        return this.$store.getters.isStudent;
-      },
-      activeMenu() {
-        let out = "1";
-        this.menuIndex.forEach(i => {
-          if (i[1] === this.$route.name) {
-            out = i[0];
-          }
-        });
-        return out;
-      },
-      unReadMessages() {
-        return this.$store.getters.unReadMessages;
-      },
-      unReadAnnouncements() {
-        return this.$store.getters.unReadAnnouncements;
-      },
-      unReadInvitations(){
-        return this.$store.getters.unReadInvitations;
-      },
-      unreadNum() {
-        const x = this.unReadAnnouncements === undefined ? 0 : this.unReadAnnouncements.length;
-        const y = this.unReadMessages === undefined ? 0 : this.unReadMessages.length;
-        const z = this.unReadInvitations === undefined ? 0 : this.unReadInvitations.length;
-        return x + y + z> 99 ? "99+" : x + y + z + "";
-      },
+    name() {
+      return this.$store.state.user.name || "无名氏";
     },
-
-    watch: {
-      isLogin(newData) {
-        if (newData) {
-          this.$store.dispatch("fetchMessages", this);
-        }
-      },
-      $route() {
-        if (this.isLogin) {
-          this.$store.dispatch("fetchMessages", this);
+    singleName() {
+      return this.name.substring(0, 1);
+    },
+    isTeacher() {
+      return this.$store.getters.isTeacher;
+    },
+    isStudent() {
+      return this.$store.getters.isStudent;
+    },
+    activeMenu() {
+      let out = "1";
+      this.menuIndex.forEach(i => {
+        if (i[1] === this.$route.name) {
+          out = i[0];
         }
-      }
+      });
+      return out;
+    },
+    unReadMessages() {
+      return this.$store.getters.unReadMessages;
+    },
+    unReadAnnouncements() {
+      return this.$store.getters.unReadAnnouncements;
+    },
+    unReadInvitations() {
+      return this.$store.getters.unReadInvitations;
+    },
+    unreadNum() {
+      const x = this.unReadAnnouncements === undefined ? 0 : this.unReadAnnouncements.length;
+      const y = this.unReadMessages === undefined ? 0 : this.unReadMessages.length;
+      const z = this.unReadInvitations === undefined ? 0 : this.unReadInvitations.length;
+      return x + y + z > 99 ? "99+" : x + y + z + "";
     },
+  },
 
-    created() {
-      if (this.isLogin) {
+  watch: {
+    isLogin(newData) {
+      if (newData) {
         this.$store.dispatch("fetchMessages", this);
       }
     },
+    $route() {
+      if (this.isLogin) {
+        this.$store.dispatch("fetchMessages", this);
+      }
+    }
+  },
+
+  created() {
+    if (this.isLogin) {
+      this.$store.dispatch("fetchMessages", this);
+    }
+  },
 
-    methods: {
-      toPortal() {
-        this.$router.push("/portal");
-      },
-      toHome() {
-        this.$router.push("/home");
-      },
-      toMessage() {
-        this.$router.push("/message");
-      },
-      handleMenuSelect(key) {
-        let target = "/portal";
-        this.menuIndex.forEach(i => {
-          if (i[0] === key) {
-            target = i[1];
-          }
-        });
-        this.$router.push({ name: target });
-      },
+  methods: {
+    toPortal() {
+      this.$router.push("/portal");
     },
-  };
+    toHome() {
+      this.$router.push("/home");
+    },
+    toMessage() {
+      this.$router.push("/message");
+    },
+    handleMenuSelect(key) {
+      let target = "/portal";
+      this.menuIndex.forEach(i => {
+        if (i[0] === key) {
+          target = i[1];
+        }
+      });
+      this.$router.push({name: target});
+    },
+  },
+};
 </script>
 
 <style scoped>
-  #global-header-body {
-    width: calc(100% - 2px);
-    height: 48px;
-    position: sticky;
-    top: 0;
-    z-index: 999;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    background: white;
-    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-    border: 1px solid #e4e7ed;
-  }
+#global-header-body {
+  width: calc(100% - 2px);
+  height: 58px;
+  position: sticky;
+  top: 0;
+  z-index: 999;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: white;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  border: 1px solid #e4e7ed;
+}
+
+#global-header-logo {
+  height: 32px;
+  margin-left: 150px;
+  cursor: pointer;
+}
 
-  #global-header-logo {
-    height: 32px;
-    margin-left: 150px;
-    cursor: pointer;
-  }
+:deep(.el-menu--horizontal) {
+  height: 58px;
+}
 
-  :deep(.el-menu--horizontal) {
-    height: 48px;
-  }
+:deep(.el-menu--horizontal>.el-submenu .el-submenu__title) {
+  height: 58px;
+  position: relative;
+  /*bottom: 2px;*/
+}
 
-  :deep(.el-menu--horizontal>.el-submenu .el-submenu__title) {
-    height: 48px;
-    position: relative;
-    bottom: 5px;
-  }
+:deep(.el-menu--horizontal>.el-menu-item) {
+  height: 58px;
+  position: relative;
+  /*bottom: 2px;*/
+}
 
-  :deep(.el-menu--horizontal>.el-menu-item) {
-    height: 48px;
-    position: relative;
-    bottom: 5px;
-  }
+#menu li {
+  color: black;
+  border-bottom: none;
+  font-size: large;
+}
 
-  #menu li{
-    color: black;
-    border-bottom: none;
-  }
+#menu li:hover {
+  background: rgba(113, 187, 219, 0.15);
+  /*color: white;*/
+}
 
 
-  #global-header-icon {
-    width: 120px;
-    margin-right: 150px;
-    display: flex;
-    justify-content: space-around;
-  }
+#global-header-icon {
+  width: 120px;
+  margin-right: 150px;
+  display: flex;
+  justify-content: space-around;
+}
 
-  .global-header-icon-content {
-    cursor: pointer;
-  }
+.global-header-icon-content {
+  cursor: pointer;
+}
 
-  #info-circle {
-    height: 32px;
-    width: 32px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    border-radius: 50%;
-    background: #619dc9;
-  }
+#info-circle {
+  height: 32px;
+  width: 32px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 50%;
+  background: #619dc9;
+}
 
-  #info-circle span {
-    color: white;
-    font-weight: bold;
-  }
+#info-circle span {
+  color: white;
+  font-weight: bold;
+}
 
-  .reminder {
-    position: absolute;
-    top: 0;
-    right: 0;
-    transform: translateY(-25%) translateX(35%);
-    background-color: #f56c6c;
-    border-radius: 10px;
-    color: #fff;
-    display: inline-block;
-    font-size: 12px;
-    height: 18px;
-    line-height: 18px;
-    padding: 0 6px;
-    text-align: center;
-    white-space: nowrap;
-    border: 1px solid #fff;
-  }
+.reminder {
+  position: absolute;
+  top: 0;
+  right: 0;
+  transform: translateY(-25%) translateX(35%);
+  background-color: #f56c6c;
+  border-radius: 10px;
+  color: #fff;
+  display: inline-block;
+  font-size: 12px;
+  height: 18px;
+  line-height: 18px;
+  padding: 0 6px;
+  text-align: center;
+  white-space: nowrap;
+  border: 1px solid #fff;
+}
 </style>

src/views/CoderPage/ExamDetail.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="exam-container">
-    <el-card style="background: none; box-shadow:none;border: none">
+    <el-card style="background: none; box-shadow:none;border: none;padding: 0;">
       <template #header>
         <page-header>
           <template #actions>
@@ -48,7 +48,7 @@
               删除考试
             </el-button>
           </template>
-          <span style="font-size: 36px;font-family: 'Inter',sans-serif">{{ exam.name }}</span>
+          <span style="font-size: 32px;font-family: 'Inter',sans-serif">{{ exam.name }}</span>
         </page-header>
       </template>
 
@@ -229,11 +229,13 @@
             <template #actions>
               <el-button
                 type="primary"
+                size="small"
                 @click="download">
                 下载成绩单
               </el-button>
               <el-button
                 @click="downloadDetailed"
+                size="small"
                 type="primary">
                 下载详细成绩单
               </el-button>
@@ -747,6 +749,8 @@ export default {
 
 ::v-deep .el-card__header {
   border-bottom: 1px solid black;
+  padding-left: 0;
+  padding-right: 0;
 }
 
 ::v-deep .son-card .el-card__header {