import { integer } from 'vee-validate/dist/rules';

export default {
  name: 'BaseListing',
  props: {
    icon: {
      type: String,
    },
    subtitle: {
      type: String,
    },
    subtitlevalue: {
      type: String,
    },
    subtitlesecond: {
      type: String,
    },
    subtitlesecondvalue: {
      type: String,
    },
    showicon: {
      type: Boolean,
      default: true,
    },
    index: {
      type: Number,
      default: 0,
    },
    isOpen: {
      type: Boolean,
      default: false,
    },
    isDinamic: {
      type: Boolean,
      default: false,
    },
    titleSize: {
      type: String,
      default: 'small',
      validator(value) {
        return ['small', 'medium', 'large'].indexOf(value) !== -1;
      },
    },
    borderStatusColor: {
      type: String,
      default: '',
      validator(value) {
        return ['default', 'success', 'error', ''].indexOf(value) !== -1;
      },
    },
  },
  data() {
    return {
      showContent: false,
    };
  },
  computed: {
    classObject() {
      return {
        'border-status-default': this.borderStatusColor === 'default',
        'border-status-success': this.borderStatusColor === 'success',
        'border-status-error': this.borderStatusColor === 'error',
      };
    },
  },
  watch: {
    isOpen(newValue) {
      this.showContent = newValue;
    },
  },
  methods: {
    handleCardClick() {
      this.showContent = this.showContent == false ? true : false;
      this.$emit('callback', this.index);
    },
    onLink() {
      this.showContent = true;
      this.$emit('callback', this.showContent);
    },
  },
};
