diff --git a/quasar.config.ts b/quasar.config.ts index 885c3ff..bc19cb6 100644 --- a/quasar.config.ts +++ b/quasar.config.ts @@ -128,6 +128,10 @@ export default defineConfig((ctx) => { // https://v2.quasar.dev/options/animations animations: [ 'fadeInUp', + 'zoomIn', + 'zoomOut', + 'flipInX', + 'flipOutX', ], // https://v2.quasar.dev/quasar-cli-vite/quasar-config-file#sourcefiles diff --git a/src/assets/Facebook-f_Logo-White-Logo.wine.svg b/src/assets/Facebook-f_Logo-White-Logo.wine.svg new file mode 100644 index 0000000..9b6bf1b --- /dev/null +++ b/src/assets/Facebook-f_Logo-White-Logo.wine.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/authentik-icon.svg b/src/assets/authentik-icon.svg new file mode 100644 index 0000000..0612b79 --- /dev/null +++ b/src/assets/authentik-icon.svg @@ -0,0 +1,49 @@ + + + +Created with Fabric.js 5.2.4 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/logo-targo-green-button.png b/src/assets/logo-targo-green-button.png new file mode 100644 index 0000000..87ca09a Binary files /dev/null and b/src/assets/logo-targo-green-button.png differ diff --git a/src/assets/logo-targo-simple.svg b/src/assets/logo-targo-simple.svg index eec6bd6..f9406c6 100644 --- a/src/assets/logo-targo-simple.svg +++ b/src/assets/logo-targo-simple.svg @@ -4,19 +4,24 @@ Created with Fabric.js 5.2.4 - - - - + - + + + + + + + + + - + \ No newline at end of file diff --git a/src/assets/village.jpg b/src/assets/village.jpg new file mode 100644 index 0000000..5555a06 Binary files /dev/null and b/src/assets/village.jpg differ diff --git a/src/assets/village.png b/src/assets/village.png new file mode 100644 index 0000000..7b6ead1 Binary files /dev/null and b/src/assets/village.png differ diff --git a/src/css/app.scss b/src/css/app.scss index f92f544..cce9126 100644 --- a/src/css/app.scss +++ b/src/css/app.scss @@ -3,4 +3,19 @@ .rounded-#{$size} { border-radius: #{$size}px; } +} + + +.text-fb-blue { + color: #4267B2 !important; +} +.bg-fb-blue { + background: #4267B2 !important; +} + +.text-authentik-orange { + color: #fd4b2d !important; +} +.bg-authentik-orange { + background: #fd4b2d !important; } \ No newline at end of file diff --git a/src/css/quasar.variables.scss b/src/css/quasar.variables.scss index 2d1f566..20978f3 100644 --- a/src/css/quasar.variables.scss +++ b/src/css/quasar.variables.scss @@ -14,10 +14,9 @@ $primary: #019547; $secondary: #EFFFEF; -$accent: #ADEAC6; +$accent: #4ada86; $dark-font: #305530; - $dark: #323232; $dark-page: #323232; diff --git a/src/i18n/en-ca/index.ts b/src/i18n/en-ca/index.ts index 28d06a2..68e99f1 100644 --- a/src/i18n/en-ca/index.ts +++ b/src/i18n/en-ca/index.ts @@ -42,8 +42,11 @@ export default { signUp: 'Don’t have an account yet?', email: 'Email', password: 'Password', - submit: 'Sign in ', - employeeLoginButton: 'Targo employee login', + submit: 'Connect', + employeeLoginButton: 'Authentik', + facebookLoginButton:'Connect with Facebook', + tooltipComingSoon: 'Coming soon!', + loginOrSeparator: 'OR', emailValidation: 'Email must be a valid email.', passwordValidation: 'Password must be a valid email.', rememberMe: 'Remember me', diff --git a/src/i18n/fr-ca/index.ts b/src/i18n/fr-ca/index.ts index d0c408b..353f4ae 100644 --- a/src/i18n/fr-ca/index.ts +++ b/src/i18n/fr-ca/index.ts @@ -148,8 +148,11 @@ export default { signUp: 'Vous n’avez pas encore de compte?', email: 'Email', password: 'Mot de passe', - submit: 'Se connecter', - employeeLoginButton: 'Login employé Targo', + submit: 'Connecter', + employeeLoginButton: 'Authentik', + facebookLoginButton:'Facebook', + tooltipComingSoon: 'À venir!', + loginOrSeparator: 'OU', emailValidation: 'Email doit être un e-mail valide.', passwordValidation: 'Mot de passe doit être rempli.', rememberMe: 'Rester connecté', diff --git a/src/modules/auth/auth-store.ts b/src/modules/auth/auth-store.ts index db7d0b2..e9ff690 100644 --- a/src/modules/auth/auth-store.ts +++ b/src/modules/auth/auth-store.ts @@ -8,7 +8,7 @@ import { AuthState } from "./types/auth-interface"; export const useAuthStore = defineStore('auth', { state: (): AuthState => ({ token: "", - user: { + user: { firstName: 'Unknown', lastName: 'Unknown', email: 'guest@guest.com', @@ -23,12 +23,17 @@ export const useAuthStore = defineStore('auth', { }, actions: { - async login() { - api.get('v1/'); + login() { + const authPopup = window.open('http://localhost:3000/auth/v1/login', 'authPopup', 'width=600,height=800'); + window.addEventListener('message', (event) => { + if (event.data.type === 'authSuccess') { + console.log('Logged in successfully!'); + } + }) }, async oidcLogin() { - return "openIDConnect login"; + return "openIDConnect login"; }, async logout() { diff --git a/src/modules/auth/composables/use-auth-access.ts b/src/modules/auth/composables/use-auth-access.ts deleted file mode 100644 index 434ffd4..0000000 --- a/src/modules/auth/composables/use-auth-access.ts +++ /dev/null @@ -1,20 +0,0 @@ -/* eslint-disable */ -export const useAuthAccess = () => { - const isLoggedIn = async () => { - return authStore.hasAuthToken; - }; - - const isAuthorizedUser = async () => { - return authStore.isAuthorizedUser(); - }; - - const forgotPassword = async (email: string) => { - return authStore.forgotPassword(email); - }; - - return { - isLoggedIn, - isAuthorizedUser, - forgotPassword, - }; -}; \ No newline at end of file diff --git a/src/modules/auth/composables/use-auth-api.ts b/src/modules/auth/composables/use-auth-api.ts new file mode 100644 index 0000000..45e7c57 --- /dev/null +++ b/src/modules/auth/composables/use-auth-api.ts @@ -0,0 +1,33 @@ +import { useAuthStore } from "../auth-store"; + +export const useAuthApi = () => { + const authStore = useAuthStore(); + const login = () => { + const response = authStore.login(); + return response; + }; + + const oidcLogin = () => { + return {status: 200, message: 'sent an openid connect login request'}; + }; + + const logout = () => { + return {status: 200, message: 'sent a logout request'}; + }; + + const isLoggedIn = () => { + return {status: 200, message: 'sent a isLoggedIn request'}; + }; + + const forgotPassword = (email: string) => { + return {status: 200, message: 'sent a password reset request with email ' + email}; + }; + + return { + login, + oidcLogin, + logout, + isLoggedIn, + forgotPassword, + }; +}; \ No newline at end of file diff --git a/src/modules/auth/composables/use-auth-session.ts b/src/modules/auth/composables/use-auth-session.ts deleted file mode 100644 index 61b6fdc..0000000 --- a/src/modules/auth/composables/use-auth-session.ts +++ /dev/null @@ -1,30 +0,0 @@ -/* eslint-disable */ -export const useAuthSession = () => { - const login = async () => { - return {status: 200, message: 'sent a login request'}; - }; - - const oidcLogin = async () => { - return authStore.oidcLogin(); - }; - - const logout = async () => { - return authStore.logout(); - }; - - const setUser = (user: Record) => { - return authStore.setUser( user ); - }; - - const setAuthToken = (token: string) => { - return authStore.setAuthToken( token ); - }; - - return { - login, - oidcLogin, - logout, - setUser, - setAuthToken, - }; -}; \ No newline at end of file diff --git a/src/modules/auth/pages/auth-email-verification.vue b/src/modules/auth/pages/auth-email-verification.vue deleted file mode 100644 index e69de29..0000000 diff --git a/src/modules/auth/pages/auth-login-popup-success.vue b/src/modules/auth/pages/auth-login-popup-success.vue new file mode 100644 index 0000000..2913eab --- /dev/null +++ b/src/modules/auth/pages/auth-login-popup-success.vue @@ -0,0 +1,32 @@ + + + \ No newline at end of file diff --git a/src/modules/auth/pages/auth-login.vue b/src/modules/auth/pages/auth-login.vue index e23daf9..80d5870 100644 --- a/src/modules/auth/pages/auth-login.vue +++ b/src/modules/auth/pages/auth-login.vue @@ -1,55 +1,67 @@ \ No newline at end of file diff --git a/src/router/index.ts b/src/router/index.ts index f7abbe8..c4f7916 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -31,6 +31,7 @@ export default defineRouter(function (/* { store, ssrContext } */) { const authStore = useAuthStore(); if (destinationPage.meta.requiresAuth && !authStore.isAuthorizedUser()) { + console.log("access denied!") return { name: 'login' }; } }) diff --git a/src/router/routes.ts b/src/router/routes.ts index d371bf2..e97776f 100644 --- a/src/router/routes.ts +++ b/src/router/routes.ts @@ -20,6 +20,13 @@ const routes: RouteRecordRaw[] = [ meta: { requiresAuth: false }, }, + { + path: '/login-success', + name: 'login-success', + component: () => import('src/modules/auth/pages/auth-login-popup-success.vue'), + meta: { requiresAuth: false }, + }, + // Always leave this as last one, // but you can also remove it {