reorganize portfolio folder
This commit is contained in:
115
caotek_mesavoirs/templates/portfolio/actif2_edit.pt
Normal file
115
caotek_mesavoirs/templates/portfolio/actif2_edit.pt
Normal file
@@ -0,0 +1,115 @@
|
||||
<div metal:use-macro="load: ../global_layout.pt">
|
||||
<div metal:fill-slot="content">
|
||||
|
||||
<div tal:condition="message" tal:content="message" class="alert alert-danger" />
|
||||
<br />
|
||||
<div class="row">
|
||||
<form id="actif_edit-form" class="form-horizontal" action="${url}" method="post" tal:condition="actif"
|
||||
data-fv-framework="bootstrap"
|
||||
data-fv-icon-valid="glyphicon glyphicon-ok"
|
||||
data-fv-icon-invalid="glyphicon glyphicon-remove"
|
||||
data-fv-icon-validating="glyphicon glyphicon-refresh">
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="classe">Classe</label>
|
||||
<div class="col-xs-8">
|
||||
<select class="form-control" id="classe" name="classe">
|
||||
<div tal:repeat="item allocation_list">
|
||||
<option value="${item.classe}" tal:attributes="selected actif.classe==item.classe and 'selected' or None">${item.classe}</option>
|
||||
</div>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-xs-2 control-label">Identifiant</label>
|
||||
<div class="col-xs-8">
|
||||
<input class="form-control" type="text" name="symbole"
|
||||
value="${actif.symbole}" placeholder="15 caractères maximum"
|
||||
data-fv-notempty="true"
|
||||
data-fv-notempty-message="Le symbole est obligatoire"
|
||||
data-fv-stringlength="true"
|
||||
data-fv-stringlength-max="15"
|
||||
data-fv-stringlength-message="15 caractères maximum" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-xs-2 control-label">Libellé</label>
|
||||
<div class="col-xs-8">
|
||||
<input class="form-control" type="text" name="libelle"
|
||||
value="${actif.libelle}" placeholder="45 caractères maximum"
|
||||
data-fv-notempty="true"
|
||||
data-fv-notempty-message="Le libelle est obligatoire"
|
||||
data-fv-stringlength="true"
|
||||
data-fv-stringlength-max="45"
|
||||
data-fv-stringlength-message="45 caractères maximum" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="pru">Total investi</label>
|
||||
<div class="col-xs-6">
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">K€</div>
|
||||
<input class="form-control" type="text" id="pru" name="pru" value="${actif.pru}"
|
||||
data-fv-numeric="true"
|
||||
data-fv-numeric-message="Le montant doit être composé de chiffres et/ou de ." />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="cours">Total valeur</label>
|
||||
<div class="col-xs-6">
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">K€</div>
|
||||
<input class="form-control" type="text" id="cours" name="cours" value="${actif.cours}"
|
||||
data-fv-numeric="true"
|
||||
data-fv-numeric-message="Le montant doit être composé de chiffres et/ou de ." />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="pc_rdt">% Rendement</label>
|
||||
<div class="col-xs-6">
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">%</div>
|
||||
<input class="form-control" type="text" id="rdt" name="pc_rdt" value="${actif.pc_rdt}"
|
||||
data-fv-numeric="true"
|
||||
data-fv-numeric-message="Le nombre doit être composé de chiffres et/ou de ." />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2">Dernière modif.</label>
|
||||
<div class="col-xs-8">
|
||||
<p class="form-control-static" tal:condition="actif.modif_le">${actif.modif_le.strftime('%d/%m/%Y - %H:%M')}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-xs-offset-2 col-xs-10">
|
||||
<div class="form-group">
|
||||
<a class="btn btn-default" href="${request.application_url}/portfolio">
|
||||
<span class="glyphicon glyphicon-chevron-left"></span> Retour</a>
|
||||
<button class="btn btn-primary" type="submit" name="form.submitted">
|
||||
<span class="glyphicon glyphicon-ok"></span> Enregistrer</button>
|
||||
<button class="btn btn-warning" type="submit" name="form.deleted"
|
||||
tal:condition="actif.no_id != 0">
|
||||
<span class="glyphicon glyphicon-remove"></span> Supprimer</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<br />
|
||||
<br />
|
||||
</div> <!-- row -->
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('#actif_edit-form').formValidation();
|
||||
$('form input').on('keypress', function(e) {
|
||||
return e.which !== 13;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
131
caotek_mesavoirs/templates/portfolio/actif_edit.pt
Normal file
131
caotek_mesavoirs/templates/portfolio/actif_edit.pt
Normal file
@@ -0,0 +1,131 @@
|
||||
<div metal:use-macro="load: ../global_layout.pt">
|
||||
<div metal:fill-slot="content">
|
||||
|
||||
<div tal:condition="message" tal:content="message" class="alert alert-danger" />
|
||||
<br />
|
||||
<div class="row">
|
||||
<form id="actif_edit-form" class="form-horizontal" action="${url}" method="post" tal:condition="actif"
|
||||
data-fv-framework="bootstrap"
|
||||
data-fv-icon-valid="glyphicon glyphicon-ok"
|
||||
data-fv-icon-invalid="glyphicon glyphicon-remove"
|
||||
data-fv-icon-validating="glyphicon glyphicon-refresh">
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="classe">Classe</label>
|
||||
<div class="col-xs-8">
|
||||
<select class="form-control" id="classe" name="classe">
|
||||
<div tal:repeat="item allocation_list">
|
||||
<option value="${item.classe}" tal:attributes="selected actif.classe==item.classe and 'selected' or None">${item.classe}</option>
|
||||
</div>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-xs-2 control-label">Symbole Yahoo</label>
|
||||
<div class="col-xs-8">
|
||||
<input class="form-control" type="text" name="symbole"
|
||||
value="${actif.symbole}" placeholder="15 caractères maximum"
|
||||
data-fv-notempty="true"
|
||||
data-fv-notempty-message="Le symbole est obligatoire"
|
||||
data-fv-stringlength="true"
|
||||
data-fv-stringlength-max="15"
|
||||
data-fv-stringlength-message="15 caractères maximum" />
|
||||
</div>
|
||||
<div class="col-xs-6">
|
||||
<p class="form-control-static">${actif.libelle}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="nombre">Nombre</label>
|
||||
<div class="col-xs-8">
|
||||
<input class="form-control" type="text" id="nombre" name="nombre" value="${actif.nombre}"
|
||||
data-fv-digits="true"
|
||||
data-fv-digits-message="Le nombre doit être composé que de chiffres" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="pru">PRU</label>
|
||||
<div class="col-xs-8">
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">€</div>
|
||||
<input class="form-control" type="text" id="pru" name="pru" value="${actif.pru}"
|
||||
data-fv-numeric="true"
|
||||
data-fv-numeric-message="Le nombre doit être composé de chiffres et/ou de ." />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="ter">TER</label>
|
||||
<div class="col-xs-8">
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">%</div>
|
||||
<input class="form-control" type="text" id="ter" name="ter" value="${actif.ter}"
|
||||
data-fv-numeric="true"
|
||||
data-fv-numeric-message="Le nombre doit être composé de chiffres et/ou de ." />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="pc_rdt">% Rendement</label>
|
||||
<div class="col-xs-8">
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">%</div>
|
||||
<input class="form-control" type="text" id="pc_rdt" name="pc_rdt" value="${actif.pc_rdt}"
|
||||
data-fv-numeric="true"
|
||||
data-fv-numeric-message="Le nombre doit être composé de chiffres et/ou de ." />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2">Devise</label>
|
||||
<div class="col-xs-8">
|
||||
<p class="form-control-static">${actif.devise}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-xs-2 control-label">Web site</label>
|
||||
<div class="col-xs-8">
|
||||
<input class="form-control" type="text" name="website"
|
||||
value="${actif.website}" placeholder="100 caractères maximum" />
|
||||
</div>
|
||||
<div class="col-xs-2">
|
||||
<a class="btn btn-primary" href="${actif.website}" target="_blank">Consulter</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2">Dernière modif.</label>
|
||||
<div class="col-xs-8">
|
||||
<p class="form-control-static" tal:condition="actif.modif_le">${actif.modif_le.strftime('%d/%m/%Y - %H:%M')}</p>
|
||||
</div>
|
||||
</div>
|
||||
<br />
|
||||
<div class="form-group">
|
||||
<div class="col-xs-offset-2 col-xs-10">
|
||||
<div class="form-group">
|
||||
<a class="btn btn-default" href="${request.application_url}/portfolio">
|
||||
<span class="glyphicon glyphicon-chevron-left"></span> Retour</a>
|
||||
<button class="btn btn-primary" type="submit" name="form.submitted">
|
||||
<span class="glyphicon glyphicon-ok"></span> Enregistrer</button>
|
||||
<button class="btn btn-warning" type="submit" name="form.deleted"
|
||||
tal:condition="actif.no_id != 0">
|
||||
<span class="glyphicon glyphicon-remove"></span> Supprimer</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<br />
|
||||
<br />
|
||||
</div> <!-- row -->
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('#actif_edit-form').formValidation();
|
||||
$('form input').on('keypress', function(e) {
|
||||
return e.which !== 13;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
62
caotek_mesavoirs/templates/portfolio/allocation_edit.pt
Normal file
62
caotek_mesavoirs/templates/portfolio/allocation_edit.pt
Normal file
@@ -0,0 +1,62 @@
|
||||
<div metal:use-macro="load: ../global_layout.pt">
|
||||
<div metal:fill-slot="content">
|
||||
|
||||
<div tal:condition="message" tal:content="message" class="alert alert-danger" />
|
||||
<br />
|
||||
<div class="row">
|
||||
<form id="categorie_edit-form" class="form-horizontal" action="${url}" method="post" tal:condition="allocation"
|
||||
data-fv-framework="bootstrap"
|
||||
data-fv-icon-valid="glyphicon glyphicon-ok"
|
||||
data-fv-icon-invalid="glyphicon glyphicon-remove"
|
||||
data-fv-icon-validating="glyphicon glyphicon-refresh">
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-xs-2 control-label">Classe</label>
|
||||
<div class="col-xs-8">
|
||||
<select class="form-control" id="classe" name="classe">
|
||||
<div tal:repeat="item classes_list">
|
||||
<option value="${item.classe}" tal:attributes="selected allocation.classe==item.classe and 'selected' or None">${item.classe}</option>
|
||||
</div>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="pc_cible">Pourcentage cible</label>
|
||||
<div class="col-xs-8">
|
||||
<input class="form-control" type="text" id="pc_cible" name="pc_cible" value="${allocation.pc_cible}"
|
||||
data-fv-digits="true"
|
||||
data-fv-digits-message="Le nombre doit être composé que de chiffres" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<br />
|
||||
<div class="form-group">
|
||||
<div class="col-xs-offset-2 col-xs-10">
|
||||
<div class="form-group">
|
||||
<a class="btn btn-default" href="${request.application_url}/portfolio">
|
||||
<span class="glyphicon glyphicon-chevron-left"></span> Retour</a>
|
||||
<button class="btn btn-primary" type="submit" name="form.submitted">
|
||||
<span class="glyphicon glyphicon-ok"></span> Enregistrer</button>
|
||||
<button class="btn btn-warning" type="submit" name="form.deleted"
|
||||
tal:condition="allocation.no_cat != 0">
|
||||
<span class="glyphicon glyphicon-remove"></span> Supprimer</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<br />
|
||||
<br />
|
||||
</div> <!-- row -->
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('#categorie_edit-form').formValidation();
|
||||
$('form input').on('keypress', function(e) {
|
||||
return e.which !== 13;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
67
caotek_mesavoirs/templates/portfolio/histo_edit.pt
Normal file
67
caotek_mesavoirs/templates/portfolio/histo_edit.pt
Normal file
@@ -0,0 +1,67 @@
|
||||
<div metal:use-macro="load: ../global_layout.pt">
|
||||
<div metal:fill-slot="content">
|
||||
|
||||
<div tal:condition="message" tal:content="message" class="alert alert-danger" />
|
||||
<br />
|
||||
<div class="row">
|
||||
<form id="histo_edit-form" class="form-horizontal" action="${url}" method="post" tal:condition="item"
|
||||
data-fv-framework="bootstrap"
|
||||
data-fv-icon-valid="glyphicon glyphicon-ok"
|
||||
data-fv-icon-invalid="glyphicon glyphicon-remove"
|
||||
data-fv-icon-validating="glyphicon glyphicon-refresh">
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-xs-2 control-label">Date</label>
|
||||
<div class="col-xs-2">
|
||||
<p class="form-control-static"><b>${item.date.strftime('%d-%m-%Y')}</b></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-xs-2" for="mvt_cash">Montant cash</label>
|
||||
<div class="col-xs-2">
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">€</div>
|
||||
<input class="form-control" type="text" id="mvt_cash" name="mvt_cash" value="${item.mvt_cash}"
|
||||
data-fv-numeric="true"
|
||||
data-fv-numeric-message="Le montant doit être composé de chiffres ou de ., +, -" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-xs-2 control-label">Nombre part</label>
|
||||
<div class="col-xs-2">
|
||||
<p class="form-control-static"><b>${item.nb_part}</b></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<br />
|
||||
<div class="form-group">
|
||||
<div class="col-xs-offset-2 col-xs-10">
|
||||
<div class="form-group">
|
||||
<a class="btn btn-default" href="${request.application_url}/histo_list">
|
||||
<span class="glyphicon glyphicon-chevron-left"></span> Retour</a>
|
||||
<button class="btn btn-primary" type="submit" name="form.submitted">
|
||||
<span class="glyphicon glyphicon-ok"></span> Enregistrer</button>
|
||||
<button class="btn btn-warning" type="submit" name="form.deleted"
|
||||
tal:condition="item.no_id != 0">
|
||||
<span class="glyphicon glyphicon-remove"></span> Supprimer</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<br />
|
||||
<br />
|
||||
</div> <!-- row -->
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('#histo_edit-form').formValidation();
|
||||
$('form input').on('keypress', function(e) {
|
||||
return e.which !== 13;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
58
caotek_mesavoirs/templates/portfolio/histo_list.pt
Normal file
58
caotek_mesavoirs/templates/portfolio/histo_list.pt
Normal file
@@ -0,0 +1,58 @@
|
||||
<div metal:use-macro="load: ../global_layout.pt">
|
||||
<div metal:fill-slot="content">
|
||||
|
||||
<p>
|
||||
<a href="histo_edit/0" class="btn btn-success" role="button">
|
||||
<span class="glyphicon glyphicon-plus"></span> Entrée / Sortie cash</a>
|
||||
</p>
|
||||
|
||||
<table id="histo_list" class="table table-striped table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Date</th>
|
||||
<th>E/S Cash</th>
|
||||
<th>Valeur Pf</th>
|
||||
<th>Nb Part</th>
|
||||
<th>Valeur Part</th>
|
||||
<th>Cours ref</th>
|
||||
<th>Valeur Part ref</th>
|
||||
<th>No Id</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
|
||||
<br />
|
||||
<br />
|
||||
|
||||
<script type="text/javascript">
|
||||
var dataSet = ${dt_data};
|
||||
|
||||
$(document).ready(function() {
|
||||
$.fn.dataTable.moment('DD/MM/YYYY');
|
||||
$('#histo_list').DataTable({
|
||||
data: dataSet,
|
||||
pageLength: 50,
|
||||
bLengthChange: false,
|
||||
language: {
|
||||
url: 'https://cdn.datatables.net/plug-ins/1.10.16/i18n/French.json'
|
||||
},
|
||||
columnDefs: [
|
||||
{className:"text-right", "targets": [1,2,3,4,5,6]},
|
||||
{className:"text-center", "targets": [7]},
|
||||
{ "targets": 7,
|
||||
"render": function (data, type, full, meta) {
|
||||
// ajouter un link vers le formulaire
|
||||
return '<a href="/histo_edit/' + data + '">' + data + '</a>';
|
||||
},
|
||||
},
|
||||
],
|
||||
order: [[ 0, "desc" ]]
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
</div><!-- content -->
|
||||
</div>
|
||||
|
||||
|
||||
232
caotek_mesavoirs/templates/portfolio/portfolio.pt
Normal file
232
caotek_mesavoirs/templates/portfolio/portfolio.pt
Normal file
@@ -0,0 +1,232 @@
|
||||
<div metal:use-macro="load: ../global_layout.pt">
|
||||
<div metal:fill-slot="content">
|
||||
|
||||
<div tal:condition="message" tal:content="message" class="alert alert-success" />
|
||||
|
||||
<p>
|
||||
<a href="allocation_edit/0" class="btn btn-success" role="button">
|
||||
<span class="glyphicon glyphicon-plus"></span> Nouvelle classe</a>
|
||||
</p>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<table id="categories_list" class="table table-condensed table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Classe</th>
|
||||
<th class="text-right">% cible</th>
|
||||
<th class="text-right">% actuel</th>
|
||||
<th class="text-right">Ecart</th>
|
||||
<th class="text-right">Valeur</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr tal:repeat="item items">
|
||||
<td class="${item.bg_color}">${item.classe}</td>
|
||||
<td class="text-right"><a href="allocation_edit/${item.no_cat}">${item.pc_cible} %</a></td>
|
||||
<td class="text-right">${layout.to_percent(item.pc_atteint,1)}</td>
|
||||
<td tal:condition="(item.pc_atteint - item.pc_cible)>=0" class="text-right" style="color: green;">${layout.to_percent(item.pc_atteint - item.pc_cible,1)}</td>
|
||||
<td tal:condition="(item.pc_atteint - item.pc_cible) <0" class="text-right" style="color: red;">${layout.to_percent(item.pc_atteint - item.pc_cible,1)}</td>
|
||||
<td class="text-right">${layout.to_euro(item.valeur)}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<table id="portfolio" class="table table-condensed table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Portefeuille</th>
|
||||
<th class="text-right">Montant</th>
|
||||
<th class="text-right">%</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Valorisation</td>
|
||||
<td class="text-right">${layout.to_euro(member.pf_valeur)}</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Plus value</td>
|
||||
<td class="text-right">${layout.to_euro(member.pf_plusvalue)}</td>
|
||||
<td class="text-right">${layout.to_percent(member.pf_plusvalue_pc, 1)}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Rendemant brut</td>
|
||||
<td class="text-right">${layout.to_euro(member.pf_rendement)}</td>
|
||||
<td class="text-right">${layout.to_percent(member.pf_rdt_pc, 1)}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>
|
||||
<b>Allocation globale</b> : 60% actions + 5% REITS + 35% obligations<br />
|
||||
<b>Allocation actions D</b> (1/2) : 60% US (18%) + 30% Europe (12%)<br />
|
||||
<b>Allocation actions C</b> (1/2) : 100% World (30%) <br />
|
||||
[Cette allocation est inspirée de celle du <a href="https://www.nbim.no/en/the-fund/how-we-invest/benchmark-index/">Fond souverain Norvégien</a>]
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<!-- graphique donut cible -->
|
||||
<div id="donutchart_cible" style="width: 100%; height: 500px;"></div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<!-- graphique donut actuel -->
|
||||
<div id="donutchart_actuel" style="width: 100%; height: 500px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<h3>Mes actifs</h3>
|
||||
<p>"<i>Diversification is not determined by the number of securities held.</i>"
|
||||
<a href="http://www.etf.com/sections/index-investor-corner" target="_blank">Larry Swedroe</a></p>
|
||||
|
||||
<form id="actif_list-form" action="${url}" method="post">
|
||||
<div class="form-group">
|
||||
<button id="updateButton" class="btn btn-primary" type="submit" name="form.submitted">
|
||||
<i class="glyphicon glyphicon-refresh"></i> MAJ du portefeuille</button>
|
||||
<a href="#" class="btn btn-success" role="button"
|
||||
data-toggle="modal" data-target="#choixTypeActif"><span class="glyphicon glyphicon-plus"></span> Nouvel actif</a>
|
||||
<a href="${request.application_url}/histo_list" class="btn btn-default" role="button">
|
||||
<span class="glyphicon glyphicon-stats"></span> Historique</a>
|
||||
<a href="${request.application_url}/doc_view/2" class="btn btn-default" role="button">
|
||||
<span class="glyphicon glyphicon-folder-close"></span> Mouvements</a>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<table id="actifs_list" class="table table-condensed table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Classe</th>
|
||||
<th>Libellé</th>
|
||||
<th class="text-right">Cours</th>
|
||||
<th class="text-right">Nb</th>
|
||||
<th class="text-right">Valeur</th>
|
||||
<th class="text-right">+/- Valeur</th>
|
||||
<th class="text-right">% de +/-</th>
|
||||
<th class="text-right">Rdt brut</th>
|
||||
<th class="text-right">% Rdt</th>
|
||||
<th class="text-right">% PF</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr tal:repeat="ligne actifs">
|
||||
<td class="${ligne.bg_color}">${ligne.classe}</td>
|
||||
<td tal:condition="ligne.type=='ACTION'"><a href="actif_edit/${ligne.no_id}">${ligne.libelle}</a></td>
|
||||
<td tal:condition="ligne.type!='ACTION'"><a href="actif2_edit/${ligne.no_id}">${ligne.libelle}</a></td>
|
||||
<td tal:condition="ligne.devise=='EUR'" class="text-right">${layout.to_euro(ligne.cours)}</td>
|
||||
<td tal:condition="ligne.devise=='USD'" class="text-right">${layout.to_usd(ligne.cours)}</td>
|
||||
<td class="text-right">${ligne.nombre}</td>
|
||||
<td class="text-right">${layout.to_euro(ligne.valeur)}</td>
|
||||
<td tal:condition="ligne.plus_value>=0" class="text-right" style="color: green;">${layout.to_euro(ligne.plus_value)}</td>
|
||||
<td tal:condition="ligne.plus_value <0" class="text-right" style="color: red;">${layout.to_euro(ligne.plus_value)}</td>
|
||||
<td tal:condition="ligne.pc_plusvalue>=0" class="text-right" style="color: green;">${layout.to_percent(ligne.pc_plusvalue,1)}</td>
|
||||
<td tal:condition="ligne.pc_plusvalue <0" class="text-right" style="color: red;">${layout.to_percent(ligne.pc_plusvalue,1)}</td>
|
||||
<td class="text-right">${layout.to_euro(ligne.rendement)}</td>
|
||||
<td class="text-right">${layout.to_percent(ligne.pc_rdt,1)}</td>
|
||||
<td class="text-right">${ligne.pc_allocation} %</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-right" colspan="4"><b>Total</b></td>
|
||||
<td tal:condition="total_valeur>=0" class="text-right" style="color: green;"><b>${layout.to_euro(total_valeur)}</b></td>
|
||||
<td tal:condition="total_valeur <0" class="text-right" style="color: red;"><b>${layout.to_euro(total_valeur)}</b></td>
|
||||
<td tal:condition="total_pv>=0" class="text-right" style="color: green;"><b>${layout.to_euro(total_pv)}</b></td>
|
||||
<td tal:condition="total_pv <0" class="text-right" style="color: red;"><b>${layout.to_euro(total_pv)}</b></td>
|
||||
<td class="text-right"><b>${layout.to_percent(total_pc_value, 1)}</b></td>
|
||||
<td class="text-right"><b>${layout.to_euro(total_rdt)}</b></td>
|
||||
<td></td>
|
||||
<td class="text-right"><b>100.0 %</b></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div>
|
||||
<!-- graphique evolution -->
|
||||
<div id="curve_chart" style="width: 100%; height: 500px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- MODAL POPUP : Affichage de la FAQ -->
|
||||
<div class="modal fade" id="choixTypeActif" tabindex="-1" role="dialog" aria-labelledby="choixTypeActif" aria-hidden="true">
|
||||
<div class="modal-dialog modal-sm">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span class="glyphicon glyphicon-remove"></span></button>
|
||||
<h4 class="modal-title" id="choixTypeActif">Choix du type d'actif à créer</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>
|
||||
Voulez-vous créer un actif de type <br />
|
||||
<br />
|
||||
<a href="${request.application_url}/actif_edit/0" class="btn btn-primary" role="button">
|
||||
ACTION</a> ou
|
||||
<a href="${request.application_url}/actif2_edit/0" class="btn btn-warning" role="button">
|
||||
AUTRE</a>
|
||||
<br />
|
||||
<br />
|
||||
<p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$('#updateButton').on('click', function(){
|
||||
$('i.gly-spin').removeClass('gly-spin');
|
||||
$('i').addClass('gly-spin');
|
||||
});
|
||||
</script>
|
||||
|
||||
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
|
||||
<script type="text/javascript">
|
||||
google.charts.load("current", {packages:["corechart"]});
|
||||
google.charts.setOnLoadCallback(drawChart);
|
||||
var dataSet_cible = ${donut_cible};
|
||||
var dataSet_actuel = ${donut_actuel};
|
||||
var dataSet_evoln = ${courbe_evoln};
|
||||
|
||||
function drawChart() {
|
||||
var data_cible = google.visualization.arrayToDataTable(dataSet_cible);
|
||||
var data_actuel = google.visualization.arrayToDataTable(dataSet_actuel);
|
||||
var data_evoln = google.visualization.arrayToDataTable(dataSet_evoln);
|
||||
|
||||
var options_cible = {
|
||||
title: 'Allocation cible',
|
||||
pieHole: 0.4,
|
||||
slices: {
|
||||
0: {color: 'SteelBlue'}, 1: {color: 'LightSteelBlue'},
|
||||
2: {color: 'Maroon'}, 3: {color: 'Brown'},
|
||||
5: {offset: 0.2, color: 'DarkGreen'}, 6: {offset: 0.3, color: 'Green'},
|
||||
},
|
||||
};
|
||||
var options_actuel = {
|
||||
title: 'Allocation actuelle',
|
||||
pieHole: 0.4,
|
||||
slices: {
|
||||
0: {color: 'SteelBlue'}, 1: {color: 'LightSteelBlue'},
|
||||
2: {color: 'Maroon'}, 3: {color: 'Brown'},
|
||||
5: {offset: 0.2, color: 'DarkGreen'}, 6: {offset: 0.3, color: 'Green'},
|
||||
},
|
||||
};
|
||||
var options_evoln = {
|
||||
title: 'Evolution du portefeuille VS fond Carmignac Investissement',
|
||||
curveType: 'function',
|
||||
legend: { position: 'top' }
|
||||
};
|
||||
|
||||
var chart_cible = new google.visualization.PieChart(document.getElementById('donutchart_cible'));
|
||||
chart_cible.draw(data_cible, options_cible);
|
||||
var chart_actuel = new google.visualization.PieChart(document.getElementById('donutchart_actuel'));
|
||||
chart_actuel.draw(data_actuel, options_actuel);
|
||||
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
|
||||
chart.draw(data_evoln, options_evoln);
|
||||
}
|
||||
</script>
|
||||
|
||||
</div><!-- content -->
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user