47 lines
1.6 KiB
Vue
47 lines
1.6 KiB
Vue
<template lang="pug">
|
|
.flex.flex-col.gap-y-6.pt-6.pb-7.px-8.event-form.fixed.right-6.bottom-6(
|
|
v-click-outside="closeForm"
|
|
)
|
|
.flex.justify-between
|
|
span.title.text-xl.font-bold Замена смен
|
|
.flex.pt-2
|
|
.icon-cancel.close-icon.tesxt-xs.cursor-pointer(@click="closeForm")
|
|
.flex.flex-col.gap-y-6
|
|
base-input-date(label="Дата")
|
|
base-custom-select(v-model="currentEmployee", label="Текущий сотрудник")
|
|
base-custom-select(v-model="currentEmployee", label="Замена сотрудника")
|
|
.time-wrapper.flex.justify-center
|
|
base-input-time.px-4.item-input.text-base(label="Начало", v-model="timesShift.start_time")
|
|
base-input-time.px-4.item-input.text-base(label="Конец", v-model="timesShift.end_time")
|
|
.flex.justify-center
|
|
base-button.font-semibold(:size="40") Сохранить
|
|
</template>
|
|
|
|
<script>
|
|
import BaseCustomSelect from "@/components/base/BaseCustomSelect.vue";
|
|
import BaseInputDate from "@/components/base/BaseInputDate.vue";
|
|
import BaseInputTime from "@/components/base/BaseInputTime.vue";
|
|
import BaseButton from "@/components/base/BaseButton.vue";
|
|
|
|
export default {
|
|
name: "FormChangeShift",
|
|
components: { BaseCustomSelect, BaseInputDate, BaseInputTime, BaseButton },
|
|
props: { closeForm: Function, timesShift: Object },
|
|
data() {
|
|
return {
|
|
currentEmployee: { label: "", id: null },
|
|
};
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="sass" scoped>
|
|
.event-form
|
|
height: fit-content
|
|
width: 534px
|
|
background-color: var(--default-white)
|
|
box-shadow: var(--default-shadow)
|
|
border-radius: 4px
|
|
z-index: 5
|
|
</style>
|