Настроила сохранение ФИО исполнителя в форме

server.js

@@ -494,7 +494,7 @@ export function clientsServer() {
                   id: "db831a14-e836-481f-a653-6325de7c311e",
                   last_name: "Жмыхов",
                   first_name: "Егор",
-                  patronymic: "Сергеевич",
+                  patronymic: "Александрович",
                 },
                 role: null,
               },
@@ -537,7 +537,7 @@ export function clientsServer() {
                   id: "db831a14-e836-481f-a653-6325de7c311e",
                   last_name: "Жмыхов",
                   first_name: "Егор",
-                  patronymic: "Сергеевич",
+                  patronymic: "Александрович",
                 },
                 role: "owner",
               },

src/components/base/BaseSelect.vue

@@ -15,21 +15,21 @@
         :id="id"
         )
         .option.px-4.py-1(
-          v-for="responsible in listData"
+          v-for="data in listData"
           @click="(e) => chooseOption(e)"
-          :key="responsible"
+          :key="data.id || data"
-          :id="responsible"
+          :id="data.id || data"
-          ) {{responsible}}
+          ) {{data.name || data}}
     .flex.select.cursor-pointer.w-full.text-xl.items-center.networks(v-if="forNetworks" :class="optionData, 'px-2.5'")
       .absolute.options.top-11.left-0(
         v-show="isSelectOpen"
         :id="id")
         .flex.option.justify-center.py-1.text-xl(
-          v-for="responsible in listData"
+          v-for="data in listData"
           @click="(e) => chooseOption(e)"
-          :key="responsible.network"
+          :key="data.network"
-          :id="responsible.network"
+          :id="data.network"
-          :class="responsible.icon"
+          :class="data.icon"
           )
     .select-form-separator.cursor-pointer.mr-6px(v-if="separator")
     .text-xsm.ml-2.pt-1.icon-down-arrow.icon.text-center(v-if="!forNetworks" :class="{ open: isSelectOpen}")

src/pages/calendar/TheCalendar.vue

@@ -1,9 +1,10 @@
 <template lang="pug">
   .calendar-container.flex
     calendar-sidebar(@width="changeWidth"
-    :team-data="teamData"
+    :team-data="employeesData"
     :open-form-create="openFormCreateEvent")
     calendar-schedule(
+      :owners-data="employeesData"
       :current-date="currentDate"
       :time-information="timeInformation"
       :events-data="eventsData"
@@ -11,8 +12,12 @@
       @previous-date="switchPreviousDate"
       @next-date="switchNextDate"
       @selected-layout="changeCalendarLayout"
-      )
+    )
-    calendar-form-add-event(v-if="isOpenForm" :close-form="closeFormCreateEvent")
+    calendar-form-add-event(
+      v-if="isOpenForm"
+      :close-form="closeFormCreateEvent"
+      :owners-data="employeesData"
+    )
 </template>
 
 <script>
@@ -37,13 +42,13 @@ export default {
         dayEndTime: "20:00",
       },
       eventsData: [],
