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:
Daria Golova
2023-08-22 15:19:28 +03:00
parent 817f881159
commit 4987a3ae09
6 changed files with 146 additions and 169 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/components/base/BaseInputDate.vue
View File

@@ -9,7 +9,7 @@
:readonly="readonly",
:disable="disabled",
mask="##.##.####",
:rules="[checkInput]",
:rules="[(val) => rule ? rule(val) : defaultRule(val)]",
:lazy-rules="lazyRule",
:item-aligned="itemAligned",
no-error-icon,
@@ -60,7 +60,8 @@ export default {
width: Number,
lazyRule: [Boolean, String],
itemAligned: Boolean,
modelValue: Date,
rule: Function,
modelValue: String,
placeholder: String,
disabled: Boolean,
label: String,
@@ -74,32 +75,21 @@ export default {
return {
calendarVisibility: false,
internalDate: null,
//internalValue: null,
};
},
computed: {
value: {
get() {
if (
moment(this.modelValue).isValid() &&
typeof this.modelValue === "object"
) {
this.changeInternalDate(moment(this.modelValue));
return moment(this.modelValue).format("DD.MM.YYYY");
}
if (moment(this.convertFormat(this.modelValue)).isValid()) {
this.changeInternalDate(moment(this.modelValue));
return this.modelValue;
}
this.changeInternalDate(null);
return null;
},
set(value) {
this.$emit(
"update:modelValue",
moment(this.convertFormat(value)).isValid()
? new Date(moment(this.convertFormat(value)))
this.changeInternalDate(
moment(this.convertFormat(this.modelValue)).isValid()
? moment(this.convertFormat(this.modelValue))
: null
);
return this.modelValue;
},
set(value) {
this.$emit("update:modelValue", value);
},
},
sizeVariable() {
@@ -153,8 +143,8 @@ export default {
? date.split(".").reverse().join("-")
: null;
},
checkInput(val) {
return moment(this.convertFormat(val)).isValid();
defaultRule(val) {
return !val || moment(this.convertFormat(val)).isValid();
},
closeCalendar() {
this.calendarVisibility = false;

204
src/pages/newMedicalCard/components/BasicDataForms/DocumentsForm.vue
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"))
// for (const key of formData.keys()) {
// console.log(key, formData.get(key));
// }
request.push(
this.deletePhoto(
`general/identity_document/${this.initialDocData.passport?.id}/delete_photo/`
)
);
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>

2
src/pages/newMedicalCard/components/MedicalBasicDataWrapper.vue
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>

14
src/pages/newMedicalCard/utils/medicalConfig.js
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",
},

7
src/shared/utils/rulesInputs.js
View File

@@ -1,4 +1,5 @@
import * as moment from "moment/moment";
export function ruleNotValue(val, text) {
return !!val || text || false;
}
@@ -21,12 +22,16 @@ export function ruleMaxLength(val, maxLength, text) {
}
export function ruleDateValue(val, text) {
let date = moment(
val && val?.length === 10 ? val.split(".").reverse().join("-") : null
);
return (
(val && !moment(val).isAfter(moment().format("YYYY-MM-DD"))) ||
(date.isValid() && !date.isAfter(moment().format("YYYY-MM-DD"))) ||
text ||
false
);
}
export function ruleNumberInput(val, max, min, text) {
return (val <= max && val >= min) || text || false;
}

50
src/store/modules/medicalCard.js
View File

@@ -214,41 +214,53 @@ const getters = {
};
},
getDocumentsData(state, rootState) {
let person = state.medicalCard?.person;
const passport = person?.identity_document?.find(
(el) => el.kind === "PASSPORT"
const person = state.medicalCard?.person,
passport = person?.documents?.find(
({ category }) => category === "passport"
),
insurance_number = person?.documents?.find(
({ category }) => category === "insurance_number"
),
tax_identification_number = person?.documents?.find(
({ category }) => category === "tax_identification_number"
);
return {
passport: {
id: passport?.id ?? "",
series: passport?.series ?? "",
number: passport?.number ?? "",
issued_by_org: passport?.issued_by_org ?? "",
issued_by_org_code: passport?.issued_by_org_code ?? "",
issued_by_date: passport?.issued_by_date
? new Date(passport?.issued_by_date)
: null,
photo: passport?.photo
category: passport?.category || "",
id: passport?.id || "",
series: passport?.series || "",
number: passport?.number || "",
issued_by: passport?.issued_by || "",
issued_by_org_code: passport?.issued_by_org_code || "",
issued_at: passport?.issued_at
? passport?.issued_at?.split("-")?.reverse()?.join(".")
: "",
attachments: passport?.attachments?.length
? {
photo: rootState.getUrl + passport.photo,
photo: rootState.getUrl + passport?.attachments?.[0],
file: null,
}
: {},
},
insurance_number: {
insurance_number: person?.insurance_number ?? "",
photo_insurance_number: person?.photo_insurance_number
category: insurance_number?.category || "",
id: insurance_number?.id || "",
number: insurance_number?.number || "",
attachments: insurance_number?.attachments?.length
? {
photo: rootState.getUrl + person.photo_insurance_number,
photo: rootState.getUrl + insurance_number.attachments?.[0],
file: null,
}
: {},
},
tax_identification_number: {
tax_identification_number: person?.tax_identification_number ?? "",
photo_tax_identification_number: person?.photo_tax_identification_number
category: tax_identification_number?.category || "",
id: tax_identification_number?.id || "",
number: tax_identification_number?.number || "",
attachments: tax_identification_number?.attachments?.length
? {
photo: rootState.getUrl + person?.photo_tax_identification_number,
photo:
rootState.getUrl + tax_identification_number?.attachments?.[0],
file: null,
}
: {},