[WIP] Убрал чекбоксы, и на их место поставил кнопку редактирования

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

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(
+        .flex.items-center.px-2(
-          :class="{'row-opacity': rowOverlay}"
+          v-show="!isOpenChange",
+          :tabindex="1",
+          @click="(e) => openPopup(e)",
+          @blur="handleUnFocusPopup"
         )
-          clients-table-checkbox(
+          .relative.dots-button.icon-dots.cursor-pointer.leading-6.text-center
-            :id="id",
+            clients-action-popup(
-            :check="check",
+              v-if="isOpenPopup",
-            :is-check="isCheck"
+              :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

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>

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(

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",
+  //   name: "checkbox",
-    title: "Do",
+  //   iconHead: false,
-    iconHead: false,
+  //   width: 36,
-    width: 53,
+  // },
-  },
 ];
 
 export const detail = {