-      teamData: [],
+      employeesData: [],
       isOpenForm: false,
     };
   },
   methods: {
     switchPreviousDate() {
-      this.currentDate = this.currentDate.clone().subtract(1, "day");
+      this.currentDate = this.currentDate.cloddContactne().subtract(1, "day");
     },
     switchNextDate() {
       this.currentDate = this.currentDate.clone().add(1, "day");
@@ -54,16 +59,16 @@ export default {
     saveEventsData(res) {
       this.eventsData = res.results;
     },
-    saveTeamData(res) {
+    saveEmployeesData(res) {
-      this.teamData = res.results;
+      this.employeesData = res.results;
     },
     fetchEventsData() {
-      fetch("/registry/event/")
+      fetch("http://45.84.227.122:8080/registry/event/")
         .then((res) => res.json())
         .then((res) => this.saveEventsData(res));
       fetch("http://45.84.227.122:8080/general/employee/")
         .then((res) => res.json())
-        .then((res) => this.saveTeamData(res));
+        .then((res) => this.saveEmployeesData(res));
     },
     changeWidth(value) {
       this.sidebarWidth = value;

src/pages/calendar/components/CalendarFormAddEvent.vue

@@ -1,14 +1,14 @@
 <template lang="pug">
-  .flex.flex-col.gap-y-6.pt-6.pb-7.px-8.event-form.absolute.right-2.bottom-14
+  .flex.flex-col.gap-y-6.pt-6.pb-7.px-8.event-form.absolute.right-2.bottom-14(@click="output")
     .flex.flex-col.gap-y-2
       .flex.justify-between.pt-2
         span.text-xs.opacity-40.font-bold.leading-3 Ответственный
         .icon-cancel.close-icon.text-xs.cursor-pointer(@click="closeForm")
       base-select(
         :size-input="responsibleInputSize"
-        :option-data="eventData.responsible"
+        :option-data="ownerName"
-        :list-data="listResponsible"
+        :list-data="filteredOwners"
-        :choose-option="chooseOptionResponsible"
+        :choose-option="chooseOptionOwner"
         placeholder="Выберите ответственного"
         separator
       )
@@ -19,13 +19,13 @@
         .flex.gap-x-2.items-center
           .time-input.flex.gap-x-2.px-4.py-2.items-center
             input.item-input.text-base.cursor-text(
-                v-model="eventData.timeEvent.firstTime"
+                v-model="eventData.start"
                 placeholder ="11:00"
               )
           span —
           .time-input.flex.gap-x-2.px-4.py-2.items-center
             input.item-input.text-base.cursor-text(
-                v-model="eventData.timeEvent.secondTime"
+                v-model="eventData.end"
                 placeholder ="12:30"
               )
       .flex.gap-x-4.items-center
@@ -70,8 +70,11 @@ export default {
   components: { BaseSelect, BaseButton },
   props: {
     closeForm: Function,
-    listResponsible: {
+    ownersData: {
-      default: ["Захарова А.О.", "Коломойцев И.К.", "Ситников А.Г."],
+      type: Array,
+      default() {
+        return [];
+      },
     },
   },
   data() {
@@ -81,6 +84,17 @@ export default {
       kindEventSize: 10,
       kindEvents: ["Встреча", "Планерка", "Интервью", "Важная работа"],
       eventData: {
+        start: "",
+        end: "",
+        kind: "",
+        members: [],
+        employees: [
+          {
+            employee: null,
+            role: "owner",
+          },
+        ],
+        contacts: [],
         responsible: "",
         eventClient: "",
         timeEvent: {
@@ -88,16 +102,36 @@ export default {
           secondTime: "",
         },
         kindEvent: "",
-        contacts: {},
       },
     };
   },
+  computed: {
+    filteredOwners() {
+      if (this.ownersData) {
+        let filteredArray = [];
+        this.ownersData.forEach((elem) => {
+          filteredArray.push({
+            id: elem.id,
+            name: this.trimName(elem),
+          });
+        });
+        return filteredArray;
+      }
+      return ["Захарова А.О.", "Коломойцев И.К.", "Ситников А.Г."];
+    },
+    ownerName() {
+      if (this.eventData.employees[0].employee) {
+        return this.trimName(this.eventData.employees[0].employee);
+      }
+      return "";
+    },
+  },
   methods: {
-    chooseOptionResponsible(e) {
+    chooseOptionOwner(e) {
-      this.eventData.responsible = e.target.id;
+      let foundEmployee = this.ownersData.find(
-      this.responsibleInputSize = this.eventData.responsible
+        (elem) => elem.id === e.target.id.split(" ")[0]
-        .split(" ")
+      );
-        .join("").length;
+      this.eventData.employees[0].employee = foundEmployee;
     },
     chooseOptionTypeEvent(e) {
       this.eventData.kindEvent = e.target.id;
@@ -110,6 +144,9 @@ export default {
         );
       }
     },
+    trimName(obj) {
+      return `${obj.last_name} ${obj.first_name[0]}.${obj.patronymic[0]}.`;
+    },
   },
 };
 </script>

src/pages/calendar/components/CalendarSchedule.vue

@@ -77,6 +77,12 @@ export default {
       },
     },
     sidebarWidth: String,
+    ownersData: {
+      type: Array,
+      default() {
+        return [];
+      },
+    },
   },
   data() {
     return {
@@ -138,34 +144,15 @@ export default {
     },
     filteredOwners() {
       let filteredArray = [];
-      let ownerAbsence = {
+      this.ownersData.forEach((elem) => {
-        id: null,
+        filteredArray.push({
-        last_name: null,
+          id: elem.id,
-        first_name: null,
+          last_name: elem.last_name,
-        patronymic: null,
+          first_name: elem.first_name,
-      };
+          patronymic: elem.patronymic,
-      this.eventsData.forEach(({ employees }) => {
+        });
-        let findedElement = employees.find((elem) => elem.role === "owner");
-        let emptyDataPresence = this.findObjectInArray(
-          filteredArray,
-          ownerAbsence
-        );
-        if (!findedElement && !emptyDataPresence) {
-          filteredArray.push(ownerAbsence);
-        }
-        if (findedElement) {
-          let ownerPresence = this.findObjectInArray(
-            filteredArray,
-            findedElement.employee
-          );
-          if (!ownerPresence) {
-            filteredArray.push(findedElement.employee);
-          }
-        }
       });
-      return filteredArray.sort(
+      return filteredArray;
-        (previous, subsequent) => Boolean(subsequent.id) - Boolean(previous.id)
-      );
     },
     ownersCount() {
       return this.filteredOwners.length;