import { config } from "../../../../config/config";
var QQMapWX = require("../../utils/qqmap-wx-jssdk.js");
const api = require("../../../../utils/api");
import { wxRequestPost } from "@utils/promise-wx-api";
import { nextTick } from "@utils/tools";
const app = getApp();

Page({
  /**
   * 页面的初始数据
   */
  data: {
    addlive: false,
    dataUploading: false,
    BASEURL: config.apiUrl,
    qqmapsdk: "",
    signin: {}, //活动打卡地点详情
    actId: "", //活动ID
    operationDesc: "", //打卡描述
    operationDesc_: "",
    locationLongitude: Number, //打卡位置经度
    locationLatitude: Number, // 打卡位置纬度
    operationAddress: "", //打卡地址
    images: [], //图片
    clockType: Number, //打卡类型（0-打卡，1-更新打卡）
    effectiveFlag: Number, //打卡是否有效（0-否，1-是）
    phraseList: [], //常用于列表
    phraseId: "", //常用语id
    ldata: false,
    inRange: false,
    live: true,
    act: "", //签到打卡，添加实况
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this;
    const qqmapsdk = new QQMapWX({
      key: "CMJBZ-4DECI-JXGGN-5B4WU-QLV2H-B5BEJ",
    });

    if (options.currentUserStatus == "4") {
      //0-打卡
      that.setData({
        clockType: 0,
      });
    } else {
      //更新打卡
      that.setData({
        clockType: 1,
      });
    }
    that.setData({
      qqmapsdk,
      act: options.act,
      id: options.id,
      effectiveFlag: 1,
    });
    if (options.act == "sign") {
      wx.setNavigationBarTitle({
        title: "签到打卡",
      });
    } else {
      wx.setNavigationBarTitle({
        title: "添加实况",
      });
    }
    //that.getPhraseList(); //常用语列表
    //that.clockAddressDetail();
    that.getPosition();
  },
  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    // this.getPosition()
  },
  checkboxChange: function (e) {
    console.log(
      "checkbox发生change事件，携带value值为：",
      e.detail.value.length
    );
    if (e.detail.value.length == 0) {
      this.setData({
        live: false,
      });
    } else {
      this.setData({
        live: true,
      });
    }
  },
  // 判断当前地址是否在签到范围内
  async isInRange(lat: Number, lng: Number) {
    let fmData = {
      longitude: lng,
      latitude: lat,
      actId: this.data.id,
    };
    let rst = await wxRequestPost("heart/resi/act/checksigninaddress", fmData, {
      isMock: false,
    });
    console.log("checksigninaddress", rst.data.data.data);
    console.log("rst.msg", rst.msg);

    if (rst.msg == "success") {
      console.log("rst.data.isAddress", rst.data.data.data.isAddress);
      this.setData({
        inRange: rst.data.data.data.isAddress,
      });
      if (!rst.data.data.data.isAddress) {
        wx.showToast({
          title: "尚未进入签到范围",
          icon: "none",
          duration: 3000,
        });
      }
    }
  },
  //获取经纬度
  getPosition() {
    var that = this;
    // wx.showLoading({
    //   title: "正在获取位置",
    // })
    wx.getLocation({
      type: "gcj02",
      success: (res) => {
        that.reverseGeocoder(res);
        that.setData({
          ldata: false,
          locationLongitude: res.longitude,
          locationLatitude: res.latitude,
        });
        if (this.data.act == "sign") {
          this.isInRange(res.latitude, res.longitude);
        }
      },
      fail: (res) => {
        //wx.hideLoading();
        if (res.errMsg === "getLocation:fail auth deny") {
          that.setData({
            ldata: true,
          });
          wx.showToast({
            title: "位置获取失败，请开启手机GPS定位或重新授权获取位置信息",
            icon: "none",
            duration: 3000,
          });
          console.log(res);
        }
      },
    });
  },
  handler: function (e) {
    var that = this;
    if (!e.detail.authSetting["scope.userLocation"]) {
      that.setData({
        ldata: true,
      });
    } else {
      that.setData({
        ldata: false,
      });
      wx.getLocation({
        type: "gcj02",
        success: function (res) {
          var latitude = res.latitude;
          var longitude = res.longitude;

          that.setData({
            locationLongitude: longitude,
            locationLatitude: latitude,
          });
        },
      });
    }
  },
  // 逆地址解析
  reverseGeocoder({ latitude, longitude }) {
    var that = this;
    that.data.qqmapsdk.reverseGeocoder({
      location: {
        latitude,
        longitude,
      },
      success: (res) => {
        //wx.hideLoading();
        if (res.message === "query ok") {
          that.setData({
            operationAddress: res.result.address,
          });
        }
      },
    });
  },
  getPhraseList() {
    let that = this;
    api.getPhraseList().then(function (res) {
      //常用语列表
      // console.log('常用语列表:' + JSON.stringify(res.data))
      that.setData({
        phraseList: res.data,
      });
    });
  },
  toOperationDesc(phrase) {
    //常用于点击事件
    // console.log(phrase.currentTarget.dataset.phrase)
    this.setData({
      operationDesc:
        this.data.operationDesc + phrase.currentTarget.dataset.phrase,
      phraseId: phrase.currentTarget.dataset.id,
    });
    // console.log(phrase.currentTarget.dataset.phrase)
  },
  // 上传图片
  onChange(e) {
    // console.log('onChange', e)
    const { file } = e.detail;
    if (file.status === "uploading") {
      this.setData({
        progress: 0,
      });
      wx.showLoading();
    } else if (file.status === "done") {
      this.setData({
        imageUrl: file.url,
      });
    }
    console.log(e);
    let images = [];
    e.detail.fileList.forEach((item, index) => {
      if (item.res !== undefined) {
        const imageUrl = JSON.parse(e.detail.fileList[index].res.data).data.url;
        images.push(imageUrl);
      }
    });
    this.setData({
      images: images,
    });
  },
  // 上传完成
  onComplete() {
    wx.hideLoading();
  },
  // 点击图片放大
  onPreview(e) {
    const { file, fileList } = e.detail;
    wx.previewImage({
      current: file.url,
      urls: fileList.map((n) => n.url),
    });
  },
  // 填写意见
  // bindInput: function (e) {
  //   this.setData({
  //     operationDesc: e.detail.value + this.data.operationDesc,
  //     operationDesc_: e.detail.value
  //   })
  //   if (this.data.operationDesc_.length == 0){
  //     this.setData({
  //       operationDesc: e.detail.value,
  //       operationDesc_: e.detail.value
  //     })
  //   }
  //   console.log(this.data.operationDesc_)
  // },
  getbindinput(e) {
    this.setData({
      operationDesc: e.detail.value,
    });
  },
  /**
   * 数据提交方法
   */
  submission() {
    if (this.data.live) {
      if (this.data.operationDesc === "" && this.data.images.length == 0) {
        wx.showToast({
          title: "请填写打卡描述或上传实况图片",
          icon: "none",
          duration: 3000,
        });
        return false;
      }
    }
    if (this.data.dataUploading) {
      wx.showToast({
        title: "正在提交",
        icon: "none",
        duration: 3000,
      });
      return false;
    }
    this.setData({
      dataUploading: true,
    });
    const signinLongitude = this.data.signin.signinLongitude; //经度
    const signinLatitude = this.data.signin.signinLatitude; //纬度
    var clockLongitudeMy = 0;
    var clockLatitudeMy = 0;

    const params = {
      actId: this.data.id,
      desc: this.data.operationDesc,
      longitude: this.data.locationLongitude, //clockLongitudeMy, //打卡位置经度
      latitude: this.data.locationLatitude, //clockLatitudeMy, //打卡位置纬度
      address: this.data.operationAddress,
      images: this.data.images,
      syncLive: this.data.live ? 1 : 0, //打卡类型（0-打卡，1-更新打卡）
      customerId: app.globalData.customerId, //打卡是否有效（0-否，1-是）
    };
    let that = this;
    api
      .clock(params)
      .then(function (res) {
        that.setData({
          dataUploading: false,
        });
        if (res.code == 0) {
          wx.showToast({
            title: "签到打卡成功",
            icon: "none",
            duration: 3000,
            complete: function () {
              setTimeout(function () {
                wx.navigateBack({
                  delta: 1,
                });
              }, 1000);
            },
          });
        }
      })
      .catch((err) => {
        that.setData({
          dataUploading: false,
        });
      });
  },
  newlive() {
    if (this.data.live) {
      if (this.data.operationDesc === "" && this.data.images.length == 0) {
        wx.showToast({
          title: "请填写打卡描述或上传实况图片",
          icon: "none",
          duration: 3000,
        });
        return false;
      }
    }
    if (this.data.addlive) {
      wx.showToast({
        title: "正在提交",
        icon: "none",
        duration: 3000,
      });
      return false;
    }
    this.setData({
      addlive: true,
    });
    const params = {
      actId: this.data.id,
      desc: this.data.operationDesc,
      longitude: this.data.locationLongitude, //clockLongitudeMy, //打卡位置经度
      latitude: this.data.locationLatitude, //clockLatitudeMy, //打卡位置纬度
      address: this.data.operationAddress,
      images: this.data.images,
      customerId: app.globalData.customerId, //打卡是否有效（0-否，1-是）
    };
    let that = this;
    api.newlive(params).then(function (res) {
      if (res.code == 0) {
        that.setData({
          operationDesc: "",
          images: [],
          fileList: [],
        });
        wx.showToast({
          title: "添加实况成功",
          icon: "none",
          mask: true,
          duration: 3000,
          complete: async function () {
            await nextTick(1500);
            const pages = getCurrentPages();
            const prevPage = pages[pages.length - 2]; // 上一页
            //返回上一页并显示实况页面
            prevPage.setData({
              curtab: "live",
            });
            wx.navigateBack({
              delta: 1,
            });
            that.setData({
              addlive: false,
            });
          },
        });
      } else {
        that.setData({
          addlive: false,
        });
      }
    });
  },
  Rad(d) {
    //经纬度转换成三角函数中度分表形式。
    return (d * Math.PI) / 180.0;
  },
  clockAddressDetail() {
    //活动打卡地点详情
    let that = this;
    const id = that.data.id;

    api.clockAddressDetail(id).then(function (res) {
      if (res.code == 0) {
        that.setData({
          signin: res.data,
        });
      }
    });
  },
});