@hostlink/nuxt-light 1.21.1 → 1.21.3

package/dist/runtime/pages/Role/index.vue

@@ -1,23 +1,38 @@
 <script setup>
 import { useQuasar } from 'quasar'
-import { q, m, notify } from '#imports'
-import { ref } from "vue"
+import { q, m, notify, useAsyncData } from '#imports'
 import { useI18n } from 'vue-i18n';
 const { t } = useI18n();
 const qua = useQuasar();
-const quasar = useQuasar();
+const { data, refresh } = await useAsyncData('role', async () => {
+
+    const data = await q({
+        app: {
+            roles: {
+                name: true,
+                canDelete: true,
+                canUpdate: true,
+                children: true,
+                user: {
+                    name: true,
+                    user_id: true
+                }
+            },
+            listUser: {
+                data: {
+                    user_id: true,
+                    name: true
+                }
+            }
+        }
+    });
+    return data.app;
+})
 
-const loadData = async () => {
-    return await q("listRole", ["name", "canDelete", "canUpdate", "children", {
-        user: ["name", "user_id"]
-    }]);
-}
-const roles = ref(await loadData());
-let role_options = roles.value.map(r => ({ label: r.name, value: r.name }))
 
-const users = (await q("listUser", [{
-    data: ["user_id", "name"]
-}])).data;
+let role_options = data.value.roles.map(r => ({ label: r.name, value: r.name }))
+
+let users = data.value.listUser.data;
 
 const onDelete = async (role) => {
     //confirm
@@ -28,9 +43,9 @@ const onDelete = async (role) => {
         persistent: true,
     }).onOk(async () => {
 
-        m("deleteRole", { name: role })
-        //refresh
-        roles.value = await loadData();
+        await m("deleteRole", { name: role })
+        refresh();
+
     });
 
 }
