<template>
  <div>
    <h2 class="text-2xl font-bold text-gray-900 mb-6">Connexion</h2>
    
    <form @submit.prevent="handleLogin" class="space-y-4">
      <div>
        <label for="email" class="label">Email</label>
        <input
          id="email"
          v-model="form.email"
          type="email"
          required
          class="input"
          placeholder="ton.email@example.com"
        >
      </div>
      
      <div>
        <label for="password" class="label">Mot de passe</label>
        <input
          id="password"
          v-model="form.password"
          type="password"
          required
          class="input"
          placeholder="••••••••"
        >
      </div>
      
      <button
        type="submit"
        :disabled="loading"
        class="w-full btn-primary"
      >
        {{ loading ? 'Connexion...' : 'Se connecter' }}
      </button>
    </form>
    
    <div class="mt-6 text-center">
      <p v-if="registrationEnabled" class="text-sm text-gray-600">
        Pas encore de compte ?
        <router-link to="/register" class="font-medium text-primary-600 hover:text-primary-500">
          S'inscrire
        </router-link>
      </p>
      <p v-else class="text-sm text-gray-500">
        Les nouvelles inscriptions sont temporairement désactivées
      </p>
    </div>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { useAuthStore } from '@/stores/auth'
import axios from '@/utils/axios'

const authStore = useAuthStore()

const form = ref({
  email: '',
  password: ''
})

const loading = ref(false)
const registrationEnabled = ref(true)

async function handleLogin() {
  loading.value = true
  await authStore.login(form.value.email, form.value.password)
  loading.value = false
}

async function checkRegistrationStatus() {
  try {
    const response = await axios.get('/api/settings/public/registration-status')
    const status = response.data
    registrationEnabled.value = status.can_register
  } catch (error) {
    console.error('Error checking registration status:', error)
    // En cas d'erreur, on active l'inscription par défaut
    registrationEnabled.value = true
  }
}

onMounted(() => {
  checkRegistrationStatus()
})
</script>
