113 lines
2.8 KiB
Vue
113 lines
2.8 KiB
Vue
<template lang="pug">
|
|
.event-form.flex.flex-col.gap-y-6.pt-6.pb-7.px-8.fixed.right-6.bottom-6
|
|
.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",
|
|
v-model="replacementSheet.date",
|
|
outlined
|
|
)
|
|
base-input(,
|
|
type="text"
|
|
v-model="replacementSheet.currentEmployee",
|
|
label="Текущий сотрудник",
|
|
outlined,
|
|
disabled
|
|
)
|
|
base-select(
|
|
:items="ownersList",
|
|
v-model="replacementSheet.replacementEmployee",
|
|
label="Замена сотрудника",
|
|
placeholder="Выберите сотрудника"
|
|
)
|
|
.time-wrapper.flex.justify-center.gap-x-6
|
|
base-input(
|
|
type="time",
|
|
label="Начало",
|
|
v-model="replacementSheet.start_time",
|
|
outlined
|
|
)
|
|
.flex.items-center.mt-4 —
|
|
base-input(
|
|
type="time",
|
|
label="Конец",
|
|
v-model="replacementSheet.end_time",
|
|
outlined
|
|
)
|
|
.flex.justify-center
|
|
q-btn(
|
|
label="Сохранить",
|
|
color="primary",
|
|
padding="8px 24px",
|
|
no-caps,
|
|
@click="changeShift(); closeForm()"
|
|
)
|
|
</template>
|
|
|
|
<script>
|
|
import BaseSelect from "@/components/base/BaseSelect.vue";
|
|
import BaseInput from "@/components/base/BaseInput.vue";
|
|
|
|
export default {
|
|
name: "FormChangeShift",
|
|
components: { BaseSelect, BaseInput },
|
|
emits: ["update:model-value"],
|
|
props: {
|
|
employees: Array,
|
|
serialized: Array,
|
|
modelValue: Boolean,
|
|
trimOwnerName: Function,
|
|
changeShift: Function,
|
|
replacementSheet: Object,
|
|
},
|
|
computed: {
|
|
ownersList() {
|
|
if (this.employees || this.serialized) {
|
|
let filteredArray = [];
|
|
this.employees.forEach((elem) => {
|
|
filteredArray.push({
|
|
id: elem.id,
|
|
label: this.trimOwnerName(
|
|
elem.last_name,
|
|
elem.first_name,
|
|
elem.patronymic
|
|
),
|
|
});
|
|
});
|
|
this.serialized.forEach((elem) => {
|
|
filteredArray.push({
|
|
id: elem.id,
|
|
label: this.trimOwnerName(
|
|
elem.last_name,
|
|
elem.first_name,
|
|
elem.patronymic
|
|
),
|
|
});
|
|
});
|
|
return filteredArray;
|
|
}
|
|
return [];
|
|
},
|
|
},
|
|
methods: {
|
|
closeForm() {
|
|
this.$emit("update:model-value", false);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="sass" scoped>
|
|
.event-form
|
|
height: fit-content
|
|
width: 534px
|
|
background-color: var(--default-white)
|
|
box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.25)
|
|
border-radius: 4px
|
|
z-index: 5
|
|
</style>
|