From a5f611e010290965b1d2e1b100493fccc672579d Mon Sep 17 00:00:00 2001 From: Tyler Chen Date: Thu, 23 Jul 2020 01:54:19 +0000 Subject: [PATCH] feat/ui-layout (#25) Merge branch 'master' of git.bubblev.org:bubblev/bubble-web into feat/ui-layout feat: implement actual pages Merge branch 'master' of git.bubblev.org:bubblev/bubble-web into feat/ui-layout feat: api integration for register page fix: messages feat: api integration for forget-password page fix: login title and password placeholder feat: disable button until get response Merge branch 'master' of git.bubblev.org:bubblev/bubble-web into feat/ui-layout Merge branch 'master' of git.bubblev.org:bubblev/bubble-web into feat/ui-layout feat: integrate api for new login page feat: implement responsive header feat: implement checkbox Merge branch 'master' of git.bubblev.org:bubblev/bubble-web into feat/ui-layout fix: checkbox event issue feat: implement register page feat: implement registration page Merge branch 'master' of git.bubblev.org:bubblev/bubble-web into feat/ui-layout feat: implement UI for forgot-password Merge branch 'master' of git.bubblev.org:bubblev/bubble-web into feat/ui-layout feat: implement new login page feat: implement input shared component Merge branch 'master' of git.bubblev.org:bubblev/bubble-web into feat/ui-layout feat: implement auth header Merge branch 'feat/ui-layout' of git.bubblev.org:bubblev/bubble-web into feat/ui-layout capitalize filename fix: webpack config to add output default url Merge branch 'master' into feat/ui-layout Merge branch 'master' into feat/ui-layout feat: integrate lazy loading and new page structure feat: use different layout for new Pages Co-authored-by: Tyler Co-authored-by: Jonathan Cobb Co-authored-by: jonathan Reviewed-on: https://git.bubblev.org/bubblev/bubble-web/pulls/25 --- package-lock.json | 84 +++ package.json | 2 + src/_components/layout/Header.vue | 20 +- src/_pages/auth/ForgotPassword.vue | 8 +- src/_pages/auth/Login.vue | 2 +- src/_pages/auth/Register.vue | 2 +- src/_plugins/snotify.js | 13 + src/_router/index.js | 51 +- src/_store/account.module.js | 1000 ++++++++++++++++------------ src/app/App.vue | 3 +- src/index.js | 3 + webpack.config.js | 6 +- 12 files changed, 718 insertions(+), 476 deletions(-) create mode 100644 src/_plugins/snotify.js diff --git a/package-lock.json b/package-lock.json index 8d2d3da..22cdb46 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7017,6 +7017,85 @@ "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8=", "dev": true }, + "style-loader": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-1.2.1.tgz", + "integrity": "sha512-ByHSTQvHLkWE9Ir5+lGbVOXhxX10fbprhLvdg96wedFZb4NDekDPxVKv5Fwmio+QcMlkkNfuK+5W1peQ5CUhZg==", + "dev": true, + "requires": { + "loader-utils": "^2.0.0", + "schema-utils": "^2.6.6" + }, + "dependencies": { + "ajv": { + "version": "6.12.3", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.3.tgz", + "integrity": "sha512-4K0cK3L1hsqk9xIb2z9vs/XU+PGJZ9PNpJRDS9YLzmNdX6jmVPfamLvTJr0aDAusnHyCHO6MjzlkAsgtqp9teA==", + "dev": true, + "requires": { + "fast-deep-equal": "^3.1.1", + "fast-json-stable-stringify": "^2.0.0", + "json-schema-traverse": "^0.4.1", + "uri-js": "^4.2.2" + } + }, + "ajv-keywords": { + "version": "3.5.1", + "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.1.tgz", + "integrity": "sha512-KWcq3xN8fDjSB+IMoh2VaXVhRI0BBGxoYp3rx7Pkb6z0cFjYR9Q9l4yZqqals0/zsioCmocC5H6UvsGD4MoIBA==", + "dev": true + }, + "emojis-list": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz", + "integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==", + "dev": true + }, + "fast-deep-equal": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", + "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==", + "dev": true + }, + "json5": { + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/json5/-/json5-2.1.3.tgz", + "integrity": "sha512-KXPvOm8K9IJKFM0bmdn8QXh7udDh1g/giieX0NLCaMnb4hEiVFqnop2ImTXCc5e0/oHz3LTqmHGtExn5hfMkOA==", + "dev": true, + "requires": { + "minimist": "^1.2.5" + } + }, + "loader-utils": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz", + "integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==", + "dev": true, + "requires": { + "big.js": "^5.2.2", + "emojis-list": "^3.0.0", + "json5": "^2.1.2" + } + }, + "minimist": { + "version": "1.2.5", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz", + "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==", + "dev": true + }, + "schema-utils": { + "version": "2.7.0", + "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.0.tgz", + "integrity": "sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A==", + "dev": true, + "requires": { + "@types/json-schema": "^7.0.4", + "ajv": "^6.12.2", + "ajv-keywords": "^3.4.1" + } + } + } + }, "supports-color": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", @@ -7677,6 +7756,11 @@ "resolved": "https://registry.npmjs.org/vue-select/-/vue-select-3.10.5.tgz", "integrity": "sha512-32kJNHE9FqV2RzuIfwAYHny40+EltZjf86Jf4cIHc0QUy2/yAr0PM7cET1MBJe+puJdYrItGTwnmTC4I9gKLWg==" }, + "vue-snotify": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/vue-snotify/-/vue-snotify-3.2.1.tgz", + "integrity": "sha512-7kETtCAK3key/mDkz47FY/LuPzDGNwHHrYmS037JuVac2FW/9GTtoCNIrOp+SNbpMHeXFdLIDktkBK0IdPdHew==" + }, "vue-spinner": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/vue-spinner/-/vue-spinner-1.0.4.tgz", diff --git a/package.json b/package.json index 9472da4..a25fcde 100644 --- a/package.json +++ b/package.json @@ -22,6 +22,7 @@ "vue-datetime": "^1.0.0-beta.11", "vue-router": "^3.0.6", "vue-select": "^3.4.0", + "vue-snotify": "^3.2.1", "vue-spinner": "^1.0.4", "vuelidate": "^0.7.5", "vuex": "^3.1.1" @@ -39,6 +40,7 @@ "file-loader": "^6.0.0", "html-webpack-plugin": "^3.2.0", "path": "^0.12.7", + "style-loader": "^1.2.1", "vue-loader": "^14.2.3", "vue-template-compiler": "^2.6.10", "webpack": "^4.39.3", diff --git a/src/_components/layout/Header.vue b/src/_components/layout/Header.vue index cfe8ac8..aae0f5b 100644 --- a/src/_components/layout/Header.vue +++ b/src/_components/layout/Header.vue @@ -8,17 +8,17 @@ > - + - + @@ -33,13 +33,13 @@ v-click-outside="hide" > - Help + {{ messages.button_label_help }} - - Sign In + + {{ messages.button_label_sign_up }} - - Sign Out + + {{ messages.button_label_sign_in }} diff --git a/src/_pages/auth/ForgotPassword.vue b/src/_pages/auth/ForgotPassword.vue index c02f6a4..bcb4d50 100644 --- a/src/_pages/auth/ForgotPassword.vue +++ b/src/_pages/auth/ForgotPassword.vue @@ -115,7 +115,13 @@ export default { username: this.email, messages: this.messages, errors: this.errors, - }); + }) + .then(() => { + this.$snotify.success(this.messages.message_resetPassword_sent); + }) + .catch((err) => { + this.$snotify.error(this.messages.message_resetPassword_sent); + }); } }, }, diff --git a/src/_pages/auth/Login.vue b/src/_pages/auth/Login.vue index 95681cb..12bf62b 100644 --- a/src/_pages/auth/Login.vue +++ b/src/_pages/auth/Login.vue @@ -126,7 +126,7 @@ - + {{ messages.button_label_forgotPassword }} diff --git a/src/_plugins/snotify.js b/src/_plugins/snotify.js new file mode 100644 index 0000000..5f2b41a --- /dev/null +++ b/src/_plugins/snotify.js @@ -0,0 +1,13 @@ +import Vue from 'vue'; +import Snotify, { SnotifyPosition } from 'vue-snotify'; +import 'vue-snotify/styles/material.css'; + +const options = { + toast: { + position: SnotifyPosition.rightTop, + }, + timeout: 3000, + progressBar: true, +}; + +Vue.use(Snotify, options); diff --git a/src/_router/index.js b/src/_router/index.js index 16bc99d..857e92f 100644 --- a/src/_router/index.js +++ b/src/_router/index.js @@ -9,10 +9,10 @@ import LegalPage from '~/app/LegalPage'; import SupportPage from '~/app/SupportPage'; import ActivationPage from '~/auth/ActivationPage'; import ModelSetupPage from '~/admin/ModelSetupPage'; -import RegisterPage from '~/auth/RegisterPage'; -import LoginPage from '~/auth/LoginPage'; +// import RegisterPage from '~/auth/RegisterPage'; +// import LoginPage from '~/auth/LoginPage'; import LogoutPage from '~/auth/LogoutPage'; -import ForgotPasswordPage from '~/auth/ForgotPasswordPage'; +// import ForgotPasswordPage from '~/auth/ForgotPasswordPage'; import MultifactorAuthPage from '~/auth/MultifactorAuthPage'; import AppLoginPage from '~/auth/AppLoginPage'; import RestorePage from '~/auth/RestorePage'; @@ -70,6 +70,28 @@ export const router = new Router({ { path: '/new_pages', component: () => import('~/_pages/Layout'), + children: [ + { + path: '', + component: () => import('~/_pages/auth/Layout'), + children: [], + }, + { + path: '', + component: () => import('~/_pages/main/Layout'), + children: [ + { + path: 'test', + component: () => import('~/_pages/main/Test'), + }, + ], + }, + ], + }, + + { + path: '', + component: () => import('~/_pages/Layout'), children: [ { path: '', @@ -80,7 +102,7 @@ export const router = new Router({ component: () => import('~/_pages/auth/Login'), }, { - path: 'forgot-password', + path: 'forgotPassword', component: () => import('~/_pages/auth/ForgotPassword'), }, { @@ -92,12 +114,7 @@ export const router = new Router({ { path: '', component: () => import('~/_pages/main/Layout'), - children: [ - { - path: 'test', - component: () => import('~/_pages/main/Test'), - }, - ], + children: [], }, ], }, @@ -157,15 +174,15 @@ export const router = new Router({ { path: '/resetPassword/:code', component: SetPasswordPage }, { path: '/activate', component: ActivationPage }, - { - path: '/register', - component: RegisterPage, - children: paymentMethodsChildren, - }, + // { + // path: '/register', + // component: RegisterPage, + // children: paymentMethodsChildren, + // }, { path: '/auth', component: MultifactorAuthPage }, - { path: '/login', component: LoginPage }, + // { path: '/login', component: LoginPage }, { path: '/logout', component: LogoutPage }, - { path: '/forgotPassword', component: ForgotPasswordPage }, + // { path: '/forgotPassword', component: ForgotPasswordPage }, { path: '/appLogin', component: AppLoginPage }, { path: '/restore', component: RestorePage }, diff --git a/src/_store/account.module.js b/src/_store/account.module.js index 8c5ae6b..0fef1cd 100644 --- a/src/_store/account.module.js +++ b/src/_store/account.module.js @@ -4,480 +4,600 @@ */ import { userService } from '~/_services'; import { util } from '~/_helpers'; -import {router} from '~/_router'; +import { router } from '~/_router'; const user = util.currentUser(); const defaultStatus = { - loggingIn: false, - loggedIn: false, - restoring: false, - registering: false, - updating: false, - settingLocale: false, - activating: false, - approving: false, - denying: false, - authenticating: false, - sendingVerification: false, - sendingResetPasswordMessage: false, - registrationError: null, - requestAccountDownloadRequestSent: false, - downloadingAccount: false + loggingIn: false, + loggedIn: false, + restoring: false, + registering: false, + updating: false, + settingLocale: false, + activating: false, + approving: false, + denying: false, + authenticating: false, + sendingVerification: false, + sendingResetPasswordMessage: false, + registrationError: null, + requestAccountDownloadRequestSent: false, + downloadingAccount: false, }; const state = { - activated: null, - status: Object.assign({}, defaultStatus, {loggedIn: (user != null)}), - user: user, - actionStatus: {}, - loginError: null, - resetPasswordMessageSent: false, - locale: user == null ? 'detect' : (typeof user.locale !== 'undefined' && user.locale !== null ? user.locale : 'detect') + activated: null, + status: Object.assign({}, defaultStatus, { loggedIn: user != null }), + user: user, + actionStatus: {}, + loginError: null, + resetPasswordMessageSent: false, + locale: + user == null + ? 'detect' + : typeof user.locale !== 'undefined' && user.locale !== null + ? user.locale + : 'detect', }; const actions = { - refreshUser({ commit }) { - commit('refreshUser', JSON.parse(localStorage.getItem(util.USER_KEY))); - }, - checkSession({ commit }, { messages, errors }) { - commit('checkSessionRequest'); - userService.getMe(messages, errors) + refreshUser({ commit }) { + commit('refreshUser', JSON.parse(localStorage.getItem(util.USER_KEY))); + }, + checkSession({ commit }, { messages, errors }) { + commit('checkSessionRequest'); + userService.getMe(messages, errors).then( + (user) => commit('checkSessionSuccess', user), + (error) => { + commit('checkSessionFailure', error); + if ( + error === 'Unauthorized' || + error === 'Not Found' || + error === 'Forbidden' + ) { + userService + .logout(messages, errors) .then( - user => commit('checkSessionSuccess', user), - error => { - commit('checkSessionFailure', error); - if (error === 'Unauthorized' || error === 'Not Found' || error === 'Forbidden' ) { - userService.logout(messages, errors).then( - ok => router.replace('/login'), - error => router.replace('/login') - ); - } - } + (ok) => router.replace('/login'), + (error) => router.replace('/login') ); - }, - login({ dispatch, commit }, { user, systemConfigs, messages, errors }) { - commit('loginRequest', { name: user.name }); - userService.login(user.name, user.password, user.totpToken, user.unlockKey, messages, errors) - .then( - user => { - commit('loginSuccess', user); - if (user.token) { - if (user.unlockKey) { - console.log('account.login: reloading system configs after unlock'); - dispatch('system/loadSystemConfigs'); - } - const landing = util.getLandingPage(); - if (landing === null) { - console.log('account.login: no landing page, systemConfigs.bubbleNode=='+systemConfigs.bubbleNode+', systemConfigs.sageLauncher=='+systemConfigs.sageLauncher); - if (systemConfigs.bubbleNode === false || systemConfigs.sageLauncher === true) { - router.replace('/bubbles'); - } else if (systemConfigs.bubbleNode === true) { - router.replace('/devices'); - } else { - router.replace('/'); - } - } else { - console.log('account.login: landing page=='+JSON.stringify(landing)+', systemConfigs.bubbleNode=='+systemConfigs.bubbleNode); - util.resetLandingPage(); - router.replace(landing.fullPath); - } - } else if (user.multifactorAuth) { - router.replace('/auth'); - } - }, - error => commit('loginFailure', error) - ); - }, - appLogin({ commit }, { session, uri, messages, errors }) { - commit('appLoginRequest'); - userService.appLogin(session, messages, errors) - .then( - user => commit('appLoginSuccess', {user, uri}), - error => { - commit('appLoginFailure', error); - if (error === 'Unauthorized' || error === 'Not Found' || error === 'Forbidden' ) { - userService.logout(messages, errors).then( - ok => router.replace('/login'), - error => router.replace('/login') - ); - } - } - ); - }, - logout({ commit }, {messages, errors}) { - commit('logoutRequest'); - userService.logout(messages, errors) - .then( - ok => commit('logoutSuccess'), - error => commit('logoutFailure', error) - ); - }, - restore({ commit }, { shortKey, longKey, password, systemConfigs, messages, errors }) { - commit('restoreRequest', systemConfigs); - userService.restore(shortKey, longKey, password, messages, errors) - .then(ok => commit('restoreSuccess', systemConfigs), - error => commit('restoreFailure', systemConfigs, error)); - }, - forgotPassword({ commit }, {username, messages, errors}) { - commit('forgotPasswordRequest'); - userService.forgotPassword(username, messages, errors) - .then( - ok => commit('forgotPasswordSuccess'), - error => commit('forgotPasswordFailure', error) - ); - }, - register({ dispatch, commit }, {user, messages, errors}) { - commit('registerRequest', user); - userService.register(user, messages, errors) - .then( - user => { - commit('registerSuccess', user); - router.push('/new_bubble'); - setTimeout(() => { - // display success message after route change completes - dispatch('alert/success', messages.alert_registration_success, { root: true }); - }) - }, - error => commit('registerFailure', error) - ); - }, - setLocale({ commit }, {locale, messages, errors}) { - state.locale = locale; - commit('setLocaleRequest', locale); - userService.setLocale(locale, messages, errors) - .then( - user => commit('setLocaleSuccess', user), - error => commit('setLocaleFailure', error) - ); - }, - update({ dispatch, commit }, {user, messages, errors}) { - commit('updateRequest', user); - userService.update(user, messages, errors) + } + } + ); + }, + login({ dispatch, commit }, { user, systemConfigs, messages, errors }) { + commit('loginRequest', { name: user.name }); + userService + .login( + user.name, + user.password, + user.totpToken, + user.unlockKey, + messages, + errors + ) + .then( + (user) => { + commit('loginSuccess', user); + if (user.token) { + if (user.unlockKey) { + console.log( + 'account.login: reloading system configs after unlock' + ); + dispatch('system/loadSystemConfigs'); + } + const landing = util.getLandingPage(); + if (landing === null) { + console.log( + 'account.login: no landing page, systemConfigs.bubbleNode==' + + systemConfigs.bubbleNode + + ', systemConfigs.sageLauncher==' + + systemConfigs.sageLauncher + ); + if ( + systemConfigs.bubbleNode === false || + systemConfigs.sageLauncher === true + ) { + router.replace('/bubbles'); + } else if (systemConfigs.bubbleNode === true) { + router.replace('/devices'); + } else { + router.replace('/'); + } + } else { + console.log( + 'account.login: landing page==' + + JSON.stringify(landing) + + ', systemConfigs.bubbleNode==' + + systemConfigs.bubbleNode + ); + util.resetLandingPage(); + router.replace(landing.fullPath); + } + } else if (user.multifactorAuth) { + router.replace('/auth'); + } + }, + (error) => commit('loginFailure', error) + ); + }, + appLogin({ commit }, { session, uri, messages, errors }) { + commit('appLoginRequest'); + userService.appLogin(session, messages, errors).then( + (user) => commit('appLoginSuccess', { user, uri }), + (error) => { + commit('appLoginFailure', error); + if ( + error === 'Unauthorized' || + error === 'Not Found' || + error === 'Forbidden' + ) { + userService + .logout(messages, errors) .then( - user => { - commit('updateSuccess', user); - router.push('/me'); - setTimeout(() => { - // display success message after route change completes - dispatch('alert/success', messages.message_profile_update_success, { root: true }); - }) - }, - error => { - commit('updateFailure', error); - dispatch('alert/error', error, { root: true }); - } + (ok) => router.replace('/login'), + (error) => router.replace('/login') ); - }, + } + } + ); + }, + logout({ commit }, { messages, errors }) { + commit('logoutRequest'); + userService + .logout(messages, errors) + .then( + (ok) => commit('logoutSuccess'), + (error) => commit('logoutFailure', error) + ); + }, + restore( + { commit }, + { shortKey, longKey, password, systemConfigs, messages, errors } + ) { + commit('restoreRequest', systemConfigs); + userService + .restore(shortKey, longKey, password, messages, errors) + .then( + (ok) => commit('restoreSuccess', systemConfigs), + (error) => commit('restoreFailure', systemConfigs, error) + ); + }, + forgotPassword({ commit }, { username, messages, errors }) { + commit('forgotPasswordRequest'); + return userService.forgotPassword(username, messages, errors).then( + (ok) => { + commit('forgotPasswordSuccess'); + }, + (error) => { + commit('forgotPasswordFailure', error); + throw new Error(error); + } + ); + }, + register({ dispatch, commit }, { user, messages, errors }) { + commit('registerRequest', user); + userService.register(user, messages, errors).then( + (user) => { + commit('registerSuccess', user); + router.push('/new_bubble'); + setTimeout(() => { + // display success message after route change completes + dispatch('alert/success', messages.alert_registration_success, { + root: true, + }); + }); + }, + (error) => commit('registerFailure', error) + ); + }, + setLocale({ commit }, { locale, messages, errors }) { + state.locale = locale; + commit('setLocaleRequest', locale); + userService + .setLocale(locale, messages, errors) + .then( + (user) => commit('setLocaleSuccess', user), + (error) => commit('setLocaleFailure', error) + ); + }, + update({ dispatch, commit }, { user, messages, errors }) { + commit('updateRequest', user); + userService.update(user, messages, errors).then( + (user) => { + commit('updateSuccess', user); + router.push('/me'); + setTimeout(() => { + // display success message after route change completes + dispatch('alert/success', messages.message_profile_update_success, { + root: true, + }); + }); + }, + (error) => { + commit('updateFailure', error); + dispatch('alert/error', error, { root: true }); + } + ); + }, - approveAction({ commit }, {userId, code, data, messages, errors, enableTotpModal}) { - commit('approveActionRequest'); - userService.approveAction(userId, code, data, messages, errors, enableTotpModal) - .then( - policy => commit('approveActionSuccess', policy), - error => commit('approveActionFailure', error) - ); - }, - denyAction({ commit }, {userId, code, messages, errors}) { - commit('denyActionRequest'); - userService.denyAction(userId, code, messages, errors) - .then( - policy => commit('denyActionSuccess', policy), - error => commit('denyActionFailure', error) - ); - }, - sendAuthenticatorCode({ commit }, {userId, code, authOnly, verifyOnly, messages, errors}) { - commit('sendAuthenticatorCodeRequest'); - userService.sendAuthenticatorCode(userId, code, authOnly, verifyOnly, messages, errors) - .then( - user => commit('sendAuthenticatorCodeSuccess', {user, messages}), - error => commit('sendAuthenticatorCodeFailure', error) - ); - }, - resendVerificationCode({ dispatch, commit }, {userId, contact, messages, errors}) { - commit('resendVerificationCodeRequest'); - userService.resendVerificationCode(userId, contact, messages, errors) - .then( - policy => { - commit('resendVerificationCodeSuccess', policy); - setTimeout(() => { - // display success message after message sent - dispatch('alert/success', messages.alert_resend_verification_success, { root: true }); - }); - }, - error => commit('resendVerificationCodeFailure', error) - ); - }, - requestAccountDownload({ commit }, {messages, errors}) { - commit('requestAccountDownloadRequest'); - userService.requestAccountDownload(messages, errors) - .then(ok => commit('requestAccountDownloadSuccess'), - error => commit('requestAccountDownloadFailure', error)); - }, - downloadAccount({ commit }, {token, messages, errors}) { - commit('downloadAccountRequest'); - userService.downloadAccount(token, messages, errors) - .then(ok => commit('downloadAccountSuccess'), - error => commit('downloadAccountFailure', error)); - } + approveAction( + { commit }, + { userId, code, data, messages, errors, enableTotpModal } + ) { + commit('approveActionRequest'); + userService + .approveAction(userId, code, data, messages, errors, enableTotpModal) + .then( + (policy) => commit('approveActionSuccess', policy), + (error) => commit('approveActionFailure', error) + ); + }, + denyAction({ commit }, { userId, code, messages, errors }) { + commit('denyActionRequest'); + userService + .denyAction(userId, code, messages, errors) + .then( + (policy) => commit('denyActionSuccess', policy), + (error) => commit('denyActionFailure', error) + ); + }, + sendAuthenticatorCode( + { commit }, + { userId, code, authOnly, verifyOnly, messages, errors } + ) { + commit('sendAuthenticatorCodeRequest'); + userService + .sendAuthenticatorCode( + userId, + code, + authOnly, + verifyOnly, + messages, + errors + ) + .then( + (user) => commit('sendAuthenticatorCodeSuccess', { user, messages }), + (error) => commit('sendAuthenticatorCodeFailure', error) + ); + }, + resendVerificationCode( + { dispatch, commit }, + { userId, contact, messages, errors } + ) { + commit('resendVerificationCodeRequest'); + userService.resendVerificationCode(userId, contact, messages, errors).then( + (policy) => { + commit('resendVerificationCodeSuccess', policy); + setTimeout(() => { + // display success message after message sent + dispatch( + 'alert/success', + messages.alert_resend_verification_success, + { root: true } + ); + }); + }, + (error) => commit('resendVerificationCodeFailure', error) + ); + }, + requestAccountDownload({ commit }, { messages, errors }) { + commit('requestAccountDownloadRequest'); + userService + .requestAccountDownload(messages, errors) + .then( + (ok) => commit('requestAccountDownloadSuccess'), + (error) => commit('requestAccountDownloadFailure', error) + ); + }, + downloadAccount({ commit }, { token, messages, errors }) { + commit('downloadAccountRequest'); + userService + .downloadAccount(token, messages, errors) + .then( + (ok) => commit('downloadAccountSuccess'), + (error) => commit('downloadAccountFailure', error) + ); + }, }; const mutations = { - refreshUser(state, user) { - state.status = Object.assign({}, state.status, {loggedIn: (user !== null)}); - state.user = user; - }, - checkSessionRequest(state) {}, - checkSessionSuccess(state, user) { - if (user.token) { - if (util.currentUser() === null) { - // we must have logged out while this request was in flight... do nothing - state.user = null; - } else { - localStorage.setItem(util.USER_KEY, JSON.stringify(user)); - state.status = Object.assign({}, state.status, {loggingIn: false, loggedIn: true}); - state.user = user; - } - } - state.locale = (typeof user.locale !== 'undefined' && user.locale !== null ? user.locale : state.locale); - }, - checkSessionFailure(state, error) { + refreshUser(state, user) { + state.status = Object.assign({}, state.status, { loggedIn: user !== null }); + state.user = user; + }, + checkSessionRequest(state) {}, + checkSessionSuccess(state, user) { + if (user.token) { + if (util.currentUser() === null) { + // we must have logged out while this request was in flight... do nothing state.user = null; - state.status = Object.assign({}, state.status, {loggedIn: false}); - }, - loginRequest(state, user) { - state.loginError = null; - state.status = Object.assign({}, state.status, {loggingIn: true}); - state.user = user; - }, - loginSuccess(state, user) { - if (user.token) { - state.status = Object.assign({}, state.status, {loggingIn: false, loggedIn: true}); - } else if (user.multifactorAuth) { - state.status = { multifactorAuth: true }; - } else { - state.status = {}; - } + } else { localStorage.setItem(util.USER_KEY, JSON.stringify(user)); + state.status = Object.assign({}, state.status, { + loggingIn: false, + loggedIn: true, + }); state.user = user; - state.locale = (typeof user.locale !== 'undefined' && user.locale !== null ? user.locale : state.locale); - }, - loginFailure(state, error) { - state.loginError = error; - state.status = Object.assign({}, state.status, {loggingIn: false, loggedIn: false}); - state.user = null; - }, + } + } + state.locale = + typeof user.locale !== 'undefined' && user.locale !== null + ? user.locale + : state.locale; + }, + checkSessionFailure(state, error) { + state.user = null; + state.status = Object.assign({}, state.status, { loggedIn: false }); + }, + loginRequest(state, user) { + state.loginError = null; + state.status = Object.assign({}, state.status, { loggingIn: true }); + state.user = user; + }, + loginSuccess(state, user) { + if (user.token) { + state.status = Object.assign({}, state.status, { + loggingIn: false, + loggedIn: true, + }); + } else if (user.multifactorAuth) { + state.status = { multifactorAuth: true }; + } else { + state.status = {}; + } + localStorage.setItem(util.USER_KEY, JSON.stringify(user)); + state.user = user; + state.locale = + typeof user.locale !== 'undefined' && user.locale !== null + ? user.locale + : state.locale; + }, + loginFailure(state, error) { + state.loginError = error; + state.status = Object.assign({}, state.status, { + loggingIn: false, + loggedIn: false, + }); + state.user = null; + }, - appLoginRequest(state) { - state.loginError = null; - state.status = Object.assign({}, state.status, {loggingIn: true}); - }, - appLoginSuccess(state, {user, uri}) { - if (user.token) { - if (util.currentUser() === null) { - // we must have logged out while this request was in flight... do nothing - state.user = null; - } else { - localStorage.setItem(util.USER_KEY, JSON.stringify(user)); - state.status = Object.assign({}, state.status, {loggingIn: false, loggedIn: true}); - state.user = user; - } - } - state.locale = (typeof user.locale !== 'undefined' && user.locale !== null ? user.locale : state.locale); - if (user.token) router.replace(uri); - }, - appLoginFailure(state, error) { + appLoginRequest(state) { + state.loginError = null; + state.status = Object.assign({}, state.status, { loggingIn: true }); + }, + appLoginSuccess(state, { user, uri }) { + if (user.token) { + if (util.currentUser() === null) { + // we must have logged out while this request was in flight... do nothing state.user = null; - state.status = Object.assign({}, state.status, {loggedIn: false}); - }, + } else { + localStorage.setItem(util.USER_KEY, JSON.stringify(user)); + state.status = Object.assign({}, state.status, { + loggingIn: false, + loggedIn: true, + }); + state.user = user; + } + } + state.locale = + typeof user.locale !== 'undefined' && user.locale !== null + ? user.locale + : state.locale; + if (user.token) router.replace(uri); + }, + appLoginFailure(state, error) { + state.user = null; + state.status = Object.assign({}, state.status, { loggedIn: false }); + }, - logoutRequest(state) {}, - logoutSuccess(state) { - state.status = Object.assign({}, defaultStatus); - localStorage.removeItem(util.USER_KEY); - state.user = null; - }, - logoutFailure(state, error) { - console.log('logout failed: '+JSON.stringify(error)); - }, + logoutRequest(state) {}, + logoutSuccess(state) { + state.status = Object.assign({}, defaultStatus); + localStorage.removeItem(util.USER_KEY); + state.user = null; + }, + logoutFailure(state, error) { + console.log('logout failed: ' + JSON.stringify(error)); + }, - restoreRequest(state, systemConfigs) { - state.status = Object.assign({}, state.status, {restoring: true}); - systemConfigs.restoreInProgress = true; - }, - restoreSuccess(state, systemConfigs) { - state.status = Object.assign({}, state.status, {restoring: false}); - systemConfigs.awaitingRestore = false; - }, - restoreFailure(state, systemConfigs, error) { - state.status = Object.assign({}, state.status, {restoring: false}); - systemConfigs.restoreInProgress = false; - console.log('restore failed: ' + JSON.stringify(error)); - }, + restoreRequest(state, systemConfigs) { + state.status = Object.assign({}, state.status, { restoring: true }); + systemConfigs.restoreInProgress = true; + }, + restoreSuccess(state, systemConfigs) { + state.status = Object.assign({}, state.status, { restoring: false }); + systemConfigs.awaitingRestore = false; + }, + restoreFailure(state, systemConfigs, error) { + state.status = Object.assign({}, state.status, { restoring: false }); + systemConfigs.restoreInProgress = false; + console.log('restore failed: ' + JSON.stringify(error)); + }, - forgotPasswordRequest(state) { - state.status = Object.assign({}, {sendingResetPasswordMessage: true}); - state.resetPasswordMessageSent = false; - }, - forgotPasswordSuccess(state) { - state.status = Object.assign({}, defaultStatus); - state.resetPasswordMessageSent = true; - }, - forgotPasswordFailure(state, error) { - state.status = Object.assign({}, defaultStatus); - console.log('forgotPassword failed: '+JSON.stringify(error)); - }, + forgotPasswordRequest(state) { + state.status = Object.assign({}, { sendingResetPasswordMessage: true }); + state.resetPasswordMessageSent = false; + }, + forgotPasswordSuccess(state) { + state.status = Object.assign({}, defaultStatus); + state.resetPasswordMessageSent = true; + }, + forgotPasswordFailure(state, error) { + state.status = Object.assign({}, defaultStatus); + console.log('forgotPassword failed: ' + JSON.stringify(error)); + }, - registerRequest(state, user) { - state.status = Object.assign({}, state.status, {registering: true}); - state.user = user; - }, - registerSuccess(state, user) { - state.user = user; - state.status = Object.assign({}, state.status, {registering: false}); - localStorage.setItem(util.USER_KEY, JSON.stringify(user)); - state.locale = (typeof user.locale !== 'undefined' && user.locale !== null ? user.locale : state.locale); - state.registrationError = null; - }, - registerFailure(state, error) { - state.status = Object.assign({}, state.status, {registering: false}); - state.status = {}; - state.registrationError = error; - }, - - setLocaleRequest(state, locale) { - state.status = Object.assign({}, state.status, {settingLocale: true}); - state.locale = locale; - const user = util.currentUser(); - if (user === null) { - localStorage.setItem(util.USER_KEY, JSON.stringify({locale: locale})); - } else { - user.locale = locale; - localStorage.setItem(util.USER_KEY, JSON.stringify(user)); - } - state.user = user; - }, - setLocaleSuccess(state, user) { - state.locale = ''+state.locale; - state.status = Object.assign({}, state.status, {settingLocale: false}); - }, - setLocaleFailure(state) { - state.status = Object.assign({}, state.status, {settingLocale: false}); - state.status = {}; - }, + registerRequest(state, user) { + state.status = Object.assign({}, state.status, { registering: true }); + state.user = user; + }, + registerSuccess(state, user) { + state.user = user; + state.status = Object.assign({}, state.status, { registering: false }); + localStorage.setItem(util.USER_KEY, JSON.stringify(user)); + state.locale = + typeof user.locale !== 'undefined' && user.locale !== null + ? user.locale + : state.locale; + state.registrationError = null; + }, + registerFailure(state, error) { + state.status = Object.assign({}, state.status, { registering: false }); + state.status = {}; + state.registrationError = error; + }, - updateRequest(state, user) { - state.status = Object.assign({}, state.status, {updating: true}); - state.user = user; - }, - updateSuccess(state, user) { - state.status = Object.assign({}, state.status, {updating: false}); - localStorage.setItem(util.USER_KEY, JSON.stringify(user)); - state.user = user; - state.locale = (typeof user.locale !== 'undefined' && user.locale !== null ? user.locale : state.locale); - }, - updateFailure(state) { - state.status = Object.assign({}, state.status, {updating: false}); - state.status = {}; - }, + setLocaleRequest(state, locale) { + state.status = Object.assign({}, state.status, { settingLocale: true }); + state.locale = locale; + const user = util.currentUser(); + if (user === null) { + localStorage.setItem(util.USER_KEY, JSON.stringify({ locale: locale })); + } else { + user.locale = locale; + localStorage.setItem(util.USER_KEY, JSON.stringify(user)); + } + state.user = user; + }, + setLocaleSuccess(state, user) { + state.locale = '' + state.locale; + state.status = Object.assign({}, state.status, { settingLocale: false }); + }, + setLocaleFailure(state) { + state.status = Object.assign({}, state.status, { settingLocale: false }); + state.status = {}; + }, - approveActionRequest(state) { - state.status = Object.assign({}, state.status, {approving: true}); - state.actionStatus = { requesting: true, type: 'approve' }; - }, - approveActionSuccess(state, user) { - state.status = Object.assign({}, state.status, {approving: false}); - state.actionStatus = { success: true, type: 'approve', result: user }; - if (user.token) { - localStorage.setItem(util.USER_KEY, JSON.stringify(user)); - state.user = user; - } - }, - approveActionFailure(state, error) { - state.status = Object.assign({}, state.status, {approving: false}); - state.actionStatus = { error: error, type: 'approve' }; - }, - denyActionRequest(state) { - state.status = Object.assign({}, state.status, {denying: true}); - state.actionStatus = { requesting: true, type: 'deny' }; - }, - denyActionSuccess(state, denial) { - state.status = Object.assign({}, state.status, {denying: false}); - state.actionStatus = { success: true, type: 'deny', result: denial }; - state.denial = denial; - }, - denyActionFailure(state, error) { - state.status = Object.assign({}, state.status, {denying: false}); - state.actionStatus = { error: error, type: 'deny' }; - }, - sendAuthenticatorCodeRequest(state) { - state.status = Object.assign({}, state.status, {authenticating: true}); - state.actionStatus = { requesting: true, type: 'approve' }; - }, - sendAuthenticatorCodeSuccess(state, user, messages) { - state.status = Object.assign({}, state.status, {authenticating: false}); - state.actionStatus = { success: true, type: 'approve', result: user }; - console.log('auth successful -- setting window.showTotpModal = false'); - window.showTotpModal = false; + updateRequest(state, user) { + state.status = Object.assign({}, state.status, { updating: true }); + state.user = user; + }, + updateSuccess(state, user) { + state.status = Object.assign({}, state.status, { updating: false }); + localStorage.setItem(util.USER_KEY, JSON.stringify(user)); + state.user = user; + state.locale = + typeof user.locale !== 'undefined' && user.locale !== null + ? user.locale + : state.locale; + }, + updateFailure(state) { + state.status = Object.assign({}, state.status, { updating: false }); + state.status = {}; + }, - if (user.token) { - state.user = user; - localStorage.setItem(util.USER_KEY, JSON.stringify(user)); + approveActionRequest(state) { + state.status = Object.assign({}, state.status, { approving: true }); + state.actionStatus = { requesting: true, type: 'approve' }; + }, + approveActionSuccess(state, user) { + state.status = Object.assign({}, state.status, { approving: false }); + state.actionStatus = { success: true, type: 'approve', result: user }; + if (user.token) { + localStorage.setItem(util.USER_KEY, JSON.stringify(user)); + state.user = user; + } + }, + approveActionFailure(state, error) { + state.status = Object.assign({}, state.status, { approving: false }); + state.actionStatus = { error: error, type: 'approve' }; + }, + denyActionRequest(state) { + state.status = Object.assign({}, state.status, { denying: true }); + state.actionStatus = { requesting: true, type: 'deny' }; + }, + denyActionSuccess(state, denial) { + state.status = Object.assign({}, state.status, { denying: false }); + state.actionStatus = { success: true, type: 'deny', result: denial }; + state.denial = denial; + }, + denyActionFailure(state, error) { + state.status = Object.assign({}, state.status, { denying: false }); + state.actionStatus = { error: error, type: 'deny' }; + }, + sendAuthenticatorCodeRequest(state) { + state.status = Object.assign({}, state.status, { authenticating: true }); + state.actionStatus = { requesting: true, type: 'approve' }; + }, + sendAuthenticatorCodeSuccess(state, user, messages) { + state.status = Object.assign({}, state.status, { authenticating: false }); + state.actionStatus = { success: true, type: 'approve', result: user }; + console.log('auth successful -- setting window.showTotpModal = false'); + window.showTotpModal = false; - } else if (user.multifactorAuth) { - state.user.multifactorAuth = user.multifactorAuth; - localStorage.setItem(util.USER_KEY, JSON.stringify(user)); - } - }, - sendAuthenticatorCodeFailure(state, error) { - state.status = Object.assign({}, state.status, {authenticating: false}); - state.actionStatus = { error: error, type: 'approve' }; - }, + if (user.token) { + state.user = user; + localStorage.setItem(util.USER_KEY, JSON.stringify(user)); + } else if (user.multifactorAuth) { + state.user.multifactorAuth = user.multifactorAuth; + localStorage.setItem(util.USER_KEY, JSON.stringify(user)); + } + }, + sendAuthenticatorCodeFailure(state, error) { + state.status = Object.assign({}, state.status, { authenticating: false }); + state.actionStatus = { error: error, type: 'approve' }; + }, - resendVerificationCodeRequest(state) { - state.status = Object.assign({}, state.status, {sendingVerification: true}); - state.actionStatus = { requesting: true, type: 'verify' }; - }, - resendVerificationCodeSuccess(state, policy) { - state.status = Object.assign({}, state.status, {sendingVerification: false}); - state.actionStatus = { success: true, type: 'verify', result: policy }; - }, - resendVerificationCodeFailure(state, error) { - state.status = Object.assign({}, state.status, {sendingVerification: false}); - state.actionStatus = { error: error, type: 'verify' }; - }, + resendVerificationCodeRequest(state) { + state.status = Object.assign({}, state.status, { + sendingVerification: true, + }); + state.actionStatus = { requesting: true, type: 'verify' }; + }, + resendVerificationCodeSuccess(state, policy) { + state.status = Object.assign({}, state.status, { + sendingVerification: false, + }); + state.actionStatus = { success: true, type: 'verify', result: policy }; + }, + resendVerificationCodeFailure(state, error) { + state.status = Object.assign({}, state.status, { + sendingVerification: false, + }); + state.actionStatus = { error: error, type: 'verify' }; + }, - requestAccountDownloadRequest(state) { - state.status = Object.assign({}, state.status, - { downloadingAccount: false, requestAccountDownloadRequestSent: false }); - state.actionStatus = { requesting: true, type: 'requestDownload' }; - }, - requestAccountDownloadSuccess(state) { - state.status = Object.assign({}, state.status, { requestAccountDownloadRequestSent: true }); - state.actionStatus = { success: true, type: 'requestDownload' }; - }, - requestAccountDownloadFailure(state, error) { - state.actionStatus = { error: error, type: 'requestDownload' }; - console.log('requestAccountDownloadFailure: ' + JSON.stringify(error)); - }, + requestAccountDownloadRequest(state) { + state.status = Object.assign({}, state.status, { + downloadingAccount: false, + requestAccountDownloadRequestSent: false, + }); + state.actionStatus = { requesting: true, type: 'requestDownload' }; + }, + requestAccountDownloadSuccess(state) { + state.status = Object.assign({}, state.status, { + requestAccountDownloadRequestSent: true, + }); + state.actionStatus = { success: true, type: 'requestDownload' }; + }, + requestAccountDownloadFailure(state, error) { + state.actionStatus = { error: error, type: 'requestDownload' }; + console.log('requestAccountDownloadFailure: ' + JSON.stringify(error)); + }, - downloadAccountRequest(state) { - state.status = Object.assign({}, state.status, { downloadingAccount: true }); - state.actionStatus = { requesting: true, type: 'download' }; - }, - downloadAccountSuccess(state) { - state.status = Object.assign({}, state.status, { downloadingAccount: false }); - state.actionStatus = { success: true, type: 'download' }; - }, - downloadAccountFailure(state, error) { - state.actionStatus = { error: error, type: 'download' }; - console.log('downloadAccountFailure: ' + JSON.stringify(error)); - } + downloadAccountRequest(state) { + state.status = Object.assign({}, state.status, { + downloadingAccount: true, + }); + state.actionStatus = { requesting: true, type: 'download' }; + }, + downloadAccountSuccess(state) { + state.status = Object.assign({}, state.status, { + downloadingAccount: false, + }); + state.actionStatus = { success: true, type: 'download' }; + }, + downloadAccountFailure(state, error) { + state.actionStatus = { error: error, type: 'download' }; + console.log('downloadAccountFailure: ' + JSON.stringify(error)); + }, }; export const account = { - namespaced: true, - state, - actions, - mutations -}; \ No newline at end of file + namespaced: true, + state, + actions, + mutations, +}; diff --git a/src/app/App.vue b/src/app/App.vue index 7aec3a9..2b9f5da 100644 --- a/src/app/App.vue +++ b/src/app/App.vue @@ -2,6 +2,7 @@