start adding policy page

src/_helpers/router.js

@@ -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: [

src/_services/user.service.js

@@ -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));
 }

src/_store/system.module.js

@@ -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;

src/_store/users.module.js

@@ -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 =>

src/account/HomePage.vue

@@ -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>

src/account/NotificationsPage.vue

@@ -0,0 +1,18 @@
+<template>
+    <div>
+        Notifications
+    </div>
+</template>
+
+<script>
+    import { mapState, mapActions } from 'vuex'
+
+    export default {
+        computed: {
+        },
+        created () {
+        },
+        methods: {
+        }
+    };
+</script>

src/account/profile/ChangePasswordPage.vue

@@ -0,0 +1,18 @@
+<template>
+    <div>
+        Change Password
+    </div>
+</template>
+
+<script>
+    import { mapState, mapActions } from 'vuex'
+
+    export default {
+        computed: {
+        },
+        created () {
+        },
+        methods: {
+        }
+    };
+</script>

src/account/profile/PolicyPage.vue

@@ -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>

src/account/ProfilePage.vue → src/account/profile/ProfilePage.vue

@@ -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 () {