297 lines
11 KiB
HTML
297 lines
11 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>MyCo</title>
|
||
|
|
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<link rel="shortcut icon" href="favicon.png">
|
||
|
|
<!-- Bootstrap -->
|
||
|
|
<!-- Latest compiled and minified CSS -->
|
||
|
|
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
|
||
|
|
|
||
|
|
<!-- Optional theme -->
|
||
|
|
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css">
|
||
|
|
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||
|
|
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||
|
|
<!--[if lt IE 9]>
|
||
|
|
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
|
||
|
|
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
|
||
|
|
<![endif]-->
|
||
|
|
</head>
|
||
|
|
<style>
|
||
|
|
body{
|
||
|
|
margin-top: 4em;
|
||
|
|
}
|
||
|
|
|
||
|
|
#total-label {
|
||
|
|
text-align: right;
|
||
|
|
}
|
||
|
|
|
||
|
|
#total-label, #total-value {
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
|
||
|
|
.late {
|
||
|
|
color: red;
|
||
|
|
}
|
||
|
|
|
||
|
|
.hidden-part {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
#view-group h1 {
|
||
|
|
text-transform: capitalize;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<body>
|
||
|
|
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
|
||
|
|
<div class="container">
|
||
|
|
<div class="navbar-header">
|
||
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-groupe-collapse">
|
||
|
|
<span class="sr-only">Toggle navigation</span>
|
||
|
|
<span class="icon-bar"></span>
|
||
|
|
<span class="icon-bar"></span>
|
||
|
|
<span class="icon-bar"></span>
|
||
|
|
</button>
|
||
|
|
<a class="navbar-brand" href="index.html">MyCo</a>
|
||
|
|
</div>
|
||
|
|
<div class="collapse navbar-collapse" id="navbar-groupe-collapse">
|
||
|
|
<ul class="nav navbar-nav">
|
||
|
|
<li class="dropdown">
|
||
|
|
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Groupe <b class="caret"></b></a>
|
||
|
|
<ul id="group-choice" class="dropdown-menu">
|
||
|
|
<li><a class='group-choice'>Quotidien</a></li>
|
||
|
|
<li><a class='group-choice'>Noël</a></li>
|
||
|
|
<li class="divider"></li>
|
||
|
|
<li><a href="#" id='add_group' data-toggle="modal" data-target="#add_group_modal">Nouveau</a></li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li><a id='clear_local_data'>Purger les données locales</a></li>
|
||
|
|
</ul>
|
||
|
|
</div><!--/.nav-collapse -->
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="container">
|
||
|
|
|
||
|
|
<div id='view-group' class='part hidden-part'>
|
||
|
|
<h1>Noël</h1>
|
||
|
|
<form class="form-horizontal" role="form">
|
||
|
|
<div class="form-group">
|
||
|
|
<div class="input-group">
|
||
|
|
<span class="input-group-addon">Participant</span>
|
||
|
|
<select id='contributor' class="form-control">
|
||
|
|
<option value='Benjamin'>Benjamin</option>
|
||
|
|
<option value='Ludovic'>Ludovic</option>
|
||
|
|
</select>
|
||
|
|
<span class="input-group-btn">
|
||
|
|
<button type="button" class="btn btn-primary" id='edit_contributor_btn'><span class='glyphicon glyphicon-edit'></span></button>
|
||
|
|
<button type="button" class="btn btn-primary" id='del_contributor_btn'><span class='glyphicon glyphicon-trash'></span></button>
|
||
|
|
<button type="button" class="btn btn-primary" id='add_contributor_btn'><span class='glyphicon glyphicon-plus'></span></button>
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
<div class="btn-group">
|
||
|
|
<button id='add_contribution_btn' class="btn btn-primary"><span class='glyphicon glyphicon-plus'></span> Ajouter une dépence</span></button>
|
||
|
|
<button id='display_balance_btn' class="btn btn-info"><span class='glyphicon glyphicon-euro'></span> Balance</span></button>
|
||
|
|
<div class="btn-group">
|
||
|
|
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
|
||
|
|
<span class="glyphicon glyphicon-cog"></span>
|
||
|
|
</button>
|
||
|
|
<ul class="dropdown-menu">
|
||
|
|
<li><a id='remove_group_btn'><span class='glyphicon glyphicon-trash'></span> Supprimer le groupe</span></a></li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<table id='contributions' class="table">
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th>Dépence</th>
|
||
|
|
<th>Coût</th>
|
||
|
|
<th>Actions</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
<tr>
|
||
|
|
<td>Simply</td>
|
||
|
|
<td>124,56€</td>
|
||
|
|
<td>
|
||
|
|
<div class="btn-group" data-id='0'>
|
||
|
|
<button type="button" class="btn btn-default contribution_edit_btn"><span class='glyphicon glyphicon-edit'></span></button>
|
||
|
|
<button type="button" class="btn btn-default contribution_delete_btn"><span class='glyphicon glyphicon-trash'></span></button>
|
||
|
|
</div>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
<tfoot>
|
||
|
|
<tr>
|
||
|
|
<td id='total-label'>Total :</td>
|
||
|
|
<td id='total-value' colspan='2'>126,56€</td>
|
||
|
|
</tr>
|
||
|
|
</tfoot>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="modal fade" id="add_group_modal" tabindex="-1" role="dialog" aria-labelledby="addGroupModal" aria-hidden="true">
|
||
|
|
<div class="modal-dialog">
|
||
|
|
<div class="modal-content">
|
||
|
|
<div class="modal-header">
|
||
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
|
|
<h4 class="modal-title">Ajouter un groupe</h4>
|
||
|
|
</div>
|
||
|
|
<div class="modal-body">
|
||
|
|
<form class="form-horizontal" role="form">
|
||
|
|
<div class="form-group">
|
||
|
|
<div class="input-group">
|
||
|
|
<span class="input-group-addon">Nom *</span>
|
||
|
|
<input type='text' id='add_group_name' class="form-control" placeholder='Nom'/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
<div class="modal-footer">
|
||
|
|
<button type="button" class="btn btn-default" data-dismiss="modal">Annuler</button>
|
||
|
|
<button type="button" class="btn btn-primary" id='add_group_submit'>Ajouter</button>
|
||
|
|
</div>
|
||
|
|
</div><!-- /.modal-content -->
|
||
|
|
</div><!-- /.modal-dialog -->
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="modal fade" id="add_contributor_modal" tabindex="-1" role="dialog" aria-labelledby="addContributorModal" aria-hidden="true">
|
||
|
|
<div class="modal-dialog">
|
||
|
|
<div class="modal-content">
|
||
|
|
<div class="modal-header">
|
||
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
|
|
<h4 class="modal-title">Ajouter un participant</h4>
|
||
|
|
</div>
|
||
|
|
<div class="modal-body">
|
||
|
|
<form class="form-horizontal" role="form">
|
||
|
|
<input type='hidden' id='group_name' />
|
||
|
|
<div class="form-group">
|
||
|
|
<div class="input-group">
|
||
|
|
<span class="input-group-addon">Nom *</span>
|
||
|
|
<input type='text' id='add_contributor_name' class="form-control" placeholder='Nom'/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<div class="input-group">
|
||
|
|
<span class="input-group-addon">Email *</span>
|
||
|
|
<input type='text' id='add_contributor_email' class="form-control" placeholder='Email'/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
<div class="modal-footer">
|
||
|
|
<button type="button" class="btn btn-default" data-dismiss="modal">Annuler</button>
|
||
|
|
<button type="button" class="btn btn-primary" id='add_contributor_submit'>Ajouter</button>
|
||
|
|
</div>
|
||
|
|
</div><!-- /.modal-content -->
|
||
|
|
</div><!-- /.modal-dialog -->
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="modal fade" id="add_contribution_modal" tabindex="-1" role="dialog" aria-labelledby="addContributorModal" aria-hidden="true">
|
||
|
|
<div class="modal-dialog">
|
||
|
|
<div class="modal-content">
|
||
|
|
<div class="modal-header">
|
||
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
|
|
<h4 class="modal-title">Ajouter une contribution</h4>
|
||
|
|
</div>
|
||
|
|
<div class="modal-body">
|
||
|
|
<form class="form-horizontal" role="form">
|
||
|
|
<input type='hidden' id='group_name' />
|
||
|
|
<input type='hidden' id='edit_id' value='-1' />
|
||
|
|
<div class="form-group">
|
||
|
|
<div class="input-group">
|
||
|
|
<span class="input-group-addon">Participant *</span>
|
||
|
|
<select id='add_contribution_contributor_name' class="form-control"></select>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<div class="input-group">
|
||
|
|
<span class="input-group-addon">Titre *</span>
|
||
|
|
<input type='text' id='add_contribution_title' class="form-control" placeholder='Titre'/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<div class="input-group">
|
||
|
|
<span class="input-group-addon">Coût *</span>
|
||
|
|
<input type='text' id='add_contribution_cost' class="form-control" placeholder='0,00'/>
|
||
|
|
<span class="input-group-addon">€</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<div class="input-group">
|
||
|
|
<span class="input-group-addon">Date</span>
|
||
|
|
<input type='text' id='add_contribution_date' class="form-control" placeholder='JJ/MM/AAAA'/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
<div class="modal-footer">
|
||
|
|
<button type="button" class="btn btn-default" data-dismiss="modal">Annuler</button>
|
||
|
|
<button type="button" class="btn btn-primary" id='add_contribution_submit'>Ajouter</button>
|
||
|
|
</div>
|
||
|
|
</div><!-- /.modal-content -->
|
||
|
|
</div><!-- /.modal-dialog -->
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="modal fade" id="display_balance_modal" tabindex="-1" role="dialog" aria-labelledby="displayBalanceModal" aria-hidden="true">
|
||
|
|
<div class="modal-dialog">
|
||
|
|
<div class="modal-content">
|
||
|
|
<div class="modal-header">
|
||
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
|
|
<h4 class="modal-title">Balance</h4>
|
||
|
|
</div>
|
||
|
|
<div class="modal-body">
|
||
|
|
<table class="table table-striped">
|
||
|
|
<thead>
|
||
|
|
<tr><th>Participant</th><th>Participation</th></tr>
|
||
|
|
</thead>
|
||
|
|
<tbody></tbody>
|
||
|
|
<tfoot>
|
||
|
|
<tr>
|
||
|
|
<td id='total-label'>Total :</td>
|
||
|
|
<td id='total-value'></td>
|
||
|
|
</tr>
|
||
|
|
</tfoot>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
<div class="modal-footer">
|
||
|
|
<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>
|
||
|
|
</div>
|
||
|
|
</div><!-- /.modal-content -->
|
||
|
|
</div><!-- /.modal-dialog -->
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="modal fade" id="confirm_modal" tabindex="-1" role="dialog" aria-labelledby="confirmModal" aria-hidden="true">
|
||
|
|
<div class="modal-dialog">
|
||
|
|
<div class="modal-content">
|
||
|
|
<div class="modal-header">
|
||
|
|
<button type="button" class="close cancel" aria-hidden="true">×</button>
|
||
|
|
<h4 class="modal-title">Confirmation</h4>
|
||
|
|
</div>
|
||
|
|
<div class="modal-body">
|
||
|
|
<p id='question'></p>
|
||
|
|
</div>
|
||
|
|
<div class="modal-footer">
|
||
|
|
<button type="button" class="btn btn-default cancel">Annuler</button>
|
||
|
|
<button type="button" class="btn btn-primary" id='confirm_modal_submit'>Valider</button>
|
||
|
|
</div>
|
||
|
|
</div><!-- /.modal-content -->
|
||
|
|
</div><!-- /.modal-dialog -->
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
||
|
|
<script src="https://code.jquery.com/jquery.js"></script>
|
||
|
|
<!-- Latest compiled and minified JavaScript -->
|
||
|
|
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
|
||
|
|
<script src="inc/lib/moment.min.js"></script>
|
||
|
|
<script src="inc/myco_objects.js"></script>
|
||
|
|
<script src="inc/myco_confirm.js"></script>
|
||
|
|
<script src="inc/myco.js"></script>
|
||
|
|
</body>
|
||
|
|
</html>
|