<template>
  <div class="filled bg-dark">
    <div class="d-flex align-items-center">
      <div class="px-3 py-2 align-self-start">
        <b-link
          id="esacHeaderLink"
          class="circle-size-5 d-flex border flex-column justify-content-center mt-2"
          @click="clickEsacHeaderBack"
        >
          <icon name="eshop-back" class="icon-size-3 text-white" />
        </b-link>
      </div>
      <b-img :src="companyLogo" class="icon-size-4 mr-2" />
      <h2 class="text-white pl-3">
        {{ $t('Esac.Title') }}
      </h2>
    </div>
  </div>
</template>
<script>
import { mapActions } from 'vuex'

export default {
  name: 'EsacHeader',
  data() {
    return {
      companyLogo: this.$const.constImage.COMPANY_LOGO,
    }
  },
  methods: {
    ...mapActions(['clickEsacHeaderBack']),
  },
}
</script>
