update login

resources/js/views/Login.vue

@@ -2,58 +2,48 @@
   <div>
     <v-container grid-list-md text-xs-center>
       <v-layout row wrap>
-        <v-flex xs12 sm4 offset-sm1 align-center py-2>
-          <v-form @submit.prevent="login()">
-            <div class="text-sm-left">
+        <v-flex xs12 sm4 offset-sm1 align-center>
+          <div class="text-sm-left mb-4">
             <span class="headline font-weight-bold">เข้าสู่ระบบ</span>
           </div>
+          <v-form @submit.prevent="login()">
             <v-text-field
               label="อีเมล"
               prepend-inner-icon="email"
               color="primary"
               class="fix-size red--text"
               type="email"
-              v-model="user.email"
+              v-model="loginData.email"
             ></v-text-field>
             <v-text-field
               label="รหัสผ่าน"
               type="password"
               color="primary"
               prepend-inner-icon="lock"
-              v-model="user.password"
+              v-model="loginData.password"
             ></v-text-field>
-            <p class="text-xs-right"><a href="#" class="body-2 font-weight-medium">ลืมรหัสผ่าน?</a></p>
-            <v-btn color="blue" block dark large type="submit">เข้าสู่ระบบ</v-btn>
+            <p class="text-xs-right"><router-link to="/" class="body-2 font-weight-medium">ลืมรหัสผ่าน?</router-link></p>
+            <v-btn color="blue" large dark block type="submit">เข้าสู่ระบบ</v-btn>
           </v-form>
-          <v-layout row wrap align-center justify-center>
-            <v-flex sm5>
-              <v-divider></v-divider>
-            </v-flex>
-            <v-flex sm2>
-              หรือ
-            </v-flex>
-            <v-flex sm5>
-              <v-divider></v-divider>
-            </v-flex>
-          </v-layout>
-          <v-layout row wrap>
-            <v-flex sm6>
+          <div class="my-3"><span class="font-weight-bold">หรือ</span></div>
           <v-btn color="primary" block><v-icon>fab fa-facebook</v-icon>&nbsp;เข้าสู่ระบบ Facebook</v-btn>
-            </v-flex>
-            <v-flex sm6>
           <v-btn color="deep-orange" class="white--text" block><v-icon>fab fa-google</v-icon>&nbsp;เข้าสู่ระบบ Google</v-btn>
         </v-flex>
+        <v-flex sm2 xs12>
+          <v-layout justify-center fill-height>
+              <v-divider vertical inset></v-divider>
           </v-layout>
         </v-flex>
-        <v-flex sm4 offset-sm1 xs12 align-center py-2>
-          <div class="text-sm-left">
+        <v-flex sm4 xs12 align-center>
+          <div class="text-sm-left mb-4">
             <span class="headline font-weight-bold">สมัครสมาชิก</span>
           </div>
+          <v-form @submit.prevent="register()">
             <v-layout row wrap>
               <v-flex sm6 xs12>
                 <v-text-field
                   label="ชื่อ"
-                v-model="ชื่อ"
+                  v-model="registerData.first_name"
                   clearable
                   required
                   class="fix-size"
@@ -62,7 +52,7 @@
               <v-flex sm6 xs12>
                 <v-text-field
                   label="นามสกุล"
-                v-model="นามสกุล"
+                  v-model="registerData.last_name"
                   clearable
                   required
                   class="fix-size"
@@ -71,14 +61,14 @@
             </v-layout>
             <v-text-field
               label="อีเมล"
-            v-model="อีเมล"
+              v-model="registerData.email"
               clearable
               required
               class="fix-size"
             ></v-text-field>
             <v-text-field
               label="รหัสผ่าน"
-            v-model="รหัสผ่าน"
+              v-model="registerData.password"
               clearable
               type="password"
               required
@@ -86,14 +76,14 @@
             ></v-text-field>
             <v-text-field
               label="ยืนยันรหัสผ่าน"
-            v-model="ยืนยันรหัสผ่าน"
+              v-model="registerData.password_confirmation"
               clearable
               type="password"
               required
               class="fix-size"
             ></v-text-field>
-          <v-btn color="red accent-3" block dark large>สมัครสมาชิก</v-btn>
-          
+            <v-btn color="red accent-3 my-4" block dark large type="submit">สมัครสมาชิก</v-btn>
+          </v-form>
         </v-flex>
       </v-layout>
     </v-container>
@@ -104,17 +94,55 @@
 export default {
   data () {
     return {
-      user: {
+      loginData: {
         email: '',
         password: ''
+      },
+      registerData: {
+        first_name: '',
+        last_name: '',
+        email: '',
+        password: '',
+        password_confirmation: ''
       }
     }
   },
   methods: {
     login () {
-      console.log('login')
-      axios.post('/login', this.user)
+      axios.post('/login', this.loginData)
+        .then((res) => {
+          console.log(res)
+          console.log(res.body)
+          this.$router.push('/')
+        })
+        .catch((err) => {
+          console.log(err.response)
+        })
+    },
+    register () {
+      axios.post('/register', {
+        name: this.registerData.first_name + ' ' + this.registerData.last_name,
+        email: this.registerData.email,
+        password: this.registerData.password,
+        password_confirmation: this.registerData.password_confirmation
+      })
+        .then((res) => {
+          this.$router.push('/account');
+          console.log(res)
+        })
+        .catch((err) => {
+          console.log(err.response)
+        })
     }
+  },
+  mounted () {
+    axios.get('api/user')
+      .then((res) => {
+        console.log(res.body)
+      })
+      .catch((err) => {
+        console.log(err.response)
+      })
   }
 }
 </script>