refactor(ui): improve layout consistency and table styling

- Add container borders and padding for better visual hierarchy
- Standardize table cell borders across components
- Reset query params to defaults when changing resource type
- Clear data on fetch error to prevent stale data display
- Translate "No data available" to Indonesian

app/components/pub/base/data-table/data-table.vue

@@ -20,7 +20,7 @@ const loader = inject('table_data_loader') as DataTableLoader
   <Table>
     <TableHeader class="bg-gray-50">
       <TableRow>
-        <TableHead v-for="(h, idx) in header[0]" :key="`head-${idx}`"
+        <TableHead v-for="(h, idx) in header[0]" :key="`head-${idx}`" class="border"
           :style="{ width: cols[idx]?.width ? `${cols[idx].width}px` : undefined }">
           {{ h.label }}
         </TableHead>
@@ -30,24 +30,24 @@ const loader = inject('table_data_loader') as DataTableLoader
     <TableBody v-if="loader.isTableLoading">
       <!-- Loading state with 5 skeleton rows -->
       <TableRow v-for="n in 5" :key="`skeleton-${n}`">
-        <TableCell v-for="(key, cellIndex) in keys" :key="`cell-skel-${n}-${cellIndex}`">
+        <TableCell v-for="(key, cellIndex) in keys" :key="`cell-skel-${n}-${cellIndex}`" class="border">
           <Skeleton class="bg-gray-100 animate-pulse text-muted-foreground w-full h-6" />
         </TableCell>
       </TableRow>
     </TableBody>
-    <TableBody v-if="rows.length === 0 && !loader.isTableLoading">
+    <TableBody v-else-if="rows.length === 0">
       <TableRow>
-        <TableCell colspan="100%" class="text-center">
+        <TableCell :colspan="keys.length" class="text-center py-8">
           <div class="flex items-center justify-center">
             <Info class="size-5 text-muted-foreground" />
-            <span class="ml-2">No data available</span>
+            <span class="ml-2">Tidak ada data tersedia</span>
           </div>
         </TableCell>
       </TableRow>
     </TableBody>
     <TableBody v-else>
       <TableRow v-for="(row, rowIndex) in rows" :key="`row-${rowIndex}`">
-        <TableCell v-for="(key, cellIndex) in keys" :key="`cell-${rowIndex}-${cellIndex}`">
+        <TableCell v-for="(key, cellIndex) in keys" :key="`cell-${rowIndex}-${cellIndex}`" class="border">
           <!-- If funcComponent has a renderer -->
           <component :is="funcComponent[key](row, rowIndex).component" v-if="funcComponent[key]"
             v-bind="funcComponent[key](row, rowIndex)" />