feat(division): change form attribute

app/components/app/division/entry-form.vue

@@ -4,7 +4,6 @@ import Block from '~/components/pub/custom-ui/doc-entry/block.vue'
 import Cell from '~/components/pub/custom-ui/doc-entry/cell.vue'
 import Field from '~/components/pub/custom-ui/doc-entry/field.vue'
 import Label from '~/components/pub/custom-ui/doc-entry/label.vue'
-// import Combobox from '~/components/pub/custom-ui/form/combobox.vue'
 import TreeSelect from '~/components/pub/base/select-tree/tree-select.vue'
 
 // Types
@@ -14,7 +13,6 @@ import type { DivisionFormData } from '~/schemas/division.schema.ts'
 import type z from 'zod'
 import { toTypedSchema } from '@vee-validate/zod'
 import { useForm } from 'vee-validate'
-import { convertDivisionToTreeItems } from '~/handlers/_shared.handler'
 
 interface Props {
   schema: z.ZodSchema<any>
@@ -37,25 +35,29 @@ const { defineField, errors, meta } = useForm({
   initialValues: {
     code: '',
     name: '',
+    parent_id: 0,
     division_id: 0,
   } as Partial<DivisionFormData>,
 })
 
 const [code, codeAttrs] = defineField('code')
 const [name, nameAttrs] = defineField('name')
-const [division, divisionAttrs] = defineField('division_id')
+const [parent, parentAttrs] = defineField('parent_id')
+const [division] = defineField('division_id')
 
 // Fill fields from props.values if provided
 if (props.values) {
   if (props.values.code !== undefined) code.value = props.values.code
   if (props.values.name !== undefined) name.value = props.values.name
+  if (props.values.parent_id !== undefined) parent.value = props.values.parent_id
   if (props.values.division_id !== undefined) division.value = props.values.division_id
 }
 
 const resetForm = () => {
   code.value = ''
   name.value = ''
-  division.value = ''
+  parent.value = 0
+  division.value = 0
 }
 
 // Form submission handler
@@ -63,7 +65,8 @@ function onSubmitForm() {
   const formData: DivisionFormData = {
     name: name.value || '',
     code: code.value || '',
-    division_id: division.value || '',
+    parent_id: parent.value || 0,
+    division_id: division.value || 0,
   }
   emit('submit', formData, resetForm)
 }
@@ -94,9 +97,9 @@ function onCancelForm() {
         <Field :errMessage="errors.division">
           <TreeSelect
             id="division"
-            v-model="division"
-            v-bind="divisionAttrs"
-            :data="convertDivisionToTreeItems(props.divisions)"
+            v-model="parent"
+            v-bind="parentAttrs"
+            :data="divisions"
             :disabled="isLoading || isReadonly"
             placeholder="Pilih Divisi Induk"
             search-placeholder="Cari divisi"

app/components/content/division/list.vue

@@ -13,6 +13,7 @@ import { toast } from '~/components/pub/ui/toast'
 // Types
 import { ActionEvents, type HeaderPrep } from '~/components/pub/custom-ui/data/types'
 import { DivisionSchema, type DivisionFormData } from '~/schemas/division.schema'
+import type { TreeItem } from '~/models/_model'
 
 // Handlers
 import {
@@ -28,12 +29,12 @@ import {
   handleActionRemove,
   handleCancelForm,
 } from '~/handlers/division.handler'
-import { divisions, getDivisionParentList } from '~/handlers/_shared.handler'
+import { convertDivisionToTreeItems } from '~/handlers/_shared.handler'
 
 // Services
 import { getDivisions, getDivisionDetail } from '~/services/division.service'
-import { getDivisionPositions } from '~/services/division-position.service'
 
+const divisionsTrees = ref<TreeItem[]>([])
 const title = ref('')
 
 const {
@@ -118,11 +119,10 @@ watch([recId, recAction], () => {
 
 watch(() => data.value, async () => { 
   if (!data.value) return
-  await getDivisionParentList(false, data.value || [])
+  divisionsTrees.value = convertDivisionToTreeItems(data.value || [])
 })
 
 onMounted(async () => {
-  await getDivisionPositions()
   await getDivisionList()
 })
 </script>
@@ -140,7 +140,7 @@ onMounted(async () => {
   <Dialog v-model:open="isFormEntryDialogOpen" :title="!!recItem ? title : 'Tambah Divisi'" size="lg" prevent-outside>
     <AppDivisionEntryForm
       :schema="DivisionSchema"
-      :divisions="divisions"
+      :divisions="divisionsTrees"
       :values="recItem"
       :is-loading="isProcessing"
       :is-readonly="isReadonly"

app/schemas/division.schema.ts

@@ -4,7 +4,8 @@ import type { Division, DivisionPosition } from '~/models/division'
 const DivisionSchema = z.object({
   code: z.string({ required_error: 'Kode harus diisi' }).min(1, 'Kode minimum 1 karakter'),
   name: z.string({ required_error: 'Nama harus diisi' }).min(1, 'Nama minimum 1 karakter'),
-  division_id: z.number().positive('Divisi Induk harus diisi').optional().nullable(),
+  parent_id: z.number({ required_error: 'Divisi Induk harus diisi' }).optional().nullable(),
+  division_id: z.number({ required_error: 'Divisi Induk harus diisi' }).optional().nullable(),
 })
 
 type DivisionFormData = z.infer<typeof DivisionSchema> & (Division | DivisionPosition)