From 5923d8350f4466b1fa479ce69993255f7b4a7fa1 Mon Sep 17 00:00:00 2001
From: Daria Golova <danalis969@gmail.com>
Date: Fri, 9 Dec 2022 15:34:55 +0300
Subject: [PATCH] =?UTF-8?q?WIP=20=D0=A1=D0=B4=D0=B5=D0=BB=D0=B0=D0=BD?=
 =?UTF-8?q?=D0=B0=20=D0=B0=D0=BD=D0=B8=D0=BC=D0=B0=D1=86=D0=B8=D1=8F=20?=
 =?UTF-8?q?=D0=B1=D0=BB=D0=BE=D0=BA=D0=B0=20=D0=B8=D0=BD=D1=84=D0=BE=D1=80?=
 =?UTF-8?q?=D0=BC=D0=B0=D1=86=D0=B8=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/base/BaseInputDate.vue         |  2 +-
 src/components/base/BaseInputTime.vue         |  2 +-
 .../components/CalendarFormAddEvent.vue       |  4 +-
 .../components/ClientDetailInfoSection.vue    |  2 +-
 .../components/ClientDetailInfoWrapper.vue    |  2 +-
 src/pages/clients/components/ClientsTable.vue |  2 +-
 .../clients/components/ClientsTableRow.vue    | 84 +++++++++----------
 tailwind.config.js                            |  2 +
 8 files changed, 49 insertions(+), 51 deletions(-)

diff --git a/src/components/base/BaseInputDate.vue b/src/components/base/BaseInputDate.vue
index 14b7fc4..5180894 100644
--- a/src/components/base/BaseInputDate.vue
+++ b/src/components/base/BaseInputDate.vue
@@ -3,7 +3,7 @@
     class="py-2.5",
     :style="{ minWidth: widthInput + 'px' }"
   )
