// miniprogram/pages/earth/earth.js

// 引入SDK核心类
var QQMapWX = require('../../libs/qqmap-wx-jssdk.js');
var qqmapsdk;
var app = getApp();
Page({

  /**
   * 页面的初始数据
   */
  data: {
    listData: [],
    devcodes: "",
    marker_latitude: "",
    marker_longitude: "",
    title: "",
    isShow: false,
    tips: [],
    value: '',
    show: false,
    enableSsatellite: false,
    windowWidth: 0,
    longitude: "116.627340",
    latitude: "39.874390",
    longitude84: "",
    latitude84: "",
    markers: [],
    controls: []
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this;
    //设置地图组件
    wx.getSystemInfo({
        success(res) {
          var windowWidth = res.windowWidth
          var windowHeight = res.windowHeight
          var query = wx.createSelectorQuery()
          var platform =res.platform
          query.select('#map').boundingClientRect()
          query.exec(function (res) {
            that.setData({
              controls: [{
                id: 1,
                iconPath: '../../images/copy.png',
                position: {
                  left: windowWidth - 40,
                  top: 20,
                  width: 30,
                  height: 30
                },
                clickable: true
              }, {
                id: 2,
                iconPath: '../../images/write.png',
                position: {
                  left: windowWidth - 40,
                  top: 60,
                  width: 30,
                  height: 30
                },
                clickable: true
              }, {
                id: 3,
                iconPath: '../../images/add.png',
                position: {
                  left: windowWidth - 40,
                  top: 100,
                  width: 30,
                  height: 30
                },
                clickable: true
              }, {
                id: 4,
                iconPath: '../../images/navigation.png',
                position: {
                  left: windowWidth - 40,
                  top: windowHeight - 100,
                  width: 30,
                  height: 30
                },
                clickable: true
              }, {
                id: 5,
                iconPath: '../../images/gps.png',
                position: {
                  left: 10,
                  top: windowHeight - 100,
                  width: 30,
                  height: 30
                },
                clickable: true
              }, {
                id: 6,
                iconPath: '../../images/aim.png',
                position: {
                  left: 10,
                  top: windowHeight - 140,
                  width: 30,
                  height: 30
                },
                clickable: true
              }, {
                id: 7,
                iconPath: '../../images/applocat.png',
                position: {
                  left: res[0].width / 2 - 20,
                  top: platform=="ios"?res[0].height / 2 - 80:res[0].height / 2 - 40,
                  width: 40,
                  height: 40
                },
                clickable: true
              }, {
                id: 8,
                iconPath: '../../images/back.png',
                position: {
                  left: windowWidth - 40,
                  top: windowHeight - 140,
                  width: 30,
                  height: 30
                },
                clickable: true
              }]
            })
          })

        }
      })
  
      // 实例化API核心类
      qqmapsdk = new QQMapWX({
        key: 'BGPBZ-C5O3P-ROUDR-LWC4J-63EKH-V5FRX'
      })

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
 //输入设备编号获取marker位置信息
 var that = this;
 if ( app.globalData.devcode!="") {
  var devcode = app.globalData.devcode
  wx.request({
    method: "POST",
    url: app.globalData.httpsUrl + "appDeviceAdd/findListByCodes",
    data: {
      devcodes: devcode,
    },
    header: {
      'content-type': 'application/x-www-form-urlencoded;charset=utf-8'
    },
    success(res) {
      app.globalData.devcode="";
      if (res.data.code == 200) {
        var listResultData = res.data.data;
        that.setData({
          listData: listResultData
        })
        var markersArr = that.data.markers;
        for (var i = 0; i < listResultData.length; i++) {
          markersArr = markersArr.concat({
            iconPath: "../../images/locat.png",
            id: Number(listResultData[i].id),
            callout: {
              content: "编号:"+listResultData[i].devcode+"\r\n位置:"+listResultData[i].position+"\r\n时间:"+listResultData[i].createtime,
              fontSize: '14',
              padding: true,
              color: '#000000',
              borderColor: '#F4EA2A',
              bgColor: '#F4EA2A',
              borderWidth: 5,
              display: 'ALWAYS',
              textAlign: 'left',
              // borderRadius: 15
            },
            latitude: listResultData[i].latitude,
            longitude: listResultData[i].longitude,
            width: 40,
            height: 40
          });
        }
        that.setData({
          markers: markersArr,
          latitude: listResultData[0].latitude,
          longitude: listResultData[0].longitude,
          marker_latitude: listResultData[0].latitude,
          marker_longitude: listResultData[0].longitude,
          title: listResultData[0].devcode
        })
      }
    },
    fail(err) {
      app.globalData.devcode="";
      wx.showToast({
        title: "无法获取设备地理信息！",
        icon: 'none',
        duration: 2000
      })
    }
  })
} else {
  //获取当前坐标（gcj02）
  wx.getLocation({
    type: "gcj02",
    altitude: true,
    success: function (res) {
      that.setData({
        latitude: parseFloat(res.latitude).toFixed(6),
        longitude: parseFloat(res.longitude).toFixed(6),
        // markers: [{
        //   latitude: res.latitude,
        //   longitude: res.longitude,
        // }]
      })
      //获取当前坐标（wgs84）,特别注意需要放在加载里面，否则获取有误
      wx.getLocation({
        type: "wgs84",
        altitude: true,
        success: function (res) {
          that.setData({
            latitude84: parseFloat(res.latitude).toFixed(6),
            longitude84: parseFloat(res.longitude).toFixed(6)
          })
        }
      })
    }
  })
}


  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  },

  //定位出来

  locationPosition: function () {
    var that = this;
    //获取当前坐标（gcj02）
    wx.getLocation({
      type: "gcj02",
      altitude: true,
      success: function (res) {
        that.setData({
          latitude: parseFloat(res.latitude).toFixed(6),
          longitude: parseFloat(res.longitude).toFixed(6),
          // markers: [{
          //   latitude: res.latitude,
          //   longitude: res.longitude
          // }]
        })
        //获取当前坐标（wgs84）,特别注意需要放在加载里面，否则获取有误
        wx.getLocation({
          type: "wgs84",
          altitude: true,
          success: function (res) {
            that.setData({
              latitude84: parseFloat(res.latitude).toFixed(6),
              longitude84: parseFloat(res.longitude).toFixed(6)
            })
          }
        })
      }
    })
  },

  //加载地图组件
  controltap: function (e) {
    // console.log(e.controlId);
    //进入添加设备页
    if (1 == e.controlId) {
      wx.setClipboardData({
        data: this.data.latitude + "," + this.data.longitude + "," + this.data.latitude84 + "," + this.data.longitude84,
        success: function (res) {
          wx.getClipboardData({
            success: function (res) {
              wx.showToast({
                title: '复制坐标成功'
              })
            }
          })
        }
      })
    } else if (3 == e.controlId) {
      //先定位
    //   this.locationPosition()
      wx.setClipboardData({
        data: this.data.latitude + "," + this.data.longitude + "," + this.data.latitude84 + "," + this.data.longitude84,
        success: function (res) {
            wx.showToast({
                title: '坐标已获取',
                duration: 1000
              })
        }
      })
      wx.navigateTo({
        url: '../addDevice/addDevice'
      })
    } else if (2 == e.controlId) {
      this.setData({
        show: true
      });
    } else if (4 == e.controlId) {
      wx.openLocation({
        latitude: Number(this.data.marker_latitude),
        longitude: Number(this.data.marker_longitude),
        name: this.data.title,
        scale: 35
      })
    } else if (5 == e.controlId) {
      var flag = this.data.enableSsatellite;
      this.setData({
        enableSsatellite: !flag
      });
    } else if (6 == e.controlId) {
      //先清marker
      this.setData({
        markers: []
      })
      this.locationPosition()
    }else if (8 == e.controlId) {
      //跳转日志缓存页
      wx.switchTab({
        url: '../applog/applog',
      })
    }
  },
  showPopup() {
    this.setData({
      show: true
    });
  },

  onClose() {
    this.setData({
      show: false
    });
  },

  //获取设备maker
  leave() {

    var that = this;
    if (that.data.devcodes == "") {
        that.setData({
            markers:[]
        })
      return false;
    }
    wx.request({
      method: "POST",
      url: app.globalData.httpsUrl + "appDeviceAdd/findListByCodes",
      data: {
        devcodes: that.data.devcodes
      },
      header: {
        'content-type': 'application/x-www-form-urlencoded;charset=utf-8'
      },
      success(res) {
        if (res.data.code == 200) {
          var listResultData = res.data.data;
          that.setData({
            listData: listResultData
          })
          var markersArr = []
          for (var i = 0; i < listResultData.length; i++) {
            let arr = {
              iconPath: "../../images/locat.png",
              id: listResultData[i].id,
              callout: {
                content:  "编号:"+listResultData[i].devcode+"\r\n位置:"+listResultData[i].position+"\r\n时间:"+listResultData[i].createtime,
                fontSize: '14',
                // padding: true,
                color: '#212121',
                borderColor: '#F4EA2A',
                bgColor: '#F4EA2A',
                borderWidth: 5,
                display: 'ALWAYS',
                textAlign: 'left',
                // borderRadius: 15
              },
              latitude: listResultData[i].latitude,
              longitude: listResultData[i].longitude,
              width: 40,
              height: 40
            };
            markersArr.push(arr)
          }
          that.setData({
            markers: markersArr,
            latitude: listResultData[0].latitude,
            longitude: listResultData[0].longitude,
            marker_latitude: listResultData[0].latitude,
            marker_longitude: listResultData[0].longitude,
            title: listResultData[0].devcode
          })
        }
      },
      fail(err) {
        wx.showToast({
          title: "无法获取设备地理信息！",
          icon: 'none',
          duration: 2000
        })
      }
    })
  },

  markertap(e) {
    var that = this;
    for (var i = 0; i < this.data.listData.length; i++) {
      if (e.markerId == this.data.listData[i].id) {
        this.setData({
          marker_latitude: this.data.listData[i].latitude,
          marker_longitude: this.data.listData[i].longitude,
          title: this.data.listData[i].devcode
        })
      }
      // wx.openLocation({
      //   latitude: Number(that.data.marker_latitude),
      //   longitude: Number(that.data.marker_longitude),
      //   name: that.data.title,
      //   scale: 35
      // })
    }
  },



  bindregionchange: function (e) {
    var that = this
    if (e.causedBy == "drag") {
      var mapCtx = wx.createMapContext("map")
      mapCtx.getCenterLocation({
        // type: "gcj02",
        success: function (res) {
          // var markersArr = that.data.markers
          // for (var i = 0; i < markersArr.length; i++) {
          //   if (markersArr[i].iconPath == undefined) {
          //     markersArr.splice(i, 1)
          //   }
          // }
          var latitude = res.latitude
          var longitude = res.longitude
          // markersArr = markersArr.concat({
          //   latitude: latitude,
          //   longitude: longitude
          // })
          //拖拽地图获取不到84坐标系，保存为空
          that.setData({
            latitude: parseFloat(latitude).toFixed(6),
            longitude: parseFloat(longitude).toFixed(6),
            latitude84: "",
            longitude84: "",
            // markers: markersArr
          })
          // mapCtx.moveToLocation();
          // that.getLocal(latitude, longitude)
        }
      })
    }
  },

  onChange: function (e) {
    this.setData({
      value: e.detail,
    });
    var _this = this;
    // 调用接口
    qqmapsdk.search({
      keyword: this.data.value,
      success: function (res) {
          console.log(res)
        if (res && res.data) {
          _this.setData({
            isShow: true,
            tips: res.data
          });
        }
      },
      complete: function (res){
        console.log(res);
      }
    })
  },
  bindSearch: function (e) {
    var location = e.target.dataset.location;
    this.setData({
      isShow: false,
      longitude: location.lng,
      latitude: location.lat,
      marker_latitude: location.lat,
      marker_longitude: location.lng,
      title: e.target.dataset.keywords,
      value: e.target.dataset.keywords,
      markers: [{
        id: 0,
        longitude: location.lng,
        latitude: location.lat,
        iconPath: '../../images/locat.png',
        width: 50,
        height: 50,
      }]
    })
  },


  confirmdevcodes: function (event) {
    var that = this;
    that.setData({
      devcodes: event.detail.value
    });
  },


  onClick: function () {

    // 调用接口
    qqmapsdk.search({
      keyword: this.data.value,
      success: function (res) {
        console.log(res);
      },
      fail: function (res) {
        console.log(res);
      },
      complete: function (res) {
        console.log(res);
      }
    });
  },

  confirm(event) {
    var that = this;
    var formValue = event.detail.value;
    var formName = event.target.dataset.id;
    var fromN = 'form.' + [formName];
    that.setData({
      [fromN]: formValue
    })
  },
})