Merge branch 'ASTRA-69' into 'master'

Resolve ASTRA-69

See merge request andrusyakka/urban-couscous!351

src/pages/newMedicalCard/components/BasicDataForms/ContactsForm.vue

@@ -219,13 +219,13 @@ export default {
   width: 302px
 .form-wrap
   display: grid
-  grid-template-columns: repeat(3, auto)
+  grid-template-columns: repeat(3, 1fr)
   grid-template-rows: repeat(1, auto)
   @media(max-width: 1900px)
-    grid-template-columns: repeat(2, auto)
+    grid-template-columns: repeat(2, 1fr)
     grid-template-rows: repeat(2, auto)
   @media(max-width: 1320px)
-    grid-template-columns: repeat(1, auto)
+    grid-template-columns: repeat(1, 1fr)
     grid-template-rows: repeat(3, auto)
 .network-field
   background-color: var(--bg-light-grey)

src/pages/newMedicalCard/components/MedicalRecords.vue

@@ -3,16 +3,23 @@
     .header.w-full.h-fit.flex.justify-between.px-6.pt-4.pb-3.text-sm.font-medium
       span Записи
       span {{ events.length }}
-    .w-full.h-full.py-10px.pl-6.pr-2 
-      .events.flex.flex-col.pr-3.overflow-y-auto
-        .event.flex.justify-between.items-start.py-10px(v-for="(event, index) in getEventsList")
+    .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")
+        .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 }}
             .time.flex.items-center.gap-x-6px
               q-icon(name="app:time" size="13px")
               span.font-medium.text-smm.whitespace-nowrap {{ `${event.startTime} - ${event.endTime}` }}
-          .flex.gap-x-1.text-smm.font-medium
-            span {{ event.status }}
+          .flex.gap-x-1.text-smm.font-medium.items-center
+            q-icon(
+              :name="event.status === 'PLANNED' ? 'radio_button_unchecked' : 'radio_button_checked'"
+              :style="{'color': statusMap[event.status].color}"
+              size="13px"
+            )
+            span.whitespace-nowrap(:style="{'color': statusMap[event.status].color}") {{ statusMap[event.status].title }}
+      .flex.items-center.justify-center.w-full(v-else :style={'height': '124px'})
+        span.text-lg.font-medium(:style="{'color': 'var(--font-grey-color)'}") Нет записей
 </template>
 
 <script>
@@ -23,6 +30,11 @@ import { mapEventStatus } from "@/pages/newMedicalCard/utils/medicalConfig";
 
 export default {
   name: "MedicalRecords",
+  data() {
+    return {
+      statusMap: mapEventStatus,
+    };
+  },
   computed: {
     ...mapState({
       events: (state) => state.medical.events,
@@ -33,13 +45,12 @@ export default {
           const start = moment(el.event.start);
           const end = moment(el.event.end);
           return {
-            ...el,
+            ...el.event,
             date: `${start.format("D")} ${getChangeMonth(
               start.format("MMMM")
             )} (${start.format("dd")})`,
             startTime: start.format("HH:mm"),
             endTime: end.format("HH:mm"),
-            status: mapEventStatus[el.event.status],
           };
         }),
       ];
@@ -52,12 +63,15 @@ export default {
 .wrapper
   width: 16.8%
   height: 18.7%
+  min-height: 190px
+  min-width: 275px
   background-color: var(--default-white)
 .header
   border-bottom: 1px solid var(--border-light-grey-color)
   color: var(--font-grey-color)
 .events
   height: 124px
+  min-width: 245px
   &::-webkit-scrollbar
     width: 4px
 .event

src/pages/newMedicalCard/utils/medicalConfig.js

@@ -544,8 +544,20 @@ export const documentForm = [
 ];
 
 export const mapEventStatus = {
-  COMPLETED: "Принят",
-  CANCELED: "Отказ",
-  RECEPTION: "На приеме",
-  PLANNED: "Не принят",
+  COMPLETED: {
+    title: "Принят",
+    color: "#55CD76",
+  },
+  CANCELED: {
+    title: "Отказ",
+    color: "#FF6F6F",
+  },
+  RECEPTION: {
+    title: "На приеме",
+    color: "#FFC75B",
+  },
+  PLANNED: {
+    title: "Не принят",
+    color: "#9294A7",
+  },
 };

src/store/modules/medicalCard.js

@@ -5,7 +5,6 @@ import { getConfidantObject } from "@/pages/newMedicalCard/utils/gettersObjects"
 const state = () => ({
   medicalCard: {},
   confidantData: [],
-  personFiltredList: [],
   contactsData: {
     phones: [],
     emails: [],
@@ -362,9 +361,6 @@ const mutations = {
   setConfidantData(state) {
     state.confidantData = this.getters.getConfidantData;
   },
-  setPersonFiltredList(state, persons) {
-    state.personFiltredList = persons;
-  },
   setEventsPersonData(state, id) {
     fetchWrapper.get(`general/person/${id}/detail/`).then((res) => {
       state.events = res.events;