From 3f2568039e8a379de2dd59911919cea6a7d6d822 Mon Sep 17 00:00:00 2001 From: Bachir Soussi Chiadmi Date: Wed, 10 Apr 2019 10:47:45 +0200 Subject: [PATCH] REST login/logout is working --- .../custom/materiotheme/assets/dist/main.js | 212 +++++++++++++++--- .../materiotheme/assets/scripts/main.js | 6 +- .../vuejs/components/{ => User}/Login.vue | 10 +- .../vuejs/components/User/UserBlock.vue | 31 +++ .../vuejs/components/User/UserTools.vue | 38 ++++ .../materiotheme/vuejs/rest/http-axios.js | 5 +- .../materiotheme/vuejs/store/modules/user.js | 77 ++++--- 7 files changed, 305 insertions(+), 74 deletions(-) rename web/themes/custom/materiotheme/vuejs/components/{ => User}/Login.vue (83%) create mode 100644 web/themes/custom/materiotheme/vuejs/components/User/UserBlock.vue create mode 100644 web/themes/custom/materiotheme/vuejs/components/User/UserTools.vue 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 }) { - // - // } } }