<template>
     <div class="container">

<section class="section register min-vh-100 d-flex flex-column align-items-center justify-content-center py-4">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-lg-4 col-md-6 d-flex flex-column align-items-center justify-content-center">
        <div class="d-flex justify-content-center py-4">
          <a href="index.html" class="logo d-flex align-items-center w-auto">
           
            <span class="d-none d-lg-block"> <img :src="logo" alt=""></span>
          </a>
        </div><!-- End Logo -->

        <div class="card mb-3">

          <div class="card-body">

            <div class=" pb-2">
              <h5 class="card-title text-center pb-0 fs-4">로그인</h5>
            </div>

            <form class="row g-3 needs-validation" :class="{ 'was-validated': formSubmitted }" novalidate  @submit.prevent="handleLogin">

              <div class="col-12">
                <label for="yourUsername" class="form-label">E-mail</label>
                <div class="input-group has-validation">
                  <span class="input-group-text" id="inputGroupPrepend">@</span>
                  <input  v-model="email" type="text" name="username" class="form-control" id="yourUsername" required>
                  <div class="invalid-feedback">회사 이메일을 입력해주세요.</div>
                </div>
              </div>

              <div class="col-12">
                <label for="yourPassword" class="form-label">Password</label>
                <input v-model="password" type="password" name="password" class="form-control" id="yourPassword" required>
                <div class="invalid-feedback">비밀번호를 입력해주세요.</div>
              </div>

              <div class="col-12">
                <div class="form-check">
                  <input class="form-check-input" type="checkbox" name="remember" value="true" id="rememberMe">
                  <label class="form-check-label" for="rememberMe">로그인 유지하기</label>
                </div>
              </div>
              <div class="col-12">
                <button class="btn btn-primary w-100" type="submit">로그인</button>
              </div>
              <div class="col-12">
                <p class="small mb-0"> <router-link to="Join">회원가입</router-link></p>
              </div>
            </form>

          </div>
        </div>


      </div>
    </div>
  </div>

</section>

</div>
  </template>
  
  <script>
  export default {
  data() {
    return {
        // 임시 로그인 정보
        email: '',
      password: '',
      validEmail: 'test@takensoft.co.kr',
      validPassword: '1234',
      validName: '테이큰소프트',
      formSubmitted: false,
      logo: "/client/resources/img/logo_t.png", // 경로를 Vue 프로젝트 구조에 맞게 설정
    };
  },
  methods: {
    handleLogin() {
      this.formSubmitted = true; 
      if (this.email === this.validEmail && this.password === this.validPassword) {
        alert('로그인 성공!');
        this.$router.push("/main");
      } else {
      }
    },
  },
};
  </script>
  
  <style scoped>

  </style>
  