@@ -19,9 +19,19 @@ export const router = new Router({ | |||||
{ | { | ||||
path: '/', component: HomePage, | path: '/', component: HomePage, | ||||
children: [ | children: [ | ||||
{ path: '', component: NetworksPage }, | |||||
{ | |||||
path: '', component: NetworksPage, | |||||
children: [ | |||||
{ path: '', component: NewNetworkPage }, | |||||
] | |||||
}, | |||||
{ path: '/profile', component: ProfilePage }, | { path: '/profile', component: ProfilePage }, | ||||
{ path: '/networks', component: NetworksPage }, | |||||
{ | |||||
path: '/networks', component: NetworksPage , | |||||
children: [ | |||||
{ path: '', component: NewNetworkPage }, | |||||
] | |||||
}, | |||||
{ path: '/networks/new', component: NewNetworkPage }, | { path: '/networks/new', component: NewNetworkPage }, | ||||
{ path: '/networks/:uuid', component: NetworkPage } | { path: '/networks/:uuid', component: NetworkPage } | ||||
] | ] | ||||
@@ -3,5 +3,6 @@ export * from './user.service'; | |||||
export * from './domain.service'; | export * from './domain.service'; | ||||
export * from './plan.service'; | export * from './plan.service'; | ||||
export * from './footprint.service'; | export * from './footprint.service'; | ||||
export * from './paymentMethod.service'; | |||||
export * from './accountPlan.service'; | export * from './accountPlan.service'; | ||||
export * from './network.service'; | export * from './network.service'; |
@@ -0,0 +1,15 @@ | |||||
import config from 'config'; | |||||
import { getWithAuth, handleCrudResponse } from '../_helpers'; | |||||
export const paymentMethodService = { | |||||
getAll, | |||||
getById | |||||
}; | |||||
function getAll() { | |||||
return fetch(`${config.apiUrl}/paymentMethods`, getWithAuth()).then(handleCrudResponse); | |||||
} | |||||
function getById(paymentMethodId) { | |||||
return fetch(`${config.apiUrl}/paymentMethods/${paymentMethodId}`, getWithAuth()).then(handleCrudResponse); | |||||
} |
@@ -37,7 +37,7 @@ const actions = { | |||||
router.push('/'); | router.push('/'); | ||||
setTimeout(() => { | setTimeout(() => { | ||||
// display success message after route change completes | // display success message after route change completes | ||||
dispatch('alert/success', 'Registration successful', { root: true }); | |||||
dispatch('alert/success', messages.alert_registration_success, { root: true }); | |||||
}) | }) | ||||
}, | }, | ||||
error => { | error => { | ||||
@@ -8,6 +8,7 @@ import { users } from './users.module'; | |||||
import { plans } from './plans.module'; | import { plans } from './plans.module'; | ||||
import { footprints } from './footprints.module'; | import { footprints } from './footprints.module'; | ||||
import { domains } from './domains.module'; | import { domains } from './domains.module'; | ||||
import { paymentMethods } from './paymentMethods.module'; | |||||
import { accountPlans } from './accountPlans.module'; | import { accountPlans } from './accountPlans.module'; | ||||
import { networks } from './networks.module'; | import { networks } from './networks.module'; | ||||
@@ -19,9 +20,10 @@ export const store = new Vuex.Store({ | |||||
system, | system, | ||||
account, | account, | ||||
users, | users, | ||||
domains, | |||||
plans, | plans, | ||||
footprints, | footprints, | ||||
domains, | |||||
paymentMethods, | |||||
accountPlans, | accountPlans, | ||||
networks | networks | ||||
} | } | ||||
@@ -0,0 +1,60 @@ | |||||
import { paymentMethodService } from '../_services'; | |||||
const state = { | |||||
loading: null, | |||||
error: null, | |||||
paymentMethods: null, | |||||
paymentMethod: null | |||||
}; | |||||
const actions = { | |||||
getAll({ commit }) { | |||||
commit('getAllRequest'); | |||||
paymentMethodService.getAll() | |||||
.then( | |||||
paymentMethods => commit('getAllSuccess', paymentMethods), | |||||
error => commit('getAllFailure', error) | |||||
); | |||||
}, | |||||
getByUuid({ commit }, uuid) { | |||||
commit('getByUuidRequest'); | |||||
paymentMethodService.getById(uuid) | |||||
.then( | |||||
paymentMethod => commit('getByUuidSuccess', paymentMethod), | |||||
error => commit('getByUuidFailure', error) | |||||
); | |||||
} | |||||
}; | |||||
const mutations = { | |||||
getAllRequest(state) { | |||||
state.loading = true; | |||||
}, | |||||
getAllSuccess(state, paymentMethods) { | |||||
state.loading = false; | |||||
state.paymentMethods = paymentMethods; | |||||
}, | |||||
getAllFailure(state, error) { | |||||
state.loading = false; | |||||
state.error = { error }; | |||||
}, | |||||
getByUuidRequest(state) { | |||||
state.loading = true; | |||||
}, | |||||
getByUuidSuccess(state, paymentMethod) { | |||||
state.loading = false; | |||||
state.paymentMethod = paymentMethod; | |||||
}, | |||||
getByUuidFailure(state, error) { | |||||
state.loading = false; | |||||
state.error = { error }; | |||||
} | |||||
}; | |||||
export const paymentMethods = { | |||||
namespaced: true, | |||||
state, | |||||
actions, | |||||
mutations | |||||
}; |
@@ -2,7 +2,8 @@ import { systemService } from '../_services'; | |||||
const state = { | const state = { | ||||
configs: { | configs: { | ||||
allowRegistration: null | |||||
allowRegistration: null, | |||||
paymentsEnabled: true | |||||
}, | }, | ||||
messages: {}, | messages: {}, | ||||
countries: [], | countries: [], | ||||
@@ -1,11 +1,8 @@ | |||||
<template> | <template> | ||||
<div> | <div> | ||||
<em v-if="loading">{{messages.loading_networks}}</em> | <em v-if="loading">{{messages.loading_networks}}</em> | ||||
<h2>{{messages.table_title_networks}}</h2> | |||||
<div v-if="!networks || networks.length === 0"> | |||||
{{messages.empty_networks}} | |||||
</div> | |||||
<div v-if="networks && networks.length > 0"> | <div v-if="networks && networks.length > 0"> | ||||
<h2>{{messages.table_title_networks}}</h2> | |||||
<table border="1"> | <table border="1"> | ||||
<thead> | <thead> | ||||
<tr> | <tr> | ||||
@@ -31,9 +28,15 @@ | |||||
</tr> | </tr> | ||||
</tbody> | </tbody> | ||||
</table> | </table> | ||||
<hr/> | |||||
<router-link to="/networks/new">{{messages.button_label_new_network}}</router-link> | |||||
</div> | |||||
<div v-if="!networks || networks.length === 0"> | |||||
{{messages.empty_networks}} | |||||
<router-view></router-view> | |||||
</div> | </div> | ||||
<hr/> | |||||
<router-link to="/networks/new">{{messages.button_label_new_network}}</router-link> | |||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -34,6 +34,24 @@ | |||||
{{messages['footprint_description_'+network.footprint]}} | {{messages['footprint_description_'+network.footprint]}} | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="form-group"> | |||||
<label htmlFor="paymentMethod">{{messages.field_label_paymentMethod}}</label> | |||||
<div v-if="submitted && errors.has('paymentMethod')" class="invalid-feedback">{{ errors.first('paymentMethod') }}</div> | |||||
<div v-if="submitted && errors.has('paymentMethodInfo')" class="invalid-feedback">{{ errors.first('paymentMethodInfo') }}</div> | |||||
<div v-if="submitted && errors.has('paymentMethodType')" class="invalid-feedback">{{ errors.first('paymentMethodType') }}</div> | |||||
<div v-if="submitted && errors.has('paymentMethodService')" class="invalid-feedback">{{ errors.first('paymentMethodService') }}</div> | |||||
<div v-if="submitted && errors.has('paymentInfo')" class="invalid-feedback">{{ errors.first('paymentInfo') }}</div> | |||||
<span v-for="pm in paymentMethods"> | |||||
<button class="btn btn-primary" :disabled="status.creating" @click="network.paymentMethodObject.paymentMethodType = pm.paymentMethodType">{{messages['payment_description_'+pm.paymentMethodType]}}</button> | |||||
</span> | |||||
</div> | |||||
<div v-if="network.paymentMethodObject.paymentMethodType === 'credit'"> | |||||
credit selected | |||||
</div> | |||||
<div v-if="network.paymentMethodObject.paymentMethodType === 'code'"> | |||||
invite code selected | |||||
</div> | |||||
<div class="form-group"> | <div class="form-group"> | ||||
<button class="btn btn-primary" :disabled="status.creating">{{messages.button_label_create_new_network}}</button> | <button class="btn btn-primary" :disabled="status.creating">{{messages.button_label_create_new_network}}</button> | ||||
<img v-show="status.creating" src="data:image/gif;base64,R0lGODlhEAAQAPIAAP///wAAAMLCwkJCQgAAAGJiYoKCgpKSkiH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQJCgAAACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkECQoAAAAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkECQoAAAAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkECQoAAAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQJCgAAACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQJCgAAACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAkKAAAALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==" /> | <img v-show="status.creating" src="data:image/gif;base64,R0lGODlhEAAQAPIAAP///wAAAMLCwkJCQgAAAGJiYoKCgpKSkiH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQJCgAAACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkECQoAAAAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkECQoAAAAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkECQoAAAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQJCgAAACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQJCgAAACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAkKAAAALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==" /> | ||||
@@ -56,7 +74,11 @@ | |||||
locale: 'en_US', | locale: 'en_US', | ||||
timezone: '', | timezone: '', | ||||
plan: 'bubble', | plan: 'bubble', | ||||
footprint: 'Worldwide' | |||||
footprint: 'Worldwide', | |||||
paymentMethodObject: { | |||||
paymentMethodType: null, | |||||
paymentInfo: null | |||||
} | |||||
}, | }, | ||||
user: currentUser(), | user: currentUser(), | ||||
submitted: false, | submitted: false, | ||||
@@ -68,6 +90,7 @@ | |||||
...mapState('domains', ['domains']), | ...mapState('domains', ['domains']), | ||||
...mapState('plans', ['plans']), | ...mapState('plans', ['plans']), | ||||
...mapState('footprints', ['footprints']), | ...mapState('footprints', ['footprints']), | ||||
...mapState('paymentMethods', ['paymentMethods']), | |||||
...mapState('networks', { | ...mapState('networks', { | ||||
creating: state => state.loading, | creating: state => state.loading, | ||||
error: state => state.error | error: state => state.error | ||||
@@ -122,6 +145,9 @@ | |||||
...mapActions('footprints', { | ...mapActions('footprints', { | ||||
loadFootprints: 'getAll' | loadFootprints: 'getAll' | ||||
}), | }), | ||||
...mapActions('paymentMethods', { | |||||
loadPaymentMethods: 'getAll' | |||||
}), | |||||
handleSubmit(e) { | handleSubmit(e) { | ||||
this.submitted = true; | this.submitted = true; | ||||
this.$validator.validate().then(valid => { | this.$validator.validate().then(valid => { | ||||
@@ -135,6 +161,7 @@ | |||||
this.loadDomains(currentUser().uuid); | this.loadDomains(currentUser().uuid); | ||||
this.loadPlans(); | this.loadPlans(); | ||||
this.loadFootprints(); | this.loadFootprints(); | ||||
this.loadPaymentMethods(); | |||||
} | } | ||||
}; | }; | ||||
</script> | </script> |