@hostlink/nuxt-light 1.21.13 → 1.22.0

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "light",
   "configKey": "light",
-  "version": "1.21.13",
+  "version": "1.22.0",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/runtime/assets/main.css

@@ -1 +1 @@
-body{font-family:Noto Sans,Noto Sans HK,Noto Sans TC,-apple-system,Helvetica Neue,Helvetica,Arial,sans-serif}.q-card__actions .q-btn--rectangle{padding:4px 16px}.q-table--dense .q-table td,.q-table--dense .q-table td:first-child,.q-table--dense .q-table th,.q-table--dense .q-table th:first-child{padding:2px 4px}.q-tab-panel{padding:8px}
+body{font-family:Noto Sans,Noto Sans HK,Noto Sans TC,-apple-system,Helvetica Neue,Helvetica,Arial,sans-serif}.q-card__actions .q-btn--rectangle{padding:4px 16px}.q-table--dense .q-table td,.q-table--dense .q-table td:first-child,.q-table--dense .q-table th,.q-table--dense .q-table th:first-child{padding:2px 4px}.q-tab-panel{padding:8px}::-webkit-scrollbar{background:transparent;height:12px;overflow:visible;width:14px;z-index:12}::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:#c1c1c1;border:4px solid transparent;border-radius:10px;margin:4px;min-height:32px;min-width:32px;-webkit-transition:background-color .32s ease-in-out;transition:background-color .32s ease-in-out;width:10px;z-index:12}::-webkit-scrollbar-thumb:hover{background:#c1c1c1}

package/dist/runtime/components/L/System/Setting/security.vue

