指挥大屏

build/webpack.dev.conf.js

@@ -60,7 +60,7 @@ const devWebpackConfig = merge(baseWebpackConfig, {
     // copy custom static assets
     new CopyWebpackPlugin([
       {
-        from: path.resolve(__dirname, '../static'),
+        from: path.resolve(__dirname,'../public/static'),
         to: config.dev.assetsSubDirectory,
         ignore: ['.*']
       }

build/webpack.prod.conf.js

@@ -46,7 +46,7 @@ const webpackConfig = merge(baseWebpackConfig, {
       filename: utils.assetsPath('css/[name].[contenthash].css'),
       // Setting the following option to `false` will not extract CSS from codesplit chunks.
       // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
-      // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`, 
+      // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`,
       // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
       allChunks: true,
     }),
@@ -111,7 +111,7 @@ const webpackConfig = merge(baseWebpackConfig, {
     // copy custom static assets
     new CopyWebpackPlugin([
       {
-        from: path.resolve(__dirname, '../static'),
+        from: path.resolve(__dirname, '../public/static'),
         to: config.build.assetsSubDirectory,
         ignore: ['.*']
       }

config/index.js

@@ -8,7 +8,7 @@ module.exports = {
   dev: {
 
     // Paths
-    assetsSubDirectory: 'static',
+    assetsSubDirectory: 'public/static',
     assetsPublicPath: '/',
     proxyTable: {
       '/admin': {
@@ -53,7 +53,7 @@ module.exports = {
 
     // Paths
     assetsRoot: path.resolve(__dirname, '../dist'),
-    assetsSubDirectory: 'static',
+    assetsSubDirectory: 'public/static',
     assetsPublicPath: '/',
 
     /**

src/views/command/index.vue

@@ -7,15 +7,15 @@
         <div></div>
         <div>GIS地图</div>
       </div>
-      <div @click="mapTypeClick(2)"  :class="mapType==2?'map-type-check':''">
+      <div @click="mapTypeClick(2)" :class="mapType==2?'map-type-check':''">
         <div></div>
         <div>水利地图</div>
       </div>
-      <div @click="mapTypeClick(3)"  :class="mapType==3?'map-type-check':''">
+      <div @click="mapTypeClick(3)" :class="mapType==3?'map-type-check':''">
         <div></div>
         <div>多光谱地图</div>
       </div>
-      <div @click="mapTypeClick(4)"  :class="mapType==4?'map-type-check':''">
+      <div @click="mapTypeClick(4)" :class="mapType==4?'map-type-check':''">
         <div></div>
         <div>全景地图</div>
       </div>
@@ -92,7 +92,7 @@
   import dateRight from './dateRight'
   import {mapGetters} from "vuex";
   import api from '@/api/main/index'
-  import driver from '@/assets/js/driver.json'
+  import driver from '../../../public/static/driver.json'
 
   export default {
     name: "command-container",
@@ -115,7 +115,7 @@
         // ],
         nameMarkList: [],
         polygonList: [],
-        driverList:[]
+        driverList: []
       };
     },
     created() {
@@ -124,7 +124,6 @@
     mounted() {
       let me = this;
       this.map = new AMap.Map("indexMap", {
-        zoom: 9,
         center: [118.750078, 31.983115],
         // features: ['bg'],
         mapStyle: "amap://styles/dark",
@@ -134,6 +133,7 @@
       this.map.on("complete", function () {
 
         me.addBound();
+        me.map.setFitView(this.polygonList)
         // me.nameMark.map(item => {
         //   me.addRegionMarker(item);
         // });
@@ -146,11 +146,11 @@
     },
     components: {dateLeft, dateRight},
     methods: {
-      getDriver(){
-        const {data}=driver
-        data.map(item=>{
-          let polygons=this.returnDriver(item)
-          if(polygons){
+      getDriver() {
+        const {data} = driver
+        data.map(item => {
+          let polygons = this.returnDriver(item)
+          if (polygons) {
             this.driverList.push(polygons)
           }
         })
@@ -166,18 +166,18 @@
             )
           }
           polygons = new AMap.Polygon({
-            zIndex:11,
+            zIndex: 11,
             path: path,
-            strokeColor: "#09b8bd", //线颜色
+            strokeColor: "#176061", //线颜色
             strokeOpacity: 1, //线透明度
             strokeWeight: 1, //线宽
             strokeStyle: "solid", //线样式
             strokeDasharray: [10, 5], //补充线样式
-            fillColor: "#0FBA99",
+            fillColor: "#176061",
             fillOpacity: 1
           });
-          polygons.name=item.name
-          polygons.id=item.id
+          polygons.name = item.name
+          polygons.id = item.id
           polygons.on('click', function () {
             console.log(this)
           })
@@ -185,17 +185,17 @@
         }
         return polygons
       },
-      mapTypeClick(mapType){
-        this.mapType=mapType
-        if(mapType==1){
-          this.map.setFeatures(['bg','point','road','building'])
-        }else{
+      mapTypeClick(mapType) {
+        this.mapType = mapType
+        if (mapType == 1) {
+          this.map.setFeatures(['bg', 'point', 'road', 'building'])
+        } else {
           this.map.setFeatures(['bg'])
         }
       },
       typeLick(type) {
         this.activeType = type;
-        this.map.setCenter(this.center)
+        this.map.setFitView(this.polygonList)
       },
       addBound() {
         let me = this;
@@ -213,7 +213,7 @@
                   strokeWeight: 1,
                   path: path,
                   fillOpacity: 0,
-                  strokeColor: "red"
+                  strokeColor: "#9BF1F6"
                 });
                 me.polygonList.push(polygon)
                 me.map.add(polygon);
@@ -254,17 +254,19 @@
     width: 100%;
     height: 100%;
 
-    .problem-marker{
+    .problem-marker {
       position: absolute;
       bottom: 0.3rem;
       right: 7.3rem;
       display: flex;
+
       > div {
         margin-left: 0.2rem;
         display: flex;
         width: 0.84rem;
         align-items: center;
-        > img{
+
+        > img {
           width: 0.24rem;
           height: 0.24rem;
           margin-right: 0.1rem;
@@ -290,6 +292,7 @@
         display: flex;
         width: 1.025rem;
         cursor: pointer;
+
         > div:first-child {
           background: #ffffff;
           width: 0.025rem;
@@ -311,12 +314,12 @@
 
       .map-type-check {
         > div:first-child {
-          background: #36B8B3!important;
+          background: #36B8B3 !important;
         }
 
         > div {
           background: transparent;
-          color: #4BFFF8!important;
+          color: #4BFFF8 !important;
         }
       }
     }