@hostlink/nuxt-light 1.13.6 → 1.14.0

package/dist/runtime/formkit/Form.vue

@@ -23,10 +23,16 @@ let bordered = true;
 if (props.context.bordered !== undefined) {
     bordered = props.context.bordered;
 }
-const loading = ref(false);
+
+let redirect = true;
+if (props.context.attrs.onSubmitted) {
+    redirect = false;
+}
+
+
 if (!props.context.onSubmit) {
     props.context.node.props.onSubmit = async function () {
-        loading.value = true;
+
         const [module, id_name] = route.name.split("-");
 
 
@@ -46,8 +52,9 @@ if (!props.context.onSubmit) {
                         color: "positive",
                         icon: "sym_o_check"
                     });
-                    router.go(-1);
-                    return;
+                    if (redirect) {
+                        router.go(-1);
+                    }
                 }
             } else {
                 if (await model(module).add(v)) {
@@ -56,10 +63,16 @@ if (!props.context.onSubmit) {
                         color: "positive",
                         icon: "sym_o_check"
                     });
-                    router.go(-1);
-                    return;
+
+                    if (redirect) {
+                        router.go(-1);
+                    }
                 }
             }
+            //emit submitted event
+            if (props.context.attrs.onSubmitted) {
+                props.context.attrs.onSubmitted(v);
+            }
         } catch (e) {
             quasar.dialog({
                 title: "Error",
@@ -67,7 +80,7 @@ if (!props.context.onSubmit) {
                 ok: "OK"
             });
         }
-        loading.value = false;
+
     }
 
 }
