feat: toast

This commit is contained in:
2025-02-21 21:39:08 -03:00
parent baafa4cdec
commit 8a58d0a0db
9 changed files with 158 additions and 117 deletions

View File

@@ -7,7 +7,6 @@
@keyframes jump {
0% {
transform: scale(0.0);
/* transform: translate(#000000); */
}
70% {
transform: scale(1);
@@ -295,8 +294,31 @@ input, textarea, select {
transform: translateY(-10px);
}
/* .dropdown:hover .dropbtn {background-color: #3e8e41;} */
.toast {
position: fixed;
top: 40px;
left: 50%;
transform: translateX(-50%);
background-color: #599100;
color: #000000;
font-weight: bold;
padding: 15px;
border-radius: 10px;
opacity: 0;
visibility: hidden;
transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;
z-index: 200 !important;
}
.toast p {
color: #000000;
}
.toast.show {
opacity: 1;
visibility: visible;
}
@media screen and (max-width: 730px) {
.dropdown-content {

View File

@@ -14,9 +14,31 @@ var elem = document.getElementById("all");
function openFullscreen() {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) { /* Safari */
} else if (elem.webkitRequestFullscreen) {
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE11 */
} else if (elem.msRequestFullscreen) {
elem.msRequestFullscreen();
}
}
function showToast(message, type ,duration = 3000) {
const toast = document.getElementById('toast');
if (type === 'success') {
toast.style.backgroundColor = '#28a745';
} else if (type === 'error') {
toast.style.backgroundColor = '#dc3545';
} else if (type === 'info') {
toast.style.backgroundColor = '#ffc107';
}
const toastMessage = document.getElementById('toast-message');
toastMessage.textContent = message;
toast.classList.add('show');
setTimeout(() => {
toast.classList.remove('show');
}, duration);
}

View File

@@ -6,14 +6,16 @@
margin: 0 auto;
}
body {
z-index: 0;
}
.grid-list-products {
justify-items: center;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 8px;
max-width: 800px;
/* margin: 0 auto; */
}
.card-product {
@@ -27,12 +29,12 @@
background: var(--main-gradient);
box-shadow: 3px 3px 10px rgba(2, 2, 2, 0.678);
border-radius: 5px;
transition: transform 0.4s, box-shadow 0.4s;
}
.card-product:hover {
transform: scale(1.05);
transition: transform 0.4s;
transition: transform 0.4s, box-shadow 0.4s;
box-shadow: 0px 0px 10px rgba(86, 187, 255, 0.815);
}
@@ -40,15 +42,25 @@
text-align: center;
}
.close {
height: 45px;
transition: transform 0.4s;
}
.close:hover {
transform: scale(1.2);
transition: transform 0.4s;
filter: drop-shadow(0px 0px 8px rgba(255, 1, 1, 0.452));
}
.popover{
position: relative;
width: 98%;
height: 98%;
height: 96%;
max-width: 800px;
top: 20px;
left: 25%;
padding: 20px;
/* background-color: #f2f2f29d; */
background-color: #1f1f1fb6;
border-radius: 15px;
border: none;
box-shadow: 0px 0px 8px rgba(143, 143, 143, 0.2);
@@ -56,20 +68,19 @@
line-height: 50px;
font-size: 18px;
font-weight: bold;
z-index: 1;
/* color: #333; */
transition: transform 0.2s;
transition: transform 0.4s;
animation: jump 0.5s;
}
.popover::backdrop {
background-color: rgba(0, 0, 0, 0.315);
background-color: rgba(39, 39, 39, 0.315);
backdrop-filter: blur(5px);
/* animation: jump 0.2s; */
}
@media screen and (max-width: 730px) {
.popover{
@@ -78,7 +89,6 @@
max-width: 800px;
top: 20px;
left: 10px;
}
.card-product {
@@ -89,6 +99,5 @@
background: var(--main-gradient);
box-shadow: 3px 3px 10px rgba(2, 2, 2, 0.678);
font-size: 14px;
}
}

View File

@@ -91,7 +91,6 @@ function imprimirFichas() {
if (element) {
var content = element.innerHTML;
// console.log(content);
content = content.replace( /<img[^>]*>/gi,'');
content = content.replace(/<tfoot[^>]*>(?:(?!<\/tfoot>)[\s\S])*<\/tfoot>/gi,'');
@@ -128,7 +127,6 @@ function imprimirConta() {
if (element) {
var content = element.innerHTML;
// console.log(content);
content = content.replace(/<img[^>]*>/gi,'');
content = content.replace(/<th[^>]*>(?:(?!<\/th>)[\s\S])*<\/th>/gi,'');
// content = content.replace('icons','');
@@ -180,20 +178,6 @@ function troco(){
}
// document.onkeydown = teclado
// function teclado(event){
// if (document.getElementById('payment-comanda').style.display == 'block'){
// if (event.keyCode == 13){
// troco()
// }else{
// console.log(event.keyCode)
// }
// }else{
// console.log('')
// }
// }
function addOrder(){
obs = document.getElementById('obs').value
var id = document.getElementById('id-temp').value
@@ -206,9 +190,9 @@ function addOrder(){
.then(function(response) {
if(response.status == 200){
closeModalObs()
alert('Pedido atualizado com sucesso!')
showToast('Pedido atualizado com sucesso!😁','success')
}else{
alert('Erro ao atualizar pedido!')
showToast('❌Ocorreu um erro!😢','error')
}
})
@@ -232,23 +216,13 @@ function addProductComanda(productId,comandaId, cuisine) {
.then(function(response) {
return response.text();
}).then(function(text) {
console.log(text);
var listProductsBalcaoElement = document.getElementById("list-products-comanda");
listProductsBalcaoElement.innerHTML = text;
})
// const receber = document.getElementById('pagarComanda')
// const imprimir = document.getElementById('imprimirFichas')
// var search = document.getElementById('search-product')
// setTimeout(function() {
// updateTotal();}, 100);
alert('Produto adicionado com sucesso!');
showToast('Produto adicionado com sucesso!😁','success');
}
}
function taxa(){

View File

@@ -0,0 +1,7 @@
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="SVGRepo_bgCarrier" stroke-width="0"/>

After

Width:  |  Height:  |  Size: 641 B