地图视图 --fix1

@CONTROL/地图/CONTROL-BASE.template.ftl

 <template>
-    <div>暂不支持</div>
+    <div :id="mapId" class="map"></div>
 </template>
\ No newline at end of file

@CONTROL/地图/CONTROL-BASE.vue.ftl

@@ -85,13 +85,13 @@ import 'echarts/map/js/china.js'
                     return;
                 }
                 if (Object.is(action, "load")) {
-                    this.load(Object.assign(data);
+                    this.load(Object.assign(data));
                 }
                 if (Object.is(action, "search")) {
-                    this.load(Object.assign(data);
+                    this.load(Object.assign(data));
                 }
                 if (Object.is(action, "quicksearch")) {
-                    this.load(Object.assign({ query: data });
+                    this.load(Object.assign({ query: data }));
                 }
                 if (Object.is(action, "refresh")) {
                     this.refresh();
@@ -100,7 +100,7 @@ import 'echarts/map/js/china.js'
         }
         if(AppCenterService && AppCenterService.getMessageCenter()){
             this.appStateEvent = AppCenterService.getMessageCenter().subscribe(({ name, action, data }) =>{
-                if(!Object.is(name,"${ctrl.getPSAppDataEntity().getCodeName()}")){
+                if(!Object.is(name,"MOBMAP")){
                     return;
                 }
                 if(Object.is(action,'appRefresh')){
@@ -108,20 +108,6 @@ import 'echarts/map/js/china.js'
                 }
             })
         }
-        <#if view.getViewType()?? && view.getViewType()=='DEMOBPICKUPMDVIEW'>
-        if (!this.isMutli) {
-            if (this.selectedData && this.selectedData.length > 0) {
-                this.radio = this.selectedData[0].srfkey;
-            }
-        } else {
-            if (this.selectedData && this.selectedData.length > 0) {
-                this.checkboxList = [];
-                this.selectedData.forEach((item: any) => {
-                    this.checkboxList.push(item.srfkey);
-                })
-            }
-        }
-        </#if>
     }
 
     /**
@@ -166,6 +152,130 @@ import 'echarts/map/js/china.js'
             })
         })
     }
+
+    /**
+     * map对象
+     *
+     * @type {}
+     * @memberof ${srfclassname('${ctrl.name}')}Base
+     */   
+    public map :any;
+
+    /**
+     * 图表div绑定的id
+     *
+     * @type {}
+     * @memberof ${srfclassname('${ctrl.name}')}Base
+     */   
+    public mapId:string = this.$util.createUUID();
+
+    /**
+     * 数据
+     *
+     * @type {}
+     * @memberof ${srfclassname('${ctrl.name}')}Base
+     */   
+    public dataList: any = []
+
+
+    public mapStyle = "${ctrl.getMapStyle()}"
+
+    public mapItems = [
+    <#if ctrl.getPSSysMapItems?? && ctrl.getPSSysMapItems()??>
+    <#list ctrl.getPSSysMapItems() as mapitem>
+                        {
+                            type:'${mapitem.getItemType()}',
+                            bkcolor:'<#if mapitem.getBKColorPSAppDEField?? && mapitem.getBKColorPSAppDEField()??>${mapitem.getBKColorPSAppDEField().getCodeName()?lower_case}</#if>',
+                            color:'<#if mapitem.getColorPSAppDEField?? && mapitem.getColorPSAppDEField()??>${mapitem.getColorPSAppDEField().getCodeName()?lower_case}</#if>',
+                            content:'<#if mapitem.getContentPSDEField?? && mapitem.getContentPSDEField()??>${mapitem.getContentPSDEField().getCodeName()?lower_case}</#if>',
+                            latitude:'<#if mapitem.getLatitudePSAppDEField?? && mapitem.getLatitudePSAppDEField()??>${mapitem.getLatitudePSAppDEField().getCodeName()?lower_case}</#if>',
+                            longitude:'<#if mapitem.getLongitudePSAppDEField?? && mapitem.getLongitudePSAppDEField()??>${mapitem.getLongitudePSAppDEField().getCodeName()?lower_case}</#if>',
+                            text:'<#if mapitem.getTextPSAppDEField?? && mapitem.getTextPSAppDEField()??>${mapitem.getTextPSAppDEField().getCodeName()?lower_case}</#if>',
+                            tips:'<#if mapitem.getTipsPSAppDEField?? && mapitem.getTipsPSAppDEField()??>${mapitem.getTipsPSAppDEField().getCodeName()?lower_case}</#if>',
+                        },
+    </#list>
+    </#if>
+                    ]
+
+    //点击弹出
+    public tooltip = {
+        formatter: (params: any, ticket: any, callback: any) => {
+            return params.seriesName + '<br />' + params.name + '：' + (params.value ? params.value : 0)
+        }
+    }
+    // 旁边的滑动栏
+    public visualMap = {
+        min: 0,
+        max: 10,
+        left: 'left',
+        top: 'bottom',
+        text: ['高', '低'],
+        inRange: {
+            color: ['#e0ffff', '#006edd']
+        },
+        show: true
+    }
+
+    //地图参数
+    public geo = {
+        map: 'china',
+        roam: false,
+        zoom: 1.23,
+        label: {
+            normal: {
+                show: true,
+                fontSize: '10',
+                // 字体颜色
+                color: '${ctrl.getColor()}',
+            }
+        },
+        itemStyle: {
+            normal: {
+                // 边框颜色
+                borderColor: '${ctrl.getBorderColor()}',
+                // 地图默认背景
+                areaColor: "${ctrl.getBKColor()}",
+
+            },
+            emphasis: {
+                // 点击背景颜色
+                areaColor: '#F3B329',
+                shadowOffsetX: 0,
+                shadowOffsetY: 0,
+                shadowBlur: 20,
+                borderWidth: 0,
+                shadowColor: 'rgba(0, 0, 0, 0.5)',
+            }
+        }
+    }
+    // 提示
+    public series = [
+        {
+            name: '${ctrl.getName()}',
+            type: 'map',
+            geoIndex: 0,
+            data: this.dataList
+        }
+    ]
+    //option
+    public option: any = {};
+
+    /**
+    * mounted
+    */
+    public mounted() {
+        Object.assign(this.option, { tooltip: this.tooltip }, { visualMap: this.visualMap }, { geo: this.geo }, { series: this.series })
+        let element: any = document.getElementById(this.mapId);
+        this.map = echarts.init(element);
+    }
+
+    // 绘制
+    public  setOptions(){
+        if(!this.map){
+            return
+        }
+        this.map.setOption(this.option);
+    }
 <#ibizinclude>
 ../@MACRO/CONTROL/CONTROL_BOTTOM-BASE.vue.ftl
 </#ibizinclude>

@CONTROL/地图/CONTROL.less.ftl

@@ -5,3 +5,7 @@
 <#if appde??>
 .${appde.getCodeName()?lower_case}-${ctrl.name}{}
 </#if>
+.map{
+    width: 100vw;
+    height: 80vh;
+}
\ No newline at end of file