From 79faa743fb0206a36257610109c37d673a9dba8e Mon Sep 17 00:00:00 2001 From: Daria Golova Date: Thu, 22 Dec 2022 17:26:05 +0300 Subject: [PATCH] =?UTF-8?q?WIP=20EmployeesList=20=D0=BF=D0=BE=D0=B4=D1=82?= =?UTF-8?q?=D1=8F=D0=B3=D0=B8=D0=B2=D0=B0=D0=B5=D1=82=D1=81=D1=8F=20=D0=B8?= =?UTF-8?q?=D0=B7=20Schedules?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/calendar/TheCalendar.vue | 37 +++++-- .../calendar/components/CalendarColumn.vue | 19 +--- .../components/CalendarFormAddEvent.vue | 97 +++++++++++++++---- .../calendar/components/CalendarSchedule.vue | 19 ++-- .../calendar/components/CalendarSidebar.vue | 6 +- 5 files changed, 123 insertions(+), 55 deletions(-) diff --git a/src/pages/calendar/TheCalendar.vue b/src/pages/calendar/TheCalendar.vue index f175704..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", @@ -31,6 +31,7 @@ :selected-event-data="selectedEvent", :event-statuses="eventStatuses", :time-information="timeInformation", + :current-date="currentDate", @clear-selected-event-data="clearSelectedEvent", @close-change-form="setChangeFormState" ) @@ -78,8 +79,9 @@ export default { dayEndTime: "22:00", }, eventsData: [], - employeesData: [], + schedulesData: [], isOpenForm: false, + WORKING_STATUS: "WORKS", changeFormWasClosed: false, eventStatuses: [ { @@ -140,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/?date=${this.currentDate.format("YYYY-MM-DD")}`) - .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,11 +209,11 @@ export default { } }, currentDate() { - this.fetchEmployeesData(); + 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 39ae25e..a1ad860 100644 --- a/src/pages/calendar/components/CalendarColumn.vue +++ b/src/pages/calendar/components/CalendarColumn.vue @@ -70,20 +70,9 @@ export default { }, computed: { workingShift() { - console.log(this.ownerData); if (!this.ownerData.id) return null; - let foundedSchedule = this.ownerData.schedule.find( - (elem) => elem.date === this.currentDate.format("YYYY-MM-DD") - ); - if (!foundedSchedule) return null; - let start = foundedSchedule.start_time.slice( - 0, - foundedSchedule.start_time.length - 3 - ); - let end = foundedSchedule.end_time.slice( - 0, - foundedSchedule.end_time.length - 3 - ); + let start = this.ownerData.start_time; + let end = this.ownerData.end_time; return { start: start.split(":"), end: end.split(":"), @@ -269,6 +258,6 @@ export default { .nonworking-time width: 100% - background-color: var(--font-dark-blue-color) - opacity: 0.05 + background-color: var(--btn-blue-sec-color) + opacity: 0.3 diff --git a/src/pages/calendar/components/CalendarFormAddEvent.vue b/src/pages/calendar/components/CalendarFormAddEvent.vue index 65ecdf4..21a0d0f 100644 --- a/src/pages/calendar/components/CalendarFormAddEvent.vue +++ b/src/pages/calendar/components/CalendarFormAddEvent.vue @@ -113,6 +113,12 @@ export default { return {}; }, }, + currentDate: { + type: Object, + default() { + return {}; + }, + }, }, data() { return { @@ -130,6 +136,7 @@ export default { ifClearedForm: true, membersData: [], ownersData: [], + WORKING_STATUS: "WORKS", }; }, computed: { @@ -298,10 +305,27 @@ export default { }, checkTime() { let counter = 0; + let foundedSchedule = {}; + let foundedEmployee = this.ownersData.find( + (elem) => elem.id === this.employees.employee.id + ); + if (foundedEmployee) + foundedSchedule = foundedEmployee.schedules.find( + (elem) => + elem.date === this.eventDate && elem.status === this.WORKING_STATUS + ); + if (!foundedSchedule) { + this.addErrorNotification( + "Некорректная дата события", + `В данный день ${this.employees.employee.label} не работает` + ); + counter += 1; + return false; + } if ( this.checkTimeLimits( this.startTime, - this.timeInformation.dayStartTime, + foundedSchedule.start_time, "start" ) ) { @@ -311,13 +335,7 @@ export default { ); counter += 1; } - if ( - this.checkTimeLimits( - this.endTime, - this.timeInformation.dayEndTime, - "end" - ) - ) { + if (this.checkTimeLimits(this.endTime, foundedSchedule.end_time, "end")) { this.addErrorNotification( "Некорректное время окончания события", "Время окончания события позже окончания рабочего дня" @@ -325,11 +343,7 @@ export default { counter += 1; } if ( - this.checkTimeLimits( - this.endTime, - this.timeInformation.dayStartTime, - "start" - ) + this.checkTimeLimits(this.endTime, foundedSchedule.start_time, "start") ) { this.addErrorNotification( "Некорректное время окончания события", @@ -338,11 +352,7 @@ export default { counter += 1; } if ( - this.checkTimeLimits( - this.startTime, - this.timeInformation.dayEndTime, - "end" - ) + this.checkTimeLimits(this.startTime, foundedSchedule.end_time, "end") ) { this.addErrorNotification( "Некорректное время начала события", @@ -485,11 +495,58 @@ export default { }, fetchOwnersData() { fetchWrapper - .get("general/employee/") + .get( + `accounts/schedules/?date_after=${this.currentDate + .clone() + .subtract(1, "month") + .format("YYYY-MM-DD")}&date_before=${this.currentDate + .clone() + .add(1, "month") + .format("YYYY-MM-DD")}` + ) .then((res) => this.saveOwnersData(res)); }, saveOwnersData(res) { - this.ownersData = res.results; + let serializedList = []; + if (res.results.length === 0) { + this.ownersData = []; + return; + } + res.results.forEach((elem) => { + let foundedElem = serializedList.find( + (item) => item.id === elem.employee.id + ); + if (!foundedElem) { + serializedList.push({ + id: elem.employee.id, + last_name: elem.employee.last_name, + first_name: elem.employee.first_name, + patronymic: elem.employee.patronymic, + color: elem.employee.color, + schedules: [ + { + date: elem.date, + end_time: elem.end_time.slice(0, elem.end_time.length - 3), + start_time: elem.start_time.slice( + 0, + elem.start_time.length - 3 + ), + status: elem.status, + id: elem.id, + }, + ], + }); + } else { + foundedElem.schedules.push({ + date: elem.date, + end_time: elem.end_time.slice(0, elem.end_time.length - 3), + start_time: elem.start_time.slice(0, elem.start_time.length - 3), + status: elem.status, + id: elem.id, + }); + } + }); + this.ownersData = serializedList; }, saveMembersData(res) { this.membersData = res.results; diff --git a/src/pages/calendar/components/CalendarSchedule.vue b/src/pages/calendar/components/CalendarSchedule.vue index d205a19..8d67086 100644 --- a/src/pages/calendar/components/CalendarSchedule.vue +++ b/src/pages/calendar/components/CalendarSchedule.vue @@ -94,7 +94,7 @@ export default { }, }, sidebarWidth: String, - ownersData: { + schedulesData: { type: Array, default() { return []; @@ -168,15 +168,16 @@ export default { }, filteredOwners() { let filteredArray = []; - this.ownersData.forEach((elem) => { + this.schedulesData.forEach((elem) => { filteredArray.push({ - id: elem.id, - last_name: elem.last_name, - first_name: elem.first_name, - patronymic: elem.patronymic, - color: elem.color, - photo: elem.photo, - schedule: elem.schedule, + id: elem.employee.id, + last_name: elem.employee.last_name, + first_name: elem.employee.first_name, + patronymic: elem.employee.patronymic, + color: elem.employee.color, + photo: elem.employee.photo, + end_time: elem.end_time.slice(0, elem.end_time.length - 3), + start_time: elem.start_time.slice(0, elem.start_time.length - 3), }); }); return filteredArray; diff --git a/src/pages/calendar/components/CalendarSidebar.vue b/src/pages/calendar/components/CalendarSidebar.vue index 8f785f0..74e29b8 100644 --- a/src/pages/calendar/components/CalendarSidebar.vue +++ b/src/pages/calendar/components/CalendarSidebar.vue @@ -45,7 +45,7 @@ export default { CalendarSidebarTeammate, }, props: { - teamData: Array, + schedulesData: Array, openFormCreate: Function, eventStatuses: Array, url: String, @@ -74,6 +74,10 @@ export default { width: this.widthSidebarClose, }; }, + teamData() { + if (this.schedulesData.length === 0) return []; + return this.schedulesData.map((elem) => elem.employee); + }, }, methods: { changeSize() {