diff --git a/index.html b/index.html
index 478b06e..b8609bd 100644
--- a/index.html
+++ b/index.html
@@ -3,7 +3,8 @@
Food
-
+
+
diff --git a/package.json b/package.json
index 916f871..23b9b43 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
"isomorphic-fetch": "^2.2.1",
"vue": "^2.4.2",
"vue-router": "^2.7.0",
+ "vuetify": "^0.15.7",
"vuex": "^2.4.0"
},
"devDependencies": {
diff --git a/src/App.vue b/src/App.vue
index a2710f5..95efe48 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,23 +1,42 @@
-
-
Food scanning
-
-
+
+
+
+
+ {{ title }}
+
+
+
+
+
+
+
diff --git a/src/components/Home.vue b/src/components/Home.vue
deleted file mode 100644
index daf02cf..0000000
--- a/src/components/Home.vue
+++ /dev/null
@@ -1,12 +0,0 @@
-
-
-
-
-
diff --git a/src/components/NavigationDrawer.vue b/src/components/NavigationDrawer.vue
new file mode 100644
index 0000000..2309a36
--- /dev/null
+++ b/src/components/NavigationDrawer.vue
@@ -0,0 +1,51 @@
+
+
+
+
+
+ home
+
+
+ Home
+
+
+
+
+ search
+
+
+ Scan
+
+
+
+
+ search
+
+
+ Find by barcode
+
+
+
+
+ settings
+
+
+ Preferences
+
+
+
+
+
+
+
diff --git a/src/components/Product.vue b/src/components/Product.vue
deleted file mode 100644
index 433d232..0000000
--- a/src/components/Product.vue
+++ /dev/null
@@ -1,41 +0,0 @@
-
-
-
- Loading…
-
-
- {{ this.product.product_name }}
-
-
- Barcode |
- {{ $route.params.barcode }} |
-
-
-
-
-
-
-
diff --git a/src/main.js b/src/main.js
index b38c835..c5231df 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,12 +1,16 @@
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue';
+import Vuetify from 'vuetify';
+import '../node_modules/vuetify/dist/vuetify.min.css';
import App from './App';
import router from './router';
import store from './store';
Vue.config.productionTip = false;
+Vue.use(Vuetify);
+
/* eslint-disable no-new */
new Vue({
el: '#app',
diff --git a/src/router/index.js b/src/router/index.js
index 74a1b92..1682879 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,9 +1,11 @@
import Vue from 'vue';
import Router from 'vue-router';
-import Home from '@/components/Home';
-import Scan from '@/components/Scan';
-import Product from '@/components/Product';
+import Home from '@/views/Home';
+import ManualBarcode from '@/views/ManualBarcode';
+import Scan from '@/views/Scan';
+import Product from '@/views/Product';
+import Preferences from '@/views/Preferences';
Vue.use(Router);
@@ -19,10 +21,20 @@ export default new Router({
name: 'Scan',
component: Scan,
},
+ {
+ path: '/barcode',
+ name: 'ManualBarcode',
+ component: ManualBarcode,
+ },
{
path: '/barcode/:barcode',
name: 'Product',
component: Product,
},
+ {
+ path: '/preferences',
+ name: 'Preferences',
+ component: Preferences,
+ },
],
});
diff --git a/src/store/actions.js b/src/store/actions.js
index c5f086c..60e81b2 100644
--- a/src/store/actions.js
+++ b/src/store/actions.js
@@ -11,4 +11,7 @@ export default {
},
);
},
+ setTitle({ commit }, { title }) {
+ commit(types.SET_TITLE, { title });
+ },
};
diff --git a/src/store/getters.js b/src/store/getters.js
index d0d23dd..33238b2 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -1,4 +1,5 @@
export default {
product: state => state.product,
isLoading: state => state.isLoading,
+ title: state => state.title,
};
diff --git a/src/store/mutations-types.js b/src/store/mutations-types.js
index 10e2640..e2deb81 100644
--- a/src/store/mutations-types.js
+++ b/src/store/mutations-types.js
@@ -1,2 +1,3 @@
export const IS_LOADING = 'IS_LOADING';
export const STORE_PRODUCT = 'STORE_PRODUCT';
+export const SET_TITLE = 'SET_TITLE';
diff --git a/src/store/mutations.js b/src/store/mutations.js
index 84ae8d3..12276e4 100644
--- a/src/store/mutations.js
+++ b/src/store/mutations.js
@@ -3,6 +3,7 @@ import * as types from './mutations-types';
export const initialState = {
product: null,
isLoading: false,
+ title: 'Food scanning',
};
export const mutations = {
@@ -13,4 +14,7 @@ export const mutations = {
[types.IS_LOADING](state) {
state.isLoading = true;
},
+ [types.SET_TITLE](state, { title }) {
+ state.title = title;
+ },
};
diff --git a/src/views/Home.vue b/src/views/Home.vue
new file mode 100644
index 0000000..6e52d76
--- /dev/null
+++ b/src/views/Home.vue
@@ -0,0 +1,23 @@
+
+
+
Let's start scanning!
+
+ search
+
+
+
+
+
diff --git a/src/views/ManualBarcode.vue b/src/views/ManualBarcode.vue
new file mode 100644
index 0000000..a37fc28
--- /dev/null
+++ b/src/views/ManualBarcode.vue
@@ -0,0 +1,40 @@
+
+
+
+
+ Find
+
+
+
+
+
diff --git a/src/views/Preferences.vue b/src/views/Preferences.vue
new file mode 100644
index 0000000..366d038
--- /dev/null
+++ b/src/views/Preferences.vue
@@ -0,0 +1,11 @@
+
+ TODO
+
+
+
diff --git a/src/views/Product.vue b/src/views/Product.vue
new file mode 100644
index 0000000..0b4b7c7
--- /dev/null
+++ b/src/views/Product.vue
@@ -0,0 +1,72 @@
+
+
+
+ Loading…
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ props.item.name }} |
+
+
+
+
+
+
+
+ Bidule
+
+
+
+
+
+ Overview
+ Nutrition
+ Labels
+
+
+
+
+
+
+
diff --git a/src/components/Scan.vue b/src/views/Scan.vue
similarity index 100%
rename from src/components/Scan.vue
rename to src/views/Scan.vue
diff --git a/src/components/ScanQuagga.vue b/src/views/ScanQuagga.vue
similarity index 100%
rename from src/components/ScanQuagga.vue
rename to src/views/ScanQuagga.vue