大屏设计增加地图图层设置

components/AiDvRender.vue

@@ -50,7 +50,8 @@
       </AiRanking>
       <AiDvMap v-else-if="data.type === 'AiDvMap'" style="width: 100%; height: 100%" :ref="'chart' + index" :key="`AiDvMap${index}`" :theme="theme"></AiDvMap>
       <ai-map v-else-if="data.type=='map'" :mask="data.mask === '1'" :areaId="data.areaId" :is3d="data.is3d==1" :is3dAround="data.is3dAround === '1'"
-              :map-style="`amap://styles/${data.mapStyle}`" :pulseLines="data.pulseLines==1" :map.sync="map" :lib.sync="lib" :onlyShowArea="data.limitArea==1"/>
+              :map-style="`amap://styles/${data.mapStyle}`" :pulseLines="data.pulseLines==1" :map.sync="map" :lib.sync="lib"
+              :onlyShowArea="data.limitArea==1" :satellite="data.layers=='satellite'"/>
       <ai-monitor :src="data.src" v-else-if="data.type === 'monitor'" :type="data.monitorType"/>
       <video style="width: 100%; height: 100%; object-fit: fill;" loop :src="data.src" autoplay v-else-if="data.type === 'video'"/>
       <AiDvPartyOrg style="width: 100%; height: 100%;" v-else-if="data.type === 'partyOrg'" :instance="instance"/>

packages/bigscreen/designer/components/form/componentConfig.vue

@@ -39,10 +39,10 @@
           <div class="layout-config__item--right">
             <el-select size="mini" v-model="config.border" placeholder="请选择边框" clearable>
               <el-option
-                v-for="(item, index) in borderList"
+                  v-for="(item, index) in borderList"
-                :key="index"
+                  :key="index"
-                :label="item"
+                  :label="item"
-                :value="item">
+                  :value="item">
               </el-option>
             </el-select>
           </div>
@@ -93,12 +93,12 @@
             <div class="layout-config__item--right">
               <el-select size="mini" v-model="config.stripe" placeholder="请选择" clearable>
                 <el-option
-                  label="是"
+                    label="是"
-                  value="1">
+                    value="1">
                 </el-option>
                 <el-option
-                  label="否"
+                    label="否"
-                  value="0">
+                    value="0">
                 </el-option>
               </el-select>
             </div>
@@ -132,6 +132,15 @@
               </el-select>
             </div>
           </div>
+          <div class="layout-config__item">
+            <label>地图图层</label>
+            <div class="layout-config__item--right">
+              <el-select size="mini" v-model="config.layers" placeholder="请选择" clearable>
+                <el-option label="地图" value="vector"/>
+                <el-option label="卫星" value="satellite"/>
+              </el-select>
+            </div>
+          </div>
           <div class="layout-config__item">
             <label>选择地区</label>
             <div class="layout-config__item--right">
@@ -139,7 +148,7 @@
             </div>
           </div>
           <div class="layout-config__item">
-            <label>限制显示地区</label>
+            <label>限制地区</label>
             <div class="layout-config__item--right">
               <ai-select v-model="config.limitArea" :selectList="dict.getDict('yesOrNo')"/>
             </div>
@@ -180,10 +189,10 @@
           <div class="layout-config__item--right">
             <el-select size="mini" v-model="config.display" placeholder="请选择类型" clearable>
               <el-option
-                v-for="(item, index) in summaryList"
+                  v-for="(item, index) in summaryList"
-                :key="index"
+                  :key="index"
-                :label="item"
+                  :label="item"
-                :value="item">
+                  :value="item">
               </el-option>
             </el-select>
           </div>
@@ -203,11 +212,11 @@ export default {
     dict: Object,
   },
 
-  data () {
+  data() {
     return {
       borderList: ['border0', 'border1', 'border2', 'border3', 'border4', 'border5', 'border6'],//边框待选项
       summaryList: ['summary0', 'summary1', 'summary2', 'summary3', 'summary4', 'summary6', 'summary5',
-      'summary7', 'summary8', 'summary9', 'summary10', 'summary11', 'summary12', 'summary13', 'summary14', 'summary15'],//汇总待选项
+        'summary7', 'summary8', 'summary9', 'summary10', 'summary11', 'summary12', 'summary13', 'summary14', 'summary15'],//汇总待选项
       //是否显示排名
       tableStatus: [
         {label: '是', value: '1'},
@@ -219,33 +228,32 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-  .componentConfig {
+.componentConfig {
-    .table-config {
+  .table-config {
-      & > div {
+    & > div {
-        display: flex;
+      display: flex;
-        align-items: center;
+      align-items: center;
-        justify-content: space-between;
+      justify-content: space-between;
-        width: 232px;
+      width: 232px;
 
-        :deep( .el-select ) {
+      :deep( .el-select ) {
-          width: 80px
+        width: 80px input {
-          input {
+          width: 80px;
-            width: 80px;
-          }
         }
+      }
 
-        .el-select {
+      .el-select {
+        width: 100%;
+
+        .el-input {
           width: 100%;
 
-          .el-input {
+          :deep( input ) {
-            width: 100%;
+            width: 80px
-
-            :deep( input ) {
-              width: 80px
-            }
           }
         }
       }
     }
   }
+}
 </style>

packages/bigscreen/designer/config.js

@@ -610,6 +610,7 @@ const components = [
             thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/map.png',
             is3dAround: '0',
             limitArea: '0',
+            layers:'vector'
           },
           {
             type: 'AiDvMap',

ui/packages/tools/AiMap.vue

@@ -22,7 +22,8 @@ export default {
     mask: Boolean,
     searchBus: {default: "2"},
     pulseLines: Boolean,
-    onlyShowArea: Boolean
+    onlyShowArea: Boolean,
+    satellite: Boolean
   },
   computed: {
     viewMode() {
@@ -33,7 +34,7 @@ export default {
     return {
       amap: null,
       mapLib: null,
-      loca: null
+      loca: null,
     }
   },
   watch: {
@@ -44,7 +45,7 @@ export default {
     }
   },
   methods: {
-    initMap() {
+    initMap(c = 0) {
       let {plugins, viewMode, mapStyle} = this
       AMapLoader.load({
         key: '54a02a43d9828a8f9cd4f26fe281e74e',
@@ -67,12 +68,16 @@ export default {
           this.amap.on('complete', () => {
             this.amap.setFitView();//视口自适应
           })
-
+          /*增加卫星图层*/
+          if (this.satellite) {
+            this.amap.add([new AMap.TileLayer.RoadNet({zIndex: 11}), new AMap.TileLayer.Satellite({zIndex: 10})])
+          }
+          /* end */
           this.$emit('update:map', this.amap)
           this.$emit("loaded")
           this.mapLoaded()
         }
-      }).catch(this.initMap)
+      }).catch(() => c < 10 ? this.initMap(++c) : new Error("地图加载有问题"))
     },
     getMapArea() {
       const {mapLib: AMap} = this