ToldoConjunto/apps/toldo-app/src/views/Inventario.vue

<template>
  <div>
    <h1 class="text-h4 mb-4">Inventario y Productos</h1>
    <v-alert v-if="mensaje" :type="tipoMensaje" variant="tonal" class="mb-4">{{ mensaje }}</v-alert>

    <v-row>
      <v-col cols="12" md="6">
        <v-card class="mb-4">
          <v-card-title>Productores</v-card-title>
          <v-card-text>
            <v-row>
              <v-col cols="8">
                <v-text-field v-model="nuevoProductor" label="Nombre del productor" density="compact"></v-text-field>
              </v-col>
              <v-col cols="4">
                <v-btn @click="crearProductor" color="primary" block>Agregar</v-btn>
              </v-col>
            </v-row>
            <v-list>
              <v-list-item v-for="p in productores" :key="p.id" :title="p.nombre"></v-list-item>
            </v-list>
          </v-card-text>
        </v-card>
      </v-col>

      <v-col cols="12" md="6">
        <v-card class="mb-4">
          <v-card-title>Productos</v-card-title>
          <v-card-text>
            <v-select v-model="productorSel" :items="productores" item-title="nombre" item-value="id" label="Productor" density="compact" class="mb-2"></v-select>
            <v-text-field v-model="nombreProd" label="Nombre/Presentación (ej: Café molido 250gr)" density="compact" class="mb-2"></v-text-field>
            <v-text-field v-model.number="precioProd" label="Precio unitario" type="number" density="compact" class="mb-2"></v-text-field>
            <v-btn @click="crearProducto" color="primary" block>Agregar Producto</v-btn>
            <v-list class="mt-3">
              <v-list-item v-for="prod in productos" :key="prod.id" :title="prod.nombrePresentacion" :subtitle="'$' + prod.precioUnitario"></v-list-item>
            </v-list>
          </v-card-text>
        </v-card>
      </v-col>
    </v-row>

    <v-row>
      <v-col cols="12" md="6">
        <v-card>
          <v-card-title>Ingreso Inicial del Día</v-card-title>
          <v-card-text>
            <v-select v-model="prodInv" :items="productos" item-title="nombrePresentacion" item-value="id" label="Producto" density="compact" class="mb-2"></v-select>
            <v-text-field v-model.number="cantInv" label="Cantidad" type="number" density="compact" class="mb-2"></v-text-field>
            <v-btn @click="ingresoInicial" color="success" block>Registrar Ingreso Inicial</v-btn>
          </v-card-text>
        </v-card>
      </v-col>

      <v-col cols="12" md="6">
        <v-card>
          <v-card-title>Ingreso entre Semana</v-card-title>
          <v-card-text>
            <v-select v-model="prodInv2" :items="productos" item-title="nombrePresentacion" item-value="id" label="Producto" density="compact" class="mb-2"></v-select>
            <v-text-field v-model.number="cantInv2" label="Cantidad" type="number" density="compact" class="mb-2"></v-text-field>
            <v-text-field v-model="recibidoPor" label="Recibido por" density="compact" class="mb-2"></v-text-field>
            <v-btn @click="ingresoSemana" color="info" block>Registrar Ingreso</v-btn>
          </v-card-text>
        </v-card>
      </v-col>
    </v-row>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { db } from '@toldo/data';
import { InventarioService } from '@toldo/services';

const invService = new InventarioService();
const productores = ref<any[]>([]);
const productos = ref<any[]>([]);
const nuevoProductor = ref('');
const productorSel = ref('');
const nombreProd = ref('');
const precioProd = ref(0);
const prodInv = ref('');
const cantInv = ref(0);
const prodInv2 = ref('');
const cantInv2 = ref(0);
const recibidoPor = ref('');
const mensaje = ref('');
const tipoMensaje = ref<'success' | 'error'>('success');
function avisar(texto: string, tipo: 'success' | 'error' = 'error') { mensaje.value = texto; tipoMensaje.value = tipo; }

async function cargar() {
  productores.value = await db.productores.toArray();
  productos.value = await db.productos.toArray();
}

async function crearProductor() {
  if (!nuevoProductor.value.trim()) return avisar('Escribe el nombre del productor.');
  await db.productores.add({ id: crypto.randomUUID(), nombre: nuevoProductor.value, activo: true, createdAt: new Date() } as any);
  nuevoProductor.value = '';
  await cargar();
  avisar('Productor creado.', 'success');
}

async function crearProducto() {
  if (!productorSel.value || !nombreProd.value.trim() || precioProd.value <= 0) return avisar('Selecciona productor, nombre y un precio mayor que cero.');
  await db.productos.add({ id: crypto.randomUUID(), productorId: productorSel.value, nombrePresentacion: nombreProd.value, precioUnitario: Number(precioProd.value), activo: true, createdAt: new Date() } as any);
  nombreProd.value = '';
  precioProd.value = 0;
  await cargar();
  avisar('Producto creado.', 'success');
}

async function ingresoInicial() {
  if (!prodInv.value || cantInv.value <= 0) return avisar('Selecciona un producto y una cantidad mayor que cero.');
  await invService.registrarIngresoInicial(prodInv.value, Number(cantInv.value), new Date());
  cantInv.value = 0;
  avisar('Ingreso inicial registrado.', 'success');
}

async function ingresoSemana() {
  if (!prodInv2.value || cantInv2.value <= 0 || !recibidoPor.value.trim()) return avisar('Completa producto, cantidad y persona que recibe.');
  await invService.registrarIngresoSemana(prodInv2.value, Number(cantInv2.value), new Date(), recibidoPor.value);
  cantInv2.value = 0;
  recibidoPor.value = '';
  avisar('Ingreso entre semana registrado.', 'success');
}

onMounted(cargar);
</script>