);
/* ── rubro = flujo, una sola decisión ──────────────────────
Decisión 04-sep: elegir el rubro YA es elegir el patrón de conversación. No
hay pantalla de "elegí tu patrón" — es una decisión para el emprendedor, no
dos. 60 rubros no entran en una lista usable en 390 px: se busca. La letra
del patrón no se nombra nunca; se muestra la consecuencia. */
function RubroPicker({ cfg, set }) {
const [q, setQ] = React.useState('');
const vis = RUBROS.filter(([,n]) => n.toLowerCase().includes(q.toLowerCase())).slice(0, 40);
const f = FLUJOS[cfg.patron];
/* Texto libre: el backend ya lo soporta — onboarding-flow.js lo sanitiza con
sanitizarOficioLibre (una línea, 60 car.), lo guarda como `OTRO:` y
cae en patrón A. Mínimo 2 caracteres. Mismo contrato acá. */
const libre = q.trim().replace(/\s+/g, ' ').slice(0, 60);
return (
{libre.length >= 2 ? 'No está en la lista, pero lo cargamos igual.' : 'Escribí al menos dos letras de tu oficio.'}
{libre.length >= 2 && }
}
Con {cfg.rubro}, Mia arranca preconfigurada para {f.pres === 'siempre' ? 'presupuestar con ítems y materiales' : f.pres === 'a veces' ? 'presupuestar sin desglose de materiales' : 'tomar el turno directo, sin presupuesto'}{f.dom ? ' y preguntar por el domicilio' : ' y atender en tu local'}. Todo eso lo podés cambiar — ella se adapta a lo que dejes configurado.{cfg.otro && <>
Tu oficio no estaba en la lista, así que arrancás con el preset de visitas técnicas, que es el más general. Ajustá lo que no te cierre y queda como vos lo dejes.}
);
}
/* ── editor de configuración ───────────────────────────────── */
function CfgEditor({ k, cfg, set }) {
const p = PASOS_ONB.find(x => x.k === k);
const ayuda =
{p ? p.x : ''}
;
if (k === 'Tu rubro') return ;
if (k === 'Visitas a domicilio') return (
{cfg.domicilio.on ? 'Mia le pregunta al cliente si quiere que vayas o si viene él.' : 'Mia da por hecho que atendés en tu local y no pregunta la dirección.'}
);
if (k === 'Horarios y días') return ;
if (k === 'Cobros y señas') return ;
if (k === 'Feriados y vacaciones') return ;
if (k === 'Avisos al cliente') return ;
if (k === 'Capacidad y metas') return (
TRABAJOS POR DÍA COMO MÁXIMO set(c => ({ ...c, capacidad:v }))} />
Mia deja de ofrecer turnos cuando llega a {cfg.capacidad}.
{cfg.presupuesto.on ? 'Antes de tomar el trabajo, Mia le manda el presupuesto y espera respuesta.' : 'Mia toma el trabajo directo, con el precio de tu lista y sin presupuesto previo.'}
{cfg.presupuesto.items ? 'Cada presupuesto se arma por ítems: el cliente ve en qué se le va la plata.' : 'Un solo monto por trabajo, sin lista de ítems.'}
}
set(c => ({ ...c, docs:{ ...c.docs, nombre:v } }))} ph="Tu nombre o el del negocio" />
set(c => ({ ...c, docs:{ ...c.docs, pie:v } }))} ph="Texto legal al pie" />
);
}
/* ── presupuesto con ítems ────────────────────────────────────
El esquema real ya tiene la forma: presupuestos.items es
[{desc, cantidad, precio_unit, subtotal}]. Lo que hace budget.js hoy es
colapsar todo en UN ítem con cantidad 1 — así que un pintor no puede
desglosar pintura, rodillos y mano de obra. Acá el desglose es de verdad.
En 390 px una tabla de 5 columnas no entra: cada ítem son DOS líneas. */
const GRUPOS = [
{ t:'mat', lbl:'MATERIALES', add:'+ Material' },
{ t:'obra', lbl:'MANO DE OBRA', add:'+ Mano de obra' },
];
const totalItems = its => (its || []).reduce((s,i) => s + (i.c || 0) * (i.p || 0), 0);
function ItemsEditor({ items, set, ticket, setTicket }) {
const tk = ticket || { fotos:[], como:'En papel' };
const setTk = setTicket || (() => {});
const upd = (i, k, v) => set(items.map((x,n) => n === i ? { ...x, [k]:v } : x));
const num = v => parseInt(String(v).replace(/\D/g,''), 10) || 0;
return (
))}
);
})}
{/* El comprobante de la ferretería: el emprendedor compra el material y
después le muestra el ticket al cliente para que vea que no le está
cargando de más. Sacarle una foto lo deja pegado al presupuesto, y
en el documento queda dicho CÓMO se entregó — en papel o adjunto. */}
{tk.como === 'En papel' ? 'El presupuesto dice que el ticket original se entrega en mano.' : tk.como === 'Adjunto' ? 'El ticket va con el presupuesto, así el cliente ve los precios de la ferretería.' : 'El presupuesto no menciona comprobantes de materiales.'}
Total{money(totalItems(items))}
Los materiales y la mano de obra van separados en el documento, así el cliente ve en qué se le va la plata. Mia arranca el desglose con los precios que tenés cargados en Servicios.
);
}
/* ── documento: presupuesto o recibo ──────────────────────── */
function DocView({ job, tipo, cfg, editar }) {
const recibo = tipo === 'recibo';
const nro = recibo ? '00' + job.id : job.id;
/* El desglose existe si el emprendedor lo dejó prendido. Sin él, el mismo
documento cae al monto único — los ítems no se borran, quedan guardados. */
const items = cfg.presupuesto.items ? (job.items || []).filter(i => i.d.trim() || i.p) : [];
const total = items.length ? totalItems(items) : job.monto;
return (
{cfg.docs.logo && }
{cfg.docs.nombre}
{recibo ? 'RECIBO' : 'PRESUPUESTO'} N° {nro}
03/09/26
PARA
{job.cli}
{items.length ? GRUPOS.map(g => { const del = items.filter(i => i.t === g.t);
if (!del.length) return null;
return
MATERIALES{job.ticket.como === 'Adjunto' ? `Comprobante de compra adjunto (${job.ticket.fotos.length} foto${job.ticket.fotos.length === 1 ? '' : 's'}).` : 'El comprobante original de la ferretería se entrega en mano.'}
)}
{recibo ? cfg.docs.pie : <>Válido por 15 días. {cfg.docs.pie}}
{!recibo && editar && }
{recibo
? <>Se lo mandé a {job.cli.split(' ')[0]} por WhatsApp cuando cerraste el trabajo. La versión A4 para imprimir sale del panel.
: job.enviado
? <>Enviado a {job.cli.split(' ')[0]} por WhatsApp. Cuando responda te aviso.
: <>Todavía no se lo mandé. Revisá el monto y dale enviar.}