@@ -4,7 +4,10 @@ import Router from 'vue-router'; | |||
import HomePage from '../account/HomePage' | |||
import RegisterPage from '../auth/RegisterPage' | |||
import LoginPage from '../auth/LoginPage' | |||
import ProfilePage from '../account/ProfilePage' | |||
import ProfilePage from '../account/profile/ProfilePage' | |||
import PolicyPage from '../account/profile/PolicyPage' | |||
import NotificationsPage from '../account/NotificationsPage' | |||
import ChangePasswordPage from '../account/profile/ChangePasswordPage' | |||
import NetworksPage from '../account/NetworksPage' | |||
import NewNetworkPage from '../account/NewNetworkPage' | |||
import NetworkPage from '../account/NetworkPage' | |||
@@ -25,7 +28,7 @@ const newNetworkChildren = [ | |||
'unknown': UnknownPayment | |||
} | |||
}] | |||
}, | |||
} | |||
]; | |||
export const router = new Router({ | |||
@@ -38,7 +41,10 @@ export const router = new Router({ | |||
path: '', component: NetworksPage, | |||
children: newNetworkChildren | |||
}, | |||
{ path: '/profile', component: ProfilePage }, | |||
{ path: '/me', component: ProfilePage }, | |||
{ path: '/me/policy', component: PolicyPage }, | |||
{ path: '/me/changePassword', component: ChangePasswordPage }, | |||
{ path: '/notifications', component: NotificationsPage }, | |||
{ | |||
path: '/networks', component: NetworksPage , | |||
children: [ | |||
@@ -7,6 +7,10 @@ export const userService = { | |||
register, | |||
getAll, | |||
getById, | |||
getPolicyById, | |||
updatePolicyById, | |||
addPolicyContactById, | |||
removePolicyContactByTypeAndInfo, | |||
update, | |||
delete: _delete | |||
}; | |||
@@ -59,6 +63,22 @@ function getById(id, messages, errors) { | |||
return fetch(`${config.apiUrl}/users/${id}`, getWithAuth()).then(handleCrudResponse(messages, errors)); | |||
} | |||
function getPolicyById(id, messages, errors) { | |||
return fetch(`${config.apiUrl}/users/${id}/policy`, getWithAuth()).then(handleCrudResponse(messages, errors)); | |||
} | |||
function updatePolicyById(id, policy, messages, errors) { | |||
return fetch(`${config.apiUrl}/users/${id}/policy`, postWithAuth(policy)).then(handleCrudResponse(messages, errors)); | |||
} | |||
function addPolicyContactById(id, contact, messages, errors) { | |||
return fetch(`${config.apiUrl}/users/${id}/policy/contacts`, postWithAuth(contact)).then(handleCrudResponse(messages, errors)); | |||
} | |||
function removePolicyContactByTypeAndInfo(id, type, info, messages, errors) { | |||
return fetch(`${config.apiUrl}/users/${id}/policy/contacts/${type}/${info}`, deleteWithAuth()).then(handleCrudResponse(messages, errors)); | |||
} | |||
function update(user, messages, errors) { | |||
return fetch(`${config.apiUrl}/users/${user.uuid}`, postWithAuth(user)).then(handleCrudResponse(messages, errors)); | |||
} | |||
@@ -13,6 +13,7 @@ const state = { | |||
timezones: [], | |||
detectedTimezone: null, | |||
detectedLocale: null, | |||
accountDeletionOptions: [], | |||
error: null | |||
}; | |||
@@ -65,37 +66,32 @@ const getters = { | |||
title: messages.label_menu_dashboard, | |||
icon: messages.label_menu_dashboard_icon | |||
}, { | |||
href: '/profile', | |||
href: '/me', | |||
title: messages.label_menu_account, | |||
icon: messages.label_menu_account_icon, | |||
child: [{ | |||
href: '/profile/policy', | |||
title: messages.label_menu_account_policy, | |||
icon: messages.label_menu_account_policy_icon | |||
}, { | |||
href: '/profile/contacts', | |||
title: messages.label_menu_account_contacts, | |||
icon: messages.label_menu_account_contacts_icon | |||
}] | |||
icon: messages.label_menu_account_icon | |||
}, { | |||
href: '/notifications', | |||
title: messages.label_menu_notifications, | |||
icon: messages.label_menu_notifications_icon | |||
}, { | |||
href: '/logout', | |||
title: messages.label_menu_logout, | |||
icon: messages.label_menu_logout_icon | |||
}]; | |||
if (configs.paymentsEnabled) { | |||
menu[1].child.push({ | |||
href: '/me/bills', | |||
title: messages.label_menu_bills, | |||
icon: messages.label_menu_bills_icon | |||
}); | |||
} | |||
if (configs.sageLauncher) { | |||
menu.splice(2, 0, { | |||
menu.splice(3, 0, { | |||
href: '/me/networks', | |||
title: messages.label_menu_networks, | |||
icon: messages.label_menu_networks_icon | |||
}); | |||
} | |||
if (configs.paymentsEnabled) { | |||
menu.splice(4, 0,{ | |||
href: '/me/bills', | |||
title: messages.label_menu_bills, | |||
icon: messages.label_menu_bills_icon | |||
}); | |||
} | |||
if (account.state.user.admin === true) { | |||
const admin_menu = { | |||
href: '/admin', | |||
@@ -154,6 +150,9 @@ const mutations = { | |||
} | |||
state.locales = locales; | |||
} | |||
if (messages.field_label_policy_account_deletion_options) { | |||
state.accountDeletionOptions = messages.field_label_policy_account_deletion_options.split(','); | |||
} | |||
}, | |||
loadMessagesFailure(state, error) { | |||
state.error = error; | |||
@@ -3,7 +3,8 @@ import { account } from '../_store/account.module'; | |||
const state = { | |||
all: {}, | |||
user: null | |||
user: null, | |||
policy: {} | |||
}; | |||
const actions = { | |||
@@ -37,6 +38,46 @@ const actions = { | |||
); | |||
}, | |||
getPolicyByUuid({ commit }, {uuid, messages, errors}) { | |||
commit('getPolicyByUuidRequest'); | |||
userService.getPolicyById(uuid, messages, errors) | |||
.then( | |||
policy => commit('getPolicyByUuidSuccess', policy), | |||
error => commit('getPolicyByUuidFailure', error) | |||
); | |||
}, | |||
updatePolicyByUuid({ commit }, {uuid, policy, messages, errors}) { | |||
commit('updatePolicyByUuidRequest'); | |||
userService.updatePolicyById(uuid, policy, messages, errors) | |||
.then( | |||
policy => commit('updatePolicyByUuidSuccess', policy), | |||
error => commit('updatePolicyByUuidFailure', error) | |||
); | |||
}, | |||
addPolicyContactByUuid({ commit }, {uuid, contact, messages, errors}) { | |||
commit('addPolicyContactByUuidRequest'); | |||
userService.updatePolicyById(uuid, contact, messages, errors) | |||
.then( | |||
policy => commit('addPolicyContactByUuidSuccess', policy), | |||
error => commit('addPolicyContactByUuidFailure', error) | |||
); | |||
}, | |||
removePolicyContactByTypeAndInfo({ commit }, {uuid, type, info, messages, errors}) { | |||
commit('removePolicyContactByTypeAndInfoRequest'); | |||
userService.removePolicyContactByTypeAndInfo(uuid, type, info, messages, errors) | |||
.then( | |||
policy => commit('removePolicyContactByTypeAndInfoSuccess', policy), | |||
error => commit('removePolicyContactByTypeAndInfoFailure', error) | |||
); | |||
}, | |||
delete({ commit }, {id, messages, errors}) { | |||
commit('deleteRequest', id); | |||
@@ -58,6 +99,7 @@ const mutations = { | |||
getAllFailure(state, error) { | |||
state.all = { error }; | |||
}, | |||
getByUuidRequest(state) { | |||
state.user = { loading: true }; | |||
}, | |||
@@ -67,6 +109,47 @@ const mutations = { | |||
getByUuidFailure(state, error) { | |||
state.user = { error }; | |||
}, | |||
getPolicyByUuidRequest(state) { | |||
state.user = { loading: true }; | |||
}, | |||
getPolicyByUuidSuccess(state, policy) { | |||
state.policy = policy; | |||
}, | |||
getPolicyByUuidFailure(state, error) { | |||
state.policy = { error }; | |||
}, | |||
updatePolicyByUuidRequest(state) { | |||
state.user = { loading: true }; | |||
}, | |||
updatePolicyByUuidSuccess(state, policy) { | |||
state.policy = policy; | |||
}, | |||
updatePolicyByUuidFailure(state, error) { | |||
state.policy = { error }; | |||
}, | |||
addPolicyContactByUuidRequest(state) { | |||
state.user = { loading: true }; | |||
}, | |||
addPolicyContactByUuidSuccess(state, policy) { | |||
state.policy = policy; | |||
}, | |||
addPolicyContactByUuidFailure(state, error) { | |||
state.policy = { error }; | |||
}, | |||
removePolicyContactByTypeAndInfoRequest(state) { | |||
state.user = { loading: true }; | |||
}, | |||
removePolicyContactByTypeAndInfoSuccess(state, policy) { | |||
state.policy = policy; | |||
}, | |||
removePolicyContactByTypeAndInfoFailure(state, error) { | |||
state.policy = { error }; | |||
}, | |||
updateRequest(state, user) { | |||
// todo: add 'updating:true' property to user being updated | |||
}, | |||
@@ -78,6 +161,7 @@ const mutations = { | |||
updateFailure(state, { id, error }) { | |||
// todo: remove 'updating:true' property and add 'updateError:[error]' property to user | |||
}, | |||
deleteRequest(state, id) { | |||
// add 'deleting:true' property to user being deleted | |||
state.all.items = state.all.items.map(user => | |||
@@ -1,6 +1,6 @@ | |||
<template> | |||
<div> | |||
<h1>{{messages.label_homepage_hello && messages.label_homepage_hello.parseMessage(this)}}!</h1> | |||
<h1>{{messages.label_homepage_hello && messages.label_homepage_hello.parseMessage(this)}}</h1> | |||
<hr/> | |||
<router-view></router-view> | |||
</div> | |||
@@ -0,0 +1,18 @@ | |||
<template> | |||
<div> | |||
Notifications | |||
</div> | |||
</template> | |||
<script> | |||
import { mapState, mapActions } from 'vuex' | |||
export default { | |||
computed: { | |||
}, | |||
created () { | |||
}, | |||
methods: { | |||
} | |||
}; | |||
</script> |
@@ -0,0 +1,18 @@ | |||
<template> | |||
<div> | |||
Change Password | |||
</div> | |||
</template> | |||
<script> | |||
import { mapState, mapActions } from 'vuex' | |||
export default { | |||
computed: { | |||
}, | |||
created () { | |||
}, | |||
methods: { | |||
} | |||
}; | |||
</script> |
@@ -0,0 +1,42 @@ | |||
<template> | |||
<div> | |||
<h2>{{messages.form_label_title_account_policy}}</h2> | |||
<form @submit.prevent="handleSubmit"> | |||
<div class="form-group"> | |||
<label htmlFor="url">{{messages.field_label_policy_account_deletion}}</label> | |||
<select v-model="policy.deletionPolicy" name="deletionPolicy" class="form-control"> | |||
<option v-for="opt in accountDeletionOptions" v-bind:value="opt">{{messages['account_deletion_name_'+opt]}}</option> | |||
</select> | |||
<span>{{messages['account_deletion_description_'+policy.deletionPolicy]}}</span> | |||
<div v-if="submitted && errors.has('deletionPolicy')" class="invalid-feedback">{{ errors.first('deletionPolicy') }}</div> | |||
</div> | |||
</form> | |||
</div> | |||
</template> | |||
<script> | |||
import { mapState, mapActions } from 'vuex' | |||
export default { | |||
data() { | |||
return {submitted: false} | |||
}, | |||
computed: { | |||
...mapState('account', { | |||
currentUser: state => state.user, | |||
status: state => state.status | |||
}), | |||
...mapState('system', ['messages', 'accountDeletionOptions']), | |||
...mapState('users', ['policy']) | |||
}, | |||
methods: { | |||
...mapActions('users', ['getPolicyByUuid', 'updatePolicyByUuid', 'addPolicyContactByUuid', 'removePolicyContactByTypeAndInfo']), | |||
handleSubmit(e) { | |||
console.log('submitting with deletionPolicy='+this.policy.deletionPolicy); | |||
} | |||
}, | |||
created () { | |||
this.getPolicyByUuid({uuid: this.currentUser.uuid, messages: this.messages, errors: this.errors}); | |||
} | |||
}; | |||
</script> |
@@ -1,6 +1,13 @@ | |||
<template> | |||
<div> | |||
<h2>Edit Profile</h2> | |||
<h2>Account Profile</h2> | |||
<hr/> | |||
<router-link to="/me/changePassword">{{messages.link_label_change_password}}</router-link> | |||
<hr/> | |||
<router-link to="/me/policy">{{messages.link_label_account_policy}}</router-link> | |||
<hr/> | |||
<form @submit.prevent="handleSubmit"> | |||
<div class="form-group"> | |||
<span>{{messages.field_label_username}}: {{user.name}}</span> | |||
@@ -63,7 +70,7 @@ | |||
<script> | |||
import { mapState, mapActions } from 'vuex' | |||
import { account } from '../_store/account.module' | |||
import { account } from '../../_store/account.module' | |||
export default { | |||
data () { |