|
|
<!DOCTYPE html> |
|
|
<html lang="pt-BR"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Pedidos de Compra</title> |
|
|
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> |
|
|
<style> |
|
|
body { |
|
|
background-color: #1a202c; |
|
|
color: #ffffff; |
|
|
min-height: 100vh; |
|
|
} |
|
|
|
|
|
.status-badge { |
|
|
padding: 0.25rem 0.5rem; |
|
|
border-radius: 50rem; |
|
|
font-size: 0.75rem; |
|
|
font-weight: 500; |
|
|
} |
|
|
|
|
|
.status-em-elaboracao { |
|
|
background-color: #4b5563; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.status-aguardando-aprovacao { |
|
|
background-color: #f59e0b; |
|
|
color: #1e293b; |
|
|
} |
|
|
|
|
|
.status-aprovado { |
|
|
background-color: #10b981; |
|
|
color: #1e293b; |
|
|
} |
|
|
|
|
|
.status-enviado { |
|
|
background-color: #3b82f6; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.status-recebido-parcial { |
|
|
background-color: #8b5cf6; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.status-recebido-total { |
|
|
background-color: #22c55e; |
|
|
color: #1e293b; |
|
|
} |
|
|
|
|
|
.status-cancelado { |
|
|
background-color: #ef4444; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.offcanvas { |
|
|
transition: transform 0.3s ease-in-out; |
|
|
background-color: #1a202c !important; |
|
|
color: #ffffff !important; |
|
|
width: 33% !important; |
|
|
} |
|
|
|
|
|
.offcanvas-end { |
|
|
transform: translateX(100%); |
|
|
} |
|
|
|
|
|
.offcanvas.show { |
|
|
transform: translateX(0); |
|
|
} |
|
|
|
|
|
.backdrop { |
|
|
transition: opacity 0.3s ease-in-out; |
|
|
opacity: 0; |
|
|
pointer-events: none; |
|
|
} |
|
|
|
|
|
.backdrop.show { |
|
|
opacity: 1; |
|
|
pointer-events: auto; |
|
|
} |
|
|
|
|
|
.table-responsive { |
|
|
overflow-x: auto; |
|
|
} |
|
|
|
|
|
.table { |
|
|
color: #ffffff; |
|
|
background-color: transparent; |
|
|
} |
|
|
|
|
|
.table thead th { |
|
|
background-color: #2d3748; |
|
|
border-bottom: 1px solid #4a5568; |
|
|
font-size: 0.75rem; |
|
|
font-weight: 500; |
|
|
text-transform: uppercase; |
|
|
letter-spacing: 0.05em; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.table tbody tr { |
|
|
background-color: transparent; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.table tbody tr:hover { |
|
|
background-color: rgba(45, 55, 72, 0.3); |
|
|
} |
|
|
|
|
|
.table tbody tr td { |
|
|
vertical-align: middle; |
|
|
white-space: nowrap; |
|
|
border-top: 1px solid #4a5568; |
|
|
background-color: #363e4b; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.table tfoot td { |
|
|
background-color: #2d3748; |
|
|
font-weight: 500; |
|
|
border-top: 1px solid #4a5568; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.btn-action { |
|
|
padding: 0.25rem; |
|
|
background: transparent; |
|
|
border: none; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.btn-action:hover { |
|
|
opacity: 0.8; |
|
|
} |
|
|
|
|
|
.btn-blue { |
|
|
background-color: #2563eb; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-blue:hover { |
|
|
background-color: #1d4ed8; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-gray { |
|
|
background-color: #4a5568; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-gray:hover { |
|
|
background-color: #2d3748; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-green { |
|
|
background-color: #10b981; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-green:hover { |
|
|
background-color: #0d9e6e; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-yellow { |
|
|
background-color: #d97706; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-yellow:hover { |
|
|
background-color: #b45309; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-purple { |
|
|
background-color: #7c3aed; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-purple:hover { |
|
|
background-color: #6d28d9; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-red { |
|
|
background-color: #dc2626; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.btn-red:hover { |
|
|
background-color: #b91c1c; |
|
|
color: white; |
|
|
} |
|
|
|
|
|
.card { |
|
|
background-color: #2a354b; |
|
|
border: 1px solid #4a5568; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.form-control, .form-select { |
|
|
background-color: #2d3748; |
|
|
border: 1px solid #4a5568; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.form-control:focus, .form-select:focus { |
|
|
background-color: #2d3748; |
|
|
border-color: #4299e1; |
|
|
color: #ffffff; |
|
|
box-shadow: 0 0 0 0.25rem rgba(66, 153, 225, 0.25); |
|
|
} |
|
|
|
|
|
.form-control::placeholder { |
|
|
color: #a0aec0; |
|
|
} |
|
|
|
|
|
.history-item { |
|
|
display: flex; |
|
|
align-items: flex-start; |
|
|
margin-bottom: 1rem; |
|
|
} |
|
|
|
|
|
.history-icon { |
|
|
flex-shrink: 0; |
|
|
width: 2rem; |
|
|
height: 2rem; |
|
|
border-radius: 50%; |
|
|
display: flex; |
|
|
align-items: center; |
|
|
justify-content: center; |
|
|
margin-right: 0.75rem; |
|
|
} |
|
|
|
|
|
.history-content p { |
|
|
margin-bottom: 0; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.history-date { |
|
|
font-size: 0.875rem; |
|
|
color: #a0aec0; |
|
|
} |
|
|
|
|
|
.modal-content { |
|
|
background-color: #2d3748; |
|
|
color: #ffffff; |
|
|
border: 1px solid #4a5568; |
|
|
} |
|
|
|
|
|
.modal-header { |
|
|
border-bottom: 1px solid #4a5568; |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.modal-footer { |
|
|
border-top: 1px solid #4a5568; |
|
|
} |
|
|
|
|
|
.btn-close { |
|
|
filter: invert(1); |
|
|
} |
|
|
|
|
|
#itemForm { |
|
|
display: none; |
|
|
} |
|
|
|
|
|
#itemForm.show { |
|
|
display: block; |
|
|
} |
|
|
|
|
|
.form-label { |
|
|
color: #ffffff; |
|
|
} |
|
|
|
|
|
.text-muted { |
|
|
color: #a0aec0 !important; |
|
|
} |
|
|
|
|
|
.text-primary { |
|
|
color: #3b82f6 !important; |
|
|
} |
|
|
|
|
|
.text-warning { |
|
|
color: #f59e0b !important; |
|
|
} |
|
|
|
|
|
.text-success { |
|
|
color: #10b981 !important; |
|
|
} |
|
|
|
|
|
.text-danger { |
|
|
color: #ef4444 !important; |
|
|
} |
|
|
|
|
|
.text-purple { |
|
|
color: #8b5cf6 !important; |
|
|
} |
|
|
|
|
|
.offcanvas-title { |
|
|
color: #3b82f6 !important; |
|
|
} |
|
|
|
|
|
.card-title { |
|
|
color: #3b82f6 !important; |
|
|
} |
|
|
|
|
|
.btn-link { |
|
|
color: #3b82f6 !important; |
|
|
} |
|
|
|
|
|
@media (max-width: 768px) { |
|
|
.offcanvas { |
|
|
width: 100% !important; |
|
|
} |
|
|
|
|
|
.header-buttons { |
|
|
width: 100% !important; |
|
|
} |
|
|
} |
|
|
|
|
|
@media (max-width: 992px) { |
|
|
.offcanvas { |
|
|
width: 75% !important; |
|
|
} |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="container-fluid px-4 py-5"> |
|
|
|
|
|
<div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center mb-5 gap-3"> |
|
|
<h1 class="text-primary mb-0">Pedidos de Compra</h1> |
|
|
<div class="d-flex flex-column flex-sm-row gap-3 header-buttons w-md-auto justify-content-end"> |
|
|
<button id="newOrderBtn" class="btn btn-blue d-flex align-items-center gap-2"> |
|
|
<i class="fas fa-plus"></i> Novo Pedido de Compra |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="filters" class="card mb-5"> |
|
|
<div class="card-body"> |
|
|
<div class="row g-4"> |
|
|
<div class="col-12 col-md-6 col-lg-3"> |
|
|
<label class="form-label">Fornecedor</label> |
|
|
<select class="form-select"> |
|
|
<option>Todos</option> |
|
|
<option>Fornecedor A</option> |
|
|
<option>Fornecedor B</option> |
|
|
<option>Fornecedor C</option> |
|
|
</select> |
|
|
</div> |
|
|
<div class="col-12 col-md-6 col-lg-3"> |
|
|
<label class="form-label">Status</label> |
|
|
<select class="form-select"> |
|
|
<option>Todos</option> |
|
|
<option>Em Elaboração</option> |
|
|
<option>Aguardando Aprovação</option> |
|
|
<option>Aprovado</option> |
|
|
<option>Enviado</option> |
|
|
<option>Recebido Parcial</option> |
|
|
<option>Recebido Total</option> |
|
|
<option>Cancelado</option> |
|
|
</select> |
|
|
</div> |
|
|
<div class="col-12 col-md-6 col-lg-3"> |
|
|
<label class="form-label">Responsável</label> |
|
|
<select class="form-select"> |
|
|
<option>Todos</option> |
|
|
<option>João Silva</option> |
|
|
<option>Maria Souza</option> |
|
|
<option>Carlos Oliveira</option> |
|
|
</select> |
|
|
</div> |
|
|
<div class="col-12 col-md-6 col-lg-3"> |
|
|
<label class="form-label">Período</label> |
|
|
<input type="date" class="form-control"> |
|
|
</div> |
|
|
</div> |
|
|
<div class="d-flex justify-content-end mt-4 gap-2"> |
|
|
<button class="btn btn-gray">Limpar</button> |
|
|
<button class="btn btn-blue">Aplicar</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card shadow-lg"> |
|
|
<div class="table-responsive"> |
|
|
<table class="table table-hover mb-0"> |
|
|
<thead> |
|
|
<tr> |
|
|
<th class="ps-4">Nº Pedido</th> |
|
|
<th>Fornecedor</th> |
|
|
<th>Responsável</th> |
|
|
<th>Emissão</th> |
|
|
<th>Previsão Entrega</th> |
|
|
<th>Status</th> |
|
|
<th>Valor Total</th> |
|
|
<th class="text-end pe-4">Ações</th> |
|
|
</tr> |
|
|
</thead> |
|
|
<tbody> |
|
|
<tr> |
|
|
<td class="ps-4">PC-2023-001</td> |
|
|
<td>Fornecedor A</td> |
|
|
<td>João Silva</td> |
|
|
<td>10/05/2023</td> |
|
|
<td>25/05/2023</td> |
|
|
<td> |
|
|
<span class="status-badge status-recebido-total">Recebido Total</span> |
|
|
</td> |
|
|
<td>R$ 5.245,00</td> |
|
|
<td class="text-end pe-4"> |
|
|
<div class="d-flex justify-content-end gap-2"> |
|
|
<button onclick="viewOrder('PC-2023-001')" class="btn-action text-primary"> |
|
|
<i class="fas fa-eye"></i> |
|
|
</button> |
|
|
<button class="btn-action text-warning"> |
|
|
<i class="fas fa-print"></i> |
|
|
</button> |
|
|
</div> |
|
|
</td> |
|
|
</tr> |
|
|
<tr> |
|
|
<td class="ps-4">PC-2023-002</td> |
|
|
<td>Fornecedor B</td> |
|
|
<td>Maria Souza</td> |
|
|
<td>15/05/2023</td> |
|
|
<td>30/05/2023</td> |
|
|
<td> |
|
|
<span class="status-badge status-enviado">Enviado</span> |
|
|
</td> |
|
|
<td>R$ 3.780,50</td> |
|
|
<td class="text-end pe-4"> |
|
|
<div class="d-flex justify-content-end gap-2"> |
|
|
<button onclick="viewOrder('PC-2023-002')" class="btn-action text-primary"> |
|
|
<i class="fas fa-eye"></i> |
|
|
</button> |
|
|
<button class="btn-action text-warning"> |
|
|
<i class="fas fa-print"></i> |
|
|
</button> |
|
|
</div> |
|
|
</td> |
|
|
</tr> |
|
|
<tr> |
|
|
<td class="ps-4">PC-2023-003</td> |
|
|
<td>Fornecedor C</td> |
|
|
<td>Carlos Oliveira</td> |
|
|
<td>18/05/2023</td> |
|
|
<td>05/06/2023</td> |
|
|
<td> |
|
|
<span class="status-badge status-aguardando-aprovacao">Aguardando Aprovação</span> |
|
|
</td> |
|
|
<td>R$ 12.450,00</td> |
|
|
<td class="text-end pe-4"> |
|
|
<div class="d-flex justify-content-end gap-2"> |
|
|
<button onclick="viewOrder('PC-2023-003')" class="btn-action text-primary"> |
|
|
<i class="fas fa-eye"></i> |
|
|
</button> |
|
|
<button class="btn-action text-warning"> |
|
|
<i class="fas fa-print"></i> |
|
|
</button> |
|
|
</div> |
|
|
</td> |
|
|
</tr> |
|
|
<tr> |
|
|
<td class="ps-4">PC-2023-004</td> |
|
|
<td>Fornecedor A</td> |
|
|
<td>João Silva</td> |
|
|
<td>20/05/2023</td> |
|
|
<td>10/06/2023</td> |
|
|
<td> |
|
|
<span class="status-badge status-em-elaboracao">Em Elaboração</span> |
|
|
</td> |
|
|
<td>R$ 7.890,25</td> |
|
|
<td class="text-end pe-4"> |
|
|
<div class="d-flex justify-content-end gap-2"> |
|
|
<button onclick="viewOrder('PC-2023-004')" class="btn-action text-primary"> |
|
|
<i class="fas fa-eye"></i> |
|
|
</button> |
|
|
<button class="btn-action text-success"> |
|
|
<i class="fas fa-edit"></i> |
|
|
</button> |
|
|
<button onclick="cancelOrder('PC-2023-004')" class="btn-action text-danger"> |
|
|
<i class="fas fa-times"></i> |
|
|
</button> |
|
|
<button class="btn-action text-warning"> |
|
|
<i class="fas fa-print"></i> |
|
|
</button> |
|
|
</div> |
|
|
</td> |
|
|
</tr> |
|
|
<tr> |
|
|
<td class="ps-4">PC-2023-005</td> |
|
|
<td>Fornecedor B</td> |
|
|
<td>Maria Souza</td> |
|
|
<td>22/05/2023</td> |
|
|
<td>15/06/2023</td> |
|
|
<td> |
|
|
<span class="status-badge status-recebido-parcial">Recebido Parcial</span> |
|
|
</td> |
|
|
<td>R$ 9.120,75</td> |
|
|
<td class="text-end pe-4"> |
|
|
<div class="d-flex justify-content-end gap-2"> |
|
|
<button onclick="viewOrder('PC-2023-005')" class="btn-action text-primary"> |
|
|
<i class="fas fa-eye"></i> |
|
|
</button> |
|
|
<button onclick="registerReceipt('PC-2023-005')" class="btn-action text-purple"> |
|
|
<i class="fas fa-truck-loading"></i> |
|
|
</button> |
|
|
<button class="btn-action text-warning"> |
|
|
<i class="fas fa-print"></i> |
|
|
</button> |
|
|
</div> |
|
|
</td> |
|
|
</tr> |
|
|
</tbody> |
|
|
</table> |
|
|
</div> |
|
|
<div class="card-footer d-flex align-items-center justify-content-between"> |
|
|
<div class="text-muted"> |
|
|
Mostrando <span class="fw-bold">1</span> a <span class="fw-bold">5</span> de <span class="fw-bold">15</span> resultados |
|
|
</div> |
|
|
<div class="d-flex gap-1"> |
|
|
<button class="btn btn-gray btn-sm"> |
|
|
<i class="fas fa-chevron-left"></i> |
|
|
</button> |
|
|
<button class="btn btn-blue btn-sm">1</button> |
|
|
<button class="btn btn-gray btn-sm">2</button> |
|
|
<button class="btn btn-gray btn-sm">3</button> |
|
|
<button class="btn btn-gray btn-sm"> |
|
|
<i class="fas fa-chevron-right"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="orderModal" class="modal fade" tabindex="-1" aria-hidden="true"> |
|
|
<div class="modal-dialog modal-xl"> |
|
|
<div class="modal-content"> |
|
|
<div class="modal-header"> |
|
|
<h3 class="modal-title text-primary" id="modalOrderNumber">Pedido PC-2023-001</h3> |
|
|
<button type="button" class="btn-close" onclick="closeModal()"></button> |
|
|
</div> |
|
|
<div class="modal-body"> |
|
|
|
|
|
<div class="row g-4 mt-3"> |
|
|
<div class="col-12 col-md-4"> |
|
|
<div class="card h-100"> |
|
|
<div class="card-body"> |
|
|
<h4 class="card-title text-primary mb-3">Fornecedor</h4> |
|
|
<p id="modalSupplier">Fornecedor A</p> |
|
|
<p id="modalSupplierContact">[email protected]</p> |
|
|
<p id="modalSupplierPhone">(11) 9999-9999</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="col-12 col-md-4"> |
|
|
<div class="card h-100"> |
|
|
<div class="card-body"> |
|
|
<h4 class="card-title text-primary mb-3">Responsável</h4> |
|
|
<p id="modalResponsible">João Silva</p> |
|
|
<p id="modalDepartment">Compras</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="col-12 col-md-4"> |
|
|
<div class="card h-100"> |
|
|
<div class="card-body"> |
|
|
<h4 class="card-title text-primary mb-3">Datas</h4> |
|
|
<div class="row g-2"> |
|
|
<div class="col-6"> |
|
|
<p class="text-muted small mb-0">Emissão:</p> |
|
|
<p id="modalEmissionDate">10/05/2023</p> |
|
|
</div> |
|
|
<div class="col-6"> |
|
|
<p class="text-muted small mb-0">Previsão Entrega:</p> |
|
|
<p id="modalDeliveryDate">25/05/2023</p> |
|
|
</div> |
|
|
<div class="col-6"> |
|
|
<p class="text-muted small mb-0">Pagamento:</p> |
|
|
<p id="modalPayment">30 dias</p> |
|
|
</div> |
|
|
<div class="col-6"> |
|
|
<p class="text-muted small mb-0">Status:</p> |
|
|
<p id="modalStatus"><span class="status-badge status-recebido-total">Recebido Total</span></p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="mt-5"> |
|
|
<div class="d-flex justify-content-between align-items-center mb-4"> |
|
|
<h4 class="mb-0">Itens do Pedido</h4> |
|
|
<button id="addItemBtn" class="btn btn-blue btn-sm"> |
|
|
<i class="fas fa-plus me-1"></i> Adicionar Item |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="itemForm" class="card mb-4"> |
|
|
<div class="card-body"> |
|
|
<div class="row g-4 mb-4"> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Produto *</label> |
|
|
<select class="form-select"> |
|
|
<option>Selecione um produto</option> |
|
|
<option>Notebook Dell XPS 15</option> |
|
|
<option>Monitor 27" 4K</option> |
|
|
<option>Teclado Mecânico</option> |
|
|
</select> |
|
|
</div> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Quantidade *</label> |
|
|
<input type="number" min="1" value="1" class="form-control"> |
|
|
</div> |
|
|
</div> |
|
|
<div class="row g-4"> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Valor Unitário *</label> |
|
|
<input type="text" placeholder="R$ 0,00" class="form-control"> |
|
|
</div> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Valor Total</label> |
|
|
<input type="text" placeholder="R$ 0,00" readonly class="form-control"> |
|
|
</div> |
|
|
</div> |
|
|
<div class="d-flex justify-content-end mt-4 gap-2"> |
|
|
<button type="button" onclick="hideItemForm()" class="btn btn-gray btn-sm"> |
|
|
Cancelar |
|
|
</button> |
|
|
<button type="button" class="btn btn-green btn-sm"> |
|
|
<i class="fas fa-save me-1"></i> Salvar |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="table-responsive"> |
|
|
<table class="table"> |
|
|
<thead> |
|
|
<tr> |
|
|
<th>Produto</th> |
|
|
<th>Categoria</th> |
|
|
<th>Quantidade</th> |
|
|
<th>Unitário</th> |
|
|
<th>Total</th> |
|
|
<th>Recebido</th> |
|
|
<th>Status</th> |
|
|
<th class="text-end">Ações</th> |
|
|
</tr> |
|
|
</thead> |
|
|
<tbody> |
|
|
<tr> |
|
|
<td>Notebook Dell XPS 15</td> |
|
|
<td>Informática</td> |
|
|
<td>2</td> |
|
|
<td>R$ 4.500,00</td> |
|
|
<td>R$ 9.000,00</td> |
|
|
<td>2</td> |
|
|
<td> |
|
|
<span class="status-badge bg-success text-white">Recebido</span> |
|
|
</td> |
|
|
<td class="text-end"> |
|
|
<div class="d-flex justify-content-end gap-1"> |
|
|
<button onclick="editItem('Notebook Dell XPS 15', 2, 4500)" class="btn-action text-primary"> |
|
|
<i class="fas fa-edit"></i> |
|
|
</button> |
|
|
<button onclick="deleteItem('Notebook Dell XPS 15')" class="btn-action text-danger"> |
|
|
<i class="fas fa-trash"></i> |
|
|
</button> |
|
|
</div> |
|
|
</td> |
|
|
</tr> |
|
|
<tr> |
|
|
<td>Monitor 27" 4K</td> |
|
|
<td>Informática</td> |
|
|
<td>5</td> |
|
|
<td>R$ 1.250,00</td> |
|
|
<td>R$ 6.250,00</td> |
|
|
<td>5</td> |
|
|
<td> |
|
|
<span class="status-badge bg-success text-white">Recebido</span> |
|
|
</td> |
|
|
<td class="text-end"> |
|
|
<div class="d-flex justify-content-end gap-1"> |
|
|
<button onclick="editItem('Monitor 27\" 4K', 5, 1250)" class="btn-action text-primary"> |
|
|
<i class="fas fa-edit"></i> |
|
|
</button> |
|
|
<button onclick="deleteItem('Monitor 27\" 4K')" class="btn-action text-danger"> |
|
|
<i class="fas fa-trash"></i> |
|
|
</button> |
|
|
</div> |
|
|
</td> |
|
|
</tr> |
|
|
</tbody> |
|
|
<tfoot> |
|
|
<tr> |
|
|
<td colspan="3" class="text-end fw-bold">Total:</td> |
|
|
<td colspan="5">R$ 15.250,00</td> |
|
|
</tr> |
|
|
</tfoot> |
|
|
</table> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="mt-5"> |
|
|
<h4 class="mb-3">Observações</h4> |
|
|
<div class="card"> |
|
|
<div class="card-body"> |
|
|
<p id="modalNotes">Entregar na recepção do prédio A, das 8h às 17h. Favor embalar com cuidado os equipamentos eletrônicos.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="mt-5"> |
|
|
<div class="d-flex justify-content-between align-items-center mb-3"> |
|
|
<h4 class="mb-0">Histórico</h4> |
|
|
<button onclick="showAllHistory()" class="btn btn-link text-primary p-0"> |
|
|
Ver todos <i class="fas fa-chevron-down ms-1"></i> |
|
|
</button> |
|
|
</div> |
|
|
<div id="historyItems"> |
|
|
<div class="history-item"> |
|
|
<div class="history-icon bg-primary"> |
|
|
<i class="fas fa-check text-white"></i> |
|
|
</div> |
|
|
<div class="history-content"> |
|
|
<p class="fw-medium">Pedido recebido totalmente</p> |
|
|
<p class="history-date">25/05/2023 14:30 - Por João Silva</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="history-item"> |
|
|
<div class="history-icon bg-purple"> |
|
|
<i class="fas fa-truck text-white"></i> |
|
|
</div> |
|
|
<div class="history-content"> |
|
|
<p class="fw-medium">Pedido enviado pelo fornecedor</p> |
|
|
<p class="history-date">20/05/2023 09:15 - Por Fornecedor A</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="history-item"> |
|
|
<div class="history-icon bg-success"> |
|
|
<i class="fas fa-thumbs-up text-white"></i> |
|
|
</div> |
|
|
<div class="history-content"> |
|
|
<p class="fw-medium">Pedido aprovado</p> |
|
|
<p class="history-date">12/05/2023 16:45 - Por Maria Souza (Gerente)</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="history-item"> |
|
|
<div class="history-icon bg-warning"> |
|
|
<i class="fas fa-paper-plane text-white"></i> |
|
|
</div> |
|
|
<div class="history-content"> |
|
|
<p class="fw-medium">Pedido enviado para aprovação</p> |
|
|
<p class="history-date">10/05/2023 17:30 - Por João Silva</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="history-item"> |
|
|
<div class="history-icon bg-secondary"> |
|
|
<i class="fas fa-file-alt text-white"></i> |
|
|
</div> |
|
|
<div class="history-content"> |
|
|
<p class="fw-medium">Pedido criado</p> |
|
|
<p class="history-date">10/05/2023 14:00 - Por João Silva</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="modal-footer"> |
|
|
<button id="sendApprovalBtn" type="button" onclick="confirmSendForApproval()" class="btn btn-yellow"> |
|
|
<i class="fas fa-paper-plane me-2"></i> Enviar para Aprovação |
|
|
</button> |
|
|
<button id="registerReceiptBtn" type="button" class="btn btn-purple"> |
|
|
<i class="fas fa-truck-loading me-2"></i> Registrar Recebimento |
|
|
</button> |
|
|
<button onclick="cancelOrder('PC-2023-001')" type="button" class="btn btn-gray"> |
|
|
<i class="fas fa-times me-2"></i> Cancelar Pedido |
|
|
</button> |
|
|
<button onclick="closeModal()" type="button" class="btn btn-gray"> |
|
|
Fechar |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="editItemModal" class="modal fade" tabindex="-1" aria-hidden="true"> |
|
|
<div class="modal-dialog"> |
|
|
<div class="modal-content"> |
|
|
<div class="modal-header"> |
|
|
<h3 class="modal-title text-primary">Editar Item</h3> |
|
|
<button type="button" class="btn-close" onclick="closeEditItemModal()"></button> |
|
|
</div> |
|
|
<div class="modal-body"> |
|
|
<div class="row g-4"> |
|
|
<div class="col-12"> |
|
|
<label class="form-label">Produto</label> |
|
|
<input type="text" id="editProductName" readonly class="form-control"> |
|
|
</div> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Quantidade *</label> |
|
|
<input type="number" id="editQuantity" min="1" class="form-control"> |
|
|
</div> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Valor Unitário *</label> |
|
|
<input type="text" id="editUnitPrice" placeholder="R$ 0,00" class="form-control"> |
|
|
</div> |
|
|
<div class="col-12"> |
|
|
<label class="form-label">Valor Total</label> |
|
|
<input type="text" id="editTotalPrice" placeholder="R$ 0,00" readonly class="form-control"> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="modal-footer"> |
|
|
<button type="button" onclick="saveItemChanges()" class="btn btn-green"> |
|
|
<i class="fas fa-save me-2"></i> Salvar Alterações |
|
|
</button> |
|
|
<button type="button" onclick="closeEditItemModal()" class="btn btn-gray"> |
|
|
Cancelar |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="backdrop" class="backdrop fixed-top start-0 w-100 h-100 bg-black bg-opacity-50 z-40"></div> |
|
|
|
|
|
<div id="newOrderOffcanvas" class="offcanvas offcanvas-end" tabindex="-1"> |
|
|
<div class="offcanvas-header"> |
|
|
<h2 class="offcanvas-title text-primary">Novo Pedido de Compra</h2> |
|
|
<button type="button" class="btn-close text-reset" onclick="closeOffcanvas()"></button> |
|
|
</div> |
|
|
<div class="offcanvas-body"> |
|
|
<form> |
|
|
<div class="mb-4"> |
|
|
<label class="form-label">Fornecedor *</label> |
|
|
<select class="form-select"> |
|
|
<option>Selecione um fornecedor</option> |
|
|
<option>Fornecedor A</option> |
|
|
<option>Fornecedor B</option> |
|
|
<option>Fornecedor C</option> |
|
|
</select> |
|
|
</div> |
|
|
|
|
|
<div class="mb-4"> |
|
|
<label class="form-label">Responsável *</label> |
|
|
<select class="form-select"> |
|
|
<option>Selecione um responsável</option> |
|
|
<option>João Silva</option> |
|
|
<option>Maria Souza</option> |
|
|
<option>Carlos Oliveira</option> |
|
|
</select> |
|
|
</div> |
|
|
|
|
|
<div class="row g-3 mb-4"> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Data de Emissão *</label> |
|
|
<input type="date" class="form-control"> |
|
|
</div> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Previsão de Entrega *</label> |
|
|
<input type="date" class="form-control"> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-4"> |
|
|
<label class="form-label">Condição de Pagamento *</label> |
|
|
<select class="form-select"> |
|
|
<option>À vista</option> |
|
|
<option>7 dias</option> |
|
|
<option>15 dias</option> |
|
|
<option>30 dias</option> |
|
|
<option>60 dias</option> |
|
|
</select> |
|
|
</div> |
|
|
|
|
|
<div class="mb-4"> |
|
|
<label class="form-label">Observações</label> |
|
|
<textarea rows="3" class="form-control"></textarea> |
|
|
</div> |
|
|
|
|
|
<div class="pt-4 border-top"> |
|
|
<h3 class="mb-4">Itens do Pedido</h3> |
|
|
|
|
|
<div class="mb-4"> |
|
|
<div class="card"> |
|
|
<div class="card-body"> |
|
|
<div class="row g-3 mb-4"> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Produto *</label> |
|
|
<select class="form-select"> |
|
|
<option>Selecione um produto</option> |
|
|
<option>Notebook Dell XPS 15</option> |
|
|
<option>Monitor 27" 4K</option> |
|
|
<option>Teclado Mecânico</option> |
|
|
<option>Mouse Sem Fio</option> |
|
|
</select> |
|
|
</div> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Quantidade *</label> |
|
|
<input type="number" min="1" value="1" class="form-control"> |
|
|
</div> |
|
|
</div> |
|
|
<div class="row g-3"> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Valor Unitário *</label> |
|
|
<input type="text" placeholder="R$ 0,00" class="form-control"> |
|
|
</div> |
|
|
<div class="col-12 col-md-6"> |
|
|
<label class="form-label">Valor Total</label> |
|
|
<input type="text" placeholder="R$ 0,00" readonly class="form-control"> |
|
|
</div> |
|
|
</div> |
|
|
<div class="d-flex justify-content-end mt-4"> |
|
|
<button type="button" class="btn btn-red btn-sm"> |
|
|
<i class="fas fa-trash me-1"></i> Remover |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<button type="button" class="btn btn-gray w-100 d-flex align-items-center justify-content-center gap-2"> |
|
|
<i class="fas fa-plus"></i> Adicionar Item |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
<div class="d-flex justify-content-end gap-3 pt-5"> |
|
|
<button type="button" onclick="closeOffcanvas()" class="btn btn-gray"> |
|
|
Cancelar |
|
|
</button> |
|
|
<button type="button" class="btn btn-blue"> |
|
|
<i class="fas fa-save me-2"></i> Salvar Pedido |
|
|
</button> |
|
|
</div> |
|
|
</form> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script> |
|
|
<script> |
|
|
|
|
|
var orderModal = new bootstrap.Modal(document.getElementById('orderModal')); |
|
|
var editItemModal = new bootstrap.Modal(document.getElementById('editItemModal')); |
|
|
var newOrderOffcanvas = new bootstrap.Offcanvas(document.getElementById('newOrderOffcanvas')); |
|
|
|
|
|
|
|
|
document.getElementById('addItemBtn').addEventListener('click', function() { |
|
|
document.getElementById('itemForm').classList.add('show'); |
|
|
}); |
|
|
|
|
|
function hideItemForm() { |
|
|
document.getElementById('itemForm').classList.remove('show'); |
|
|
} |
|
|
|
|
|
|
|
|
document.getElementById('newOrderBtn').addEventListener('click', function() { |
|
|
document.getElementById('backdrop').classList.add('show'); |
|
|
newOrderOffcanvas.show(); |
|
|
}); |
|
|
|
|
|
|
|
|
function closeOffcanvas() { |
|
|
document.getElementById('backdrop').classList.remove('show'); |
|
|
newOrderOffcanvas.hide(); |
|
|
} |
|
|
|
|
|
|
|
|
function closeModal() { |
|
|
orderModal.hide(); |
|
|
} |
|
|
|
|
|
|
|
|
function viewOrder(orderNumber) { |
|
|
|
|
|
document.getElementById('modalOrderNumber').textContent = `Pedido ${orderNumber}`; |
|
|
|
|
|
|
|
|
const status = document.getElementById('modalStatus').textContent.trim(); |
|
|
const sendApprovalBtn = document.getElementById('sendApprovalBtn'); |
|
|
const registerReceiptBtn = document.getElementById('registerReceiptBtn'); |
|
|
|
|
|
sendApprovalBtn.style.display = status === 'Em Elaboração' ? 'block' : 'none'; |
|
|
registerReceiptBtn.style.display = (status === 'Em Elaboração' || status === 'Cancelado') ? 'none' : 'block'; |
|
|
|
|
|
orderModal.show(); |
|
|
} |
|
|
|
|
|
|
|
|
function showAllHistory() { |
|
|
|
|
|
Swal.fire({ |
|
|
title: 'Histórico Completo', |
|
|
html: ` |
|
|
<div class="text-left" style="max-height: 24rem; overflow-y: auto;"> |
|
|
<div class="d-flex align-items-start mb-3"> |
|
|
<div class="flex-shrink-0 bg-primary rounded-circle p-2 me-3"> |
|
|
<i class="fas fa-check text-white"></i> |
|
|
</div> |
|
|
<div> |
|
|
<p class="fw-medium mb-0">Pedido recebido totalmente</p> |
|
|
<p class="text-muted small">25/05/2023 14:30 - Por João Silva</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="d-flex align-items-start mb-3"> |
|
|
<div class="flex-shrink-0 bg-purple rounded-circle p-2 me-3"> |
|
|
<i class="fas fa-truck text-white"></i> |
|
|
</div> |
|
|
<div> |
|
|
<p class="fw-medium mb-0">Pedido enviado pelo fornecedor</p> |
|
|
<p class="text-muted small">20/05/2023 09:15 - Por Fornecedor A</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="d-flex align-items-start mb-3"> |
|
|
<div class="flex-shrink-0 bg-success rounded-circle p-2 me-3"> |
|
|
<i class="fas fa-thumbs-up text-white"></i> |
|
|
</div> |
|
|
<div> |
|
|
<p class="fw-medium mb-0">Pedido aprovado</p> |
|
|
<p class="text-muted small">12/05/2023 16:45 - Por Maria Souza (Gerente)</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="d-flex align-items-start mb-3"> |
|
|
<div class="flex-shrink-0 bg-warning rounded-circle p-2 me-3"> |
|
|
<i class="fas fa-paper-plane text-white"></i> |
|
|
</div> |
|
|
<div> |
|
|
<p class="fw-medium mb-0">Pedido enviado para aprovação</p> |
|
|
<p class="text-muted small">10/05/2023 17:30 - Por João Silva</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="d-flex align-items-start mb-3"> |
|
|
<div class="flex-shrink-0 bg-secondary rounded-circle p-2 me-3"> |
|
|
<i class="fas fa-file-alt text-white"></i> |
|
|
</div> |
|
|
<div> |
|
|
<p class="fw-medium mb-0">Pedido criado</p> |
|
|
<p class="text-muted small">10/05/2023 14:00 - Por João Silva</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="d-flex align-items-start"> |
|
|
<div class="flex-shrink-0 bg-info rounded-circle p-2 me-3"> |
|
|
<i class="fas fa-comment text-white"></i> |
|
|
</div> |
|
|
<div> |
|
|
<p class="fw-medium mb-0">Observação adicionada</p> |
|
|
<p class="text-muted small">10/05/2023 14:05 - Por João Silva</p> |
|
|
<p class="fst-italic small">"Entregar na recepção do prédio A"</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
`, |
|
|
background: '#1f2937', |
|
|
color: '#f3f4f6', |
|
|
confirmButtonColor: '#3b82f6', |
|
|
width: '600px' |
|
|
}); |
|
|
} |
|
|
|
|
|
|
|
|
function confirmSendForApproval() { |
|
|
Swal.fire({ |
|
|
title: 'Enviar para Aprovação', |
|
|
text: 'Tem certeza que deseja enviar este pedido para aprovação? Esta ação não pode ser desfeita.', |
|
|
icon: 'question', |
|
|
showCancelButton: true, |
|
|
confirmButtonColor: '#3b82f6', |
|
|
cancelButtonColor: '#6b7280', |
|
|
confirmButtonText: 'Sim, enviar!', |
|
|
cancelButtonText: 'Cancelar', |
|
|
background: '#1f2937', |
|
|
color: '#f3f4f6' |
|
|
}).then((result) => { |
|
|
if (result.isConfirmed) { |
|
|
Swal.fire({ |
|
|
title: 'Enviado!', |
|
|
text: 'O pedido foi enviado para aprovação com sucesso.', |
|
|
icon: 'success', |
|
|
background: '#1f2937', |
|
|
color: '#f3f4f6' |
|
|
}); |
|
|
} |
|
|
}); |
|
|
} |
|
|
|
|
|
|
|
|
function cancelOrder(orderNumber) { |
|
|
Swal.fire({ |
|
|
title: 'Cancelar Pedido', |
|
|
text: `Tem certeza que deseja cancelar o pedido ${orderNumber}? Esta ação não pode ser desfeita.`, |
|
|
icon: 'warning', |
|
|
showCancelButton: true, |
|
|
confirmButtonColor: '#ef4444', |
|
|
cancelButtonColor: '#6b7280', |
|
|
confirmButtonText: 'Sim, cancelar!', |
|
|
cancelButtonText: 'Não, manter', |
|
|
background: '#1f2937', |
|
|
color: '#f3f4f6' |
|
|
}).then((result) => { |
|
|
if (result.isConfirmed) { |
|
|
Swal.fire({ |
|
|
title: 'Cancelado!', |
|
|
text: `O pedido ${orderNumber} foi cancelado.`, |
|
|
icon: 'success', |
|
|
background: '#1f2937', |
|
|
color: '#f3f4f6' |
|
|
}); |
|
|
} |
|
|
}); |
|
|
} |
|
|
|
|
|
|
|
|
function registerReceipt(orderNumber) { |
|
|
Swal.fire({ |
|
|
title: 'Registrar Recebimento', |
|
|
html: ` |
|
|
<div class="text-left"> |
|
|
<div class="mb-3"> |
|
|
<label class="form-label">Tipo de Recebimento</label> |
|
|
<select id="receiptType" class="form-select"> |
|
|
<option value="partial">Parcial</option> |
|
|
<option value="total">Total</option> |
|
|
</select> |
|
|
</div> |
|
|
<div id="partialFields"> |
|
|
<div class="mb-3"> |
|
|
<label class="form-label">Quantidade Recebida</label> |
|
|
<input type="number" id="receivedQty" class="form-control"> |
|
|
</div> |
|
|
<div class="mb-3"> |
|
|
<label class="form-label">Nota Fiscal</label> |
|
|
<input type="text" id="invoiceNumber" class="form-control"> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
`, |
|
|
showCancelButton: true, |
|
|
confirmButtonText: 'Registrar', |
|
|
cancelButtonText: 'Cancelar', |
|
|
background: '#1f2937', |
|
|
color: '#f3f4f6', |
|
|
preConfirm: () => { |
|
|
const type = document.getElementById('receiptType').value; |
|
|
const qty = document.getElementById('receivedQty').value; |
|
|
const invoice = document.getElementById('invoiceNumber').value; |
|
|
|
|
|
if (type === 'partial' && (!qty || qty <= 0)) { |
|
|
Swal.showValidationMessage('Informe a quantidade recebida'); |
|
|
} |
|
|
|
|
|
return { type, qty, invoice }; |
|
|
} |
|
|
}).then((result) => { |
|
|
if (result.isConfirmed) { |
|
|
Swal.fire({ |
|
|
title: 'Sucesso!', |
|
|
text: 'Recebimento registrado com sucesso.', |
|
|
icon: 'success', |
|
|
background: '#1f2937', |
|
|
color: '#f3f4f6' |
|
|
}); |
|
|
} |
|
|
}); |
|
|
} |
|
|
|
|
|
|
|
|
function editItem(productName, quantity, unitPrice) { |
|
|
document.getElementById('editProductName').value = productName; |
|
|
document.getElementById('editQuantity').value = quantity; |
|
|
document.getElementById('editUnitPrice').value = `R$ ${unitPrice.toFixed(2).replace('.', ',')}`; |
|
|
document.getElementById('editTotalPrice').value = `R$ ${(quantity * unitPrice).toFixed(2).replace('.', ',')}`; |
|
|
|
|
|
editItemModal.show(); |
|
|
} |
|
|
|
|
|
function closeEditItemModal() { |
|
|
editItemModal.hide(); |
|
|
} |
|
|
|
|
|
function saveItemChanges() { |
|
|
const productName = document.getElementById('editProductName').value; |
|
|
const quantity = document.getElementById('editQuantity').value; |
|
|
const unitPrice = document.getElementById('editUnitPrice').value; |
|
|
|
|
|
|
|
|
Swal.fire({ |
|
|
title: 'Item Atualizado!', |
|
|
text: `O item ${productName} foi atualizado com sucesso.`, |
|
|
icon: 'success', |
|
|
background: '#1f2937', |
|
|
color: '#f3f4f6' |
|
|
}); |
|
|
|
|
|
closeEditItemModal(); |
|
|
} |
|
|
|
|
|
function deleteItem(productName) { |
|
|
Swal.fire({ |
|
|
title: 'Excluir Item', |
|
|
text: `Tem certeza que deseja excluir o item ${productName}?`, |
|
|
icon: 'warning', |
|
|
showCancelButton: true, |
|
|
confirmButtonColor: '#ef4444', |
|
|
cancelButtonColor: '#6b7280', |
|
|
confirmButtonText: 'Sim, excluir!', |
|
|
cancelButtonText: 'Cancelar', |
|
|
background: '#1f2937', |
|
|
color: '#f3f4f6' |
|
|
}).then((result) => { |
|
|
if (result.isConfirmed) { |
|
|
Swal.fire({ |
|
|
title: 'Excluído!', |
|
|
text: `O item ${productName} foi removido do pedido.`, |
|
|
icon: 'success', |
|
|
background: '#1f2937', |
|
|
color: '#f3f4f6' |
|
|
}); |
|
|
} |
|
|
}); |
|
|
} |
|
|
|
|
|
|
|
|
document.getElementById('backdrop').addEventListener('click', closeOffcanvas); |
|
|
|
|
|
|
|
|
document.getElementById('editQuantity').addEventListener('input', calculateTotal); |
|
|
document.getElementById('editUnitPrice').addEventListener('input', calculateTotal); |
|
|
|
|
|
function calculateTotal() { |
|
|
const quantity = parseFloat(document.getElementById('editQuantity').value) || 0; |
|
|
const unitPriceStr = document.getElementById('editUnitPrice').value.replace('R$ ', '').replace(',', '.'); |
|
|
const unitPrice = parseFloat(unitPriceStr) || 0; |
|
|
|
|
|
const total = quantity * unitPrice; |
|
|
document.getElementById('editTotalPrice').value = `R$ ${total.toFixed(2).replace('.', ',')}`; |
|
|
} |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=gallabs/pedido-de-compra-bootstrap532" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
