WIP Поправила меню и формы

src/components/TheHeader.vue

@@ -41,7 +41,7 @@
         base-avatar.mr-2(:size="32", v-else)
           img.h-full.object-cover(:src="url + userData?.photo", alt="Avatar")
         q-btn(
-          @click="openPopup",
+          @click="openPopup"
           flat
           icon="app:icon-down-arrow",
           style="color: var(--font-dark-blue-color)",
@@ -49,13 +49,9 @@
           padding="4px 2px 2px 2px"
           dense,
         )
-        base-popup.right-2.top-10(
+          q-menu(style="margin-top: 19px !important")
-          corner,
+            .menu.p-4
-          v-if="showPopup",
+              .text-popup.flex.cursor-pointer.pl-2(@click="logout", v-close-popup) Выйти
-          :width="160",
-          v-click-outside="openPopup"
-        )
-          .text-popup.flex.cursor-pointer.pl-2(@click="logout") Выйти
 </template>
 
 <script>
@@ -121,25 +117,6 @@ export default {
 </script>
 
 <style lang="sass" scoped>
-.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
-
 .header-buttons
   outline: none
   border: none
@@ -173,4 +150,15 @@ export default {
   color: var(--btn-blue-color)
   &:hover
     opacity: 0.8
+
+.menu
+  width: 160px
+  max-width: 160px !important
+  border-radius: 4px
+  background-color: var(--default-white)
+</style>
+
+<style lang="sass">
+.q-menu
+  z-index: 40 !important
 </style>

src/components/base/BaseClientFormCreate.vue

@@ -122,8 +122,8 @@ export default {
     addImageIcon,
     TheNotificationProvider,
   },
+  emits: ["update:model-value"],
   props: {
-    //closeForm: Function,
     setUpdatedClients: Function,
     writeCreatedClientId: Function,
     modelValue: Boolean,
@@ -329,7 +329,7 @@ export default {
     postNewClient() {
       const formData = new FormData();
       formData.append("full_name", this.infoClient.basic.full_name);
-      formData.append("photo", this.imageData[0]);
+      if (this.imageData) formData.append("photo", this.imageData[0]);
       if (this.infoClient.basic.birth_date)
         formData.append(
           "birth_date",
@@ -394,9 +394,6 @@ export default {
       this.showModal = true;
       this.showPopup = false;
     },
-    /*changeOpenPopup() {
-      this.showPopup = true;
-    },*/
     saveDocFile(e) {
       this.infoClient.doc = e.target.files;
     },
@@ -544,5 +541,4 @@ export default {
   width: 1220px
   height: 794px
   background-color: var(--default-white)
-  //padding: 32px 370px 153px 370px
 </style>

src/pages/calendar/components/CalendarDeleteModal.vue

@@ -73,7 +73,6 @@ export default {
 
 .card-container
   width: 374px
-  height: 82px
   border-radius: 4px
   border: 1px solid var(--border-light-grey-color-1)
 </style>

src/pages/clients/components/ClientsTableRow.vue

@@ -325,7 +325,11 @@ export default {
           el.username !== this.dataClient.phone.username
         )
           updateContacts.push(this.dataClient.phone);
-        else if (this.dataClient.phone.username.length < 18) {
+        else if (
+          el.kind === "PHONE" &&
+          this.dataClient.phone.username &&
+          this.dataClient.phone.username.length < 18
+        ) {
           this.dataClient.phone.username =
             this.client.contacts.find((el) => el.kind === "PHONE")?.username ||
             "";
@@ -334,7 +338,6 @@ export default {
             "Введите мобильный номер состоящий из 11 цифр"
           );
         }
-
         if (
           el.kind === "EMAIL" &&
           el.username !== this.dataClient.email.username

src/pages/login/TheLogin.vue

@@ -14,7 +14,7 @@
             :rule="[wrongData => !!wrongData]",
             v-model="user.username",
             placeholder="Введите ваш логин",
-            label="Логин"
+            label="Логин",
             outlined
           )
           base-input(

src/pages/schedule/components/FormChangeShift.vue

@@ -1,7 +1,5 @@
 <template lang="pug">
-  .flex.flex-col.gap-y-6.pt-6.pb-7.px-8.event-form.fixed.right-6.bottom-6(
+  .flex.flex-col.gap-y-6.pt-6.pb-7.px-8.event-form.fixed.right-6.bottom-6
-    v-click-outside="closeForm"
-  )
     .flex.justify-between
       span.title.text-xl.font-bold Замена смен
       .flex.pt-2
@@ -48,12 +46,21 @@ import BaseInput from "@/components/base/BaseInput.vue";
 export default {
   name: "FormChangeShift",
   components: { BaseSelect, BaseInput },
-  props: { closeForm: Function, timesShift: Object },
+  emits: ["update:model-value"],
+  props: {
+    timesShift: Object,
+    modelValue: Boolean,
+  },
   data() {
     return {
       currentEmployee: { label: "", id: null },
     };
   },
+  methods: {
+    closeForm() {
+      this.$emit("update:model-value", false);
+    },
+  },
 };
 </script>
 

src/pages/schedule/components/ScheduleHeader.vue

@@ -1,12 +1,6 @@
 <template lang="pug">
   .flex.flex-col.gap-y-5
     .flex.justify-center.pl-8.pr-20.font-bold.text-xl Планировщик смен
-    transition(name="form")
-      form-change-shift(
-        v-if="showForm",
-        :close-form="closeForm",
-        :times-shift="timesShift"
-      )
     .flex
       .calendar-header-wrapper.flex.items-center.justify-between.py-3.pl-5.pr-6
         .flex
@@ -45,8 +39,12 @@
             color="primary",
             no-caps,
             padding="8px 24px",
-            @click="openForm",
           )
+            q-menu(v-model="showForm")
+              form-change-shift(
+                v-model="showForm",
+                :times-shift="timesShift"
+              )
 </template>
 
 <script>
@@ -87,9 +85,6 @@ export default {
     openForm() {
       this.showForm = true;
     },
-    closeForm() {
-      this.showForm = false;
-    },
     previousHandler() {
       this.$emit("switch-previous-month");
     },
@@ -126,25 +121,6 @@ export default {
 .text
   color: var(--font-dark-blue-color)
 
-.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
-
 .secondary
   background-color: var(--btn-blue-sec-color)
   border: 1px solid var(--btn-blue-sec-color)