Merge pull request #130 from dderbentsov/UC-66

Добавил создание паспортных данных и адреса
2022-11-15 18:28:49 +03:00
parent 016e08cf71 040312c035
commit 21cb5a9b95
4 changed files with 134 additions and 77 deletions
--- a/src/pages/clients/components/ClientDetailInfoSection.vue
+++ b/src/pages/clients/components/ClientDetailInfoSection.vue
@@ -4,18 +4,10 @@
  )
    .section-header.flex.items-center.justify-between.pl-4.pr-3(:class="{small:settings[section].rowFlex}")
      span.text-sm.font-semibold.whitespace-nowrap {{settings[section].title}}
-      .flex.items-center.gap-x-8(v-if="this.isData")
+      .flex.items-center.gap-x-8
        base-button(
-          v-if="isChange && !this.isData",
-          @click="saveChange",
-          confirm,
-          rounded,
-          outlined,
-          :size="20"
-        )
-        base-button(
-          v-if="isChange && this.isData",
-          @click="createNewAddress",
+          v-if="isChange",
+          @click="changeDoc",
          confirm,
          rounded,
          outlined,
@@ -48,7 +40,7 @@
            :add-new-additional="addDocAdditional",
            :save-additional="saveDocs"
          )
-    .section-body.w-full.flex.flex-col.px-4.pt-3.pb-4.gap-y-4(v-if="this.isData")
+    .section-body.w-full.flex.flex-col.px-4.pt-3.pb-4.gap-y-4(v-if="this.isData || this.isAddress")
      .flex.flex-col(class="gap-y-1.5")
        .flex.flex-col(v-for="(item, key) in sectionInfo", class="gap-y-1.5")
          span.title-section.font-semibold.text-xs(
@@ -77,29 +69,10 @@
            .line.absolute
            .text-separation.span.text-sm.separator.px-2 или
          .flex.flex-col.gap-y-4(v-if="section === 'addresses' && isChange")
-            .flex.flex-col(class="gap-y-1.5")
-              .text-info.text-xxs.font-semibold Город
-              base-select(
-                placeholder="Выберите город",
-                :items="cities",
-                v-model="dopeAddress.city"
+            client-detail-section-address(
+              :dope-address="dopeAddress"
+              :cities="cities"
            )
-            .flex.flex-col(class="gap-y-1.5")
-              .text-info.text-xxs.font-semibold Область
-              base-input.input-info(placeholder="Введите область", v-model:value="dopeAddress.region")
-            .flex.flex-col(class="gap-y-1.5")
-              .text-info.text-xxs.font-semibold Улица
-              base-input.input-info(placeholder="Введите улицу", v-model:value="dopeAddress.street")
-            .flex.gap-x-4
-              .flex.flex-col(class="gap-y-1.5")
-                .text-info.text-xxs.font-semibold Дом
-                base-input.input-info(placeholder="Дом", v-model:value="dopeAddress.house")
-              .flex.flex-col(class="gap-y-1.5")
-                .text-info.text-xxs.font-semibold Квартира
-                base-input.input-info(placeholder="Квартира", v-model:value="dopeAddress.flat")
-            .flex.flex-col(class="gap-y-1.5")
-              .text-info.text-xxs.font-semibold Индекс
-              base-input.input-info(v-mask="'######'", placeholder="000000", v-model:value="dopeAddress.index")
          .flex(v-if="item.name && !isChange")
            span.text-sm.w-fit {{item.title}}
          .flex.items-center(v-if="item.title")
@@ -111,7 +84,7 @@
            span.text-sm {{item.title}}
    .section-add-doc.flex.justify-center.items-center.cursor-pointer(
      v-else,
-      @click="changeData"
+      @click="openAddDoc"
    )
      span Добавить данные
 </template>
@@ -119,21 +92,18 @@
 <script>
 import ClientDetailInput from "@/pages/clients/components/ClientDetailInput";
 import BaseButton from "@/components/base/BaseButton";
-import BaseInput from "@/components/base/BaseInput";
-import BaseSelect from "@/components/base/BaseSelect";
 import TableAddingNewDoc from "@/pages/clients/components/TableAddingNewDoc";
 import TableAddingNewAdditional from "@/pages/clients/components/TableAddingNewAdditional";
+import ClientDetailSectionAddress from "@/pages/clients/components/ClientDetailSectionAddress";
 import { detail } from "@/pages/clients/utils/tableConfig";
-import { mask } from "vue-the-mask";
 export default {
  name: "ClientDetailInfoSection",
  components: {
    TableAddingNewAdditional,
    BaseButton,
-    BaseInput,
-    BaseSelect,
    ClientDetailInput,
    TableAddingNewDoc,
+    ClientDetailSectionAddress,
  },
  props: {
    saveNewDoc: Function,
@@ -143,11 +113,13 @@ export default {
    updateDocument: Function,
    updateAddress: Function,
    lackData: Boolean,
+    lackAddress: Boolean,
    dopeAddress: Object,
    createAddress: Function,
+    createDocument: Function,
+    addressId: String,
+    docId: String,
  },
-  directives: { mask },
-
  data() {
    return {
      additionalData: {
@@ -158,7 +130,6 @@ export default {
      },
      docData: [],
      isOpenAddingWrap: false,
-      isOpenChange: false,
      isChange: false,
      settings: detail,
      cities: [
@@ -167,12 +138,26 @@ export default {
        { id: 1, label: "Луховицы" },
      ],
      isData: true,
+      isAddress: true,
    };
  },
  methods: {
-    changeData() {
-      this.isData = true;
+    openAddDoc() {
      this.isChange = true;
+      if (this.section === "pass") {
+        this.isData = true;
+      } else if (this.section === "addresses") {
+        this.isAddress = true;
+      }
+    },
+    changeDoc() {
+      this.isChange = false;
+      if (this.section === "pass") {
+        this.docId ? this.updateDocument() : this.createDocument();
+      }
+      if (this.section === "addresses") {
+        this.addressId ? this.updateAddress() : this.createAddress();
+      }
    },
    copyValue(text) {
      navigator.clipboard.writeText(text);
@@ -183,7 +168,6 @@ export default {
      }
    },
    saveChange() {
-      this.isOpenChange = false;
      this.isChange = false;
      if (this.section === "pass") {
        this.updateDocument();
@@ -191,12 +175,6 @@ export default {
        this.updateAddress();
      }
    },
-    createNewAddress() {
-      this.isOpenChange = false;
-      this.isChange = false;
-      this.createAddress();
-      this.updateAddress();
-    },
    openAddingWrap() {
      if (!this.isChange) {
        this.isOpenAddingWrap = !this.isOpenAddingWrap;
@@ -216,7 +194,6 @@ export default {
        this.saveNewDoc(this.section, this.docData);
      }
      this.isOpenAddingWrap = false;
-      this.isOpenChange = false;
      this.docData = [];
      this.additionalData = {
        header: "",
@@ -233,6 +210,12 @@ export default {
        this.isData = newValue;
      },
    },
+    lackAddress: {
+      immediate: true,
+      handler(newValue) {
+        this.isAddress = newValue;
+      },
+    },
  },
 };
 </script>
@@ -289,8 +272,4 @@ export default {
  width: 38px
  z-index: 1
  background: white
-.input-info
-  color: var(--font-dark-blue-color)
-.text-info
-  color: var(--font-grey-color)
 </style>
--- a/src/pages/clients/components/ClientDetailInfoWrapper.vue
+++ b/src/pages/clients/components/ClientDetailInfoWrapper.vue
@@ -5,15 +5,18 @@
      section="pass"
      :update-document="updateDocument"
      :lack-data="lackData"
+      :create-document="createDocument"
+      :doc-id="docId"
    )
    .flex.flex-col
      client-detail-info-section(
        :section-info="dataAddress"
        section="addresses"
        :update-address="updateAddress"
-        :lack-data="lackData"
+        :lack-address="lackAddress"
        :dope-address="dopeAddress"
        :create-address="createAddress"
+        :address-id="addressId"
      )
    .flex.flex-col
      client-detail-info-section(
@@ -21,7 +24,6 @@
        section="docs"
        :save-new-doc="saveNewDoc"
        :delete-doc="deleteDoc"
-        :lack-data="lackData"
      )
 </template>

@@ -40,8 +42,12 @@ export default {
    updateDocument: Function,
    updateAddress: Function,
    lackData: Boolean,
+    lackAddress: Boolean,
    dopeAddress: Object,
    createAddress: Function,
+    createDocument: Function,
+    addressId: String,
+    docId: String,
  },
 };
 </script>
--- a/src/pages/clients/components/ClientDetailSectionAddress.vue
+++ b/src/pages/clients/components/ClientDetailSectionAddress.vue
@@ -0,0 +1,51 @@
+<template lang="pug">
+  .flex.flex-col.gap-y-4
+    .flex.flex-col(class="gap-y-1.5")
+      .text-info.text-xxs.font-semibold Город
+      base-select(
+        placeholder="Выберите город",
+        :items="cities",
+        v-model="dopeAddress.city"
+      )
+    .flex.flex-col(class="gap-y-1.5")
+      .text-info.text-xxs.font-semibold Область
+      base-input.input-info(placeholder="Введите область", v-model:value="dopeAddress.region")
+    .flex.flex-col(class="gap-y-1.5")
+      .text-info.text-xxs.font-semibold Улица
+      base-input.input-info(placeholder="Введите улицу", v-model:value="dopeAddress.street")
+    .flex.gap-x-4
+      .flex.flex-col(class="gap-y-1.5")
+        .text-info.text-xxs.font-semibold Дом
+        base-input.input-info(placeholder="Дом", v-model:value="dopeAddress.house")
+      .flex.flex-col(class="gap-y-1.5")
+        .text-info.text-xxs.font-semibold Квартира
+        base-input.input-info(placeholder="Квартира", v-model:value="dopeAddress.flat")
+    .flex.flex-col(class="gap-y-1.5")
+      .text-info.text-xxs.font-semibold Индекс
+      base-input.input-info(v-mask="'######'", placeholder="000000", v-model:value="dopeAddress.index")
+</template>
+
+<script>
+import BaseInput from "@/components/base/BaseInput";
+import BaseSelect from "@/components/base/BaseSelect";
+import { mask } from "vue-the-mask";
+export default {
+  name: "ClientDetailSectionAddress",
+  components: {
+    BaseInput,
+    BaseSelect,
+  },
+  props: {
+    dopeAddress: Object,
+    cities: Array,
+  },
+  directives: { mask },
+};
+</script>
+
+<style lang="sass" scoped>
+.input-info
+  color: var(--font-dark-blue-color)
+.text-info
+  color: var(--font-grey-color)
+</style>
--- a/src/pages/clients/components/ClientsTableRow.vue
+++ b/src/pages/clients/components/ClientsTableRow.vue
@@ -76,8 +76,12 @@
      :update-document="postUpdateIdentityDocument"
      :update-address="postUpdateAddress"
      :lack-data="lackData"
+      :lack-address="lackAddress"
      :dope-address="dopeAddress"
      :create-address="postCreateAddress"
+      :create-document="postCreateIdentityDocument"
+      :address-id="addressId"
+      :doc-id="docId"
    )
 </template>

@@ -128,6 +132,7 @@ export default {
      docId: "",
      addressId: "",
      lackData: true,
+      lackAddress: true,
      dopeAddress: {
        city: "",
        region: "",
@@ -277,13 +282,8 @@ export default {
      this.saveAttachments([...data.attachments]);
    },
    saveIdentityDocument(data) {
-      if (
-        data?.series ||
-        data?.numba ||
-        data?.issued_by_org ||
-        data?.issued_by_org_code ||
-        data?.issued_by_date
-      ) {
+      if (data?.id) {
+        this.docId = data.id;
        this.dataIdentityDocument = {
          numba:
            data.series && data.numba ? data?.series + " " + data?.numba : "",
@@ -295,6 +295,7 @@ export default {
            ? data?.issued_by_date.split("-").reverse().join(".")
            : "",
        };
+        this.lackData = true;
      } else {
        this.lackData = false;
        this.dataIdentityDocument = {
@@ -304,7 +305,6 @@ export default {
          issued_by_date: "",
        };
      }
-      this.docId = data?.id;
    },
    postUpdateIdentityDocument() {
      fetchWrapper
@@ -321,17 +321,28 @@ export default {
    },
    saveAddress(data) {
      this.addressId = data?.id;
-      if (data?.join_adress) {
+      if (data?.join_adress && data?.join_adress.substr(0, 4) !== "None") {
        this.dataAddress = {
          join_adress: data?.join_adress,
        };
+        this.lackAddress = true;
      } else {
-        this.lackData = false;
+        this.lackAddress = false;
        this.dataAddress = {
          join_adress: "",
        };
      }
    },
+    mergeFullAddress() {
+      if (
+        this.dopeAddress.region &&
+        this.dopeAddress.city &&
+        this.dopeAddress.street &&
+        this.dopeAddress.house
+      ) {
+        return `${this.dopeAddress.region}.обл, г.${this.dopeAddress.city}, ул.${this.dopeAddress.street}, ${this.dopeAddress.house}, ${this.dopeAddress.flat}, ${this.dopeAddress.index}`;
+      }
+    },
    clearAddress() {
      this.dopeAddress = {
        city: "",
@@ -345,13 +356,7 @@ export default {
    postUpdateAddress() {
      fetchWrapper
        .post(`general/address/${this.addressId}/update/`, {
-          full_address:
-            this.dopeAddress.city +
-              this.dopeAddress.region +
-              this.dopeAddress.street +
-              this.dopeAddress.house +
-              this.dopeAddress.flat +
-              this.dopeAddress.index || this.dataAddress.join_adress,
+          full_address: this.mergeFullAddress() || this.dataAddress.join_adress,
        })
        .then(() => this.fetchClientDetail(this.id));
      this.clearAddress();
@@ -384,6 +389,22 @@ export default {
      fetchWrapper
        .post("general/address/create/", {
          person_id: this.id,
+          full_address: this.mergeFullAddress() || this.dataAddress.join_adress,
+        })
+        .then(() => this.fetchClientDetail(this.id));
+    },
+    postCreateIdentityDocument() {
+      fetchWrapper
+        .post("general/identity_document/create/", {
+          person_id: this.id,
+          kind: "PASSPORT",
+          series_number: this.dataIdentityDocument.numba,
+          issued_by_org: this.dataIdentityDocument.issued_by_org,
+          issued_by_org_code: this.dataIdentityDocument.issued_by_org_code,
+          issued_by_date: this.dataIdentityDocument.issued_by_date
+            .split(".")
+            .reverse()
+            .join("-"),
        })
        .then(() => this.fetchClientDetail(this.id));
    },