epdc-resident-mp-js/subpages/association/pages/addTopic/addTopic.js

import { $wuxActionSheet } from "../../../../dist/index"
import { addTopic } from "../../utils/api"
const QQMapWX = require("../../utils/qqmap-wx-jssdk")
const config = require("../../../../utils/config")

Page({
  data: {
    topicValue: "",
    imageList: [],
    qqmapsdk: "",
    addressValue: "",
    imageId: 1,
    location: {
      latitude: "",
      longitude: ""
    },
    groupId: "",
    groupName: "",
    addTopicPrevious: 0
  },
  onShow () {

  },
  onLoad (options) {
    const qqmapsdk = new QQMapWX({
      key: "CMJBZ-4DECI-JXGGN-5B4WU-QLV2H-B5BEJ"
    })
    this.setData({
      qqmapsdk,
      groupId: options.groupId,
      groupName: options.groupName
    })
    this.getLocation()
  },
  // 话题内容框 值双向绑定
  bindTopicValue (e) {
    this.setData({
      topicValue: e.detail.value
    })
    console.log(this.data.topicValue)
  },
  // 地址框 值双向绑定
  bindAddressValue (e) {
    this.setData({
      addressValue: e.detail.value
    })
    console.log(this.data.addressValue)
  },
  // 选择图片
  chooseImage () {
    const that = this
    $wuxActionSheet().showSheet({
      buttons: [{
        text: "拍照"
      },
      {
        text: "从相册中获取"
      },
      ],
      buttonClicked (index) {
        if (index === 0) {
          wx.chooseImage({
            count: 1,
            sizeType: ["original", "compressed"],
            sourceType: ["camera"],
            success (res) {
              const imageList = [...that.data.imageList]
              imageList.push({
                img: res.tempFilePaths[0],
                upload: true,
                id: that.data.imageId++,
                ossUrl: ""
              })
              that.setData({
                imageList
              })
              wx.uploadFile({
                url: config.BASEURL() + "group/topic/upload",
                filePath: res.tempFilePaths[0],
                name: "file",
                header: {
                  "Content-Type": "multipart/form-data"
                },
                success (fileres) {
                  const data = JSON.parse(fileres.data)
                  if (data.code === 0 && data.msg === "success") {
                    imageList[imageList.length - 1].ossUrl = data.data
                    imageList[imageList.length - 1].upload = false
                  } else {
                    imageList.pop()
                    wx.showToast({
                      title: "上传图片失败，请重试",
                      icon: "none",
                      duration: 2000
                    })
                  }
                  that.setData({
                    imageList
                  })
                },
                fail (err) {
                  console.log(err)
                  imageList.pop()
                  wx.showToast({
                    title: "上传图片失败，请重试",
                    icon: "none",
                    duration: 2000
                  })
                  that.setData({
                    imageList
                  })
                }
              })
            }
          })
        } else if (index === 1) {
          wx.chooseImage({
            count: 3 - that.data.imageList.length,
            sizeType: ["original", "compressed"],
            sourceType: ["album"],
            success (res) {
              let imageList = []
              res.tempFilePaths.forEach(item => {
                imageList.push({
                  img: item,
                  upload: true,
                  id: that.data.imageId++,
                  ossUrl: ""
                })
              })
              that.setData({
                imageList: [...that.data.imageList, ...imageList]
              })
              imageList.forEach((item, index) => {
                (function (index) {
                  wx.uploadFile({
                    url: `${config.BASEURL()}group/topic/upload`,
                    filePath: imageList[index].img,
                    name: "file",
                    header: {
                      "Content-Type": "multipart/form-data"
                    },
                    success (fileRes) {
                      const data = JSON.parse(fileRes.data)
                      if (data.code === 0 && data.msg === "success") {
                        imageList[index].ossUrl = data.data
                        imageList[index].upload = false
                        
                      } else {
                        imageList.splice(index, 1)
                        wx.showToast({
                          title: "上传图片失败，请重试",
                          icon: "none",
                          duration: 2000
                        })
                      }
                      that.data.imageList = that.data.imageList.slice(0, that.data.imageList.length - res.tempFilePaths.length)
                      that.setData({
                        imageList: [...that.data.imageList, ...imageList]
                      })
                    },
                    fail (err) {
                      console.log(err)
                      imageList.splice(index, 1)
                      wx.showToast({
                        title: "上传图片失败，请重试",
                        icon: "none",
                        duration: 2000
                      })
                      that.data.imageList = that.data.imageList.slice(0, that.data.imageList.length - res.tempFilePaths.length)
                      that.setData({
                        imageList: [...that.data.imageList, ...imageList]
                      })
                    }
                  })
                })(index)
              })
            }
          })
        }
        return true
      },
      cancelText: "取消",
      cancel () {},
      destructiveButtonClicked () {},
    })
  },
  // 获取经纬度
  getLocation () {
    wx.getLocation({
      type: "gcj02",
      success: (res) => {
        console.log("经纬度", res)
        this.reverseGeocoder(res)
        this.setData({
          location: {
            latitude: res.latitude,
            longitude: res.longitude
          }
        })
      }
    })
  },
  // 逆地址解析
  reverseGeocoder ({latitude, longitude}) {
    this.data.qqmapsdk.reverseGeocoder({
      location: {
        latitude,
        longitude
      },
      success: (res) => {
        console.log("逆地址解析", res)
        if (res.message === "query ok") {
          this.setData({
            addressValue: res.result.address
          })
        }
      }
    })
  },
  throttleAddTopic () {
    let now = new Date()
    if (now - this.data.addTopicPrevious > 2000) {
      this.addTopic()
      this.data.addTopicPrevious = now
    }
  },
  // 添加话题事件
  addTopic () {
    if (this.data.topicValue === "") {
      wx.showToast({
        title: "请输入-话题内容",
        icon: "none",
        duration: 2000
      })
      return false
    } else if (this.data.addressValue === "") {
      wx.showToast({
        title: "请输入-地址",
        icon: "none",
        duration: 2000
      })
      return false
    }
    const imagesList = []
    if (this.data.imageList.length > 0) {
      const isUploadingStatus = this.data.imageList.some(item => item.upload)
      if (isUploadingStatus) {
        wx.showToast({
          title: "请等待图片上传完成",
          icon: "none",
          duration: 2000
        })
        return false
      }
      this.data.imageList.forEach(item => {
        imagesList.push(item.ossUrl)
      })
    }
    const para = {
      topicContent: this.data.topicValue,
      topicAddress: this.data.addressValue,
      topicLatitude: this.data.location.latitude,
      topicLongitude: this.data.location.longitude,
      groupId: this.data.groupId,
      groupName: this.data.groupName,
      images: imagesList
    }
    wx.showLoading({
      title: "加载中",
    })
    addTopic(para).then(res => {
      wx.hideLoading()
      console.log(res)
      wx.showToast({
        title: "话题发布成功",
        icon: "none",
        duration: 2000
      })
      var pages = getCurrentPages()
      var prePages = pages[pages.length - 2]
      setTimeout(() => {
        prePages.pullRefreshGetTopicList() 
        wx.navigateBack()
      }, 1000)
    }).catch(err => {
      console.log(err)
    })
  },
  // 删除图片
  deleteImage (e) {
    const index = this.data.imageList.findIndex((item,index) => index === e.currentTarget.dataset.index)
    this.data.imageList.splice(index, 1)
    const imageList = this.data.imageList
    this.setData({
      imageList
    })
  }
})