<template>
<view :style="[mainStyle]">
<!--mine/feedback/feedback.wxml-->
<view class="box">
  <view class="tit">您的问题或建议：</view>
  <textarea type="text" name="text" placeholder="请简要描述你在使用产品过程中的问题和意见" placeholder-class="placeholder" class="textarea" @input="intText"></textarea>
</view>
<view class="box">
  <view class="tit">您的联系方式：</view>
  <input type="text" name="name" placeholder="姓名" placeholder-class="placeholder" class="ipt" @input="intName"></input>
  <input type="number" name="mobile" placeholder="手机号" placeholder-class="placeholder" class="ipt" @input="intMobile"></input>
  <view class="tip">请留下您的联系方式，以便我们能够方便了解问题以及您反馈问题结果。紧急问题可拨打{{phone ? phone : '客服电话'}}，获得及时帮助</view>
</view>
<button class="submit" @tap="confirm">立即反馈</button>
</view>
</template>

<script>
// mine/feedback/feedback.js
const app = getApp();
const req = require("../../utils/request.js");
const util = require("../../utils/util.js");

export default {
  data() {
    return {
	showPage:false,
	mainStyle: app.globalData.mainStyle,
      phone: '',
      text: '',
      name: '',
      mobile: ''
    };
  },

  components: {},
  props: {},
  onLoad: function (options) {
    this.getData();
  },
  methods: {
    intText(e) {
      this.setData({
        text: e.detail.value
      });
    },

    intName(e) {
      this.setData({
        name: e.detail.value
      });
    },

    intMobile(e) {
      this.setData({
        mobile: e.detail.value
      });
    },

    getData() {
      req.getRequest('/api/aboutAs', {}, res => {
        this.setData({
          phone: res.hotLine
        });
      });
    },

    confirm() {
      let that = this;

      if (!that.text) {
        req.msg('请简要描述你在使用产品过程中的问题和意见');
        return false;
      }

      if (!that.name) {
        req.msg('请输入您的姓名');
        return false;
      }

      if (!that.mobile) {
        req.msg('请输入您的手机号');
        return false;
      }
	  if(!util.isMobile(that.mobile)) return req.msg('请输入正确的手机号')

      req.postRequest('/api/feedback', {
        name: that.name,
        mobile: that.mobile,
        text: that.text
      }, res => {
        req.msg('您的问题反馈已提交，我们会尽快与您联系！');
		setTimeout(res=>{
			that.text = '';
			that.name = '';
			that.mobile = '';
		},300)
      });
    }

  }
};
</script>
<style>
@import "./feedback.css";
</style>