feat: restructure list

app/components/content/uom/list.vue

@@ -2,8 +2,8 @@
 // Components
 import Dialog from '~/components/pub/base/modal/dialog.vue'
 import Header from '~/components/pub/custom-ui/nav-header/prep.vue'
-import AppUomEntryForm from '~/components/app/uom/entry-form.vue'
 import RecordConfirmation from '~/components/pub/custom-ui/confirmation/record-confirmation.vue'
+import AppUomEntryForm from '~/components/app/uom/entry-form.vue'
 
 // Helpers
 import { usePaginatedList } from '~/composables/usePaginatedList'
@@ -57,7 +57,9 @@ const headerPrep: HeaderPrep = {
     minLength: 3,
     debounceMs: 500,
     showValidationFeedback: true,
-    onInput: (_val: string) => {},
+    onInput: (value: string) => {
+      searchInput.value = value
+    },
     onClick: () => {},
     onClear: () => {},
   },
@@ -113,17 +115,18 @@ onMounted(async () => {
 
 <template>
   <div class="p-4">
-    <Header v-model="searchInput" :prep="headerPrep" @search="handleSearch" />
+    <Header
+      v-model="searchInput"
+      :prep="headerPrep"
+      :ref-search-nav="headerPrep.refSearchNav"
+      @search="handleSearch"
+      class="mb-4 xl:mb-5"
+    />
     <div class="rounded-md border p-4">
       <AppUomList :data="data" :pagination-meta="paginationMeta" @page-change="handlePageChange" />
     </div>
 
-    <Dialog
-      v-model:open="isFormEntryDialogOpen"
-      :title="!!recItem ? title : 'Tambah Uom'"
-      size="lg"
-      prevent-outside
-    >
+    <Dialog v-model:open="isFormEntryDialogOpen" :title="!!recItem ? title : 'Tambah Uom'" size="lg" prevent-outside>
       <AppUomEntryForm
         :schema="UomSchema"
         :values="recItem"