微调

src/components/Project/ProjectList.vue

@@ -17,7 +17,7 @@
                         <span style="color: #59A3A4">{{ projectLists.projectName }}</span><span style="color: rgb(156 163 175);"> • </span>
                     </div>
                     <div>
-                        <div style="margin-left: 10px;width: 10px;height: 10px;border-radius: 50%;background-color: #ffba00"></div>
+                        <div class="circle" :style="{'background-color':colorlists[Math.floor(Math.random() * colorlists.length)]}" ></div>
                     </div>
                     <el-tag size="mini" style="margin-left: 5px" v-html="projectLists.categoryName"></el-tag><span style="color: rgb(156 163 175);margin-left: 5px"> • </span>
                     <div style="margin-left: 10px">
@@ -39,6 +39,21 @@ export default {
     name: "ProjectList",
     data(){
         return{
+            // 作答卡片颜色设置
+            colorlists: [
+                'hsl(62,90%,49%)',
+                'hsl(138,63%,59%)',
+                'rgb(245,145,135)',
+                'rgb(111,235,245)',
+                'rgb(162,239,120)',
+                'rgb(43,255,255)',
+                'hsl(0,89%,63%)',
+                'rgb(241,125,191)',
+                'hsl(282,85%,64%)',
+                'rgb(255,202,0)',
+                'blueviolet'
+            ]
+
         }
     },
     props: {
@@ -135,4 +150,7 @@ export default {
     flex-wrap: nowrap;
     align-items: center;
 }
+.circle{
+margin-left: 10px;width: 10px;height: 10px;border-radius: 50%;
+}
 </style>