feat: create page balcao

This commit is contained in:
2024-12-21 11:43:09 -03:00
parent 59e4eb6039
commit 0ef1c0a61b
44 changed files with 657 additions and 1 deletions

View File

@@ -26,7 +26,7 @@
<li><a href="{% url 'comandas' %}">Comandas</a></li>
<li><a href="{% url 'products' %}">Produtos</a></li>
<li><a href="#">Categorias</a></li>
<li><a href="#">Sobre</a></li>
<li><a href="{% url 'viewBalcao' %}">Balcao</a></li>
</ul>
</nav>
<!-- <div class="content">

View File

@@ -0,0 +1,17 @@
{% for product in products %}
{{co}}
<article onclick="reloadPage()" style="background-color: #293552;" hx-get="{% url 'addProduct' product.id comanda_id %} " hx-trigger="click" hx-target="#list-products-comanda">
{{product.name}} <br>
R$ {{product.price}}
</article>
{% endfor %}

View File

@@ -0,0 +1,95 @@
.grid-container {
display: grid;
grid-template-columns: repeat(2, 2fr);
gap: 10px;
max-width: 1300px; /* Define a largura máxima do grid */
margin: 0 auto; /* Centraliza o grid na página */
}
.grid-list-products {
display: grid;
grid-template-columns: repeat(3, 2fr);
gap: 10px;
max-width: 800px; /* Define a largura máxima do grid */
margin: 0 auto; /* Centraliza o grid na página */
}
.card {
width: 120px;
height: 120px;
background-color: #c9ffbc;
border-radius: 15px;
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
text-align: center;
line-height: 40px; /* Centraliza o texto verticalmente */
font-size: 20px;
font-weight: bold;
color: #333;
transition: transform 0.2s;
cursor: pointer;
}
.card:hover {
transform: scale(1.05);
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3);
}
table td th {
text-align: center;
}
button {
background-color: #007BFF;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
}
button:hover {
background-color: #0056b3;
}
.modal {
display: none;
position: fixed;
padding: 20px;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0, 0, 0, 0.4);
transform: translate(-50%, -50%);
}
.modal-content {
background-color: #fefefe;
margin: 15% auto;
padding: 20px;
border: 1px solid #888;
border-radius: 10px;
width: 90%;
height: 90%;
max-width: 500px;
}
form {
display: flex;
flex-direction: column;
gap: 10px;
}
input, textarea {
width: 95%;
max-width: 95%;
padding: 8px;
margin-top: 5px;
border-radius: 5px;
border: 1px solid #ccc;
}

View File

@@ -0,0 +1,115 @@
function openModal() {
document.getElementById('Modal-add-product').style.display = 'block';
}
function open_remove_product_comanda() {
document.getElementById('remove-product-comanda').style.display = 'block';
}
function modal_payment_comanda() {
document.getElementById('payment-comanda').style.display = 'block';
}
function close_modal_payment_comanda() {
document.getElementById('payment-comanda').style.display = 'none';
}
function closeModal() {
document.getElementById('Modal-add-product').style.display = 'none';
}
function removeCloseModal() {
document.getElementById('remove-product-comanda').style.display = 'none';
}
function imprimirFichas() {
const element = document.getElementById("list-products-comanda");
const style = `<style>
td, th {
border-collapse: collapse;
padding-top: 35px;
margin: 20px;
text-align: center;
font-size: 24px;}
</style>`;
const agora = new Date();
var dateString = agora.getDay() + '/' + agora.getMonth() + '/' + agora.getFullYear() + ' - ' + agora.getHours() + ':' + agora.getMinutes()+' - Raul Rock Bar & Café';
if (element) {
var content = element.innerHTML;
// console.log(content);
content = content.replace(/<button[^>]*>(?:(?!<\/button>)[\s\S])*<\/button>/gi,'');
content = content.replace(/<th[^>]*>(?:(?!<\/th>)[\s\S])*<\/th>/gi,'');
content = content.replace(/<\/tr>/g,'</tr><tr><td colspan="2" style="font-size: 12px">'+dateString+'</td></tr>');
console.log(content);
var printWindow = window.open('', '_blank');
printWindow.document.write('<table>'+content+'</table>'+style);
printWindow.document.close();
printWindow.print();
printWindow.close();
} else {
console.error(`Element with ID not found`);
}
}
function imprimirConta() {
reloadPage();
const element = document.getElementById("list-products-comanda");
const style = `<style>
td, th {
border-collapse: collapse;
padding-top: 15px;
margin: 15px;
text-align: center;
font-size: 18px;}
</style>`;
const agora = new Date();
var dateString = agora.getDay() + '/' + agora.getMonth() + '/' + agora.getFullYear() + ' - ' + agora.getHours() + ':' + agora.getMinutes()+' - Raul Rock Bar & Café';
if (element) {
var content = element.innerHTML;
// console.log(content);
content = content.replace(/<button[^>]*>(?:(?!<\/button>)[\s\S])*<\/button>/gi,'');
content = content.replace(/<th[^>]*>(?:(?!<\/th>)[\s\S])*<\/th>/gi,'');
// content = content.replace(/<\/tr>/g,'</tr><tr><td colspan="2" style="font-size: 12px">'+dateString+'</td></tr>');
console.log(content);
var printWindow = window.open('', '_blank');
printWindow.document.write('<table>'+content+'</table>'+style);
printWindow.document.close();
printWindow.print();
printWindow.close();
} else {
console.error(`Element with ID not found`);
}
}
function reloadPage(){
setTimeout(function() {
location.reload();}, 100);
}
function backPage() {
setTimeout(function() {
history.back();}, 100);
setTimeout(function() {
location.reload();}, 100);
}
document.getElementById('openModal').addEventListener('click', openModal);
document.getElementById('productForm').addEventListener('submit', function(event) {
event.preventDefault();
});