完善首页样式

src/assets/naive-theme.ts

@@ -72,7 +72,7 @@ const themeOverrides: GlobalThemeOverrides = {
     borderRadius: '0'
   },
   Progress: {
-    fillColor: 'linear-gradient(to right, white, red);'
+    fillColor: 'linear-gradient(to right, #5ad8a6, rgba(0,212,255,1));'
   },
   Table: {
     thColor: '#1f426b',

src/components/map.vue

@@ -34,6 +34,6 @@ function _init(e: any) {
 .mapContainer {
   width: 100%;
   height: 100%;
-  mask-image: radial-gradient(circle at center,#000 80%, transparent 100%);
+  mask-image: radial-gradient(circle at center, #030E25 70%, transparent 76%);
 }
 </style>

src/pages/views/home/components/HomePage.vue

@@ -242,6 +242,7 @@
                             type="line"
                             :percentage="item.pratic"
                             :show-indicator="false"
+                            :class="{ resetStyle: indexd === 3 }"
                             processing
                           />
                         </div>
@@ -807,7 +808,7 @@ const leftContent = ref({
                   },
                   {
                     offset: 1,
-                    color: 'rgba(231, 185, 44, 1)'
+                    color: 'rgba(246,189,22,1)'
                   }
                 ])
               }
@@ -1230,6 +1231,10 @@ function changeFn(id: number, item: any) {
         &>div:last-child {
           height: 40px;
           padding: 13px 0;
+
+          :deep(.resetStyle .n-progress-graph-line-fill) {
+            background: linear-gradient(to right, #945fb9, rgba(0, 212, 255, 1)) !important;
+          }
         }
       }
     }
@@ -1294,4 +1299,5 @@ function changeFn(id: number, item: any) {
     }
   }
 }
-</style>
+</style>
+<!-- .n-progress .n-progress-graph .n-progress-graph-line .n-progress-graph-line-rail .n-progress-graph-line-fill -->

src/pages/views/home/index.vue

@@ -34,7 +34,7 @@ weatherService.getWeather().then((res) => { weather.value = res })
 <template>
   <div class="home">
     <div class="home-top">
-      <!-- <img src="../../../assets/img/6.svg"> -->
+      <img src="../../../assets/img/6.svg">
       <div class="home-top-user">
         <div>安全运营<span>100</span>天</div>
         <div v-if="weather">
@@ -69,11 +69,12 @@ weatherService.getWeather().then((res) => { weather.value = res })
       <div class="home-content-center">
         <Map />
       </div>
+      <div class="home-content-left-img" />
+      <div class="home-content-right-img" />
       <component :is="currentComponent" />
     </div>
     <div class="home-bottom">
-      xxxx
-      <!-- 雅安市公共交通集团有限公司 -->
+      雅安市公共交通集团有限公司
     </div>
   </div>
 </template>
@@ -208,12 +209,35 @@ weatherService.getWeather().then((res) => { weather.value = res })
       left: 7px;
       background: url(../../../assets/img/8.svg) no-repeat left top;
       background-size: cover;
+
+      &-img {
+        background: url(../../../assets/img/35.png) no-repeat left top;
+        background-size: cover;
+        width: 175px;
+        position: absolute;
+        left: 1396px;
+        top: 0;
+        height: 103%;
+        z-index: 2;
+        background-position: -113px 0;
+      }
     }
 
     &-right {
       right: 7px;
       background: url(../../../assets/img/9.svg) no-repeat left top;
       background-size: cover;
+      &-img {
+        background: url(../../../assets/img/34.png) no-repeat right top;
+        background-size: cover;
+        width: 175px;
+        position: absolute;
+        right: 1394px;
+        top: 0;
+        height: 103%;
+        z-index: 2;
+        background-position: -203px 0;
+      }
     }
 
     &-center {