<template lang="pug">
  .flex.flex-col.gap-y-6
    span.font-bold Общая информация
    base-custom-select(
      placeholder="Категория договора",
      v-model="category",
      :items="categories",
      label="Категория"          
    )
    .flex.justify-between.gap-4
      base-input-date.w-48(
        v-model="signedDate",
        label="Дата подписания"
      )        
      base-input-date.w-48(
        v-model="startDate",
        label="Начало оказания услуг"
      )        
      base-input-date.w-48(
        v-model="endDate",
        label="Окончание оказания услуг"
      )         
    base-custom-select(
      placeholder="Поручить",
      v-model="employee",
      :items="employees",
      label="Исполнитель"
    )
</template>

<script>
import BaseStepper from "@/components/base/BaseStepper";
import BaseInputDate from "@/components/base/BaseInputDate";
import BaseCustomSelect from "@/components/base/BaseCustomSelect.vue";

export default {
  name: "AgreementCommon",
  components: {
    BaseStepper,
    BaseInputDate,
    BaseCustomSelect,
  },
  data() {
    return {
      steps: [
        { id: "1", label: "1", value: "Договор" },
        { id: "2", label: "2", value: "Пациент" },
      ],
      category: {},
      categories: [
        { id: "Консультация", label: "Консультация" },
        { id: "Терапия", label: "Терапия" },
        { id: "Хирургия", label: "Хирургия" },
        { id: "Ортопедия", label: "Ортопедия" },
      ],
      signedDate: new Date(),
      startDate: new Date(),
      endDate: undefined,
      employee: {},
      employees: [],
    };
  },
};
</script>
