<template>
<div class='container'>
<form @submit='submit'>
  <textarea name='text' placeholder='您在小程序使用过程中若遇到问题，或有其它意见或建议，欢迎在这里反馈给我们'
  maxlength=360 v-model='text' :value='text'/>
  <div class='limit'>{{text.length}}/360</div>
  <div class='commit'>
    <button form-type='submit' hover-class='fade' :disabled='commiting'>提交</button>
  </div>
</form>
</div>
</template>

<script>
export default {
  data() {
    return {
      text: '',
      commiting: false
    }
  },
  methods: {
    submit(e){
      if(this.commiting) return

      let inputs = this.service.filter(e.mp.detail.value)

      if (!inputs.allowed) return
      else inputs = inputs.obj

      if (!this.service.checkEmptyInput([inputs.text], ['输入内容'])) return

      wx.showModal({
        title:'',
        content:'确定要提交吗?',
        success: res => {
          if(res.confirm){
            this.submit_exec(inputs.text)
          }
        }
      })
    },
    submit_exec(content){
      this.commiting = true
      wx.showLoading({ title: '正在上传' })
      wx.request({
        url: this.rootUrl + 'feedback/add',
        method: 'POST',
        header: { 'content-type': 'application/x-www-form-urlencoded' },
        data: {
          content,
          sessionID: wx.getStorageSync('sessionID')
        },
        success: res => {
          wx.hideLoading()
          if (res.statusCode == '500') {
            this.service.getUnionId(this.rootAvatar, this.rootUrl).then(res => this.submit_exec(content))
          } else {
            if (res.data === 1) {
              wx.showModal({
                title: '上传成功' ,
                content: '感谢您的意见反馈，它对改进\r\n我们的工作起到很重要的作用!',
                showCancel: false
              })
              this.text = ''
            } else {
              wx.showToast({ title: '上传失败', icon: 'none' })
            }
            this.commiting = false
          }
        }
      })
    }
  }
}
</script>
<style lang="stylus" scoped>
.container
  Background()
  position absolute
  Height_Width(100%)
  Font(30rpx, 40rpx)
  textarea
    margin 30rpx
    height 300rpx
    width calc(100% - 60rpx)
    BorderBox()
    border-radius 10rpx
    border 1rpx solid #EEE
    background white
  .limit
    font-size 28rpx
    color #888
    margin-right 30rpx
    text-align right
</style>
