105 lines
5.2 KiB
Vue
105 lines
5.2 KiB
Vue
<script setup lang="ts">
|
||
import {reactive, ref} from "vue";
|
||
import axios from "axios";
|
||
import {useToast} from "primevue/usetoast";
|
||
import Master from "../../../layouts/master.vue";
|
||
|
||
interface PasswordInterface {
|
||
password: string,
|
||
newPassword: string,
|
||
newPassword_confirmation: string,
|
||
}
|
||
|
||
|
||
const toast = useToast();
|
||
const loader = ref<boolean>(false);
|
||
const errors = ref<any>([]);
|
||
const ChangePasswordForm = reactive<PasswordInterface>({
|
||
password : '',
|
||
newPassword : '',
|
||
newPassword_confirmation : '',
|
||
});
|
||
|
||
|
||
const ChangePasswordHandler = () => {
|
||
loader.value = true;
|
||
axios.post('/admin/setting-profile/change-password' , ChangePasswordForm).then(res => {
|
||
if (res.status == 200){
|
||
toast.add({severity : 'success' , summary : res.data.message});
|
||
ChangePasswordForm.password = '';
|
||
ChangePasswordForm.newPassword = '';
|
||
ChangePasswordForm.newPassword_confirmation = '';
|
||
}
|
||
loader.value = false;
|
||
errors.value = [];
|
||
}).catch(error => {
|
||
errors.value = error.response.data.errors ?? [];
|
||
if (error.status == 401 && error.response.data.message){
|
||
toast.add({severity : 'error' , summary : error.response.data.message})
|
||
}
|
||
loader.value = false;
|
||
});
|
||
}
|
||
|
||
|
||
</script>
|
||
|
||
<template>
|
||
<master>
|
||
<Panel toggleable class="w-full !rounded-2xl bg-client-gray/10">
|
||
<template #header>
|
||
<div class="flex items-center gap-2">
|
||
<i class="fi fi-rr-lock"></i>
|
||
<span class="font-semibold text-sm">تغییر کلمه عبور</span>
|
||
</div>
|
||
</template>
|
||
<div class="grid grid-cols-1 gap-4 content-start">
|
||
<p class="mb-4 leading-7 text-sm !font-extralight">برای افزایش امنیت حساب کاربری خود، توصیه می‌شود که کلمه عبور خود را به طور دوره‌ای تغییر دهید. برای این کار، ابتدا کلمه عبور فعلی خود را وارد کنید، سپس کلمه عبور جدید را وارد کرده و آن را دوباره تایید کنید. توجه داشته باشید که کلمه عبور جدید باید حداقل 8 کاراکتر باشد و شامل ترکیبی از حروف، اعداد و نمادها باشد.</p>
|
||
<div class="m-auto">
|
||
<FloatLabel variant="on" class=" m-auto">
|
||
<Password id="password" type="password" :feedback="false"
|
||
appendTo="self" toggleMask
|
||
v-model="ChangePasswordForm.password"
|
||
class="placeholder:!font-light !bg-white !border-gray-500/20 !text-client-Fontcolor"/>
|
||
<label for="on_label" class="!text-client-Fontcolor !bg-white !text-sm font-light">کلمه عبور فعلی</label>
|
||
</FloatLabel>
|
||
<Message
|
||
v-if="errors.password"
|
||
class="h-7 mt-1 !text-xs px-1"
|
||
variant="simple"
|
||
severity="error" size="small">{{errors.password[0]}}</Message>
|
||
</div>
|
||
<div class="m-auto">
|
||
<FloatLabel variant="on" class="m-auto">
|
||
<Password id="password" type="password" :feedback="false"
|
||
appendTo="self" toggleMask
|
||
v-model="ChangePasswordForm.newPassword"
|
||
class="placeholder:!font-light !bg-white !border-gray-500/20 !text-client-Fontcolor"/>
|
||
<label for="on_label" class="!text-client-Fontcolor !bg-white !text-sm font-light"> کلمه عبور جدید</label>
|
||
</FloatLabel>
|
||
<Message
|
||
v-if="errors.newPassword"
|
||
class="h-7 mt-1 !text-xs px-1"
|
||
variant="simple"
|
||
severity="error" size="small">{{errors.newPassword[0]}}</Message>
|
||
</div>
|
||
<div class="m-auto">
|
||
<FloatLabel variant="on" class="m-auto">
|
||
<Password id="password" type="password" :feedback="false"
|
||
appendTo="self" toggleMask
|
||
v-model="ChangePasswordForm.newPassword_confirmation"
|
||
class="placeholder:!font-light !bg-white !border-gray-500/20 !text-client-Fontcolor"/>
|
||
<label for="on_label" class="!text-client-Fontcolor !bg-white !text-sm font-light">تکرار کلمه عبور جدید</label>
|
||
</FloatLabel>
|
||
<Message
|
||
class="h-7 mt-1 !text-xs px-1"
|
||
variant="simple"
|
||
severity="error" size="small"></Message>
|
||
</div>
|
||
<Button @click="ChangePasswordHandler" :loading="loader" label=" تغییر کلمه عبور" severity="secondary"
|
||
class="m-auto flex flex-row-reverse items-center !font-normal" />
|
||
</div>
|
||
</Panel>
|
||
</master>
|
||
</template>
|