budgl/views/views.html

85 lines
4.3 KiB
HTML

<html>
<head>
<title>{{.Title}}</title>
</head>
<link href="/static/css/bootstrap.min.css" rel=stylesheet>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/bootstrap.min.js"></script>
<body>
<div class="container">
<div class="row">
<div class="col-md-8">
<h1 class="text-center">Summary of Expenses</h1>
<table class="table">
<thead>
<tr>
<th>Description</th>
<th>Date</th>
<th>Payer</th>
<th>Category</th>
<th>Value</th>
<th>Operation</th>
</tr>
</thead>
<tbody>
{{range .Summary}}
<tr id="trid-{{.ExpID}}">
<td>{{.ExpDesc}}</td>
<td>{{.ExpDate}}</td>
<td>{{.PeopleName}}</td>
<td>{{.CatDesc}}</td>
<td>{{.ExpValue}}</td>
<td>
<a id="editExpense" title="Edit expense record" href="#" onclick="EditExpense({{.ExpID}}); return false;"><i class="material-icons" style="color:black">edit</i></a>
<a href="/expenses?delete-id={{.ExpID}}"><i class="material-icons" style="color:black">clear</i></a>
<a id="refreshExpense" title="Refresh expense record" href="#" onclick="RefreshExpense(); return false;"><i class="material-icons" style="color:black">refresh</i></a>
</td>
</tr>
{{end}}
</tbody>
</table>
</div>
<div class="col-md-4">
<form class="well form-forizontal" action="/expenses" method="post" id="expense">
<fieldset>
<legend>Add expense information</legend>
<div class="form-group">
<label for="desc">Description:</label>
<input name="desc" type="text" class="form-control" id="desc">
</div>
<div class="form-group">
<label for="date">Date:</label>
<input name="date" type="date" class="form-control" id="date" value="2018-01-01">
</div>
<div class="form-group">
<label for="payer">Payer:</label>
<select name="payer" class="form-control selectpicker">
{{range .People}}
<option>{{.PeopName}}</option>
{{end}}
</select>
</div>
<div class="form-group">
<label for="cat">Category:</label>
<select name="cat" class="form-control selectpicker">
{{range .Categories}}
<option>{{.CatDesc}}</option>
{{end}}
</select>
</div>
<div class="form-group">
<label for="value">Value:</label>
<input name="value" type="text" class="form-control" id="value">
</div>
<button type="submit" class="btn btn-default pull-right">Submit</button>
</fieldset>
</form>
</div>
</div>
</div>
</div>
</body>
<script src="/static/js/expense.js"></script>
</html>