mirror of
https://github.com/welton89/RRBEC.git
synced 2026-04-05 13:35:42 +00:00
106 lines
2.5 KiB
HTML
106 lines
2.5 KiB
HTML
{% extends "base.html" %}
|
|
{% load static %}
|
|
|
|
|
|
|
|
|
|
{% block 'head' %}
|
|
<link rel="stylesheet" href="{% static 'home/css/home.css' %}">
|
|
|
|
|
|
{% endblock %}
|
|
|
|
{% block 'title' %}
|
|
RRB&C - DashBoard
|
|
{% endblock %}
|
|
|
|
{% block 'body' %}
|
|
|
|
<body>
|
|
|
|
<div class="grid-container">
|
|
<h1>DashBoard</h1>
|
|
<div class="grid-container" style="grid-template-columns: repeat(2, 2fr);">
|
|
<input id="data-start" name="data-start" oninput="mediaCuisine()" type="date">
|
|
<input id="data-end" name="data-end" oninput="mediaCuisine()" type="date">
|
|
</div>
|
|
<h4 id="30-days"></h4>
|
|
</div>
|
|
|
|
|
|
<div class="grid-container">
|
|
|
|
<div class="card-resumo">
|
|
<div >
|
|
<p> Faturamento </p>
|
|
<h2 id="total-pagamentos">Carregando... </h2>
|
|
</div>
|
|
<img src="{% static 'midia/icons/money-bag.svg' %}" >
|
|
</div>
|
|
|
|
<div class="card-resumo">
|
|
<div >
|
|
<p>Total de Vendas</p>
|
|
<h2 id="qtd-pagamentos">Carregando... </h2>
|
|
</div>
|
|
<img src="{% static 'midia/icons/cart.svg' %}" >
|
|
</div>
|
|
|
|
<div class="card-resumo">
|
|
<div >
|
|
<p>Ticket médio</p>
|
|
<h2 id="ticket-medio">Carregando... </h2>
|
|
</div>
|
|
<img src="{% static 'midia/icons/ticket.svg' %}" >
|
|
</div>
|
|
|
|
|
|
<div class="card">
|
|
|
|
<hr>
|
|
<h4> Quantidade de vendas</h4>
|
|
<h5 id="qtd-pagamentos"> Carregando... </h5>
|
|
<hr>
|
|
<h4> Ticket médio </h4>
|
|
<h5 id="ticket-medio">Carregando...</h5>
|
|
<hr>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h4> Gráfico de vendas </h4>
|
|
<canvas id="vendas" style="width:100%;height: 85%;max-width:100%; background-color: rgb(191, 225, 255);border-radius: 5px;">
|
|
</canvas>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h4> Gráfico cozinha </h4>
|
|
<div style="
|
|
width:95%;
|
|
max-width:100%;
|
|
background-color: rgb(191, 225, 255);
|
|
border-radius: 5px;
|
|
padding: 10px 30px 10px 30px;">
|
|
<canvas id="cuisine" style="width:80%;height: 65%;max-width:100%; border-radius: 5px;">
|
|
</canvas>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
<h4>Faturamento anual</h4>
|
|
<div style="height: 350px;margin: 30px;">
|
|
<canvas id="mensal" style="width:100%;height: 100%;max-width:100%; background-color: rgb(191, 225, 255);border-radius: 5px;">
|
|
</div>
|
|
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.js"></script> -->
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.6.0/chart.min.js"></script>
|
|
|
|
<script src="{% static 'home/js/home.js' %}"></script>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
{% endblock %} |