<template>
    <el-form ref="pwdRef" :model="user" :rules="rules" label-width="80px">
        <el-form-item :label="$t('profile-resetPwd-199136075a124e89f-1')" prop="oldPassword">
            <el-input
                v-model="user.oldPassword"
                :placeholder="$t('profile-resetPwd-199136075a124e89f-2')"
                type="password"
                show-password
            />
        </el-form-item>
        <el-form-item :label="$t('profile-resetPwd-199136075a124e89f-3')" prop="newPassword">
            <el-input
                v-model="user.newPassword"
                :placeholder="$t('profile-resetPwd-199136075a124e89f-4')"
                type="password"
                show-password
            />
        </el-form-item>
        <el-form-item :label="$t('profile-resetPwd-199136075a124e89f-5')" prop="confirmPassword">
            <el-input
                v-model="user.confirmPassword"
                :placeholder="$t('profile-resetPwd-199136075a124e89f-6')"
                type="password"
                show-password
            />
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click="submit">
                {{ $t('profile-resetPwd-199136075a124e89f-7') }}
            </el-button>
            <el-button type="danger" @click="close">
                {{ $t('profile-resetPwd-199136075a124e89f-8') }}
            </el-button>
        </el-form-item>
    </el-form>
</template>

<script setup>
import { updateUserPwd } from '@/api/system/user';

const { proxy } = getCurrentInstance();
const t = inject('t');

const user = reactive({
    oldPassword: undefined,
    newPassword: undefined,
    confirmPassword: undefined,
});

const equalToPassword = (rule, value, callback) => {
    if (user.newPassword !== value) {
        callback(new Error(t('profile-resetPwd-199136075a124e89f-9')));
    } else {
        callback();
    }
};
const rules = ref({
    oldPassword: [
        {
            required: true,
            message: t('profile-resetPwd-199136075a124e89f-10'),
            trigger: 'blur',
        },
    ],
    newPassword: [
        {
            required: true,
            message: t('profile-resetPwd-199136075a124e89f-11'),
            trigger: 'blur',
        },
        {
            min: 6,
            max: 20,
            message: t('profile-resetPwd-199136075a124e89f-12'),
            trigger: 'blur',
        },
        {
            pattern: /^[^<>"'|\\]+$/,
            message: t('profile-resetPwd-199136075a124e89f-13'),
            trigger: 'blur',
        },
    ],
    confirmPassword: [
        {
            required: true,
            message: t('profile-resetPwd-199136075a124e89f-14'),
            trigger: 'blur',
        },
        { required: true, validator: equalToPassword, trigger: 'blur' },
    ],
});

/** 提交按钮 */
function submit() {
    proxy.$refs.pwdRef.validate(valid => {
        if (valid) {
            updateUserPwd(user.oldPassword, user.newPassword).then(response => {
                proxy.$modal.msgSuccess(t('profile-resetPwd-199136075a124e89f-15'));
            });
        }
    });
}
/** 关闭按钮 */
function close() {
    proxy.$tab.closePage();
}
</script>
