[WIP] Добавил переход на главную страницу при клике на иконку, заменил иконку уведомления об ошибке, поправил стили

src/components/Notifications/NotificationItem.vue

@@ -2,7 +2,12 @@
   .notification-container.flex.justify-between(:style="{ backgroundColor: bgColor }")
     .notification-content.flex.mr-16
       .grid(:class="{'grid-rows': message}")
-        .text-white.text-xs.icon.row-span-full.flex.justify-center.items-center(:class="iconClass")
+        .text-white.text-xs.icon.row-span-full.flex.justify-center.items-center(
+          v-if="this.type !== 'error'",
+          :class="iconClass"
+        )
+        .error.text-xs.row-span-full.flex.justify-center.items-center(v-else)
+          img(:src="errorIcon")
         .text-white.text-base.font-black(v-if="title") {{ title }}
         .text-white.text-base.font-semibold(v-if="message") {{ message }}
     .icon-cancel.cursor-pointer.text-white.opacity-50.text-sm(class="hover:opacity-100 active:opacity-75", @click="delNotification")
@@ -10,6 +15,7 @@
 
 <script>
 import { deleteNotification } from "@/components/Notifications/notificationContext";
+import errorIcon from "@/assets/icons/error.svg";
 
 export default {
   name: "NotificationItem",
@@ -23,6 +29,7 @@ export default {
   data() {
     return {
       timerId: 0,
+      errorIcon,
     };
   },
   computed: {
@@ -73,6 +80,7 @@ export default {
   border-radius: 5px
   width: 100%
   left: 0
+
 .icon
   border-radius: 50%
   border: 1.5px solid white
@@ -80,9 +88,16 @@ export default {
   line-height: 10px
   width: 24px
   height: 24px
+
+.error
+  border-radius: 50%
+  width: 24px
+  height: 24px
+
 .grid
   grid-template-columns: 24px 1fr
   grid-column-gap: 8px
+
 .grid-rows
   grid-template-rows: repeat(2, auto)
   grid-row-gap: 8px

src/components/TheHeader.vue

@@ -1,7 +1,11 @@
 <template lang="pug">
   .header-wrapper.relative.flex.justify-center.box-border.py-2.pl-4_75px.pr-6
     .flex.items-center.box-border.cursor-pointer.mr-auto
-      img.logo-img.mr-29_25px(src="@/assets/images/logo.svg", alt="Logo")
+      img.logo-img.mr-29_25px(
+        src="@/assets/images/logo.svg",
+        alt="Logo",
+        @click="redirectHomePage"
+      )
       header-inputs
     .flex.ml-auto
       q-btn.mr-9(
@@ -103,6 +107,9 @@ export default {
     },
   },
   methods: {
+    redirectHomePage() {
+      this.$router.push("/calendar");
+    },
     logout() {
       localStorage.removeItem("tokenAccess");
       this.$router.go("/login");

src/components/TheSidebar.vue

@@ -78,6 +78,9 @@ export default {
     "$route.path"() {
       if (this.$router.currentRoute._value.fullPath === "/calendar") {
         this.currenPageBorder = true;
+        this.pageSettings.forEach((el) =>
+          el.path === "#/calendar" ? (el.active = true) : (el.active = false)
+        );
       } else this.currenPageBorder = false;
     },
   },

src/components/base/BaseClientFormCreate.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  base-modal(v-model="value", hide-overlay, title="Создание клиента", draggable, height="696px" )
+  base-modal(v-model="value", hide-overlay, title="Создание клиента", draggable )
     .wrapper-create.gap-y-8.flex.flex-col.pt-8
       .flex.gap-x-4.h-fit
         .flex.gap-x-3.w-full