<template>
  <div class="dashboard-summary-page">
    <Banner
      :static-data="{
        title: $_tr('title'),
        introduction: $_tr('introduction')
      }"
      :background-color="$_theme('colorDashboard')"
    />

    <TemplateContainer size="s">
      <component-listing
        id="dashboard-summary-listing"
        :static-data="foldersEntries"
      >
        <template #default="{ item }">
          <Link
            :inline="false"
            :href="formatHref({ name: item.route }, $_currentLang)"
          >
            <GedCard :herited-data="item" :color="$_theme('colorDashboard')" />
          </Link>
        </template>
      </component-listing>
    </TemplateContainer>
  </div>
</template>

<script>
import Banner from '@inside-commons/components/lib/Banner'
import TemplateContainer from '@inside-commons/components/lib/TemplateContainer'
import GedCard from '../../ged/sub-components/GedCard'

import { Link } from 'inside-collection/components'

import { formatHref } from '@inside-library/helpers/Langs'

export default {
  name: 'DashboardSummaryContainer',
  $_i18nRootPath: 'customs.DASHBOARD.SUMMARY',
  components: {
    Banner,
    TemplateContainer,
    Link,
    GedCard
  },
  computed: {
    foldersEntries() {
      return [
        {
          title: this.$t(
            'customs.DASHBOARD.SUMMARY.dashboardSops',
            this.$_currentLang
          ),
          route: 'DashboardListingSops'
        },
        {
          title: this.$t(
            'customs.DASHBOARD.SUMMARY.dashboardBrand',
            this.$_currentLang
          ),
          route: 'DashboardListingBrand'
        },
        {
          title: this.$t(
            'customs.DASHBOARD.SUMMARY.dashboardArchives',
            this.$_currentLang
          ),
          route: 'DashboardListingArchives'
        },
        {
          title: this.$t(
            'customs.DASHBOARD.SUMMARY.dashboardToValidate',
            this.$_currentLang
          ),
          route: 'DashboardListingToValidate'
        },
        {
          title: this.$t(
            'customs.DASHBOARD.SUMMARY.dashboardListingProcedures',
            this.$_currentLang
          ),
          route: 'DashboardListingProcedures'
        }
      ]
    }
  },
  methods: {
    formatHref
  }
}
</script>
