admin/astra-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[WIP] Добавил дополнительные поля адресов и их сохранение

Browse Source
This commit is contained in:
megavrilinvv
2022-11-14 18:39:12 +03:00
parent 81451daeb4
commit 1cf3aece41
3 changed files with 109 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
src/pages/clients/components/ClientDetailInfoSection.vue
View File

@@ -4,14 +4,22 @@
)
.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="lackPass || lackAddress")
.flex.items-center.gap-x-8(v-if="this.isData")
base-button(
v-if="isChange",
v-if="isChange && !this.isData",
@click="saveChange",
confirm,
rounded,
outlined,
:size="20"
)
base-button(
v-if="isChange && this.isData",
@click="createNewAddress",
confirm,
rounded,
outlined,
:size="20"
)
.icon-ok.text-xsm(class="pt-[3px]")
.edit.icon-edit.cursor-pointer.text-sm(
@@ -40,7 +48,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="lackPass || lackAddress")
.section-body.w-full.flex.flex-col.px-4.pt-3.pb-4.gap-y-4(v-if="this.isData")
.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(
@@ -71,23 +79,27 @@
.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="Выберите город")
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="Введите область")
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="Введите улицу")
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="Дом")
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="Квартира")
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")
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")
@@ -97,7 +109,10 @@
@click="(e) => deleteDoc(e)"
)
span.text-sm {{item.title}}
.section-add-doc.flex.justify-center.items-center.cursor-pointer(v-else)
.section-add-doc.flex.justify-center.items-center.cursor-pointer(
v-else,
@click="changeData"
)
span Добавить данные
</template>
@@ -127,8 +142,9 @@ export default {
deleteDoc: Function,
updateDocument: Function,
updateAddress: Function,
lackPass: Boolean,
lackAddress: Boolean,
lackData: Boolean,
dopeAddress: Object,
createAddress: Function,
},
directives: { mask },
@@ -145,12 +161,19 @@ export default {
isOpenChange: false,
isChange: false,
settings: detail,
customTokens: {
Y: { pattern: /[0-9a-zA-Zа-яёА-ЯЁ ]/u },
},
cities: [
{ id: 1, label: "Рязань" },
{ id: 1, label: "Москва" },
{ id: 1, label: "Луховицы" },
],
isData: true,
};
},
methods: {
changeData() {
this.isData = true;
this.isChange = true;
},
copyValue(text) {
navigator.clipboard.writeText(text);
},
@@ -168,6 +191,12 @@ export default {
this.updateAddress();
}
},
createNewAddress() {
this.isOpenChange = false;
this.isChange = false;
this.createAddress();
this.updateAddress();
},
openAddingWrap() {
if (!this.isChange) {
this.isOpenAddingWrap = !this.isOpenAddingWrap;
@@ -197,6 +226,14 @@ export default {
};
},
},
watch: {
lackData: {
immediate: true,
handler(newValue) {
this.isData = newValue;
},
},
},
};
</script>

12
src/pages/clients/components/ClientDetailInfoWrapper.vue
View File

@@ -4,14 +4,16 @@
v-model:section-info="dataDocument"
section="pass"
:update-document="updateDocument"
:lack-pass="lackPass"
:lack-data="lackData"
)
.flex.flex-col
client-detail-info-section(
:section-info="dataAddress"
section="addresses"
:update-address="updateAddress"
:lack-address="lackAddress"
:lack-data="lackData"
:dope-address="dopeAddress"
:create-address="createAddress"
)
.flex.flex-col
client-detail-info-section(
@@ -19,6 +21,7 @@
section="docs"
:save-new-doc="saveNewDoc"
:delete-doc="deleteDoc"
:lack-data="lackData"
)
</template>
@@ -36,8 +39,9 @@ export default {
dataDocument: Object,
updateDocument: Function,
updateAddress: Function,
lackPass: Boolean,
lackAddress: Boolean,
lackData: Boolean,
dopeAddress: Object,
createAddress: Function,
},
};
</script>

65
src/pages/clients/components/ClientsTableRow.vue
View File

@@ -75,8 +75,9 @@
:delete-doc="deleteDoc"
:update-document="postUpdateIdentityDocument"
:update-address="postUpdateAddress"
:lack-pass="lackPass"
:lack-address="lackAddress"
:lack-data="lackData"
:dope-address="dopeAddress"
:create-address="postCreateAddress"
)
</template>
@@ -126,8 +127,15 @@ export default {
dataClient: {},
docId: "",
addressId: "",
lackPass: true,
lackAddress: true,
lackData: true,
dopeAddress: {
city: "",
region: "",
street: "",
house: "",
flat: "",
index: "",
},
};
},
props: {
@@ -174,7 +182,6 @@ export default {
priority: this.dataClient.priority,
});
},
postContactsClient() {
let contacts = [...this.dataClient.contacts];
if (
@@ -233,7 +240,6 @@ export default {
postDeleteContact(contact) {
fetchWrapper.del(`general/contact/${contact.id}/delete/`);
},
addNetwork(network) {
this.dataClient.contacts.push(network);
},
@@ -270,10 +276,6 @@ export default {
this.saveAddress(data.address[0]);
this.saveAttachments([...data.attachments]);
},
addDoc() {
this.lackPass = false;
},
saveIdentityDocument(data) {
if (
data?.series ||
@@ -294,12 +296,17 @@ export default {
: "",
};
} else {
this.lackPass = false;
this.lackData = false;
this.dataIdentityDocument = {
numba: "",
issued_by_org: "",
issued_by_org_code: "",
issued_by_date: "",
};
}
this.docId = data?.id;
},
postUpdateIdentityDocument() {
console.log(this.dataIdentityDocument);
fetchWrapper
.post(`general/identity_document/${this.docId}/update/`, {
series_number: this.dataIdentityDocument.numba,
@@ -313,22 +320,41 @@ export default {
.then(() => this.fetchClientDetail(this.id));
},
saveAddress(data) {
this.addressId = data?.id;
if (data?.join_adress) {
this.dataAddress = {
join_adress: data?.join_adress,
};
} else {
this.lackAddress = false;
this.lackData = false;
this.dataAddress = {
join_adress: "",
};
}
this.addressId = data?.id;
},
clearAddress() {
this.dopeAddress = {
city: "",
region: "",
street: "",
flat: "",
house: "",
index: "",
};
},
postUpdateAddress() {
fetchWrapper
.post(`general/address/${this.addressId}/update/`, {
full_address: this.dataAddress.join_adress,
full_address:
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));
this.clearAddress();
},
saveAttachments(data) {
this.dataAttachments = [...data];
@@ -354,6 +380,13 @@ export default {
(el) => el.id !== e.target.id
);
},
postCreateAddress() {
fetchWrapper
.post("general/address/create/", {
person_id: this.id,
})
.then(() => this.fetchClientDetail(this.id));
},
},
};
</script>