Untitled

<script lang="ts" setup>
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import MainNavbar from '@/components/MainNavbar.vue'
import { useApi } from '@/composables/Api'
import { useJwtStore } from '@/stores/JwtStore'
import ScannerBook from '@/components/ScannerBook.vue'

const api = useApi()
const jwtStore = useJwtStore()
const router = useRouter();

function goToDashboard() {
  router.push({ name: 'dashboard' });
}

const codeInput = ref('');
const author = ref('');
const title = ref('');
const publisher = ref('');
const abstract = ref('');
const year = ref('');
const pages = ref('');
const location = ref('');
const cover = ref('');
const alertMessage = ref('');
const alertType = ref('');
const isSwappable = ref(false);

// Funzione per gestire il codice scansionato
async function handleScannedCode(code: string) {
  codeInput.value = code;
  await searchBookByCode();
}

async function searchBookByCode() {
  if (!codeInput.value) {
    alertMessage.value = 'Inserisci un ISBN o EAN valido';
    alertType.value = 'danger';
    return;
  }

  try {
    const data = await api.request(`book/search?query=${codeInput.value}`, {
      headers: {
        TokenAuthorization: `Bearer ${jwtStore.token}`
      }
    });

    if (!data || !data.items || data.totalItems === 0) {
      alertMessage.value = 'Nessun libro trovato con questo ISBN/EAN';
      alertType.value = 'danger';
      return;
    }

    const bookInfo = data.items[0].volumeInfo;
    author.value = bookInfo.authors ? bookInfo.authors.join(', ') : 'N/A';
    title.value = bookInfo.title || 'N/A';
    publisher.value = bookInfo.publisher || 'N/A';
    abstract.value = bookInfo.description || 'N/A';
    year.value = bookInfo.publishedDate ? bookInfo.publishedDate.split('-')[0] : 'N/A';
    pages.value = bookInfo.pageCount || 'N/A';
    location.value = '';
    cover.value = data.items[0].cover || '';

    const industryIdentifiers = bookInfo.industryIdentifiers || [];
    const ean = industryIdentifiers.find(id => id.type === "EAN");
    if (ean) {
      codeInput.value = ean.identifier;
    }

    alertMessage.value = 'Libro trovato con successo!';
    alertType.value = 'success';

  } catch (error) {
    console.error('Errore durante la ricerca del libro:', error);
    alertMessage.value = 'Errore durante la ricerca del libro';
    alertType.value = 'danger';
  }
}

async function saveBook(redirectToDashboard = true) {
  if (!title.value || !author.value || !publisher.value) {
    alertMessage.value = 'Completa i campi obbligatori.';
    alertType.value = 'danger';
    return;
  }

  const cleanedCode = codeInput.value.replace(/-/g, '');

  const isIsbn10 = cleanedCode.length === 10 && /^[0-9]+$/.test(cleanedCode);
  const isIsbn13 = cleanedCode.length === 13 && /^[0-9]+$/.test(cleanedCode);
  const isEan = cleanedCode.length >= 8 && cleanedCode.length <= 14 && /^[0-9]+$/.test(cleanedCode) && !isIsbn10 && !isIsbn13;

  const bookData = {
    title: title.value,
    author: author.value,
    publisher: publisher.value,
    year: year.value,
    abstract: abstract.value,
    pages: pages.value,
    location: location.value,
    cover: cover.value,
    isbn: isIsbn10 || isIsbn13 ? cleanedCode : null,
    ean: isEan ? cleanedCode : null,
    state: isSwappable.value ? 'swappable' : 'available'
  };

  try {
    const response = await api.request(`book/create`, {
      method: 'POST',
      headers: {
        TokenAuthorization: `Bearer ${jwtStore.token}`,
        'Content-Type': 'application/json'
      },
      body: JSON.stringify(bookData),
    });

    if (!response) {
      alertMessage.value = 'Errore durante il salvataggio del libro';
      alertType.value = 'danger';
      return;
    }

    const responseData = await response;
    const savedBook = responseData.data;

    alertMessage.value = `Libro "${savedBook.title}" salvato con successo!`;
    alertType.value = 'success';

    if (redirectToDashboard) {
      router.push({
        name: 'dashboard',
        query: { alert: 'success', message: 'Operazione completata con successo!' },
      });
    }
  } catch (error) {
    console.error('Errore durante il salvataggio del libro:', error);
    alertMessage.value = error.message || 'Errore durante il salvataggio del libro';
    alertType.value = 'danger';
  }
}

