保存进度！

code/web/task_schedule/src/components/ArchievementChartComponent.vue

@@ -14,7 +14,7 @@
 </template>
 
 <script lang="ts">
-import { reactive, computed, onMounted } from "vue";
+import { reactive, onMounted } from "vue";
 import * as echarts from "echarts";
 
 export default {

code/web/task_schedule/src/components/HonorListComponent.vue

@@ -0,0 +1,67 @@
+<!--
+ * @Author: Kane
+ * @Date: 2023-03-08 14:18:39
+ * @LastEditors: Kane
+ * @FilePath: /task_schedule/src/components/HonorListComponent.vue
+ * @Description: 光荣榜组件
+ * 
+ * Copyright (c) ${2022} by Kane, All Rights Reserved. 
+-->
+<template>
+    <div class="honorlist-wrapper">
+        <span class="title">“90俱乐部”{{ $props.month }}月入围坐席</span>
+    </div>
+</template>
+
+<script lang="ts">
+export default {
+    name: "HonorListComponent",
+    props: {
+        month: {
+            type: String,
+            require: true,
+        },
+        leadingReward: {
+            type: String,
+            require: true,
+        },
+        advanceReward: {
+            type: String,
+            require: true,
+        },
+    },
+    setup(props)
+    {
+        return {};
+    },
+};
+</script>
+
+<style scoped lang="scss">
+.honorlist-wrapper {
+    height: 240px;
+    width: 360px;
+    border-radius: 5px;
+
+    background-color: $color-honorlist-bg;
+    backdrop-filter: blur(10px);
+
+    padding: 15px;
+
+    >*+* {
+        margin-top: 15px;
+    }
+
+    .title {
+        display: block;
+        text-align: center;
+
+        font: {
+            family: "FZ-ZHUOHEI";
+            size: 1.4rem;
+        }
+
+        color: goldenrod;
+    }
+}
+</style>