<template>
  <Modal>
    <div class="y-promopt">
      <!-- <div class="title">{{title}}:</div> -->
      <textarea v-model.trim="text" class="textarea" :placeholder="title" auto-focus></textarea>
      <div class="btn-group">
        <div @click="cancel" class="btn-cancel">取消</div>
        <div @click="confirm" class="btn-confirm">确定</div>
      </div>
    </div>
  </Modal>
</template>

<script>
import Modal from './modal'
export default {
  components: {
    Modal
  },
  props: {
    title: {
      type: String,
      default: ''
    },
    type: {
      type: String,
      default: 'textarea'
    }
  },
  data () {
    return {
      text: ''
    }
  },
  methods: {
    cancel () {
      this.$emit('close')
    },
    confirm () {
      if (!this.text) {
        this.$toast(this.title)
        return false
      }
      this.$emit('confirm', this.text)
      this.$emit('close')
    }
  }
}
</script>

<style lang="scss">
@import "./modal.scss";
</style>