pukaad-ui-lib 1.273.0 → 1.275.0

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "pukaad-ui-lib",
   "configKey": "pukaadUI",
-  "version": "1.273.0",
+  "version": "1.275.0",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/components/modal/modal-2FA.d.vue.ts

@@ -9,11 +9,13 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
 } & {
     complete: (data: {
         token: string;
+        code?: string;
     }) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onComplete?: ((data: {
         token: string;
+        code?: string;
     }) => any) | undefined;
 }>, {
     confirmedText: string;

package/dist/runtime/components/modal/modal-2FA.vue

@@ -60,7 +60,7 @@ const onVerify2FA = async () => {
       }
     );
     if (!data) throw "error";
-    emit("complete", data);
+    emit("complete", { ...data, code: valueOTP.value });
     isOpen.value = false;
   } catch (e) {
     const errorMessage = "\u0E23\u0E2B\u0E31\u0E2A\u0E22\u0E37\u0E19\u0E22\u0E31\u0E19\u0E44\u0E21\u0E48\u0E16\u0E39\u0E01\u0E15\u0E49\u0E2D\u0E07";

package/dist/runtime/components/modal/modal-2FA.vue.d.ts

@@ -9,11 +9,13 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
 } & {
     complete: (data: {
         token: string;
+        code?: string;
     }) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onComplete?: ((data: {
         token: string;
+        code?: string;
     }) => any) | undefined;
 }>, {
     confirmedText: string;

package/dist/runtime/components/modal/modal-password-new.d.vue.ts

@@ -1,10 +1,13 @@
 interface Props {
+    mode?: "login" | "secure";
     title?: string;
     confirmText?: string;
     loginToken?: string;
     /** When provided, uses forgot-password reset endpoint instead of password/create */
     resetToken?: string;
     disabledForceLogout?: boolean;
+    oldPassword?: string;
+    twoFaCode?: string;
 }
 type __VLS_Props = Props;
 type __VLS_ModelProps = {
@@ -25,6 +28,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     } | null) => any) | undefined;
 }>, {
     title: string;
+    mode: "login" | "secure";
     confirmText: string;
     disabledForceLogout: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/modal/modal-password-new.vue

@@ -1,34 +1,14 @@
 <template>
-  <Modal
-    :title="props.title"
-    :loading="loading"
-    v-model="isOpen"
-    @close="emit('close')"
-    @submit="handleSubmit"
-    width="425px"
-  >
+  <Modal :title="props.title" :loading="loading" v-model="isOpen" @close="emit('close')" @submit="handleSubmit"
+    width="425px">
     <div class="flex flex-col gap-2">
-      <InputPassword
-        disabled-forgot-password
-        new
-        required
-        label="รหัสผ่าน"
-        placeholder="กรอกรหัสผ่าน"
-        v-model="password"
-      />
-      <InputCheckbox
-        v-if="!props.disabledForceLogout"
-        label="ออกจากระบบ Pukaad ในอุปกรณ์อื่นๆทั้งหมด"
-        v-model="logoutAll"
-      />
+      <InputPassword disabled-forgot-password new required label="รหัสผ่าน" placeholder="กรอกรหัสผ่าน"
+        v-model="password" />
+      <InputCheckbox v-if="!props.disabledForceLogout" label="ออกจากระบบ Pukaad ในอุปกรณ์อื่นๆทั้งหมด"
+        v-model="logoutAll" />
     </div>
     <template #footer="{ meta }">
-      <Button
-        type="submit"
-        color="primary"
-        class="w-full"
-        :disabled="!meta.valid"
-      >
+      <Button type="submit" color="primary" class="w-full" :disabled="!meta.valid">
         {{ props.confirmText }}
       </Button>
     </template>
@@ -40,11 +20,14 @@ import { ref, computed, watch } from "vue";
 import { useNuxtApp, useRuntimeConfig } from "nuxt/app";
 import { useApi } from "../../composables/useApi";
 const props = defineProps({
+  mode: { type: String, required: false, default: "login" },
   title: { type: String, required: false, default: "\u0E23\u0E2B\u0E31\u0E2A\u0E1C\u0E48\u0E32\u0E19\u0E43\u0E2B\u0E21\u0E48" },
   confirmText: { type: String, required: false, default: "\u0E22\u0E37\u0E19\u0E22\u0E31\u0E19" },
   loginToken: { type: String, required: false },
   resetToken: { type: String, required: false },
-  disabledForceLogout: { type: Boolean, required: false, default: false }
+  disabledForceLogout: { type: Boolean, required: false, default: false },
+  oldPassword: { type: String, required: false },
+  twoFaCode: { type: String, required: false }
 });
 const emit = defineEmits(["complete", "close"]);
 const { $toast } = useNuxtApp();
@@ -64,6 +47,29 @@ watch(isOpen, (open) => {
   }
 });
 const handleSubmit = async () => {
+  if (props.mode === "secure") {
+    loading.value = true;
+    try {
+      await api("/me/change-password", {
+        method: "POST",
+        body: {
+          old_password: props.oldPassword,
+          new_password: password.value,
+          ...props.twoFaCode ? { two_fa_code: props.twoFaCode } : {},
+          logout_all: logoutAll.value
+        }
+      });
+      emit("complete", null);
+      isOpen.value = false;
+      $toast?.success?.("\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E23\u0E2B\u0E31\u0E2A\u0E1C\u0E48\u0E32\u0E19\u0E2A\u0E33\u0E40\u0E23\u0E47\u0E08");
+    } catch (e) {
+      const msg = e?.data?.message?.description || e?.data?.message || "\u0E40\u0E01\u0E34\u0E14\u0E02\u0E49\u0E2D\u0E1C\u0E34\u0E14\u0E1E\u0E25\u0E32\u0E14\u0E43\u0E19\u0E01\u0E32\u0E23\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D";
+      $toast?.error?.(msg);
+    } finally {
+      loading.value = false;
+    }
+    return;
+  }
   if (props.resetToken) {
     loading.value = true;
     try {
@@ -84,10 +90,12 @@ const handleSubmit = async () => {
       loading.value = false;
     }
     return;
-  }
-  if (!props.loginToken) {
+  } else if (!props.loginToken) {
     $toast?.error?.("\u0E44\u0E21\u0E48\u0E1E\u0E1A login token");
     return;
+  } else if (!props.oldPassword) {
+    $toast?.error?.("\u0E44\u0E21\u0E48\u0E1E\u0E1A \u0E23\u0E2B\u0E31\u0E2A\u0E1C\u0E48\u0E32\u0E19\u0E40\u0E14\u0E34\u0E21");
+    return;
   }
   loading.value = true;
   try {

package/dist/runtime/components/modal/modal-password-new.vue.d.ts

@@ -1,10 +1,13 @@
 interface Props {
+    mode?: "login" | "secure";
     title?: string;
     confirmText?: string;
     loginToken?: string;
     /** When provided, uses forgot-password reset endpoint instead of password/create */
     resetToken?: string;
     disabledForceLogout?: boolean;
+    oldPassword?: string;
+    twoFaCode?: string;
 }
 type __VLS_Props = Props;
 type __VLS_ModelProps = {
@@ -25,6 +28,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     } | null) => any) | undefined;
 }>, {
     title: string;
+    mode: "login" | "secure";
     confirmText: string;
     disabledForceLogout: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/modal/modal-password-verify.d.vue.ts

@@ -18,12 +18,16 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     "update:modelValue": (value: boolean) => any;
     complete: (data: {
         secId: string;
+        resetToken?: string;
+        password?: string;
     }) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     onClose?: (() => any) | undefined;
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onComplete?: ((data: {
         secId: string;
+        resetToken?: string;
+        password?: string;
     }) => any) | undefined;
 }>, {
     title: string;

package/dist/runtime/components/modal/modal-password-verify.vue

@@ -51,7 +51,7 @@ const handleSubmit = async () => {
         body: { password: password.value }
       });
       if (res.message?.title !== "\u0E2A\u0E33\u0E40\u0E23\u0E47\u0E08") throw "\u0E23\u0E2B\u0E31\u0E2A\u0E1C\u0E48\u0E32\u0E19\u0E44\u0E21\u0E48\u0E16\u0E39\u0E01\u0E15\u0E49\u0E2D\u0E07";
