<template>
  <div class="leftRightPadding">
    <p class="suggestion-tip">请选择您反馈的问题类型</p>
    <ul class="suggestionList">
      <li
        v-for="(i, index) in suggestionList"
        @click="chooseHandle(index,i.code)"
        :key="i.name"
        :class="{choosedActive: currentIndex==index}"
      >
        {{i.name}}
      </li>
    </ul>

    <div class="clear"></div>

    <mt-field label="" placeholder="请详细描述反馈问题，或提出改进建议。（300字以内）" type="textarea" rows="4" v-model.trim="introduction" :attr="{ maxlength: 300 }"></mt-field>

    <div  style="margin-top: 34px">
      <mt-button type="danger" size="large" @click="saveHandle">提交</mt-button>
    </div>
  </div>
</template>

<script>
import {
  getFeedbackType,
  saveFeedbackAndSuggest
} from "@/api/suggest/suggest";

export default {
  name: 'suggestionBack',
  data() {
    return {
      suggestionList: [],
      currentIndex: 0,
      feedbackCode:1,
      introduction: '',
    }
  },
  mounted(){
    this.getFeedbackType1()
  },
  methods: {
    // 获取反馈建议问题类型
    getFeedbackType1: function(){
      let jsondata =  this.$utils.commonParams();
      console.log(jsondata)
      jsondata.sign = this.$utils.signObject(jsondata);
      getFeedbackType(jsondata).then(data => {
        console.log(data)
        this.suggestionList = data.data
      })
    },
    // 反馈建议问题类型切换事件
    chooseHandle: function (i,code) {
      console.log(code)
      this.currentIndex = i
      this.feedbackCode = code
    },
    // 提交建议反馈事件
    saveHandle: function() {
      if(this.introduction){
        let jsondata =  this.$utils.commonParams();
        jsondata.feedbackCode = this.feedbackCode
        jsondata.suggestDesc = this.introduction
        jsondata.sign = this.$utils.signObject(jsondata);
        saveFeedbackAndSuggest(jsondata).then(data => {
          console.log(data)
          if (data.code == 0) {
            this.introduction = ''
            this.$vux.toast.text('提交反馈成功', "top");
          }else{
            this.$vux.toast.text(data.message, "top");
          }
        })
      }else{
        this.$vux.toast.text('请输入反馈内容后再提交', "top");
      }
    }
  }
}
</script>

<style scoped lang="scss">
  .suggestion-tip {
    margin: 17px 0 13px;
    color: #6666;
  }

  .suggestionList {

    li {
      float: left;
      width: calc((100% - 19px) / 2);
      height: 33px;
      line-height: 33px;
      margin-bottom: 16px;
      border: 1px solid #B18181;
      text-align: center;
      font-size: 13px;
      &:nth-child(odd) {
        margin-right: 19px;
      }
    }
    .choosedActive {
      background: #F75959;
      border: 1px solid #A51E1E;
      color: #fff;
    }

  }
</style>
