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

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 [