WIP Изменила инпут, сделала документы

This commit is contained in:
Daria Golova
2023-08-22 15:19:28 +03:00
parent 817f881159
commit 4987a3ae09
6 changed files with 146 additions and 169 deletions

View File

@@ -29,9 +29,10 @@
floating,
v-if="isEdit",
rounded,
@click="removeImage(data?.dataKey, field?.key)"
@click="removeImage(data?.dataKey, field?.key)",
:style="{padding: 0}"
)
q-icon.icon-cancel(name="app: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="openModal(data.dataKey)",
@@ -44,46 +45,30 @@
base-input-date(
v-if="field.type === 'date'",
v-model="docData[data.dataKey][field.key]",
:name="field.key",
:name="data.dataKey + ':' + field.key",
@update:model-value="checkChangeDocData",
:readonly="!isEdit",
:width="302",
:mask="field?.inputMask",
:rule="[(val) => !personDataField.includes(field.key) ? checkPassportFields(val, field.rules) : field.rules(val)]",
:autogrow="field.key === 'issued_by_org'",
size="M"
:rule="(val) => !personDataField.includes(data.dataKey + ':' + field.key) ? checkPassportFields(val, field.rules) : field.rules(val)",
size="M",
)
base-input(
v-if="field.type === 'text' && field.key !== 'issued_by_org'",
v-if="field.type === 'text'",
v-model="docData[data.dataKey][field.key]",
:name="field.key",
:name="data.dataKey + ':' + field.key",
@update:model-value="checkChangeDocData",
:readonly="!isEdit",
:type="field.type",
:width="302",
:mask="field?.inputMask",
:rule="[(val) => !personDataField.includes(field.key) ? checkPassportFields(val, field.rules) : field.rules(val)]",
:rule="[(val) => !personDataField.includes(data.dataKey + ':' + field.key) ? checkPassportFields(val, field.rules) : field.rules(val)]",
size="M"
)
.icon-copy.my-auto.text-lg.label-field.cursor-pointer(
v-if="checkCopiedFields(field.key) && !!docData[data.dataKey][field.key]",
@click="copyValue(docData[data.dataKey][field.key])"
)
base-textarea(
v-if="field.type === 'text' && field.key === 'issued_by_org'",
v-model="docData[data.dataKey][field.key]",
:name="field.key",
@update:model-value="checkChangeDocData",
:readonly="!isEdit",
:type="field.type",
:width="302",
:mask="field?.inputMask",
:rule="[(val) => !personDataField.includes(field.key) ? checkPassportFields(val, field.rules) : field.rules(val)]",
autogrow,
size="auto",
height="57px"
padding="10px 16px"
)
</template>
<script>
@@ -101,7 +86,7 @@ import TheNotificationProvider from "@/components/Notifications/TheNotificationP
import { addNotification } from "@/components/Notifications/notificationContext";
import BaseInput from "@/components/base/BaseInput.vue";
import BaseInputDate from "@/components/base/BaseInputDate.vue";
import BaseTextarea from "@/components/base/BaseTextarea.vue.vue";
import { mapActions } from "vuex";
export default {
name: "DocumentsForm",
components: {
@@ -112,7 +97,6 @@ export default {
BaseUploadPhoto,
TheNotificationProvider,
BaseInputDate,
BaseTextarea,
},
data() {
return {
@@ -133,21 +117,26 @@ export default {
id: null,
series: null,
number: null,
issued_by_org: null,
issued_by: null,
issued_by_org_code: null,
issued_by_date: null,
photo: null,
issued_at: null,
attachments: null,
},
insurance_number: {
insurance_number: null,
photo_insurance_number: null,
id: null,
number: null,
attachments: null,
},
tax_identification_number: {
tax_identification_number: null,
photo_tax_identification_number: null,
id: null,
number: null,
attachments: null,
},
},
personDataField: ["insurance_number", "tax_identification_number"],
personDataField: [
"insurance_number:number",
"tax_identification_number:number",
],
showModal: false,
photoId: "",
};
@@ -157,7 +146,7 @@ export default {
return this.$store.state.medical?.documents;
},
passportFields() {
let excludedFields = ["photo", "id"];
let excludedFields = ["attachments", "id", "category"];
return Object.keys(this.docData.passport).filter(
(key) => !excludedFields.includes(key)
);
@@ -191,8 +180,6 @@ export default {
},
cancelEdit() {
this.docData = JSON.parse(JSON.stringify(this.initialDocData));
this.docData.passport.issued_by_date =
this.initialDocData?.passport?.issued_by_date;
this.isEdit = false;
this.isCheckChange = false;
this.$refs.documentForm.resetValidation();
@@ -217,95 +204,72 @@ export default {
if (!validate) {
getFieldsNameUnvalidated(form).forEach((elem) => {
let error = {};
this.configData.forEach(({ fields }) => {
let findedElem = fields.find((el) => el.key === elem);
this.configData.forEach(({ dataKey, fields }) => {
let findedElem = fields.find(
(el) => dataKey + ":" + el.key === elem
);
if (findedElem) error = findedElem?.errorMessage;
});
this.addErrorNotification(error?.title, error?.message);
});
} else {
let passportFormData = new FormData();
let documentsFormData = new FormData();
form.getValidationComponents().forEach((elem) => {
if (!this.personDataField.includes(elem.name)) {
if (elem.name === "issued_by_date") {
passportFormData.append(
elem.name,
this.convertFormat(elem.modelValue) ?? ""
);
} else passportFormData.append(elem.name, elem.modelValue ?? "");
} else documentsFormData.append(elem.name, elem.modelValue ?? "");
});
this.checkChangePhoto("passport", "photo", passportFormData);
this.checkChangePhoto(
"insurance_number",
"photo_insurance_number",
documentsFormData
);
this.checkChangePhoto(
"tax_identification_number",
"photo_tax_identification_number",
documentsFormData
);
let request = [];
if (!this.approvedPassportData) {
if (!this.initialDocData.passport?.id) {
passportFormData.append("kind", "PASSPORT");
passportFormData.append(
"person",
Object.keys(this.docData).forEach((elem) => {
let formData = new FormData();
form
.getValidationComponents()
.filter(({ name }) => name?.split(":")?.[0] === elem)
.forEach((el) => {
const name = el?.name?.split(":")?.[1];
if (name === "issued_at")
formData.append(name, this.convertFormat(el.modelValue));
else formData.append(name, el.modelValue ?? "");
});
this.checkChangePhoto(elem, "attachments", formData);
if (formData.get("attachments")) {
console.log(elem, "img", formData.get("attachments"));
formData.delete("attachments");
}
if (formData.get("issued_by_org_code")) {
console.log(
"issued_by_org_code",
formData.get("issued_by_org_code")
);
formData.delete("issued_by_org_code");
}
if (
!checkChangeData(
this.initialDocData?.[elem],
this.docData?.[elem]
)
)
return;
formData.append("category", elem);
if (!this.initialDocData?.[elem]?.id) {
formData.append(
"person_id",
this.$store.state.medical?.basicData?.personalData?.id
);
request.push(
this.sendData(
"general/identity_document/create/",
passportFormData
)
);
// for (const key of formData.keys()) {
// console.log(key, formData.get(key));
// }
request.push(this.createData("documents/", formData));
} else {
if (this.checkPhotoDeletion("passport", "photo"))
request.push(
this.deletePhoto(
`general/identity_document/${this.initialDocData.passport?.id}/delete_photo/`
)
);
// for (const key of formData.keys()) {
// console.log(key, formData.get(key));
// }
request.push(
this.sendData(
`general/identity_document/${this.initialDocData.passport?.id}/update/`,
passportFormData
this.updateData(
`documents/${this.initialDocData?.[elem]?.id}`,
formData
)
);
}
}
if (
this.checkPhotoDeletion(
"insurance_number",
"photo_insurance_number"
)
)
request.push(
this.deletePhoto(
`general/person/${this.$store.state.medical?.basicData?.personalData?.id}/delete_photo_insurance_number/`
)
);
if (
this.checkPhotoDeletion(
"tax_identification_number",
"photo_tax_identification_number"
)
)
request.push(
this.deletePhoto(
`general/person/${this.$store.state.medical?.basicData?.personalData?.id}/delete_photo_tax_identification_number/`
)
);
request.push(
this.sendData(
`general/person/${this.$store.state.medical?.basicData?.personalData?.id}/update/`,
documentsFormData
)
);
});
Promise.allSettled(request).then(() => {
this.$store.dispatch("getMedicalCardData");
this.getMedicalCardData({
personId: this.$store.state.medical?.basicData?.personalData?.id,
});
this.isEdit = false;
this.isCheckChange = false;
this.$refs.form?.resetValidation();
@@ -323,9 +287,12 @@ export default {
this.initialDocData[updatedObjId][field]?.photo
);
},
async sendData(url, body) {
async createData(url, body) {
return await fetchWrapper.post(url, body, "formData");
},
async updateData(url, body) {
return await fetchWrapper.patch(url, body, "formData");
},
async deletePhoto(url) {
return await fetchWrapper.del(url);
},
@@ -333,8 +300,11 @@ export default {
addNotification(title + message, title, message, "error", 5000);
},
convertFormat(date) {
return date ? date.split(".").reverse().join("-") : null;
return date ? date.split(".").reverse().join("-") : "";
},
...mapActions({
getMedicalCardData: "getMedicalCardDataByPersonId",
}),
},
watch: {
initialDocData: {
@@ -342,9 +312,7 @@ export default {
immediate: true,
handler(value) {
if (Object.keys(value).length) {
this.docData = JSON.parse(JSON.stringify(this.initialDocData));
this.docData.passport.issued_by_date =
this.initialDocData?.passport?.issued_by_date;
this.docData = JSON.parse(JSON.stringify(value));
} else this.docData = this.initializationData;
},
},
@@ -377,4 +345,6 @@ export default {
cursor: pointer
.delete
background-color: var(--btn-red-color)
.cancel-icon :deep(path)
fill: white
</style>

View File

@@ -1,7 +1,7 @@
<template lang="pug">
.flex.flex-col.gap-y-2.wrapper.h-full.w-full
basic-data-form
contacts-form
//contacts-form
documents-form
insurance-form
</template>

View File

@@ -475,7 +475,7 @@ export const documentForm = [
rules: (val) => ruleLengthValue(val, 6),
},
{
key: "issued_by_org",
key: "issued_by",
label: "Кем выдан",
type: "text",
errorMessage: {
@@ -496,7 +496,7 @@ export const documentForm = [
rules: (val) => ruleLengthValue(val, 7),
},
{
key: "issued_by_date",
key: "issued_at",
label: "Дата выдачи",
type: "date",
rules: (val) => ruleDateValue(val),
@@ -506,7 +506,7 @@ export const documentForm = [
},
},
{
key: "photo",
key: "attachments",
label: "Фото паспорта",
type: "photo",
},
@@ -517,7 +517,7 @@ export const documentForm = [
dataKey: "insurance_number",
fields: [
{
key: "insurance_number",
key: "number",
label: "Номер СНИЛС",
type: "text",
inputMask: "###-###-### ##",
@@ -528,7 +528,7 @@ export const documentForm = [
rules: (val) => ruleOptionalFields(val, 14),
},
{
key: "photo_insurance_number",
key: "attachments",
label: "Фото СНИЛС",
type: "photo",
},
@@ -539,7 +539,7 @@ export const documentForm = [
dataKey: "tax_identification_number",
fields: [
{
key: "tax_identification_number",
key: "number",
label: "Номер ИНН",
type: "text",
inputMask: "############",
@@ -550,7 +550,7 @@ export const documentForm = [
rules: (val) => ruleOptionalFields(val, 12),
},
{
key: "photo_tax_identification_number",
key: "attachments",
label: "Фото ИНН",
type: "photo",
},