@hostlink/nuxt-light 0.0.108 → 0.0.110

package/dist/module.json

@@ -1,5 +1,5 @@
 {
   "name": "light",
   "configKey": "light",
-  "version": "0.0.108"
+  "version": "0.0.110"
 }

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

@@ -1,12 +1,11 @@
 <script setup>
-import { computed, ref, useSlots, useAttrs } from "vue";
+import { computed, ref, useAttrs } from "vue";
 import { useI18n } from 'vue-i18n';
 import tc2sc from "../lib/tc2sc";
 import { useLight } from '../';
 
 const i18n = useI18n();
 const light = useLight();
-const slots = useSlots();
 
 const props = defineProps({
     modelValue: {
@@ -38,11 +37,13 @@ const props = defineProps({
 });
 const emit = defineEmits(["update:modelValue"]);
 
+//clone rules to new_rules
 const new_rules = props.rules || [];
 
+
 //has required prop (in properties)
-if (props.required) {
-    new_rules.push(val => !!val || i18n.t('input_required',[i18n.t(props.label)]));
+if (props.required || (new_rules.indexOf("required") >= 0)) {
+    new_rules.push(val => !!val || i18n.t('input_required', [i18n.t(props.label)]));
 }
 
 if (props.type == "email") {
@@ -53,6 +54,57 @@ if (props.type == "email") {
     });
 }
 
+if (new_rules.indexOf("containUpper") >= 0) {
+    new_rules.push(val => {
+        if (val && !val.match(/[A-Z]/)) {
+            return i18n.t("Must contain at least one uppercase letter");
+        }
+    });
+}
+
+if (new_rules.indexOf("containLower") >= 0) {
+    new_rules.push(val => {
+        if (val && !val.match(/[a-z]/)) {
+            return i18n.t("Must contain at least one lowercase letter");
+        }
+    });
+}
+
+if (new_rules.indexOf("containNumber") >= 0) {
+    new_rules.push(val => {
+        if (val && !val.match(/[0-9]/)) {
+            return i18n.t("Must contain at least one number");
+        }
+    });
+}
+
+if (new_rules.indexOf("containSpecial") >= 0) {
+    new_rules.push(val => {
+        if (val && !val.match(/[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]/)) {
+            return i18n.t("Must contain at least one symbol");
+        }
+    });
+}
+
+//find mniLength:x  in rules
+const minLength = new_rules.find(rule => {
+    if (typeof rule != "string") return false;
+    return rule.startsWith("minLength:")
+});
+
+if (minLength) {
+    const min = parseInt(minLength.replace("minLength:", ""));
+    new_rules.push(val => {
+        if (val && val.length < min) {
+            return i18n.t("input_min", [min]);
+        }
+    });
+}
+
+
+
+
+
 
 const localValue = computed({
     get: () => props.modelValue,
@@ -100,8 +152,6 @@ const onClickTc2Sc = () => {
     localValue.value = tc2sc(localValue.value);
 }
 
-
-
 const attrs = {
     ...{
         filled: light.getStyle("inputFilled", false),

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

@@ -636,7 +636,7 @@ const getCellClass = (col: any, row: any) => {
 
                         <template v-if="!col.searchType">
                             <q-input dense clearable v-model="filters[col.name]" @keydown.enter.prevent="onFilters"
-                                @clear="onFilters"></q-input>
+                                @clear="onFilters" enterkeyhint="search"></q-input>
 
                         </template>
 

package/dist/runtime/locales/en.json

@@ -11,6 +11,7 @@
     "Theme Customizer": "Theme Customizer",
     "Customize & Preview in Real Time": "Customize & Preview in Real Time",
     "Permission": "Permission",
-    "storage_usage":"{0} free of {1}",
-    "input_required": "Please input {0}"
+    "storage_usage": "{0} free of {1}",
+    "input_required": "Please input {0}",
+    "input_min": "Please input at least {0} characters"
 }

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

@@ -160,6 +160,6 @@
     "input_required": "{0}為必填",
     "Invalid email format": "電郵格式錯誤",
     "No data available": "沒有資料",
-    "Loading...": "載入中..."
-    
+    "Loading...": "載入中...",
+    "input_min": "最少{0}個字"
 }

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

@@ -40,7 +40,7 @@ const onCickView = async (id) => {
 </script>
 <template>
     <l-page>
-        <q-table flat :columns="columns" :rows="users">
+        <q-table flat :columns="columns" :rows="users" :rows-per-page-options="[0]">
             <template #body-cell-view="props">
                 <q-td :props="props">
                     <q-btn rounded outline color="primary" @click="onCickView(props.row.user_id)" label="view"

package/dist/runtime/pages/User/_user_id/change-password.vue

@@ -1,35 +1,20 @@
 <script setup>
-import { q } from '../../../'
+import { q, m } from '../../../'
 import { useRouter, useRoute } from "vue-router"
 import { reactive } from "vue"
 const system = await q("system", ["passwordPolicy"]);
-const rules = system.passwordPolicy.map((rule) => {
-    let s = rule.split(":");
-
-    switch (s[0]) {
-        case "required":
-            return (v) => !!v || "Required";
-        case "containUpper":
-            return (v) => /[A-Z]/.test(v) || "Must contain at least one uppercase letter";
-        case "containLower":
-            return (v) => /[a-z]/.test(v) || "Must contain at least one lowercase letter";
-        case "containNumber":
-            return (v) => /[0-9]/.test(v) || "Must contain at least one number";
-        case "containSpecial":
-            return (v) => /[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]/.test(v) || "Must contain at least one special character";
-        case "minLength":
-            return (v) => v.length >= parseInt(s[1]) || `Must be at least ${s[1]} characters`;
-    }
-})
 const router = useRouter();
 const route = useRoute();
-const obj = reactive({
-    id: parseInt(route.params.user_id)
-})
 
+const obj = reactive({
+    password: "",
+});
 
 const onUpdatePassword = async () => {
-    if (await m("changeUserPassword", obj)) {
+    if (await m("updateUserPassword", {
+        id: route.params.user_id,
+        password: obj.password
+    })) {
         router.push("/User");
     }
 }
@@ -38,7 +23,7 @@ const onUpdatePassword = async () => {
 <template>
     <l-page>
         <l-form @save="onUpdatePassword">
-            <l-input type="password" label="New password" :rules="rules" v-model="obj.password">
+            <l-input type="password" label="New password" v-model="obj.password" :rules="system.passwordPolicy">
             </l-input>
         </l-form>
 

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

@@ -18,6 +18,7 @@ roles = roles.map((role) => {
     };
 });
 
+const system = await q("system", ["passwordPolicy"]);
 </script>
 <template>
     <l-page>
@@ -25,7 +26,8 @@ roles = roles.map((role) => {
             <l-row>
                 <l-col md="6" gutter="md">
                     <l-input label="Username" v-model="obj.username" required />
-                    <l-input label="Password" v-model="obj.password" required type="password" />
+                    <l-input label="Password" v-model="obj.password" required type="password"
+                        :rules="system.passwordPolicy" />
                     <l-input label="First name" v-model="obj.first_name" required />
                     <l-input label="Last name" v-model="obj.last_name" />
                     <l-input label="Email" v-model="obj.email" required type="email" />

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

@@ -3,6 +3,8 @@ import { reactive } from "vue"
 import { notify } from '../../../'
 import { updatePassword } from "@hostlink/light"
 
+import { q } from "#imports"
+
 const obj = reactive({
     old_password: "",
     new_password: "",
@@ -17,16 +19,24 @@ const onSave = async () => {
     }
 }
 
+const system = await q("system", ["passwordPolicy"])
+
 </script>
 <template>
     <l-form @save="onSave" :bordered="false">
-        <l-input label="Old password" v-model="obj.old_password" type="password"
-            :rules="[v => !!v || 'Old password is required']" />
-        <l-input label="New password" v-model="obj.new_password" type="password"
-            :rules="[v => !!v || 'New password is required']" />
+        <l-input label="Old password" v-model="obj.old_password" type="password" required />
+        <l-input label="New password" v-model="obj.new_password" type="password" :rules="system.passwordPolicy" />
         <l-input label="Confirm password" v-model="obj.confirm_password" type="password" :rules="[
-            v => !!v || 'Confirm password is required',
             v => v == obj.new_password || 'Confirm password does not match'
         ]" />
     </l-form>
+
+    <div>
+        <div>Password policy</div>
+        <ul>
+            <li v-for="rule in system.passwordPolicy" :key="rule">
+                {{ rule }}
+            </li>
+        </ul>
+    </div>
 </template>

package/package.json

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