日常开发

src/views/score/index.vue

@@ -19,7 +19,8 @@
               </el-select>
             </div>
             <div class="li"> 成绩 </div>
-            <div class="li more datePicker"> 日期 <el-date-picker v-model="date" type="date" value-format="YYYY-MM-DD" placeholder="选择日期" @change="bindDateChange" clearable>
+            <div class="li more datePicker"> 日期 <el-date-picker v-model="date" type="date" value-format="YYYY-MM-DD"
+                placeholder="选择日期" @change="bindDateChange" clearable>
               </el-date-picker></div>
             <div class="li"> 测试报告 </div>
           </div>
@@ -47,7 +48,7 @@ const { proxy } = getCurrentInstance() as any;
 const router = useRouter();
 const route = useRoute();
 const dic: any = dataDictionary;
-const timeProjectList = ['basketballv1','run50','run60','run70','run100','run200','run400','run800','run1000','runa800','runa1000','runwb800','runwb1000'];
+const timeProjectList = ['basketballv1', 'run50', 'run60', 'run70', 'run100', 'run200', 'run400', 'run800', 'run1000', 'runa800', 'runa1000', 'runwb800', 'runwb1000'];
 const data = reactive<any>({
   parameter: {
     id: 0,
@@ -271,16 +272,17 @@ onMounted(() => {
   display: flex;
   flex-direction: column;
   height: calc(100% - 12vh);
+  background: linear-gradient(67deg, #092941 -85%, #2A484B 96%);
 }
 
 .type {
   height: 5vh;
   display: flex;
   text-align: center;
-  background: #f3f3f3;
-  color: #63cacc;
   font-size: 2vh;
   padding: 0 4px;
+  color: #1A293A;
+  background: radial-gradient(96% 96% at 2% 32%, #FFFFFF 0%, #FCFDFD 54%, #E1E4E7 100%);
 }
 
 .type .li {
@@ -316,9 +318,10 @@ onMounted(() => {
 
 .list {
   text-align: center;
-  font-size: 2vh;
-  padding: 0 4px;
+  font-size: 2.5vh;
+  // padding: 0 4px;
   height: calc(100% - 5vh);
+  color: #ffffff;
 }
 
 .list .ul {
@@ -334,7 +337,7 @@ onMounted(() => {
 }
 
 .list .ul .date {
-  font-size: 1.8vh;
+  // font-size: 1.8vh;
 }
 
 .list .ul .url {
@@ -369,6 +372,24 @@ onMounted(() => {
 .scrollBox {
   height: 98%;
   overflow-y: scroll;
+
+  &::-webkit-scrollbar {
+    width: 12px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    border-width: 2px;
+    border-radius: 4px;
+    border-style: dashed;
+    border-color: transparent;
+    background-color: rgba(26, 62, 78, 0.9);
+    background-clip: padding-box;
+  }
+
+  &::-webkit-scrollbar-button:hover {
+    border-radius: 6px;
+    background: rgba(26, 62, 78, 1);
+  }
 }
 
 .btn {