<template>
  <div id="map-use" class="h100">
    <iframe id="i_map" name="i_map" frameborder="0" class="h100">

    </iframe>
  </div>
</template>

<script>
import {createNamespacedHelpers} from "vuex";
import CityGis from "@/units/map/CityGis.Bridge";
import {myBridge} from "@/units/map/bridge";
import {addBaseLayer, addWhiteMold, importantAreaPosition, setMapWaterEffect} from "@/units/map/AddLayer";
import {
  CHANGE_MAP_CAMERA_ACTION,CHANGE_CURRENT_DRAW_INFO_ACTION,
  CHANGE_CURRENT_RETURN_FIELDS_ACTION,
  CHANGE_CURRENT_RETURN_RESULT_ACTION, CHANGE_CURRENT_RETURN_CALCULATION_ACTION
} from "@/view/show-platform/store/action-constant";
const {mapState,mapActions} =createNamespacedHelpers('platform')
let bridge
export default {
  name: "MapUse",
  mounted() {
    let that = this;
    //加载地图控件
    myBridge.bridgeContent = bridge = new CityGis.Bridge({
      id: "i_map",
      // url: "http://10.121.226.94:81/mapwidget/MyWidget.html",
      // url: "http://10.121.226.94:81/mapwidget/MyWidget.html?v=20210916",
      // url:'http://192.168.100.226/mapvue/#/mapvpn',
      // url:'http://192.168.100.229/mapvue/#/mapvpn',
      // url:'http://192.168.100.141/mapvue/#/mapvpn',
      // url: 'https://192.168.10.92/mapvue/#/mapvpn?theme=light',
      // url: 'http://10.81.66.1:8080/mapvue/?theme=light', //建科发布
       url: 'http://localhost:8081/mapvue#/mapjk',
      // url:'http://geodatasvr.cn.smism.com//mapvue-t/#/maptest?theme=light', //ces版
      //   url:'http://geodatasvr.cn.smism.com//mapvue-t/#/mapnew?theme=light', //正式版,
      // url: "https://geoscene.geosceneonline.cn/mapvue/#/mapnew?theme=light",
      onReady: function () {
        console.log("地图创建完成");

      }
    })
    //临时加载白膜
    addWhiteMold(true);

    //添加河流波纹
    setMapWaterEffect(true);
    //设置临时初始视角
    importantAreaPosition(1529,-2461,2425,13,54);

    bridge.addEventListener((arg) => {
      switch (arg.action) {
        case "MapReady":
          // this.t_result = JSON.stringify(arg.data, null, 4);
          break;
        case 'ReturnResult':
          debugger
          this.$emit('getSearchListData',arg.data.features)
          console.log('拿到了分析结果',arg.data.features,arg.data)
          this[CHANGE_CURRENT_RETURN_RESULT_ACTION](
              arg.data
          )
          if(arg.data.data){
            let sumArea=0
            let data = arg.data.data
            for(let i in data){
              // console.log(data[i]);
              // console.log(data[i].Shape_Area);
              sumArea = sumArea + data[i].Shape_Area
            }
            // console.log(sumArea);
            // console.log(sumArea.toString());
            localStorage.setItem('currentCombineArea',((sumArea/1000000).toFixed(2)).toString());
          }

          if(arg.data.id){
            this.$emit('getPipeTitle',arg.data.id)
          }

          break
        case 'ReturnFields':
          console.log('拿的了所有的属性字段',arg.data.fields)
          this.$emit('getAllFields',arg.data.fields)
          this[CHANGE_CURRENT_RETURN_FIELDS_ACTION](
              arg.data.fields
          )
          break
        case 'MapClickResult':
          console.log(arg.data.data)
          this.pointResultRes = (arg.data.data) || {}
          //开启点查询的框
          this.isPointSearchShow = true
          // this.$emit('changePointSearchIsShow',true)
          break
        case "MapExtentChanged":
          // console.log('MapExtentChanged', arg.data.rotation)
          // this.$emit('setDirection', arg.data)
          // this.t_result = JSON.stringify(arg.data, null, 4);
          this[CHANGE_MAP_CAMERA_ACTION](
              {
                x:arg.data.camera.position.x,
                y:arg.data.camera.position.y,
                z:arg.data.camera.position.z,
                heading:arg.data.camera.heading,
                tilt:arg.data.camera.tilt
              }
          )
          break;
        case "MapClickHandle":
          // treeNodes
          if (arg.type === 'building') {
            this.$bus.$emit('changeEntityHandle', arg.data)
          }
          break
        case 'DrawComplete':
          // this.$emit('pointComplete', arg.data)
          // this.$bus.$emit('pointComplete', arg.data)
            debugger
          this[CHANGE_CURRENT_DRAW_INFO_ACTION](
              arg.data
          )
          if(arg.data.extent){
            console.log(JSON.stringify(arg.data.extent));
            let extent = arg.data.extent

            localStorage.setItem('currentCombineText',"东："+extent.xmax+","+"南："+extent.ymin+","+"西："+extent.xmin+","+"北："+extent.ymax)
          }

          break
        case 'Calculation':
          this[CHANGE_CURRENT_RETURN_CALCULATION_ACTION](
              arg.data.result
          )
          if(arg.data.is_show){
            this.pointResultRes = {
              '结果':arg.data.result
            }
            this.isPointSearchShow = true
          }else{
            let result = arg.data.result.split("(")
            // console.log(result[0]);
            if(result[1].indexOf("千米") != -1){
              localStorage.setItem('currentCombineArea',(result[0].toFixed(2)).toString());
            }else{
              localStorage.setItem('currentCombineArea',((result[0]/1000000).toFixed(2)).toString());
            }

          }
          break
        case 'ReturnStatistic':
          let data = arg.data.attributes
          // console.log(data);
          this.$emit('getLayerStatisticData',data)
          break;

        case 'ReturnDataList':
          let qzdata = arg.data
          console.log(data);
          console.log('拿到了分析结果',arg.data.features,arg.data)
          this[CHANGE_CURRENT_RETURN_RESULT_ACTION](
              arg.data
          )
          this.$emit('getQuZhenList',qzdata)
          break;


      }
    });
    // bridge.addEventListener(function (arg) {
    //   switch(arg.action)
    //   {
    //     case "MapClickResult":
    //       console.log(arg.data);
    //       break;
    //   }
    // }, this);

    // this.initMap()
  },
  methods:{
    ...mapActions({
      [CHANGE_MAP_CAMERA_ACTION]:CHANGE_MAP_CAMERA_ACTION,
      [CHANGE_CURRENT_DRAW_INFO_ACTION]:CHANGE_CURRENT_DRAW_INFO_ACTION,
      [CHANGE_CURRENT_RETURN_FIELDS_ACTION]:CHANGE_CURRENT_RETURN_FIELDS_ACTION,
      [CHANGE_CURRENT_RETURN_RESULT_ACTION]:CHANGE_CURRENT_RETURN_RESULT_ACTION,
      [CHANGE_CURRENT_RETURN_CALCULATION_ACTION]:CHANGE_CURRENT_RETURN_CALCULATION_ACTION
    })
  }
}
</script>

<style scoped lang="scss">
#map-use{
  left:0;
  top:0;
  z-index: 1;
  width: 100%;
  height: 100%;
  position: relative;
  ::v-deep .esri-ui{
    right:50px !important;
  }
  #i_map{
    width: 100%;
    height: 100%;
  }
}
</style>
