更新banner背景图

src/views/statistics/AuvStatistics.vue

@@ -283,10 +283,11 @@ export default {
   background-color: #ebf1f7;
 
   .banner {
+    background-color: #012458;
     background-image: url(../../../static/images/bannerny1.jpg);
     background-repeat: no-repeat;
     background-position: center;
-    background-size: 100% 100%;
+    background-size: contain;
     width: 100%;
     height: 480px;
     display: flex;

src/views/statistics/HovStatistics.vue

@@ -283,10 +283,11 @@ export default {
   background-color: #ebf1f7;
 
   .banner {
+    background-color: #012458;
     background-image: url(../../../static/images/bannerny1.jpg);
     background-repeat: no-repeat;
     background-position: center;
-    background-size: 100% 100%;
+    background-size: contain;
     width: 100%;
     height: 480px;
     display: flex;

src/views/statistics/RovStatistics.vue

@@ -282,10 +282,11 @@ export default {
   background-color: #ebf1f7;
 
   .banner {
+    background-color: #012458;
     background-image: url(../../../static/images/bannerny1.jpg);
     background-repeat: no-repeat;
     background-position: center;
-    background-size: 100% 100%;
+    background-size: contain;
     width: 100%;
     height: 480px;
     display: flex;

src/views/statistics/ShipStatistics.vue

@@ -70,14 +70,13 @@
 </template>
 
 <script>
-import Vue from 'vue'
 import BarChart from './components/BarChart.vue'
 import PieChart from './components/PieChart.vue'
 import { reportList, shipTotal, shipUnit, shipUnitYear, shipVoyage } from '../../api/statistics'
 import { getYearRange, filterDictItems } from '../../utils/index'
-import { initMapbox, handleWheel, initSprites, triggerLayerClick } from "@/utils/mapbox-utils";
+import { initMapbox } from '@/utils/mapbox-utils'
-import { loadVectorLayer, loadJsonLineFeature, loadJsonPointFeature, highlightFeaturesByProperty } from '@/utils/vector-layer-utils'
+import { loadVectorLayer, loadJsonPointFeature } from '@/utils/vector-layer-utils'
-import { ColorGenerator } from '@/utils/color-generator';
+import { ColorGenerator } from '@/utils/color-generator'
 
 export default {
   components: {
@@ -134,20 +133,20 @@ export default {
     this.getChartBar({ year: '2025' })
   },
   mounted() {
-    initMapbox("workUnitMap_ship", {
+    initMapbox('workUnitMap_ship', {
-      tileKey: "gaode",
+      tileKey: 'gaode',
       zoom: 3,
       center: [110, 31],
       minZoom: 2,
       maxZoom: 29
-    });
+    })
-    initMapbox("voyageMap_ship", {
+    initMapbox('voyageMap_ship', {
-      tileKey: "GEBCO_basemap_NCEI",
+      tileKey: 'GEBCO_basemap_NCEI',
       zoom: 3,
       center: [113, 15],
       minZoom: 2,
       maxZoom: 29
-    });
+    })
   },
   beforeDestroy() {
 
@@ -189,15 +188,15 @@ export default {
     // 参航单位统计
     getShipUnit() {
       shipUnit().then(res => {
-        let geojson = {
+        const geojson = {
-          type: "FeatureCollection",
+          type: 'FeatureCollection',
           features: []
-        };
+        }
         res.array.forEach(element => {
           geojson.features.push({
-            type: "Feature",
+            type: 'Feature',
             geometry: {
-              type: "Point",
+              type: 'Point',
               coordinates: [element.unit_lon, element.unit_lat]
             },
             properties: {
@@ -206,9 +205,9 @@ export default {
               create_time: element.create_time,
               tsy_id: element.tsy_id
             }
-          });
+          })
-        });
+        })
-        loadJsonPointFeature("workUnit", "blue", geojson, "unit_name", "workUnitMap_ship");
+        loadJsonPointFeature('workUnit', 'blue', geojson, 'unit_name', 'workUnitMap_ship')
 
         const typeCount = res.array.reduce((acc, unit) => {
           const type = unit.unit_type
@@ -225,13 +224,13 @@ export default {
     // 航次统计
     gitShipVoyage(params = {}) {
       shipVoyage(params).then(res => {
-        let i = 0;
+        let i = 0
-        const colors = ColorGenerator.generateDivergingColors(res.array.length);
+        const colors = ColorGenerator.generateDivergingColors(res.array.length)
         // 添加轨迹图层
         res.array.forEach(item => {
           // 加载轨迹图层
-          loadVectorLayer(item.voyage_name, ["line", "symbol"], [colors[i], "#FFFFFF"], "visible", "voyageMap_ship", "dsds");
+          loadVectorLayer(item.voyage_name, ['line', 'symbol'], [colors[i], '#FFFFFF'], 'visible', 'voyageMap_ship', 'dsds')
-          i++;
+          i++
         })
       })
     },
@@ -306,10 +305,11 @@ export default {
   background-color: #ebf1f7;
 
   .banner {
+    background-color: #012458;
     background-image: url(../../../static/images/bannerny1.jpg);
     background-repeat: no-repeat;
     background-position: center;
-    background-size: 100% 100%;
+    background-size: contain;
     width: 100%;
     height: 480px;
     display: flex;

src/views/statistics/UuvMemberStatistics.vue

@@ -266,10 +266,11 @@ export default {
   background-color: #ebf1f7;
 
   .banner {
+    background-color: #012458;
     background-image: url(../../../static/images/bannerny1.jpg);
     background-repeat: no-repeat;
     background-position: center;
-    background-size: 100% 100%;
+    background-size: contain;
     width: 100%;
     height: 480px;
     display: flex;

src/views/statistics/UuvUnitStatistics.vue

@@ -395,10 +395,11 @@ export default {
   background-color: #ebf1f7;
 
   .banner {
+    background-color: #012458;
     background-image: url(../../../static/images/bannerny1.jpg);
     background-repeat: no-repeat;
     background-position: center;
-    background-size: 100% 100%;
+    background-size: contain;
     width: 100%;
     height: 480px;
     display: flex;