diff --git a/web/themes/custom/materiotheme/assets/dist/main.js b/web/themes/custom/materiotheme/assets/dist/main.js
index c785c30b..aed99745 100644
--- a/web/themes/custom/materiotheme/assets/dist/main.js
+++ b/web/themes/custom/materiotheme/assets/dist/main.js
@@ -385,15 +385,39 @@ eval("\n\nvar bind = __webpack_require__(/*! ./helpers/bind */ \"./node_modules/
/***/ }),
-/***/ "./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Login.vue?vue&type=script&lang=js&":
-/*!******************************************************************************************************************************************************************************!*\
- !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Login.vue?vue&type=script&lang=js& ***!
- \******************************************************************************************************************************************************************************/
+/***/ "./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/User/Login.vue?vue&type=script&lang=js&":
+/*!***********************************************************************************************************************************************************************************!*\
+ !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/User/Login.vue?vue&type=script&lang=js& ***!
+ \***********************************************************************************************************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vuex__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n// https://github.com/alvar0hurtad0/drupal-vuejs-todo\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n data() {\n return {\n mail: '',\n password: ''\n };\n },\n\n computed: { ...Object(vuex__WEBPACK_IMPORTED_MODULE_0__[\"mapState\"])(['User'])\n },\n methods: { ...Object(vuex__WEBPACK_IMPORTED_MODULE_0__[\"mapActions\"])({\n getToken: 'User/getToken'\n }),\n\n // usernameInputHandler(input) {\n // this.username = input;\n // },\n // passwordInputHandler(input) {\n // this.password = input;\n // },\n login() {\n this.getToken({\n mail: this.mail,\n pass: this.password\n });\n }\n\n }\n});\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Login.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vuex__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n// https://github.com/alvar0hurtad0/drupal-vuejs-todo\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n data() {\n return {\n mail: '',\n password: ''\n };\n },\n\n computed: { ...Object(vuex__WEBPACK_IMPORTED_MODULE_0__[\"mapState\"])(['User'])\n },\n methods: { ...Object(vuex__WEBPACK_IMPORTED_MODULE_0__[\"mapActions\"])({\n getToken: 'User/getToken'\n }),\n\n // usernameInputHandler(input) {\n // this.username = input;\n // },\n // passwordInputHandler(input) {\n // this.password = input;\n // },\n login() {\n this.getToken({\n mail: this.mail,\n pass: this.password\n });\n }\n\n }\n});\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/User/Login.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
+/***/ "./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/User/UserBlock.vue?vue&type=script&lang=js&":
+/*!***************************************************************************************************************************************************************************************!*\
+ !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/User/UserBlock.vue?vue&type=script&lang=js& ***!
+ \***************************************************************************************************************************************************************************************/
+/*! exports provided: default */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vuex__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n/* harmony import */ var vuejs_components_User_Login__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vuejs/components/User/Login */ \"./web/themes/custom/materiotheme/vuejs/components/User/Login.vue\");\n/* harmony import */ var vuejs_components_User_UserTools__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! vuejs/components/User/UserTools */ \"./web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue\");\n//\n//\n//\n//\n//\n\n\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n // data () {\n // return {}\n // },\n computed: { ...Object(vuex__WEBPACK_IMPORTED_MODULE_0__[\"mapState\"])({\n token: state => state.User.token\n })\n },\n components: {\n Login: vuejs_components_User_Login__WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n UserTools: vuejs_components_User_UserTools__WEBPACK_IMPORTED_MODULE_2__[\"default\"]\n }\n});\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/User/UserBlock.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
+/***/ "./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue?vue&type=script&lang=js&":
+/*!***************************************************************************************************************************************************************************************!*\
+ !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue?vue&type=script&lang=js& ***!
+ \***************************************************************************************************************************************************************************************/
+/*! exports provided: default */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vuex__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n // data () {\n // return {\n // mail: \"Hello User!\"\n // }\n // },\n computed: { ...Object(vuex__WEBPACK_IMPORTED_MODULE_0__[\"mapState\"])({\n mail: state => state.User.mail\n })\n },\n methods: { ...Object(vuex__WEBPACK_IMPORTED_MODULE_0__[\"mapActions\"])({\n userLogout: 'User/userLogout'\n }),\n\n onLogout() {\n this.userLogout();\n }\n\n }\n});\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
/***/ }),
@@ -442,6 +466,42 @@ eval("// shim for using process in browser\nvar process = module.exports = {}; /
/***/ }),
+/***/ "./node_modules/querystring-es3/decode.js":
+/*!************************************************!*\
+ !*** ./node_modules/querystring-es3/decode.js ***!
+ \************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+eval("// Copyright Joyent, Inc. and other Node contributors.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a\n// copy of this software and associated documentation files (the\n// \"Software\"), to deal in the Software without restriction, including\n// without limitation the rights to use, copy, modify, merge, publish,\n// distribute, sublicense, and/or sell copies of the Software, and to permit\n// persons to whom the Software is furnished to do so, subject to the\n// following conditions:\n//\n// The above copyright notice and this permission notice shall be included\n// in all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS\n// OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF\n// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN\n// NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,\n// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR\n// OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE\n// USE OR OTHER DEALINGS IN THE SOFTWARE.\n // If obj.hasOwnProperty has been overridden, then calling\n// obj.hasOwnProperty(prop) will break.\n// See: https://github.com/joyent/node/issues/1707\n\nfunction hasOwnProperty(obj, prop) {\n return Object.prototype.hasOwnProperty.call(obj, prop);\n}\n\nmodule.exports = function (qs, sep, eq, options) {\n sep = sep || '&';\n eq = eq || '=';\n var obj = {};\n\n if (typeof qs !== 'string' || qs.length === 0) {\n return obj;\n }\n\n var regexp = /\\+/g;\n qs = qs.split(sep);\n var maxKeys = 1000;\n\n if (options && typeof options.maxKeys === 'number') {\n maxKeys = options.maxKeys;\n }\n\n var len = qs.length; // maxKeys <= 0 means that we should not limit keys count\n\n if (maxKeys > 0 && len > maxKeys) {\n len = maxKeys;\n }\n\n for (var i = 0; i < len; ++i) {\n var x = qs[i].replace(regexp, '%20'),\n idx = x.indexOf(eq),\n kstr,\n vstr,\n k,\n v;\n\n if (idx >= 0) {\n kstr = x.substr(0, idx);\n vstr = x.substr(idx + 1);\n } else {\n kstr = x;\n vstr = '';\n }\n\n k = decodeURIComponent(kstr);\n v = decodeURIComponent(vstr);\n\n if (!hasOwnProperty(obj, k)) {\n obj[k] = v;\n } else if (isArray(obj[k])) {\n obj[k].push(v);\n } else {\n obj[k] = [obj[k], v];\n }\n }\n\n return obj;\n};\n\nvar isArray = Array.isArray || function (xs) {\n return Object.prototype.toString.call(xs) === '[object Array]';\n};\n\n//# sourceURL=webpack:///./node_modules/querystring-es3/decode.js?");
+
+/***/ }),
+
+/***/ "./node_modules/querystring-es3/encode.js":
+/*!************************************************!*\
+ !*** ./node_modules/querystring-es3/encode.js ***!
+ \************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+eval("// Copyright Joyent, Inc. and other Node contributors.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a\n// copy of this software and associated documentation files (the\n// \"Software\"), to deal in the Software without restriction, including\n// without limitation the rights to use, copy, modify, merge, publish,\n// distribute, sublicense, and/or sell copies of the Software, and to permit\n// persons to whom the Software is furnished to do so, subject to the\n// following conditions:\n//\n// The above copyright notice and this permission notice shall be included\n// in all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS\n// OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF\n// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN\n// NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,\n// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR\n// OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE\n// USE OR OTHER DEALINGS IN THE SOFTWARE.\n\n\nvar stringifyPrimitive = function (v) {\n switch (typeof v) {\n case 'string':\n return v;\n\n case 'boolean':\n return v ? 'true' : 'false';\n\n case 'number':\n return isFinite(v) ? v : '';\n\n default:\n return '';\n }\n};\n\nmodule.exports = function (obj, sep, eq, name) {\n sep = sep || '&';\n eq = eq || '=';\n\n if (obj === null) {\n obj = undefined;\n }\n\n if (typeof obj === 'object') {\n return map(objectKeys(obj), function (k) {\n var ks = encodeURIComponent(stringifyPrimitive(k)) + eq;\n\n if (isArray(obj[k])) {\n return map(obj[k], function (v) {\n return ks + encodeURIComponent(stringifyPrimitive(v));\n }).join(sep);\n } else {\n return ks + encodeURIComponent(stringifyPrimitive(obj[k]));\n }\n }).join(sep);\n }\n\n if (!name) return '';\n return encodeURIComponent(stringifyPrimitive(name)) + eq + encodeURIComponent(stringifyPrimitive(obj));\n};\n\nvar isArray = Array.isArray || function (xs) {\n return Object.prototype.toString.call(xs) === '[object Array]';\n};\n\nfunction map(xs, f) {\n if (xs.map) return xs.map(f);\n var res = [];\n\n for (var i = 0; i < xs.length; i++) {\n res.push(f(xs[i], i));\n }\n\n return res;\n}\n\nvar objectKeys = Object.keys || function (obj) {\n var res = [];\n\n for (var key in obj) {\n if (Object.prototype.hasOwnProperty.call(obj, key)) res.push(key);\n }\n\n return res;\n};\n\n//# sourceURL=webpack:///./node_modules/querystring-es3/encode.js?");
+
+/***/ }),
+
+/***/ "./node_modules/querystring-es3/index.js":
+/*!***********************************************!*\
+ !*** ./node_modules/querystring-es3/index.js ***!
+ \***********************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nexports.decode = exports.parse = __webpack_require__(/*! ./decode */ \"./node_modules/querystring-es3/decode.js\");\nexports.encode = exports.stringify = __webpack_require__(/*! ./encode */ \"./node_modules/querystring-es3/encode.js\");\n\n//# sourceURL=webpack:///./node_modules/querystring-es3/index.js?");
+
+/***/ }),
+
/***/ "./node_modules/setimmediate/setImmediate.js":
/*!***************************************************!*\
!*** ./node_modules/setimmediate/setImmediate.js ***!
@@ -464,15 +524,39 @@ eval("/* WEBPACK VAR INJECTION */(function(global) {var scope = typeof global !=
/***/ }),
-/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Login.vue?vue&type=template&id=39c106f7&scoped=true&lang=html&":
-/*!******************************************************************************************************************************************************************************************************************************************************!*\
- !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Login.vue?vue&type=template&id=39c106f7&scoped=true&lang=html& ***!
- \******************************************************************************************************************************************************************************************************************************************************/
+/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/User/Login.vue?vue&type=template&id=0419cc67&scoped=true&lang=html&":
+/*!***********************************************************************************************************************************************************************************************************************************************************!*\
+ !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/User/Login.vue?vue&type=template&id=0419cc67&scoped=true&lang=html& ***!
+ \***********************************************************************************************************************************************************************************************************************************************************/
/*! exports provided: render, staticRenderFns */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"div\", { attrs: { id: \"block-userlogin\" } }, [\n _c(\"h2\", [_vm._v(\"Login Hello!\")]),\n _vm._v(\" \"),\n _c(\"section\", [\n _c(\"input\", {\n directives: [\n {\n name: \"model\",\n rawName: \"v-model\",\n value: _vm.mail,\n expression: \"mail\"\n }\n ],\n staticClass: \"form-email\",\n attrs: {\n id: \"edit-name\",\n type: \"text\",\n placeholder: \"Email\",\n name: \"name\"\n },\n domProps: { value: _vm.mail },\n on: {\n keyup: function($event) {\n if (\n !$event.type.indexOf(\"key\") &&\n _vm._k($event.keyCode, \"enter\", 13, $event.key, \"Enter\")\n ) {\n return null\n }\n return _vm.login($event)\n },\n input: function($event) {\n if ($event.target.composing) {\n return\n }\n _vm.mail = $event.target.value\n }\n }\n }),\n _vm._v(\" \"),\n _c(\"input\", {\n directives: [\n {\n name: \"model\",\n rawName: \"v-model\",\n value: _vm.password,\n expression: \"password\"\n }\n ],\n staticClass: \"form-text\",\n attrs: {\n id: \"edit-pass\",\n type: \"password\",\n placeholder: \"Password\",\n name: \"pass\"\n },\n domProps: { value: _vm.password },\n on: {\n keyup: function($event) {\n if (\n !$event.type.indexOf(\"key\") &&\n _vm._k($event.keyCode, \"enter\", 13, $event.key, \"Enter\")\n ) {\n return null\n }\n return _vm.login($event)\n },\n input: function($event) {\n if ($event.target.composing) {\n return\n }\n _vm.password = $event.target.value\n }\n }\n }),\n _vm._v(\" \"),\n _c(\n \"button\",\n {\n staticClass: \"button\",\n attrs: { id: \"edit-submit\" },\n on: {\n click: function($event) {\n $event.stopPropagation()\n return _vm.login($event)\n }\n }\n },\n [_vm._v(\"\\n login\\n \")]\n )\n ])\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Login.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"div\", { attrs: { id: \"block-userlogin\" } }, [\n _c(\"h2\", [_vm._v(\"Login Hello!\")]),\n _vm._v(\" \"),\n _c(\"section\", [\n _c(\"input\", {\n directives: [\n {\n name: \"model\",\n rawName: \"v-model\",\n value: _vm.mail,\n expression: \"mail\"\n }\n ],\n staticClass: \"form-email\",\n attrs: {\n id: \"edit-name\",\n type: \"text\",\n placeholder: \"Email\",\n name: \"name\"\n },\n domProps: { value: _vm.mail },\n on: {\n keyup: function($event) {\n if (\n !$event.type.indexOf(\"key\") &&\n _vm._k($event.keyCode, \"enter\", 13, $event.key, \"Enter\")\n ) {\n return null\n }\n return _vm.login($event)\n },\n input: function($event) {\n if ($event.target.composing) {\n return\n }\n _vm.mail = $event.target.value\n }\n }\n }),\n _vm._v(\" \"),\n _c(\"input\", {\n directives: [\n {\n name: \"model\",\n rawName: \"v-model\",\n value: _vm.password,\n expression: \"password\"\n }\n ],\n staticClass: \"form-text\",\n attrs: {\n id: \"edit-pass\",\n type: \"password\",\n placeholder: \"Password\",\n name: \"pass\"\n },\n domProps: { value: _vm.password },\n on: {\n keyup: function($event) {\n if (\n !$event.type.indexOf(\"key\") &&\n _vm._k($event.keyCode, \"enter\", 13, $event.key, \"Enter\")\n ) {\n return null\n }\n return _vm.login($event)\n },\n input: function($event) {\n if ($event.target.composing) {\n return\n }\n _vm.password = $event.target.value\n }\n }\n }),\n _vm._v(\" \"),\n _c(\n \"button\",\n {\n staticClass: \"button\",\n attrs: { id: \"edit-submit\" },\n on: {\n click: function($event) {\n $event.stopPropagation()\n return _vm.login($event)\n }\n }\n },\n [_vm._v(\"\\n login\\n \")]\n )\n ])\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/User/Login.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
+/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/User/UserBlock.vue?vue&type=template&id=cb4a5600&scoped=true&lang=html&":
+/*!***************************************************************************************************************************************************************************************************************************************************************!*\
+ !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/User/UserBlock.vue?vue&type=template&id=cb4a5600&scoped=true&lang=html& ***!
+ \***************************************************************************************************************************************************************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _vm.token ? _c(\"UserTools\") : _c(\"Login\")\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/User/UserBlock.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
+/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue?vue&type=template&id=4e9a834e&scoped=true&lang=html&":
+/*!***************************************************************************************************************************************************************************************************************************************************************!*\
+ !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue?vue&type=template&id=4e9a834e&scoped=true&lang=html& ***!
+ \***************************************************************************************************************************************************************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"div\", { attrs: { id: \"user-tools\" } }, [\n _c(\"h4\", [_vm._v(_vm._s(_vm.mail))]),\n _vm._v(\" \"),\n _c(\n \"a\",\n {\n attrs: { href: \"/user/logout\" },\n on: {\n click: function($event) {\n $event.preventDefault()\n return _vm.onLogout()\n }\n }\n },\n [_vm._v(\"\\n logout\\n \")]\n )\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options");
/***/ }),
@@ -555,7 +639,7 @@ eval("var g; // This works in non-strict mode\n\ng = function () {\n return thi
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.runtime.esm.js\");\n/* harmony import */ var vuejs_store__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vuejs/store */ \"./web/themes/custom/materiotheme/vuejs/store/index.js\");\n/* harmony import */ var vuejs_components_Login__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! vuejs/components/Login */ \"./web/themes/custom/materiotheme/vuejs/components/Login.vue\");\n/* harmony import */ var theme_assets_styles_main_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! theme/assets/styles/main.scss */ \"./web/themes/custom/materiotheme/assets/styles/main.scss\");\n/* harmony import */ var theme_assets_styles_main_scss__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(theme_assets_styles_main_scss__WEBPACK_IMPORTED_MODULE_3__);\n\n\n // require('theme/assets/styles/main.scss');\n\n\n\n(function (Drupal, drupalSettings) {\n var v_login = new vue__WEBPACK_IMPORTED_MODULE_0__[\"default\"]({\n store: vuejs_store__WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n render: h => h(vuejs_components_Login__WEBPACK_IMPORTED_MODULE_2__[\"default\"])\n }).$mount('#block-userlogin');\n\n var MaterioTheme = function () {\n // var _is_front = drupalSettings.path.isFront;\n // ___ _ _\n // |_ _|_ _ (_) |_\n // | || ' \\| | _|\n // |___|_||_|_|\\__|\n function init() {\n console.log(\"MaterioTheme init()\");\n }\n\n ;\n init();\n }; // end MaterioTheme()\n // $(document).ready(function($) {\n // if(drupalSettings.path.isFront){\n\n\n var materiotheme = new MaterioTheme(); // }else{\n // $('body').attr('booted', 'booted');\n // }\n // });\n})(Drupal, drupalSettings);\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/assets/scripts/main.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.runtime.esm.js\");\n/* harmony import */ var vuejs_store__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vuejs/store */ \"./web/themes/custom/materiotheme/vuejs/store/index.js\");\n/* harmony import */ var vuejs_components_User_UserBlock__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! vuejs/components/User/UserBlock */ \"./web/themes/custom/materiotheme/vuejs/components/User/UserBlock.vue\");\n/* harmony import */ var theme_assets_styles_main_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! theme/assets/styles/main.scss */ \"./web/themes/custom/materiotheme/assets/styles/main.scss\");\n/* harmony import */ var theme_assets_styles_main_scss__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(theme_assets_styles_main_scss__WEBPACK_IMPORTED_MODULE_3__);\n\n\n // require('theme/assets/styles/main.scss');\n\n\n\n(function (Drupal, drupalSettings) {\n var v_user_block = new vue__WEBPACK_IMPORTED_MODULE_0__[\"default\"]({\n store: vuejs_store__WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n render: h => h(vuejs_components_User_UserBlock__WEBPACK_IMPORTED_MODULE_2__[\"default\"])\n }).$mount('#block-userlogin');\n\n var MaterioTheme = function () {\n // var _is_front = drupalSettings.path.isFront;\n // ___ _ _\n // |_ _|_ _ (_) |_\n // | || ' \\| | _|\n // |___|_||_|_|\\__|\n function init() {\n console.log(\"MaterioTheme init()\");\n }\n\n ;\n init();\n }; // end MaterioTheme()\n // $(document).ready(function($) {\n // if(drupalSettings.path.isFront){\n\n\n var materiotheme = new MaterioTheme(); // }else{\n // $('body').attr('booted', 'booted');\n // }\n // });\n})(Drupal, drupalSettings);\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/assets/scripts/main.js?");
/***/ }),
@@ -570,39 +654,111 @@ eval("// style-loader: Adds some css to the DOM by adding a
diff --git a/web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue b/web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue
new file mode 100644
index 00000000..6d04a47a
--- /dev/null
+++ b/web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue
@@ -0,0 +1,38 @@
+
+
+
+
+
+
+
diff --git a/web/themes/custom/materiotheme/vuejs/rest/http-axios.js b/web/themes/custom/materiotheme/vuejs/rest/http-axios.js
index 9f9371b1..96589798 100644
--- a/web/themes/custom/materiotheme/vuejs/rest/http-axios.js
+++ b/web/themes/custom/materiotheme/vuejs/rest/http-axios.js
@@ -1,10 +1,13 @@
import axios from 'axios'
+// https://github.com/alvar0hurtad0/drupal-vuejs-todo/blob/master/frontend/src/api/axiosInterceptor.js
+
// console.log('drupalSettings', drupalSettings);
export const HTTP = axios.create({
baseURL: `http://dev.materio.com`,
headers: {
- Authorization: 'Bearer {token}'
+ Authorization: 'Bearer {token}',
+ "Content-Type": "application/json"
}
})
diff --git a/web/themes/custom/materiotheme/vuejs/store/modules/user.js b/web/themes/custom/materiotheme/vuejs/store/modules/user.js
index eab2514b..2d945128 100644
--- a/web/themes/custom/materiotheme/vuejs/store/modules/user.js
+++ b/web/themes/custom/materiotheme/vuejs/store/modules/user.js
@@ -1,13 +1,17 @@
import { HTTP } from 'vuejs/rest/http-axios'
+import qs from 'querystring'
export default {
namespaced: true,
// initial state
state : {
- isloggedin: false,
- username: '',
- token: null
+ uid:null,
+ // username: '',
+ mail:'',
+ token: null,
+ logout_token: null
+ // isloggedin: false
},
// getters
@@ -15,45 +19,48 @@ export default {
// mutations
mutations : {
- // setUser (state, posts) {
- // state.all = posts
- // }
- // setOpened (state, post) {
- // state.opened = post
- // },
- // clearOpened (state) {
- // state.opened = null
- // }
+ setUser (state, data) {
+ state.uid = data.current_user.uid
+ // state.username = data.username
+ state.mail = data.current_user.mail
+ state.token = data.csrf_token
+ state.logout_token = data.logout_token
+ },
+ setLoggedOut (state) {
+ state.uid= null
+ state.mail = ''
+ state.token = null
+ state.logout_token = null
+ }
},
// actions
actions : {
- getToken ({ commit, state }, data) {
- // console.log('getToken data', data)
-
- let config = {
- headers: {
- "Content-Type": "application/json"
- }
- }
-
- // console.log('data', data)
- // console.log('config', config)
-
- HTTP.post('/user/login?_format=json', data, config)
- .then(response => {
- console.log('response', response)
- // cb(response.data)
+ getToken ({ commit, state }, credentials) {
+ HTTP.post('/user/login?_format=json', credentials)
+ .then(({ data }) => {
+ console.log('data', data)
+ commit('setUser', data)
})
- .catch(({ error }) => {
- console.log('Issue with login', error);
- Promise.reject(error);
+ .catch(( error ) => {
+ console.log('Issue with login', error)
+ Promise.reject(error)
+ })
+ },
+ userLogout ({ commit, state }) {
+ let credentials = qs.stringify({
+ token: state.token
+ })
+ HTTP.post('/user/logout', credentials)
+ .then((resp) => {
+ console.log('resp', resp)
+ commit('setLoggedOut')
+ })
+ .catch(( error ) => {
+ console.log('Issue with logout', error)
+ Promise.reject(error)
})
}
- // ,
- // logout ({ commit }) {
- //
- // }
}
}