calcul automatique des autres colonnes du coût global
[auf_rh_dae.git] / project / dae / templates / dae / embauche.html
1 {% extends 'base.html' %}
2
3 {% block extrahead %}
4 <script src="{{ MEDIA_URL }}js/jquery-1.5.1.min.js"
5 type="text/javascript"></script>
6
7 <style>
8 h2.section {
9 width:100%;
10 background-color: #D0E8F8;
11 text-align: center;
12 color: #5F5F5F;
13 margin: 50px 0px 26px 0px;
14 border-bottom: 3px solid #BBD8EC;
15 padding: 4px;
16 }
17 .row {padding: 10px 0px; clear: both; display:block;}
18 .row * {float: left; margin: 0px; padding: 0px; margin-right: 4px;}
19 .row li {list-style-type: none;}
20 .underline {text-decoration: underline;}
21 .clear {display: block; clear: both;}
22 .note {text-decoration: underline; font-style: italic; margin-left: 12px;}
23 .info {font-size:13px; font-style: italic;}
24 .noborder {border:none; margin:0; padding; 0}
25 tr.noborder td {border:none; padding-left: 0;}
26 .gauche { float:left; }
27 .droite { float:right; text-align:right; }
28 .clear { clear:both; width:100%; }
29 </style>
30 {% endblock %}
31
32 {% block title %}
33 Embauche
34 {% endblock %}
35
36 {% block main %}
37 <h1>Demandes d'autorisation d'engagement de personnel</h1>
38 <form action="" method="post">
39 {% if step == 'poste' %}
40 <h2 class="section">SECTION 1 - POSTE</h2>
41 <fieldset>
42 <h2>Poste visé</h2>
43
44 <table cellspacing="0">
45 {{ form.as_table }}
46 </table>
47 </fieldset>
48
49 <script type="text/javascript">
50 $('#id_poste').change(function() {
51 window.location = '{% url embauche %}/' + $(this).val();
52 });
53 </script>
54 {% else %}
55 <h2 class="section">SECTION 1 - POSTE</h2>
56 <fieldset>
57 <h2>Poste : {{ poste.nom }} ({{ poste.implantation.nom }})</h2>
58
59 </fieldset>
60
61 <h2 class="section">SECTION 2 - PERSONNEL ENGAGÉ</h2>
62 <fieldset>
63 <div>
64 <div class="gauche"><h2>Personne</h2></div>
65 <div class="droite">
66 <table class="droite">
67 <tbody>
68 <tr>
69 <th>Mobilité interne</th>
70 <td colspan="3"><input id="mobilite_interne" type="checkbox" name="mobilite_interne" /></td>
71 </tr>
72 </tbody>
73 </table>
74 </div>
75 </div>
76 <div class="clear"></div>
77 <table id="form-employe">
78 <tbody>
79 <tr>
80 <th>
81 Employé :<br />
82 {{ forms.employe.employe.errors }}
83 </th>
84 <td colspan="5">{{ forms.employe.employe }}</td>
85 </tr>
86 <tr>
87 <th>
88 {{ forms.employe.nom.label_tag }} :<br />
89 {{ forms.employe.nom.errors }}
90 </th>
91 <td>{{ forms.employe.nom }}</td>
92 <th>
93 {{ forms.employe.prenom.label_tag }} :<br />
94 {{ forms.employe.prenom.errors }}
95 </th>
96 <td>{{ forms.employe.prenom }}</td>
97 <th>
98 {{ forms.employe.genre.label_tag }} :<br />
99 {{ forms.employe.genre.errors }}
100 </th>
101 <td>{{ forms.employe.genre }}</td>
102 </tr>
103 </tbody>
104 </table>
105
106 <input type="hidden" id="poste" name="poste"
107 value="dae-{{ poste.id }}" />
108 <input type="hidden" id="implantation" name="implantation"
109 value="{{ poste.implantation_id }}" />
110 <input type="hidden" id="dossier" name="dossier"
111 value="{{ dossier.id }}" />
112 </fieldset>
113
114 <script type="text/javascript">
115 function activateEmployeDropDown() {
116 $('#id_employe').change(loadEmploye);
117 }
118
119 function loadEmploye() {
120 var employeUrl = '{% url employe %}/' + $(this).val();
121 $('#form-employe').html('<tr><td>Chargement...</td></tr>')
122 .load(employeUrl, activateEmployeDropDown);
123 var dossierUrl = '{% url dossier %}/' + $('#poste').val() +
124 '/' + $(this).val();
125 $('#form-dossier').html('<tr><td>Chargement...</td></tr>')
126 .load(dossierUrl, activateDossierDropDowns);
127 }
128 activateEmployeDropDown();
129 </script>
130
131 {% with forms.dossier as form %}
132 {% include "dae/embauche-dossier.html" %}
133 {% endwith %}
134
135 <script type="text/javascript">
136 function activateDossierDropDowns() {
137 $('#id_classement, #id_devise').change(loadSalaire);
138 }
139
140 function loadSalaire() {
141 $.getJSON('{% url salaire %}/' + $('#implantation').val() + '/' +
142 $('#id_devise').val() + '/' + $('#id_classement').val(),
143 function(data) {
144 console.log(data);
145 $('#id_salaire').val(data.salaire_devise);
146 });
147 }
148
149 activateDossierDropDowns();
150 </script>
151
152 <h2 class="section">SECTION 3 - COÛT GLOBAL</h2>
153
154 <fieldset>
155
156 {% if new %}
157 <p>
158 Vous devez enregister ce dossier avant de pouvoir détailler le
159 coût global.
160 </p>
161 {% else %}
162 <table cellspacing="0" id="global-cost">
163 {% include 'dae/embauche-remun.html' %}
164 </table>
165
166 <select id="type-remun" name="type-remun">
167 <option value="">(Ajouter une ligne)</option>
168 {% for tr in type_remun %}
169 <option value="{{ tr.id }}">{{ tr.nom }}</option>
170 {% endfor %}
171 </select>
172 {% endif %}
173
174 </fieldset>
175
176 <script type="text/javascript">
177 function round2(n) {
178 return Math.round(n * 100) / 100;
179 }
180
181 $('#global-cost input[id^="montant"]').live('keyup', function() {
182 var value = $(this).val(),
183 idParts = $(this).attr('id').split('-'),
184 name = idParts[0],
185 id = idParts[1];
186 if (name == 'montant') {
187 $('#montant_mois-' + id).val(round2(value / 12));
188 } else {
189 value = value * 12;
190 $('#montant-' + id).val(round2(value));
191 }
192 var taux = $('#taux_devise-' + id).val();
193 $('#montant_euro_mois-' + id).text(round2(value / taux / 12));
194 $('#montant_euro-' + id).text(round2(value / taux));
195 });
196 </script>
197
198 <h2 class="section">SECTION 4 - JUSTIFICATION DE LA DEMANDE (OBLIGATOIRE)</h2>
199
200 <input type="submit" name="save" value="Sauvegarder" />
201 </form>
202 <script type="text/javascript">
203 $('#type-remun').change(function() {
204 if ($(this).val() != '') {
205 $('#global-cost').html('<tr><td>Chargement...</td></tr>')
206 .load('{% url add_remun %}/' +
207 $('#dossier').val() + '/' +
208 $(this).val(), function() {
209 $('#type-remun').val('');
210 });
211 }
212 });
213 </script>
214 {% endif %}
215 {% endblock %}
216