Actualizar contabilidad.html
This commit is contained in:
@@ -47,6 +47,114 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div id="view-presupuestos" class="hidden">
|
||||||
|
<div class="flex justify-between items-center mb-4">
|
||||||
|
<h3 class="font-black text-slate-700 text-lg">Listado de Presupuestos</h3>
|
||||||
|
<div class="flex gap-2">
|
||||||
|
<button onclick="openArticlesModal()" class="bg-white border border-slate-200 text-slate-600 px-4 py-2 rounded-xl font-bold text-xs uppercase tracking-widest hover:bg-slate-50 transition-colors shadow-sm">
|
||||||
|
<i data-lucide="tags" class="w-4 h-4 inline mr-1"></i> Artículos
|
||||||
|
</button>
|
||||||
|
<button onclick="openBudgetModal()" class="bg-blue-600 text-white px-4 py-2 rounded-xl font-black text-xs uppercase tracking-widest hover:bg-blue-700 transition-colors shadow-md">
|
||||||
|
<i data-lucide="plus" class="w-4 h-4 inline mr-1"></i> Crear Presupuesto
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-white border border-slate-200 rounded-[2rem] shadow-sm overflow-hidden mb-10">
|
||||||
|
<div class="grid grid-cols-12 gap-4 p-4 bg-slate-50 border-b border-slate-100 text-[10px] font-black uppercase tracking-widest text-slate-400">
|
||||||
|
<div class="col-span-4 pl-2">Cliente / Fecha</div>
|
||||||
|
<div class="col-span-3">Dirección</div>
|
||||||
|
<div class="col-span-2 text-center">Total (+IVA)</div>
|
||||||
|
<div class="col-span-3 text-center">Acciones</div>
|
||||||
|
</div>
|
||||||
|
<div id="budgetsList" class="divide-y divide-slate-100">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="budgetModal" class="fixed inset-0 bg-slate-900/75 hidden z-[100] flex items-center justify-center backdrop-blur-sm p-4">
|
||||||
|
<div class="bg-white rounded-[2rem] w-full max-w-3xl flex flex-col max-h-[90vh] shadow-2xl">
|
||||||
|
<div class="p-6 border-b border-slate-100 flex justify-between items-center">
|
||||||
|
<h3 class="font-black text-xl text-slate-800">Nuevo Presupuesto</h3>
|
||||||
|
<button onclick="document.getElementById('budgetModal').classList.add('hidden')" class="p-2 bg-slate-100 rounded-full text-slate-500 hover:text-red-500"><i data-lucide="x" class="w-5 h-5"></i></button>
|
||||||
|
</div>
|
||||||
|
<div class="p-6 overflow-y-auto no-scrollbar flex-1 space-y-4">
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||||
|
<div class="md:col-span-1">
|
||||||
|
<label class="text-[10px] font-black text-slate-400 uppercase tracking-widest">Teléfono (Busca auto)</label>
|
||||||
|
<input type="text" id="bPhone" onblur="searchClientByPhone()" placeholder="Ej: 600123456" class="w-full bg-slate-50 border border-slate-200 px-3 py-2.5 rounded-xl text-sm font-bold focus:border-blue-500 outline-none">
|
||||||
|
</div>
|
||||||
|
<div class="md:col-span-2">
|
||||||
|
<label class="text-[10px] font-black text-slate-400 uppercase tracking-widest">Nombre Completo</label>
|
||||||
|
<input type="text" id="bName" class="w-full bg-slate-50 border border-slate-200 px-3 py-2.5 rounded-xl text-sm font-bold focus:border-blue-500 outline-none">
|
||||||
|
</div>
|
||||||
|
<div class="md:col-span-3">
|
||||||
|
<label class="text-[10px] font-black text-slate-400 uppercase tracking-widest">Dirección de la obra</label>
|
||||||
|
<input type="text" id="bAddress" class="w-full bg-slate-50 border border-slate-200 px-3 py-2.5 rounded-xl text-sm font-bold focus:border-blue-500 outline-none">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mt-6 border border-slate-200 rounded-2xl overflow-hidden">
|
||||||
|
<div class="bg-slate-50 px-4 py-2 flex justify-between items-center border-b border-slate-200">
|
||||||
|
<span class="text-[10px] font-black text-slate-500 uppercase tracking-widest">Conceptos</span>
|
||||||
|
<button onclick="addBudgetLine()" class="text-[10px] bg-white border border-slate-200 px-2 py-1 rounded text-blue-600 font-bold hover:bg-blue-50">+ Añadir Línea</button>
|
||||||
|
</div>
|
||||||
|
<div id="budgetLines" class="p-2 space-y-2 bg-slate-50/50"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-slate-800 text-white rounded-2xl p-5 flex flex-col md:flex-row justify-between items-center gap-4 shadow-lg">
|
||||||
|
<div class="flex gap-6 text-center md:text-left">
|
||||||
|
<div><p class="text-[10px] text-slate-400 uppercase tracking-widest">Subtotal</p><p class="text-lg font-bold" id="bSubtotal">0.00€</p></div>
|
||||||
|
<div><p class="text-[10px] text-slate-400 uppercase tracking-widest">IVA (21%)</p><p class="text-lg font-bold text-amber-400" id="bTax">0.00€</p></div>
|
||||||
|
</div>
|
||||||
|
<div class="text-center md:text-right">
|
||||||
|
<p class="text-[10px] text-emerald-400 uppercase tracking-widest font-black">TOTAL A PAGAR</p>
|
||||||
|
<p class="text-3xl font-black text-emerald-300" id="bTotal">0.00€</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="p-4 border-t border-slate-100">
|
||||||
|
<button onclick="saveBudget()" class="w-full bg-blue-600 text-white py-3 rounded-xl font-black uppercase tracking-widest shadow-md hover:bg-blue-700">Guardar Presupuesto</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="articlesModal" class="fixed inset-0 bg-slate-900/75 hidden z-[110] flex items-center justify-center p-4 backdrop-blur-sm">
|
||||||
|
<div class="bg-white rounded-[2rem] w-full max-w-lg shadow-2xl">
|
||||||
|
<div class="p-6 border-b border-slate-100 flex justify-between items-center">
|
||||||
|
<h3 class="font-black text-xl text-slate-800">Catálogo de Artículos</h3>
|
||||||
|
<button onclick="document.getElementById('articlesModal').classList.add('hidden')" class="p-2 bg-slate-100 rounded-full text-slate-500 hover:text-red-500"><i data-lucide="x" class="w-5 h-5"></i></button>
|
||||||
|
</div>
|
||||||
|
<div class="p-6 flex gap-2 border-b border-slate-100 bg-slate-50">
|
||||||
|
<input type="text" id="newArtName" placeholder="Nombre Artículo..." class="flex-1 px-3 py-2 rounded-xl border border-slate-200 text-sm font-bold outline-none">
|
||||||
|
<input type="number" id="newArtPrice" placeholder="Precio Base (€)" class="w-24 px-3 py-2 rounded-xl border border-slate-200 text-sm font-bold text-center outline-none">
|
||||||
|
<button onclick="saveArticle()" class="bg-slate-800 text-white px-4 py-2 rounded-xl font-bold shadow-sm">Crear</button>
|
||||||
|
</div>
|
||||||
|
<div id="articlesList" class="p-4 max-h-60 overflow-y-auto space-y-2"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="convertModal" class="fixed inset-0 bg-slate-900/75 hidden z-[110] flex items-center justify-center p-4 backdrop-blur-sm">
|
||||||
|
<div class="bg-white rounded-[2rem] w-full max-w-sm shadow-2xl p-6 text-center">
|
||||||
|
<div class="w-16 h-16 bg-emerald-100 text-emerald-500 rounded-full flex items-center justify-center mx-auto mb-4"><i data-lucide="calendar-check" class="w-8 h-8"></i></div>
|
||||||
|
<h3 class="font-black text-xl text-slate-800 mb-1">Convertir a Servicio</h3>
|
||||||
|
<p class="text-xs text-slate-500 mb-6">Elige la fecha para enviar el aviso al Panel Operativo y notificar al cliente por WhatsApp.</p>
|
||||||
|
<input type="hidden" id="convBudgetId">
|
||||||
|
<div class="space-y-3 text-left mb-6">
|
||||||
|
<div><label class="text-[10px] font-black text-slate-400 uppercase tracking-widest ml-1">Fecha</label><input type="date" id="convDate" class="w-full border-2 border-slate-200 rounded-xl px-3 py-2 font-bold outline-none"></div>
|
||||||
|
<div><label class="text-[10px] font-black text-slate-400 uppercase tracking-widest ml-1">Hora Aprox.</label><input type="time" id="convTime" class="w-full border-2 border-slate-200 rounded-xl px-3 py-2 font-bold outline-none"></div>
|
||||||
|
</div>
|
||||||
|
<div class="flex gap-2">
|
||||||
|
<button onclick="document.getElementById('convertModal').classList.add('hidden')" class="flex-1 bg-slate-100 text-slate-600 font-bold py-3 rounded-xl">Cancelar</button>
|
||||||
|
<button onclick="confirmConversion()" class="flex-1 bg-emerald-500 text-white font-black uppercase tracking-widest shadow-md py-3 rounded-xl">Confirmar</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
|
||||||
<div class="bg-white p-5 rounded-[1.5rem] border border-slate-200 shadow-sm flex items-center gap-4">
|
<div class="bg-white p-5 rounded-[1.5rem] border border-slate-200 shadow-sm flex items-center gap-4">
|
||||||
<div class="w-12 h-12 rounded-full bg-blue-50 text-blue-500 flex items-center justify-center shrink-0"><i data-lucide="sigma"></i></div>
|
<div class="w-12 h-12 rounded-full bg-blue-50 text-blue-500 flex items-center justify-center shrink-0"><i data-lucide="sigma"></i></div>
|
||||||
|
|||||||
Reference in New Issue
Block a user