Merge branch '4-fix-date-display' into 'master'

Поправила отображение даты (4), undefined в хедере мед.карты (13), создание осмотра (12), поменяла индикацию заполненности медкарты (11),

See merge request astra/astra-frontend!502

src/components/LoggedInLayout.vue

@@ -25,7 +25,7 @@
 import TheHeader from "@/components/TheHeader";
 import TheSidebar from "@/components/TheSidebar";
 import TheNotificationProvider from "@/components/Notifications/TheNotificationProvider";
-
+import { mapState } from "vuex";
 export default {
   name: "LoggedInLayout",
   components: { TheNotificationProvider, TheHeader, TheSidebar },
@@ -33,10 +33,14 @@ export default {
     return {
       isOpenForm: false,
       updatedClients: false,
-      url: "https://astra-dev.dopcore.com/api/store/",
       createdClientId: "",
     };
   },
+  computed: {
+    ...mapState({
+      url: (state) => state.imgUrl,
+    }),
+  },
   methods: {
     openForm() {
       this.isOpenForm = true;

src/pages/newCalendar/components/CalendarHeader.vue

@@ -22,10 +22,10 @@
       )
       base-input.search(
         size="M"
-        :width="350",
+        :width="386",
         v-model="currentWeek",
       )
-        .h-5.w-5.flex.items-center.justify-center
+        .h-5.w-5.flex.items-center.justify-center.ml-3
           q-icon.calendar-icon.text.cursor-pointer(
             :name="calendarVisibility ? 'app:cancel-mini' : 'app:calendar'",
             size="20px",
@@ -36,7 +36,7 @@
               transition-show="scale",
               transition-hide="scale"
               self="top middle",
-              :offset="[140, 8]"
+              :offset="[160, 8]"
             )
               base-calendar(
                 v-model="dates",
@@ -103,7 +103,7 @@ export default {
     currentWeek() {
       return `${this.dates?.from?.format(
         "D MMMM YYYY"
-      )} - ${this.dates?.to?.format("D MMMM YYYY")}`;
+      )} — ${this.dates?.to?.format("D MMMM YYYY")}`;
     },
     ...mapState({
       selectedDates: (state) => state.calendar.selectedDates,

src/pages/newCalendar/components/CalendarRecordCard.vue

@@ -15,14 +15,17 @@
           size="20px",
           @click.stop="changeTimeDisplay(true)"
         )
-      .color-black.pl-4.flex-1.font-semibold.py-6px.relative(
+      .color-black.pl-4.flex-1.font-semibold.py-6px.relative.cursor-default(
         :class="{'pl-6px collapsed-name': expandedTime}"
       ) {{trimPatientName(record?.person?.last_name, record?.person?.first_name, record?.person?.patronymic)}}
         .gradient.absolute.w-5.h-full.right-0(v-if="expandedTime")
-      .info-block.justify-center
+      .info-block.justify-center(v-if="expandedType")
-        img.w-5.h-5(:src="recordingStatus?.icon")
+        q-icon(
-      .last-item.info-block.justify-center(v-if="expandedType")
+          :name="record?.person?.has_medical_card ? 'app:medcard-green' : 'app:medcard'",
-        img.w-5.h-5(:src="medicalСardStatus?.icon")
+          size="20px",
+        )
+      .last-item.info-block.justify-center
+        .recording-status(:class="recordingStatus?.class")
     .body.background-grey.flex.flex-col.justify-between.pl-4.pr-2.color-grey(
       :style="bodyHeight",
       :class="bodyPadding"
@@ -33,8 +36,8 @@
           :key="contact.value",
         )
           q-icon.network-icon(:name="contact.icon", size="16px")
-          .text-xxs {{ contact.value }}
+          .text-xxs.cursor-default {{ contact.value }}
-          .h-6.w-6.color-black.background-dark-grey.text-xxs.rounded.flex.items-center.justify-center(
+          .h-6.w-6.color-black.background-dark-grey.text-xxs.rounded.flex.items-center.justify-center.cursor-default(
             v-if="collapsedDisplayCondition"
           ) +1
 </template>
@@ -80,14 +83,10 @@ export default {
       return !this.bodyClass?.["flex-col"] && !this.expandedType;
     },
     recordingStatus() {
-      return statuses[0].data.find(
+      const status = statuses?.[0]?.data?.find(
         (elem) => elem.value === this.record?.status
       );
-    },
+      return status || statuses?.[0]?.data?.[0];
-    medicalСardStatus() {
-      return statuses[1].data.find(
-        (elem) => elem.value === this.record?.medicalCard?.status
-      );
     },
     startTime() {
       return moment.parseZone(this.record?.start);
@@ -205,4 +204,18 @@ export default {
   fill: var(--font-dark-blue-color)
 .time-icon :deep(path)
   fill: var(--font-grey-color)
+.recording-status
+  border-radius: 9999px
+  width: 17px
+  height: 17px
+.not-accepted
+  border: 1.2px solid var(--font-grey-color)
+.accepted
+  background-color: var(--system-color-green)
+.rejected
+  background-color: var(--system-color-red)
+.reception
+  background-color: var(--btn-blue-color)
+span
+  cursor: default
 </style>

src/pages/newCalendar/utils/calendarConfig.js

@@ -48,10 +48,29 @@ export const statuses = [
         label: "Не принят",
         icon: not_accepted,
         value: "not_accepted",
+        class: "not-accepted",
+      },
+      {
+        id: 1,
+        label: "Принят",
+        icon: accepted,
+        value: "accepted",
+        class: "accepted",
+      },
+      {
+        id: 2,
+        label: "Отказ",
+        icon: rejected,
+        value: "rejected",
+        class: "rejected",
+      },
+      {
+        id: 3,
+        label: "На приеме",
+        icon: reception,
+        value: "reception",
+        class: "reception",
       },
-      { id: 1, label: "Принят", icon: accepted, value: "accepted" },
-      { id: 2, label: "Отказ", icon: rejected, value: "rejected" },
-      { id: 3, label: "На приеме", icon: reception, value: "reception" },
     ],
   },
   {

src/pages/newMedicalCard/components/InitialInspectionProtocol/MedicalProtocolCreateModal.vue

@@ -17,17 +17,17 @@
       )
     .flex.flex-col.gap-y-6px
       span.color-grey.line-height.text-sm.font-semibold Врач
-      .flex.gap-x-2
+      .flex.gap-x-2.items-center
         base-avatar(:size="40")
           img.object-cover.h-full(
-            v-if="userData?.photo",
+            v-if="userData?.avatar",
-            :src="userData?.photo",
+            :src="url + userData?.avatar",
             alt="avatar"
           )
-          span.text-sm.color-blue(v-else) {{ avatar }}
+          span.text-sm.text-dark(v-else) {{ avatar }}
         .flex.flex-col
-          span.text-sm.color-blue.line-height.mb-2px {{ employeeName }}
+          span.text-sm.text-dark.line-height.mb-2px.font-medium {{ employeeName }}
-          span.color-grey.line-height.text-sm {{ userData?.job_title ? userData?.job_title : "Терапевт" }}
+          span.color-grey.line-height.text-xsx.font-medium {{ userData?.job_title ? userData?.job_title : "Терапевт" }}
     .flex.gap-2.mt-8
       base-button(
         type="secondary",
@@ -47,7 +47,7 @@ import BaseAvatar from "@/components/base/BaseAvatar.vue";
 import BaseInputDate from "@/components/base/BaseInputDate.vue";
 import BaseInputTime from "@/components/base/BaseInputTime.vue";
 import * as moment from "moment/moment";
-import { mapGetters, mapActions } from "vuex";
+import { mapGetters, mapActions, mapState } from "vuex";
 import BaseButton from "@/components/base/BaseButton.vue";
 export default {
   name: "MedicalProtocolCreateModal",
@@ -70,6 +70,9 @@ export default {
     };
   },
   computed: {
+    ...mapState({
+      url: (state) => state.imgUrl,
+    }),
     ...mapGetters({
       userData: "getUserData",
     }),

src/pages/newMedicalCard/components/InitialInspectionProtocol/MedicalProtocolsList.vue

@@ -7,7 +7,7 @@
         @click="changeShownCreateModal(true)",
         v-if="createInspection"
       )
-        q-icon(name="app:plus", size="18px")
+        q-icon.plus-icon(name="app:big-plus", size="24px")
     .p-4.rounded.background.list.flex.flex-col.gap-y-6
       .flex
         base-select(
@@ -157,4 +157,6 @@ export default {
   color: var(--default-white)
 .color-grey
   color: var(--font-grey-color)
+.plus-icon :deep(path)
+  fill: white
 </style>

src/pages/newMedicalCard/components/MedicalHeader.vue

@@ -9,7 +9,7 @@
             color="grey",
           )
         q-breadcrumbs-el(:label="routes[routingHistory.state.back]")
-        q-breadcrumbs-el(:label="`${routes[routingHistory.state.current]} #${medicalCardData?.number}`")
+        q-breadcrumbs-el(:label="`Медкарта #${medicalCardData?.number}`")
       q-btn(
         flat,
         text-color="grey",

src/store/index.js

@@ -5,6 +5,7 @@ import calendar from "./modules/calendar";
 export default createStore({
   state: {
     url: "https://astra-dev.dopcore.com",
+    imgUrl: "https://astra-dev.dopcore.com/api/store/",
     routingHistory: window.history,
     userData: {},
   },