source: ReserveNGo-frontend/src/components/Project/login_.vue

<script>


import { userStore } from '@/PiniaStores/UserStore.js'

import {useRouter} from 'vue-router'
import router from '@/router/index.js'

export default {
  data() {
    return {
      form_info:{
        email: '',
        password: ''
      },

      url: 'http://localhost:8080/api/auth/login',

      userStore_: userStore(),

      router: useRouter()

    }
  },
  methods: {
   async makeLogin() {

      await fetch(this.url, {
        method: 'POST',
        headers: { 'Content-Type': 'application/json'},
        body: JSON.stringify({
          email: this.form_info.email,
          password: this.form_info.password,
        })
      }).then((response) => response.json())
        .then(json => {this.userStore_.setLocalStorage(json);
                        router.push('/')})

    }
  }
}

</script>

<template>


  <div class="container-xxl">

    <div class="row justify-content-center  ">
<!--      <form  v-on:submit.prevent="makeLogin">-->
<!--      <form action="http://localhost:8080/api/auth/login" method="POST">-->
      <div class="col-3">
        <form  v-on:submit.prevent="makeLogin">

      <label  for="email" class="form-label">Email</label>
      <input v-model="this.form_info.email" name="email" id="email" class="form-control" type="text">

      <label for="password" class="form-label">Password</label>
      <input v-model="this.form_info.password" name="password" id="password" type="password" class="form-control">

        <button type="submit" class="btn btn-dark mt-2">Login</button>
        </form>
      </div>



    </div>


  </div>
</template>

<style scoped>

</style>