add create medical card

src/pages/medcards/components/MedicalCardSearchHeader.vue

@@ -10,9 +10,11 @@
       )
         template(#iconLeft)
           q-icon.search-icon(name="app:search", size="20px")
-    base-button(width="216px", @click="openCreateMedcardPage")
+    base-button(width="216px", @click="showCreateModal = true")
       q-icon.plus.mr-2(name="app:plus", size="24px")
       span Создать медкарту
+    base-modal(v-model="showCreateModal", title="Создать медицинскую карту", modal-padding)
+      patient-creation-form(@close="handleClosePatientForm")
 </template>
 
 <script>
@@ -21,19 +23,37 @@ import BaseSelect from "@/components/base/BaseSelect.vue";
 import BaseButton from "@/components/base/BaseButton.vue";
 
 import debounce from "lodash/debounce";
+import BaseModal from "@/components/base/BaseModal.vue";
+import PatientCreationForm from "@/components/PatientCreationForm.vue";
+import { mapActions } from "vuex";
 export default {
   name: "MedicalCardSearchHeader",
-  components: { BaseInput, BaseSelect, BaseButton },
+  components: {
+    PatientCreationForm,
+    BaseModal,
+    BaseInput,
+    BaseSelect,
+    BaseButton,
+  },
   emits: ["search"],
   data() {
     return {
       filterString: "",
+      showCreateModal: false,
     };
   },
   methods: {
-    openCreateMedcardPage() {
-      alert("Создать медкарту с ФИО: " + this.filterString);
+    handleClosePatientForm(val) {
+      this.showCreateModal = false;
+      if (!val) return;
+      this.getMedicalCardData({
+        personId: val.id,
+        successCallback: (id) => this.$router.push("medical-card/" + id),
+      });
     },
+    ...mapActions({
+      getMedicalCardData: "getMedicalCardDataByPersonId",
+    }),
   },
   watch: {
     filterString: debounce(function (value) {

src/store/modules/medicalCard.js

@@ -425,17 +425,26 @@ const actions = {
       commit("setBenefitData", res.results);
     });
   },
-  createMedicalCard(ctx, id) {
-    fetchWrapper.post("medical_cards", {
-      person_id: id,
-      number: String(Math.floor(1 + Math.random() * (100000000 + 1 - 1))),
-    });
-    return this.getMedicalCardDataByPersonId(ctx, id);
+  createMedicalCard(ctx, { personId, successCallback }) {
+    fetchWrapper
+      .post("medical_cards", {
+        person_id: personId,
+        number: String(Math.floor(1 + Math.random() * (100000000 + 1 - 1))),
+      })
+      .then(() => {
+        this.dispatch("getMedicalCardDataByPersonId", {
+          personId,
+          successCallback,
+        });
+      });
   },
   getMedicalCardDataByPersonId({ commit }, { personId, successCallback }) {
     fetchWrapper.get(`medical_cards/person/${personId}`).then((data) => {
-      if (!data) {
-        return this.createMedicalCard({ commit }, personId);
+      if (!data || data?.detail) {
+        return this.dispatch("createMedicalCard", {
+          personId,
+          successCallback,
+        });
       }
       commit("setMedicalCard", data);
       commit("setBasicData");