WIP Добавил валидации на формах мед карты и отправку данных с формы

src/components/base/BaseDetailInfo.vue

@@ -37,9 +37,9 @@ export default {
   watch: {
     data() {
       Object.values(this.data)
-        .map((el) => (el ? el : undefined))
+        .map((el) => (el !== undefined && el !== null ? el : undefined))
         .forEach((el) => {
-          if (el) {
+          if (el !== undefined) {
             this.isNoData = false;
           }
         });

src/components/base/BaseDetailInput.vue

@@ -3,10 +3,10 @@
     span.title-section.font-semibold.text-xs(v-if="field.title" ) {{field.title}}
     .flex.items-center(v-if="field.type === 'text' || field.type === 'textarea'" class="gap-x-2.5")
       span.w-4.icon(v-if="field.icon" :class="field.icon")
-      base-input(v-model="data[field.label]" :with-icon="field.copy" outlined)
+      base-input(v-model="data[field.label]" :mask="mask" :with-icon="field.copy" outlined)
         .flex.items-center(v-if="field.copy && data[field.label]")
           .copy.icon-copy.cursor-pointer(@click="() => copyValue(data[field.label])")
-    base-input(v-if="field.type === 'date'" type="date" v-model="data[field.label]" outlined)
+    base-input(v-if="field.type === 'date'" :mask="mask" type="date" v-model="data[field.label]" outlined)
     base-radio-buttons-group(v-if="field.type === 'radio'" v-model="data[field.label]" :items="field.items" size="xs" :column-gap="14"  direction-column)
 </template>
 
@@ -20,6 +20,7 @@ export default {
     value: String,
     field: Object,
     data: Object,
+    mask: String,
   },
   data() {
     return {

src/pages/medicalCard/components/MedicalCardWrapper.vue

@@ -13,6 +13,7 @@
               v-for="field in configData.identity_document.fields"
               :field="field"
               :data="medicalDataInit.identity_document"
+              :mask="field.mask"
               )
           .flex.flex-col.gap-30px
             base-detail-info(
@@ -45,6 +46,7 @@
                 v-for="field in configData.snils.fields"
                 :field="field"
                 :data="medicalDataInit.snils"
+                :mask="field.mask"
                 )
             base-detail-info(
               :title="configData.policy.title"
@@ -55,6 +57,7 @@
                 v-for="field in configData.policy.fields"
                 :field="field"
                 :data="medicalDataInit.policy"
+                :mask="field.mask"
                 )
           base-detail-info(
             :title="configData.policy_organization.title"
@@ -76,10 +79,12 @@
                 v-for="field in configData.additional.fields"
                 :field="field"
                 :data="medicalDataInit.additional"
+                :mask="field.mask"
                 )
             base-detail-info(
               :title="configData.agreement_form.title"
               :height="configData.agreement_form.height"
+              :data="medicalDataInit.agreement_form"
               direction-row
               )
               base-detail-input(
@@ -92,9 +97,10 @@
           .flex.flex-col.gap-y-2(v-for="(key, index) in Object.keys(dentalIndications)")
             span.font-bold.text-xsx {{`${index+1}. ${configData.dental_indications[key]}`}}
             medical-dental-formula(v-if="key === 'dental_formula'" :formula-data="dentalIndications[key]")
-            base-input(v-model="dentalIndications[key]", outlined, v-else)
+            base-input(v-model="dentalIndications[key]" outlined v-else)
         .flex.justify-center
           q-btn(
+            @click="validateFormCard",
             color="primary",
             label="Сохранить",
             padding="8px 24px",
@@ -109,6 +115,8 @@ import BaseDetailInput from "@/components/base/BaseDetailInput.vue";
 import BaseDetailInfo from "@/components/base/BaseDetailInfo.vue";
 import { formulaDataMap } from "@/pages/medicalCard/utils/medicalConfig";
 import { medicalDetailConfig } from "@/pages/medicalCard/utils/medicalConfig";
+import { mobilityMap } from "@/pages/medicalCard/utils/medicalConfig";
+import { createEntryMedicalCard } from "@/pages/medicalCard/utils/wrapperMedicalCard";
 import { fetchWrapper } from "@/shared/fetchWrapper";
 import BaseInput from "@/components/base/BaseInput.vue";
 import ClientDetailInput from "@/pages/clients/components/ClientDetailInput.vue";
@@ -124,6 +132,7 @@ export default {
   },
   data() {
     return {
+      medicalCardData: undefined,
       numberCard: "",
       configData: medicalDetailConfig,
       medicalDataInit: {
@@ -152,8 +161,6 @@ export default {
         additional: {
           name_confidant: null,
           phone_confidant: null,
-        },
-        benefit_code: {
           benefit_code: null,
         },
         agreement_form: {
@@ -186,8 +193,31 @@ export default {
     };
   },
   methods: {
+    validateFormCard() {
+      Object.keys(this.dentalIndications).forEach((key) => {
+        if (key === "dental_formula") {
+          const notEmptyEntries =
+            this.dentalIndications.dental_formula[0].columns
+              .concat(this.dentalIndications.dental_formula[1].columns)
+              .filter((el) => el.dental_condition && el.tooth_mobility);
+          createEntryMedicalCard(
+            notEmptyEntries,
+            key,
+            localStorage.getItem("medicalId")
+          );
+        }
+        if (this.dentalIndications[key] && !this.medicalCardData[key].length) {
+          createEntryMedicalCard(
+            this.dentalIndications[key],
+            key,
+            localStorage.getItem("medicalId")
+          );
+        }
+      });
+    },
     saveDataMedical(data) {
-      this.numberCard = data?.number && data.number;
+      this.medicalCardData = data;
+      this.numberCard = data?.number;
       const confidant = data ? data["confidant"] : undefined;
       const pass = data
         ? data?.person?.identity_document?.find((el) => el.kind === "PASSPORT")
@@ -210,12 +240,14 @@ export default {
           )?.join_adress,
         },
         snils: {
-          ...data?.person["insurance_number"],
+          insurance_number: data?.person["insurance_number"],
         },
         policy: {
+          ...this.medicalDataInit.policy,
           ...data?.person["insurance_policy"][0],
         },
         policy_organization: {
+          ...this.medicalDataInit.policy_organization,
           ...data?.person["insurance_policy"][0],
         },
         additional: {
@@ -225,8 +257,6 @@ export default {
           phone_confidant: confidant?.contacts?.find(
             (el) => el?.kind === "PHONE"
           )?.username,
-        },
-        benefit_code: {
           benefit_code: data?.benefit_code,
         },
         agreement_form: {
@@ -234,6 +264,59 @@ export default {
           agreement_date: null,
         },
       };
+      Object.keys(this.dentalIndications).forEach((key) => {
+        if (key === "dental_formula" && data[key].length) {
+          data[key].forEach((tooth) => {
+            if (tooth.dental_condition && tooth.tooth_mobility) {
+              if (17 < tooth.tooth_number < 29) {
+                this.dentalIndications.dental_formula[0] = {
+                  ...this.dentalIndications.dental_formula[0],
+                  columns: this.dentalIndications.dental_formula[0].columns.map(
+                    (el) => {
+                      if (el.tooth_number === tooth.tooth_number) {
+                        return {
+                          ...tooth,
+                          tooth_mobility: mobilityMap.find(
+                            (el) => el.label === tooth.tooth_mobility
+                          ),
+                        };
+                      }
+                      return el;
+                    }
+                  ),
+                };
+              }
+              if (37 < tooth.tooth_number < 49) {
+                this.dentalIndications.dental_formula[1] = {
+                  ...this.dentalIndications.dental_formula[1],
+                  columns: this.dentalIndications.dental_formula[1].columns.map(
+                    (el) => {
+                      if (el.tooth_number === tooth.tooth_number) {
+                        return {
+                          ...tooth,
+                          tooth_mobility: mobilityMap.find(
+                            (el) => el.label === tooth.tooth_mobility
+                          ),
+                        };
+                      }
+                      return el;
+                    }
+                  ),
+                };
+              }
+            }
+          });
+        } else {
+          this.dentalIndications[key] = data[key]?.length
+            ? data[key]
+                .map((el) => {
+                  let value = el.title || el["index_calculation"];
+                  return value || "";
+                })
+                .join("")
+            : this.dentalIndications[key];
+        }
+      });
     },
     async fetchDataMedicalCard() {
       await fetchWrapper

src/pages/medicalCard/components/MedicalFormulaTable.vue

@@ -15,6 +15,7 @@
 import { ruleDentalCondition } from "@/assets/rules/rulesInput";
 import BaseInput from "@/components/base/BaseInput.vue";
 import BaseSelect from "@/components/base/BaseSelect.vue";
+import { mobilityMap } from "@/pages/medicalCard/utils/medicalConfig";
 export default {
   name: "MedicalFormulaTable",
   components: { BaseInput, BaseSelect },
@@ -26,11 +27,7 @@ export default {
   data() {
     return {
       ruleCondition: ruleDentalCondition,
-      mobilityMap: [
+      mobilityMap: mobilityMap,
-        { id: 1, label: "I" },
-        { id: 2, label: "II" },
-        { id: 3, label: "III" },
-      ],
     };
   },
 };

src/pages/medicalCard/utils/medicalConfig.js

@@ -31,6 +31,7 @@ export const medicalDetailConfig = {
         label: "number_series",
         title: "Серия и номер",
         type: "text",
+        mask: "#### ######",
         copy: true,
       },
       {
@@ -42,6 +43,7 @@ export const medicalDetailConfig = {
         label: "issued_by_org_code",
         title: "Код подразделения",
         type: "text",
+        mask: "###-###",
       },
       {
         label: "issued_by_date",
@@ -80,6 +82,7 @@ export const medicalDetailConfig = {
         label: "insurance_number",
         title: "Номер",
         type: "text",
+        mask: "###-###-### ##",
         copy: true,
       },
     ],
@@ -92,11 +95,13 @@ export const medicalDetailConfig = {
         label: "series",
         title: "Серия",
         type: "text",
+        mask: "####",
       },
       {
         label: "number",
         title: "Номер",
         type: "text",
+        mask: "#######",
       },
     ],
   },
@@ -126,11 +131,13 @@ export const medicalDetailConfig = {
         label: "phone_confidant",
         title: "",
         type: "text",
+        mask: "+7 (###) ###-##-##",
       },
       {
         label: "benefit_code",
         title: "Код категории льготы",
         type: "text",
+        mask: "###",
       },
     ],
   },
@@ -234,6 +241,12 @@ export const dentalСonditionMap = [
   },
 ];
 
+export const mobilityMap = [
+  { id: 1, label: "I" },
+  { id: 2, label: "II" },
+  { id: 3, label: "III" },
+];
+
 export const formulaDataMap = [
   {
     name: "upperJaw",
@@ -253,82 +266,82 @@ export const formulaDataMap = [
     ],
     columns: [
       {
-        tooth_number: "18",
+        tooth_number: 18,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "17",
+        tooth_number: 17,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "16",
+        tooth_number: 16,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "15",
+        tooth_number: 15,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "14",
+        tooth_number: 14,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "13",
+        tooth_number: 13,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "12",
+        tooth_number: 12,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "11",
+        tooth_number: 11,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "21",
+        tooth_number: 21,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "22",
+        tooth_number: 22,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "23",
+        tooth_number: 23,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "24",
+        tooth_number: 24,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "25",
+        tooth_number: 25,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "26",
+        tooth_number: 26,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "27",
+        tooth_number: 27,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "28",
+        tooth_number: 28,
         dental_condition: "",
         tooth_mobility: "",
       },
@@ -352,82 +365,82 @@ export const formulaDataMap = [
     ],
     columns: [
       {
-        tooth_number: "48",
+        tooth_number: 48,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "47",
+        tooth_number: 47,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "46",
+        tooth_number: 46,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "45",
+        tooth_number: 45,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "44",
+        tooth_number: 44,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "43",
+        tooth_number: 43,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "42",
+        tooth_number: 42,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "41",
+        tooth_number: 41,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "31",
+        tooth_number: 31,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "32",
+        tooth_number: 32,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "33",
+        tooth_number: 33,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "34",
+        tooth_number: 34,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "35",
+        tooth_number: 35,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "36",
+        tooth_number: 36,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "37",
+        tooth_number: 37,
         dental_condition: "",
         tooth_mobility: "",
       },
       {
-        tooth_number: "38",
+        tooth_number: 38,
         dental_condition: "",
         tooth_mobility: "",
       },

src/pages/medicalCard/utils/wrapperMedicalCard.js

@@ -0,0 +1,72 @@
+import { fetchWrapper } from "@/shared/fetchWrapper";
+export async function createEntryMedicalCard(entry, key, id) {
+  const url = `medical_card/${key}/create/`;
+  switch (key) {
+    case "complaints":
+    case "medications_taken":
+    case "disease_progress":
+    case "visual_examination":
+    case "diagnostic_findings":
+    case "survey_plan":
+    case "treatment_plan":
+    case "treatment_protocol":
+      return fetchWrapper.post(url, {
+        title: entry,
+        description: "string",
+        medical_history: id,
+      });
+    case "thermometry":
+      return fetchWrapper.post(url, {
+        title: entry,
+        temperature: Number(entry),
+        medical_history: id,
+      });
+    case "tonometry":
+      return fetchWrapper.post(url, {
+        title: entry,
+        sys: Number(entry),
+        dia: Number(entry),
+        pul: Number(entry),
+        medical_history: id,
+      });
+    case "dental_bite":
+      return fetchWrapper.post(url, {
+        custom: entry,
+        physiological: entry,
+        abnormal: entry,
+        medical_history: id,
+      });
+    case "hygiene_index":
+      return fetchWrapper.post(url, {
+        number_teeth: Number(entry),
+        dental_plaque: Number(entry),
+        calculus_plaque: Number(entry),
+        medical_history: id,
+      });
+    case "dmf_index":
+      return fetchWrapper.post(url, {
+        caries: Number(entry),
+        filling: Number(entry),
+        remote: Number(entry),
+        medical_history: id,
+      });
+    case "clinical_diagnosis":
+      return fetchWrapper.post(url, {
+        title: entry,
+        description: "string",
+        medical_history: id,
+        icd10: id,
+      });
+    case "dental_formula":
+      return Promise.all(
+        entry.map((el) =>
+          fetchWrapper.post(url, {
+            ...el,
+            tooth_mobility: el.tooth_mobility ? el.tooth_mobility.label : "",
+            tooth_number: el.tooth_number,
+            medical_history: id,
+          })
+        )
+      );
+  }
+}