Merge branch 'ASTRA-48' into 'master'
WIP Сделана отправка данных See merge request andrusyakka/urban-couscous!321
This commit is contained in:
@@ -9,9 +9,10 @@
|
|||||||
:outlined="outlined",
|
:outlined="outlined",
|
||||||
:dense="dense",
|
:dense="dense",
|
||||||
:type="type",
|
:type="type",
|
||||||
|
:readonly="readonly",
|
||||||
|
:disable="disabled",
|
||||||
:filled="filled",
|
:filled="filled",
|
||||||
:bg-color="filled || standout ? '' : 'white'",
|
:bg-color="filled || standout ? '' : 'white'",
|
||||||
:disable="disabled",
|
|
||||||
:rules="rule",
|
:rules="rule",
|
||||||
:lazy-rules="lazyRule",
|
:lazy-rules="lazyRule",
|
||||||
:item-aligned="itemAligned",
|
:item-aligned="itemAligned",
|
||||||
@@ -83,6 +84,7 @@ export default {
|
|||||||
placeholder: String,
|
placeholder: String,
|
||||||
disabled: Boolean,
|
disabled: Boolean,
|
||||||
label: String,
|
label: String,
|
||||||
|
readonly: Boolean,
|
||||||
},
|
},
|
||||||
emits: ["update:modelValue"],
|
emits: ["update:modelValue"],
|
||||||
computed: {
|
computed: {
|
||||||
@@ -117,3 +119,9 @@ export default {
|
|||||||
opacity: 0
|
opacity: 0
|
||||||
cursor: pointer
|
cursor: pointer
|
||||||
</style>
|
</style>
|
||||||
|
<style lang="sass">
|
||||||
|
.q-field--standout.q-field--readonly .q-field__control:before
|
||||||
|
border: none !important
|
||||||
|
.q-field--standout .q-field__control
|
||||||
|
background: var(--bg-light-grey) !important
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -34,15 +34,19 @@
|
|||||||
v-else,
|
v-else,
|
||||||
v-model="docData[data.dataKey][field.key]",
|
v-model="docData[data.dataKey][field.key]",
|
||||||
@update:model-value="checkChangeDocData"
|
@update:model-value="checkChangeDocData"
|
||||||
:disabled="!isEdit",
|
:readonly="!isEdit",
|
||||||
:type="field.type",
|
:type="field.type",
|
||||||
:width="278",
|
textColor="var(--font-dark-blue-color)"
|
||||||
|
:width="checkCopiedFields(field.key) ? 260 : 278",
|
||||||
:standout="!isEdit",
|
:standout="!isEdit",
|
||||||
:outlined="isEdit",
|
:outlined="isEdit",
|
||||||
:rule="field.rules",
|
:rule="field.rules",
|
||||||
text-color="black",
|
|
||||||
:mask="field?.inputMask"
|
:mask="field?.inputMask"
|
||||||
)
|
)
|
||||||
|
.icon-copy.my-auto.text-lg.label-field(
|
||||||
|
v-if="checkCopiedFields(field.key)",
|
||||||
|
@click="copyValue(docData[data.dataKey][field.key])"
|
||||||
|
)
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
@@ -55,6 +59,8 @@ import BaseUploadPhoto from "@/components/base/BaseUploadPhoto.vue";
|
|||||||
import { checkChangeData } from "@/shared/utils/changesObjects.js";
|
import { checkChangeData } from "@/shared/utils/changesObjects.js";
|
||||||
import { fetchWrapper } from "@/shared/fetchWrapper.js";
|
import { fetchWrapper } from "@/shared/fetchWrapper.js";
|
||||||
import * as moment from "moment/moment";
|
import * as moment from "moment/moment";
|
||||||
|
import TheNotificationProvider from "@/components/Notifications/TheNotificationProvider";
|
||||||
|
import { addNotification } from "@/components/Notifications/notificationContext";
|
||||||
export default {
|
export default {
|
||||||
name: "DocumentsForm",
|
name: "DocumentsForm",
|
||||||
components: {
|
components: {
|
||||||
@@ -63,6 +69,7 @@ export default {
|
|||||||
BaseAvatar,
|
BaseAvatar,
|
||||||
BaseModal,
|
BaseModal,
|
||||||
BaseUploadPhoto,
|
BaseUploadPhoto,
|
||||||
|
TheNotificationProvider,
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@@ -71,6 +78,12 @@ export default {
|
|||||||
docData: null,
|
docData: null,
|
||||||
isCheckChange: false,
|
isCheckChange: false,
|
||||||
isLoadingData: true,
|
isLoadingData: true,
|
||||||
|
copiedFields: [
|
||||||
|
"series",
|
||||||
|
"number",
|
||||||
|
"insurance_number",
|
||||||
|
"tax_identification_number",
|
||||||
|
],
|
||||||
initializationData: {
|
initializationData: {
|
||||||
passport: {
|
passport: {
|
||||||
id: null,
|
id: null,
|
||||||
@@ -100,6 +113,12 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
copyValue(text) {
|
||||||
|
navigator.clipboard.writeText(text);
|
||||||
|
},
|
||||||
|
checkCopiedFields(key) {
|
||||||
|
return !this.isEdit && this.copiedFields.some((elem) => elem === key);
|
||||||
|
},
|
||||||
cancelEdit() {
|
cancelEdit() {
|
||||||
this.docData = JSON.parse(JSON.stringify(this.initialDocData));
|
this.docData = JSON.parse(JSON.stringify(this.initialDocData));
|
||||||
this.docData.passport.issued_by_date =
|
this.docData.passport.issued_by_date =
|
||||||
@@ -125,71 +144,33 @@ export default {
|
|||||||
this.updateDocData();
|
this.updateDocData();
|
||||||
},
|
},
|
||||||
updateDocData() {
|
updateDocData() {
|
||||||
let {
|
let { insurance_number: insurance, tax_identification_number: tax } =
|
||||||
passport,
|
this.docData;
|
||||||
insurance_number: insurance,
|
let passport = JSON.parse(JSON.stringify(this.docData.passport));
|
||||||
tax_identification_number: tax,
|
passport.issued_by_date = moment(passport.issued_by_date).format(
|
||||||
} = this.docData;
|
"YYYY-MM-DD"
|
||||||
|
);
|
||||||
|
passport.photo = this.docData.passport.photo;
|
||||||
|
let initData = JSON.parse(JSON.stringify(this.initialDocData));
|
||||||
|
initData.passport.issued_by_date = moment(
|
||||||
|
initData.passport.issued_by_date
|
||||||
|
).format("YYYY-MM-DD");
|
||||||
let documentsFormData = new FormData();
|
let documentsFormData = new FormData();
|
||||||
let passportFormData = new FormData();
|
let passportFormData = new FormData();
|
||||||
|
this.fillResultData(initData, passport, "passport", passportFormData);
|
||||||
|
this.fillResultData(
|
||||||
|
initData,
|
||||||
|
insurance,
|
||||||
|
"insurance_number",
|
||||||
|
documentsFormData
|
||||||
|
);
|
||||||
|
this.fillResultData(
|
||||||
|
initData,
|
||||||
|
tax,
|
||||||
|
"tax_identification_number",
|
||||||
|
documentsFormData
|
||||||
|
);
|
||||||
let request = [];
|
let request = [];
|
||||||
if (insurance?.insurance_number)
|
|
||||||
documentsFormData.append(
|
|
||||||
"insurance_number",
|
|
||||||
insurance?.insurance_number
|
|
||||||
);
|
|
||||||
if (tax?.tax_identification_number)
|
|
||||||
documentsFormData.append(
|
|
||||||
"tax_identification_number",
|
|
||||||
tax?.tax_identification_number
|
|
||||||
);
|
|
||||||
if (
|
|
||||||
insurance?.photo_insurance_number?.file &&
|
|
||||||
insurance?.photo_insurance_number?.photo !==
|
|
||||||
this.initialDocData.insurance_number?.photo_insurance_number.photo
|
|
||||||
)
|
|
||||||
documentsFormData.append(
|
|
||||||
"photo_insurance_number",
|
|
||||||
insurance?.photo_insurance_number?.file[0]
|
|
||||||
);
|
|
||||||
if (
|
|
||||||
tax?.photo_tax_identification_number?.file &&
|
|
||||||
tax?.photo_tax_identification_number.photo !==
|
|
||||||
this.initialDocData.tax_identification_number
|
|
||||||
?.photo_tax_identification_number.photo
|
|
||||||
)
|
|
||||||
documentsFormData.append(
|
|
||||||
"photo_tax_identification_number",
|
|
||||||
tax?.photo_tax_identification_number?.file[0]
|
|
||||||
);
|
|
||||||
Object.keys(passport).forEach((key) => {
|
|
||||||
if (key === "issued_by_date" && passport[key]) {
|
|
||||||
passportFormData.append(
|
|
||||||
"issued_by_date",
|
|
||||||
moment(passport.issued_by_date).format("YYYY-MM-DD")
|
|
||||||
);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (
|
|
||||||
key === "photo" &&
|
|
||||||
passport?.photo?.file &&
|
|
||||||
this.checkChangeField(
|
|
||||||
this.initialDocData?.passport?.photo,
|
|
||||||
passport?.photo,
|
|
||||||
"photo"
|
|
||||||
)
|
|
||||||
) {
|
|
||||||
passportFormData.append(key, passport[key]?.file[0]);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (
|
|
||||||
key !== "photo" &&
|
|
||||||
this.checkChangeField(this.initialDocData.passport, passport, key)
|
|
||||||
) {
|
|
||||||
passportFormData.append(key, passport[key]);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
if (!passport.id)
|
if (!passport.id)
|
||||||
request.push(
|
request.push(
|
||||||
this.sendData("general/identity_document/create/", passportFormData)
|
this.sendData("general/identity_document/create/", passportFormData)
|
||||||
@@ -213,12 +194,57 @@ export default {
|
|||||||
this.isCheckChange = false;
|
this.isCheckChange = false;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
fillResultData(initObj, updateObj, id, formData) {
|
||||||
|
Object.keys(updateObj).forEach((key) => {
|
||||||
|
let config = this.configData
|
||||||
|
.find(({ dataKey }) => dataKey === id)
|
||||||
|
?.fields.find((el) => el.key === key);
|
||||||
|
if (
|
||||||
|
config?.type === "photo" &&
|
||||||
|
this.checkChengePhoto(initObj[id], updateObj, key)
|
||||||
|
) {
|
||||||
|
if (config.inputMask && !config.checkField(updateObj[key])) {
|
||||||
|
this.addErrorNotification(
|
||||||
|
config.errorMessage.title,
|
||||||
|
config.errorMessage.message
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
formData.append(key, updateObj[key]?.file[0]);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (
|
||||||
|
config?.type !== "photo" &&
|
||||||
|
this.checkChangeField(initObj[id], updateObj, key)
|
||||||
|
) {
|
||||||
|
if (config.inputMask && !config.checkField(updateObj[key])) {
|
||||||
|
this.addErrorNotification(
|
||||||
|
config.errorMessage.title,
|
||||||
|
config.errorMessage.message
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
formData.append(key, updateObj[key]);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
},
|
||||||
checkChangeField(initObj, updatedObj, field) {
|
checkChangeField(initObj, updatedObj, field) {
|
||||||
return initObj[field] !== updatedObj[field];
|
return updatedObj[field] && initObj[field] !== updatedObj[field];
|
||||||
|
},
|
||||||
|
checkChengePhoto(initObj, updatedObj, field) {
|
||||||
|
return (
|
||||||
|
updatedObj[field]?.file &&
|
||||||
|
initObj[field]?.photo !== updatedObj[field]?.photo
|
||||||
|
);
|
||||||
},
|
},
|
||||||
async sendData(url, body) {
|
async sendData(url, body) {
|
||||||
return await fetchWrapper.post(url, body, "formData");
|
return await fetchWrapper.post(url, body, "formData");
|
||||||
},
|
},
|
||||||
|
addErrorNotification(title, message) {
|
||||||
|
addNotification(title + message, title, message, "error", 5000);
|
||||||
|
},
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
initialDocData: {
|
initialDocData: {
|
||||||
@@ -252,4 +278,6 @@ export default {
|
|||||||
color: var(--btn-blue-color)
|
color: var(--btn-blue-color)
|
||||||
.photo-field
|
.photo-field
|
||||||
min-width: 302px
|
min-width: 302px
|
||||||
|
.icon-copy .cursor
|
||||||
|
cursor: pointer !important
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -322,12 +322,26 @@ export const documentForm = [
|
|||||||
label: "Серия",
|
label: "Серия",
|
||||||
type: "text",
|
type: "text",
|
||||||
inputMask: "####",
|
inputMask: "####",
|
||||||
|
checkField: (field) => {
|
||||||
|
return field.length === 4;
|
||||||
|
},
|
||||||
|
errorMessage: {
|
||||||
|
title: "Ошибка валидации",
|
||||||
|
message: "Серия паспорта заполнена неправильно",
|
||||||
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: "number",
|
key: "number",
|
||||||
label: "Номер",
|
label: "Номер",
|
||||||
type: "text",
|
type: "text",
|
||||||
inputMask: "######",
|
inputMask: "######",
|
||||||
|
checkField: (field) => {
|
||||||
|
return field.length === 6;
|
||||||
|
},
|
||||||
|
errorMessage: {
|
||||||
|
title: "Ошибка валидации",
|
||||||
|
message: "Номер паспорта заполнен неправильно",
|
||||||
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: "issued_by_org",
|
key: "issued_by_org",
|
||||||
@@ -339,6 +353,13 @@ export const documentForm = [
|
|||||||
label: "Код подраздел.",
|
label: "Код подраздел.",
|
||||||
type: "text",
|
type: "text",
|
||||||
inputMask: "###-###",
|
inputMask: "###-###",
|
||||||
|
checkField: (field) => {
|
||||||
|
return field.length === 7;
|
||||||
|
},
|
||||||
|
errorMessage: {
|
||||||
|
title: "Ошибка валидации",
|
||||||
|
message: "Код подразделения заполнен неправильно",
|
||||||
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: "issued_by_date",
|
key: "issued_by_date",
|
||||||
@@ -361,6 +382,13 @@ export const documentForm = [
|
|||||||
label: "Номер СНИЛС",
|
label: "Номер СНИЛС",
|
||||||
type: "text",
|
type: "text",
|
||||||
inputMask: "###-###-### ##",
|
inputMask: "###-###-### ##",
|
||||||
|
checkField: (field) => {
|
||||||
|
return field.length === 14;
|
||||||
|
},
|
||||||
|
errorMessage: {
|
||||||
|
title: "Ошибка валидации",
|
||||||
|
message: "СНИЛС заполнен неправильно",
|
||||||
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: "photo_insurance_number",
|
key: "photo_insurance_number",
|
||||||
@@ -378,6 +406,13 @@ export const documentForm = [
|
|||||||
label: "Номер ИНН",
|
label: "Номер ИНН",
|
||||||
type: "text",
|
type: "text",
|
||||||
inputMask: "############",
|
inputMask: "############",
|
||||||
|
checkField: (field) => {
|
||||||
|
return field.length === 12;
|
||||||
|
},
|
||||||
|
errorMessage: {
|
||||||
|
title: "Ошибка валидации",
|
||||||
|
message: "ИНН заполнен неправильно",
|
||||||
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: "photo_tax_identification_number",
|
key: "photo_tax_identification_number",
|
||||||
|
|||||||
Reference in New Issue
Block a user