dz-app/pages/personal-center/change-pwd/change-pwd.vue

<template>
    <mx-submit-layout :loading="loading" :title="prevData.settingName" @submit="handleSubmit">
        <uv-form ref="form" :model="model" :rules="rules">
            <old-pwd-field/>
            <pwd-repeat-fields/>
        </uv-form>
    </mx-submit-layout>
</template>

<script setup>
import {ref} from 'vue'
import {useTransfer} from "@/hooks/useTransfer";
import {updateUserPwd} from "@/api/system/user";
import {alertAsync} from "@/utils/uni-helper";
import {createChangePwdModelRules} from "@/pages/login/components/hooks/defineFormModels";
import {useProvideFormData} from "@/pages/login/components/hooks/useFormDataInjection";
import OldPwdField from "@/pages/login/components/register-fields/old-pwd-field.vue";
import PwdRepeatFields from "@/pages/login/components/register-fields/pwd-repeat-fields.vue";

const {prevData, transferBack} = useTransfer()
const loading = ref(false)
const form = ref(null)
const [m, r, modelToCommit] = createChangePwdModelRules()
const [model, rules] = useProvideFormData(m, r)

const handleSubmit = async () => {
    await form.value.validate()
    if (loading.value) return
    loading.value = true
    try {
        const commit = modelToCommit()
        await updateUserPwd(commit)
        await alertAsync('新密码保存成功')
        transferBack()
    } finally {
        loading.value = false
    }
}
</script>

<style lang="scss">

</style>