@hostlink/nuxt-light 0.0.15 → 0.0.17

package/dist/module.json

@@ -1,5 +1,5 @@
 {
   "name": "light",
   "configKey": "light",
-  "version": "0.0.15"
+  "version": "0.0.17"
 }

package/dist/runtime/components/l-app-main.vue

@@ -1,7 +1,9 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
 import { useLight, q, getCurrentUser } from '../light';
-import { ref, computed, reactive } from 'vue';
+import { ref, computed, reactive, provide } from 'vue';
+
+
 
 
 const light = useLight();
@@ -12,6 +14,7 @@ const props = defineProps({
 });
 
 let app = await q("app", ["menus"]);
+const menus = ref(app.menus)
 
 const i18n = useI18n();
 i18n.locale = 'zh-hk';
@@ -37,8 +40,6 @@ if (user.value && user.value.roles.indexOf('Administrators') != -1) {
     showViewAs = true;
 }
 
-//const menus = (await queryContent("/menus").findOne()).menus;
-const menus = [];
 
 const menuOverlayHeader = ref(false)
 const layoutView = computed(() => {
@@ -100,6 +101,14 @@ const errors = computed(() => {
     return light.getErrors();
 })
 
+const reloadMenu = async () => {
+    //menus.value = app.menus;
+    let app = await q("app", ["menus"]);
+    menus.value = app.menus
+}
+
+provide('reloadMenu', reloadMenu)
+
 </script>
 
 
@@ -177,8 +186,7 @@ const errors = computed(() => {
             @mouseover="isMouseOnDrawer = true">
             <!-- drawer content -->
             <q-scroll-area class="fit">
-                <l-menu v-for="menu in app.menus" :value="menu" v-if="isAdmin" :dense="style.dense" />
-                <l-menu v-for="menu in menus" :value="menu" />
+                <l-menu v-for="menu in menus" :value="menu" v-if="isAdmin" :dense="style.dense" />
             </q-scroll-area>
         </q-drawer>
 
@@ -201,7 +209,7 @@ const errors = computed(() => {
                         error }}
                 </q-card-section>
             </q-card>
-            <slot />
+            <slot :reload="reloadMenu" />
         </q-page-container>
 
 

package/dist/runtime/components/l-menu.vue

@@ -1,6 +1,6 @@
 <script setup>
 
-defineProps(["value","dense"])
+defineProps(["value", "dense"])
 
 </script>
 
@@ -19,9 +19,9 @@ defineProps(["value","dense"])
 </style>
 
 <template>
-    <q-expansion-item v-if="value.menus" :label="value.label" :icon="value.icon" :dense="dense">
+    <q-expansion-item v-if="value.children?.length > 0" :label="value.label" :icon="value.icon" :dense="dense">
         <q-list class="q-pl-md">
-            <l-menu :value="menu" v-for="menu in value.menus" :dense="dense"></l-menu>
+            <l-menu :value="menu" v-for="menu in value.children" :dense="dense"></l-menu>
         </q-list>
     </q-expansion-item>
     <q-list v-else class="menu-list" :dense="dense">

package/dist/runtime/pages/System/menu/index.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { reactive, ref, computed } from 'vue';
+import { reactive, ref, computed, inject } from 'vue';
 import { m, q } from "../../../light";
 import { useQuasar } from 'quasar';
 
@@ -82,11 +82,12 @@ const onRemove = (node) => {
     }
 }
 
-const splitterModel = ref(50)
+const splitterModel = ref(38)
 
 const selectedNode = computed(() => {
     return tree1.value.getNodeByKey(selected.value);
 });
+const reloadMenu = inject('reloadMenu')
 
 const onSave = () => {
 
@@ -107,8 +108,10 @@ const onSave = () => {
                 position: 'top',
                 timeout: 1000,
             });
-        }
 
+            //
+        }
+        reloadMenu()
     });
 }
 
@@ -151,9 +154,31 @@ const onMoveToRoot = () => {
     menus.value.push(newNode);
 
     showMove.value = false;
+}
 
+const getParentNode = (node) => {
+    if (!node.parent) return menus.value;
+    return tree1.value.getNodeByKey(node.parent);
+}
 
+const onMoveUp = (node) => {
+    const parent = getParentNode(node);
+    const index = parent.children.findIndex((item) => item.uuid === node.uuid);
+    if (index > 0) {
+        const temp = parent.children[index - 1];
+        parent.children[index - 1] = node;
+        parent.children[index] = temp;
+    }
+}
 
+const onMoveDown = (node) => {
+    const parent = getParentNode(node);
+    const index = parent.children.findIndex((item) => item.uuid === node.uuid);
+    if (index < parent.children.length - 1) {
+        const temp = parent.children[index + 1];
+        parent.children[index + 1] = node;
+        parent.children[index] = temp;
+    }
 }
 </script>
 
@@ -199,6 +224,11 @@ const onMoveToRoot = () => {
                         <q-btn outline rounded color="primary" @click="onMove(selectedNode)" label="Move"
                             icon="sym_o_move" />
 
+                        <q-btn outline rounded color="primary" @click="onMoveUp(selectedNode)" label="Up"
+                            icon="sym_o_arrow_upward" />
+
+                        <q-btn outline rounded color="primary" @click="onMoveDown(selectedNode)" label="Up"
+                            icon="sym_o_arrow_downward" />
                     </q-card-section>
 
 

package/dist/runtime/pages/index.vue

@@ -1,8 +1,20 @@
+<script setup>
+import { inject } from "vue";
+
+
+const reloadMenu = inject('reloadMenu')
+
+const onClick = (parent) => {
+    reloadMenu()
+
+}
+</script>
 <template>
     <q-page padding>
         <l-card>
             <q-card-section>
-                Hello
+                Helloas
+                <q-btn label="click" @click="onClick($parent)"></q-btn>
             </q-card-section>
         </l-card>
     </q-page>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hostlink/nuxt-light",
-  "version": "0.0.15",
+  "version": "0.0.17",
   "description": "HostLink Nuxt Light Framework",
   "repository": "@hostlink/nuxt-light",
   "license": "MIT",