epdc-resident-mp-js/subpages/discussion/pages/addIssue/addIssue.js

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

Page({
  data: {
    issueContent: '',
    addressContent: '',
    latitude: '',
    longitude: '',
    qqMapWX: '',
    uploadImageList: [],
    imageId: 1,
    dialogVisible: false,
    publishIssuePrevious: 0,
    focus: false,
    isBlock: true,
  },
  onLoad () {
    this.data.qqMapWX = new QQMapWX({
      key: 'CMJBZ-4DECI-JXGGN-5B4WU-QLV2H-B5BEJ'
    })
    this.getLocation().then(() => {
      this.reverseLocation()
    })
  },
  // 双向绑定 内容输入框
  bindTextareaInput (e) {
    this.setData({
      issueContent: e.detail.value
    })
  },
  // 双向绑定 地址输入框
  bindAddressInput (e) {
    this.setData({ //失去焦点以后view隐藏
      isBlock: true
    })
    this.setData({
      addressContent: e.detail.value
    })
  },
  // 获取经纬度
  getLocation () {
    return new Promise((resolve, reject) => {
      const _this = this
      wx.getLocation({
        success (res) {
          if (res.latitude && res.longitude) {
            _this.setData({
              latitude: res.latitude,
              longitude: res.longitude
            })
            resolve(true)
          }
        },
        fail (err) {
          reject(err)
        }
      })
    })
  },
  // 逆地址解析
  reverseLocation () {
    const _this = this
    this.data.qqMapWX.reverseGeocoder({
      location: {
        latitude: _this.data.latitude,
        longitude: _this.data.longitude
      },
      success (res) {
        _this.setData({
          addressContent: res.result.address
        })
      },
      fail (err) {
        console.debug(err)
      }
    })
  },
  // 选择图片 上传弹窗 - 上传图片方式 - 选择图片 - 上传图片 - 回调赋值
  chooseImage () {
    const _this = this
    $wuxActionSheet().showSheet({
      buttons: [
        { text: '拍照' },
        { text: '从相册中获取' },
      ],
      className: 'dialog-class',
      buttonClicked(index) {
        if (index === 0) {
          wx.chooseImage({
            count: 1,
            sizeType: ['original', 'compressed'],
            sourceType: ['camera'],
            success (res) {
              const uploadImageList = [..._this.data.uploadImageList]
              uploadImageList.push({
                uploaded: false,
                ossUrl: '',
                imgUrl: res.tempFilePaths[0],
                imageId: ++_this.data.imageId
              })
              _this.setData({
                uploadImageList
              })
              wx.uploadFile({
                url: `${config.BASEURL()}group/topic/upload`,
                filePath: res.tempFilePaths[0],
                name: 'file',
                header: {
                  'Content-type': 'multipart/form-data'
                },
                success (fileRes){
                  uploadImageList[uploadImageList.length - 1].uploaded = true
                  uploadImageList[uploadImageList.length - 1].ossUrl = JSON.parse(fileRes.data).data
                  _this.setData({
                    uploadImageList
                  })
                }
              })
             
            }
          })
        } else if (index === 1) {
          wx.chooseImage({
            count: 3 - _this.data.uploadImageList.length,
            sizeType: ['original', 'compressed'],
            sourceType: ['album'],
            success (res) {
              const uploadImageList = []
              const endIndex = _this.data.uploadImageList.length
              res.tempFilePaths.forEach(item => {
                uploadImageList.push({
                  uploaded: false,
                  ossUrl: '',
                  imgUrl: item,
                  imageId: ++_this.data.imageId
                })
              })
              _this.setData({
                uploadImageList: [..._this.data.uploadImageList,...uploadImageList]
              })
              uploadImageList.forEach((item, index) => {
                return (function (index) {
                  wx.uploadFile({
                    url: `${config.BASEURL()}group/topic/upload`,
                    filePath: res.tempFilePaths[index],
                    name: 'file',
                    header: {
                      'Content-type': 'multipart/form-data'
                    },
                    success (fileRes){
                      uploadImageList[index].uploaded = true
                      uploadImageList[index].ossUrl = JSON.parse(fileRes.data).data
                      _this.data.uploadImageList = _this.data.uploadImageList.slice(0, endIndex)
                      _this.setData({
                        uploadImageList: [..._this.data.uploadImageList, ...uploadImageList]
                      })
                    }
                  })
                })(index)
              })
            }
          })
        }
        return true
      },
      cancelText: '取消',
      cancel() {},
      destructiveButtonClicked() {},
    })
  },
  // 删除选中的图片
  deleteImage (e) {
    const index = this.data.uploadImageList.findIndex(item => item.imageId === e.currentTarget.dataset.imageid)
    if (index > -1) {
      this.data.uploadImageList.splice(index, 1)
      this.setData({
        uploadImageList: this.data.uploadImageList
      })
    }
  },
  throttlePublisgIssue() {
    let now  = new Date()
    if (now - this.data.publishIssuePrevious > 2000) {
      console.log(1)
      this.publishIssue()
      this.data.publishIssuePrevious = now
    }
  },
  // 发布议题
  publishIssue () {
    if (!this.data.issueContent) {
      wx.showToast({
        title: '请填写议题内容',
        icon: 'none',
        duration: 1500
      })
      return false
    } else if (!this.data.addressContent) {
      wx.showToast({
        title: '请填写地址',
        icon: 'none',
        duration: 1500
      })
      return false
    }
    const imagesList = []
    if (this.data.uploadImageList.length > 0) {
      const isUploadDown = this.data.uploadImageList.some(item => !item.uploaded)
      if (isUploadDown) {
        wx.showToast({
          title: '请等待图片上传完成',
          icon: 'none',
          duration: 1000
        })
        return false
      }
    }
    if (this.data.uploadImageList.length > 0) {
      this.data.uploadImageList.forEach(item => {
        imagesList.push(item.ossUrl)
      })
    }
    const para = {
      eventContent: this.data.issueContent,
      issueAddress: this.data.addressContent,
      issueLongitude: this.data.longitude,
      issueLatitude: this.data.latitude,
      images: imagesList
    }
    wx.showLoading({
      title: '加载中...'
    })
    addIssue(para).then(res => {
      wx.hideLoading()
      console.log('发布议题', res)
      this.setData({
        dialogVisible: !this.data.dialogVisible
      })
    }).catch(err => {
      wx.showToast({
        title: err,
        icon: 'none',
        duration: 1500
      })
    })
  },
  // 知道了 确认按钮 
  confirmDialog () {
  //  wx.redirectTo({
  //    url: '/pages/discussion/discussion'
  //  })
   wx.navigateBack({
     delta: 1
   })
  },
    // Textarea获取焦点
    clickTextarea() {
      this.setData({
        isBlock: false,
        focus: true
      })
    },
    toOperationDesc(phrase) { //常用于点击事件
      // console.log(phrase.currentTarget.dataset.phrase)
      this.setData({
        issueContent: this.data.issueContent + phrase.currentTarget.dataset.phrase,
      })
      // console.log(phrase.currentTarget.dataset.phrase)
    },
})