86 lines
2.5 KiB
Vue
86 lines
2.5 KiB
Vue
<template>
|
|
<div class="app-container">
|
|
<el-card shadow="never" class="change-password-card">
|
|
<template #header>{{ $t("admin.changePasswordTitle") }}</template>
|
|
|
|
<el-alert
|
|
:title="$t('admin.forcePasswordChangeNotice')"
|
|
type="warning"
|
|
:closable="false"
|
|
class="mb-3"
|
|
/>
|
|
|
|
<el-form ref="formRef" :model="form" :rules="rules" label-width="180px">
|
|
<el-form-item :label="$t('admin.oldPassword')" prop="oldPassword">
|
|
<el-input v-model="form.oldPassword" show-password />
|
|
</el-form-item>
|
|
<el-form-item :label="$t('admin.newPassword')" prop="newPassword">
|
|
<el-input v-model="form.newPassword" show-password />
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" :loading="saving" @click="submit">{{ $t("common.confirm") }}</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ElMessage, FormInstance, FormRules } from "element-plus";
|
|
import { useI18n } from "vue-i18n";
|
|
import { useRoute, useRouter } from "vue-router";
|
|
import { adminChangePasswordApi } from "@/api/admin";
|
|
import { useAdminStore } from "@/store/modules/admin";
|
|
|
|
const { t } = useI18n();
|
|
const route = useRoute();
|
|
const router = useRouter();
|
|
const adminStore = useAdminStore();
|
|
|
|
const formRef = ref<FormInstance>();
|
|
const saving = ref(false);
|
|
const form = reactive({
|
|
oldPassword: "",
|
|
newPassword: "",
|
|
});
|
|
|
|
const passwordPattern = /^[a-zA-Z0-9!@#$%^&*()_+-=]{6,64}$/;
|
|
const rules: FormRules = {
|
|
oldPassword: [
|
|
{ required: true, message: t("common.required"), trigger: ["change", "blur"] },
|
|
{ pattern: passwordPattern, message: t("common.invalid"), trigger: ["change", "blur"] },
|
|
],
|
|
newPassword: [
|
|
{ required: true, message: t("common.required"), trigger: ["change", "blur"] },
|
|
{ pattern: passwordPattern, message: t("common.invalid"), trigger: ["change", "blur"] },
|
|
],
|
|
};
|
|
|
|
const submit = async () => {
|
|
if (!formRef.value) {
|
|
return;
|
|
}
|
|
const valid = await formRef.value.validate();
|
|
if (!valid) {
|
|
return;
|
|
}
|
|
saving.value = true;
|
|
try {
|
|
await adminChangePasswordApi({ oldPassword: form.oldPassword, newPassword: form.newPassword });
|
|
adminStore.forcePasswordChange = false;
|
|
ElMessage.success(t("admin.changedSuccess"));
|
|
const redirect = typeof route.query.redirect === "string" ? route.query.redirect : "/";
|
|
router.push(redirect);
|
|
} finally {
|
|
saving.value = false;
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.change-password-card {
|
|
max-width: 760px;
|
|
}
|
|
</style>
|
|
|