async function saveBookAndNew() {
  if (!title.value || !author.value || !publisher.value) {
    alertMessage.value = 'Completa i campi obbligatori.';
    alertType.value = 'danger';
    return;
  }

  try {
    await saveBook(false);

    alertMessage.value = 'Libro salvato con successo. Puoi aggiungere un nuovo libro.';
    alertType.value = 'success';

    codeInput.value = '';
    author.value = '';
    title.value = '';
    publisher.value = '';
    abstract.value = '';
    year.value = '';
    pages.value = '';
    location.value = '';
    isSwappable.value = false;
  } catch (error) {
    console.error('Errore durante il salvataggio del libro:', error);
    alertMessage.value = error.message || 'Errore durante il salvataggio del libro.';
    alertType.value = 'danger';
  }
}
</script>

<template>
  <MainNavbar />
  <div class="container mt-3">
    <div class="return-to-list mt-4">
      <span @click="goToDashboard" class="return-text" style="font-size: larger">
        <b> &larr; Ritorna alla lista </b>
      </span>
    </div>

    <div v-if="alertMessage" :class="['alert', alertType === 'success' ? 'alert-success' : 'alert-danger']" role="alert">
      {{ alertMessage }}
    </div>

    <div class="form-container">
      <div class="input-group mb-3">
        <input class="form-control my-2" type="text" placeholder="Cerca per ISBN / EAN" v-model="codeInput" />
        <ScannerBook @code-scanned="handleScannedCode"/>
      </div>

      <button class="btn search-btn my-2" @click="searchBookByCode">Cerca</button>

      <input class="form-control my-2" type="text" placeholder="Autore" v-model="author" style="background-color: #e6f8f7;" required/>
      <input class="form-control my-2 mt-4" type="text" placeholder="Titolo" v-model="title" style="background-color: #e6f8f7;" required/>
      <input class="form-control my-2 mt-4" type="text" placeholder="Editore" v-model="publisher" style="background-color: #e6f8f7;" required/>
      <input class="form-control my-2 mt-4" type="text" placeholder="Anno" v-model="year" />
      <input class="form-control my-2 mt-4" type="text" placeholder="N. di pagine" v-model="pages" />
      <input class="form-control my-2 mt-4" type="text" placeholder="Posizione" v-model="location" />

      <div class="form-check my-2 mt-4">
        <input class="form-check-input" type="checkbox" id="swapCheck"  v-model="isSwappable" />
        <label class="form-check-label" for="swapCheck">
          <b>Scambiabile</b>
        </label>
      </div>

      <button class="btn save-btn my-2 mt-4" @click="saveBook">Salva</button>
      <button class="btn save-new-btn my-2" @click="saveBookAndNew">Salva e Nuovo</button>
    </div>
  </div>
</template>

<style scoped>
.return-to-list {
  font-size: 1rem;
  margin-bottom: 1rem;
  margin-left: 13em;
}

.form-control {
  border-radius: 1rem;
  border: none;
  background-color: #F3F4F6;
  padding: 0.75rem;
}

.btn {
  border-radius: 1rem;
  width: 100%;
  padding: 0.75rem;
  font-weight: bold;
}

.save-btn {
  background-color: #FFC107;
}

.search-btn, .save-new-btn {
  background-color: rgb(253, 148, 68);
  color: white;
}
</style>