Skip to content
This repository has been archived by the owner on Sep 27, 2019. It is now read-only.

Commit

Permalink
Fix issues 7 e 8 - Refatoração
Browse files Browse the repository at this point in the history 
Issue #7:
* Adicionado dois selects para filtrar o mes e ano que trará os dados;
* Adicionada a Lib MomentJS para trabalhar com datas;
* Adicionada a Lib Pikaday, para auxiliar no datepicker;

Issue #8:
* Adicionado a função de cadastro em um Modal;
* Refatorado a estrutura do html;
  • Loading branch information
@raulfdm
raulfdm committed Oct 19, 2016
1 parent fc3e903 commit e29cbd5
Showing 1 changed file with 79 additions and 72 deletions.
151 changes: 79 additions & 72 deletions src/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,105 +8,112 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="css/materialize.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.4.0/css/pikaday.min.css">
<link rel="stylesheet" href="css/index.css">
</head>

<body>
<!--NAV-->

<!--NAV-->
<div id="navView"></div>
<!--FIM-NAV-->
<!--FIM-NAV-->

<!--PRINCIPAL-->
<!--PRINCIPAL-->
<main class="container">
<h1 class="center-align">Controle de Ponto</h1>
<div class="row">
<div class="col s1 push-s4">
<button class="btn red darken-1 waves-effect waves-light btn-exclui">
<i class="material-icons center">delete</i>
</button>
</div>
<div class="col s1 push-s5">
<button class="btn light-blue darken-1 waves-effect waves-light btn-carregar">
<i class="material-icons center">loop</i>
</button>
</div>
</div>
<div class="row">

<form action="#" class="card col s4 form-cad-ponto">
<div class="row">
<h5 class="center-align">Cadastro</h5>
</div>
<div class="row">
<div class="col s6">
<h1 class="titulo-aplicacao center-align">Controle de Ponto</h1>

<!--MODAL-REGISTRA-PONTO-->
<div id="modal-registro" class="modal modal-fixed-footer">
<h5 class="center-align">Registro de Ponto</h5>
<div class="modal-container">
<form action="#" class="modal-content form-cadastro-ponto">
<div class="input-field">
<label for="">Data</label>
<input id="data_cadastro" name="data_cadastro" class="datepicker" type="date" required value="2016-05-05">
</div>
<div class=" col s6">
<label for="horaTrabalhada">Qtde. Horas Diárias</label>
<input class="hora-trabalhada" id="horaTrabalhada" name="horaTrabalhada" type="text" placeholder="08:00" required value="08:00">
</div>
</div>
<div class="row">
<div class="input-field col s6">
<label for="hora1">Hora1</label>
<input class="input-hora" id="hora1" name="hora1" type="text" placeholder="08:00" required value="08:00">
</div>
<div class="input-field col s6">
<label for="hora2">Hora2</label>
<input class="input-hora" id="hora2" name="hora2" type="text" placeholder="12:00" value="12:00">
</div>
</div>
<div class="row">
<div class="input-field col s6">
<label for="hora3">Hora3</label>
<input class="input-hora" id="hora3" name="hora3" type="text" placeholder="08:00" value="14:00">
</div>
<div class="input-field col s6">
<label for="hora4">Hora4</label>
<input class="input-hora" id="hora4" name="hora4" type="text" placeholder="08:00" value="15:56">
<input id="data_registro" name="data_registro" type="text" readonly required>
</div>
</div>
<div class="row">
<div class="input-field col s6">
<label for="hora5">Hora5</label>
<input class="input-hora" id="hora5" name="hora5" type="text" placeholder="13:00" disabled>
</div>
<div class="input-field col s6">
<label for="hora6">Hora6</label>
<input class="input-hora" id="hora6" name="hora6" type="text" placeholder="18:00" disabled>
<div class="input-field">
<label for="hora_registro">Horário</label>
<input class="input-hora" id="hora_registro" name="hora_registro" type="number" placeholder="08:00" required value="08:00">
</div>
</div>
<div class="row">
</form>
<div class="modal-footer">
<button class="light-blue darken-4 col s12 btn waves-effect waves-light center" type="submit" name="action">
Gravar <i class="material-icons center">done</i></button>
<!--<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Agree</a>-->
</div>
</form>
<!--FIM-PRINCIPAL-->
</div>
</div>
<!--FIM-MODAL-REGISTRA-PONTO-->

<!--LISTA-PONTOS-->
<div id="pontosView"></div>
<!--FIM-LISTA-PONTOS-->
<!--LISTA-PONTOS-->
<div class="component-pesquisa-pontos">
<form class="form-busca-pontos">
<select class="browser-default" required>
<option value="" disabled selected>Mês</option>
<option value="0">Janeiro</option>
<option value="1">Fevereiro</option>
<option value="2">Março</option>
<option value="3">Abril</option>
<option value="4">Maio</option>
<option value="5">Junho</option>
<option value="6">Julho</option>
<option value="7">Agosto</option>
<option value="8">Setembro</option>
<option value="9">Outubro</option>
<option value="10">Novembro</option>
<option value="11">Dezembro</option>
</select>
<select class="browser-default" required>
<option value="" disabled selected>Ano</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
</select>
<button type="submit" class="btn light-blue darken-1 waves-effect waves-light btn-carregar">
<i class="material-icons center">loop</i>
</button>

<a class="btn red darken-1 waves-effect waves-light btn-exclui">
<i class="material-icons center">delete</i>
</a>
</form>
<div id="pontosView"></div>
</div>

<!--MODAL-DELETE-->
<!--FIM-LISTA-PONTOS-->

<!--MODAL-DELETE-->
<div id="modalDeleteView"></div>
<!--FIM-MODAL-DELETE-->
</main>
<!--FIM-MODAL-DELETE-->

<!--BOTÃO-TRIGGER-REGISTRAR-PONTO-->
<div class="fixed-action-btn btn-modal-registro">
<a data-target="modal-registro" class="btn-floating btn-large waves-effect waves-light red modal-trigger"><i class="material-icons">add</i></a>
</div>
<!--FIM-BOTÃO-TRIGGER-REGISTRAR-PONTO-->
</main>

<!--SCRIPTS-->
<script src="https://www.gstatic.com/firebasejs/3.3.2/firebase.js"></script>
<script src="js/lib/jquery.min.js"></script>
<script src="js/lib/materialize.min.js"></script>
<script src="js/lib/system.js"></script>
<script src="js/lib/system.min.js"></script>
<script src="js/lib/moment.min.js"></script>
<script src="js/lib/pickaday-1.4.min.js"></script>
<script src="https://cdn.jsdelivr.net/lodash/4.16.4/lodash.min.js"></script>
<script>
System.defaultJSExtensions = true; //permite a omissão de extensão
System.defaultJSExtensions = true; //permite a omissão de extensão
System.config({
meta: {
'moment': {
format: 'global'
}
}
});
System.import('js/app/boot').catch(function(err) {
console.log(err);
});
</script>


<!--FIM-SCRIPTS-->

</body>

Expand Down

0 comments on commit e29cbd5

Please sign in to comment.