frontend/src/components/DocumentUpload.vue

<script setup>
import { ref } from "vue";

const emit = defineEmits(["ingested"]);

const manualText = ref("");
const file = ref(null);
const loading = ref(false);
const status = ref("");
const error = ref("");

async function onFile(e) {
  const f = e.target.files?.[0];
  if (!f) return;
  file.value = f;
  status.value = `Arquivo carregado: ${f.name}`;
}

async function onIngest() {
  error.value = "";
  status.value = "";
  loading.value = true;
  try {
    const hasManual = Boolean(manualText.value.trim());
    if (hasManual) {
      emit("ingested", { text: manualText.value.trim(), source: "manual" });
    } else if (file.value) {
      emit("ingested", { file: file.value, source: "upload" });
    }
    manualText.value = "";
    file.value = null;
    status.value = "Enviado para ingestão.";
  } catch (e) {
    error.value = e?.message || "erro";
  } finally {
    loading.value = false;
  }
}
</script>


<template>
  <section class="rounded-2xl border border-gray-300 bg-gray-100 p-4 shadow-sm backdrop-blur-md dark:border-gray-700 dark:bg-secondary/50">
    <h2 class="text-lg font-semibold text-gray-900 dark:text-gray-100">Update</h2>
    <div class="mt-2 text-sm text-gray-500 dark:text-gray-400">
      Envie .txt, .pdf, .docx ou imagens (png/jpg) com manuais/prints para alimentar a base.
    </div>
    <input
      class="mt-3"
      type="file"
      accept=".txt,.pdf,.docx,.png,.jpg,.jpeg,.webp,application/pdf,application/vnd.openxmlformats-officedocument.wordprocessingml.document,image/*,text/plain"
      @change="onFile"
    />
    <textarea
      v-model="manualText"
      class="mt-3"
      rows="6"
      placeholder="Ou cole um texto aqui para ingestão..."
    />
    <button
      class="mt-3 rounded-lg border border-primary bg-primary px-4 py-2.5 text-sm font-medium text-primary-foreground transition-colors hover:border-[var(--primary-600)] hover:bg-[var(--primary-600)] disabled:cursor-not-allowed disabled:opacity-50"
      :disabled="loading || (!manualText.trim() && !file)"
      @click="onIngest"
    >
      Ingerir
    </button>
    <div v-if="status" class="mt-2.5 text-sm text-gray-500 dark:text-gray-400">{{ status }}</div>
    <div v-if="error" class="mt-2.5 text-sm text-gray-500 dark:text-gray-400">Erro: {{ error }}</div>
  </section>
</template>