987: if (dados.mesas) pdvRenderizarMesasSel(dados.mesas);
1324: mesa_id: parseInt(document.getElementById('pdv-mesa-sel')?.value)||null
1784: if (id === 'mesas') {
1785: carregarPainelMesas();
1789: socket.emit('pedir-mesas');
1802: // ­ƒ¬æ MESAS ÔÇö Fun├º├Áes de cadastro
1804: let mesasGlobal = [];
1806: socket.on('mesas-carregadas', (lista) => {
1807: mesasGlobal = lista;
1808: renderizarListaMesas(lista);
1811: function renderizarListaMesas(lista) {
1812: const div = document.getElementById('lista-mesas');
1814: div.innerHTML = !lista.length ? '<p style="color:#aaa; font-size:13px;">Nenhuma mesa cadastrada.</p>' :
1817: <div style="font-weight:bold; font-size:15px;">Mesa ${m.numero}${m.nome?' ÔÇö '+m.nome:''}</div>
1821: <button onclick="editarMesa(${m.id})" style="background:#ff9800; color:white; border:none; padding:6px 10px; border-radius:6px; cursor:pointer; font-size:12px;"><i class="fas fa-edit"></i></button>
1822: <button onclick="if(confirm('Excluir mesa ${m.numero}?')) socket.emit('deletar-mesa',${m.id})" style="background:#dc3545; color:white; border:none; padding:6px 10px; border-radius:6px; cursor:pointer; font-size:12px;"><i class="fas fa-trash"></i></button>
1827: function salvarMesa() {
1828: const num = parseInt(document.getElementById('mesa-numero').value);
1829: if (!num) { alert('Informe o n├║mero da mesa!'); return; }
1830: socket.emit('salvar-mesa', {
1831: id: parseInt(document.getElementById('mesa-id').value)||null,
1833: nome: document.getElementById('mesa-nome').value.trim(),
1836: limparFormMesa();
1839: function editarMesa(id) {
1840: const m = mesasGlobal.find(x => x.id === id);
1842: document.getElementById('mesa-id').value = m.id;
1843: document.getElementById('mesa-numero').value = m.numero;
1844: document.getElementById('mesa-nome').value = m.nome || '';
1845: document.getElementById('btn-cancelar-mesa').style.display = 'block';
1848: function limparFormMesa() {
1849: document.getElementById('mesa-id').value = '';
1850: document.getElementById('mesa-numero').value = '';
1851: document.getElementById('mesa-nome').value = '';
1852: document.getElementById('btn-cancelar-mesa').style.display = 'none';
1855: // Selector de mesa dentro do PDV
1856: function pdvRenderizarMesasSel(mesas) {
1857: const sel = document.getElementById('pdv-mesa-sel');
1859: sel.innerHTML = '<option value="">­ƒ¬æ Sem mesa (delivery/balc├úo)</option>';
1860: mesas.filter(m => m.ativo).forEach(m => {
1861: sel.innerHTML += `<option value="${m.id}">Mesa ${m.numero}${m.nome?' ÔÇö '+m.nome:''}</option>`;
1916: ${p.mesa_id ? `<div style="font-size:12px;color:#128C7E;font-weight:bold;margin-bottom:4px;"><i class="fas fa-chair"></i> Mesa ${p.mesa_id}</div>` : ''}
2168: // ­ƒ¬æ SISTEMA DE MESAS ÔÇö PDV COMPLETO
2170: let mesaPdvMesaAtual = null;
2171: let mesaPdvCarrinho = [];
2172: let mesaPdvPagamento = '';
2173: let mesaPdvItemEditando = null;
2175: // ÔöÇÔöÇ Painel de Mesas ÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇ
2176: function carregarPainelMesas() {
2177: socket.emit('pedir-painel-mesas');
2180: socket.on('painel-mesas-carregado', (mesas) => {
2181: renderizarPainelMesas(mesas);
2183: if (mesaPdvMesaAtual) {
2184: const mesa = mesas.find(m => m.id === mesaPdvMesaAtual.id);
2185: if (mesa) mesaPdvMesaAtual = mesa;
2189: function renderizarPainelMesas(mesas) {
2190: const grid = document.getElementById('painel-mesas-grid');
2191: const vazio = document.getElementById('painel-mesas-vazio');
2194: const ativas = mesas.filter(m => m.ativo);
2205: const leg = document.getElementById('mesas-legenda');
2220: return `<div onclick="abrirMesaPDV(${m.id})" style="background:${bg}; border:2px solid ${borda}; border-radius:16px; padding:20px 16px; cursor:pointer; transition:0.2s; text-align:center; position:relative;"
2223: <div style="font-size:18px; font-weight:900; color:${cor};">Mesa ${m.numero}</div>
2233: // ÔöÇÔöÇ Abrir Modal Mesa ÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇ
2234: function abrirMesaPDV(mesaId) {
2235: socket.emit('pedir-painel-mesas');
2237: const overlay = document.getElementById('mesa-overlay');
2243: socket.once('painel-mesas-carregado', (mesas) => {
2244: const mesa = mesas.find(m => m.id === mesaId);
2245: if (!mesa) return;
2246: mesaPdvMesaAtual = mesa;
2247: mesaPdvCarrinho = Array.isArray(mesa.carrinho) ? [...mesa.carrinho] : JSON.parse(mesa.carrinho||'[]');
2248: mesaPdvPagamento = '';
2251: document.getElementById('mesa-pdv-titulo').textContent = `­ƒ¬æ Mesa ${mesa.numero}${mesa.nome?' ÔÇö '+mesa.nome:''}`;
2252: document.getElementById('mesa-pdv-status').textContent = mesa.status === 'livre' ? 'Livre ÔÇö clique para adicionar itens' : `Ocupada desde ${mesa.aberta_em||''}`;
2253: document.getElementById('mesa-cliente-nome').value = mesa.cliente_nome || '';
2254: document.getElementById('mesa-obs').value = mesa.observacoes || '';
2257: mesaPdvRenderizarCategorias();
2258: mesaPdvRenderizarGrade();
2259: mesaPdvRenderizarPagamentos();
2260: mesaPdvRenderizarCarrinho();
2266: function fecharMesaPDV() {
2268: if (mesaPdvMesaAtual) {
2269: socket.emit('atualizar-mesa-carrinho', {
2270: id: mesaPdvMesaAtual.id,
2271: carrinho: mesaPdvCarrinho,
2272: cliente_nome: document.getElementById('mesa-cliente-nome').value,
2273: observacoes: document.getElementById('mesa-obs').value,
2274: aberta_em: mesaPdvMesaAtual.aberta_em || new Date().toLocaleString('pt-BR')
2277: document.getElementById('mesa-overlay').style.display = 'none';
2278: mesaPdvMesaAtual = null;
2279: mesaPdvCarrinho = [];
2283: function mesaPdvRenderizarCategorias() {
2284: const div = document.getElementById('mesa-cats-filter');
2286: div.innerHTML = `<button onclick="mesaPdvFiltrar('')" style="padding:6px 14px; border-radius:20px; border:none; background:#128C7E; color:white; cursor:pointer; font-size:12px; font-weight:bold; flex-shrink:0;">Todos</button>`;
2288: div.innerHTML += `<button onclick="mesaPdvFiltrar('',${c.id})" style="padding:6px 14px; border-radius:20px; border:1px solid #ddd; background:white; color:#333; cursor:pointer; font-size:12px; flex-shrink:0;">${c.nome}</button>`;
2292: function mesaPdvRenderizarGrade(busca='', catId=null) {
2293: const div = document.getElementById('mesa-grade-produtos');
2303: return `<div onclick="mesaPdvAbrirItem(${p.id})" style="background:white; border-radius:12px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.08); cursor:pointer; transition:0.2s;" onmouseover="this.style.transform='translateY(-2px)'" onmouseout="this.style.transform='translateY(0)'">
2313: function mesaPdvFiltrar(busca, catId=null) {
2314: mesaPdvRenderizarGrade(busca, catId);
2318: let mesaPdvItemSelecionado = null;
2320: function mesaPdvAbrirItem(prodId) {
2323: mesaPdvItemSelecionado = p;
2339: vars.map((v,i) => `<label style="display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border:2px solid ${i===0?'#128C7E':'#ddd'};border-radius:10px;cursor:pointer;margin-bottom:6px;font-size:13px;" onclick="mesaPdvSelecionarVar(${i},this.parentElement)">
2340: <span><input type="radio" name="mesa-var" value="${i}" ${i===0?'checked':''} style="margin-right:6px;">${v.nome}</span>
2352: <span><input type="checkbox" class="mesa-adic-check" value="${a.id}" style="margin-right:6px;">${a.nome}</span>
2356: // Troca o botão confirmar para usar a função da mesa
2359: btnConfirmar.setAttribute('onclick', 'mesaPdvConfirmarItem()');
2360: btnConfirmar.textContent = ''; btnConfirmar.innerHTML = '<i class="fas fa-cart-plus"></i> Adicionar à Mesa';
2366: function mesaPdvSelecionarVar(idx, container) {
2370: function mesaPdvConfirmarItem() {
2371: const p = mesaPdvItemSelecionado;
2376: const radioSel = document.querySelector('input[name="mesa-var"]:checked');
2381: const adicsChecked = [...document.querySelectorAll('.mesa-adic-check:checked')].map(c => {
2388: // Adiciona ao carrinho da mesa
2389: const existente = mesaPdvCarrinho.findIndex(i =>
2393: mesaPdvCarrinho[existente].qty++;
2394: mesaPdvCarrinho[existente].subtotal = mesaPdvCarrinho[existente].qty * mesaPdvCarrinho[existente].preco;
2396: mesaPdvCarrinho.push({
2415: mesaPdvRenderizarCarrinho();
2417: mesaPdvSalvarRascunho();
2421: function mesaPdvRenderizarCarrinho() {
2422: const div = document.getElementById('mesa-carrinho-lista');
2423: const badge = document.getElementById('mesa-qtd-badge');
2425: const total = mesaPdvCarrinho.reduce((s,i)=>s+i.subtotal,0);
2426: const qtd = mesaPdvCarrinho.reduce((s,i)=>s+i.qty,0);
2428: document.getElementById('mesa-total-header').textContent = 'R$ '+total.toFixed(2).replace('.',',');
2429: document.getElementById('mesa-sub-txt').textContent = 'R$ '+total.toFixed(2).replace('.',',');
2430: document.getElementById('mesa-total-txt').textContent = 'R$ '+total.toFixed(2).replace('.',',');
2431: if (!mesaPdvCarrinho.length) {
2432: div.innerHTML = '<div style="text-align:center;padding:20px;color:#ccc;font-size:13px;"><i class="fas fa-utensils" style="font-size:28px;display:block;margin-bottom:8px;"></i>Mesa vazia</div>';
2435: div.innerHTML = mesaPdvCarrinho.map((it,idx) => `
2447: <button onclick="mesaPdvAlterarQtd(${idx},-1)" style="width:28px;height:28px;border-radius:50%;border:1px solid #ddd;background:white;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;"></button>
2449: <button onclick="mesaPdvAlterarQtd(${idx},1)" style="width:28px;height:28px;border-radius:50%;border:1px solid #ddd;background:white;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;">+</button>
2451: <button onclick="mesaPdvRemoverItem(${idx})" style="background:none;border:none;color:#dc3545;cursor:pointer;font-size:18px;">Ô£ò</button>
2456: function mesaPdvAlterarQtd(idx, delta) {
2457: mesaPdvCarrinho[idx].qty += delta;
2458: if (mesaPdvCarrinho[idx].qty <= 0) mesaPdvCarrinho.splice(idx,1);
2459: else mesaPdvCarrinho[idx].subtotal = mesaPdvCarrinho[idx].qty * mesaPdvCarrinho[idx].preco;
2460: mesaPdvRenderizarCarrinho();
2461: mesaPdvSalvarRascunho();
2464: function mesaPdvRemoverItem(idx) {
2465: mesaPdvCarrinho.splice(idx,1);
2466: mesaPdvRenderizarCarrinho();
2467: mesaPdvSalvarRascunho();
2470: function mesaPdvSalvarRascunho() {
2471: if (!mesaPdvMesaAtual) return;
2472: socket.emit('atualizar-mesa-carrinho', {
2473: id: mesaPdvMesaAtual.id,
2474: carrinho: mesaPdvCarrinho,
2475: cliente_nome: document.getElementById('mesa-cliente-nome').value,
2476: observacoes: document.getElementById('mesa-obs').value,
2477: aberta_em: mesaPdvMesaAtual.aberta_em || new Date().toLocaleString('pt-BR')
2482: function mesaPdvRenderizarPagamentos() {
2483: const div = document.getElementById('mesa-pagamentos-btns');
2486: <button onclick="mesaPdvSelecionarPag('${p.nome}')" id="mesa-pag-${p.id}"
2492: function mesaPdvSelecionarPag(nome) {
2493: mesaPdvPagamento = nome;
2494: document.querySelectorAll('[id^="mesa-pag-"]').forEach(btn => {
2500: const troco = document.getElementById('mesa-troco-container');
2505: function mesaPdvFinalizar() {
2506: if (!mesaPdvCarrinho.length) { alert('Adicione itens à mesa antes de fechar a conta!'); return; }
2507: if (!mesaPdvPagamento) { alert('Selecione a forma de pagamento!'); return; }
2508: if (!confirm(`Fechar conta da Mesa ${mesaPdvMesaAtual.numero}?\nTotal: R$ ${mesaPdvCarrinho.reduce((s,i)=>s+i.subtotal,0).toFixed(2).replace('.',',')}`)) return;
2509: socket.emit('fechar-conta-mesa', {
2510: id: mesaPdvMesaAtual.id,
2511: cliente_nome: document.getElementById('mesa-cliente-nome').value || `Mesa ${mesaPdvMesaAtual.numero}`,
2512: pagamento: mesaPdvPagamento
2516: socket.on('conta-mesa-fechada', (pedido) => {
2518: mesaPdvImprimirComanda(pedido);
2519: document.getElementById('mesa-overlay').style.display = 'none';
2520: mesaPdvMesaAtual = null;
2521: mesaPdvCarrinho = [];
2522: carregarPainelMesas();
2525: socket.on('mesa-erro', (msg) => alert('ÔÜá´©Å '+msg));
2527: // ÔöÇÔöÇ Limpar Mesa ÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇÔöÇ
2528: function mesaPdvLimpar() {
2529: if (!mesaPdvMesaAtual) return;
2530: if (!confirm(`Limpar todos os itens da Mesa ${mesaPdvMesaAtual.numero}? Isso não gera pedido.`)) return;
2531: socket.emit('limpar-mesa', mesaPdvMesaAtual.id);
2532: mesaPdvCarrinho = [];
2533: mesaPdvRenderizarCarrinho();
2536: socket.on('mesa-limpa', () => {
2537: document.getElementById('mesa-overlay').style.display = 'none';
2538: mesaPdvMesaAtual = null;
2539: carregarPainelMesas();
2543: function mesaPdvImprimir() {
2544: if (!mesaPdvMesaAtual || !mesaPdvCarrinho.length) { alert('Nenhum item na mesa!'); return; }
2545: mesaPdvImprimirComanda({
2549: cliente_nome: document.getElementById('mesa-cliente-nome').value || `Mesa ${mesaPdvMesaAtual.numero}`,
2550: mesa_numero: mesaPdvMesaAtual.numero,
2551: mesa_nome: mesaPdvMesaAtual.nome,
2552: itens: mesaPdvCarrinho,
2553: subtotal: mesaPdvCarrinho.reduce((s,i)=>s+i.subtotal,0),
2554: total: mesaPdvCarrinho.reduce((s,i)=>s+i.subtotal,0),
2555: pagamento: mesaPdvPagamento || 'ÔÇö',
2556: observacoes: document.getElementById('mesa-obs').value
2560: function mesaPdvImprimirComanda(p) {
2572: <div style="text-align:center;font-size:14px;font-weight:bold;">Mesa ${p.mesa_numero||''}${p.mesa_nome?' ÔÇö '+p.mesa_nome:''}</div>