project/dae/templates/dae/embauche.html

   1 {% extends 'base.html' %}
   2
   3 {% block title %}RH - DAE - Embauche{% endblock %}
   4 {% block titre %}Ressources humaines{% endblock %}
   5 {% block sous_titre %}Demande d'autorisation d'embauche{% endblock %}
   6
   7 {% block extrahead %}
   8   <script src="{{ MEDIA_URL }}js/jquery-1.5.1.min.js"
   9           type="text/javascript"></script>
  10
  11   <style>
  12     h2.section {
  13         width:100%;
  14         background-color: #D0E8F8;
  15         text-align: center;
  16         color: #5F5F5F;
  17         margin: 50px 0px 26px 0px;
  18         border-bottom: 3px solid #BBD8EC;
  19         padding: 4px;
  20         }
  21     .row {padding: 10px 0px; clear: both; display:block;}
  22     .row * {float: left; margin: 0px; padding: 0px; margin-right: 4px;}
  23     .row li {list-style-type: none;}
  24     .underline {text-decoration: underline;}
  25     .clear {display: block; clear: both;}
  26     .note {text-decoration: underline; font-style: italic; margin-left: 12px;}
  27     .info {font-size:13px;  font-style: italic;}
  28     .noborder {border:none; margin:0; padding; 0}
  29     tr.noborder td {border:none; padding-left: 0;}
  30     .gauche { float:left; }
  31     .droite { float:right; text-align:right; }
  32     .clear { clear:both; width:100%; }
  33   </style>
  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       <fieldset>
 136           <h2>Pièces jointes</h2>
 137           <p class="info">CV, lettre de motivation...</p>
 138           {% include "dae/pieces.html" %}
 139       </fieldset>
 140
 141       <script type="text/javascript">
 142         function activateDossierDropDowns() {
 143             $('#id_classement, #id_devise').change(loadSalaire);
 144         }
 145
 146         function loadSalaire() {
 147             $.getJSON('{% url salaire %}/' + $('#implantation').val() + '/' +
 148                       $('#id_devise').val() + '/' + $('#id_classement').val(),
 149               function(data) {
 150                 console.log(data);
 151                 $('#id_salaire').val(data.salaire_devise);
 152               });
 153         }
 154
 155         activateDossierDropDowns();
 156       </script>
 157
 158       <h2 class="section">SECTION 3 - COÛT GLOBAL</h2>
 159
 160       <fieldset>
 161
 162         {% if new %}
 163           <p>
 164             Vous devez enregister ce dossier avant de pouvoir détailler le
 165             coût global.
 166           </p>
 167         {% else %}
 168           <table cellspacing="0" id="global-cost">
 169             {% include 'dae/embauche-remun.html' %}
 170           </table>
 171
 172           <select id="type-remun" name="type-remun">
 173             <option value="">(Ajouter une ligne)</option>
 174             {% for tr in type_remun %}
 175               <option value="{{ tr.id }}">{{ tr.nom }}</option>
 176             {% endfor %}
 177           </select>
 178         {% endif %}
 179
 180       </fieldset>
 181
 182       <script type="text/javascript">
 183         function round2(n) {
 184             return Math.round(n * 100) / 100;
 185         }
 186
 187         $('#global-cost input[id^="montant"]').live('keyup', function() {
 188             var value = $(this).val(),
 189                 idParts = $(this).attr('id').split('-'),
 190                 name = idParts[0],
 191                 id = idParts[1];
 192             if (name == 'montant') {
 193                 $('#montant_mois-' + id).val(round2(value / 12));
 194             } else {
 195                 value = value * 12;
 196                 $('#montant-' + id).val(round2(value));
 197             }
 198             var taux = $('#taux_devise-' + id).val();
 199             $('#montant_euro_mois-' + id).text(round2(value / taux / 12));
 200             $('#montant_euro-' + id).text(round2(value / taux));
 201         });
 202       </script>
 203
 204       <h2 class="section">SECTION 4 - JUSTIFICATION DE LA DEMANDE (OBLIGATOIRE)</h2>
 205
 206       <input type="submit" name="save" value="Sauvegarder" />
 207     </form>
 208     <script type="text/javascript">
 209         $('#type-remun').change(function() {
 210             if ($(this).val() != '') {
 211                 $('#global-cost').html('<tr><td>Chargement...</td></tr>')
 212                                  .load('{% url add_remun %}/' +
 213                                        $('#dossier').val() + '/' +
 214                                        $(this).val(), function() {
 215                     $('#type-remun').val('');
 216                 });
 217             }
 218         });
 219     </script>
 220   {% endif %}
 221 {% endblock %}
 222