-      emit("complete", { secId: "" });
+      emit("complete", { secId: "", resetToken: res.data?.reset_token || res.data?.token || res.reset_token || res.token, password: password.value });
       isOpen.value = false;
     } else {
       if (!props.loginToken) {
@@ -74,7 +74,8 @@ const handleSubmit = async () => {
       }
     }
   } catch (e) {
-    inputRef.value?.setErrors?.(e?.data?.message.description);
+    const errorMsg = typeof e === "string" ? e : e?.data?.message?.description || "\u0E23\u0E2B\u0E31\u0E2A\u0E1C\u0E48\u0E32\u0E19\u0E44\u0E21\u0E48\u0E16\u0E39\u0E01\u0E15\u0E49\u0E2D\u0E07";
+    inputRef.value?.setErrors?.(errorMsg);
   } finally {
     loading.value = false;
   }

package/dist/runtime/components/modal/modal-password-verify.vue.d.ts

@@ -18,12 +18,16 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
     "update:modelValue": (value: boolean) => any;
     complete: (data: {
         secId: string;
+        resetToken?: string;
+        password?: string;
     }) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     onClose?: (() => any) | undefined;
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onComplete?: ((data: {
         secId: string;
+        resetToken?: string;
+        password?: string;
     }) => any) | undefined;
 }>, {
     title: string;

package/dist/runtime/components/modal/modal-secure.vue

@@ -3,7 +3,9 @@
     mode="secure" @complete="(data) => handleComplete(modal.key, data)"
     :confirmed-text="isLastStep ? '\u0E22\u0E37\u0E19\u0E22\u0E31\u0E19' : '\u0E16\u0E31\u0E14\u0E44\u0E1B'" @close="isOpen = false" v-model="modalStates[modal.key]"
     :request-path="modal.key === 'phoneOTP' ? '/otp/phone-request' : void 0"
-    :verify-path="modal.key === 'phoneOTP' ? '/otp/phone-verify' : void 0" />
+    :verify-path="modal.key === 'phoneOTP' ? '/otp/phone-verify' : void 0" :reset-token="resetTokenState"
+    :old-password="oldPasswordState"
+    :two-fa-code="twoFaCodeState" />
 </template>
 
 <script setup>
@@ -29,6 +31,9 @@ const isOpen = defineModel({ type: Boolean, ...{
   default: false
 } });
 const isLastStep = ref(false);
+const resetTokenState = ref("");
+const oldPasswordState = ref("");
+const twoFaCodeState = ref("");
 const modals = [
   { key: "password", component: ModalPasswordVerify },
   { key: "passwordNew", component: ModalPasswordNew },
@@ -42,6 +47,15 @@ const modalStates = reactive(
 );
 const handleComplete = (key, data) => {
   modalStates[key] = false;
+  if (data?.resetToken || data?.reset_token || data?.token) {
+    resetTokenState.value = data.resetToken || data.reset_token || data.token;
+  }
+  if (data?.password) {
+    oldPasswordState.value = data.password;
+  }
+  if (data?.code) {
+    twoFaCodeState.value = data.code;
+  }
   if (props.state === "add-phone") {
     if (key === "password") {
       if (props.twoFaEnabled) {
@@ -167,6 +181,9 @@ const onDisabled2FA = async () => {
 };
 watch(isOpen, (v) => {
   if (!v) return;
+  resetTokenState.value = "";
+  oldPasswordState.value = "";
+  twoFaCodeState.value = "";
   modalStates.password = true;
   if (["delete-phone", "delete-email"].includes(props.state)) {
     isLastStep.value = !props.twoFaEnabled;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pukaad-ui-lib",
-  "version": "1.273.0",
+  "version": "1.275.0",
   "description": "pukaad-ui for MeMSG",
   "repository": {
     "type": "git",