* связка таблицы архива с пациентами

* добавил разграничение карт по типам баз
* модель для хранения изменений статуса карт
* добавил окно с просмотром выдачи карты
* добавил фильтрацию вывода карт

resources/js/Pages/Home/Index.vue

@@ -1,38 +1,51 @@
 <script setup>
 import AppLayout from "../../Layouts/AppLayout.vue"
 import TableCards from './DataTable/Index.vue'
-import { NInput, NFlex, NDivider, NDatePicker } from 'naive-ui'
+import { NInput, NFlex, NDivider, NDatePicker, NSpace, NRadioGroup, NRadioButton, NH1 } from 'naive-ui'
 import {useMedicalHistory} from "../../Composables/useMedicalHistory.js";
 import {useDebounceFn} from "@vueuse/core";
+import {useMedicalHistoryFilter} from "../../Composables/useMedicalHistoryFilter.js";
+import {computed, ref} from "vue";
 
 const props = defineProps({
     cards: {
         type: Array,
         default: []
+    },
+    filters: {
+        type: Array,
+        default: []
     }
 })
 
-const { navigate } = useMedicalHistory('/')
+const {
+    isLoading, applyFilters, filtersRef, handleSearch, dateRange,
+    handleDateRangeChange, handleViewTypeChange
+} = useMedicalHistoryFilter(props.filters)
 
-const search = (value) => {
-    navigate(value)
-}
-
-const debounceSearch = useDebounceFn((searchValue) => {
-    search(searchValue)
-}, 500)
+const viewType = ref('archive')
 </script>
 
 <template>
     <AppLayout>
         <template #header>
-            <NFlex class="py-4" align="center" :wrap="false">
-                <NInput placeholder="Поиск по ФИО, № карты" @update:value="val => debounceSearch(val)"/>
-                <NDivider vertical />
-                <NDatePicker type="daterange" clearable format="dd.MM.yyyy" start-placeholder="Дата выписки с" end-placeholder="по" />
-            </NFlex>
+            <NSpace vertical>
+                <NH1 class="!my-0 mb-5">
+                    Архив
+                </NH1>
+                <NRadioGroup v-model:value="viewType" @update:value="val => handleViewTypeChange(val)">
+                    <NRadioButton value="archive">Архив</NRadioButton>
+                    <NRadioButton value="mis">МИС</NRadioButton>
+                    <NRadioButton value="softinfo">СофтИнфо</NRadioButton>
+                </NRadioGroup>
+                <NFlex class="pb-4" align="center" :wrap="false">
+                    <NInput placeholder="Поиск по ФИО, № карты" @update:value="val => handleSearch(val)"/>
+                    <NDivider vertical />
+                    <NDatePicker v-model:value="dateRange" @update:value="handleDateRangeChange" type="daterange" clearable format="dd.MM.yyyy" start-placeholder="Дата выписки с" end-placeholder="по" />
+                </NFlex>
+            </NSpace>
         </template>
-        <TableCards :data="cards.data" :meta="cards.meta" min-height="calc(100vh - 179px)" max-height="calc(100vh - 196px)" />
+        <TableCards :filters="filters" :data="cards.data" :meta="cards.meta" min-height="calc(100vh - 277px)" max-height="calc(100vh - 320px)" />
     </AppLayout>
 </template>