- advanced AsideMenuList.vue, AsideMenuItem.vue

- npm updates
- load menu in AsideMenu.vue via main.ts store for saving the satus of menu items
- extended jappa tests: test also permission on dataset controller code

resources/js/Components/AsideMenuList.vue

@@ -1,29 +1,54 @@
 <script setup lang="ts">
 import AsideMenuItem from '@/Components/AsideMenuItem.vue';
 
-defineProps({
-    isDropdownList: Boolean,
-    menu: {
-        type: Object,
-        default: () => {},
+const props = defineProps({
+    // isDropdownList: Boolean,   
+    menuItems: {
+        type: Array<Object>,
+        required: true,
     },
+    // parentItem: {
+    //     type: Object,
+    //     required: false,
+    // },
 });
 
 const emit = defineEmits(['menu-click']);
 
-const menuClick = (event, item) => {
-    emit('menu-click', event, item);
-};
+// const menuClick = (event, item) => {
+//     emit('menu-click', event, item);
+// };
 </script>
 
 <template>
-    <ul>
-        <AsideMenuItem
-            v-for="(menuItem, index) in menu"
+    <div class="aside-menu">
+        <ul>
+            <!-- <li class="menu-item"> -->
+                <!-- <AsideMenuItem
+            v-for="(menuItem, index) in props.items"
             :key="index"
             v-bind:item="menuItem"
-            :is-dropdown-list="menuItem.children?.length > 0"
-            @menu-click="menuClick"
-        />
-    </ul>
+            @menu-click="menuClick"            
+            /> -->
+                <AsideMenuItem v-for="(item, index) in props.menuItems" :key="index" :item="item"> </AsideMenuItem>
+                <!-- :is-dropdown-list="menuItem.children?.length > 0" -->
+            <!-- </li> -->
+        </ul>
+    </div>
 </template>
+
+<style>
+/* .aside-menu {
+    position: fixed;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    width: 200px;
+    background-color: #f5f5f5;
+    padding: 20px;
+} */
+
+.menu-item {
+    margin-bottom: 10px;
+}
+</style>