This commit is contained in:
Inshal 2024-05-30 04:04:00 +05:00
parent c0a49cc1b6
commit 7e0031ba81
2 changed files with 76 additions and 35 deletions

View File

@ -1,5 +1,5 @@
<script setup>
import { PerfectScrollbar } from 'vue3-perfect-scrollbar'
import { PerfectScrollbar } from 'vue3-perfect-scrollbar';
const router = useRouter()
const ability = useAbility()
@ -11,6 +11,7 @@ const logout = async () => {
// Remove "accessToken" from cookie
useCookie('accessToken').value = null
localStorage.removeItem('admin_access_token');
// Remove "userData" from cookie
userData.value = null

View File

@ -1,14 +1,18 @@
<script setup>
import tree1 from '@images/misc/tree1.png'
import authV2LoginIllustrationBorderedDark from '@images/pages/auth-v2-login-illustration-bordered-dark.png'
import authV2LoginIllustrationBorderedLight from '@images/pages/auth-v2-login-illustration-bordered-light.png'
import authV2LoginIllustrationDark from '@images/pages/auth-v2-login-illustration-dark.png'
import authV2LoginIllustrationLight from '@images/pages/auth-v2-login-illustration-light.png'
import authV2MaskDark from '@images/pages/mask-v2-dark.png'
import authV2MaskLight from '@images/pages/mask-v2-light.png'
import { VNodeRenderer } from '@layouts/components/VNodeRenderer'
import { themeConfig } from '@themeConfig'
import { VForm } from 'vuetify/components/VForm'
import tree1 from '@images/misc/tree1.png';
import authV2LoginIllustrationBorderedDark from '@images/pages/auth-v2-login-illustration-bordered-dark.png';
import authV2LoginIllustrationBorderedLight from '@images/pages/auth-v2-login-illustration-bordered-light.png';
import authV2LoginIllustrationDark from '@images/pages/auth-v2-login-illustration-dark.png';
import authV2LoginIllustrationLight from '@images/pages/auth-v2-login-illustration-light.png';
import authV2MaskDark from '@images/pages/mask-v2-dark.png';
import authV2MaskLight from '@images/pages/mask-v2-light.png';
import { VNodeRenderer } from '@layouts/components/VNodeRenderer';
import { themeConfig } from '@themeConfig';
import axios from 'axios';
import { VForm } from 'vuetify/components/VForm';
import { useStore } from 'vuex';
import { ADMIN_LOGIN_API } from '../constants';
const store = useStore()
const authThemeImg = useGenerateImageVariant(authV2LoginIllustrationLight, authV2LoginIllustrationDark, authV2LoginIllustrationBorderedLight, authV2LoginIllustrationBorderedDark, true)
const authThemeMask = useGenerateImageVariant(authV2MaskLight, authV2MaskDark)
@ -33,37 +37,66 @@ const errors = ref({
const refVForm = ref()
const credentials = ref({
email: 'admin@demo.com',
password: 'admin',
email: '',
password: '',
})
const isLoading = ref(false)
const rememberMe = ref(false)
const login = async () => {
try {
const res = await $api('/auth/login', {
method: 'POST',
body: {
email: credentials.value.email,
password: credentials.value.password,
},
onResponseError({ response }) {
errors.value = response._data.errors
},
})
store.dispatch('updateIsLoading', true)
isLoading.value = true
const response = await axios.post(ADMIN_LOGIN_API, {
email: credentials.value.email,
password: credentials.value.password,
});
const { accessToken, userData, userAbilityRules } = res
console.log("Response", response.data);
response.data.userData.avatar = "/images/avatars/avatar-1.png";
console.log("Response 2", response.data);
const { accessToken, userData, userAbilityRules } = response.data;
useCookie('userAbilityRules').value = userAbilityRules;
ability.update(userAbilityRules);
useCookie('userData').value = userData;
useCookie('accessToken').value = accessToken;
localStorage.setItem('admin_access_token',accessToken)
useCookie('userAbilityRules').value = userAbilityRules
ability.update(userAbilityRules)
useCookie('userData').value = userData
useCookie('accessToken').value = accessToken
await nextTick(() => {
router.replace(route.query.to ? String(route.query.to) : '/')
})
} catch (err) {
console.error(err)
router.replace(route.query.to ? String(route.query.to) : '/');
});
} catch (error) {
store.dispatch('updateIsLoading', false)
isLoading.value = false
console.error(error);
}
// try {
// const res = await $api('/auth/login', {
// method: 'POST',
// body: {
// email: credentials.value.email,
// password: credentials.value.password,
// },
// onResponseError({ response }) {
// errors.value = response._data.errors
// },
// })
// const { accessToken, userData, userAbilityRules } = res
// useCookie('userAbilityRules').value = userAbilityRules
// ability.update(userAbilityRules)
// useCookie('userData').value = userData
// useCookie('accessToken').value = accessToken
// await nextTick(() => {
// router.replace(route.query.to ? String(route.query.to) : '/')
// })
// } catch (err) {
// console.error(err)
// }
}
const onSubmit = () => {
@ -75,6 +108,13 @@ const onSubmit = () => {
</script>
<template>
<VDialog v-model="isLoading" width="110" height="150" color="primary">
<VCardText class="" style="color: white !important;">
<div class="demo-space-x">
<VProgressCircular :size="40" color="primary" indeterminate />
</div>
</VCardText>
</VDialog>
<RouterLink to="/">
<div class="auth-logo d-flex align-center gap-x-3">
<VNodeRenderer :nodes="themeConfig.app.logo" />
@ -128,13 +168,13 @@ const onSubmit = () => {
>
<VCardText>
<h4 class="text-h4 mb-1">
Welcome to <span class="text-capitalize">{{ themeConfig.app.title }}!</span> 👋🏻
Welcome to <span class="text-capitalize">{{ themeConfig.app.title }}!</span>
</h4>
<p class="mb-0">
Please sign-in to your account and start the adventure
</p>
</VCardText>
<VCardText>
<!-- <VCardText>
<VAlert
color="primary"
variant="tonal"
@ -146,7 +186,7 @@ const onSubmit = () => {
Client Email: <strong>client@demo.com</strong> / Pass: <strong>client</strong>
</p>
</VAlert>
</VCardText>
</VCardText> -->
<VCardText>
<VForm