<template>
  <Centered1280Box class="OrganizationCalendar">
    <WhiteCard class="OrganizationCalendar__WhiteCard">
      <div class="OrganizationCalendar__Header">График работы</div>
      <ProductionCalendar :common="fakeCommon" :model="model" />
    </WhiteCard>
  </Centered1280Box>
</template>

<script lang="ts">
import { Component } from 'vue-property-decorator';
import ProductionCalendar from '@components/common/production-calendar-tab/index.vue';
import Centered1280Box from '@/recruits/components/common/centered-1280-box.vue';
import WhiteCard from '@/recruits/components/common/white-card.vue';

@Component({
  components: {
    ProductionCalendar,
    Centered1280Box,
    WhiteCard,
  },
  props: ['model'],
})
export default class OrganizationCardCalendar extends ProductionCalendar {
  // Для работы компонента ProductionCalendar который используется из старых карт основанных на baseCard
  // нужно передать ему common, поэтому собираем его здесь, зная какие поля необходимо указать для работы
  // закоментированные варианты это то что возможно пригодится если что-то сломается
  private fakeCommon = {
    // $websockets: null,
    active: 'calendar',
    id: this.$route.params.id,
    // models: {"index":{},"basic":{},"accounts":{},"departments":{},"calendar":{}},
    needToUpdate: false,
    path: 'organizations',
  };
}
</script>

<style lang="scss" scoped>
.OrganizationCalendar {
  &__WhiteCard {
    padding: 12px 16px;
    margin-bottom: 16px;
  }
  &__Header {
    padding-bottom: 12px;
    margin-bottom: 20px;
    border-bottom: 1px solid rgba(1, 72, 116, 0.11);
    font-family: 'Golos UI', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: -0.015em;
    color: rgba(2, 12, 18, 0.9);
  }
}
</style>
