Refactor Select.vue and Type4.vue components

src/components/Form/FiltersType/Type4.vue

@@ -1,7 +1,15 @@
 <script setup lang="ts">
 import Select from '@/components/Select.vue'
 import DatePicker from '@/components/DatePicker.vue'
-import { selectedUid, selectedUp3Ulp, selectedUlp, itemsUid, itemsUp3, itemsUlp } from './reference'
+import {
+  selectedUid,
+  selectedUp3Ulp,
+  selectedUlp,
+  itemsUid,
+  itemsUp3,
+  itemsUlp,
+  fetchUid
+} from './reference'
 import { computed, onMounted, ref } from 'vue'
 const uidPlaceholder = 'Semua Unit Induk Distribusi/Wilayah'
 const up3Placeholder = 'Semua Unit Pelaksanaan Pelayanan Pelanggan'
@@ -27,7 +35,7 @@ const data = ref({
   up3: uppp.value,
   ulp: ulp.value,
   periode: '',
-  jenisLaporan: ''
+  jenisLaporan: jenisLaporan.value[0]
 })
 const setUid = (value: any) => {
   uid.value = value
@@ -51,7 +59,7 @@ const setUlp = (value: any) => {
 
 onMounted(() => {
   emit('update:filters', data.value)
-  // fetchUid()
+  fetchUid()
 })
 </script>
 
@@ -78,11 +86,7 @@ onMounted(() => {
     <div class="flex flex-col flex-1 space-y-2">
       <label class="filter-input-label">Jenis Laporan:</label>
 
-      <Select
-        @update:selected="(value) => (data.jenisLaporan = value)"
-        :data="jenisLaporan"
-        :placeholder="'Semua Jenis Laporan'"
-      />
+      <Select @update:selected="(value) => (data.jenisLaporan = value)" :data="jenisLaporan" />
     </div>
 
     <div class="flex flex-col flex-1 space-y-2">