61 lines
1.7 KiB
Vue
61 lines
1.7 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(label="Дата", type="date", outlined)
|
|
base-custom-select(v-model="currentEmployee", label="Текущий сотрудник")
|
|
base-custom-select(v-model="currentEmployee", label="Замена сотрудника")
|
|
.time-wrapper.flex.justify-center.gap-x-6
|
|
base-input(
|
|
type="time",
|
|
label="Начало",
|
|
v-model="timesShift.start_time",
|
|
outlined
|
|
)
|
|
.flex.items-center.mt-4 —
|
|
base-input(
|
|
type="time",
|
|
label="Конец",
|
|
v-model="timesShift.end_time",
|
|
outlined
|
|
)
|
|
.flex.justify-center
|
|
q-btn(
|
|
label="Сохранить",
|
|
color="primary",
|
|
padding="8px 24px",
|
|
no-caps
|
|
)
|
|
</template>
|
|
|
|
<script>
|
|
import BaseCustomSelect from "@/components/base/BaseCustomSelect.vue";
|
|
import BaseInput from "@/components/base/BaseInput.vue";
|
|
|
|
export default {
|
|
name: "FormChangeShift",
|
|
components: { BaseCustomSelect, BaseInput },
|
|
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>
|