Новая логика поисковой выдачи

И добавлена кнопка Добавить карту в архив

resources/js/Pages/Home/ArchiveHistoryCreateModal/Index.vue

@@ -0,0 +1,104 @@
+<script setup>
+import { NModal, NSelect, NSpace, NFlex, NButton, NForm, NFormItem, NInput, NDatePicker, NDivider, NSpin, NTag } from 'naive-ui'
+import ArchiveHistoryMoveModal from '../ArchiveHistoryMoveModal/Index.vue'
+import {computed, ref, watch} from "vue";
+import {useMedicalHistoryFilter} from "../../../Composables/useMedicalHistoryFilter.js";
+import {useNotification} from "../../../Composables/useNotification.js";
+import {useDebounceFn} from "@vueuse/core";
+
+const open = defineModel('open')
+
+const {errorApi} = useNotification()
+const loading = ref(false)
+const archiveInfo = ref({
+    id: null,
+    num: null,
+    post_in: null,
+})
+const loadingFilterPatients = ref(false)
+
+const emits = defineEmits(['historyUpdated', 'closeWithoutSave'])
+
+const onResetData = () => {
+    archiveInfo.value = {
+        id: null,
+        num: null,
+        post_in: null,
+    }
+}
+
+const onCloseWithoutSave = () => {
+    emits('closeWithoutSave')
+    open.value = false
+}
+
+const filteredPatients = ref([])
+
+const debounceSearchCard = useDebounceFn(async (query) => {
+    loadingFilterPatients.value = true
+    await axios.post('/api/mis/patients/search', {
+        query
+    }).then(res => {
+        filteredPatients.value = res.data
+    }).finally(() => {
+        loadingFilterPatients.value = false
+    })
+}, 1000)
+
+const handleSearchCard = (query) => {
+    debounceSearchCard(query)
+}
+
+const onSubmit = async () => {
+    loading.value = true
+    try {
+        await axios.post(`/api/archive/create`, archiveInfo.value).then(res => {
+            open.value = false
+        })
+
+    } catch (error) {
+        errorApi(error)
+        console.error(error)
+    } finally {
+        loading.value = false
+    }
+}
+</script>
+
+<template>
+    <NModal v-model:show="open" preset="card" class="max-w-xl relative overflow-clip" closable @close="onCloseWithoutSave">
+        <template #header>
+            Добавить карту в архив
+        </template>
+        <NFlex class="w-full" :wrap="false">
+            <NForm class="w-full">
+                <NFormItem label="Пациент">
+                    <NSelect placeholder="№ карты фамилия имя отчество или фамилия имя отчество" size="large" :remote filterable :loading="loadingFilterPatients" :options="filteredPatients" v-model:value="archiveInfo.id" @search="handleSearchCard" />
+                </NFormItem>
+                <NFormItem size="large" label="№ в архиве">
+                    <NInput v-model:value="archiveInfo.num" />
+                </NFormItem>
+                <NFormItem size="large" label="Дата поступления карты в архив">
+                    <NDatePicker class="w-full" v-model:value="archiveInfo.post_in" format="dd.MM.yyyy" />
+                </NFormItem>
+            </NForm>
+        </NFlex>
+        <template #action>
+            <NFlex justify="end" align="center">
+                <NSpace align="center" :size="0">
+                    <NButton secondary type="primary" @click="onSubmit">
+                        Добавить карту
+                    </NButton>
+                </NSpace>
+            </NFlex>
+        </template>
+
+        <div v-show="loading" class="absolute inset-0 z-10 backdrop-blur flex items-center justify-center">
+            <NSpin :show="true" />
+        </div>
+    </NModal>
+</template>
+
+<style scoped>
+
+</style>

resources/js/Pages/Home/ArchiveHistoryModal/Index.vue

