[WIP] Изменил конфиг, исправил отображение статусов в селекте календаря

src/pages/calendar/TheCalendar.vue

@@ -56,7 +56,7 @@ import CalendarSidebar from "./components/CalendarSidebar.vue";
 import CalendarFormAddEvent from "./components/CalendarFormAddEvent.vue";
 import BaseModal from "@/components/base/BaseModal.vue";
 import CalendarDeleteModal from "./components/CalendarDeleteModal.vue";
-import { calendarConfig } from "@/pages/calendar/utils/calendarConfig";
+import { statusesDictionary } from "@/pages/calendar/utils/statusesDictionary";
 
 export default {
   name: "TheCalendar",
@@ -86,7 +86,7 @@ export default {
       isOpenForm: false,
       WORKING_STATUS: "WORKS",
       changeFormWasClosed: false,
-      eventStatuses: calendarConfig,
+      eventStatuses: statusesDictionary,
     };
   },
   methods: {

src/pages/calendar/components/CalendarEventDescriptionCard.vue

@@ -26,7 +26,8 @@
 </template>
 
 <script>
-import { statusesDictionary } from "../utils/statusesDictionary.js";
+import { statusesDictionary } from "@/pages/calendar/utils/statusesDictionary";
+
 export default {
   name: "CalendarEventDescriptionCard",
   props: {
@@ -47,12 +48,14 @@ export default {
     return {
       isCertainType: true,
       position: {},
+      calendarConfig: statusesDictionary,
     };
   },
   computed: {
     status() {
       return this.ownerEvent.status
-        ? statusesDictionary[this.ownerEvent.status]
+        ? this.calendarConfig.find((e) => e.value === this.ownerEvent.status)
+            .label
         : "";
     },
     typeColor() {

src/pages/calendar/components/CalendarFormAddEvent.vue

@@ -1,11 +1,16 @@
 <template lang="pug">
-  base-modal(v-model="value", :title="!selectedEventData.id ? 'Запись на прием' : 'Изменение записи'", draggable, hide-overlay )
+  base-modal(
+    v-model="value",
+    :title="!selectedEventData.id ? 'Запись на прием' : 'Изменение записи'",
+    draggable,
+    hide-overlay
+  )
     .event-form.flex.flex-col.gap-y-6.pt-8
       .flex.flex-col.gap-y-8
         base-select(
           v-if="selectedEventData.id"
           v-model="status",
-          :items="eventStatuses",
+          :items="statusesList",
           label="Статус приема"
         )
         base-input(
@@ -75,9 +80,9 @@ import { fetchWrapper } from "@/shared/fetchWrapper.js";
 import BaseInput from "@/components/base/BaseInput.vue";
 import BaseSelect from "@/components/base/BaseSelect.vue";
 import * as moment from "moment/moment";
-import { statusesDictionary } from "../utils/statusesDictionary.js";
 import BaseModal from "@/components/base/BaseModal.vue";
 import { v_model } from "@/shared/mixins/v-model";
+import { statusesDictionary } from "@/pages/calendar/utils/statusesDictionary";
 
 export default {
   name: "FormChangeEvent",
@@ -127,12 +132,13 @@ export default {
       members: {},
       employees: {},
       eventDate: Date,
-      status: {},
+      status: { label: "Планируется прием", id: null },
       id: null,
       ifClearedForm: true,
       membersData: [],
       ownersData: [],
       WORKING_STATUS: "WORKS",
+      calendarConfig: statusesDictionary,
     };
   },
   computed: {
@@ -170,6 +176,16 @@ export default {
       }
       return [];
     },
+    statusesList() {
+      let filteredArray = [];
+      this.calendarConfig.forEach((elem) => {
+        filteredArray.push({
+          id: elem.id,
+          label: elem.label,
+        });
+      });
+      return filteredArray;
+    },
     disabledCreateButton() {
       if (
         this.eventDate &&
@@ -267,26 +283,29 @@ export default {
         role: this.MEMBER_TYPE,
       };
     },
+
+    eventId() {
+      return this.selectedEventData.id ? this.selectedEventData.id : "";
+    },
     eventStatus() {
       return this.selectedEventData.status
         ? {
-            label: statusesDictionary[this.selectedEventData.status],
+            label: this.calendarConfig.find(
-            id: null,
+              (e) => e.value === this.selectedEventData.status
+            ).label,
+            id: this.calendarConfig.find(
+              (e) => e.value === this.selectedEventData.status
+            ).id,
           }
         : {
-            label: statusesDictionary["PLANNED"],
+            label: this.calendarConfig.find((e) => e.value === "PLANNED").id,
-            id: null,
+            id: 0,
           };
     },
-    eventId() {
-      return this.selectedEventData.id ? this.selectedEventData.id : "";
-    },
   },
   methods: {
     findStatus(value) {
-      return Object.keys(statusesDictionary).find(
+      return this.calendarConfig.find((e) => e.label === value)?.value;
-        (key) => statusesDictionary[key] === value
-      );
     },
     checkTimeLimits(eventTime, scheduleTime, timeType) {
       if (timeType === "start")

src/pages/calendar/utils/calendarConfig.js

@@ -1,44 +0,0 @@
-export const calendarConfig = [
-  {
-    id: 0,
-    label: "Планируется прием",
-    value: "PLANNED",
-    color: "var(--default-white)",
-  },
-  {
-    id: 1,
-    label: "Отменил",
-    value: "CANCELED",
-    color: "var(--bg-event-grey-color)",
-  },
-  {
-    id: 2,
-    label: "Ожидается прием",
-    value: "EXPECTED",
-    color: "var(--bg-event-yellow-color)",
-  },
-  {
-    id: 3,
-    label: "Опаздывает",
-    value: "LATE",
-    color: "var(--bg-event-orange-color)",
-  },
-  {
-    id: 4,
-    label: "Идет прием",
-    value: "RECEPTION",
-    color: "var(--bg-event-blue-color)",
-  },
-  {
-    id: 5,
-    label: "Прием завершен",
-    value: "COMPLETED",
-    color: "var(--bg-event-green-color)",
-  },
-  {
-    id: 6,
-    label: "Не пришел",
-    value: "DID_NOT_COME",
-    color: "var(--bg-event-red-color)",
-  },
-];

src/pages/calendar/utils/statusesDictionary.js

@@ -1,9 +1,44 @@
-export const statusesDictionary = {
+export const statusesDictionary = [
-  PLANNED: "Планируется прием",
+  {
-  EXPECTED: "Ожидается прием",
+    id: 0,
-  RECEPTION: "Идет прием",
+    label: "Планируется прием",
-  COMPLETED: "Прием завершен",
+    value: "PLANNED",
-  DID_NOT_COME: "Не пришел",
+    color: "var(--default-white)",
-  LATE: "Опаздывает",
+  },
-  CANCELED: "Отменил",
+  {
-};
+    id: 1,
+    label: "Отменил",
+    value: "CANCELED",
+    color: "var(--bg-event-grey-color)",
+  },
+  {
+    id: 2,
+    label: "Ожидается прием",
+    value: "EXPECTED",
+    color: "var(--bg-event-yellow-color)",
+  },
+  {
+    id: 3,
+    label: "Опаздывает",
+    value: "LATE",
+    color: "var(--bg-event-orange-color)",
+  },
+  {
+    id: 4,
+    label: "Идет прием",
+    value: "RECEPTION",
+    color: "var(--bg-event-blue-color)",
+  },
+  {
+    id: 5,
+    label: "Прием завершен",
+    value: "COMPLETED",
+    color: "var(--bg-event-green-color)",
+  },
+  {
+    id: 6,
+    label: "Не пришел",
+    value: "DID_NOT_COME",
+    color: "var(--bg-event-red-color)",
+  },
+];