[WIP] Исправил update данных клиента, распространение клика и ховер текущего клиента

src/pages/clients/components/cells/TableCellBodyAge.vue

@@ -1,14 +1,19 @@
 <template lang="pug">
   .flex.box-border.px-4.items-center.w-full.text-sm(:style="{ minWidth : width + 'px' }")
-    span(v-if="!isOpenChange") {{value.age ? new Date().getFullYear() - new Date(value.age).getFullYear() : ""}}
-    base-input(v-if="isOpenChange" type="date" v-model:value="value.age" :width-input="124")
+    span(v-if="!isOpenChange") {{value.age ? value.age.split("-").reverse().join(".") : ""}}
+    base-input-date.input.max-h-10(
+      v-if="isOpenChange",
+      @click.stop,
+      v-model:value="value.age",
+      :width-input="124"
+    )
 </template>
 
 <script>
-import BaseInput from "@/components/base/BaseInput";
+import BaseInputDate from "@/components/base/BaseInputDate";
 export default {
   name: "TableCellBodyAge",
-  components: { BaseInput },
+  components: { BaseInputDate },
   props: {
     value: Object,
     width: Number,
@@ -16,3 +21,7 @@ export default {
   },
 };
 </script>
+<style lang="sass" scoped>
+.input
+  border: 1.5px solid var(--border-light-grey-color)
+</style>

src/pages/clients/components/cells/TableCellBodyEmail.vue

@@ -1,7 +1,13 @@
 <template lang="pug">
   .flex.box-border.px-4.items-center.w-full.text-sm(:style="{ minWidth : width + 'px' }")
     span(v-if="!isOpenChange") {{value.email.username}}
-    base-input(v-if="isOpenChange" :width-input="234" v-model:value="value.email.username" :placeholder="value.email.username" )
+    base-input(
+      v-if="isOpenChange",
+      :width-input="234",
+      @click.stop,
+      v-model:value="value.email.username",
+      :placeholder="value.email.username"
+    )
 </template>
 
 <script>

src/pages/clients/components/cells/TableCellBodyName.vue

@@ -4,7 +4,13 @@
     base-avatar(:size="36", v-else)
       img.h-full.object-cover(:src="url + photo")
     span.font-semibold(v-if="!isOpenChange") {{value.fullName}}
-    base-input(v-if="isOpenChange", type="text", v-model:value="value.fullName", :width-input="300")
+    base-input(
+      v-if="isOpenChange",
+      @click.stop,
+      type="text",
+      v-model:value="value.fullName",
+      :width-input="300"
+    )
 </template>
 
 <script>

src/pages/clients/components/cells/TableCellBodyNetworks.vue

@@ -1,15 +1,34 @@
 <template lang="pug">
   .network-cell.flex.box-border.px-4.items-center.w-full(:style="{ minWidth : width + 'px' }")
     .flex.gap-x-1
-      .text-xl.icon.relative(v-for="network in getNetworks" :class="settings.settings.find((el) => el.network === network.kind)?.icon || ''")
-        .absolute.icon-cancel-mini.delete.flex.w-4.h-4.justify-center.items-center.bottom-4.left-2(v-if="isOpenChange" :id="network.kind" @click="(e) => deleteNetwork(e)")
+      .text-xl.icon.relative(
+        v-for="network in getNetworks",
+        :class="settings.settings.find((el) => el.network === network.kind)?.icon || ''"
+      )
+        .absolute.icon-cancel-mini.delete.flex.w-4.h-4.justify-center.items-center.bottom-4.left-2(
+          v-if="isOpenChange",
+          :id="network.kind",
+          @click="(e) => deleteNetwork(e)"
+        )
     .flex.relative.pb-2(class="pl-[46px]")
-      base-button(v-if="isOpenChange && settings.settings.length !== getNetworks.length" @click="openPopupAdding" :rounded="true" :outlined="true" :added="true" :size="24")
+      base-button(
+        v-if="isOpenChange && settings.settings.length !== getNetworks.length",
+        @click.stop="openPopupAdding",
+        :rounded="true",
+        :outlined="true",
+        :added="true",
+        :size="24"
+      )
         .icon-plus(class="pt-[2px]")
-      base-popup.right-3.top-6(v-if="isOpenPopupAdding" :width="485")
-        base-adding-network(:value="network" :selected-option="getSelectedIcon" :list-adding-networks="getAddingNetworks" :choose-network="chooseNetwork")
+      base-popup.right-3.top-6(v-if="isOpenPopupAdding", v-click-outside="closePopup" :width="485")
+        base-adding-network(
+          :value="network",
+          :selected-option="getSelectedIcon",
+          :list-adding-networks="getAddingNetworks",
+          :choose-network="chooseNetwork"
+        )
         .w-fit
-          base-button(:size="40" @click="saveNetwork")
+          base-button(:size="40", @click="saveNetwork")
             span.font-semibold Добавить
 </template>
 
@@ -69,6 +88,9 @@ export default {
     chooseNetwork(e) {
       this.network.kind = e.target.id;
     },
+    closePopup() {
+      this.isOpenPopupAdding = false;
+    },
     saveNetwork() {
       this.addNetwork(this.network);
       this.isOpenPopupAdding = false;

src/pages/clients/components/cells/TableCellBodyPhone.vue

@@ -5,6 +5,7 @@
     ) {{value.phone.username.replace(/\+7(\d{3})(\d{3})(\d{2})(\d{2})/, '+7 ($1) $2-$3-$4')}}
     base-input(
       v-if="isOpenChange",
+      @click.stop,
       :width-input="154",
       v-model:value="value.phone.username",
       :placeholder="value.phone.username",

src/pages/clients/components/cells/TableCellBodyPriority.vue

@@ -4,7 +4,7 @@
       .dot.w-2.h-2(:style="{ backgroundColor: prioritySettings.settings.find((el) => el.text == value.priority).color }")
       span.text-sm(:style="{ color: prioritySettings.settings.find((el) => el.text == value.priority).color }") {{value.priority}}
     .flex.gap-x-2.text-sm(class="w-[164px]")
-      base-select(v-if="isOpenChange", :items="getPriorityList", v-model="value.priority")
+      base-select(v-if="isOpenChange", @click.stop :items="getPriorityList", v-model="value.priority")
 </template>
 
 <script>