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

Исправила отображение контактов на записи

Browse Source
This commit is contained in:
Daria Golova
2023-08-25 14:26:53 +03:00
parent d1c5dc5683
commit 15e31ebcd7
10 changed files with 164 additions and 299 deletions
Download Patch File Download Diff File Expand all files Collapse all files

298
src/pages/newMedicalCard/components/BasicDataForms/InsuranceForm.vue
View File

@@ -17,23 +17,27 @@
:style="{marginTop: field.label === 'Документы' ? '20px' : null}"
)
.label-field.font-sm.text-sm.whitespace-nowrap {{`${field.label} :`}}
.avatar-field.flex.gap-3.items-center.h-10.w-10(v-if="field.type === 'attachments'")
.flex.w-10.h-10.relative(v-if="insuranceData[insurance.insuranceKey][field.key]?.photo")
.flex.gap-3.items-center.h-10.w-10(
v-if="field.type === 'photo'",
:style="{'min-width': field.label === 'Документы' ? '324px' : '302px'}"
)
.flex.w-10.h-10.relative(v-if="insuranceData[insurance.insuranceKey]?.attachments?.photo")
img.rounded.avatar.object-cover(
:src="insuranceData[insurance.insuranceKey][field.key]?.photo",
:src="insuranceData[insurance.insuranceKey]?.attachments?.photo",
alt="AV"
)
q-badge.delete(
floating,
v-if="isEdit",
@click="removeImage(insurance?.insuranceKey, field?.key)",
rounded
rounded,
:style="{padding: 0}"
)
q-icon(name="app:icon-cancel", size="8px")
q-icon.cancel-icon(name="app:cancel-mini", size="16px")
.replace-photo.font-medium.text-base.cursor-pointer(
v-if="isEdit",
@click="changeModal(insurance.insuranceKey)"
) {{ insuranceData[insurance.insuranceKey][field.key]?.photo ? "Заменить фото" : "Добавить фото" }}
) {{ insuranceData[insurance.insuranceKey]?.attachments?.photo ? "Заменить фото" : "Добавить фото" }}
base-modal(
v-if="insurance.insuranceKey === photoId"
v-model="showModal",
@@ -48,7 +52,7 @@
.category-select.flex.items-center.change.px-4.rounded {{selectCategory(basic[insurance.insuranceKey][field.key])}}
q-btn.change.flex.w-7.h-9.rounded-md(
v-if="isEdit",
@click="showModalCategories = true",
@click="openModalCategories",
dense,
padding="8px"
)
@@ -75,28 +79,26 @@
span(
:style="{color: 'var(--font-dark-blue-color)'}"
) {{"\xa0" + basic?.benefit[insurance?.discount] + "%"}}
.input-container.flex.flex-col.relative(v-if="field.type === 'text'")
.input-container.flex.flex-col.relative(v-else)
base-input(
v-model="insuranceData[insurance.insuranceKey][field.key]",
@update:model-value="checkChangeInput(insurance.insuranceKey)",
:mask="field?.inputMask",
@update:model-value="checkChangeInput",
:readonly="!isEdit",
:type="field.type",
size="M",
:name="insurance.insuranceKey + ':' + field.key",
:rule="[(val) => checkFields(val, insurance.insuranceKey, field.key, field.rules)]"
:rule="[(val) => checkFields(val, insurance.insuranceKey, field.rules)]"
)
q-icon.my-auto.text-lg.label-field.cursor-pointer.copy(
size="18px",
name="app:copy",
v-if="checkCopiedFields(field.key, basic[insurance.insuranceKey])",
@click="copyValue(basic[insurance.insuranceKey][field.key])"
v-if="checkCopiedFields(field.key, insuranceData[insurance.insuranceKey])",
@click="copyValue(insuranceData[insurance.insuranceKey][field.key])"
)
</template>
<script>
import { baseInsuranceForm } from "@/pages/newMedicalCard/utils/medicalConfig";
import { mapGetters, mapState } from "vuex";
import { mapActions, mapGetters, mapState } from "vuex";
import MedicalFormWrapper from "@/pages/newMedicalCard/components/MedicalFormWrapper.vue";
import BaseAvatar from "@/components/base/BaseAvatar.vue";
import { fetchWrapper } from "@/shared/fetchWrapper";
@@ -131,13 +133,31 @@ export default {
photoId: "",
copiedFields: ["series", "number"],
insuranceData: {},
initializationData: {
OMS: {
category: "OMS",
id: null,
series: null,
number: null,
issued_by: null,
issued_at: "",
attachments: null,
},
DMS: {
category: "OMS",
id: null,
series: null,
number: null,
issued_by: null,
issued_at: "",
attachments: null,
},
},
};
},
computed: {
...mapGetters({
url: "getUrl",
//avatar: "getAvatar",
//initDataBasic: "getBasicData",
}),
...mapState({
basic: (state) => state.medical?.basicData,
@@ -174,8 +194,8 @@ export default {
this.$store.dispatch("getBenefitData", text);
},
removeImage(docKey, field) {
this.basic[docKey][field] = {};
this.isCheckChange = true;
this.insuranceData[docKey][field] = {};
this.checkChangeInput();
},
checkCopiedFields(key, item) {
return (
@@ -209,10 +229,11 @@ export default {
openModalCategories() {
//if (this.isEdit) this.showModalCategories = true;
},
checkChangeInput(key) {
this.isCheckChange =
JSON.stringify(this.initialDocData?.[key]) !==
JSON.stringify(this.insuranceData?.[key]);
checkChangeInput() {
this.isCheckChange = checkChangeData(
this.destruct(this.initialDocData),
this.insuranceData
);
},
confirmChangePhoto() {
this.showModal = false;
@@ -224,9 +245,9 @@ export default {
if (!validate) {
getFieldsNameUnvalidated(form).forEach((elem) => {
let error = {};
this.configData.forEach(({ dataKey, fields }) => {
this.insuranceConfig.forEach(({ insuranceKey, fields }) => {
let findedElem = fields.find(
(el) => dataKey + ":" + el.key === elem
(el) => insuranceKey + ":" + el.key === elem
);
if (findedElem) error = findedElem?.errorMessage;
});
@@ -237,176 +258,35 @@ export default {
Object.keys(this.insuranceData).forEach((elem) => {
this.checkChangePhoto(elem, "attachments");
let newData = JSON.parse(JSON.stringify(this.insuranceData[elem]));
console.log("prep", newData);
newData.attachments = {};
if (!checkChangeData(this.initialDocData?.[elem], newData)) return;
delete newData.id;
delete newData.attachments;
Object.keys(this.insuranceData[elem])?.forEach((key) => {
if (!this.insuranceData?.[elem]?.[key]) delete newData?.[key];
});
if (!this.initialDocData?.[elem]?.id) {
console.log("post", newData);
newData.person_id =
this.$store.state.medical?.basicData?.personalData?.id;
console.log("create", newData);
//request.push(this.createData("documents/", newData));
} else {
console.log("create", newData);
// request.push(
// this.updateData(
// `documents/${this.initialDocData?.[elem]?.id}`,
// newData
// )
// );
}
});
Promise.allSettled(request).then(() => {
this.getMedicalCardData(this.$route.params.id);
this.isEdit = false;
this.isCheckChange = false;
this.$refs.form?.resetValidation();
request.push(this.createData("documents/", newData));
} else
request.push(
this.updateData(
`documents/${this.initialDocData?.[elem]?.id}`,
newData
)
);
});
if (request.length)
Promise.allSettled(request).then(() => {
this.getMedicalDataById(this.$route.params.id);
this.isEdit = false;
this.isCheckChange = false;
this.$refs.form?.resetValidation();
});
}
});
// let insuranceDMS = this.basic.insuranceDMS;
// let insuranceOMS = this.basic.insuranceOMS;
// let personal = this.basic.personalData;
// let benefit = this.basic.benefit;
// const insuranceFormDataDMS = new FormData();
// const insuranceFormDataOMS = new FormData();
// const benefitFormData = new FormData();
// if (insuranceDMS.series && insuranceDMS.number) {
// for (let key in insuranceDMS) {
// if (insuranceDMS[key] && key !== "photo" && key !== "id")
// insuranceFormDataDMS.append(key, insuranceDMS[key]);
// }
// }
// if (
// insuranceDMS.photo.file &&
// insuranceDMS.photo.photo !== this.initDataBasic.insuranceDMS.photo.photo
// )
// insuranceFormDataDMS.append("photo", insuranceDMS.photo.file[0]);
// if (insuranceOMS.series && insuranceOMS.number) {
// for (let key in insuranceOMS) {
// if (insuranceOMS[key] && key !== "photo" && key !== "id")
// insuranceFormDataOMS.append(key, insuranceOMS[key]);
// }
// }
// if (
// insuranceOMS.photo.file &&
// insuranceOMS.photo.photo !== this.initDataBasic.insuranceOMS.photo.photo
// )
// insuranceFormDataOMS.append("photo", insuranceOMS.photo.file[0]);
// const request = Object.keys(this.basic).map((key) => {
// if (
// key === "insuranceDMS" &&
// !insuranceDMS?.id &&
// insuranceDMS.series &&
// insuranceDMS.number
// ) {
// insuranceFormDataDMS.append("title", "DMS");
// insuranceFormDataDMS.append("person", personal.id);
// return this.sendData(
// `general/insurance_policy/create/`,
// insuranceFormDataDMS
// );
// }
// if (
// key === "insuranceOMS" &&
// !insuranceOMS?.id &&
// insuranceOMS.series &&
// insuranceOMS.number
// ) {
// insuranceFormDataOMS.append("title", "OMS");
// insuranceFormDataOMS.append("person", personal.id);
// return this.sendData(
// `general/insurance_policy/create/`,
// insuranceFormDataOMS
// );
// }
// if (
// checkChangeData(this.initDataBasic.insuranceDMS, insuranceDMS) &&
// key === "insuranceDMS" &&
// insuranceDMS.id
// ) {
// this.checkedPhoto(
// insuranceDMS.photo,
// insuranceDMS.id,
// "insurance_policy",
// "delete_photo"
// );
// insuranceFormDataDMS.append("title", "DMS");
// return this.sendData(
// `general/insurance_policy/${insuranceDMS.id}/update/`,
// insuranceFormDataDMS
// );
// } else if (
// insuranceDMS.id &&
// (!insuranceDMS.series || !insuranceDMS.number)
// ) {
// this.addErrorNotification(
// "Ошибка заполнения формы ДМС",
// "Пожалуйста заполните все поля"
// );
// }
// if (
// checkChangeData(this.initDataBasic.insuranceOMS, insuranceOMS) &&
// key === "insuranceOMS" &&
// insuranceOMS.id
// ) {
// this.checkedPhoto(
// insuranceOMS.photo,
// insuranceOMS.id,
// "insurance_policy",
// "delete_photo"
// );
// insuranceFormDataOMS.append("title", "OMS");
// return this.sendData(
// `general/insurance_policy/${insuranceOMS.id}/update/`,
// insuranceFormDataOMS
// );
// } else if (
// insuranceOMS.id &&
// (!insuranceOMS.series || !insuranceOMS.number)
// ) {
// this.addErrorNotification(
// "Ошибка заполнения формы ОМС",
// "Пожалуйста заполните все поля"
// );
// }
// if (
// checkChangeData(this.initDataBasic.benefit, benefit) &&
// key === "benefit"
// ) {
// this.checkedPhoto(
// benefit.photo,
// personal.id,
// "person",
// "delete_photo_benefit"
// );
// fetchWrapper.post(`general/person/${personal.id}/update/`, {
// benefit: benefit.id,
// });
// if (
// benefit.photo.file &&
// benefit.photo.photo !== this.initDataBasic.benefit.photo.photo
// ) {
// benefitFormData.append("photo_benefit", benefit.photo.file[0]);
// return this.sendData(
// `general/person/${personal.id}/update/`,
// benefitFormData
// );
// }
// }
// });
// return request;
},
//todo удалить
checkChangePhoto(updatedObjId, field) {
if (this.insuranceData[updatedObjId][field]?.file)
console.log(
@@ -418,33 +298,30 @@ export default {
addErrorNotification(title, message) {
addNotification(title + message, title, message, "error", 5000);
},
async sendData(url, body) {
return await fetchWrapper.post(url, body, "formData");
async createData(url, body) {
return await fetchWrapper.post(url, body);
},
async updateData(url, body) {
return await fetchWrapper.patch(url, body);
},
cancelEdit() {
const { OMS, DMS } = JSON.parse(JSON.stringify(this.initialDocData));
this.insuranceData = {
OMS: OMS,
DMS: DMS,
};
console.log("insuranceData cancel", this.insuranceData);
this.insuranceData = this.destruct(this.initialDocData);
this.isEdit = false;
this.isCheckChange = false;
},
openEdit() {
this.isEdit = true;
},
// saveChange() {
// this.isLoadingData = true;
// let updateBasic = this.updateInsurance();
// Promise.allSettled(updateBasic)
// .then(() => this.$store.dispatch("getMedicalCardData"))
// .then(() => {
// this.isLoadingData = false;
// this.isEdit = false;
// this.isCheckChange = false;
// });
// },
destruct(data) {
const { OMS, DMS } = JSON.parse(JSON.stringify(data));
return {
OMS: OMS,
DMS: DMS,
};
},
...mapActions({
getMedicalDataById: "getMedicalDataById",
}),
},
watch: {
showModalCategories: {
@@ -457,12 +334,9 @@ export default {
deep: true,
immediate: true,
handler(newVal) {
const { OMS, DMS } = JSON.parse(JSON.stringify(newVal));
this.insuranceData = {
OMS: OMS,
DMS: DMS,
};
console.log("insuranceData watch", this.insuranceData);
if (Object.keys(newVal).length) {
this.insuranceData = this.destruct(newVal);
} else this.insuranceData = this.initializationData;
},
},
},
@@ -477,9 +351,6 @@ export default {
background: rgba(0, 0, 0, 0.05)
color: var(--font-dark-blue-color)
.avatar-field
min-width: 302px
.avatar
height: 100%
@@ -540,4 +411,7 @@ export default {
.q-field--outlined.q-field--readonly :deep(.q-field__native)
cursor: default
.cancel-icon :deep(path)
fill: white
</style>