diff --git a/components/Master/formDetail1.vue b/components/Master/formDetail1.vue
index c45692d..cdd2517 100644
--- a/components/Master/formDetail1.vue
+++ b/components/Master/formDetail1.vue
@@ -3,16 +3,16 @@ import typeUser from "@/data/dummy/keuangan.type_user.json";
 import role_menu from "@/data/dummy/keuangan.role_menu.json";
 import menu from "@/data/dummy/keuangan.menu.json";
 
-import { useRoleMode } from "@/stores/api/roleMenu";
-import { useMenu } from "@/stores/api/menu";
-import { useTypeUser } from "@/stores/api/typeUser";
+import {useRoleMode} from "@/stores/api/roleMenu";
+import {useMenu} from "@/stores/api/menu";
+import {useTypeUser} from "@/stores/api/typeUser";
 
-const { getMenu } = useMenu();
-const { getTypeUser } = useTypeUser();
+const {getMenu} = useMenu();
+const {getTypeUser} = useTypeUser();
 
-const { roleMenuById } = storeToRefs(useRoleMode());
-const { listMenu } = storeToRefs(useMenu());
-const { listTypeUser } = storeToRefs(useTypeUser());
+const {roleMenuById} = storeToRefs(useRoleMode());
+const {listMenu} = storeToRefs(useMenu());
+const {listTypeUser} = storeToRefs(useTypeUser());
 const data = ref<any>([]);
 const menuItem = ref<any>([]);
 const type_user = ref<any>([]);
@@ -22,156 +22,111 @@ const dataDetail = ref(null)
 const dataMenu = async () => {
   await getMenu();
   await getTypeUser();
-//   console.log("ini roleMenu:",roleMenuById.value.data);
-  // console.log('ini semua tipe:',listTypeUser.value);
-  return roleMenuById.value.data.map((role_menu: any) => {
-    menuItem.value = listMenu.value.find(
-      (menu: any) => menu._id == role_menu.menu_id
-    );
-    console.log("ini menunya:", menuItem.value);
-    type_user.value = listTypeUser.value.find(
-      (type_user: any) => type_user._id == role_menu.type_user_id
-    );
-    // console.log("ini menunya:",menuItem);
-    return {
-      _id: role_menu._id,
-      menu: menuItem?.value.display || "-",
-      type_user: type_user?.value.display || "-",
-      accessAdd: role_menu.access?.[0]?.add || 0,
-      accessUpdate: role_menu.access?.[1]?.update || 0,
-      accessRead: role_menu.access?.[2]?.read || 0,
-      accessDelete: role_menu.access?.[3]?.delete || 0,
-    };
-  });
-  //   console.log(data)
+  // if(){}
+  console.log('iswufgh',roleMenuById.value.data)
+  if(roleMenuById.value.data !=null && roleMenuById.value.data != ""){
+    return roleMenuById.value.data.map((role_menu: any) => {
+      menuItem.value = listMenu.value.find(
+          (menu: any) => menu._id == role_menu.menu_id
+      );
+      type_user.value = listTypeUser.value.find(
+          (type_user: any) => type_user._id == role_menu.type_user_id
+      );
+      return {
+        _id: role_menu._id,
+        menu: menuItem?.value.display || "-",
+        type_user: type_user?.value.display || "-",
+        accessAdd: role_menu.access?.[0]?.add || 0,
+        accessUpdate: role_menu.access?.[1]?.update || 0,
+        accessRead: role_menu.access?.[2]?.read || 0,
+        accessDelete: role_menu.access?.[3]?.delete || 0,
+      };
+    });
+  }else{
+    checkMenu()
+  }
 };
 
 const checkMenu = () => {
-    // var arr = listMenu.value.filter((i:any) => !roleMenuById.value.data.includes(i._id))
-    // https://stackoverflow.com/questions/33577868/filter-array-not-in-another-array
-    var arr = listMenu.value.filter((i:any) => !roleMenuById.value.data.map((r:any) => r.menu_id).includes(i._id))
-    if(arr.length != 0){
-        data.value.push(...arr.map((i:any) => ({menu:i.display,accessAdd:0,accessUpdate:0,accessRead:0,accessDelete:0})))
-    }
-    // console.log("yang belum ada di role menu",arr)
+  // https://stackoverflow.com/questions/33577868/filter-array-not-in-another-array
+  var arr = listMenu.value.filter((i: any) => !roleMenuById.value.data.map((r: any) => r.menu_id).includes(i._id))
+  if (arr.length != 0) {
+    data.value.push(...arr.map((i: any, index: bigint) => ({
+      _id: `${index + 1}`,
+      menu: i.display,
+      accessAdd: 0,
+      accessUpdate: 0,
+      accessRead: 0,
+      accessDelete: 0
+    })))
+  }
 }
 
 const onSubmit = async () => {
   // console.log("ini disimpan:",data.value?.data.typeUser);
-  console.log("ini disimpan:",dataDetail.value?.form$.data);
+  console.log("ini disimpan:", dataDetail.value?.form$.data);
   // await getTypeUser(data.value?.form$.data)
 };
 onMounted(async () => {
   //   console.log(roleMenuById.value.data);
   data.value = await dataMenu();
   console.log(checkMenu())
-  console.log(data.value);
+  console.log('aaaaa', data.value);
 });
 
