Merge branch 'UC-212' into 'master'

WIP Настроила очистку форм

See merge request andrusyakka/urban-couscous!282

src/components/base/BaseClientFormCreate.vue

@@ -130,7 +130,7 @@ export default {
       networksSettings: column.find((el) => el.name === "networks")?.settings,
       prioritySettings: column.find((el) => el.name === "priority"),
       networkId: "",
-      infoClient: {
+      defaultInfoClient: {
         basic: {
           full_name: "",
           birth_date: null,
@@ -190,6 +190,7 @@ export default {
           },
         ],
       },
+      infoClient: {},
       forms: [
         {
           title: "Основное",
@@ -267,9 +268,6 @@ export default {
     closePopup() {
       this.showPopup = false;
     },
-    /*closeModal() {
-      !this.showModal ? this.closeForm() : null;
-    },*/
     async createIdentityDocument(id) {
       let doc = null;
       let filteredData = Object.keys(
@@ -370,6 +368,7 @@ export default {
               this.writeCreatedClientId(result.id);
               this.setUpdatedClients();
               this.addSuccessNotification();
+              this.value = false;
             });
           } else {
             this.addErrorNotification(
@@ -393,10 +392,7 @@ export default {
       this.infoClient.basic.priority = e.target.id;
     },
     saveClient() {
-      if (this.checkFormFullness()) {
+      if (this.checkFormFullness()) this.postNewClient();
-        this.postNewClient();
-        //this.closeForm();
-      }
     },
     changeOpenModal() {
       this.showModal = true;
@@ -483,6 +479,13 @@ export default {
         this.closeAddImage();
       }
     },
+    value(newValue) {
+      if (newValue === false)
+        this.infoClient = JSON.parse(JSON.stringify(this.defaultInfoClient));
+    },
+  },
+  mounted() {
+    this.infoClient = JSON.parse(JSON.stringify(this.defaultInfoClient));
   },
 };
 </script>

src/pages/calendar/TheCalendar.vue

@@ -15,25 +15,20 @@
       :events-data="eventsData",
       :sidebar-width="sidebarWidth",
       :event-statuses="eventStatuses",
-      :change-form-was-closed="changeFormWasClosed",
       @previous-date="switchPreviousDate",
       @next-date="switchNextDate",
       @selected-layout="changeCalendarLayout",
-      @reset-change-form="resetChangeFormState",
       @selected-event="writeEventData",
       @delete-event="openModal",
       :open-form-create-event="openFormCreateEvent"
     )
-    transition(name="form")
     calendar-form-add-event(
-        v-model="isOpenForm"
+      v-model="isOpenForm",
-        :close-form="closeFormCreateEvent",
       :selected-event-data="selectedEvent",
       :event-statuses="eventStatuses",
       :time-information="timeInformation",
       :current-date="currentDate",
-        @clear-selected-event-data="clearSelectedEvent",
+      @clear-event-data="clearSelectedEvent"
-        @close-change-form="setChangeFormState"
     )
     base-modal(
       v-model="showModal",
@@ -56,7 +51,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 { statusesDictionary } from "@/pages/calendar/utils/statusesDictionary";
+import { statusesConfig } from "@/pages/calendar/utils/statusesConfig";
 
 export default {
   name: "TheCalendar",
@@ -85,8 +80,8 @@ export default {
       schedulesData: [],
       isOpenForm: false,
       WORKING_STATUS: "WORKS",
-      changeFormWasClosed: false,
+      //changeFormWasClosed: false,
-      eventStatuses: statusesDictionary,
+      eventStatuses: statusesConfig,
     };
   },
   methods: {
@@ -148,18 +143,19 @@ export default {
       this.isOpenForm = false;
       this.fetchEventsData();
     },
-    setChangeFormState() {
+    /*setChangeFormState() {
       this.changeFormWasClosed = true;
     },
     resetChangeFormState() {
       this.changeFormWasClosed = false;
-    },
+    },*/
     writeEventData(eventData) {
       this.selectedEvent = eventData;
       this.openFormCreateEvent();
     },
     clearSelectedEvent() {
       this.selectedEvent = {};
+      this.closeFormCreateEvent();
     },
     openModal(eventData) {
       this.selectedEvent = eventData;
@@ -172,7 +168,7 @@ export default {
   watch: {
     showModal: function () {
       if (this.showModal === false) {
-        this.setChangeFormState();
+        //this.setChangeFormState();
         this.clearSelectedEvent();
       }
     },
@@ -191,23 +187,4 @@ export default {
 <style lang="sass" scoped>
 .calendar-container
   width: calc(100vw - 80px)
-
-.form-enter-from
-  opacity: 0
-  transform: translateY(300px)
-  pointer-events: none
-
-.form-enter-active
-  transition: 0.5s ease
-
-.form-leave-to
-  opacity: 0
-  transform: translateY(300px)
-  pointer-events: none
-
-.form-leave-active
-  transition: 0.5s ease
-
-.form-move
-  transition: 0.5s ease
 </style>

src/pages/calendar/components/CalendarColumn.vue

@@ -22,9 +22,7 @@
           :ownerEvent="event",
           :event-statuses="eventStatuses",
           :style="eventCardPosition(event.start, event.end)",
-          :change-form-was-closed="changeFormWasClosed",
           @selected-event="transmitEventData",
-          @reset-change-form="transmitResetChangeForm",
           @delete-event="transmitDeleteEvent",
           :schedule-body-ref="scheduleBodyRef",
         )
@@ -52,7 +50,7 @@ export default {
     dayEndTime: Number,
     dayStartTime: Number,
     eventStatuses: Array,
-    changeFormWasClosed: Boolean,
+    //changeFormWasClosed: Boolean,
     scheduleBodyRef: Node,
     url: String,
     openFormCreateEvent: Function,
@@ -165,9 +163,9 @@ export default {
     transmitEventData(eventData) {
       this.$emit("selected-event", eventData);
     },
-    transmitResetChangeForm() {
+    /*transmitResetChangeForm() {
       this.$emit("reset-change-form");
-    },
+    },*/
     transmitDeleteEvent(eventData) {
       this.$emit("delete-event", eventData);
     },

src/pages/calendar/components/CalendarEventCard.vue

@@ -40,7 +40,7 @@ export default {
   name: "CalendarEventCard",
   components: { CalendarEventDescriptionCard },
   props: {
-    changeFormWasClosed: Boolean,
+    //changeFormWasClosed: Boolean,
     ownerEvent: Object,
     eventStatuses: {
       type: Array,
@@ -244,7 +244,7 @@ export default {
       this.setDefaultTheme();
     },
   },
-  watch: {
+  /*watch: {
     changeFormWasClosed: {
       immediate: true,
       handler(newValue) {
@@ -254,7 +254,7 @@ export default {
         }
       },
     },
-  },
+  },*/
 };
 </script>
 

src/pages/calendar/components/CalendarEventDescriptionCard.vue

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

src/pages/calendar/components/CalendarFormAddEvent.vue

@@ -82,7 +82,7 @@ import BaseSelect from "@/components/base/BaseSelect.vue";
 import * as moment from "moment/moment";
 import BaseModal from "@/components/base/BaseModal.vue";
 import { v_model } from "@/shared/mixins/v-model";
-import { statusesDictionary } from "@/pages/calendar/utils/statusesDictionary";
+import { statusesConfig } from "@/pages/calendar/utils/statusesConfig";
 
 export default {
   name: "FormChangeEvent",
@@ -93,21 +93,16 @@ export default {
     TheNotificationProvider,
   },
   mixins: [v_model],
-  emits: ["clear-selected-event-data", "close-change-form"],
+  //emits: ["clear-selected-event-data", "close-change-form"],
+  emits: ["clear-event-data"],
   props: {
-    closeForm: Function,
+    //closeForm: Function,
     selectedEventData: {
       type: Object,
       default() {
         return {};
       },
     },
-    eventStatuses: {
-      type: Array,
-      default() {
-        return [];
-      },
-    },
     timeInformation: {
       type: Object,
       default() {
@@ -134,11 +129,10 @@ export default {
       eventDate: Date,
       status: { label: "Планируется прием", id: null },
       id: null,
-      ifClearedForm: true,
+      //ifClearedForm: true,
       membersData: [],
       ownersData: [],
       WORKING_STATUS: "WORKS",
-      calendarConfig: statusesDictionary,
     };
   },
   computed: {
@@ -178,7 +172,7 @@ export default {
     },
     statusesList() {
       let filteredArray = [];
-      this.calendarConfig.forEach((elem) => {
+      statusesConfig.forEach((elem) => {
         filteredArray.push({
           id: elem.id,
           label: elem.label,
@@ -290,22 +284,22 @@ export default {
     eventStatus() {
       return this.selectedEventData.status
         ? {
-            label: this.calendarConfig.find(
+            label: statusesConfig.find(
               (e) => e.value === this.selectedEventData.status
             ).label,
-            id: this.calendarConfig.find(
+            id: statusesConfig.find(
               (e) => e.value === this.selectedEventData.status
             ).id,
           }
         : {
-            label: this.calendarConfig.find((e) => e.value === "PLANNED").id,
+            label: statusesConfig.find((e) => e.value === "PLANNED").label,
             id: 0,
           };
     },
   },
   methods: {
     findStatus(value) {
-      return this.calendarConfig.find((e) => e.label === value)?.value;
+      return statusesConfig.find((e) => e.label === value)?.value;
     },
     checkTimeLimits(eventTime, scheduleTime, timeType) {
       if (timeType === "start")
@@ -402,6 +396,7 @@ export default {
       };
       await this.postCreateEvent(this.eventData);
       this.eventData = {};
+      this.value = false;
     },
     async updateEventData() {
       if (!this.checkTime()) return;
@@ -423,17 +418,18 @@ export default {
         };
         await this.postUpdateEvent(this.id, this.eventData);
         this.eventData = {};
+        this.value = false;
       } else
         this.addErrorNotification(
           "Событие не может быть изменено",
           "Клиент был удален"
         );
     },
-    clearForm() {
+    //clearForm() {
-      if (this.selectedEventData.id) this.$emit("close-change-form");
+    //  if (this.selectedEventData.id) this.$emit("close-change-form");
-      this.$emit("clear-selected-event-data");
+    //  this.$emit("clear-selected-event-data");
-      this.closeForm();
+    //  this.closeForm();
-    },
+    //},
     mergeDate(eventDate, time) {
       let parseTime = time.split(":");
       return moment(eventDate.setHours(parseTime[0], parseTime[1]), 0).format(
@@ -467,7 +463,7 @@ export default {
         );
       } else {
         this.addSuccessNotification("Событие успешно создано");
-        this.clearForm();
+        //this.clearForm();
       }
     },
     async postUpdateEvent(id, event) {
@@ -482,7 +478,7 @@ export default {
         );
       } else {
         this.addSuccessNotification("Изменения успешно сохранены");
-        this.clearForm();
+        //this.clearForm();
       }
     },
     personId(object, field) {
@@ -602,6 +598,9 @@ export default {
         }
       },
     },
+    value(newValue) {
+      if (newValue === false) this.$emit("clear-event-data");
+    },
   },
   mounted() {
     this.fetchOwnersData();

src/pages/calendar/components/CalendarSchedule.vue

@@ -26,9 +26,7 @@
           :day-end-time="validateEndTime",
           :style="columnSize",
           :event-statuses="eventStatuses",
-          :change-form-was-closed="changeFormWasClosed",
           @selected-event="transmitEventData",
-          @reset-change-form="transmitResetChangeForm",
           @delete-event="transmitDeleteEvent",
           :schedule-body-ref="$refs.scheduleBody",
           :open-form-create-event="openFormCreateEvent",
@@ -74,7 +72,7 @@ export default {
   props: {
     openFormCreateEvent: Function,
     url: String,
-    changeFormWasClosed: Boolean,
+    //changeFormWasClosed: Boolean,
     currentDate: {
       type: Object,
       default() {
@@ -314,9 +312,9 @@ export default {
         })
       );
     },
-    transmitResetChangeForm() {
+    /*transmitResetChangeForm() {
       this.$emit("reset-change-form");
-    },
+    },*/
     transmitEventData(eventData) {
       this.$emit("selected-event", eventData);
     },

src/pages/calendar/utils/statusesConfig.js

@@ -1,4 +1,4 @@
-export const statusesDictionary = [
+export const statusesConfig = [
   {
     id: 0,
     label: "Планируется прием",