diff --git a/src/pages/calendar/TheCalendar.vue b/src/pages/calendar/TheCalendar.vue index aa9c410..cb83d7b 100644 --- a/src/pages/calendar/TheCalendar.vue +++ b/src/pages/calendar/TheCalendar.vue @@ -2,14 +2,14 @@ .calendar-container.flex calendar-sidebar( :url="url", - :team-data="employeesData", + :schedules-data="schedulesData", :open-form-create="openFormCreateEvent", :event-statuses="eventStatuses", @width="changeWidth", ) calendar-schedule( :url="url", - :owners-data="employeesData", + :schedules-data="schedulesData", :current-date="currentDate", :time-information="timeInformation", :events-data="eventsData", @@ -28,10 +28,10 @@ calendar-form-add-event( v-if="isOpenForm", :close-form="closeFormCreateEvent", - :owners-data="employeesData", :selected-event-data="selectedEvent", :event-statuses="eventStatuses", :time-information="timeInformation", + :current-date="currentDate", @clear-selected-event-data="clearSelectedEvent", @close-change-form="setChangeFormState" ) @@ -76,11 +76,12 @@ export default { showModal: false, timeInformation: { dayStartTime: "08:00", - dayEndTime: "20:00", + dayEndTime: "22:00", }, eventsData: [], - employeesData: [], + schedulesData: [], isOpenForm: false, + WORKING_STATUS: "WORKS", changeFormWasClosed: false, eventStatuses: [ { @@ -141,13 +142,28 @@ export default { saveEventsData(res) { this.eventsData = res.results; }, - saveEmployeesData(res) { - this.employeesData = res.results; + saveSchedulesData(res) { + if (res.results.length === 0) { + this.schedulesData = []; + return; + } + let filteredEmployees = res.results.filter( + (elem) => elem.status === this.WORKING_STATUS + ); + if (filteredEmployees.length === 0) { + this.schedulesData = []; + return; + } + this.schedulesData = filteredEmployees; }, - fetchEmployeesData() { + fetchSchedulesData() { fetchWrapper - .get("general/employee/") - .then((res) => this.saveEmployeesData(res)); + .get( + `accounts/schedules/?date_after=${this.currentDate.format( + "YYYY-MM-DD" + )}&date_before=${this.currentDate.format("YYYY-MM-DD")}` + ) + .then((res) => this.saveSchedulesData(res)); }, fetchEventsData() { fetchWrapper @@ -192,9 +208,12 @@ export default { this.clearSelectedEvent(); } }, + currentDate() { + this.fetchSchedulesData(); + }, }, mounted() { - this.fetchEmployeesData(); + this.fetchSchedulesData(); this.fetchEventsData(); }, }; diff --git a/src/pages/calendar/components/CalendarColumn.vue b/src/pages/calendar/components/CalendarColumn.vue index 6f648a0..a1ad860 100644 --- a/src/pages/calendar/components/CalendarColumn.vue +++ b/src/pages/calendar/components/CalendarColumn.vue @@ -12,7 +12,8 @@ span.owner-name.font-medium.text-base.mr-6 {{ ownerName }} img.icon-wrapper.cursor-pointer(src="@/assets/icons/lock.svg") column-header-checkbox - .body.pl-1.h-full(@dblclick="clickOnBackground") + .body(@dblclick="clickOnBackground") + .nonworking-time(:style="nonworkingStartTime") transition-group(name="card") calendar-event-card( v-for="event, index in dayEvents", @@ -27,18 +28,23 @@ @delete-event="transmitDeleteEvent", :schedule-body-ref="scheduleBodyRef", ) + .nonworking-time.absolute(:style="nonworkingEndTime")