Merge pull request #130 from dderbentsov/UC-66
Добавил создание паспортных данных и адреса
This commit is contained in:
@@ -4,18 +4,10 @@
|
|||||||
)
|
)
|
||||||
.section-header.flex.items-center.justify-between.pl-4.pr-3(:class="{small:settings[section].rowFlex}")
|
.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}}
|
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(
|
base-button(
|
||||||
v-if="isChange && !this.isData",
|
v-if="isChange",
|
||||||
@click="saveChange",
|
@click="changeDoc",
|
||||||
confirm,
|
|
||||||
rounded,
|
|
||||||
outlined,
|
|
||||||
:size="20"
|
|
||||||
)
|
|
||||||
base-button(
|
|
||||||
v-if="isChange && this.isData",
|
|
||||||
@click="createNewAddress",
|
|
||||||
confirm,
|
confirm,
|
||||||
rounded,
|
rounded,
|
||||||
outlined,
|
outlined,
|
||||||
@@ -48,7 +40,7 @@
|
|||||||
:add-new-additional="addDocAdditional",
|
:add-new-additional="addDocAdditional",
|
||||||
:save-additional="saveDocs"
|
: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(class="gap-y-1.5")
|
||||||
.flex.flex-col(v-for="(item, key) in sectionInfo", 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(
|
span.title-section.font-semibold.text-xs(
|
||||||
@@ -77,29 +69,10 @@
|
|||||||
.line.absolute
|
.line.absolute
|
||||||
.text-separation.span.text-sm.separator.px-2 или
|
.text-separation.span.text-sm.separator.px-2 или
|
||||||
.flex.flex-col.gap-y-4(v-if="section === 'addresses' && isChange")
|
.flex.flex-col.gap-y-4(v-if="section === 'addresses' && isChange")
|
||||||
.flex.flex-col(class="gap-y-1.5")
|
client-detail-section-address(
|
||||||
.text-info.text-xxs.font-semibold Город
|
:dope-address="dopeAddress"
|
||||||
base-select(
|
:cities="cities"
|
||||||
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")
|
|
||||||
.flex(v-if="item.name && !isChange")
|
.flex(v-if="item.name && !isChange")
|
||||||
span.text-sm.w-fit {{item.title}}
|
span.text-sm.w-fit {{item.title}}
|
||||||
.flex.items-center(v-if="item.title")
|
.flex.items-center(v-if="item.title")
|
||||||
@@ -111,7 +84,7 @@
|
|||||||
span.text-sm {{item.title}}
|
span.text-sm {{item.title}}
|
||||||
.section-add-doc.flex.justify-center.items-center.cursor-pointer(
|
.section-add-doc.flex.justify-center.items-center.cursor-pointer(
|
||||||
v-else,
|
v-else,
|
||||||
@click="changeData"
|
@click="openAddDoc"
|
||||||
)
|
)
|
||||||
span Добавить данные
|
span Добавить данные
|
||||||
</template>
|
</template>
|
||||||
@@ -119,21 +92,18 @@
|
|||||||
<script>
|
<script>
|
||||||
import ClientDetailInput from "@/pages/clients/components/ClientDetailInput";
|
import ClientDetailInput from "@/pages/clients/components/ClientDetailInput";
|
||||||
import BaseButton from "@/components/base/BaseButton";
|
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 TableAddingNewDoc from "@/pages/clients/components/TableAddingNewDoc";
|
||||||
import TableAddingNewAdditional from "@/pages/clients/components/TableAddingNewAdditional";
|
import TableAddingNewAdditional from "@/pages/clients/components/TableAddingNewAdditional";
|
||||||
|
import ClientDetailSectionAddress from "@/pages/clients/components/ClientDetailSectionAddress";
|
||||||
import { detail } from "@/pages/clients/utils/tableConfig";
|
import { detail } from "@/pages/clients/utils/tableConfig";
|
||||||
import { mask } from "vue-the-mask";
|
|
||||||
export default {
|
export default {
|
||||||
name: "ClientDetailInfoSection",
|
name: "ClientDetailInfoSection",
|
||||||
components: {
|
components: {
|
||||||
TableAddingNewAdditional,
|
TableAddingNewAdditional,
|
||||||
BaseButton,
|
BaseButton,
|
||||||
BaseInput,
|
|
||||||
BaseSelect,
|
|
||||||
ClientDetailInput,
|
ClientDetailInput,
|
||||||
TableAddingNewDoc,
|
TableAddingNewDoc,
|
||||||
|
ClientDetailSectionAddress,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
saveNewDoc: Function,
|
saveNewDoc: Function,
|
||||||
@@ -143,11 +113,13 @@ export default {
|
|||||||
updateDocument: Function,
|
updateDocument: Function,
|
||||||
updateAddress: Function,
|
updateAddress: Function,
|
||||||
lackData: Boolean,
|
lackData: Boolean,
|
||||||
|
lackAddress: Boolean,
|
||||||
dopeAddress: Object,
|
dopeAddress: Object,
|
||||||
createAddress: Function,
|
createAddress: Function,
|
||||||
|
createDocument: Function,
|
||||||
|
addressId: String,
|
||||||
|
docId: String,
|
||||||
},
|
},
|
||||||
directives: { mask },
|
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
additionalData: {
|
additionalData: {
|
||||||
@@ -158,7 +130,6 @@ export default {
|
|||||||
},
|
},
|
||||||
docData: [],
|
docData: [],
|
||||||
isOpenAddingWrap: false,
|
isOpenAddingWrap: false,
|
||||||
isOpenChange: false,
|
|
||||||
isChange: false,
|
isChange: false,
|
||||||
settings: detail,
|
settings: detail,
|
||||||
cities: [
|
cities: [
|
||||||
@@ -167,12 +138,26 @@ export default {
|
|||||||
{ id: 1, label: "Луховицы" },
|
{ id: 1, label: "Луховицы" },
|
||||||
],
|
],
|
||||||
isData: true,
|
isData: true,
|
||||||
|
isAddress: true,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
changeData() {
|
openAddDoc() {
|
||||||
this.isData = true;
|
|
||||||
this.isChange = true;
|
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) {
|
copyValue(text) {
|
||||||
navigator.clipboard.writeText(text);
|
navigator.clipboard.writeText(text);
|
||||||
@@ -183,7 +168,6 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
saveChange() {
|
saveChange() {
|
||||||
this.isOpenChange = false;
|
|
||||||
this.isChange = false;
|
this.isChange = false;
|
||||||
if (this.section === "pass") {
|
if (this.section === "pass") {
|
||||||
this.updateDocument();
|
this.updateDocument();
|
||||||
@@ -191,12 +175,6 @@ export default {
|
|||||||
this.updateAddress();
|
this.updateAddress();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
createNewAddress() {
|
|
||||||
this.isOpenChange = false;
|
|
||||||
this.isChange = false;
|
|
||||||
this.createAddress();
|
|
||||||
this.updateAddress();
|
|
||||||
},
|
|
||||||
openAddingWrap() {
|
openAddingWrap() {
|
||||||
if (!this.isChange) {
|
if (!this.isChange) {
|
||||||
this.isOpenAddingWrap = !this.isOpenAddingWrap;
|
this.isOpenAddingWrap = !this.isOpenAddingWrap;
|
||||||
@@ -216,7 +194,6 @@ export default {
|
|||||||
this.saveNewDoc(this.section, this.docData);
|
this.saveNewDoc(this.section, this.docData);
|
||||||
}
|
}
|
||||||
this.isOpenAddingWrap = false;
|
this.isOpenAddingWrap = false;
|
||||||
this.isOpenChange = false;
|
|
||||||
this.docData = [];
|
this.docData = [];
|
||||||
this.additionalData = {
|
this.additionalData = {
|
||||||
header: "",
|
header: "",
|
||||||
@@ -233,6 +210,12 @@ export default {
|
|||||||
this.isData = newValue;
|
this.isData = newValue;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
lackAddress: {
|
||||||
|
immediate: true,
|
||||||
|
handler(newValue) {
|
||||||
|
this.isAddress = newValue;
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -289,8 +272,4 @@ export default {
|
|||||||
width: 38px
|
width: 38px
|
||||||
z-index: 1
|
z-index: 1
|
||||||
background: white
|
background: white
|
||||||
.input-info
|
|
||||||
color: var(--font-dark-blue-color)
|
|
||||||
.text-info
|
|
||||||
color: var(--font-grey-color)
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -5,15 +5,18 @@
|
|||||||
section="pass"
|
section="pass"
|
||||||
:update-document="updateDocument"
|
:update-document="updateDocument"
|
||||||
:lack-data="lackData"
|
:lack-data="lackData"
|
||||||
|
:create-document="createDocument"
|
||||||
|
:doc-id="docId"
|
||||||
)
|
)
|
||||||
.flex.flex-col
|
.flex.flex-col
|
||||||
client-detail-info-section(
|
client-detail-info-section(
|
||||||
:section-info="dataAddress"
|
:section-info="dataAddress"
|
||||||
section="addresses"
|
section="addresses"
|
||||||
:update-address="updateAddress"
|
:update-address="updateAddress"
|
||||||
:lack-data="lackData"
|
:lack-address="lackAddress"
|
||||||
:dope-address="dopeAddress"
|
:dope-address="dopeAddress"
|
||||||
:create-address="createAddress"
|
:create-address="createAddress"
|
||||||
|
:address-id="addressId"
|
||||||
)
|
)
|
||||||
.flex.flex-col
|
.flex.flex-col
|
||||||
client-detail-info-section(
|
client-detail-info-section(
|
||||||
@@ -21,7 +24,6 @@
|
|||||||
section="docs"
|
section="docs"
|
||||||
:save-new-doc="saveNewDoc"
|
:save-new-doc="saveNewDoc"
|
||||||
:delete-doc="deleteDoc"
|
:delete-doc="deleteDoc"
|
||||||
:lack-data="lackData"
|
|
||||||
)
|
)
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -40,8 +42,12 @@ export default {
|
|||||||
updateDocument: Function,
|
updateDocument: Function,
|
||||||
updateAddress: Function,
|
updateAddress: Function,
|
||||||
lackData: Boolean,
|
lackData: Boolean,
|
||||||
|
lackAddress: Boolean,
|
||||||
dopeAddress: Object,
|
dopeAddress: Object,
|
||||||
createAddress: Function,
|
createAddress: Function,
|
||||||
|
createDocument: Function,
|
||||||
|
addressId: String,
|
||||||
|
docId: String,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
51
src/pages/clients/components/ClientDetailSectionAddress.vue
Normal file
51
src/pages/clients/components/ClientDetailSectionAddress.vue
Normal file
@@ -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>
|
||||||
@@ -76,8 +76,12 @@
|
|||||||
:update-document="postUpdateIdentityDocument"
|
:update-document="postUpdateIdentityDocument"
|
||||||
:update-address="postUpdateAddress"
|
:update-address="postUpdateAddress"
|
||||||
:lack-data="lackData"
|
:lack-data="lackData"
|
||||||
|
:lack-address="lackAddress"
|
||||||
:dope-address="dopeAddress"
|
:dope-address="dopeAddress"
|
||||||
:create-address="postCreateAddress"
|
:create-address="postCreateAddress"
|
||||||
|
:create-document="postCreateIdentityDocument"
|
||||||
|
:address-id="addressId"
|
||||||
|
:doc-id="docId"
|
||||||
)
|
)
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -128,6 +132,7 @@ export default {
|
|||||||
docId: "",
|
docId: "",
|
||||||
addressId: "",
|
addressId: "",
|
||||||
lackData: true,
|
lackData: true,
|
||||||
|
lackAddress: true,
|
||||||
dopeAddress: {
|
dopeAddress: {
|
||||||
city: "",
|
city: "",
|
||||||
region: "",
|
region: "",
|
||||||
@@ -277,13 +282,8 @@ export default {
|
|||||||
this.saveAttachments([...data.attachments]);
|
this.saveAttachments([...data.attachments]);
|
||||||
},
|
},
|
||||||
saveIdentityDocument(data) {
|
saveIdentityDocument(data) {
|
||||||
if (
|
if (data?.id) {
|
||||||
data?.series ||
|
this.docId = data.id;
|
||||||
data?.numba ||
|
|
||||||
data?.issued_by_org ||
|
|
||||||
data?.issued_by_org_code ||
|
|
||||||
data?.issued_by_date
|
|
||||||
) {
|
|
||||||
this.dataIdentityDocument = {
|
this.dataIdentityDocument = {
|
||||||
numba:
|
numba:
|
||||||
data.series && data.numba ? data?.series + " " + data?.numba : "",
|
data.series && data.numba ? data?.series + " " + data?.numba : "",
|
||||||
@@ -295,6 +295,7 @@ export default {
|
|||||||
? data?.issued_by_date.split("-").reverse().join(".")
|
? data?.issued_by_date.split("-").reverse().join(".")
|
||||||
: "",
|
: "",
|
||||||
};
|
};
|
||||||
|
this.lackData = true;
|
||||||
} else {
|
} else {
|
||||||
this.lackData = false;
|
this.lackData = false;
|
||||||
this.dataIdentityDocument = {
|
this.dataIdentityDocument = {
|
||||||
@@ -304,7 +305,6 @@ export default {
|
|||||||
issued_by_date: "",
|
issued_by_date: "",
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
this.docId = data?.id;
|
|
||||||
},
|
},
|
||||||
postUpdateIdentityDocument() {
|
postUpdateIdentityDocument() {
|
||||||
fetchWrapper
|
fetchWrapper
|
||||||
@@ -321,17 +321,28 @@ export default {
|
|||||||
},
|
},
|
||||||
saveAddress(data) {
|
saveAddress(data) {
|
||||||
this.addressId = data?.id;
|
this.addressId = data?.id;
|
||||||
if (data?.join_adress) {
|
if (data?.join_adress && data?.join_adress.substr(0, 4) !== "None") {
|
||||||
this.dataAddress = {
|
this.dataAddress = {
|
||||||
join_adress: data?.join_adress,
|
join_adress: data?.join_adress,
|
||||||
};
|
};
|
||||||
|
this.lackAddress = true;
|
||||||
} else {
|
} else {
|
||||||
this.lackData = false;
|
this.lackAddress = false;
|
||||||
this.dataAddress = {
|
this.dataAddress = {
|
||||||
join_adress: "",
|
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() {
|
clearAddress() {
|
||||||
this.dopeAddress = {
|
this.dopeAddress = {
|
||||||
city: "",
|
city: "",
|
||||||
@@ -345,13 +356,7 @@ export default {
|
|||||||
postUpdateAddress() {
|
postUpdateAddress() {
|
||||||
fetchWrapper
|
fetchWrapper
|
||||||
.post(`general/address/${this.addressId}/update/`, {
|
.post(`general/address/${this.addressId}/update/`, {
|
||||||
full_address:
|
full_address: this.mergeFullAddress() || this.dataAddress.join_adress,
|
||||||
this.dopeAddress.city +
|
|
||||||
this.dopeAddress.region +
|
|
||||||
this.dopeAddress.street +
|
|
||||||
this.dopeAddress.house +
|
|
||||||
this.dopeAddress.flat +
|
|
||||||
this.dopeAddress.index || this.dataAddress.join_adress,
|
|
||||||
})
|
})
|
||||||
.then(() => this.fetchClientDetail(this.id));
|
.then(() => this.fetchClientDetail(this.id));
|
||||||
this.clearAddress();
|
this.clearAddress();
|
||||||
@@ -384,6 +389,22 @@ export default {
|
|||||||
fetchWrapper
|
fetchWrapper
|
||||||
.post("general/address/create/", {
|
.post("general/address/create/", {
|
||||||
person_id: this.id,
|
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));
|
.then(() => this.fetchClientDetail(this.id));
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user