import BaseButton from '@elements/BaseButton/index.vue';

export default {
  name: 'BaseAlert',
  components: {
    BaseButton,
  },
  props: {
    apperance: {
      type: String,
      default: 'success',
      validator(value) {
        return ['success', 'error', 'warning'].indexOf(value) !== -1;
      },
    },
  },
  data() {
    return {
      displayTime: null,
    };
  },
  updated() {
    this.clear();
    this.displayTime = setTimeout(() => {
      this.onAlertClose();
    }, 5000);
  },
  computed: {
    classObject() {
      return {
        'alert-success': this.apperance === 'success',
        'alert-error': this.apperance === 'error',
        'alert-warning': this.apperance === 'warning',
      };
    },
  },
  methods: {
    onAlertClose() {
      this.clear();
      this.$emit('close', this.$refs.container);
    },
    clear() {
      if (this.displayTime) {
        clearTimeout(this.displayTime);
        this.displayTime = null;
      }
    }
  },
};
