Добавил маппинг полей на мед карту, переход на медкарту с календаря, фикс дефолтного аватара

src/pages/newCalendar/components/CalendarRecordPreview.vue

@@ -12,9 +12,9 @@
           //img.h-5.w-5(:src="field?.icon ? this[field?.icon] : ''", v-if="field?.icon")
           span {{ field?.data ? this[field?.data] : "" }}
         .flex.gap-x-1.flex-1(v-if="field?.title === 'Пациент'")
-          .nameplate.rounded.px-4.pt-2.pb-1.flex.gap-x-2.info.flex-1
+          .nameplate.rounded.px-4.pt-2.pb-1.flex.gap-x-2.info.flex-1.items-center
             q-avatar(size="40px")
-              img(:src="memberData?.photo")
+              img(:src="memberData?.photo ? memberData.photo : defaultImg")
             .flex.flex-col.gap-y-2px
               span.color-dark-blue {{ trimName(memberData?.last_name, memberData?.first_name, memberData?.patronymic) }}
               span.color-grey {{ birthday }}
@@ -23,7 +23,8 @@
             no-caps,
             label="Медкарта",
             :style="{'font-weight': 500}"
-            size="14px"
+            size="14px",
+            @click="getMedicalCardData(memberData?.id), $router.push('medical-card')"
           )
             q-icon.arrow.ml-1(name="app:long-arrow", size="20px")
         .flex.gap-x-1.flex-1.h-full(v-if="field?.title === 'Услуги'")
@@ -49,6 +50,8 @@
 import * as moment from "moment/moment";
 import { mapState } from "vuex";
 import { trimName } from "@/pages/newCalendar/utils/calendarFunctions.js";
+import { mapActions } from "vuex";
+import defaultImg from "@/assets/images/person.png";
 import {
   recordPreviewConfig,
   statuses,
@@ -60,6 +63,7 @@ export default {
   },
   data() {
     return {
+      defaultImg,
       previewConfig: recordPreviewConfig,
       trimName: trimName,
     };
@@ -132,6 +136,9 @@ export default {
         }
       });
     },
+    ...mapActions({
+      getMedicalCardData: "getMedicalCardData",
+    }),
   },
 };
 </script>

src/pages/newMedicalCard/TheMedicalCard.vue

@@ -47,8 +47,5 @@ export default {
   computed: mapState({
     medical: (state) => state.medical.medicalCard,
   }),
-  created() {
-    this.$store.dispatch("getMedicalCardData");
-  },
 };
 </script>

src/pages/newMedicalCard/components/MedicalHeader.vue

@@ -143,7 +143,7 @@ export default {
       return this.checkDate("updated_at");
     },
     allergiesList() {
-      return this.patientData?.allergic.map((elem) => ({
+      return this.patientData?.allergic?.map((elem) => ({
         name: elem?.name,
         title: elem?.title,
       }));

src/pages/newMedicalCard/components/MedicalRecords.vue

@@ -2,9 +2,9 @@
   .wrapper.rounded.flex.flex-col
     .header.w-full.h-fit.flex.justify-between.px-6.pt-4.pb-3.text-sm.font-medium
       span Записи
-      span {{ events.length }}
+      span {{ events?.length }}
     .w-full.h-full.py-10px.pl-6.pr-2.items-center 
-      .events.flex.flex-col.pr-3.overflow-y-auto(v-if="events.length")
+      .events.flex.flex-col.pr-3.overflow-y-auto(v-if="events?.length")
         .event.flex.justify-between.items-start.py-10px.w-full.gap-x-2(v-for="(event, index) in getEventsList")
           .flex.flex-col.gap-y-6px
             span.date.font-bold.whitespace-nowrap {{ event.date }}
@@ -37,7 +37,7 @@ export default {
   },
   computed: {
     ...mapState({
-      events: (state) => state.medical.events,
+      events: (state) => state?.medical?.events,
     }),
     getEventsList() {
       return [

src/store/modules/medicalCard.js

@@ -214,7 +214,7 @@ const getters = {
   },
   getDocumentsData(state, rootState) {
     let person = state.medicalCard?.person;
-    const passport = person?.identity_document.find(
+    const passport = person?.identity_document?.find(
       (el) => el.kind === "PASSPORT"
     );
     return {
@@ -447,24 +447,31 @@ const actions = {
         commit("setBenefitData", res.results);
       });
   },
-  getMedicalCardData({ commit }) {
+  createMedicalCard(id) {
-    fetchWrapper
+    fetchWrapper.post("medical_cards", {
-      .get(
+      person_id: id,
-        `medical_card/medical_history/${localStorage.getItem(
+      number: String(Math.floor(1 + Math.random() * (100000000 + 1 - 1))),
-          "medicalId"
+    });
-        )}/detail/`
+    return this.getMedicalCardData(id);
-      )
+  },
-      .then((res) => {
+  getMedicalCardData({ state, commit }, id) {
-        commit("setMedicalCard", res);
+    if (state?.personId === id) return;
+    fetchWrapper.get(`medical_cards/person/${id}`).then((data) => {
+      if (!data) {
+        return this.createMedicalCard(id);
+      }
+      state.personId = id;
+      commit("setMedicalCard", data);
       commit("setBasicData");
       commit("setContactsData");
       commit("setDocumentsData");
       commit("setAllergiesData");
       commit("setConfidantData");
       commit("setHealthStateData");
-        commit("setEventsPersonData", res?.person?.id);
+      commit("setEventsPersonData", data?.person?.id);
     });
   },
+
   getPersonsFiltredList() {
     return fetchWrapper
       .get(