@@ -84,8 +97,8 @@ if (!props.context.onSubmit) {
             </q-card-section>
 
             <q-card-actions align="right">
-                <l-btn icon="sym_o_check" label="Submit" @click="onSubmit" :disabled="!context.state.dirty"
-                    :loading="loading"></l-btn>
+                <l-btn icon="sym_o_check" :label="context.submitLabel ?? 'Submit'" @click="onSubmit"
+                    :disabled="!context.state.dirty" :loading="context.state.loading"></l-btn>
             </q-card-actions>
         </l-card>
     </form>

package/dist/runtime/index.d.ts

@@ -33,7 +33,7 @@ declare const app: {
     getCompany: () => string;
     setCompanyLogo: (logo: string) => void;
     getCompanyLogo: () => string;
-    getVersion: () => any;
+    getVersion: () => string;
     addError: (error: String) => void;
     getErrors: () => String[];
     removeError: (error: String) => void;
@@ -82,7 +82,7 @@ export declare const useLight: (options?: {
     getCompany: () => string;
     setCompanyLogo: (logo: string) => void;
     getCompanyLogo: () => string;
-    getVersion: () => any;
+    getVersion: () => string;
     addError: (error: String) => void;
     getErrors: () => String[];
     removeError: (error: String) => void;
@@ -98,4 +98,4 @@ export declare const useLight: (options?: {
     isGranted: (right?: string) => boolean;
     setPermissions: (permissions: Array<string>) => void;
 };
-export * from "./lib";
+export * from "./lib.js";

package/dist/runtime/{index.mjs → index.js}

@@ -1,6 +1,6 @@
 import packageJson from "../../package.json";
 import { watch, reactive, toRaw } from "vue";
-import { m, q } from "./lib/index.mjs";
+import { m, q } from "./lib/index.js";
 const errors = [];
 let styles = {};
 const COLOR_CODE = {
@@ -207,4 +207,4 @@ export const useLight = (options = {}) => {
   }
   return app;
 };
-export * from "./lib/index.mjs";
+export * from "./lib/index.js";

package/dist/runtime/lib/{SystemValue.mjs → SystemValue.js}

@@ -1,5 +1,5 @@
-import sv from "./sv.mjs";
-import { cache } from "./sv.mjs";
+import sv from "./sv.js";
+import { cache } from "./sv.js";
 export const loadSV = (name) => {
   return () => sv(name);
 };

package/dist/runtime/lib/defineLightModel.d.ts

@@ -19,5 +19,5 @@ export interface LightModel {
     name: string;
     fields: LightModelFields;
 }
-declare const _default: (model: LightModel) => any;
+declare const _default: (model: LightModel) => import("#app").Plugin<Record<string, unknown>> & import("#app").ObjectPlugin<Record<string, unknown>>;
 export default _default;

package/dist/runtime/lib/{defineLightModel.mjs → defineLightModel.js}

@@ -1,5 +1,5 @@
 import { defineNuxtPlugin } from "#app";
-import { default as api } from "./api.mjs";
+import { default as api } from "./api.js";
 export default (model) => {
   return defineNuxtPlugin(() => {
     api.models.create(model.name, model.fields);

package/dist/runtime/lib/{f.mjs → f.js}

@@ -1,5 +1,5 @@
 import { jsonToGraphQLQuery } from "json-to-graphql-query";
-import toJson from "./toJson.mjs";
+import toJson from "./toJson.js";
 export default function(operation, args, fields = []) {
   if (arguments.length === 2) {
     fields = args;

package/dist/runtime/lib/{getApiUrl.mjs → getApiUrl.js}

@@ -1,4 +1,4 @@
-import { getApiBase } from "./index.mjs";
+import { getApiBase } from "./index.js";
 export default function getApiUrl(url, params) {
   const urlParams = new URLSearchParams(params).toString();
   return getApiBase() + `${url}?${urlParams}`;

package/dist/runtime/lib/{getCurrentUser.mjs → getCurrentUser.js}

@@ -1,4 +1,4 @@
-import q from "./q.mjs";
+import q from "./q.js";
 export default async () => {
   try {
     return await q("my", ["username", "first_name", "last_name", "roles"]);

package/dist/runtime/lib/{getGQLFields.mjs → getGQLFields.js}

@@ -1,4 +1,4 @@
-import { api } from "./index.mjs";
+import { api } from "./index.js";
 export default (name, fields) => {
   return api.model(name).gqlFields(fields);
 };

package/dist/runtime/lib/{getID.mjs → getID.js}

@@ -1,4 +1,4 @@
-import { useLight } from "../index.mjs";
+import { useLight } from "../index.js";
 export default () => {
   return useLight().getID();
 };

package/dist/runtime/lib/{getModelColumns.mjs → getModelColumns.js}

@@ -1,4 +1,4 @@
-import { default as getModelField } from "./getModelField.mjs";
+import { default as getModelField } from "./getModelField.js";
 export default (model, names) => {
   let columns = [];
   for (let name of names) {

package/dist/runtime/lib/{getModelField.mjs → getModelField.js}

@@ -1,4 +1,4 @@
-import { default as api } from "./api.mjs";
+import { default as api } from "./api.js";
 export default (name, field) => {
   return api.model(name).field(field);
 };

package/dist/runtime/lib/{getModelFields.mjs → getModelFields.js}

@@ -1,4 +1,4 @@
-import { default as getModelField } from "./getModelField.mjs";
+import { default as getModelField } from "./getModelField.js";
 export default (model, names) => {
   let fields = [];
   for (let name of names) {

package/dist/runtime/lib/{getObject.mjs → getObject.js}

@@ -1,6 +1,6 @@
 import { useRoute } from "vue-router";
-import loadObject from "./loadObject.mjs";
-import { default as getModelField } from "./getModelField.mjs";
+import loadObject from "./loadObject.js";
+import { default as getModelField } from "./getModelField.js";
 export default async function(fields = []) {
   let route = useRoute();
   if (!route.name) {

package/dist/runtime/lib/index.d.ts

@@ -1,25 +1,25 @@
-export { default as api } from "./api";
-export { default as f } from "./f";
-export { default as getApiUrl } from "./getApiUrl";
-export { default as getCurrentUser } from "./getCurrentUser";
-export { default as getObject } from "./getObject";
-export { default as list } from "./list";
-export { default as m } from "./m";
-export { default as q } from "./q";
-export { default as t } from "./t";
-export { default as listObject } from "./listObject";
-export { default as loadObject } from "./loadObject";
-export { default as isGranted } from "./isGranted";
-export { default as GQLFieldBuilder } from "./GQLFieldBuilder";
-export { default as getModelField } from "./getModelField";
-export { default as getModelFields } from "./getModelFields";
-export { default as getModelColumns } from "./getModelColumns";
-export { default as sv } from "./sv";
-export { default as model } from "./model";
-export { default as defineLightModel } from "./defineLightModel";
-export { type LightModelField, type LightModel } from "./defineLightModel";
+export { default as api } from "./api.js";
+export { default as f } from "./f.js";
+export { default as getApiUrl } from "./getApiUrl.js";
+export { default as getCurrentUser } from "./getCurrentUser.js";
+export { default as getObject } from "./getObject.js";
+export { default as list } from "./list.js";
+export { default as m } from "./m.js";
+export { default as q } from "./q.js";
+export { default as t } from "./t.js";
+export { default as listObject } from "./listObject.js";
+export { default as loadObject } from "./loadObject.js";
+export { default as isGranted } from "./isGranted.js";
+export { default as GQLFieldBuilder } from "./GQLFieldBuilder.js";
+export { default as getModelField } from "./getModelField.js";
+export { default as getModelFields } from "./getModelFields.js";
+export { default as getModelColumns } from "./getModelColumns.js";
+export { default as sv } from "./sv.js";
+export { default as model } from "./model.js";
+export { default as defineLightModel } from "./defineLightModel.js";
+export { type LightModelField, type LightModel } from "./defineLightModel.js";
 export declare const notify: (message: string, color?: string) => void;
-export { default as getID } from "./getID";
-export { default as id } from "./getID";
+export { default as getID } from "./getID.js";
+export { default as id } from "./getID.js";
 export declare const getApiBase: () => {};
-export { default as getGQLFields } from "./getGQLFields";
+export { default as getGQLFields } from "./getGQLFields.js";

package/dist/runtime/lib/index.js

@@ -0,0 +1,35 @@
+import { useRuntimeConfig } from "nuxt/app";
+import { Notify } from "quasar";
+export { default as api } from "./api.js";
+export { default as f } from "./f.js";
+export { default as getApiUrl } from "./getApiUrl.js";
+export { default as getCurrentUser } from "./getCurrentUser.js";
+export { default as getObject } from "./getObject.js";
+export { default as list } from "./list.js";
+export { default as m } from "./m.js";
+export { default as q } from "./q.js";
+export { default as t } from "./t.js";
+export { default as listObject } from "./listObject.js";
+export { default as loadObject } from "./loadObject.js";
+export { default as isGranted } from "./isGranted.js";
+export { default as GQLFieldBuilder } from "./GQLFieldBuilder.js";
+export { default as getModelField } from "./getModelField.js";
+export { default as getModelFields } from "./getModelFields.js";
+export { default as getModelColumns } from "./getModelColumns.js";
+export { default as sv } from "./sv.js";
+export { default as model } from "./model.js";
+export { default as defineLightModel } from "./defineLightModel.js";
+export const notify = function(message, color = "positive") {
+  Notify.create({
+    message,
+    color,
+    position: "top"
+  });
+};
+export { default as getID } from "./getID.js";
+export { default as id } from "./getID.js";
+export const getApiBase = () => {
+  const config = useRuntimeConfig();
+  return config?.public?.apiBase ?? "/api/";
+};
+export { default as getGQLFields } from "./getGQLFields.js";

package/dist/runtime/lib/{list.mjs → list.js}

@@ -1,5 +1,5 @@
 import { toQuery } from "@hostlink/light";
-import { default as api } from "./api.mjs";
+import { default as api } from "./api.js";
 export default async function list(name, props = null, fields = []) {
   let q = {};
   if (props) {

package/dist/runtime/lib/{listObject.mjs → listObject.js}

@@ -1,4 +1,4 @@
-import list from "./list.mjs";
+import list from "./list.js";
 export default async function listObject(name, filters = {}, sort, offset, limit, fields = []) {
   const resp = await list(name, {
     filters,

package/dist/runtime/lib/{loadObject.mjs → loadObject.js}

@@ -1,4 +1,4 @@
-import list from "./list.mjs";
+import list from "./list.js";
 export default async function(module, filters, fields = []) {
   let { data } = await list(module, {
     filters

package/dist/runtime/lib/{m.mjs → m.js}

@@ -1,4 +1,4 @@
-import { default as api } from "./api.mjs";
+import { default as api } from "./api.js";
 export default function(operation, args, fields = []) {
   return api.mutation(operation, args, fields);
 }

package/dist/runtime/lib/model.d.ts

@@ -1,5 +1,5 @@
-import { default as api } from "./api";
-import type { LTableColumn } from "../components/l-table.vue";
+import { default as api } from "./api.js";
+import type { LTableColumn } from "../components/l-table.vue.js";
 interface LModel extends ReturnType<typeof api.model> {
     columns(fields: string[]): Array<LTableColumn>;
 }

package/dist/runtime/lib/{model.mjs → model.js}

@@ -1,4 +1,4 @@
-import { default as api } from "./api.mjs";
+import { default as api } from "./api.js";
 export default (name) => {
   const m = api.model(name);
   return Object.assign(m, {

package/dist/runtime/lib/{q.mjs → q.js}

@@ -1,7 +1,7 @@
-import f from "./f.mjs";
+import f from "./f.js";
 import { jsonToGraphQLQuery } from "json-to-graphql-query";
 import { toQuery } from "@hostlink/light";
-import { api } from "./index.mjs";
+import { api } from "./index.js";
 export default async function(operation, args = null, fields = []) {
   let query;
   if (operation instanceof Object) {

package/dist/runtime/lib/{sv.mjs → sv.js}

@@ -1,4 +1,4 @@
-import { default as api } from "./api.mjs";
+import { default as api } from "./api.js";
 export const cache = {};
 export default (name) => {
   if (cache[name]) {

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

@@ -1,24 +1,143 @@
 <script setup>
-import { api } from '#imports';
+import { api, m } from '#imports';
+import { useQuasar } from 'quasar';
+import { resolveComponent, ref, reactive } from 'vue';
+
+const $q = useQuasar();
 
 const { system: { database } } = await api.query({
     system: {
         database: {
-            table: true
+            table: true,
+            version: true
         }
     }
 })
 
+const tables = ref(database.table);
+
+const refresh = async () => {
+    const { system: { database } } = await api.query({
+        system: {
+            database: {
+                table: true,
+                version: true
+            }
+        }
+    })
+    tables.value = database.table;
+}
+
+
+const field_add = resolveComponent('l-dialog-database-field-add');
+const add = async (table) => {
+    $q.dialog({
+        component: field_add
+    }).onOk(async (data) => {
+        //data.name
+        //data.type
+        try {
+            const addDatabaseField = await m("addDatabaseField", {
+                table,
+                field: data.name,
+                type: data.type,
+                length: data.length,
+                default: data.default,
+                nullable: data.nullable,
+                autoincrement: data.autoincrement
+            })
+            $q.notify({
+                type: 'positive',
+                message: addDatabaseField
+            })
+
+            refresh();
+
+        } catch (e) {
+            $q.notify({
+                type: 'negative',
+                message: e.message
+            })
+        }
+    })
+
+}
+
+const selected = reactive({});
+
+for (let table of database.table) {
+    selected[table.name] = [];
+}
+
+
+const removeField = async (table) => {
+    //confirmation
+
+    $q.dialog({
+        title: 'Remove field',
+        message: 'Are you sure you want to remove the selected fields?',
+        ok: 'Yes',
+        cancel: 'No'
+    }).onOk(async () => {
 
+
+        //map selected fields
+
+        const fields = selected[table].map(field => field.Field)
+
+        try {
+            const removeDatabaseFields = await m("removeDatabaseFields", {
+                table,
+                fields: fields
+            })
+            $q.notify({
+                type: 'positive',
+                message: removeDatabaseFields
+            })
+
+            selected[table] = [];
+
+            refresh();
+        } catch (e) {
+            $q.notify({
+                type: 'negative',
+                message: e.message
+            })
+        }
+    })
+
+
+
+
+
+
+}
 </script>
 <template>
-    <l-page>
+    <l-page gutter="sm">
+        <l-card>
+            <l-list>
+                <l-item label="Version">{{ database.version }}</l-item>
+            </l-list>
+        </l-card>
+
         <q-card flat bordered>
             <q-list class="rounded-borders" separator bordered>
-                <q-expansion-item :label="table.name" v-for="table in database.table" dense>
+                <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>
                     <div class="q-ma-sm">
-                        <q-table separator="cell" dense :rows="table.columns" :rows-per-page-options="[0]"
-                            hide-pagination flat bordered></q-table>
+                        <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]">
+                        </q-table>
                     </div>
 
                 </q-expansion-item>

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

@@ -2,9 +2,10 @@
 import { list, m } from '#imports'
 import { useRouter } from "vue-router"
 import { ref, computed } from "vue"
-import { Dialog } from 'quasar'
+import { useQuasar } from 'quasar'
+const $q = useQuasar()
 
-let { data: users } = await list("User", null, ["user_id", "username", "name", "roles"]);
+let { data: users } = await list("User", null, ["user_id", "username", "name", "roles", "email"]);
 
 let columns = [
     {
@@ -19,6 +20,12 @@ let columns = [
         field: "name",
         align: "left",
     }, {
+        name: "email",
+        label: "Email",
+        align: "left",
+        field: "email"
+    },
+    {
         name: "roles",
         label: "Roles",
         align: "left",
@@ -30,17 +37,14 @@ let columns = [
     }
 ]
 
-const router = useRouter();
 const onCickView = async (id) => {
     try {
         if (await m("viewAs", { user_id: id })) {
-
             //redirect to last path
             window.location.reload();
-
         }
     } catch (e) {
-        Dialog.create({
+        $q.dialog({
             title: "Error",
             message: e.message,
             color: "negative",
@@ -62,11 +66,11 @@ const filtered = computed(() => {
 </script>
 <template>
     <l-page class="q-gutter-md">
-        <q-banner >
+        <q-banner>
             Use this page to view the system as another user. This is useful for testing permissions.
         </q-banner>
 
-        <q-table flat :columns="columns" :rows="filtered" :rows-per-page-options="[0]" dense>
+        <q-table flat :columns="columns" :rows="filtered" :rows-per-page-options="[0]" dense bordered="">
             <template v-slot:top-right>
                 <q-input outlined dense debounce="300" v-model="filter" placeholder="Search" clearable>
                     <template v-slot:append>

package/dist/runtime/pages/User/_user_id/edit.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { reactive } from 'vue'
+import { reactive, ref } from 'vue'
 import { getObject, q } from '#imports'
 const obj = reactive(await getObject(["username", "first_name", "last_name", "email", "phone",
     "addr1", "addr2", "addr3", "join_date", "expiry_date", "status", "language", "default_page"
@@ -20,7 +20,6 @@ const languages = tt.app.languages.map((lang) => {
         value: lang.value,
     };
 })
-
 </script>
 
 <template>
@@ -45,7 +44,8 @@ const languages = tt.app.languages.map((lang) => {
                     <FormKit type="l-date-picker" label="Join date" name="join_date" validation="required" />
                     <FormKit type="l-date-picker" label="Expiry date" name="expiry_date" />
                     <FormKit type="l-select" label="Status" name="status" :options="options" validation="required" />
-                    <FormKit type="l-select" label="Language" name="language" :options="languages" validation="required" />
+                    <FormKit type="l-select" label="Language" name="language" :options="languages"
+                        validation="required" />
                     <FormKit type="l-input" label="Default page" name="default_page" />
                 </l-col>
             </l-row>

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

@@ -16,6 +16,8 @@ const columns = model("User").columns({
     has2FA: true,
 })
 
+console.log(columns);
+
 const status = ref("0");
 
 </script>

package/dist/runtime/pages/User/profile.vue

@@ -82,22 +82,14 @@ eventLogCols.forEach(col => {
             </l-col>
 
             <l-col md="8">
-
                 <l-tabs>
-                    <l-tab label="User Log">
-                        <l-table :rows="my.userLog.data" :columns="userlogColumns" searchable
-                            :rows-per-page-options="[0]">
-                        </l-table>
+                    <l-tab label="User Log" name="user_log">
+                        <l-table :rows="my.userLog.data" searchable :columns="userlogColumns" hide-pagination />
                     </l-tab>
-                    <l-tab label="Event Log">
-                        <l-table :rows="my.eventLog.data" :columns="eventLogCols" searchable
-                            :rows-per-page-options="[0]">
-                        </l-table>
+                    <l-tab label="Event Log" name="event_log">
+                        <l-table :rows="my.eventLog.data" :columns="eventLogCols" searchable hide-pagination />
                     </l-tab>
-
                 </l-tabs>
-
-
             </l-col>
         </l-row>
 

package/dist/runtime/pages/User/setting/open_id.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { reactive, onMounted, nextTick } from "vue"
 import { useQuasar } from "quasar";
-import { q, m } from '#imports'
+import { q, m, api } from '#imports'
 const quasar = useQuasar();
 let { app, my } = await q({ app: ['googleClientId'], my: ["gmail"] })
 
@@ -79,16 +79,12 @@ const unlink = async () => {
 
         <template v-if="app.googleClientId">
             <q-card-section v-if="my.gmail">
-                You have already linked your Google account.<br />
-
-                Your gmail is {{ my.gmail }}
-
-
-
-                <div>
-                    <l-btn label="Unlink" @click="unlink" icon="sym_o_delete"></l-btn>
-                </div>
+                <p>
+                    You have already linked your Google account.<br />
 
+                    Your gmail is {{ my.gmail }}
+                </p>
+                <l-btn label="Unlink" @click="unlink" icon="sym_o_delete"></l-btn>
             </q-card-section>
 
             <q-card-section v-else>