Last active
May 4, 2019 01:20
-
-
Save renanlido/931ad5d9e32739991c1efebab64efee5 to your computer and use it in GitHub Desktop.
Codigo Fonte caixa
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html lang="pt-br"> | |
<head> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | |
<meta name="description" content=""> | |
<meta name="author" content=""> | |
<link rel="icon" href="http://localhost/projects/caixa/assets/img/favicon.ico"> | |
<title>Template de dashboard, usando Bootstrap.</title> | |
<!-- Bootstrap core CSS --> | |
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> | |
<!-- Estilos customizados para esse template --> | |
<link href="http://localhost/projects/caixa/assets/css/estilos.css" rel="stylesheet"> | |
<!-- Principal JavaScript do Bootstrap--> | |
<script src="http://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script> | |
<script>window.jQuery || document.write('<script src="http://localhost/projects/caixa/assets/js/jquery-3.3.1.min.js"><\/script>')</script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> | |
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script> | |
</head> | |
<body> | |
<nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow"> | |
<a class="navbar-brand col-sm-3 col-md-2 mr-0" href="http://localhost/projects/caixa/"> | |
<img src="http://localhost/projects/caixa/assets/img/LOGO.png" alt="Logo" height="30px"> | |
Ateliê Unhas Perfeitas | |
</a> | |
<input class="form-control form-control-dark w-100" type="text" placeholder="Search" aria-label="Search"> | |
<ul class="navbar-nav px-3"> | |
<li class="nav-item text-nowrap"> | |
<a class="nav-link" href="#">Sair</a> | |
</li> | |
</ul> | |
</nav> | |
<div class="container-fluid"> | |
<div class="row"> | |
<nav class="col-md-2 d-none d-md-block bg-light sidebar"> | |
<div class="sidebar-sticky"> | |
<ul class="nav flex-column" id="navbar"> | |
<li class="nav-item"> | |
<a class="nav-link active" href="http://localhost/projects/caixa/"> | |
<span data-feather="home"></span> | |
Dashboard <span class="sr-only">(atual)</span> | |
</a> | |
</li> | |
<li class="nav-item"> | |
<a class="nav-link" href="http://localhost/projects/caixa/lancamentos"> | |
<span data-feather="file"></span> | |
Lancamentos | |
</a> | |
</li> | |
<li class="nav-item"> | |
<a class="nav-link" href="#"> | |
<span data-feather="shopping-cart"></span> | |
Produtos | |
</a> | |
</li> | |
<li class="nav-item"> | |
<a class="nav-link" href="http://localhost/projects/caixa/cliente"> | |
<span data-feather="users"></span> | |
Clientes | |
</a> | |
</li> | |
<li class="nav-item"> | |
<a class="nav-link" href="#"> | |
<span data-feather="bar-chart-2"></span> | |
Relatórios | |
</a> | |
</li> | |
<li class="nav-item"> | |
<a class="nav-link" href="#"> | |
<span data-feather="layers"></span> | |
Integrações | |
</a> | |
</li> | |
</ul> | |
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted"> | |
<span>Relatórios salvos</span> | |
<a class="d-flex align-items-center text-muted" href="#"> | |
<span data-feather="plus-circle"></span> | |
</a> | |
</h6> | |
<ul class="nav flex-column mb-2"> | |
<li class="nav-item"> | |
<a class="nav-link" href="#"> | |
<span data-feather="file-text"></span> | |
Neste mês | |
</a> | |
</li> | |
<li class="nav-item"> | |
<a class="nav-link" href="#"> | |
<span data-feather="file-text"></span> | |
Último trimestre | |
</a> | |
</li> | |
<li class="nav-item"> | |
<a class="nav-link" href="#"> | |
<span data-feather="file-text"></span> | |
Engajamento social | |
</a> | |
</li> | |
<li class="nav-item"> | |
<a class="nav-link" href="#"> | |
<span data-feather="file-text"></span> | |
Vendas do final de ano | |
</a> | |
</li> | |
</ul> | |
</div> | |
</nav> | |
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4"> | |
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom"> | |
<h1 class="h2">Dashboard</h1> | |
<div class="btn-toolbar mb-2 mb-md-0"> | |
<div class="btn-group mr-2"> | |
<button class="btn btn-sm btn-outline-secondary">Compartilhar</button> | |
<button class="btn btn-sm btn-outline-secondary">Exportar</button> | |
</div> | |
<button class="btn btn-sm btn-outline-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> | |
<span data-feather="calendar"></span> | |
Métricas | |
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton"> | |
<a class="dropdown-item" href="#">Alguma ação</a> | |
<a class="dropdown-item" href="#">Outra ação</a> | |
<a class="dropdown-item" href="#">Alguma coisa aqui</a> | |
</div> | |
</button> | |
</div> | |
</div> | |
<canvas class="my-4 w-100" id="myChart" width="900" height="380"></canvas> | |
<h2>Título da seção</h2> | |
<div class="table-responsive"> | |
<table class="table table-striped table-sm"> | |
<thead> | |
<tr> | |
<th></th> | |
<th>Data</th> | |
<th>Plano de Contas</th> | |
<th>Conta</th> | |
<th>Descrição</th> | |
<th>Valor</th> | |
</tr> | |
</thead> | |
<tbody> | |
<tr> | |
<td>1</td> | |
<td>02/05/2019</td> | |
<td> | |
Despesas com Produtos </td> | |
<td> | |
Compra de Produtos </td> | |
<td>Compra Piubella</td> | |
<td>3.126,50</td> | |
</tr> | |
<tr> | |
<td>2</td> | |
<td>03/05/2019</td> | |
<td> | |
Despesas com Produtos </td> | |
<td> | |
Compra de Produtos </td> | |
<td>Compra Produto</td> | |
<td>123,75</td> | |
</tr> | |
</tbody> | |
</table> | |
</div> | |
</main> | |
<!--===============================--> | |
<!-- Gráficos --> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js"></script> | |
<script> | |
var ctx = document.getElementById("myChart"); | |
var myChart = new Chart(ctx, { | |
type: 'line', | |
data: { | |
labels: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], | |
datasets: [{ | |
data: [15339, 21345, 18483, 24003, 23489, 24092, 12034], | |
lineTension: 0, | |
backgroundColor: 'transparent', | |
borderColor: '#007bff', | |
borderWidth: 4, | |
pointBackgroundColor: '#007bff' | |
}] | |
}, | |
options: { | |
scales: { | |
yAxes: [{ | |
ticks: { | |
beginAtZero: false | |
} | |
}] | |
}, | |
legend: { | |
display: false, | |
} | |
} | |
}); | |
</script> | |
</div> | |
</div> | |
<!-- Ícones --> | |
<script src="https://unpkg.com/feather-icons/dist/feather.min.js"></script> | |
<script> | |
feather.replace() | |
</script> | |
<script> | |
$( '#navbar .nav-item' ).on( 'click', function () { | |
$( '#navbar .nav-item' ).find( 'a.active' ).removeClass( 'active' ); | |
$( this ).parent( 'a' ).addClass( 'active' ); | |
}); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment