From c5b4e27de7f7d4fb1cafe9462473b552f1af21d9 Mon Sep 17 00:00:00 2001
From: CazSaa <cazsaaltink@gmail.com>
Date: Thu, 21 Oct 2021 20:14:15 +0200
Subject: [PATCH] Implement login. Fix #6

---
 nuxt.config.js  | 22 ++++++++++++++++++----
 package.json    |  1 +
 pages/Login.vue | 20 +++++++++++++++-----
 store/index.js  |  2 ++
 4 files changed, 36 insertions(+), 9 deletions(-)
 create mode 100644 store/index.js

diff --git a/nuxt.config.js b/nuxt.config.js
index a771fc3..5b6d483 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -60,25 +60,39 @@ export default {
   },
 
   axios: {
-    baseURL: 'http://127.0.0.1:3001/'
+    // baseURL: 'http://localhost:3001/'
+    proxy: true
+  },
+
+  proxy: {
+    '/api/': {
+      target: 'http://localhost:3001/',
+      pathRewrite: { '^/api/': '' }
+    }
   },
 
   auth: {
     strategies: {
       cookie: {
+        // cookie: {
+        //   name: 'connect.sid'
+        // },
         endpoints: {
           login: {
-            url: 'user/login',
+            url: 'api/auth/login',
             method: 'post'
           },
           logout: {
-            url: 'user/logout',
+            url: 'api/auth/logout',
             method: 'post'
           },
           user: {
-            url: 'user/me',
+            url: 'api/user/me',
             method: 'get'
           }
+        },
+        user: {
+          property: false
         }
       }
     }
diff --git a/package.json b/package.json
index 5e635d5..158f1fb 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
   "dependencies": {
     "@nuxtjs/auth-next": "5.0.0-1624817847.21691f1",
     "@nuxtjs/axios": "^5.13.6",
+    "@nuxtjs/proxy": "^2.1.0",
     "@nuxtjs/pwa": "^3.3.5",
     "core-js": "^3.9.1",
     "nuxt": "^2.15.3"
diff --git a/pages/Login.vue b/pages/Login.vue
index b4bd7eb..9d46d78 100644
--- a/pages/Login.vue
+++ b/pages/Login.vue
@@ -96,7 +96,10 @@
     </svg>
     <h1><span>Log in</span> to access</h1>
     <h2>your hydrominder</h2>
-    <p>{{ $auth.loggedIn }}</p>
+    <p v-if="loginError" class="error">
+      Something went wrong logging you in.
+      Check your username and password and try again.
+    </p>
     <form class="login-form" @submit.prevent="userLogin">
       <label for="username">Username</label>
       <input id="username" v-model="login.username" type="text">
@@ -114,16 +117,17 @@ export default {
       login: {
         username: '',
         password: ''
-      }
+      },
+      loginError: false
     }
   },
   methods: {
     async userLogin () {
       try {
-        const response = await this.$auth.loginWith('cookie', { data: this.login })
-        console.log(response)
+        await this.$auth.loginWith('cookie', { data: this.login })
+        this.loginError = false
       } catch (err) {
-        console.log(err)
+        this.loginError = true
       }
     }
   },
@@ -194,6 +198,12 @@ export default {
     text-shadow: -1px 3px 4px #444;
   }
 
+  .error {
+    color: darkred;
+    text-shadow: none;
+    font-size: .7em;
+  }
+
   .watermark {
     position: absolute;
     top: 3%;
diff --git a/store/index.js b/store/index.js
new file mode 100644
index 0000000..6d8485f
--- /dev/null
+++ b/store/index.js
@@ -0,0 +1,2 @@
+export const state = () => ({
+})
-- 
GitLab