scafolding out weight entry
This commit is contained in:
parent
9e86fadd39
commit
3a9a8782a8
|
@ -34,6 +34,7 @@
|
|||
</nav>
|
||||
</header>
|
||||
<main class="layout-content">
|
||||
<!-- Side Menu -->
|
||||
<ul id="slide-out" class="sidenav">
|
||||
<li class="brown">
|
||||
<a href="#!"><i class="material-icons">home</i>Fast Calorie</a>
|
||||
|
@ -50,7 +51,7 @@
|
|||
<li>
|
||||
<div class="divider"></div>
|
||||
</li>
|
||||
<li><a href="#!"><i class="material-icons">input</i>Log Weight</a></li>
|
||||
<li><a href="#!" data-target="weightModal" class="modal-trigger"><i class="material-icons">input</i>Log Weight</a></li>
|
||||
<li>
|
||||
<div class="divider"></div>
|
||||
</li>
|
||||
|
@ -179,6 +180,32 @@
|
|||
<button class="btn red" @click="remove" idx="{this.selected.idx}">Remove Entry</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="weightModal" class="modal">
|
||||
<div class="modal-content">
|
||||
<h4>Log Weight</h4>
|
||||
<p>
|
||||
<table>
|
||||
<tr>
|
||||
<th colspan="2">
|
||||
{this.date}
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Weight</th>
|
||||
<td>
|
||||
<!-- TODO: should show last weight -->
|
||||
<input type="number" placeholder="100">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class="modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
<button class="btn red" @click="addWeight">Log Weight</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="module" src="/js/index.js"></script>
|
||||
|
|
|
@ -145,6 +145,9 @@ Litedom({
|
|||
// set focus
|
||||
document.getElementById('calories').focus();
|
||||
},
|
||||
addWeight() {
|
||||
console.log('add weight');
|
||||
},
|
||||
created() {
|
||||
// start service worker
|
||||
if ('serviceWorker' in navigator) {
|
||||
|
@ -162,10 +165,14 @@ Litedom({
|
|||
let pickers = document.querySelector('.datepicker');
|
||||
M.Datepicker.init(pickers, {});
|
||||
|
||||
// [M]aterial modal
|
||||
// [M]aterial modal - calorie detail
|
||||
let modal = document.querySelector('#detailsModal');
|
||||
M.Modal.init(modal, {});
|
||||
|
||||
// [M]aterial modal - add weight
|
||||
let weight = document.querySelector('#weightModal');
|
||||
M.Modal.init(weight, {});
|
||||
|
||||
var sidebar = document.querySelectorAll('.sidenav');
|
||||
M.Sidenav.init(sidebar, {});
|
||||
},
|
||||
|
|
Loading…
Reference in New Issue