-// const columns = ref([
-//   { label: "Nama Menu", key: "menu" },
-//   { label: "Tambah", key: "accessAdd" },
-//   { label: "Ubah", key: "accessUpdate" },
-//   { label: "Baca", key: "accessRead" },
-//   { label: "Hapus", key: "accessDelete" },
-//   { label: "Aksi", key: "actions" },
-// ]);
+
+// Helper function to create checkbox config
+const createCheckbox = (namePrefix: string, menu: any,index:bigint) => ({
+  name: `${namePrefix}_${menu._id}`,
+  type: 'checkbox',
+  text: 'Ya',
+  default: namePrefix=='accessAdd'?menu.accessAdd:0,
+  'true-value':"1",
+  'false-value':"0",
+  builder: {
+    type: 'checkbox',
+    label: 'Checkbox'
+  }
+})
+
+// Helper function to create a menu row
+const createMenuRow = (menu: any, index: bigint) => [
+  [index + 1, 1, 1],
+  [menu.menu, 1, 1],
+  [createCheckbox('accessAdd', menu,index), 1, 1],
+  [createCheckbox('accessUpdate', menu,index), 1, 1],
+  [createCheckbox('accessRead', menu,index), 1, 1],
+  [createCheckbox('accessDelete', menu,index), 1, 1]
+]
 </script>
 
 <template>
   <div class="d-flex flex-column gap-1 mx-1 pa-7 pt-0 pb-0">
-  <!-- {{roleMenuById.data}} -->
-  <!-- {{dataMenu}} -->
-  <!-- {{data}} -->
-  <pre>{{ data }}</pre>
-  <!-- <MasterTable :columns="columns" :data="data"/> -->
-
-
-  <Vueform ref="dataDetail" validate-on="change|step" method="post" :endpoint="onSubmit">
-    <GridElement
-      name="gridTable"
-      :presets="['grid-table']"
-      :cols="5"
-      :rows="2"
-      :grid="[
+    <Vueform ref="dataDetail" validate-on="change|step" method="post" :endpoint="onSubmit">
+      <GridElement
+          name="gridTable"
+          :widths="['80px', '','90px','90px','90px','90px']"
+          :presets="['grid']"
+          :cols="6"
+          :rows="1+data.length"
+          :grid="[
         [
+          ['No', 1, 1, null, null],
           ['Nama Menu', 1, 1, null, null],
           ['Tambah', 1, 1, null, null],
           ['Ubah', 1, 1, null, null],
           ['Baca', 1, 1, null, null],
           ['Hapus', 1, 1, null, null],
         ],
-        [
-          ['', 1, 1, null, null],
-          [
-            {
-              name: 'accessAdd',
-              type: 'checkbox',
-              text: 'Ya',
-              builder: {
-                type: 'checkbox',
-                label: 'Checkbox',
-              },
-            },
-            1,
-            1,
-            null,
-            null,
-          ],
-          [
-            {
-              name: 'accessUpdate',
-              type: 'checkbox',
-              text: 'Ya',
-              builder: {
-                type: 'checkbox',
-                label: 'Checkbox',
-              },
-            },
-            1,
-            1,
-            null,
-            null,
-          ],
-          [
-            {
-              name: 'accessRead',
-              type: 'checkbox',
-              text: 'Ya',
-              builder: {
-                type: 'checkbox',
-                label: 'Checkbox',
-              },
-            },
-            1,
-            1,
-            null,
-            null,
-          ],
-          [
-            {
-              name: 'accessDelete',
-              type: 'checkbox',
-              text: 'Ya',
-              builder: {
-                type: 'checkbox',
-                label: 'Checkbox',
-              },
-            },
-            1,
-            1,
-            null,
-            null,
-          ],
-        ],
+        ...data.map((menu:any) => createMenuRow(menu))
       ]"
-    />
-    <ButtonElement
-      name="primaryButton"
-      button-label="Simpan"
-      :submits="true"
-      align="right"
-    />
-  </Vueform>
-    </div>
+      />
+      <ButtonElement
+          name="primaryButton"
+          button-label="Simpan"
+          :submits="true"
+          align="right"
+      />
+    </Vueform>
+  </div>
 </template>
diff --git a/pages/Setting/typeUser/index.vue b/pages/Setting/typeUser/index.vue
index aa9ac77..112889b 100644
--- a/pages/Setting/typeUser/index.vue
+++ b/pages/Setting/typeUser/index.vue
@@ -53,7 +53,7 @@ onMounted(async() => {
   <MasterDialogModal v-if="state" :stateValue="state" @stateValue="val => state = val" >
     <template v-slot:text>
       <!-- <p>coba ini</p> -->
-       {{ type }}
+<!--       {{ type }}-->
        <MasterFormTypeUser v-if="type=='create'"/>
        <MasterFormDetail1 v-if="type=='detail'"/>
     </template>