perubahan edit akses menu fix

components/Master/formDetail1.vue

@@ -16,15 +16,15 @@ const {listTypeUser} = storeToRefs(useTypeUser());
 const data = ref<any>([]);
 const menuItem = ref<any>([]);
 const type_user = ref<any>([]);
-
 const dataDetail = ref(null)
 
 const dataMenu = async () => {
-  await getMenu();
-  await getTypeUser();
-  // if(){}
-  console.log('iswufgh',roleMenuById.value.data)
-  if(roleMenuById.value.data !=null && roleMenuById.value.data != ""){
+  await Promise.all([
+    getMenu(),
+    getTypeUser()
+  ])
+  // filtering role akses menu terhadap tipe user
+  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
@@ -42,33 +42,36 @@ const dataMenu = async () => {
         accessDelete: role_menu.access?.[3]?.delete || 0,
       };
     });
-  }else{
+  } else {
     checkMenu()
   }
 };
 
 const checkMenu = () => {
-  // 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
-    })))
+  // Filter the listMenu based on roleMenuById
+  var arr = listMenu.value.filter((i: any) =>
+      !roleMenuById.value.data ||
+      !roleMenuById.value.data.map((r: any) => r.menu_id).includes(i._id)
+  );
+  // Check if arr is not empty or roleMenuById.value.data is null
+  if (arr.length !== 0 || !roleMenuById.value.data) {
+    arr.forEach((i: any, index: number) => {
+      data.value.push({
+        _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);
-  // await getTypeUser(data.value?.form$.data)
 };
 onMounted(async () => {
-  //   console.log(roleMenuById.value.data);
   data.value = await dataMenu();
   console.log(checkMenu())
   console.log('aaaaa', data.value);
@@ -76,28 +79,40 @@ onMounted(async () => {
 
 
 // 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: {
+const createCheckbox = (namePrefix: string, menu: any) => {
+  const accessMap = {
+    accessAdd: menu.accessAdd,
+    accessUpdate: menu.accessUpdate,
+    accessRead: menu.accessRead,
+    accessDelete: menu.accessDelete
+  };
+  return {
+    name: `${namePrefix}_${menu._id}`,
     type: 'checkbox',
-    label: 'Checkbox'
-  }
-})
+    text: 'Ya',
+    default: accessMap[namePrefix] !== undefined ? accessMap[namePrefix] : 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]
-]
+let count = 0
+const createMenuRow = (menu: any) => {
+  count += 1; // Use the current counter value and then increment it
+  return [
+    [`${count}`, 1, 1],
+    [menu.menu, 1, 1],
+    [createCheckbox('accessAdd', menu), 1, 1],
+    [createCheckbox('accessUpdate', menu), 1, 1],
+    [createCheckbox('accessRead', menu), 1, 1],
+    [createCheckbox('accessDelete', menu), 1, 1]
+  ]
+}
 </script>
 
 <template>
@@ -121,12 +136,14 @@ const createMenuRow = (menu: any, index: bigint) => [
         ...data.map((menu:any) => createMenuRow(menu))
       ]"
       />
-      <ButtonElement
-          name="primaryButton"
-          button-label="Simpan"
-          :submits="true"
-          align="right"
-      />
+        <ButtonElement
+            class="mt-6"
+            name="primaryButton"
+            button-label="Simpan"
+            :submits="true"
+            align="right"
+        />
+
     </Vueform>
   </div>
 </template>