@hostlink/nuxt-light 1.2.1 → 1.3.1

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

@@ -138,12 +138,17 @@ const attrs = computed(() => {
 
     if (props.label) {
         a.label = i18n.t(props.label);
+
+        if (props.required) {
+            a.label = "* " + a.label;
+        }
+
     }
     return a;
 })
 </script>
 <template>
-    <q-input v-bind="attrs" v-model="localValue" :rules="new_rules"  :type="localType">
+    <q-input v-bind="attrs" v-model="localValue" :rules="new_rules" :type="localType">
         <template v-if="translate" #prepend>
             <q-btn icon="sym_o_translate" flat dense rounded>
                 <q-menu dense>

package/dist/runtime/index.d.ts

@@ -5,6 +5,10 @@ declare const app: {
     theme: string;
     isAdmin: boolean;
     permissions: string[];
+    myFavorites: any[];
+    setMyFavorites: (favorites: any[]) => void;
+    reloadMyFavorites: () => Promise<void>;
+    getMyFavorites: () => any[];
     isDarkMode: () => boolean;
     setCompany: (company: string) => void;
     getCompany: () => string;
@@ -38,6 +42,10 @@ export declare const useLight: () => {
     theme: string;
     isAdmin: boolean;
     permissions: string[];
+    myFavorites: any[];
+    setMyFavorites: (favorites: Array<any>) => void;
+    reloadMyFavorites: () => Promise<void>;
+    getMyFavorites: () => any[];
     isDarkMode: () => boolean;
     setCompany: (company: string) => void;
     getCompany: () => string;

package/dist/runtime/index.mjs

@@ -1,6 +1,6 @@
 import packageJson from "../../package.json";
 import { watch, reactive } from "vue";
-import { m } from "./lib/index.mjs";
+import { m, q } from "./lib/index.mjs";
 const errors = [];
 let styles = {};
 let defaultStyle = {
@@ -17,6 +17,26 @@ const app = reactive({
   theme: "light",
   isAdmin: false,
   permissions: Array(),
+  myFavorites: Array(),
+  setMyFavorites: (favorites) => {
+    app.myFavorites = favorites;
+  },
+  reloadMyFavorites: async () => {
+    const data = await q({
+      my: {
+        myFavorites: {
+          my_favorite_id: true,
+          label: true,
+          path: true,
+          icon: true
+        }
+      }
+    });
+    app.myFavorites = data.my.myFavorites;
+  },
+  getMyFavorites: () => {
+    return app.myFavorites;
+  },
   isDarkMode: () => {
     return app.theme == "dark";
   },

package/dist/runtime/locales/zh-hk.json

@@ -1,4 +1,7 @@
 {
+    "Developer": "開發者",
+    "Modules": "模組",
+    "Security": "安全",
     "Password policy": "密碼規則",
     "Must contain at least {0} characters": "必須包含至少{0}個字元",
     "contains_symbol": "必須包含符號",

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

@@ -1,10 +1,10 @@
 <script setup>
+import { ref } from 'vue'
 import { Notify } from 'quasar'
 import { reset } from "@formkit/core"
 import { useRouter } from 'vue-router'
-import { q, m } from '../../'
+import { q, m } from '#imports'
 
-const router = useRouter()
 const { app } = await q({ app: { config: ["name", "value"] } })
 const obj = app.config.reduce((acc, cur) => {
     acc[cur.name] = cur.value
@@ -63,65 +63,104 @@ if (obj.mode != 'prod') {
     obj.mode = 'prod'
 }
 
+const tab = ref('general')
 
 </script>
 <template>
     <l-page>
-        <FormKit type="l-form" :value="obj" #default="{ value }" @submit="onSubmit">
-            <FormKit type="l-input" label="Company" name="company" validation="required"></FormKit>
-            <FormKit type="l-input" label="Company logo" name="company_logo"></FormKit>
-
-            <q-separator />
-
-            <q-field label="Password policy" stack-label>
-                <FormKit type="q-checkbox" label="Upper Case" name="password_contains_uppercase" true-value="1"
-                    false-value="0" />
-                <FormKit type="q-checkbox" label="Lower Case" name="password_contains_lowercase" true-value="1"
-                    false-value="0" />
-                <FormKit type="q-checkbox" label="Number" name="password_contains_numeric" true-value="1" false-value="0" />
-                <FormKit type="q-checkbox" label="Special Character" name="password_contains_symbol" true-value="1"
-                    false-value="0" />
-            </q-field>
-
-            <FormKit type="l-input" label="Password min Length" name="password_min_length" validation="required|number">
-            </FormKit>
-
-            <q-field label="File manager" stack-label>
-                <FormKit type="q-checkbox" label="Show" name="file_manager" true-value="1" false-value="0" />
-            </q-field>
-
-            <q-field label="Two factor authentication" stack-label>
-                <FormKit type="q-checkbox" label="Enable" name="two_factor_authentication" true-value="1" false-value="0" />
-            </q-field>
-
-            <FormKit label="Mode" type="l-select" :options="[
-                { label: 'Production', value: 'prod' },
-                { label: 'Development', value: 'dev' },
-
-            ]" name="mode" validation="required">
-            </FormKit>
-
-            <q-separator />
-
-            <FormKit label="Auth lockout duration" type="l-input" name="auth_lockout_duration"
-                hint="The number of minutes the user is locked out after the maximum number of failed login attempts. Default is 15 minutes."
-                validation="required" />
-
-            <FormKit label="Auth lockout attempts" type="l-input" name="auth_lockout_attempts"
-                hint="The number of failed login attempts before the user is locked out. Default is 5 attempts."
-                validation="required" />
-
-            <FormKit label="Access token expiration" type="l-input" name="access_token_expire"
-                hint="The access token expiration time in seconds. Default is 28800 seconds (8 hours)."
-                validation="required" />
-
-            <q-separator />
-
-            <FormKit label="Copyright name" type="l-input" name="copyright_name" validation="required" />
-            <FormKit label="Copyright year" type="l-input" name="copyright_year" validation="required" />
-
-
-        </FormKit>
 
+        <q-card flat bordered>
+            <q-splitter unit="px" :model-value="120">
+                <template #before>
+                    <q-tabs v-model="tab" vertical :active-color="$light.color">
+                        <q-tab name="general" icon="sym_o_info" :label="$t('General')" />
+                        <q-tab name="security" icon="sym_o_security" :label="$t('Security')" />
+                        <q-tab name="Modules" icon="sym_o_apps" :label="$t('Modules')" />
+                        <q-tab name="Developer" icon="sym_o_code" :label="$t('Developer')" />
+                    </q-tabs>
+                </template>
+                <template #after>
+                    <FormKit type="l-form" :value="{
+                        company: obj.company,
+                        company_logo: obj.company_logo,
+                        copyright_name: obj.copyright_name,
+                        copyright_year: obj.copyright_year
+                    }" v-if="tab == 'general'" @submit="onSubmit">
+                        <FormKit type="l-input" label="Company" name="company" validation="required"></FormKit>
+                        <FormKit type="l-input" label="Company logo" name="company_logo"></FormKit>
+
+                        <FormKit label="Copyright name" type="l-input" name="copyright_name" validation="required" />
+                        <FormKit label="Copyright year" type="l-input" name="copyright_year" validation="required" />
+
+                    </FormKit>
+
+                    <FormKit type="l-form" :value="{
+                        password_contains_uppercase: obj.password_contains_uppercase,
+                        password_contains_lowercase: obj.password_contains_lowercase,
+                        password_contains_numeric: obj.password_contains_numeric,
+                        password_contains_symbol: obj.password_contains_symbol,
+                        password_min_length: obj.password_min_length,
+                        two_factor_authentication: obj.two_factor_authentication,
+                        auth_lockout_duration: obj.auth_lockout_duration,
+                        auth_lockout_attempts: obj.auth_lockout_attempts,
+                        access_token_expire: obj.access_token_expire,
+                    }" v-if="tab == 'security'" @submit="onSubmit">
+                        <q-field label="Password policy" stack-label>
+                            <FormKit type="q-checkbox" label="Upper Case" name="password_contains_uppercase" true-value="1"
+                                false-value="0" />
+                            <FormKit type="q-checkbox" label="Lower Case" name="password_contains_lowercase" true-value="1"
+                                false-value="0" />
+                            <FormKit type="q-checkbox" label="Number" name="password_contains_numeric" true-value="1"
+                                false-value="0" />
+                            <FormKit type="q-checkbox" label="Special Character" name="password_contains_symbol"
+                                true-value="1" false-value="0" />
+                        </q-field>
+
+                        <FormKit type="l-input" label="Password min Length" name="password_min_length"
+                            validation="required|number">
+                        </FormKit>
+
+
+                        <q-field label="Two factor authentication" stack-label>
+                            <FormKit type="q-checkbox" label="Enable" name="two_factor_authentication" true-value="1"
+                                false-value="0" />
+                        </q-field>
+
+                        <FormKit label="Auth lockout duration" type="l-input" name="auth_lockout_duration"
+                            hint="The number of minutes the user is locked out after the maximum number of failed login attempts. Default is 15 minutes."
+                            validation="required" />
+
+                        <FormKit label="Auth lockout attempts" type="l-input" name="auth_lockout_attempts"
+                            hint="The number of failed login attempts before the user is locked out. Default is 5 attempts."
+                            validation="required" />
+
+                        <FormKit label="Access token expiration" type="l-input" name="access_token_expire"
+                            hint="The access token expiration time in seconds. Default is 28800 seconds (8 hours)."
+                            validation="required" />
+                    </FormKit>
+
+                    <FormKit type="l-form" :value="{
+                        file_manager: obj.file_manager,
+
+                    }" v-if="tab == 'Modules'" @submit="onSubmit">
+                        <q-field label="File manager" stack-label>
+                            <FormKit type="q-checkbox" label="Show" name="file_manager" true-value="1" false-value="0" />
+                        </q-field>
+                    </FormKit>
+
+                    <FormKit type="l-form" :value="{
+                        mode: obj.mode,
+
+                    }" v-if="tab == 'Developer'" @submit="onSubmit">
+                        <FormKit label="Mode" type="l-select" :options="[
+                            { label: 'Production', value: 'prod' },
+                            { label: 'Development', value: 'dev' },
+
+                        ]" name="mode" validation="required">
+                        </FormKit>
+                    </FormKit>
+                </template>
+            </q-splitter>
+        </q-card>
     </l-page>
 </template>

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

@@ -0,0 +1,74 @@
+<script setup>
+import { useLight, model, q } from "#imports"
+import { ref } from "vue"
+import { Notify } from "quasar";
+const light = useLight()
+
+const columns = [
+    { name: "_delete", align: "center" },
+    { name: 'label', label: 'Label', align: 'left' },
+    { name: 'path', label: 'Path', align: 'left' },
+    { name: 'icon', label: 'Icon', align: 'left' }
+]
+
+const onSave = async (id, data) => {
+
+    await model("MyFavorite").update(id, data);
+
+    //show success message
+    Notify.create({
+        message: "Updated successfully",
+        color: "positive",
+        icon: "check"
+    });
+
+
+    await light.reloadMyFavorites()
+
+}
+
+const onRemove = async (id) => {
+    await model("MyFavorite").delete(id);
+    await light.reloadMyFavorites()
+}
+
+</script>
+<template>
+    <q-table :columns="columns" :rows="$light.myFavorites" :rows-per-page-options="[0]">
+
+        <template #body-cell-_delete="props">
+            <q-td auto-width>
+                <q-btn flat icon="sym_o_delete" round @click="onRemove(props.row.my_favorite_id)"></q-btn>
+            </q-td>
+        </template>
+
+        <template #body-cell-label="props">
+            <q-td key="label">
+                {{ props.row.label }}
+                <q-popup-edit v-model="props.row.label" #default="scope" buttons
+                    @save="onSave(props.row.my_favorite_id, { 'label': $event })">
+                    <q-input v-model="scope.value" dense autofocus counter @keyup.enter="scope.set" />
+                </q-popup-edit>
+            </q-td>
+
+        </template>
+
+        <template #body-cell-path="props">
+            <q-td key="path">
+                {{ props.row.path }}
+                <q-popup-edit v-model="props.row.path" #default="scope" buttons
+                    @save="onSave(props.row.my_favorite_id, { 'path': $event })">
+                    <q-input v-model="scope.value" dense autofocus counter @keyup.enter="scope.set" />
+                </q-popup-edit>
+            </q-td>
+        </template>
+
+        <template #body-cell-icon="props">
+            <q-td key="icon">
+                <l-icon-picker v-model="props.row.icon" flat round @update:model-value="onSave(
+                    props.row.my_favorite_id, { 'icon': $event })"></l-icon-picker>
+            </q-td>
+        </template>
+
+    </q-table>
+</template>

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

@@ -23,7 +23,10 @@ const route = useRoute()
                             replace />
                         <q-route-tab name="bio" icon="sym_o_fingerprint" :label="$t('Bio')" to="/User/setting/bio-auth"
                             exact replace />
-                        <q-route-tab name="openid" icon="sym_o_key" :label="$t('Open ID')" to="/User/setting/open_id" exact replace />
+                        <q-route-tab name="openid" icon="sym_o_key" :label="$t('Open ID')" to="/User/setting/open_id" exact
+                            replace />
+                        <q-route-tab name="myfav" icon="sym_o_star" :label="$t('My favorite')"
+                            to="/User/setting/my_favorite" exact replace />
 
                     </q-tabs>
                 </template>

package/dist/runtime/routes.mjs

@@ -131,6 +131,11 @@ function User_setting_information() {
     /* webpackChunkName: "User-setting-information" */ './pages/User/setting/information.vue'
   )
 }
+function User_setting_my_favorite() {
+  return import(
+    /* webpackChunkName: "User-setting-my_favorite" */ './pages/User/setting/my_favorite.vue'
+  )
+}
 function User_setting_open_id() {
   return import(
     /* webpackChunkName: "User-setting-open_id" */ './pages/User/setting/open_id.vue'
@@ -342,6 +347,11 @@ export default [
         path: 'information',
         component: User_setting_information,
       },
+      {
+        name: 'User-setting-my_favorite',
+        path: 'my_favorite',
+        component: User_setting_my_favorite,
+      },
       {
         name: 'User-setting-open_id',
         path: 'open_id',

package/package.json

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