bfg-common 1.4.316 → 1.4.318

package/components/common/layout/theHeader/userMenu/modals/changePassword/ChangePassword.vue

@@ -38,7 +38,7 @@ const localization = computed<UI_I_Localization>(() => useLocal())
 const { $store }: any = useNuxtApp()
 
 const form = ref<UI_I_FormChangePassword>({
-  password: '',
+  current_password: '',
   new_password: '',
   confirm_password: '',
 })

package/components/common/layout/theHeader/userMenu/modals/changePassword/ChangePasswordNew.vue

@@ -19,8 +19,7 @@
         />
 
         <p class="change-password__description">
-          To keep your account secure, please make sure that your new password
-          is different from any of your previous passwords.
+          {{ localization.common.changePasswordDesc }}
         </p>
 
         <div class="change-password__form">
@@ -30,6 +29,7 @@
             :label="localization.auth.password"
             :error="passwordErrorText"
             type="password"
+            :autocomplete="'new-password'"
           ></ui-input>
 
           <ui-input
@@ -59,6 +59,8 @@
 import type { UI_I_Localization } from '~//lib/models/interfaces'
 import type { UI_I_FormChangePassword } from '~/components/common/layout/theHeader/userMenu/modals/changePassword/lib/models/interfaces'
 import type { UI_T_Project } from '~/lib/models/types'
+import type { UI_I_InitialValidationFields } from '~/components/common/layout/theHeader/userMenu/modals/changePassword/lib/models/interfaces'
+import { getPasswordMismatchError } from '~/components/common/layout/theHeader/userMenu/modals/changePassword/lib/utils'
 
 const props = defineProps<{
   project: UI_T_Project
@@ -72,32 +74,68 @@ const modelLocal = defineModel<UI_I_FormChangePassword>({ required: true })
 
 const localization = computed<UI_I_Localization>(() => useLocal())
 
-// const isValid = ref<boolean>(false)
-const errorText = ref<string>('')
+const initValidationFields = ref<UI_I_InitialValidationFields>({
+  currentPassword: false,
+  newPassword: false,
+  confirmPassword: false,
+})
+const initValidation = (types: string[]): boolean => {
+  types.forEach((type) => (initValidationFields.value[type] = true))
+
+  return (
+    !!passwordErrorText.value ||
+    !!newPasswordErrorText.value ||
+    !!confirmPasswordErrorText.value
+  )
+}
 
 const passwordErrorText = computed<string>(() => {
-  return ''
+  if (!initValidationFields.value.currentPassword) return ''
+
+  return !modelLocal.value.current_password
+    ? localization.value.common.fieldRequired
+    : ''
 })
 const newPasswordErrorText = computed<string>(() => {
-  return ''
+  if (!initValidationFields.value.newPassword) return ''
+
+  const { new_password, confirm_password } = modelLocal.value
+  return !new_password
+    ? localization.value.common.fieldRequired
+    : getPasswordMismatchError(
+        localization.value,
+        new_password,
+        confirm_password
+      )
 })
 const confirmPasswordErrorText = computed<string>(() => {
-  return ''
+  if (!initValidationFields.value.confirmPassword) return ''
+  const { new_password, confirm_password } = modelLocal.value
+  return !confirm_password
+    ? localization.value.common.fieldRequired
+    : getPasswordMismatchError(
+        localization.value,
+        new_password,
+        confirm_password
+      )
 })
 
-// const showValidationErrors = (text: string): void => {
-//   isValid.value = true
-//   errorText.value = text
-// }
+// const isValid = ref<boolean>(false)
+const errorText = ref<string>('')
 
-// const onHideModal = (): void => {
-//   emits('hide')
-//   setForm()
-//   isValid.value = false
-// }
 
 const onSubmit = (): void => {
+  const isFieldValid = initValidation([
+    'currentPassword',
+    'newPassword',
+    'confirmPassword',
+  ])
   // const {  } = modelLocal.value
+
+  if (!isFieldValid) {
+    console.log(1111111)
+  }
+
   errorText.value = 'asdaldjlkdjkadj'
 
   const notReady = true
@@ -106,6 +144,9 @@ const onSubmit = (): void => {
   }
   emits('change-password')
 }
+const onHideModal = (): void => {
+  emits('hide')
+}
 </script>
 
 <style lang="scss" scoped>

package/components/common/layout/theHeader/userMenu/modals/changePassword/lib/models/interfaces.ts

@@ -1,5 +1,11 @@
 import type { UI_I_Validation } from '~/lib/models/plugins/validation/interfaces'
 
+
+export interface UI_I_InitialValidationFields {
+  currentPassword: boolean
+  newPassword: boolean
+  confirmPassword: boolean
+}
 export interface UI_I_FormChangePassword {
   password: UI_I_Validation
   newPassword: UI_I_Validation

package/components/common/layout/theHeader/userMenu/modals/changePassword/lib/utils.ts

@@ -0,0 +1,11 @@
+import type { UI_I_Localization } from '~//lib/models/interfaces'
+
+export const getPasswordMismatchError = (
+  localization: UI_I_Localization,
+  password: string,
+  confirmPassword: string
+): string => {
+  return password === confirmPassword
+    ? ''
+    : localization.common.thePasswordsDoNotMatch
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "bfg-common",
   "private": false,
-  "version": "1.4.316",
+  "version": "1.4.318",
   "scripts": {
     "build": "nuxt build",
     "dev": "nuxt dev --port=3002",