Feat Infra (#108)

* fix: adjustment some schemas

* fix(room): fixing integrate unit of room

* feat(warehouse): modify form and integration

* feat(counter): modify form and integration

* feat(screen): add list, form and integration

* feat(screen): add page for public screen

* fix: add on reset state at list

* fix: solve list of relation

* feat(chamber): integrate form to api chamber

* feat(bed): integrate form to api bed

* fix: add searching function on list service

* fix: rewrite style for dropdown and tree select

* fix: add sort params

* fix: add sort params on division + medicine

* feat(division-position): layouting form + list

* fix: add sort params for getValueList

* chore: modify side menu style

* chore: fix ui dashboard

* feat(division-position): add content list

* feat(division-position): add temporary page

* feat(division-position): modify content and entry form

app/components/pub/my-ui/select-tree/tree-node.vue

@@ -52,19 +52,27 @@ watch(isOpen, async (newValue) => {
 
 <template>
   <div class="tree-node min-w-max">
-    <Collapsible v-model:open="isOpen" class="w-full">
+    <Collapsible
+      v-model:open="isOpen"
+      class="w-full"
+    >
       <!-- Node Header -->
-      <div class="flex items-center justify-start w-full p-2 rounded-md hover:bg-accent gap-2">
+      <div
+        class="flex w-full items-center justify-start gap-2 rounded-md bg-white p-2 hover:bg-accent dark:bg-transparent dark:hover:bg-slate-700"
+      >
         <!-- Chevron Toggle Button -->
         <CollapsibleTrigger as-child>
           <Button
             variant="ghost"
-            class="h-4 w-4 p-0 flex items-center justify-center"
+            class="flex h-4 w-4 items-center justify-center p-0"
           >
-            <Loader2 v-if="isLoading" class="w-4 h-4 animate-spin text-muted-foreground" />
+            <Loader2
+              v-if="isLoading"
+              class="h-4 w-4 animate-spin text-muted-foreground"
+            />
             <ChevronRight
               v-else
-              class="w-4 h-4 transition-transform duration-200 ease-in-out text-muted-foreground"
+              class="h-4 w-4 text-muted-foreground transition-transform duration-200 ease-in-out"
               :class="{
                 'rotate-90': isChevronRotated,
               }"
@@ -74,21 +82,24 @@ watch(isOpen, async (newValue) => {
 
         <!-- Node Label -->
         <span
-          class="text-sm font-normal cursor-pointer hover:text-primary flex-1 flex items-center justify-between"
+          class="flex flex-1 cursor-pointer items-center justify-between text-sm font-normal text-black hover:text-primary dark:text-white"
           @click="handleLabelClick"
         >
           {{ item.label }}
           <!-- Check Icon untuk selected state -->
           <Check
             v-if="selectedValue === item.value"
-            class="w-4 h-4 text-primary ml-2 flex-shrink-0"
+            class="ml-2 h-4 w-4 flex-shrink-0 text-primary"
           />
         </span>
       </div>
 
       <!-- Children Container -->
       <CollapsibleContent class="pl-6">
-        <div v-if="!hasChildren" class="text-sm text-muted-foreground p-2">
+        <div
+          v-if="!hasChildren"
+          class="p-2 text-sm text-muted-foreground"
+        >
           {{ isLoading ? 'Memuat...' : 'Tidak ada data' }}
         </div>
         <TreeView
@@ -106,7 +117,7 @@ watch(isOpen, async (newValue) => {
 
 <style scoped>
 .tree-node {
-  @apply w-full;
+  width: 100%;
 }
 
 /* Animasi tambahan untuk smooth transition */