From 933999cf4f86c25a74f70d3b80d5a802290cfc98 Mon Sep 17 00:00:00 2001
From: megavrilinvv <vastre@rambler.ru>
Date: Fri, 9 Dec 2022 16:54:56 +0300
Subject: [PATCH] =?UTF-8?q?[WIP]=20=D0=A3=D0=B1=D1=80=D0=B0=D0=BB=20=D1=87?=
 =?UTF-8?q?=D0=B5=D0=BA=D0=B1=D0=BE=D0=BA=D1=81=D1=8B,=20=D0=B8=20=D0=BD?=
 =?UTF-8?q?=D0=B0=20=D0=B8=D1=85=20=D0=BC=D0=B5=D1=81=D1=82=D0=BE=20=D0=BF?=
 =?UTF-8?q?=D0=BE=D1=81=D1=82=D0=B0=D0=B2=D0=B8=D0=BB=20=D0=BA=D0=BD=D0=BE?=
 =?UTF-8?q?=D0=BF=D0=BA=D1=83=20=D1=80=D0=B5=D0=B4=D0=B0=D0=BA=D1=82=D0=B8?=
 =?UTF-8?q?=D1=80=D0=BE=D0=B2=D0=B0=D0=BD=D0=B8=D1=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../clients/components/ClientsActionPopup.vue |  4 +-
 .../clients/components/ClientsTableRow.vue    | 61 ++++++++++---------
 .../components/cells/TableCellBodyName.vue    |  7 ++-
 .../cells/TableCellBodyNetworks.vue           |  2 +-
 src/pages/clients/utils/tableConfig.js        | 16 ++---
 5 files changed, 48 insertions(+), 42 deletions(-)

diff --git a/src/pages/clients/components/ClientsActionPopup.vue b/src/pages/clients/components/ClientsActionPopup.vue
index 3bab5c2..ce26080 100644
--- a/src/pages/clients/components/ClientsActionPopup.vue
+++ b/src/pages/clients/components/ClientsActionPopup.vue
@@ -1,5 +1,5 @@
 <template lang="pug">
-  .flex.flex-col.items-end.absolute.right-2.top-5
+  .flex.flex-col.absolute.left-2.top-6
     .corner
     .popup-wrapper.flex.flex-col.gap-y-3.w-10.h-10.p-4
       .button.keep-redaction.flex.gap-x-3(@click="openChangeData")
@@ -64,7 +64,7 @@ export default {
 .corner
   width: 8px
   height: 8px
-  border-top-left-radius: 100%
+  border-top-right-radius: 100%
   background-color: var(--default-white)
   z-index: 12
   overflow: hidden
diff --git a/src/pages/clients/components/ClientsTableRow.vue b/src/pages/clients/components/ClientsTableRow.vue
index f9c74bb..f9a5b28 100644
--- a/src/pages/clients/components/ClientsTableRow.vue
+++ b/src/pages/clients/components/ClientsTableRow.vue
@@ -11,14 +11,37 @@
         @click="(e) => openDetailInfo(e)",
         :class="{'row-overlay-color': rowOverlay}"
       )
