import Vue from 'vue'
import './SntFooter.scss'

export default Vue.extend({
  name: 'SntFooter',
  props: {
    title: {
      type: String,
      default: ''
    },
    items: {
      type: Array,
      default: () => ([])
    }
  },
  computed: {
    footers () {
      return this.items.map((item, i) => this.$_.defaults(
        this.$_.cloneDeep(item),
        {
          sequence: i + 1,
          href: '',
          label: '',
          visible: true
        }
      )).filter((item) => item.visible)
    }
  },
  template: `
    <div class="snt-footer">
      <div class="snt-footer__title">
        {{ title }}
      </div>
      <div class="snt-footer__list">
        <div
          v-for="(item, i) in footers"
          :key="'footer-'+i"
          class="snt-footer__item">
          <a
            :href="item.href"
            target="_blank">
            {{ item.label }}
          </a>
        </div>
      </div>
    </div>
  `
})