@@ -73,10 +73,10 @@ const loadPatientData = async () => {
 const onShowArchiveHistoryModal = (id) => {
     if (id === null) {
         isCreateNewArchiveHistoryModal.value = true
-        selectedArchiveHistoryId.value = props.patientInfo.id
+        selectedArchiveHistoryId.value = Number(props.patientInfo.id)
     } else {
         isCreateNewArchiveHistoryModal.value = false
-        selectedArchiveHistoryId.value = id
+        selectedArchiveHistoryId.value = Number(id)
     }
     selectedArchiveHistoryType.value = props.patientInfo.type
     showArchiveHistoryModal.value = true
@@ -159,7 +159,7 @@ watch(() => props.patientInfo, async (newId) => {
 </script>
 
 <template>
-    <NModal v-model:show="open" preset="card" class="max-w-4xl relative" closable @close="onCloseWithoutSave">
+    <NModal v-model:show="open" preset="card" class="max-w-4xl relative overflow-clip" closable @close="onCloseWithoutSave">
         <template #header>
             {{ patient.info?.medcardnum }} {{ patient.info?.family }} {{ patient.info?.name }} {{ patient.info?.ot }}
         </template>
@@ -203,7 +203,7 @@ watch(() => props.patientInfo, async (newId) => {
             </NFlex>
         </template>
 
-        <div v-show="loading" class="absolute inset-0 z-10 bg-white flex items-center justify-center">
+        <div v-show="loading" class="absolute inset-0 z-10 backdrop-blur flex items-center justify-center">
             <NSpin :show="true" />
         </div>
     </NModal>

resources/js/Pages/Home/ArchiveHistoryMoveModal/Index.vue

@@ -44,7 +44,7 @@ const orgs = ref([])
 
 const onResetData = () => {
     archiveHistory.value = {
-        archive_info_id: props.archiveHistoryId,
+        history_id: props.archiveHistoryId,
         type: props.type,
         issue_at: null,
         org_id: null,
@@ -111,7 +111,7 @@ watch(() => props.archiveHistoryId, async (newId) => {
 </script>
 
 <template>
-    <NModal v-model:show="open" preset="card" class="max-w-2xl relative" closable @close="onCloseWithoutSave">
+    <NModal v-model:show="open" preset="card" class="max-w-2xl relative overflow-clip" closable @close="onCloseWithoutSave">
         <template #header>
             {{ isCreateNew ? 'Добавить' : 'Редактировать' }} запись выдачи
         </template>
@@ -153,7 +153,7 @@ watch(() => props.archiveHistoryId, async (newId) => {
             </NFlex>
         </template>
 
-        <div v-show="loading" class="absolute inset-0 z-10 bg-white flex items-center justify-center">
+        <div v-show="loading" class="absolute inset-0 z-10 backdrop-blur flex items-center justify-center">
             <NSpin :show="true" />
         </div>
     </NModal>

resources/js/Pages/Home/Index.vue

@@ -1,7 +1,8 @@
 <script setup>
 import AppLayout from "../../Layouts/AppLayout.vue"
 import TableCards from './DataTable/Index.vue'
-import { NInput, NFlex, NDivider, NDatePicker, NSpace, NFormItem, NRadioButton, NH1, NTabs, NTabPane, NSelect } from 'naive-ui'
+import ArchiveHistoryCreateModal from './ArchiveHistoryCreateModal/Index.vue'
+import { NInput, NFlex, NDivider, NDatePicker, NSpace, NFormItem, NRadioButton, NH1, NTabs, NButton, NSelect } from 'naive-ui'
 import {useMedicalHistoryFilter} from "../../Composables/useMedicalHistoryFilter.js";
 import {ref} from "vue";
 
@@ -20,6 +21,7 @@ const props = defineProps({
     }
 })
 
+const ArchiveHistoryCreateModalShow = ref(false)
 const {
     isLoading, applyFilters, filtersRef, handleSearch, dateRange, searchValue,
     handleDateRangeChange, handleViewTypeChange, handleStatusChange
@@ -58,10 +60,16 @@ const handleBeforeLeave = (tabName) => {
                     <NFormItem class="w-[340px]" label="Статус карты" :show-feedback="false">
                         <NSelect :options="statuses" @update:value="val => handleStatusChange(val)" clearable size="large" />
                     </NFormItem>
+                    <NFormItem class="w-[340px]" :show-feedback="false">
+                        <NButton type="primary" @click="ArchiveHistoryCreateModalShow = true" secondary size="large">
+                            Добавить карту в архив
+                        </NButton>
+                    </NFormItem>
                 </NFlex>
             </NSpace>
         </template>
         <TableCards :filters="filters" :data="cards.data" :meta="cards.meta" min-height="calc(100vh - 212px)" max-height="calc(100vh - 320px)" />
+        <ArchiveHistoryCreateModal v-model:open="ArchiveHistoryCreateModalShow" />
     </AppLayout>
 </template>