-        .check-box.flex.justify-center.items-center(
-          :class="{'row-opacity': rowOverlay}"
+        .flex.items-center.px-2(
+          v-show="!isOpenChange",
+          :tabindex="1",
+          @click="(e) => openPopup(e)",
+          @blur="handleUnFocusPopup"
         )
-          clients-table-checkbox(
-            :id="id",
-            :check="check",
-            :is-check="isCheck"
-          )
+          .relative.dots-button.icon-dots.cursor-pointer.leading-6.text-center
+            clients-action-popup(
+              v-if="isOpenPopup",
+              :open-change-data="openChangeData",
+              :disabled-delete="!!deletedClientId && !rowOverlay",
+              @delete-client="transmitDeleteClient"
+            )
+        .dots.flex.justify-center.items-center(v-if="!rowOverlay")
+          .flex.pl-5.z-10(v-if="isOpenChange")
+            base-button(
+              @click="closeChangeData",
+              confirm,
+              rounded,
+              outlined,
+              :size="20"
+            )
+              .icon-ok.text-xsm(class="pt-[3px]")
+        //- .check-box.flex.justify-center.items-center(
+        //-   :class="{'row-opacity': rowOverlay}"
+        //- )
+        //-   clients-table-checkbox(
+        //-     :id="id",
+        //-     :check="check",
+        //-     :is-check="isCheck"
+        //-   )
         table-cell-body-name(
           :class="{'row-opacity': rowOverlay}"
           :value="dataClient",
@@ -62,28 +85,6 @@
           :is-open-change="isOpenChange",
           :width="columnBody.find(el => el.name === 'networks').width"
         )
-        .dots.flex.justify-center.items-center(v-if="!rowOverlay")
-          base-button(
-            v-if="isOpenChange",
-            @click="closeChangeData",
-            confirm,
-            rounded,
-            outlined,
-            :size="20"
-          )
-            .icon-ok.text-xsm(class="pt-[3px]")
-          .relative.dots-button.icon-dots.cursor-pointer.leading-6.text-center(
-            v-show="!isOpenChange",
-            :tabindex="1",
-            @click="(e) => openPopup(e)",
-            @blur="handleUnFocusPopup"
-          )
-            clients-action-popup(
-              v-if="isOpenPopup",
-              :open-change-data="openChangeData",
-              :disabled-delete="!!deletedClientId && !rowOverlay",
-              @delete-client="transmitDeleteClient"
-            )
       transition(name="detail")      
         client-detail-info-wrapper.detail(
           v-if="isOpenDetailInfo",
@@ -625,7 +626,7 @@ export default {
 .check-box
   min-width: 36px
 .dots
-  min-width: 53px
+  min-width: 14px
 .dots-button
   width: 20px
   height: 20px
diff --git a/src/pages/clients/components/cells/TableCellBodyName.vue b/src/pages/clients/components/cells/TableCellBodyName.vue
index ee405f9..edec08e 100644
--- a/src/pages/clients/components/cells/TableCellBodyName.vue
+++ b/src/pages/clients/components/cells/TableCellBodyName.vue
@@ -1,5 +1,8 @@
 <template lang="pug">
-  .flex.box-border.px-4.items-center.gap-x-3.w-full.text-sm(:style="{ minWidth : width + 'px' }")
+  .flex.box-border.px-4.items-center.gap-x-3.w-full.text-sm(
+    :style="{ minWidth : width + 'px' }",
+    :class="{'open-change': isOpenChange}"
+  )
     base-avatar(:size="36", :color="avatarColor", v-if="!photo") {{avatar}}
     base-avatar(:size="36", v-else)
       img.h-full.object-cover(:src="url + photo")
@@ -39,4 +42,6 @@ export default {
   border-radius: 50%
   background-color: var(--font-grey-color)
   color: var(--font-dark-blue-color)
+.open-change
+  padding-left: 52px
 </style>
diff --git a/src/pages/clients/components/cells/TableCellBodyNetworks.vue b/src/pages/clients/components/cells/TableCellBodyNetworks.vue
index 469a01c..b167da8 100644
--- a/src/pages/clients/components/cells/TableCellBodyNetworks.vue
+++ b/src/pages/clients/components/cells/TableCellBodyNetworks.vue
@@ -23,7 +23,7 @@
       base-popup.right-3.top-6(
         v-if="isOpenPopupAdding",
         @click.stop,
-        v-click-outside="closePopup",
+        v-click-outside.stop="closePopup",
         :width="485"
       )
         base-adding-network(
diff --git a/src/pages/clients/utils/tableConfig.js b/src/pages/clients/utils/tableConfig.js
index a533153..43a015d 100644
--- a/src/pages/clients/utils/tableConfig.js
+++ b/src/pages/clients/utils/tableConfig.js
@@ -1,8 +1,9 @@
 export const column = [
   {
-    name: "checkbox",
+    name: "dots",
+    title: "Do",
     iconHead: false,
-    width: 36,
+    width: 53,
   },
   {
     name: "fullName",
@@ -96,12 +97,11 @@ export const column = [
     iconHead: false,
     width: 152,
   },
-  {
-    name: "dots",
-    title: "Do",
-    iconHead: false,
-    width: 53,
-  },
+  // {
+  //   name: "checkbox",
+  //   iconHead: false,
+  //   width: 36,
+  // },
 ];
 
 export const detail = {