src/App.vue

@@ -120,6 +120,7 @@
     import {HTTP} from './http-common'
 	import message from './message'
     import router from './router'
+	import NamespaceService from "./services/namespace";
 
     export default {
         name: 'app',
@@ -132,6 +133,7 @@
 				mobileMenuActive: false,
 				fullpage: false,
 				currentDate: new Date(),
+				namespaceService: NamespaceService,
             }
         },
 		beforeMount() {
@@ -150,6 +152,7 @@
 		},
         created() {
             if (this.user.authenticated) {
+				this.namespaceService = new NamespaceService()
                 this.loadNamespaces()
 			}
         },
@@ -165,16 +168,13 @@
                 return 'https://www.gravatar.com/avatar/' + this.user.infos.avatar + '?s=50'
 			},
             loadNamespaces() {
-				const cancel = message.setLoading(this)
-                HTTP.get(`namespaces`, {headers: {'Authorization': 'Bearer ' + localStorage.getItem('token')}})
-                    .then(response => {
-						this.$set(this, 'namespaces', response.data)
-                        cancel()
-                    })
-                    .catch(e => {
-						cancel()
-                        this.handleError(e)
-                    })
+				this.namespaceService.getAll()
+					.then(r => {
+						this.$set(this, 'namespaces', r)
+					})
+					.catch(e => {
+						message.error(e, this)
+					})
             },
 			loadNamespacesIfNeeded(e){
                 if (this.user.authenticated && e.name === 'home') {
@@ -189,9 +189,6 @@
 			setFullPage() {
 				this.fullpage = true;
 			},
-            handleError(e) {
-                message.error(e, this)
-            }
         },
     }
 </script>

src/models/namespace.js

@@ -1,8 +1,13 @@
 import AbstractModel from './abstractModel'
+import ListModel from './list'
 
 export default class NamespaceModel extends AbstractModel {
 	constructor(data) {
 		super(data)
+
+		this.lists = this.lists.map(l => {
+			return new ListModel(l)
+		})
 	}
 
 	// Default attributes that define the 'empty' state.
@@ -12,6 +17,7 @@ export default class NamespaceModel extends AbstractModel {
 			name: '',
 			description: '',
 			owner: {},
+			lists: [],
 
 			created: 0,
 			updated: 0,

src/services/abstractService.js

@@ -14,6 +14,7 @@ export default class AbstractService {
 	paths = {
 		create: '',
 		get: '',
+		getAll: '',
 		update: '',
 		delete: '',
 	}
@@ -200,6 +201,32 @@ export default class AbstractService {
 				cancel()
 			})
 	}
+
+	/**
+	 * Performs a get request to the url specified before.
+	 * The difference between this and get() is this one is used to get a bunch of data (an array), not just a single object.
+	 * @param model The model to use. The request path is built using the values from the model.
+	 * @param params Optional query parameters
+	 * @returns {Q.Promise<any>}
+	 */
+	getAll(model, params = {}) {
+		if (this.paths.getAll === '') {
+			return Promise.reject({message: 'This model is not able to get data.'})
+		}
+
+		const cancel = this.setLoading()
+		model = this.beforeGet(model)
+		return this.http.get(this.getReplacedRoute(this.paths.getAll, model), {params: params})
+			.catch(error => {
+				return this.errorHandler(error)
+			})
+			.then(response => {
+				return Promise.resolve(this.modelFactory(response.data))
+			})
+			.finally(() => {
+				cancel()
+			})
+	}
 	
 	/**
 	 * Performs a put request to the url specified before