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

This commit is contained in:
megavrilinvv
2022-12-09 16:54:56 +03:00
parent 94e6727350
commit 946b66c42b
5 changed files with 48 additions and 42 deletions

View File

@@ -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

View File

@@ -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"
)
client-detail-info-wrapper.detail.px-52px(
:class="{'pb-[30px] pt-4': isOpenDetailInfo}"
:data-address="dataAddress",
@@ -629,7 +630,7 @@ export default {
.check-box
min-width: 36px
.dots
min-width: 53px
min-width: 14px
.dots-button
width: 20px
height: 20px

View File

@@ -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>

View File

@@ -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(

View File

@@ -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 = {