Merge pull request #80 from dderbentsov/UC-31

WIP настроил создание клиента

src/components/base/BaseAddingNetwork.vue

@@ -1,7 +1,7 @@
 <template lang="pug">
-  .flex(class="gap-x-1.5")
+  .flex.w-full(class="gap-x-1.5")
     base-select(:for-networks="true" :style-border="true" :list-data="listAddingNetworks" :option-data="selectedOption" :choose-option="chooseNetwork" :width-select="42")
-    base-input.input-info.w-full(v-model:value="value.username" :id="value.id" placeholder="Ссылкa")
+    base-input.input-info.w-full(v-model:value="value.username" placeholder="Ссылкa")
 </template>
 
 <script>

src/components/base/BaseSelect.vue

@@ -26,7 +26,7 @@
           :style="{ minWidth : widthSelect + 'px'}")
           .flex.not-italic.option.justify-center.py-1.text-xl(
             v-for="responsible in listData"
-            @click="(e) => chooseOption(e)"
+            @click="chooseOption"
             :key="responsible.network"
             :id="responsible.network"
             :class="responsible.icon"

src/pages/clients/components/ClientsFormCreate.vue

@@ -1,30 +1,31 @@
 <template lang="pug">
-  .wrapper.flex.flex-col.absolute.top-28.right-0.px-8.py-7.gap-y-8
+  .wrapper-create.flex.flex-col.absolute.top-28.right-0.px-4.py-7.gap-y-8
     .icon-cancel.close.absolute.top-5.right-5.cursor-pointer(@click="closeForm")
-    span.title.text-xl.font-bold Создание клиента
+    span.title.text-xl.font-bold.px-4 Создание клиента
-    .flex.gap-x-4.h-fit
+    .flex.gap-x-4.h-fit.px-4
       .flex.gap-x-3.w-full
         .export-avatar.cursor-pointer.flex.justify-center.items-center
-          img.icon-download(src="@/assets/icons/download.svg" alt="Download")
+          .icon-download.text-xl
-        base-input(v-model:value="infoClient.fullName" placeholder="ФИО*" :width-input="326" )
+        base-input(v-model:value="infoClient.basic.full_name" placeholder="ФИО*" :width-input="326" )
-      base-select(:list-data="priorityList" :option-data="priorityOption" :width-select="176" :style-border="true" :choose-option="chooseOptionSelect")
+        base-select(:list-data="priorityList" :option-data="getPriorityOption" :width-select="176" :for-networks="false" :style-border="true" :choose-option="chooseOptionSelect")
     .flex.flex-col.flex-auto.l.gap-y-8
-      .flex
+      .flex.px-4
-        button.title-info.px-6.py-2.cursor-pointer(v-for="(info, index) in infoTitleArray" @click="(e) => selectTab(e)" :class="{active:info.active}" :key="index" :id="info.title") {{info.title}}
+        button.title-info.px-6.py-2.cursor-pointer.w-full.text-sm(v-for="(info, index) in listInfoTitle" @click="(e) => selectTab(e)" :class="{active:info.active}" :key="index" :id="info.title") {{info.title}}
       .flex(:style="{display :'block'}" ref="basic")
-        form-create-basic-info( :basic-info="infoClient.basicInfo" :add-network="addNewNetwork" :save-client="saveClient")
+        form-create-basic-info( :basic-info="infoClient.basic" :phone="infoClient.phone" :email="infoClient.email" :add-network="addNewNetwork" :save-client="saveClient" :choose-option="chooseOptionNetworks")
-      .flex(:style="{display :'none'}" ref="secondary")
-        form-create-secondary-info(:secondary-info="infoClient.secondaryInfo" :save-client="saveClient")
       .flex(:style="{display :'none'}" ref="doc")
-        form-create-doc(:doc="infoClient.doc" :save-file="saveDocFile" :save-client="saveClient")
+        form-create-identity-documents(:identity-document="infoClient.pass" :save-client="saveClient")
+      .flex(:style="{display :'none'}" ref="addresses")
+        form-create-addresses(:addresses="infoClient.addresses" :save-file="saveDocFile" :save-client="saveClient")
       .flex(:style="{display :'none'}" ref="additional")
         form-create-additional(:additional-info="infoClient.additional" :add-new-additional="addNewAdditionalInfo" :save-file="saveAdditionalFiles" :save-client="saveClient")
 </template>
 
 <script>
+import { column } from "@/pages/clients/utils/tableConfig";
 import FormCreateBasicInfo from "@/pages/clients/components/FormCreateBasicInfo";
-import FormCreateSecondaryInfo from "@/pages/clients/components/FormCreateSecondaryInfo";
+import FormCreateIdentityDocuments from "@/pages/clients/components/FormCreateIdentityDocuments";
-import FormCreateDoc from "@/pages/clients/components/FormCreateDoc";
+import FormCreateAddresses from "@/pages/clients/components/FormCreateAddresses";
 import FormCreateAdditional from "@/pages/clients/components/FormCreateAdditional";
 import BaseInput from "@/components/base/BaseInput";
 import BaseSelect from "@/components/base/BaseSelect";
@@ -34,8 +35,8 @@ export default {
     BaseInput,
     BaseSelect,
     FormCreateBasicInfo,
-    FormCreateSecondaryInfo,
+    FormCreateIdentityDocuments,
-    FormCreateDoc,
+    FormCreateAddresses,
     FormCreateAdditional,
   },
   props: {
@@ -43,39 +44,38 @@ export default {
   },
   data() {
     return {
+      prioritySettings: column.find((el) => el.name === "priority"),
       infoClient: {
-        fullName: "",
+        basic: {
-        priority: "",
+          full_name: "",
-        basicInfo: {
+          birth_date: "",
-          age: "",
+          priority: null,
-          jobTitle: "",
+          contacts: [
-          number: "",
-          email: "",
-          networks: [
             {
               id: "network",
-              network: "",
+              kind: "",
+              username: "",
             },
           ],
         },
-        secondaryInfo: {
+        phone: {
-          pass: {
+          kind: "PHONE",
-            number: "",
+          username: "",
-            issuedBy: "",
+        },
-            divisionCode: "",
+        email: {
-            dateIssue: "",
+          kind: "EMAIL",
-          },
+          username: "",
-          snilsInn: {
+        },
-            inn: "",
+        pass: {
-            snils: "",
+          kind: "Паспорт",
-          },
+          numba: "",
-          dates: {
+          issued_by_org: "",
-            birthday: "",
+          issued_by_date: "",
-          },
+          issued_by_org_code: "",
-          addresses: {
+        },
-            actualPlace: "",
+        addresses: {
-            registrationPlace: "",
+          actualPlace: "",
-          },
+          registrationPlace: "",
         },
         doc: {},
         additional: [
@@ -87,20 +87,20 @@ export default {
           },
         ],
       },
-      infoTitleArray: [
+      listInfoTitle: [
         {
           title: "Основное",
           key: "basic",
           active: true,
         },
         {
-          title: "Вторичное",
+          title: "Документы",
-          key: "secondary",
+          key: "doc",
           active: false,
         },
         {
-          title: "Документы",
+          title: "Адреса",
-          key: "doc",
+          key: "addresses",
           active: false,
         },
         {
@@ -113,12 +113,36 @@ export default {
       priorityList: ["Высокий", "Средний", "Низкий", "-"],
     };
   },
-  methods: {
+  computed: {
-    chooseOptionSelect(e) {
+    getPriorityOption() {
-      this.priorityOption = this.priorityList[e.target.id];
+      return this.prioritySettings.settings.find(
-      this.infoClient.priority = this.priorityList[e.target.id];
+        (el) => el.priority === this.infoClient.basic.priority
+      ).text;
+    },
+  },
+  methods: {
+    postNewClient() {
+      fetch("http://45.84.227.122:8080/general/person/create/", {
+        method: "POST",
+        headers: {
+          Accept: "text/html; q=1.0, */*",
+          "Content-Type": "application/json;charset=utf-8",
+        },
+        body: JSON.stringify({
+          full_name: this.infoClient.basic.full_name,
+          birth_date: this.infoClient.basic.birth_date,
+        }),
+      });
+    },
+    chooseOptionSelect(e) {
+      this.infoClient.basic.priority = this.prioritySettings.settings.find(
+        (el) => el.text === e.target.id
+      ).priority;
+    },
+    chooseOptionNetworks() {},
+    saveClient() {
+      this.postNewClient();
     },
-    saveClient() {},
     saveDocFile(e) {
       this.infoClient.doc = e.target.files;
     },
@@ -136,15 +160,16 @@ export default {
       });
     },
     addNewNetwork() {
-      this.infoClient.basicInfo.networks.push({
+      this.infoClient.basic.contacts.push({
         id:
-          this.infoClient.basicInfo.networks[0].id +
+          this.infoClient.basic.contacts[0].id +
-          this.infoClient.basicInfo.networks.length,
+          this.infoClient.basic.contacts.length,
-        network: "",
+        kind: "",
+        username: "",
       });
     },
     selectTab(event) {
-      this.infoTitleArray.forEach((el) => {
+      this.listInfoTitle.forEach((el) => {
         if (el.title === event.target.id) {
           el.active = true;
           this.$refs[el.key].style.display = "block";
@@ -159,20 +184,15 @@ export default {
 </script>
 
 <style lang="sass" scoped>
-.wrapper
+.wrapper-create
   z-index: 1
   background-color: var(--default-white)
-  width: fit-content
   border-radius: 4px
-  min-width: 634px
+  width: 634px
-  max-height: 700px
   min-height: 700px
   box-shadow: var(--default-shadow)
 .title
   color: var(--font-dark-blue-color)
-.icon-download
-  width: 18px
-  height: 18px
 .export-avatar
   width: 40px
   height: 40px

src/pages/clients/components/ClientsTable.vue

@@ -1,7 +1,8 @@
 <template lang="pug">
-  .wrapper.flex.flex-col.gap-y-8.px-6.pt-6.h-full.w-full.min-w-fit
+  .wrapper-table.relative.flex.flex-col.gap-y-8.px-6.py-6.h-full.w-full
-    clients-table-hat(:is-open-actions="marked.length" :open-form-create="openFormCreate")
+    clients-form-create(v-if="isOpenFormCreate" :close-form="closeFormCreateClient")
-    .flex.flex-col.h-full.gap-y-2
+    clients-table-hat(:is-open-actions="marked.length" :open-form-create="openFormCreateClient")
+    .flex.flex-col.h-full.gap-y-2.table-container
       clients-table-header(:check="selectedCheck" :is-check="selectAll")
       .flex.flex-col
         clients-table-row(
@@ -19,6 +20,7 @@ import ClientsTableHeader from "@/pages/clients/components/ClientsTableHeader";
 import ClientsTableHat from "@/pages/clients/components/ClientsTableHat";
 import ClientsTableRow from "@/pages/clients/components/ClientsTableRow";
 import ClientsTableCheckbox from "@/pages/clients/components/ClientsTableCheckbox";
+import ClientsFormCreate from "@/pages/clients/components/ClientsFormCreate";
 export default {
   name: "ClientsTable",
   components: {
@@ -26,18 +28,23 @@ export default {
     ClientsTableRow,
     ClientsTableHat,
     ClientsTableHeader,
-  },
+    ClientsFormCreate,
-  props: {
-    openFormCreate: Function,
   },
   data() {
     return {
+      isOpenFormCreate: false,
       selectAll: false,
       marked: [],
       dataClients: [],
     };
   },
   methods: {
+    openFormCreateClient() {
+      this.isOpenFormCreate = true;
+    },
+    closeFormCreateClient() {
+      this.isOpenFormCreate = false;
+    },
     saveDataClients(data) {
       this.dataClients = data.results;
     },
@@ -72,6 +79,16 @@ export default {
 </script>
 
 <style lang="sass" scoped>
-.wrapper
+.wrapper-table
   background-color: var(--default-white)
+.table-container
+  overflow: auto
+  &::-webkit-scrollbar
+      height: 4px
+  &::-webkit-scrollbar-track
+    background-color: rgba(211, 212, 220, 0.5)
+    border-radius: 8px
+  &::-webkit-scrollbar-thumb
+    border-radius: 8px
+    background-color: var(--btn-blue-color)
 </style>

src/pages/clients/components/ClientsTableHeader.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  .flex.row.text-base.font-semibold
+  .flex.row.text-base.font-semibold.min-w-fit
     clients-table-cell-header(v-for="cell in columnHead" :title="cell.title" :width="cell.width" :class="!cell.title && 'px-3'")
       .icon-down-arrow.icon.text-xsm.cursor-pointer(v-if="cell.iconHead && cell.name !== 'fullName'" )
       .icon-sort-number.cursor-pointer.text-xs.icon(v-if="cell.iconHead && cell.name === 'fullName'")

src/pages/clients/components/ClientsTableRow.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  .row-wrapper.flex.flex-col.w-full
+  .row-wrapper.flex.flex-col.w-full.min-w-fit
     .row-body.flex.w-full.cursor-pointer(:id="id" @dblclick="(e) => openDetailInfo(e)")
       .check-box.flex.justify-center.items-center
         clients-table-checkbox(:id="id" :check="check" :is-check="isCheck")

src/pages/clients/components/ClientsWrapper.vue

@@ -1,7 +1,6 @@
 <template lang="pug">
   .wrapper.flex.w-full.relative.mx-6
     clients-table(:open-form-create="openFormCreateClient")
-    clients-form-create(v-if="isOpenForm" :close-form="closeFormCreateClient")
 </template>
 
 <script>

src/pages/clients/components/FormCreateAdditional.vue

@@ -1,6 +1,6 @@
 <template lang="pug">
   .wrapper-additional.flex.flex-col.gap-y-8.justify-between.text-base
-    .flex.flex-col.gap-y-6.w-full
+    .flex.flex-col.gap-y-6.w-full.px-4
       .flex.flex-col.gap-y-4.w-full(v-for="info in additionalInfo" :key="info.id")
         .flex.flex-col.gap-y-1
           base-input(v-model:value="info.header" placeholder="Заголовок")
@@ -15,7 +15,8 @@
       .add-additional.flex.gap-x-3.cursor-pointer(@click="addNewAdditional")
         .icon-plus
         span Добавить еще пункт
-    base-create-button(@click="saveClient" text="Создать клиента")
+    .px-4
+      base-create-button(@click="saveClient" text="Создать клиента")
 </template>
 
 <script>

src/pages/clients/components/FormCreateAddresses.vue

@@ -0,0 +1,48 @@
+<template lang="pug">
+  .wrapper-addresses.flex.flex-col.flex-auto.h-full.gap-y-8.justify-between
+    .flex.flex-col.gap-y-6.px-4
+      span.title-info.text-base.font-bold Адреса
+      .grid.grid-cols-2.gap-x-4.gap-y-6
+        .flex.flex-col.col-start-1.col-end-3(class="gap-y-1.5")
+          span.text-sm Адрес постоянной регистрации
+          base-input.input-info(v-model:value="addresses.actualPlace" placeholder="Место регистрации  (в паспорте)")
+        .flex.flex-col.col-start-1.col-end-3(class="gap-y-1.5")
+          span.text-sm Адрес фактического проживания
+          base-input.input-info(v-model:value="addresses.registrationPlace" placeholder="Место проживания на данный момент")
+    .px-4
+      base-create-button(text="Создать клиента" @click="saveClient")
+</template>
+
+<script>
+import BaseInput from "@/components/base/BaseInput";
+import BaseCreateButton from "@/components/base/buttons/BaseCreateButton";
+export default {
+  name: "FormCreateAddresses",
+  components: { BaseCreateButton, BaseInput },
+  props: {
+    addresses: Object,
+    saveClient: Function,
+    saveFile: Function,
+  },
+};
+</script>
+
+<style lang="sass" scoped>
+.wrapper-addresses
+  min-height: 443px
+  max-height: 443px
+  overflow-y: auto
+  color: var(--font-grey-color)
+  &::-webkit-scrollbar
+    width: 4px
+  &::-webkit-scrollbar-track
+    background-color: rgba(211, 212, 220, 0.5)
+    border-radius: 8px
+  &::-webkit-scrollbar-thumb
+    border-radius: 8px
+    background-color: var(--btn-blue-color)
+.input-info
+  color: var(--font-dark-blue-color)
+.title-info
+  color: var(--font-dark-blue-color)
+</style>

src/pages/clients/components/FormCreateBasicInfo.vue

@@ -1,42 +1,48 @@
 <template lang="pug">
   .wrapper-info.flex.flex-col.flex-auto.h-full.gap-y-8.justify-between
-    .grid.grid-cols-2.gap-x-4.gap-y-6
+    .grid.grid-cols-2.gap-x-4.gap-y-6.px-4
       .flex.flex-col(class="gap-y-1.5")
-        span.text-sm Возраст
+        span.text-sm Дата рождения
           span.obligatory *
-        base-input.input-info(v-model:value="basicInfo.age" placeholder="Колличество полных лет" :width-input="277")
+        base-input.input-info(v-model:value="basicInfo.birth_date" type="date" :width-input="277")
-      .flex.flex-col(class="gap-y-1.5")
-        span.text-sm Должность
-        base-input.input-info(v-model:value="basicInfo.jobTitle" placeholder="Должность клиента" :width-input="277")
       .flex.flex-col(class="gap-y-1.5")
         span.text-sm Номер телефона
           span.obligatory *
-        base-input.input-info(v-model:value="basicInfo.number" placeholder="+7 (915) 644–92–23" :width-input="277")
+        base-input.input-info(v-model:value="phone.username" placeholder="+7 (915) 644–92–23" :width-input="277")
       .flex.flex-col(class="gap-y-1.5")
         span.text-sm Email
           span.obligatory *
-        base-input.input-info(v-model:value="basicInfo.email" placeholder="user@yandex.ru" :width-input="277")
+        base-input.input-info(v-model:value="email.username" placeholder="user@yandex.ru" :width-input="277")
-      .flex.flex-col.col-start-1.col-end-3(class="gap-y-1.5")
+      .flex.flex-col.col-start-1.col-end-3.w-100(class="gap-y-1.5")
         span.text-sm Ссылки на соцсети
-        .flex(class="gap-x-1.5" v-for="network in basicInfo.networks" :key="network.id")
+        .flex(class="gap-x-1.5" v-for="network in basicInfo.contacts" :key="network.id")
-          .icon.flex.justify-center.items-center
+          base-adding-network(:list-adding-networks="networks.settings" selected-option="icon-tg" :value="network" :choose-network="chooseOption")
-            span.icon-tg.leading-2.text-lg
+        span.add-network.cursor-pointer(v-show="networks.settings.length !== basicInfo.contacts.length" @click="addNetwork") Добавить соцсеть
-          base-input.input-info.w-full(v-model:value="network.network" :id="network.id" placeholder="Ссылкa")
+    .px-4
-        span.add-network.cursor-pointer(@click="addNetwork") Добавить соцсеть
+      base-create-button(text="Сохранить" @click="saveClient")
-    base-create-button(text="Создать клиента" @click="saveClient")
 </template>
 
 <script>
 import BaseCreateButton from "@/components/base/buttons/BaseCreateButton";
 import BaseInput from "@/components/base/BaseInput";
+import BaseAddingNetwork from "@/components/base/BaseAddingNetwork";
+import { column } from "@/pages/clients/utils/tableConfig";
 export default {
   name: "FormCreateBasicInfo",
-  components: { BaseInput, BaseCreateButton },
+  components: { BaseInput, BaseCreateButton, BaseAddingNetwork },
   props: {
+    chooseOption: Function,
+    phone: Object,
+    email: Object,
     basicInfo: Object,
     saveClient: Function,
     addNetwork: Function,
   },
+  data() {
+    return {
+      networks: column.find((el) => el.name === "networks"),
+    };
+  },
 };
 </script>
 

src/pages/clients/components/FormCreateDoc.vue

@@ -1,40 +0,0 @@
-<template lang="pug">
-  .wrapper-doc.flex.flex-col.justify-between
-    .upload-wrapper.flex.flex-col.justify-center.items-center
-      .upload-text.text-center.flex.w-fit
-        input.hidden(@change="(e) => saveFile(e)" type="file" id="file-upload")
-        span Загрузите элемент
-          label.label.cursor-pointer(for="file-upload")  с комьютера
-          span  или перетащите их сюда
-    base-create-button(@click="saveClient" text="Создать клиента")
-</template>
-
-<script>
-import BaseCreateButton from "@/components/base/buttons/BaseCreateButton";
-export default {
-  name: "FormCreateDoc",
-  components: { BaseCreateButton },
-  props: {
-    saveClient: Function,
-    saveFile: Function,
-  },
-};
-</script>
-
-<style lang="sass" scoped>
-.wrapper-doc
-  min-height: 443px
-  max-height: 443px
-  overflow-y: auto
-  color: var(--font-grey-color)
-.upload-wrapper
-  min-height: 92px
-  max-height: 92px
-  width: 100%
-  border: 2px dashed var(--font-grey-color)
-  border-radius: 4px
-.upload-text
-  max-width: 278px
-.label
-  color: var(--btn-blue-color)
-</style>

src/pages/clients/components/FormCreateIdentityDocuments.vue

@@ -0,0 +1,53 @@
+<template lang="pug">
+  .wrapper-documents.flex.flex-col.flex-auto.h-full.gap-y-8.justify-between
+    .flex.flex-col.gap-y-6.px-4
+      span.title-info.text-base.font-bold Паспортные данные
+      .grid.grid-cols-2.gap-x-4.gap-y-6
+        .flex.flex-col(class="gap-y-1.5")
+          span.text-sm Серия и номер
+          base-input.input-info(v-model:value="identityDocument.numba" placeholder="0000 000000" :width-input="277")
+        .flex.flex-col(class="gap-y-1.5")
+          span.text-sm Кем и когда выдан
+          base-input.input-info(v-model:value="identityDocument.issued_by_org" placeholder="Точно как в паспорте" :width-input="277")
+        .flex.flex-col(class="gap-y-1.5")
+          span.text-sm Код подразделения
+          base-input.input-info(v-model:value="identityDocument.issued_by_org_code" placeholder="000–000" :width-input="277")
+        .flex.flex-col(class="gap-y-1.5")
+          span.text-sm Дата выдачи
+          base-input.input-info(type="date" v-model:value="identityDocument.issued_by_date" placeholder="Дата" :width-input="277")
+    .px-4
+      base-create-button(text="Создать клиента" @click="saveClient")
+</template>
+
+<script>
+import BaseCreateButton from "@/components/base/buttons/BaseCreateButton";
+import BaseInput from "@/components/base/BaseInput";
+export default {
+  name: "FormCreateIdentityDocuments",
+  components: { BaseCreateButton, BaseInput },
+  props: {
+    identityDocument: Object,
+    saveClient: Function,
+  },
+};
+</script>
+
+<style lang="sass" scoped>
+.wrapper-documents
+  min-height: 443px
+  max-height: 443px
+  overflow-y: auto
+  color: var(--font-grey-color)
+  &::-webkit-scrollbar
+    width: 4px
+  &::-webkit-scrollbar-track
+    background-color: rgba(211, 212, 220, 0.5)
+    border-radius: 8px
+  &::-webkit-scrollbar-thumb
+    border-radius: 8px
+    background-color: var(--btn-blue-color)
+.input-info
+  color: var(--font-dark-blue-color)
+.title-info
+  color: var(--font-dark-blue-color)
+</style>

src/pages/clients/components/FormCreateSecondaryInfo.vue

@@ -1,76 +0,0 @@
-<template lang="pug">
-  .wrapper-secondary.flex.flex-col.gap-y-8
-    .flex.flex-col.gap-y-6
-      span.title-info.text-base.font-bold Паспортные данные
-      .grid.grid-cols-2.gap-x-4.gap-y-6
-        .flex.flex-col(class="gap-y-1.5")
-          span.text-sm Серия и номер
-          base-input.input-info(v-model:value="secondaryInfo.pass.number" placeholder="0000 000000" :width-input="277")
-        .flex.flex-col(class="gap-y-1.5")
-          span.text-sm Кем и когда выдан
-          base-input.input-info(v-model:value="secondaryInfo.pass.issuedBy" placeholder="Точно как в паспорте" :width-input="277")
-        .flex.flex-col(class="gap-y-1.5")
-          span.text-sm Код подразделения
-          base-input.input-info(v-model:value="secondaryInfo.pass.divisionCode" placeholder="000–000" :width-input="277")
-        .flex.flex-col(class="gap-y-1.5")
-          span.text-sm Дата выдачи
-          base-input.input-info(type="date" v-model:value="secondaryInfo.pass.dateIssue" placeholder="Дата" :width-input="277")
-    .flex.flex-col.gap-y-6
-      span.title-info.text-base.font-bold СНИЛС и ИНН
-      .grid.grid-cols-2.gap-x-4.gap-y-6
-        .flex.flex-col(class="gap-y-1.5")
-          span.text-sm Номер СНИЛС
-          base-input.input-info(v-model:value="secondaryInfo.snilsInn.snils" placeholder="000–000–000 00" :width-input="277")
-        .flex.flex-col(class="gap-y-1.5")
-          span.text-sm Номер ИНН
-          base-input.input-info(v-model:value="secondaryInfo.snilsInn.inn" placeholder="000000000000" :width-input="277")
-    .flex.flex-col.gap-y-6
-      span.title-info.text-base.font-bold Даты
-      .grid.grid-cols-2.gap-x-4.gap-y-6
-        .flex.flex-col(class="gap-y-1.5")
-          span.text-sm Дата рождения
-          base-input.input-info(type="date" v-model:value="secondaryInfo.dates.birthday" placeholder="00,00,0000" :width-input="277")
-    .flex.flex-col.gap-y-6
-      span.title-info.text-base.font-bold Адреса
-      .grid.grid-cols-2.gap-x-4.gap-y-6
-        .flex.flex-col.col-start-1.col-end-3(class="gap-y-1.5")
-          span.text-sm Адрес постоянной регистрации
-          base-input.input-info(v-model:value="secondaryInfo.addresses.actualPlace" placeholder="Место регистрации  (в паспорте)")
-        .flex.flex-col.col-start-1.col-end-3(class="gap-y-1.5")
-          span.text-sm Адрес фактического проживания
-          base-input.input-info(v-model:value="secondaryInfo.addresses.registrationPlace" placeholder="Место проживания на данный момент")
-    base-create-button(text="Создать клиента" @click="saveClient")
-</template>
-
-<script>
-import BaseCreateButton from "@/components/base/buttons/BaseCreateButton";
-import BaseInput from "@/components/base/BaseInput";
-export default {
-  name: "FormCreateSecondaryInfo",
-  components: { BaseCreateButton, BaseInput },
-  props: {
-    secondaryInfo: Object,
-    saveClient: Function,
-  },
-};
-</script>
-
-<style lang="sass" scoped>
-.wrapper-secondary
-  max-height: 443px
-  overflow-y: auto
-  flex: auto
-  color: var(--font-grey-color)
-  &::-webkit-scrollbar
-    width: 4px
-  &::-webkit-scrollbar-track
-    background-color: rgba(211, 212, 220, 0.5)
-    border-radius: 8px
-  &::-webkit-scrollbar-thumb
-    border-radius: 8px
-    background-color: var(--btn-blue-color)
-.input-info
-  color: var(--font-dark-blue-color)
-.title-info
-  color: var(--font-dark-blue-color)
-</style>