Merge branch 'dd-1' into 'master'

поиск карт

See merge request astra/astra-frontend!513

src/pages/medcards/components/MedicalCardSearch.vue

@@ -21,7 +21,7 @@ export default {
       medicalCards: [],
       dataStatus: {
         title: "no data",
-        message: "Введите номер карты или ФИО пациента",
+        message: "Введите данные Пациента для поиска",
         img: nothingChooseImg,
       },
     };
@@ -31,20 +31,21 @@ export default {
       if (!value) {
         this.dataStatus = {
           title: "no data",
-          message: "Введите номер карты или ФИО пациента",
+          message: "Введите ФИО Пациента",
           img: nothingChooseImg,
         };
         this.medicalCards = [];
         return;
       }
-      const data = await fetchWrapper.get(
-        "medical_cards?searchstring=" + value
-      );
+
+      const data = await fetchWrapper.post("persons/search", {
+        full_name: value,
+      });
       if (data?.length === 0) {
         this.medicalCard = [];
         this.dataStatus = {
           title: "not found",
-          message: `По запросу «${value}» не найдено.
+          message: `По запросу «${value}» Пациентов не найдено.
             Переформулируйте запрос и попробуйте снова`,
           img: nothingSearchImg,
         };

src/pages/medcards/components/MedicalCardSearchHeader.vue

@@ -4,15 +4,15 @@
       base-input.search(
         :width="438",
         size="M",
-        placeholder="Введите ФИО или номер телефона",
+        placeholder="ФИО Пациента",
         icon-left,
         v-model="filterString"
       )
         template(#iconLeft)
           q-icon.search-icon(name="app:search", size="20px")
-    base-button(width="216px", @click="showCreateModal = true")
-      q-icon.plus.mr-2(name="app:plus", size="24px")
-      span Создать медкарту
+    base-button(@click="showCreateModal = true")
+      q-icon.plus.mr-2(name="app:plus", size="18px")
+      span Новая медкарта
     base-modal(v-model="showCreateModal", title="Создать медицинскую карту", modal-padding)
       patient-creation-form(@close="handleClosePatientForm")
 </template>
@@ -72,7 +72,8 @@ export default {
   fill: var(--font-grey-color)
 
 .search :deep(.q-field__prepend)
-  padding-right: 4px
+  padding-right: 12px
+
 
 .plus :deep(path)
   fill: var(--default-white)

src/pages/medcards/components/MedicalCardSearchList.vue

@@ -17,7 +17,7 @@
             v-for="medcard in medicalCards",
             :key="medcard.id"
             :header-style="headerStyle",
-            :medcard-info="medcard",
+            :person="medcard",
           )
 </template>
 
@@ -41,7 +41,6 @@ export default {
     headerStyle(field) {
       return {
         ...field,
-        "justify-content": field.title === "Do" ? "center" : "",
       };
     },
   },

src/pages/medcards/components/MedicalCardSearchRow.vue

@@ -1,93 +1,69 @@
 <template lang="pug">
   .w-full.row-wrapper.h-14.flex    
-    .field.gap-x-3(
-      :style="headerStyle(headerConfig[0])"
-    )
-      q-avatar(size="36px")
-        img(:src="avatar")
+    .field(:style="headerStyle(headerConfig[0])")
+      template(v-if="person.medical_card_id")
+        base-button(size="S", @click="openMedicalCard", label="Открыть", color="green")
+      template(v-else)      
+        base-button(size="S", @click="createMedCard", label="Создать")
+    .field.gap-x-3(:style="headerStyle(headerConfig[1])")
       span.font-semibold.text-dark {{patientName}}
-    .field(:style="headerStyle(headerConfig[1])")
-      span.text-dark {{ convertDate(medcardInfo?.person?.birth_date) }} г.
     .field(:style="headerStyle(headerConfig[2])")
-      .medcard-number.rounded.h-7.py-1.pl-3.pr-2.flex.items-center.justify-between.w-full.cursor-pointer(
-        @click="copyValue(medcardInfo?.number)"
-      )
-        span.text-dark.cursor-pointer {{ medcardInfo?.number }}
-        q-icon.copy(size="18px", name="app:copy")
-    .field(:style="headerStyle(headerConfig[3])")
-      span.text-dark {{ convertDate(medcardInfo?.created_at) }} г.
-    .field(:style="{...headerStyle(headerConfig[4])}")
-      q-icon.medcard.cursor-pointer(name="app:medcard", size="20px", @click="openMedicalCard")
+      span.text-dark {{ birthDate }}        
+    .field(:style="{...headerStyle(headerConfig[3])}")
+      span.text-dark {{ phones }}  
 </template>
 
 <script>
-import {
-  searchListConfig,
-  priorityList,
-} from "@/pages/medcards/utils/medcardsConfig.js";
+import { searchListConfig } from "@/pages/medcards/utils/medcardsConfig.js";
 import * as moment from "moment/moment";
 import TheNotificationProvider from "@/components/Notifications/TheNotificationProvider";
-import { addNotification } from "@/components/Notifications/notificationContext";
-import avatar from "@/assets/images/person.png";
+
 import { mapActions } from "vuex";
+import BaseButton from "@/components/base/BaseButton.vue";
 export default {
   name: "MedicalCardSearchRow",
-  components: { TheNotificationProvider },
+  components: { TheNotificationProvider, BaseButton },
   props: {
     headerStyle: Function,
-    medcardInfo: Object,
+    person: Object,
   },
   data() {
     return {
       headerConfig: searchListConfig,
-      avatar,
     };
   },
   computed: {
     patientName() {
-      return `${this.medcardInfo?.person?.last_name} ${this.medcardInfo?.person?.first_name} ${this.medcardInfo?.person?.patronymic}`;
+      return `${this.person?.last_name} ${this.person?.first_name} ${this.person?.patronymic}`;
     },
-    patientPriority() {
-      return priorityList?.find(
-        ({ priority }) => (this.medcardInfo.priority || null) === priority
-      );
+    birthDate() {
+      let retVal =
+        this.person?.birth_date &&
+        moment(this.person?.birth_date)?.format("DD MMMM YYYY");
+      return retVal ? retVal + " г." : "";
     },
-    thumbStyle() {
-      let percentage = this.medcardInfo?.filling_percentage || 0;
-      return {
-        width: `calc(${percentage}%)`,
-        "background-color":
-          percentage < 11
-            ? "var(--system-color-red)"
-            : percentage < 51
-            ? "var(--bg-yellow-warning)"
-            : "var(--system-color-green)",
-      };
+    phones() {
+      return this.person?.contacts
+        ?.filter((el) => el.category === "PHONE")
+        .map((el) => el.value)
+        .join(", ");
     },
   },
   methods: {
     ...mapActions({
       getMedicalCardData: "getMedicalCardDataByPersonId",
+      createMedicalCard: "createMedicalCard",
     }),
     openMedicalCard() {
-      this.getMedicalCardData({
-        personId: this.medcardInfo.person_id,
-        successCallback: (id) => this.$router.push("medical-card/" + id),
+      this.$router.push("medical-card/" + this.person["medical_card_id"]);
+    },
+    createMedCard() {
+      this.createMedicalCard({
+        personId: this.person.id,
+      }).then(() => {
+        this.openMedicalCard();
       });
     },
-    convertDate(date) {
-      return moment(date)?.format("DD MMMM YYYY");
-    },
-    copyValue(text) {
-      navigator.clipboard.writeText(text);
-      addNotification(
-        new Date().getTime(),
-        "",
-        "Номер медкарты скопирован",
-        "success",
-        5000
-      );
-    },
   },
 };
 </script>
@@ -122,8 +98,6 @@ span
 .track
   background: var(--gray-thirdly)
 
-.thumb
-
 .grey-color
   color: var(--font-grey-color)
 </style>

src/pages/medcards/utils/medcardsConfig.js

@@ -1,4 +1,8 @@
 export const searchListConfig = [
+  {
+    title: "Медкарта",
+    minWidth: "140px",
+  },
   {
     title: "ФИО",
     width: "100%",
@@ -9,42 +13,7 @@ export const searchListConfig = [
     minWidth: "220px",
   },
   {
-    title: "№ медкарты",
-    minWidth: "280px",
-  },
-  {
-    title: "Дата создания",
-    minWidth: "215px",
-  },
-  {
-    title: "Do",
-    minWidth: "60px",
-  },
-];
-
-export const priorityList = [
-  {
-    priority: 1,
-    id: 1,
-    text: "Высокий",
-    color: "var(--system-color-red)",
-  },
-  {
-    priority: 2,
-    id: 2,
-    text: "Средний",
-    color: "var(--bg-yellow-warning)",
-  },
-  {
-    priority: 3,
-    id: 3,
-    text: "Низкий",
-    color: "var(--btn-blue-color)",
-  },
-  {
-    priority: null,
-    id: 4,
-    text: "-",
-    color: "#9294A7",
+    title: "Телефон",
+    minWidth: "220px",
   },
 ];