@@ -12,7 +12,8 @@ export type LSystemSettingSecurityProps = {
     auth_lockout_attempts: string
     access_token_expire: string
     password_expiration: string,
-    password_expiration_duration: string
+    password_expiration_duration: string,
+    concurrent_login_disabled: string,
 }
 
 withDefaults(defineProps<LSystemSettingSecurityProps>(), {
@@ -26,7 +27,8 @@ withDefaults(defineProps<LSystemSettingSecurityProps>(), {
     auth_lockout_attempts: "5",
     access_token_expire: "28800",
     password_expiration: "0",
-    password_expiration_duration: "90"
+    password_expiration_duration: "90",
+    concurrent_login_disabled: "0",
 });
 
 
@@ -69,5 +71,10 @@ withDefaults(defineProps<LSystemSettingSecurityProps>(), {
             type="l-checkbox"></form-kit>
         <form-kit label="Password expiration duration" name="password_expiration_duration" type="l-input"
             hint="The number of days before the password expires. Default is 90 days." validation="required"></form-kit>
+
+
+        <form-kit label="Concurrent login disabled" type="l-checkbox" name="concurrent_login_disabled" true-value="1"
+            false-value="0"></form-kit>
+
     </FormKit>
 </template>

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

@@ -281,12 +281,24 @@ const onLogout = async () => {
     emits('logout');
 }
 
+watch(light.errors, (value) => {
+    if (value.length > 0) {
+        //if errors
+        for (let error of value) {
+            console.log(error.message);
+        }
+    }
+})
+
 </script>
 
+
+
 <style scoped>
 .q-layout__section--marginal{background-color:v-bind(c1)}
 </style>
 
+
 <template>
     <q-layout :view="layoutView">
         <q-header bordered class="text-white" :class="`bg-${light.color}`">

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

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useLight, q, m } from '#imports'
 import { ref, computed, useSlots, onMounted } from 'vue'
-import { type QCardProps } from 'quasar';
+import type { QCardProps } from 'quasar';
 
 const emit = defineEmits(["close"]);
 

package/dist/runtime/components/l-date-picker.vue

@@ -148,9 +148,9 @@ const date_attrs = computed(() => {
         <template v-slot:prepend>
             <q-btn icon="sym_o_event" round dense flat>
                 <q-popup-proxy cover transition-show="scale" transition-hide="scale" ref="popup">
-                    <q-date v-bind="date_attrs" v-model="dateValue" :color="color ?? $light.color">
+                    <q-date v-bind="date_attrs" v-model="dateValue" :color="color ?? $light.color" today-btn :title="label">
                         <div class="row items-center justify-end">
-                            <q-btn v-close-popup label="Close" :color="color ?? $light.color" flat />
+                            <q-btn v-close-popup :label="$t('Close')" :color="color ?? $light.color" flat />
                         </div>
                     </q-date>
                 </q-popup-proxy>

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

@@ -301,7 +301,7 @@ const facebookLogin = (accessToken) => {
           </l-input>
           <l-input v-model="data.password" label="Password" type="password" clearable show-password stackLabel
             :rules="[v => !!v || $t('Password is required')]" @keydown.enter.prevent="submit" :outlined="false"
-            autocomplete="current-password">
+            autocomplete="off">
             <template v-slot:prepend>
               <q-icon name="sym_o_lock" />
             </template>

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

@@ -49,7 +49,7 @@ const props = withDefaults(defineProps<LTableProps>(), {
     actions: () => [],
     rowsPerPageLabel: "Records per page:",
     selection: "none",
-    rowsPerPageOptions: () => [3, 5, 7, 10, 15, 20, 25, 50, 0],
+    rowsPerPageOptions: () => [5, 10, 20, 50, 100, 0],
     pagination: () => {
         return {
             sortBy: null,
@@ -335,7 +335,6 @@ const onLocalRequest = async (p: any) => {
                     }
                 }
 
-                console.log(p.pagination);
 
                 if (p.pagination.rowsPerPage != 0) {
                     c = c.forPage(p.pagination.page, p.pagination.rowsPerPage);
@@ -355,6 +354,7 @@ const onLocalRequest = async (p: any) => {
                     color: "negative"
                 })
                 this.setData({ data: [], meta: { total: 0, key: "", name: "" } });
+            
             }
         }
     }

package/dist/runtime/formkit/DatePicker.vue

@@ -16,7 +16,7 @@ const value = computed({
     set: (val) => props.context.node.input(val)
 })
 
-const label = computed(() => {
+/* const label = computed(() => {
     let l = t(props.context.label);
     if (props.context.state.required) {
         l = "* " + l
@@ -24,11 +24,12 @@ const label = computed(() => {
     return l
 })
 
-
+ */
 </script>
 <template>
-    <l-date-picker v-model="value" v-bind="context.attrs" :label="label" :error="error" :type="context.inputType"
-        :error-message="errorMessage" :disable="context.disabled">
+    <l-date-picker v-model="value" v-bind="context.attrs" :label="context.label" :error="error"
+        :type="context.inputType" :error-message="errorMessage" :disable="context.disabled"
+        :required="context.state.required">
         <template v-for="(s, name) in $slots" v-slot:[name]="props" :key="name">
             <slot :name="name" v-bind="props ?? {}"></slot>
         </template>

package/dist/runtime/light.js

@@ -214,6 +214,7 @@ const light = reactive({
     watch(() => light.color, async () => {
       await light.setStyle("color", light.color);
     });
+    light.errors = [];
   },
   isGranted(right) {
     if (right === void 0) return true;

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

@@ -1,6 +1,6 @@
 <script setup>
 import { q, m } from '#imports'
-import { ref } from 'vue'
+import { ref, computed } from 'vue'
 let { my } = await q({
     my: {
         styles: true
@@ -12,7 +12,9 @@ const defaultStyle = {
         dense: true,
         flat: true,
         bordered: true,
+        square: false,
         separator: 'cell'
+
     },
     card: {
         flat: true,
@@ -21,14 +23,20 @@ const defaultStyle = {
     },
     button: {
         outline: false,
-        rounded: false,
+        flat: false,
         unelevated: false,
+        rounded: false,
+        push: false,
+        square: false,
+        glossy: false,
         dense: false
     },
     input: {
         filled: false,
         outlined: true,
         standout: false,
+        borderless: false,
+        standout: false,
         rounded: false,
         dense: false,
         square: false,
@@ -67,7 +75,28 @@ const columns = [
     { name: 'phone', label: 'Phone', align: 'left', field: 'phone', sortable: true },
 ]
 
+
 const preview = ref({})
+
+const inputDesign = computed({
+    set: (value) => {
+        styles.value.input.filled = value === 'filled'
+        styles.value.input.outlined = value === 'outlined'
+        styles.value.input.standout = value === 'standout'
+        styles.value.input.borderless = value === 'borderless'
+    },
+    get: () => {
+        if (styles.value.input.filled) return 'filled'
+        if (styles.value.input.outlined) return 'outlined'
+        if (styles.value.input.standout) return 'standout'
+        if (styles.value.input.borderless) return 'borderless'
+        return 'none'
+    }
+});
+
+
+
+
 </script>
 <template>
     <div class="q-pa-md">
@@ -79,6 +108,7 @@ const preview = ref({})
                             <q-toggle v-model="styles.table.dense" label="Dense" :color="$light.color" />
                             <q-toggle v-model="styles.table.flat" label="Flat" :color="$light.color" />
                             <q-toggle v-model="styles.table.bordered" label="Bordered" :color="$light.color" />
+                            <q-toggle v-model="styles.table.square" label="Square" :color="$light.color" />
 
                             <q-field :label="`Separator`" stack-label :color="$light.color">
                                 <q-option-group v-model="styles.table.separator" inline :options="[
@@ -102,17 +132,30 @@ const preview = ref({})
                     <l-card title="Button" minimizable>
                         <q-card-section>
                             <q-toggle v-model="styles.button.outline" label="Outline" :color="$light.color" />
-                            <q-toggle v-model="styles.button.rounded" label="Rounded" :color="$light.color" />
+                            <q-toggle v-model="styles.button.flat" label="Flat" :color="$light.color" />
                             <q-toggle v-model="styles.button.unelevated" label="Unelevated" :color="$light.color" />
+                            <q-toggle v-model="styles.button.rounded" label="Rounded" :color="$light.color" />
+                            <q-toggle v-model="styles.button.push" label="Push" :color="$light.color" />
+                            <q-toggle v-model="styles.button.square" label="Square" :color="$light.color" />
+                            <q-toggle v-model="styles.button.glossy" label="Glossy" :color="$light.color" />
                             <q-toggle v-model="styles.button.dense" label="Dense" :color="$light.color" />
+
                         </q-card-section>
                     </l-card>
 
                     <l-card title="Input" minimizable>
                         <q-card-section>
-                            <q-toggle v-model="styles.input.filled" label="Filled" :color="$light.color" />
-                            <q-toggle v-model="styles.input.outlined" label="Outlined" :color="$light.color" />
-                            <q-toggle v-model="styles.input.standout" label="Standout" :color="$light.color" />
+
+                            <q-option-group v-model="inputDesign" inline :options="[
+                                { label: 'None', value: 'none' },
+                                { label: 'Filled', value: 'filled' },
+                                { label: 'Outlined', value: 'outlined' },
+                                { label: 'Standout', value: 'standout' },
+                                { label: 'Borderless', value: 'borderless' },
+                            ]" :color="$light.color" />
+
+
+
                             <q-toggle v-model="styles.input.rounded" label="Rounded" :color="$light.color" />
                             <q-toggle v-model="styles.input.dense" label="Dense" :color="$light.color" />
                             <q-toggle v-model="styles.input.square" label="Square" :color="$light.color" />
@@ -148,7 +191,7 @@ const preview = ref({})
                             { name: 'A', phone: '123' },
                             { name: 'B', phone: '456' },
                             { name: 'C', phone: '789' },
-                        ]" v-bind="styles.table" selection="multiple">
+                        ]" v-bind="styles.table" selection="multiple" title="Table">
 
                             <template #body-cell-action="props">
                                 <q-td auto-width>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hostlink/nuxt-light",
-  "version": "1.21.13",
+  "version": "1.22.0",
   "description": "HostLink Nuxt Light Framework",
   "repository": {
     "type": "git",