<template>
<div class="suggestion">
  <span class="title">意见箱：</span>
  <van-field
      v-model="message"
      class="field"
      rows="9"
      autosize
      type="textarea"
      maxlength="200"
      placeholder="请输入意见详情"
      show-word-limit
  />
  <div class="btn" @click="submit">提交建议</div>
</div>
</template>

<script>
import {Dialog, Notify} from "vant";

export default {
  name: "suggestion",
  methods:{
    submit(){
      Dialog.confirm({
        title: '提醒',
        message: '确认提交此建议？',
      })
          .then(() => {
            let params = {
              content:this.message
            }
            this.$api.addSuggestion(params).then(res=>{
              Notify({ type: 'success', message: '提交成功' });
            })
          })
          .catch(() => {
            // on cancel
          });

    },
  },
  data(){
    return {
      message:''
    }
  },
}
</script>

<style scoped lang="less">
.suggestion{
  padding: 24px;
  .title{
    display: inline-block;
    font-size: 24px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #01040D;
    line-height: 32px;
    margin-bottom: 20px;
  }
  .btn{
    margin-top: 20px;
  }
  .field{
    background: #F4F5F6;
  }
}
</style>