-    input.input.w-full.outline-0.not-italic.date(
+    input.input.w-full.outline-0.not-italic.date.cursor-text(
       :value="value",
       type="date",
       @input="$emit('update:value', $event.target.value)",
diff --git a/src/components/base/BaseInputTime.vue b/src/components/base/BaseInputTime.vue
index 2685fc7..834645b 100644
--- a/src/components/base/BaseInputTime.vue
+++ b/src/components/base/BaseInputTime.vue
@@ -3,7 +3,7 @@
     class="py-2.5"
     :style="{ minWidth: widthInput + 'px' }"
   )
-    input.input.w-full.outline-0.not-italic(
+    input.input.w-full.outline-0.not-italic.cursor-text(
       :value="value"
       type="time"
       @input="$emit('update:value', $event.target.value)"
diff --git a/src/pages/calendar/components/CalendarFormAddEvent.vue b/src/pages/calendar/components/CalendarFormAddEvent.vue
index e1ae41a..9f32fa7 100644
--- a/src/pages/calendar/components/CalendarFormAddEvent.vue
+++ b/src/pages/calendar/components/CalendarFormAddEvent.vue
@@ -37,14 +37,14 @@
         .flex.gap-x-2.items-center
           .flex.flex-col(class="gap-y-1.5")
             span.text-xs.opacity-40.font-bold.leading-3 Начало
-            base-input-time.item-input.text-base.cursor-text.select(
+            base-input-time.item-input.text-base.select(
               v-model:value="startTime",
               :width-input="72"
             )
           span.mt-4 —
           .flex.flex-col(class="gap-y-1.5")
             span.text-xs.opacity-40.font-bold.leading-3 Конец
-            base-input-time.item-input.text-base.cursor-text.select(
+            base-input-time.item-input.text-base.select(
               v-model:value="endTime",
               :width-input="72"
             )
diff --git a/src/pages/clients/components/ClientDetailInfoSection.vue b/src/pages/clients/components/ClientDetailInfoSection.vue
index a3dc26a..1533d88 100644
--- a/src/pages/clients/components/ClientDetailInfoSection.vue
+++ b/src/pages/clients/components/ClientDetailInfoSection.vue
@@ -256,7 +256,7 @@ export default {
       }
       if (this.section === "addresses") {
         if (!this.addressId) {
-          if (this.sectionInfo.join_adress === "") this.isAddress = false;
+          if (this.sectionInfo.full_address === "") this.isAddress = false;
           this.createAddress();
         } else this.updateAddress();
       }
diff --git a/src/pages/clients/components/ClientDetailInfoWrapper.vue b/src/pages/clients/components/ClientDetailInfoWrapper.vue
index 6c8f88e..a9eebe6 100644
--- a/src/pages/clients/components/ClientDetailInfoWrapper.vue
+++ b/src/pages/clients/components/ClientDetailInfoWrapper.vue
@@ -1,5 +1,5 @@
 <template lang="pug">
-  .w-full.h-fit.pt-4.flex.gap-x-4(class="px-[52px] pb-[30px]")
+  .w-full.h-fit.flex.gap-x-4
     client-detail-info-section(
       v-model:section-info="dataDocument",
       section="pass",
diff --git a/src/pages/clients/components/ClientsTable.vue b/src/pages/clients/components/ClientsTable.vue
index aa2c95b..bccdda6 100644
--- a/src/pages/clients/components/ClientsTable.vue
+++ b/src/pages/clients/components/ClientsTable.vue
@@ -7,7 +7,7 @@
       :change-clearing-text-search="changeClearingTextSearch",
       @search="filterDataClients",
     )
-    .flex.flex-col.h-full.gap-y-2.table-container.w-full.mt-8.mb-3
+    .flex.flex-col.h-full.table-container.w-full.mt-8.mb-3
       clients-table-header(:check="selectedCheck" :is-check="selectAll")
       .flex.flex-col
         clients-table-row(
diff --git a/src/pages/clients/components/ClientsTableRow.vue b/src/pages/clients/components/ClientsTableRow.vue
index 19ac436..8bf257a 100644
--- a/src/pages/clients/components/ClientsTableRow.vue
+++ b/src/pages/clients/components/ClientsTableRow.vue
@@ -5,7 +5,7 @@
     )
       button.recover-btn(@click="stopTimer") Восстановить
       .countdown 0:{{ countdown }}
-    .row-wrapper.flex.flex-col.w-full
+    .row-wrapper.flex.flex-col.w-full(:class="closedDetail")
       .row-body.flex.w-full.cursor-pointer(
         :id="id",
         @click="(e) => openDetailInfo(e)",
@@ -84,26 +84,25 @@
               :disabled-delete="!!deletedClientId && !rowOverlay",
               @delete-client="transmitDeleteClient"
             )
-      transition(name="detail")      
-        client-detail-info-wrapper.detail(
-          v-if="isOpenDetailInfo",
-          :data-address="dataAddress",
-          :data-detail="dataDetail",
-          :data-attachments="dataAttachments",
-          :data-document="dataIdentityDocument",
-          :save-new-doc="saveNewDoc",
-          :delete-doc="deleteDoc",
-          :update-document="postUpdateIdentityDocument",
-          :update-address="postUpdateAddress",
-          :lack-data="lackData",
-          :lack-address="lackAddress",
-          :dope-address="dopeAddress",
-          :lack-attachments="lackAttachments",
-          :create-address="postCreateAddress",
-          :create-document="postCreateIdentityDocument",
-          :address-id="addressId",
-          :doc-id="docId",
-        )
+      client-detail-info-wrapper.detail.px-52px(
+        :class="{'pb-[30px] pt-4': isOpenDetailInfo}"
+        :data-address="dataAddress",
+        :data-detail="dataDetail",
+        :data-attachments="dataAttachments",
+        :data-document="dataIdentityDocument",
+        :save-new-doc="saveNewDoc",
+        :delete-doc="deleteDoc",
+        :update-document="postUpdateIdentityDocument",
+        :update-address="postUpdateAddress",
+        :lack-data="lackData",
+        :lack-address="lackAddress",
+        :dope-address="dopeAddress",
+        :lack-attachments="lackAttachments",
+        :create-address="postCreateAddress",
+        :create-document="postCreateIdentityDocument",
+        :address-id="addressId",
+        :doc-id="docId",
+      )
 </template>
 
 <script>
@@ -185,6 +184,11 @@ export default {
     rowOverlay() {
       return this.deletedClientId === this.client.id;
     },
+    closedDetail() {
+      return {
+        "closed-detail": !this.isOpenDetailInfo,
+      };
+    },
   },
   methods: {
     stopTimer() {
@@ -340,7 +344,7 @@ export default {
       addNotification(new Date().getTime(), title, message, "success", 5000);
     },
     addErrorNotification(title, message) {
-      addNotification(title, title, message, "error", 0);
+      addNotification(title, title, message, "error", 5000);
     },
     fetchClientDetail(id) {
       fetchWrapper
@@ -420,15 +424,15 @@ export default {
     },
     saveAddress(data) {
       this.addressId = data?.id;
-      if (data?.join_adress && data?.join_adress.substr(0, 4) !== "None") {
+      if (data?.full_address) {
         this.dataAddress = {
-          join_adress: data?.join_adress,
+          full_address: data.full_address,
         };
         this.lackAddress = true;
       } else {
         this.lackAddress = false;
         this.dataAddress = {
-          join_adress: "",
+          full_address: "",
         };
       }
     },
@@ -455,7 +459,8 @@ export default {
     postUpdateAddress() {
       fetchWrapper
         .post(`general/address/${this.addressId}/update/`, {
-          full_address: this.mergeFullAddress() || this.dataAddress.join_adress,
+          full_address:
+            this.mergeFullAddress() || this.dataAddress.full_address,
         })
         .then((response) => {
           this.fetchClientDetail(this.id);
@@ -501,7 +506,8 @@ export default {
       fetchWrapper
         .post("general/address/create/", {
           person_id: this.id,
-          full_address: this.mergeFullAddress() || this.dataAddress.join_adress,
+          full_address:
+            this.mergeFullAddress() || this.dataAddress.full_address,
         })
         .then((response) => {
           this.fetchClientDetail(this.id);
@@ -601,9 +607,7 @@ export default {
 .row-wrapper
   border-bottom: 1px solid var(--border-light-grey-color)
   min-width: 1556px
-.row-wrapper:hover .detail
-  background-color: var(--bg-hover-row-table)
-.row-wrapper:hover .row-body
+.row-wrapper:hover
   background-color: var(--bg-hover-row-table)
 .row-body
   color: var(--font-dark-blue-color)
@@ -634,18 +638,10 @@ export default {
   color: var(--btn-blue-color)
 .countdown
   color: var(--font-grey-color )
-.detail-enter-from
-  opacity: 0
-  transform: translateY(-2px)
-  pointer-events: none
-.detail-enter-active
-  transition: 0.1s ease
-.detail-leave-to
-  opacity: 0
-  transform: translateY(-2px)
-  pointer-events: none
-.detail-leave-active
-  transition: 0.1s ease
-.detail-move
-  transition: 0.1s ease
+.detail
+  max-height: 560px
+  transition: 0.3s ease all
+  overflow: hidden
+.closed-detail .detail
+  max-height: 0
 </style>
diff --git a/tailwind.config.js b/tailwind.config.js
index 76b43d4..63c3547 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -44,7 +44,9 @@ module.exports = {
         "22px": "22px",
         "23px": "23px",
         "29_25px": "29.25px",
+        "30px": "30px",
         "45px": "45px",
+        "52px": "52px",
         "74px": "74px",
         "148px": "148px",
       },