-
+
- 
+
-
Faturamento
Carregando...
+
-
+
- 
+
-
Total de Vendas
Carregando...
+
-
-
-
-
-
-
-
+
- 
+
-
-
- Ticket médio
Carregando...
+
-
-
-
-
-
-
-
Quantidade de vendas
-Carregando...
--
Ticket médio
-Carregando...
--
Mais vendidos
- +Tempo médio na cozinha
-
-
+
+
+
+
+
+
Ranking atendente
++
1º - Atendente 1
2º - Atendente 2
+3º - Atendente 3
4º - Atendente 4
+ +Faturamento anual
-
-
-
+
+
+
-
-
-
-
-
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/gestaoRaul/templates/static/home/css/home.css b/gestaoRaul/templates/static/home/css/home.css
index 16e1b96..d90f3ce 100644
--- a/gestaoRaul/templates/static/home/css/home.css
+++ b/gestaoRaul/templates/static/home/css/home.css
@@ -1,83 +1,89 @@
-
-
.grid-container {
- display: grid;
- justify-content: center;
- justify-items: center;
- align-items: center;
- grid-template-columns: repeat(3, 2fr);
- gap: 20px;
- max-width: 1200px;
- margin: 0 auto;
- padding: 10px;
- }
+ display: grid;
+ justify-content: center;
+ justify-items: center;
+ align-items: center;
+ grid-template-columns: repeat(3, 2fr);
+ gap: 20px;
+ max-width: 1200px;
+ margin: 0 auto;
+ padding: 10px;
+}
.card {
- width: 420px;
- height: 420px;
+ width: 420px;
+ height: 420px;
+ justify-items: center;
+ background: linear-gradient(135deg, #97cefa, #457bd1);
+ border-radius: 10px;
+ box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
+ text-align: center;
+ line-height: 30px;
+ font-size: 20px;
+ font-weight: bold;
+ padding: 10px;
+ color: #333;
+ transition: transform 0.2s, box-shadow 0.2s;
+}
+
+.card:hover {
+ transform: translateY(-5px);
+ box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
+}
+
+.card-resumo {
+ display: grid;
+ grid-template-columns: 2fr 0.6fr ;
+ justify-content: space-between;
+ align-items: center;
+ width: 300px;
+ height: 130px;
+ background: linear-gradient(135deg, #1a237e, #3f51b5);
+ border-radius: 10px;
+ box-shadow: 0 4px 20px rgba(156, 156, 156, 0.2);
+ text-align: left;
+ line-height: 20px;
+ padding: 15px 30px 15px 30px;
+}
+.card-faturamento-anual {
+ justify-self: center;
+ align-items: center;
+ width: 80%;
+ max-height: 350px;
+ margin: 30px;
+ background: linear-gradient(135deg, #1a237e, #3f51b5);
+ border-radius: 10px;
+ box-shadow: 0 4px 20px rgba(156, 156, 156, 0.2);
+ text-align: left;
+ line-height: 20px;
+ padding: 15px 30px 15px 30px;
+}
+
+.card-resumo h2 {
+ font-size: 35px;
+ margin: 0px;
+ color: #fff;
+}
+
+@media screen and (max-width: 730px) {
+ .grid-container {
justify-items: center;
- background-color: #2b376e;
- border-radius: 10px;
- box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
+ display: grid;
+ width: 99%;
+ grid-template-columns: repeat(1, 1fr);
+ gap: 20px;
+ margin: 5px;
+ }
+
+ .card {
+ width: 95%;
+ background: linear-gradient(135deg, #d3ebff, #a1c4fd);
text-align: center;
line-height: 30px;
font-size: 20px;
font-weight: bold;
padding: 10px;
color: #333;
- transition: transform 0.2s;
+ transition: transform 0.2s, box-shadow 0.2s;
}
-
-.card-resumo {
- display: grid;
- grid-template-columns: 2fr 0.6fr ;
- justify-content: space-between;
- align-items: center;
- width: 300px;
- height: 130px;
- background-color: #1a237e;
- border-radius: 10px;
- box-shadow: 5px 5px 10px rgba(156, 156, 156, 0.2);
- text-align: left;
- line-height: 20px;
- /* scale: 0.9; */
- /* font-size: 20px; */
- /* font-weight: bold; */
- padding: 15px 30px 15px 30px;
- /* color: #333; */
- /* transition: transform 0.2s; */
- }
-
- .card-resumo h2 {
- /* color: #fff; */
- font-size: 35px;
- margin: 0px;
- }
-
-
-
-
- @media screen and (max-width: 730px) {
- .grid-container {
- justify-items: center;
- display: grid;
- width: 99%;
- grid-template-columns: repeat(1, 1fr);
- gap: 20px;
- margin: 5px;
- }
-
- .card {
- width: 95%;
- background-color: #2b376e;
- text-align: center;
- line-height: 30px;
- font-size: 20px;
- font-weight: bold;
- padding: 10px;
- color: #333;
- transition: transform 0.2s;
- }
-
-
- }
\ No newline at end of file
+}
diff --git a/gestaoRaul/templates/static/home/js/home.js b/gestaoRaul/templates/static/home/js/home.js
index bbffa09..214e47c 100644
--- a/gestaoRaul/templates/static/home/js/home.js
+++ b/gestaoRaul/templates/static/home/js/home.js
@@ -1,4 +1,3 @@
-
const barColors = ['rgba(252, 52, 95, 0.65)',
'rgba(253, 193, 53, 0.65)',
'rgba(54, 162, 235, 0.65)',
@@ -17,7 +16,6 @@ var chartVendas = new Chart("vendas", {
labels: [],
datasets: [{
fill: true,
- // barPercentage: 1.0,
data: [],
backgroundColor: barColors,
borderColor: barColorsBorder,
@@ -26,30 +24,28 @@ var chartVendas = new Chart("vendas", {
}]
},
options: {
-
indexAxis: 'y',
scales: {
y: {
ticks: {
display: true,
-
- // color: 'white'
- // padding: 5,
callback: function(value, index, values) {
- return chartVendas.data.labels[index].substring(0, 6); // Retorna o valor normal do label
+ return chartVendas.data.labels[index].substring(0, 6);
},
}
},
-
},
- legend: {display: false},
+ legend: {
+ display: true,
+ labels: {
+ color: 'white'
+ }
+ },
title: {
display: false,
text: "Produtos mais vendidos"
},
-
},
-
});
var chartCuisine = new Chart("cuisine", {
@@ -62,7 +58,12 @@ var chartCuisine = new Chart("cuisine", {
}]
},
options: {
- legend: {display: true},
+ legend: {
+ display: true,
+ labels: {
+ color: 'white' // Cor da legenda alterada para branca
+ }
+ },
title: {
display: true,
text: "Média (em minutos) do pedido em cada etapa."
@@ -70,8 +71,7 @@ var chartCuisine = new Chart("cuisine", {
}
});
-function faturaMensal() {
-
+// O restante do código permanece inalterado
const genericOptions = {
responsive: true,
hoverBackgroundColor: 'white',
@@ -79,11 +79,18 @@ function faturaMensal() {
hoverBorderWidth: 3,
onHover: { mode: ['dataset', 'tooltip'] },
scales: {
- x: { grid: { display: true } },
+ x: { grid: { display: true },
+ ticks: {
+ display: true,
+ color: 'white'
+ } },
y: {
min: 0,
max: 200,
- ticks: { stepSize: 50 },
+ ticks: { stepSize: 50 ,
+ display: true,
+ color: 'white'
+ },
grid: { borderDash: [5, 5] }
}
},
@@ -91,7 +98,7 @@ function faturaMensal() {
padding: {
bottom: 10,
left: 15,
- right: 25
+ right: 25,
}
},
interaction: {
@@ -100,6 +107,8 @@ function faturaMensal() {
},
plugins: {
legend: { display: true },
+ labels:{
+ color: 'white'},
tooltip: {
padding: 16,
titleFont: {
@@ -107,7 +116,7 @@ function faturaMensal() {
size: 18,
weight: 'normal'
},
- backgroundColor: 'rgba(8, 26, 81, 1)',
+ backgroundColor: 'rgba(8, 26, 81, 0.66)',
bodyColor: 'rgba(255, 255, 255, 0.7)',
bodyFont: {
family: "'Poppins', 'sans-serif'",
@@ -232,7 +241,7 @@ var faturamentoMensal = new Chart('mensal', {
});
-}
+
function getDataAtualFormatada() {