@@ -66,8 +81,8 @@ const onRemoveChild = async (value, child) => {
     //notify
     notify("Role removed from role")
 
-    //refresh
-    roles.value = await loadData();
+    refresh();
+
 }
 
 const onAddChild = async (value, child) => {
@@ -79,9 +94,8 @@ const onAddChild = async (value, child) => {
 
     //notify
     notify("Role added to role")
+    refresh();
 
-    //refresh
-    roles.value = await loadData();
 }
 
 const onAddUser = async (value, user) => {
@@ -94,8 +108,7 @@ const onAddUser = async (value, user) => {
     //notify
     notify("User added to role")
 
-    //refresh
-    roles.value = await loadData();
+    refresh();
 }
 
 const onRemoveUser = async (value, user) => {
@@ -104,31 +117,27 @@ const onRemoveUser = async (value, user) => {
         user_id: user.value.user_id
 
     });
-
     //notify
     notify("User removed from role")
-
-    //refresh
-    roles.value = await loadData();
+    refresh();
 }
 </script>
 
 <template>
     <l-page>
-        <q-table :rows="roles" flat bordered :columns="columns" :rows-per-page-options="[0]" dense>
+        <q-table :rows="data.roles" flat bordered :columns="columns" :rows-per-page-options="[0]" dense>
             <template #body-cell-_can_delete="props">
                 <q-td auto-width>
                     <q-btn v-if="props.row.canDelete" flat round dense icon="sym_o_delete"
                         @click="onDelete(props.row.name)" />
-
                 </q-td>
             </template>
 
             <template #body-cell-children="props">
                 <q-td>
                     <q-select :options="role_options" v-model="props.row.children" multiple use-chips dense
-                        @remove="onRemoveChild(props.row.name, $event)" @add="onAddChild(props.row.name, $event)">
-
+                        @remove="onRemoveChild(props.row.name, $event)" @add="onAddChild(props.row.name, $event)"
+                        :color="$light.color">
                     </q-select>
                 </q-td>
             </template>
@@ -136,7 +145,7 @@ const onRemoveUser = async (value, user) => {
                 <q-td>
                     <q-select :options="users" v-model="props.row.user" multiple use-chips dense option-label="name"
                         option-value="user_id" @add="onAddUser(props.row.name, $event)"
-                        @remove="onRemoveUser(props.row.name, $event)">
+                        @remove="onRemoveUser(props.row.name, $event)" :color="$light.color">
 
                     </q-select>
                 </q-td>

package/dist/runtime/pages/System/database/backup.vue

@@ -33,7 +33,7 @@ const onClickDownload = async () => {
 }
 </script>
 <template>
-    <l-page>
+    <l-page title="Database backup">
         <l-btn label="Download" icon="sym_o_download" @click="onClickDownload"></l-btn>
     </l-page>
 </template>

package/dist/runtime/pages/System/database/table.vue

@@ -1,35 +1,34 @@
 <script setup>
-import { api, m, useLight } from '#imports';
-import { resolveComponent, ref, reactive } from 'vue';
+import { api, m, useLight, useAsyncData } from '#imports';
+import { resolveComponent, ref, reactive, computed } from 'vue';
 const light = useLight();
 
-const { system: { database } } = await api.query({
-    system: {
-        database: {
-            table: true,
-            version: true,
-            tableStatus: true
-        }
-
-    }
-})
-
-const tables = ref(database.table);
-
-const refresh = async () => {
-    const { system: { database } } = await api.query({
+const { data, refresh } = await useAsyncData('database', async () => {
+    const { system } = await api.query({
         system: {
             database: {
                 table: true,
-                version: true
+                version: true,
+                tableStatus: true
             }
         }
     })
-    tables.value = database.table;
-}
+    return system.database;
+})
+
+const SYSTEM_TABLES = ["Config", "EventLog", "MailLog", "Permission", "Role", "SystemValue", "Translate", "User", "UserLog", "UserRole"];
+
+const custom_tables = computed(() => {
+    return data.value.tableStatus.filter(table => !SYSTEM_TABLES.includes(table.Name))
+})
 
+const systables = computed(() => {
+    return data.value.tableStatus.filter(table => SYSTEM_TABLES.includes(table.Name))
+})
 
 const field_add = resolveComponent('l-dialog-database-field-add');
+
+const table_add = resolveComponent('l-database-create-table-dialog');
 const add = async (table) => {
     light.dialog({
         component: field_add
@@ -37,7 +36,7 @@ const add = async (table) => {
         //data.name
         //data.type
         try {
-            const addDatabaseField = await m("addDatabaseField", {
+            await m("lightDatabaseAddField", {
                 table,
                 field: data.name,
                 type: data.type,
@@ -46,11 +45,11 @@ const add = async (table) => {
                 nullable: data.nullable,
                 autoincrement: data.autoincrement
             })
+
             light.notify({
-                type: 'positive',
-                message: addDatabaseField
+                type: "positive",
+                message: "Field added successfully"
             })
-
             refresh();
 
         } catch (e) {
@@ -65,7 +64,7 @@ const add = async (table) => {
 
 const selected = reactive({});
 
-for (let table of database.table) {
+for (let table of data.value.table) {
     selected[table.name] = [];
 }
 
@@ -79,20 +78,16 @@ const removeField = async (table) => {
         ok: 'Yes',
         cancel: 'No'
     }).onOk(async () => {
-
-
         //map selected fields
-
         const fields = selected[table].map(field => field.Field)
-
         try {
-            const removeDatabaseFields = await m("removeDatabaseFields", {
+            await m("lightDatabaseRemoveFields", {
                 table,
                 fields: fields
             })
-            lgiht.notify({
+            light.notify({
                 type: 'positive',
-                message: removeDatabaseFields
+                message: "Fields removed successfully"
             })
 
             selected[table] = [];
@@ -106,28 +101,144 @@ const removeField = async (table) => {
         }
     })
 
+}
+
+const createTable = () => {
+    light.dialog({
+        component: table_add
+    }).onOk(async (data) => {
+        try {
+            await m("lightDatabaseCreateTable", {
+                name: data.name,
+                fields: data.fields
+            })
+            light.notify({
+                type: 'positive',
+                message: "Table created successfully"
+            })
+        } catch (e) {
+            light.notify({
+                type: 'negative',
+                message: e.message
+            })
+        }
+        refresh();
+    });
+}
+
+const selectedTable = ref([]);
+
+const removeTable = async () => {
+    light.dialog({
+        title: 'Remove table',
+        message: 'Are you sure you want to remove the selected tables?',
+        ok: 'Yes',
+        cancel: 'No'
+    }).onOk(async () => {
+        //map selected fields
+        const tables = selectedTable.value.map(table => table.Name)
+        try {
+            for (let table of tables) {
+                await m("lightDatabaseRemoveTable", {
+                    table
+                })
+            }
+
+        } catch (e) {
+            light.notify({
+                type: 'negative',
+                message: e.message
+            })
+            return;
+
+        }
+
+        light.notify({
+            type: 'positive',
+            message: "Tables removed successfully"
+        })
+
+        selectedTable.value = [];
+
+        refresh();
+    })
+}
+
+const truncatTable = async () => {
+    light.dialog({
+        title: 'Truncate table',
+        message: 'Are you sure you want to truncate the selected tables?',
+        ok: 'Yes',
+        cancel: 'No'
+    }).onOk(async () => {
+        //map selected fields
+        const tables = selectedTable.value.map(table => table.Name)
+        try {
+            for (let table of tables) {
+                await m("lightDatabaseTruncateTable", {
+                    table
+                })
+            }
 
+        } catch (e) {
+            light.notify({
+                type: 'negative',
+                message: e.message
+            })
+            return;
 
+        }
 
+        light.notify({
+            type: 'positive',
+            message: "Tables truncated successfully"
+        })
 
+        selectedTable.value = [];
 
+        refresh();
+    })
 }
 </script>
 <template>
-    <l-page gutter="sm">
+    <l-page title="Database">
         <l-card>
             <l-list>
-                <l-item label="Version">{{ database.version }}</l-item>
+                <l-item label="Version">{{ data.version }}</l-item>
             </l-list>
         </l-card>
 
-
         <q-card flat bordered>
-            <q-list class="rounded-borders" separator bordered>
+            <q-list separator bordered>
                 <q-expansion-item label="Table Status" dense>
-                    <div class="q-ma-sm">
-                        <q-table :rows="database.tableStatus" hide-pagination flat bordered separator="cell" dense
-                            :rows-per-page-options="[0]">
+                    <div class="q-ma-sm q-gutter-y-sm">
+
+                        <q-table :rows="custom_tables" hide-pagination flat bordered separator="cell" dense
+                            :rows-per-page-options="[0]" v-model:selected="selectedTable" selection="multiple"
+                            row-key="Name" @selection="onSelectionTable">
+
+                            <template #top-left>
+                                <q-btn icon="sym_o_add" @click="createTable()" round flat size="sm">
+                                    <q-tooltip>Create table</q-tooltip>
+                                </q-btn>
+                                <q-btn icon="sym_o_delete" @click="removeTable()" round flat size="sm"
+                                    :disable="selectedTable.length == 0">
+                                    <q-tooltip>Remove table</q-tooltip>
+                                </q-btn>
+
+                                <q-btn icon="sym_o_scan_delete" @click="truncatTable" round flat size="sm"
+                                    :disable="selectedTable.length == 0">
+                                    <q-tooltip>Truncate table</q-tooltip>
+                                </q-btn>
+
+                            </template>
+                        </q-table>
+
+
+
+                        <q-table :rows="systables" hide-pagination flat bordered separator="cell" dense
+                            :rows-per-page-options="[0]" row-key="Name" title="System tables">
+
                         </q-table>
                     </div>
                 </q-expansion-item>
@@ -135,21 +246,21 @@ const removeField = async (table) => {
         </q-card>
 
         <q-card flat bordered>
-            <q-list class="rounded-borders" separator bordered>
-                <q-expansion-item :label="table.name" v-for="table in tables" dense>
-                    <q-toolbar>
-                        <q-btn icon="sym_o_add" @click="add(table.name)" round flat size="sm">
-                            <q-tooltip>Add field</q-tooltip>
-                        </q-btn>
-                        <q-btn icon="sym_o_delete" @click="removeField(table.name)" round flat size="sm"
-                            :disable="selected[table.name].length == 0">
-                            <q-tooltip>Remove field</q-tooltip>
-                        </q-btn>
-                    </q-toolbar>
+            <q-list separator bordered>
+                <q-expansion-item :label="table.name" v-for="table in data.table" dense>
                     <div class="q-ma-sm">
                         <q-table row-key="Field" separator="cell" dense :rows="table.columns"
                             :rows-per-page-options="[0]" hide-pagination flat bordered selection="multiple"
                             v-model:selected="selected[table.name]">
+                            <template #top-left>
+                                <q-btn icon="sym_o_add" @click="add(table.name)" round flat size="sm">
+                                    <q-tooltip>Add field</q-tooltip>
+                                </q-btn>
+                                <q-btn icon="sym_o_delete" @click="removeField(table.name)" round flat size="sm"
+                                    :disable="selected[table.name].length == 0">
+                                    <q-tooltip>Remove field</q-tooltip>
+                                </q-btn>
+                            </template>
                         </q-table>
                     </div>
 

package/dist/runtime/pages/System/fs.vue

@@ -1,14 +1,19 @@
 <script setup>
-import { ref } from 'vue';
-import { m, q } from "#imports"
-const { app, listFileSystem } = await q({
-    app: {
-        driveTypes: true
-    },
-    listFileSystem: true
-});
-
-const items = ref(listFileSystem)
+import { ref, computed } from 'vue';
+import { m, q, useAsyncData } from "#imports"
+import { useQuasar } from "#imports"
+const $q = useQuasar()
+const { data: app, refresh } = await useAsyncData(async () => {
+    return (await q({
+        app: {
+            driveTypes: true,
+            listFileSystem: true
+        }
+    })).app;
+})
+
+
+const items = computed(() => app.value.listFileSystem)
 const dialog = ref(false)
 const value = ref({})
 
@@ -18,27 +23,34 @@ const onSubmit = async (data) => {
         data: data
     })
 
-    items.value.push(data)
     dialog.value = false
+    refresh()
 }
 
-const onRemove = async (row) => {
-    await m("deleteFileSystem", {
-        name: row.name
-    })
-    //reload data
+const onRemove = async (selected) => {
+
+    //confirm
+    $q.dialog({
+        title: 'Confirm',
+        message: 'Are you sure you want to delete this file system?',
+        ok: 'Yes',
+        cancel: 'No'
+    }).onOk(async () => {
+
+
+        for (let row of selected) {
+            await m("deleteFileSystem", {
+                name: row.name
+            })
+        }
+        selected.value = []
 
-    const { listFileSystem } = await q({ listFileSystem: true });
-    items.value = listFileSystem
 
+        refresh();
+    })
 }
 
 const columns = [
-    {
-        name: 'actions',
-        label: '',
-        align: 'center'
-    },
     {
         name: 'name',
         required: true,
@@ -62,13 +74,12 @@ const columns = [
         align: 'left',
     }
 ]
+
+const selected = ref([])
 </script>
 <template>
 
-    <l-page gutter="xs">
-        <template #header>
-            <l-btn label="Add" icon="sym_o_add" @click="dialog = true"></l-btn>
-        </template>
+    <l-page title="File system">
 
         <q-dialog v-model="dialog" persistent>
             <q-card style="width: 500px;">
@@ -133,12 +144,15 @@ const columns = [
             </q-card>
         </q-dialog>
 
-        <l-table :rows="items" :columns="columns">
-            <template #body-cell-actions="props">
-                <q-td auto-width>
-                    <q-btn icon="sym_o_delete" @click="onRemove(props.row)" round dense flat class="text-grey"></q-btn>
-                </q-td>
-
+        <q-table :rows="items" :columns="columns" selection="multiple" flat bordered dense separator="cell"
+            v-model:selected="selected" row-key="name">
+            <template #top-left>
+                <q-btn icon="sym_o_add" @click="dialog = true" flat round dense>
+                    <q-tooltip>Add File System</q-tooltip>
+                </q-btn>
+                <q-btn icon="sym_o_delete" @click="onRemove(selected)" flat round dense :disable="selected.length == 0">
+                    <q-tooltip>Remove File System</q-tooltip>
+                </q-btn>
             </template>
 
             <template #body-cell-data="props">
@@ -147,6 +161,6 @@ const columns = [
                 </q-td>
             </template>
 
-        </l-table>
+        </q-table>
     </l-page>
 </template>

package/dist/runtime/pages/System/mailtest.vue

@@ -32,7 +32,7 @@ const onSubmit = async (data) => {
 }
 </script>
 <template>
-    <l-page>
+    <l-page title="Mail test">
         <form-kit type="l-form" @submit="onSubmit" :value="{
             email: my.email,
             subject: 'Test email',

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

@@ -1,7 +1,11 @@
 <script setup>
 import { ref, computed } from 'vue'
 import { q } from '#imports'
-const { system } = await q({ system: ["package"] })
+const { system } = await q({
+    system: {
+        package: true
+    }
+})
 const filter = ref("")
 const filtered = computed(() => {
     if (!filter.value) return system.package
@@ -14,7 +18,7 @@ const filtered = computed(() => {
 
 </script>
 <template>
-    <l-page>
+    <l-page title="System package">
         <q-table dense :rows="filtered" :rows-per-page-options="[0]" hide-pagination flat bordered separator="cell">
             <template v-slot:top-right>
                 <q-input outlined dense debounce="300" v-model="filter" placeholder="Search">

package/dist/runtime/pages/System/phpinfo.vue

@@ -1,9 +1,13 @@
 <script setup>
-import { q } from '../../'
-const { system } = await q({ system: ["phpInfo"] })
+import { q } from '#imports'
+const { system } = await q({
+    system: {
+        phpInfo: true
+    }
+})
 </script>
 <template>
-    <l-page>
+    <l-page title="PHP info">
         <iframe :srcdoc="system.phpInfo" style="height: 700px;" class="full-width no-border"></iframe>
     </l-page>
 </template>

package/dist/runtime/pages/System/setting.vue

@@ -32,7 +32,6 @@ const obj = app.config.reduce((acc, cur) => {
     return acc
 }, {});
 
-obj.revision = obj.revision ? obj.revision.split(',') : []
 
 
 const onSubmit = async (d) => {
@@ -76,7 +75,7 @@ const onSubmit = async (d) => {
                     <l-system-setting-general v-if="tab == 'general'" v-model="obj" />
                     <l-system-setting-mail v-if="tab == 'mail'" v-bind="obj" @submit="onSubmit" />
                     <l-system-setting-security v-if="tab == 'security'" v-bind="obj" @submit="onSubmit" />
-                    <l-system-setting-modules v-if="tab == 'Modules'" v-model="obj" />
+                    <l-system-setting-modules v-if="tab == 'Modules'" v-bind="obj" @submit="onSubmit" />
                     <l-system-setting-developer v-if="tab == 'developer'" v-model="obj" />
                     <l-system-setting-forget-password v-if="tab == 'forget-password'" v-model="obj" />
                     <l-system-setting-authentication v-if="tab == 'authentication'" v-bind="obj" @submit="onSubmit" />