<template>
  <van-form>
    <van-field v-model="specialty"
               rows="2"
               autosize
               label="医生擅长"
               type="textarea"
               maxlength="300"
               placeholder="擅长治疗方向"
               show-word-limit
               :rules="[{ required: true, message: '请输入擅长的治疗方向' }]" />

    <van-field v-model="description"
               rows="2"
               autosize
               label="医生简介"
               type="textarea"
               maxlength="1000"
               placeholder="医生简介"
               show-word-limit
               :rules="[{ required: true, message: '请输入医生简介' }]" />

    <div class="btn-wrap">
      <van-button class="next-step-btn"
                  type="info"
                  @click="submitForm">提交审核</van-button>

      <van-button class="skip-btn"
                  @click="skipBtn">跳过</van-button>
    </div>
  </van-form>
</template>

<script>
  export default {
    data() {
      return {
        specialty: "",   // 擅长
        description: ""     // 简介
      }
    },
    methods: {
      // 跳过医生简介,提交审核
      skipBtn() {
        this.$emit('handleSubmitAudit', { specialty: null, description: null })
      },
      // 提交审核
      submitForm() {
        if (this.specialty && this.description) {
          // 将数据存起来
          window.sessionStorage.setItem('doctorMessageForm', JSON.stringify({ specialty: this.specialty, description: this.description }))
          this.$emit('handleSubmitAudit', { specialty: this.specialty, description: this.description })
        } else {
          this.$toast('请填写医生擅长或医生简介内容!')
        }
      }
    },
    mounted() {
      let obj = JSON.parse(window.sessionStorage.getItem('doctorMessageForm'))
      if (obj) {
        this.specialty = obj.specialty
        this.description = obj.description
      }
    }
  }
</script>

<style lang="less">
  .btn-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    .skip-btn {
      width: 90%;
    }
    .next-step-btn {
      width: 90%;
      margin: 0.5rem 0;
    }
  }
</style>