|
|
@@ -5,6 +5,7 @@
|
|
|
<h3 class="title">Change Password</h3>
|
|
|
<div class="ptc-form-item">
|
|
|
<input
|
|
|
+ v-model="values.new_password"
|
|
|
class="ptc-input"
|
|
|
type="password"
|
|
|
placeholder="Enter new password"
|
|
|
@@ -12,13 +13,16 @@
|
|
|
</div>
|
|
|
<div class="ptc-form-item">
|
|
|
<input
|
|
|
+ v-model="values.new_password_confirmation"
|
|
|
class="ptc-input"
|
|
|
type="password"
|
|
|
placeholder="Repeat new password"
|
|
|
/>
|
|
|
</div>
|
|
|
<div class="ptc-form-item">
|
|
|
- <button class="ptc-button">SUBMIT</button>
|
|
|
+ <button class="ptc-button" @click="handleSubmit(applyChange)">
|
|
|
+ SUBMIT
|
|
|
+ </button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -52,11 +56,11 @@
|
|
|
We will send you an email（ {{ resetForm.email }} ）The password reset
|
|
|
email has been sent. Please go to check it
|
|
|
</div>
|
|
|
- <div class="ptc-form">
|
|
|
+ <!-- <div class="ptc-form">
|
|
|
<div class="ptc-form-item">
|
|
|
<button class="ptc-button" @click="next">GO</button>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
</div>
|
|
|
<div v-if="step === 2" class="step ptc-inner">
|
|
|
<h3 class="title">Recover password</h3>
|
|
|
@@ -68,12 +72,13 @@
|
|
|
<div class="ptc-form">
|
|
|
<div class="ptc-form-item">
|
|
|
<input
|
|
|
+ v-model="resetForm.password"
|
|
|
class="ptc-input"
|
|
|
placeholder="6-20 digits password, case sensitive"
|
|
|
/>
|
|
|
</div>
|
|
|
<div class="ptc-form-item">
|
|
|
- <button class="ptc-button" @click="next">SUBMIT</button>
|
|
|
+ <button class="ptc-button" @click="applyReset">SUBMIT</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -91,14 +96,32 @@
|
|
|
import { reactive } from 'vue'
|
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
|
import { state } from '@/store'
|
|
|
-import { sendPasswordEmail, resetPassword } from '@/service/user'
|
|
|
+import {
|
|
|
+ sendPasswordEmail,
|
|
|
+ resetPassword,
|
|
|
+ changePassword,
|
|
|
+} from '@/service/user'
|
|
|
+import { string } from 'yup'
|
|
|
+import { debounce } from 'lodash-es'
|
|
|
+import useForm from '@/hooks/useForm'
|
|
|
|
|
|
const props = defineProps<{ action: 'change' | 'reset' }>()
|
|
|
|
|
|
const router = useRouter()
|
|
|
-const { query } = useRoute()
|
|
|
+const { query } = useRoute() as any
|
|
|
const step = query.step ? +(query.step as string) : 0
|
|
|
-const resetForm = reactive({ email: '' })
|
|
|
+const { values, handleSubmit } = useForm<ApiUser.PasswordChange.Request>({
|
|
|
+ schema: {
|
|
|
+ new_password: string().required(),
|
|
|
+ new_password_confirmation: string().required(),
|
|
|
+ },
|
|
|
+})
|
|
|
+const resetForm = reactive<ApiUser.PasswordReset.Request>({
|
|
|
+ email: step === 2 ? query.email : '',
|
|
|
+ token: query.token || '',
|
|
|
+ password: '',
|
|
|
+ password_confirmation: '',
|
|
|
+})
|
|
|
|
|
|
state.bgWhite = true
|
|
|
|
|
|
@@ -109,9 +132,32 @@ function next() {
|
|
|
})
|
|
|
}
|
|
|
|
|
|
+async function applyChange() {
|
|
|
+ // await changePassword(values as any)
|
|
|
+}
|
|
|
+
|
|
|
async function sendEmail() {
|
|
|
- await sendPasswordEmail(resetForm.email)
|
|
|
- next()
|
|
|
+ try {
|
|
|
+ await string()
|
|
|
+ .email('invalid email')
|
|
|
+ .required('email is required')
|
|
|
+ .validate(resetForm.email)
|
|
|
+ await sendPasswordEmail(resetForm.email)
|
|
|
+ next()
|
|
|
+ } catch (err) {
|
|
|
+ console.error(err.message)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+async function applyReset() {
|
|
|
+ try {
|
|
|
+ await string().required('password is required').validate(resetForm.password)
|
|
|
+ resetForm.password_confirmation = resetForm.password
|
|
|
+ await resetPassword(resetForm)
|
|
|
+ next()
|
|
|
+ } catch (err) {
|
|
|
+ console.error(err.message)
|
|
|
+ }
|
|
|
}
|
|
|
</script>
|
|
|
|
冯诚