<!--
  @description: 统计报表-招采地图
  @Modifier：肖文龙
  @routerPath:
  @date：  2021/01/28
-->
<template>
  <div>
    <div id="container" :style="{height:dd_height}" />
  </div>
</template>

<script>
/* 組件 */
// import MyEcharts from '@/components/common/echarts/myEcharts.vue'// 图表
// api
import { getBiddingAndPurchaseMap } from '@api/statisticalAnalysis/reportChart.js'
import { loadAMap } from '@/assets/js/utils/windowFn.js'
// import { initMapData } from './unit.js'
export default {
  components: {
    // MyEcharts // 图表
  },
  // mixins: [initMapData],
  props: {
    // 高度
    height: {
      type: String,
      default: '100%'
    }
  },
  data() {
    return {
      dd_height: 'calc(' + this.height + ' - 3.5rem)' // 内容的高度
      // 图表配置
    }
  },
  mounted() {
    // 初始化数据
    // this.initData()
    this.initMap()
  },
  created() {
    // 首次渲染地图
    // const geoMap = {
    //   '河北省': [114.502464, 38.045475]
    // }
    // const dataArr = [
    //   [{
    //     name: '河北省',
    //     value: 0
    //   }]
    // ]
    // this.drawLine(geoMap, dataArr)
  },
  methods: {
    initMap() {
      /* eslint-disable */ 
      var SOC = 'CHN'
      var colors = {}
      var GDPSpeed = {
        '520000': 10, // 贵州
        '540000': 10, // 西藏
        '530000': 8.5, // 云南
        '500000': 8.5, // 重庆
        '360000': 8.5, // 江西
        '340000': 8.0, // 安徽
        '510000': 7.5, // 四川
        '350000': 8.5, // 福建
        '430000': 8.0, // 湖南
        '420000': 7.5, // 湖北
        '410000': 7.5, // 河南
        '330000': 7.0, // 浙江
        '640000': 7.5, // 宁夏
        '650000': 7.0, // 新疆
        '440000': 7.0, // 广东
        '370000': 7.0, // 山东
        '450000': 7.3, // 广西
        '630000': 7.0, // 青海
        '320000': 7.0, // 江苏
        '140000': 6.5, // 山西
        '460000': 7, // 海南
        '310000': 6.5, // 上海
        '110000': 6.5, // 北京
        '130000': 6.5, // 河北
        '230000': 6, // 黑龙江
        '220000': 6, // 吉林
        '210000': 6.5, // 辽宁
        '150000': 6.5, // 内蒙古
        '120000': 5, // 天津
        '620000': 6, // 甘肃
        '610000': 8.5, // 甘肃
        '710000': 2.64, // 台湾
        '810000': 3.0, // 香港
        '820000': 4.7 // 澳门

      }
      loadAMap().then(() => {
        var map = new AMap.Map('container', {
          zooms: [4, 10],
          center:[106.122082,33.719192],
          zoom: 4,
          isHotspot:false,
          defaultCursor:'pointer',
          layers:[
            // new AMap.DistrictLayer.Country({
            // zIndex: 10,
            // SOC: 'CHN',
            // depth: 1,
            // styles: {
            //   'nation-stroke': '#ff0000',
            //   'coastline-stroke': '#0088ff',
            //   'province-stroke': '#888888',
            //   'fill': function(props) {
            //     return getColorByDGP(props.adcode_pro)
            //   }
            // }
          // })
          ],
          viewMode:'2D',
          resizeEnable: true
        })
        var styleName = "amap://styles/darkblue"
        map.setMapStyle(styleName);
          var getColorByDGP = function(adcode) {
            if (!colors[adcode]) {
              var gdp = GDPSpeed[adcode]
              if (!gdp) {
                colors[adcode] = 'rgb(227,227,227)'
              } else {
                var r = 3
                var g = 140
                var b = 230
                var a = gdp / 10
                colors[adcode] = 'rgba(' + r + ',' + g + ',' + b + ',' + a + ')'
              }
            }
            return colors[adcode]
          }
        // map.addControl(new AMap.Scale());
        // map.addControl(new AMap.ToolBar({liteStyle:true}));
        const that = this
        // map.on('complete',function(){
            // var layer = new AMap.LabelsLayer({
            //     // 开启标注避让，默认为开启，v1.4.15 新增属性
            //     collision: false,
            //     // 开启标注淡入动画，默认为开启，v1.4.15 新增属性
            //     animation: true,
            // });
            // console.log(that.LabelsData,'123');
            // for (var i = 0; i < that.LabelsData.length; i++) {
            //     var labelsMarker = new AMap.LabelMarker(that.LabelsData[i]);
            //     layer.add(labelsMarker);
            // }
            // map.add(layer);
        // })
        // 创建一个 Marker 实例：
        var marker = new AMap.Marker({
            position: new AMap.LngLat(116.39, 39.9),   // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
            title: '北京'
        });

        // 将创建的点标记添加到已有的地图实例：
        map.add(marker);
      }).catch(err => {
        console.log('err', err)
        console.log('高德地图加载失败')
      })
    },
    initData() {
      getBiddingAndPurchaseMap(this.searchForm).then((res) => {
        const geoMap = {}
        const dataArr = []
        res.data.forEach(item => {
          dataArr.push([{
            name: item.city, // 地区(省份)
            value: item.endCount, // 已完成项目
            buyersName: item.buyersName, // 采购单位
            expectedWinningMoney: item.expectedWinningMoney, // 进行中项目
            inProgress: item.inProgress, // 采购单位
            supplierCount: item.supplierCount // 供应商数量
          }])
          // 经纬度
          geoMap[item.city] = [item.eastLongitude, item.northLatitude]
        })
        this.drawLine(geoMap, dataArr)
      })
    }
  }

}
</script>
<style lang="less" scoped>
</style>
