From 9383be22dfd86929042dcf6da052a19eba829545 Mon Sep 17 00:00:00 2001 From: DwCay Date: Tue, 11 Apr 2023 17:12:09 +0300 Subject: [PATCH] =?UTF-8?q?WIP=20=D0=9F=D0=BE=D0=BF=D1=80=D0=B0=D0=B2?= =?UTF-8?q?=D0=B8=D0=BB=20=D1=83=D1=81=D0=BB=D0=BE=D0=B2=D0=B8=D1=8F=20?= =?UTF-8?q?=D1=81=D0=BE=D1=85=D1=80=D0=B0=D0=BD=D0=B5=D0=BD=D0=B8=D1=8F=20?= =?UTF-8?q?=D0=B8=D0=B7=D0=BC=D0=B5=D0=BD=D0=B5=D0=BD=D0=B8=D0=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/base/BaseInput.vue | 5 + src/components/base/BaseUploadPhoto.vue | 8 +- .../components/BasicDataForm.vue | 120 ++++++++---------- .../newMedicalCard/utils/configMedical.js | 8 +- src/shared/utils/wrapperRequestChangeData.js | 28 ++++ src/store/modules/medicalCard.js | 7 +- 6 files changed, 102 insertions(+), 74 deletions(-) create mode 100644 src/shared/utils/wrapperRequestChangeData.js diff --git a/src/components/base/BaseInput.vue b/src/components/base/BaseInput.vue index f2206fc..0fd5c5e 100644 --- a/src/components/base/BaseInput.vue +++ b/src/components/base/BaseInput.vue @@ -21,6 +21,7 @@ :autogrow="autogrow", :square="square", :standout="standout" + :accept="accept" hide-bottom-space ) slot.cursor-pointer @@ -65,6 +66,10 @@ export default { type: [Boolean, String], default: false, }, + accept: { + type: String, + default: "", + }, mask: String, width: Number, maxLength: Number, diff --git a/src/components/base/BaseUploadPhoto.vue b/src/components/base/BaseUploadPhoto.vue index f864b20..ccba08c 100644 --- a/src/components/base/BaseUploadPhoto.vue +++ b/src/components/base/BaseUploadPhoto.vue @@ -7,7 +7,7 @@ circle, type="file", id="image-upload", - accept="image/*", + accept="image/.jpg,.jpeg,.png, .jpg", @change="(e)=>previewImage(e)", ) .avatar.flex.absolute.items-center.gap-x-6 @@ -48,15 +48,17 @@ export default { this.image = e.target.result; }; reader.readAsDataURL(picture[0]); + this.imageData = [...event.target.files]; }, confirm() { - this.value = this.image; + this.value.file = this.imageData; + this.value.photo = this.image; this.confirmUpload(); }, }, created() { if (this.value) { - this.image = this.value; + this.image = this.value.photo; } }, }; diff --git a/src/pages/newMedicalCard/components/BasicDataForm.vue b/src/pages/newMedicalCard/components/BasicDataForm.vue index 8b180c6..fac6807 100644 --- a/src/pages/newMedicalCard/components/BasicDataForm.vue +++ b/src/pages/newMedicalCard/components/BasicDataForm.vue @@ -16,8 +16,8 @@ .avatar-field.flex.gap-3.items-center(v-if="field.type === 'avatar'") base-avatar(:size="40") img.avatar.object-cover( - v-if="basic[data.dataKey][field.key]" - :src="basic[data.dataKey][field.key]" + v-if="basic[data.dataKey][field.key]?.photo" + :src="basic[data.dataKey][field.key].photo" alt="AV" ) span(v-else) {{ avatar }} @@ -30,7 +30,7 @@ .select(v-else-if="field.type === 'select'") base-select( v-model="basic[data.dataKey][field.key]" - @input="checkChangeInput" + @update:model-value="checkChangeInput" :hide-dropdown-icon="!isEdit" :disable="!isEdit" :outlined="isEdit" @@ -42,7 +42,7 @@ v-else :disabled="!isEdit" v-model="basic[data.dataKey][field.key]" - @input="checkChangeInput" + @update:model-value="checkChangeInput" :type="field.type" :width="300" :standout="!isEdit" @@ -59,8 +59,8 @@ import BaseAvatar from "@/components/base/BaseAvatar.vue"; import BaseModal from "@/components/base/BaseModal.vue"; import BaseUploadPhoto from "@/components/base/BaseUploadPhoto.vue"; import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue"; +import { getRequestChangeData } from "@/shared/utils/wrapperRequestChangeData"; import { fetchWrapper } from "@/shared/fetchWrapper"; -import { removeEmptyFields } from "@/shared/utils/changesObjects"; import moment from "moment"; import { baseDataForm, @@ -110,6 +110,7 @@ export default { }, confirmCahngeAvatar() { this.showModal = false; + this.isCheckChange = true; }, cancelEdit() { this.$store.dispatch("returnInitData"); @@ -119,75 +120,61 @@ export default { let registration = this.basic.registrationAddress; let residence = this.basic.residenceAddress; let personal = this.basic.personalData; + const personalFormData = new FormData(); + personalFormData.append( + "full_name", + `${personal.last_name} ${personal.first_name} ${personal.patronymic}` + ); + if (personal.birth_date) { + personalFormData.append( + "birth_date", + moment(personal.birth_date).format("YYYY-MM-DD") + ); + } + if (personal.gender) { + personalFormData.append("gender", personal.gender?.id); + } + if ( + personal.photo.file && + personal.photo.photo !== this.initDataBasic.personalData.photo.photo + ) { + personalFormData.append("photo", personal.photo.file[0]); + } const request = Object.keys(this.basic).map((key) => { if (key === "personalData") { - let updatePersonal = { - full_name: `${personal.last_name} ${personal.first_name} ${personal.patronymic}`, - gender: personal.gender?.id, - birth_date: - personal.birth_date && - moment(personal.birth_date).format("YYYY-MM-DD"), - }; - if ( - JSON.stringify(this.basic[key]) !== - JSON.stringify(this.initDataBasic[key]) - ) { - return fetchWrapper.post( - `general/person/${personal.id}/update/`, - updatePersonal - ); - } - return Promise.resolve(); + return fetchWrapper.post( + `general/person/${personal.id}/update/`, + personalFormData, + "formData" + ); } if (key === "registrationAddress") { - let initRegistration = Object.keys( - removeEmptyFields(this.initDataBasic[key]) + let createRegistration = { + person: personal.id, + registration_flg: true, + ...registration, + }; + return getRequestChangeData( + createRegistration, + registration, + this.initDataBasic[key], + "address", + registration.id ); - if (Object.keys(removeEmptyFields(this.basic[key])).length) { - if (!initRegistration.length) { - return fetchWrapper.post(`general/address/create/`, { - person: personal.id, - registration_flg: true, - ...removeEmptyFields(registration), - }); - } - if ( - JSON.stringify(this.basic[key]) !== - JSON.stringify(this.initDataBasic[key]) - ) { - return fetchWrapper.post( - `general/address/${registration.id}/update/`, - removeEmptyFields(registration) - ); - } - return Promise.resolve(); - } - return Promise.resolve(); } if (key === "residenceAddress") { - let initResidence = Object.keys( - removeEmptyFields(this.initDataBasic[key]) + let createResidence = { + person: personal.id, + residence_flg: true, + ...residence, + }; + return getRequestChangeData( + createResidence, + residence, + this.initDataBasic[key], + "address", + residence.id ); - if (Object.keys(removeEmptyFields(this.basic[key])).length) { - if (!initResidence.length) { - return fetchWrapper.post(`general/address/create/`, { - person: personal.id, - residence_flg: true, - ...removeEmptyFields(residence), - }); - } - if ( - JSON.stringify(this.basic[key]) !== - JSON.stringify(this.initDataBasic[key]) - ) { - return fetchWrapper.post( - `general/address/${residence.id}/update/`, - removeEmptyFields(residence) - ); - } - return Promise.resolve(); - } - return Promise.resolve(); } }); return request; @@ -200,6 +187,7 @@ export default { .then(() => { this.isLoadingData = false; this.isEdit = false; + this.isCheckChange = false; }); }, openEdit() { diff --git a/src/pages/newMedicalCard/utils/configMedical.js b/src/pages/newMedicalCard/utils/configMedical.js index 33eec5a..0c47070 100644 --- a/src/pages/newMedicalCard/utils/configMedical.js +++ b/src/pages/newMedicalCard/utils/configMedical.js @@ -58,13 +58,13 @@ export const baseDataForm = [ key: "house_number", label: "Дом", type: "text", - rules: [(val) => !/^\W|0/.test(val)], + rules: [(val) => !/^[\W0]/.test(val)], }, { key: "apartment_number", label: "Квартира", type: "text", - rules: [(val) => !/^\W|0/.test(val)], + rules: [(val) => !/^[\W0]/.test(val)], }, ], }, @@ -91,13 +91,13 @@ export const baseDataForm = [ key: "house_number", label: "Дом", type: "text", - rules: [(val) => !/^\W|0/.test(val)], + rules: [(val) => !/^[\W0]/.test(val)], }, { key: "apartment_number", label: "Квартира", type: "text", - rules: [(val) => !/^\W|0/.test(val)], + rules: [(val) => !/^[\W0]/.test(val)], }, ], }, diff --git a/src/shared/utils/wrapperRequestChangeData.js b/src/shared/utils/wrapperRequestChangeData.js new file mode 100644 index 0000000..3bea476 --- /dev/null +++ b/src/shared/utils/wrapperRequestChangeData.js @@ -0,0 +1,28 @@ +import { fetchWrapper } from "../fetchWrapper"; +import { removeEmptyFields } from "./changesObjects"; + +export function getRequestChangeData( + createData, + updateData, + initData, + key, + id +) { + let isInitDataEmpty = [...Object.keys(removeEmptyFields(initData))].length; + if (Object.keys(removeEmptyFields(updateData)).length) { + if (!isInitDataEmpty) { + return fetchWrapper.post( + `general/${key}/create/`, + removeEmptyFields(createData) + ); + } + if (JSON.stringify(updateData) !== JSON.stringify(initData)) { + return fetchWrapper.post( + `general/${key}/${id}/update/`, + removeEmptyFields(updateData) + ); + } + return Promise.resolve(); + } + return Promise.resolve(); +} diff --git a/src/store/modules/medicalCard.js b/src/store/modules/medicalCard.js index 7e023a2..3425ff4 100644 --- a/src/store/modules/medicalCard.js +++ b/src/store/modules/medicalCard.js @@ -49,7 +49,12 @@ const getters = { birth_date: person?.birth_date ? new Date(person?.birth_date) : new Date(), - photo: person?.photo ? rootState.getUrl + person?.photo : null, + photo: person?.photo + ? { + photo: rootState.getUrl + person.photo, + file: null, + } + : {}, id: person?.id, }, registrationAddress: {