Project

General

Profile

Download (10.3 KB) Statistics
| Branch: | Tag: | Revision:

calebasse / calebasse / agenda / templates / agenda / index.html @ 27a7d79c

1
{% extends "calebasse/base.html" %}
2
{% load url from future %}
3
{% block extrascripts %}
4
    <script>
5
      function replace_anchor(url, anchor) {
6
        var splitted = url.split('#');
7
        return splitted[0] + '#' + encodeURI(anchor);
8
      }
9
      function extract_anchor() {
10
        if (window.location.href.indexOf('#') == -1) {
11
          return "";
12
        }
13
        var splitted = window.location.href.split('#');
14
        return decodeURI(splitted[1]).split(',');
15
      }
16
      function make_anchor() {
17
        return $.makeArray($('.person-item.active').map(function (v, i) { return '_' + $(i).attr('id'); })).join(',');
18
      }
19
      function toggle_worker(worker_selector) {
20
        $(worker_selector).toggleClass('active');
21
        // update the anchor
22
        var anchor = make_anchor();
23
        var new_uri = replace_anchor(window.location.href, anchor);
24
        console.log(new_uri);
25
        window.location.href = new_uri;
26
        $('a[href^="../"]').each(function (i, a) {
27
          $(a).attr('href', replace_anchor($(a).attr('href'), anchor));
28
        });
29

    
30
        var $target = $($(worker_selector).data('target'));
31
        $target.toggle();
32
        // var selected = $('#tabs').tabs('option', 'selected');
33
        // var length = $('#tabs').tabs('length');
34
        // alert($('.tabs').index($target.filter('.tabs')));
35
        if ($target.is(':visible')) {
36
          //$target.click();
37
        }
38
      }
39
  $(function() {
40
    $('#tabs').tabs();
41

    
42
    $('div.agenda > div').accordion({active: false, autoHeight: false});
43

    
44
    $('.person-item').on('click', function() {
45
      toggle_worker(this);
46
    });
47
    // select all anchors
48
    $.each(extract_anchor(), function (i, anchor) {
49
      $('#'+anchor.substr(1)).each(function (i, worker_selector) { toggle_worker(worker_selector); });
50
    });
51

    
52
    /* Gestion du filtre sur les utilisateurs */
53
		$('#filtre input').keyup(function() {
54
			var filtre = $(this).val();
55
      if (filtre) {
56
        $('#users li').each(function() {
57
          if ($(this).text().match(filtre)) {
58
            $(this).show();
59
          } else {
60
            $(this).hide();
61
          }
62
        });
63
      } else {
64
        $('#users li').show();
65
      }
66

    
67
		});
68
    $('#agenda-date').datepicker({
69
      dateFormat: "DD d MM yy",
70
      onClose: function(dateText, inst) {
71
        console.log('close');
72
      }
73
    });
74
    $('#agenda-date').on('change', function () {
75
      window.location.href=replace_anchor('../' + $(this).datepicker('getDate').toISOString().substr(0,10), make_anchor());
76
    });
77
		$('.date').datepicker({showOn: 'button'});
78
		$('#add-intervenant-btn').click(function() {
79
			var text = $(this).prev().val();
80
			$('#intervenants ul').append('<li><input type="checkbox" value="' + text + '" checked="checked">' + text + '</input></li>');
81
			$(this).prev().val('').focus();
82
			return false;
83
		});
84
		$('#newrdv').click(function() {
85
			$('#rdv').dialog({title: 'Nouveau rendez-vous',
86
				  width: '800px',
87
				  buttons: [ { text: "Fermer",
88
					       click: function() { $(this).dialog("close"); } },
89
					     { text: "Ajouter",
90
					       click: function() { $("#rdv form").submit(); } }]}
91
			);
92
			});
93
	});
94
	</script>
95
  <style>
96
    .person-item span { display: none; }
97
    .person-item.active span { display: inline; }
98
    #agenda-date { width: 20em; }
99
  </style>
100
{% endblock %}
101

    
102
{% block title %}{{ block.super }} - Agenda {% endblock %}
103

    
104
{% block header %}
105
  {{ block.super }}
106
  <span>Agenda - {{ service_name }}</spam>
107
{% endblock %}
108

    
109
{% block appbar %}
110
    <h2>Agenda</h2>
111
    <a href="accueil.html">Retourner à l'accueil</a>
112
    <button>Nouvel événement (autre)</button>
113
    <button id="newrdv">Nouveau rendez-vous patient</button>
114
{% endblock %}
115

    
116
{% block beforecontent %}
117
    <div id="extra-top-links">
118
     <a href="activite-du-service">Activité du service</a>
119
120
     <a href="validation-des-actes">Validation des actes</a>
121
122
     <a href="rendez-vous-periodiques">Rendez-vous périodiques</a>
123
    </div>
124

    
125

    
126
    <div id="users">
127
    <div id="filtre">
128
     <input type="text"/>
129
    </div>
130
    <dl>
131
     {% for workers_type in workers_types %}
132
     <dt>{{ workers_type.type }}</dt>
133
     <dd><ul>
134
       {% for worker in workers_type.workers %}
135
       <li id="selector-worker-{{worker.id}}" class="person-item" data-target=".worker-{{worker.id}}.agenda">{{ worker.display_name }} <span title="cliquer pour déselectionner">(-)</span></li>
136
       {% endfor %}
137
     </ul></dd>
138
     {% endfor %}
139
   </dl>
140
 </div>
141
{% endblock %}
142

    
143
{% block content %}
144
<div class="content">
145
   <div id="datesel">
146
     <a href="../{{ previous_month|date:"SHORT_DATE_FORMAT"}}">««</a>
147
     <a href="../{{ previous_day|date:"SHORT_DATE_FORMAT"}}">«</a>
148
   <!-- <span>Jeudi 5 juillet 2012</span> -->
149
   <input id="agenda-date" value="{{ date|date:"DATE_FORMAT" }}"/>
150
   <a href="../{{ next_day|date:"SHORT_DATE_FORMAT"}}">»</a>
151
   <a href="../{{ next_month|date:"SHORT_DATE_FORMAT"}}">»»</a>
152
   </div>
153

    
154
   <table>
155
    <tbody>
156
    <tr>
157
     <td id="dispos">
158
      Disponibilités
159
      <table>
160
        {% for start_time, quaters in disponibility.items %}
161
          <tr class="hour-mark">
162
              <td rowspan="4">{{ start_time }}:00</td>
163
              {% for quater in quaters|slice:":1" %}
164
                {% for value in quater %}
165
                <td class="worker-{{ value.id }} agenda {{ value.dispo }}" style="display: none; "></td>
166
                {% endfor %}
167
              {% endfor %}
168
          </tr>
169
          {% for quater in quaters|slice:"1:4" %}
170
            <tr>
171
              {% for value in quater %}
172
                <td class="worker-{{ value.id }} agenda {{ value.dispo }}" style="display: none; "></td>
173
              {% endfor %}
174
            </tr>
175
          {% endfor %}
176
        {% endfor %}
177
      </table>
178
     </td>
179

    
180
     <td id="agendas">
181
       <div id="tabs">
182
       <ul>
183
        {% for worker_agenda in workers_agenda %}
184
           <li><a href="#tabs-worker-{{ worker_agenda.worker.id }}" class="worker-{{ worker_agenda.worker.id }} agenda" style="display: none;">{{ worker_agenda.worker.display_name }}</a></li>
185
        {% endfor %}
186
       </ul>
187
       <div id="tabs-sandy-kilo" class="tabs agenda sandy-kilo agenda">
188
       <a class="print" href="#">Imprimer</a>
189
       <div>
190
        <h3 class="info"><span class="hour">08:00</span> — Arrivée</h3>
191
        <div></div>
192
        <h3 class="free"><span class="hour">08:00</span> — 120m
193
        </h3>
194
        <div><button class='booking' data-hour="08:00">Prendre un rendez-vous</button></div>
195
        <h3 class="busy-elsewhere convocation"><span class="hour">10:00</span> — 45m — John Doe — SK
196
         <span class="right">
197
         <span class="box camsp" title="CAMSP"></span>
198
         <img title="Une convocation a été envoyée" src="{{ STATIC_URL }}images/emblem-mail.png"/>
199
         <img title="Un commentaire existe" src="{{ STATIC_URL }}images/emblem-documents.png"/>
200
         <button></button>
201
         <button></button>
202
         </span>
203
        </h3>
204
        <div>
205
          <div class="textedit">
206
           <textarea>bla bla bla</textarea>
207
           <button></button>
208
          </div>
209
          <a href="#">Dossier patient</a> -
210
          <a href="#">Prochains rendez-vous</a> -
211
          <a href="#">Convoquer patient</a>
212
        </div>
213
        <h3 class="busy-here"><span class="hour">10:45</span> — 45m — Jack Itchan — SK
214
         <span class="right">
215
           <img title="Un commentaire existe" src="{{ STATIC_URL }}images/emblem-documents.png"/>
216
         <button></button>
217
         <button></button>
218
         </span>
219
        </h3>
220
        <div>
221
          <div class="textedit">
222
           <textarea>bla bla bla</textarea>
223
           <button></button>
224
          </div>
225
          <a href="#">Dossier patient</a> -
226
          <a href="#">Prochains rendez-vous</a> -
227
          <a href="#">Convoquer patient</a>
228
        </div>
229
        <h3 class="busy-elsewhere"><span class="hour">11:30</span> — 30m — Réunion — Salle S4</h3>
230
        <div>
231
          <div class="textedit">
232
           <textarea>bla bla bla</textarea>
233
           <button></button>
234
          </div>
235
        </div>
236
        <h3 class="free"><span class="hour">12:00</span> — 30m</h3>
237
        <div></div>
238
        <h3 class="info"><span class="hour">12:30</span> — Départ</h3>
239
        <div></div>
240
       </div>
241
       </div>
242

    
243
       <div id="tabs-bob-leponge" class="tabs agenda bob-leponge">
244
       <a class="print" href="#">Imprimer</a>
245
       <div>
246
        <h3 class="info"><span class="hour">08:30</span> — Arrivée</h3>
247
        <div></div>
248
        <h3 class="free"><span class="hour">08:30</span> — 180m</h3>
249
        <div><button>Prendre un rendez-vous</button></div>
250
        <h3 class="busy-elsewhere"><span class="hour">11:30</span> — 30m — Réunion — Salle S4</h3>
251
        <div>
252
          <div class="textedit">
253
           <textarea>bla bla bla</textarea>
254
           <button></button>
255
          </div>
256
        </div>
257
        <h3 class="free"><span class="hour">12:00</span> — 30m</h3>
258
        <div></div>
259
        <h3 class="info"><span class="hour">12:30</span> — Départ</h3>
260
        <div></div>
261
        <h3 class="info"><span class="hour">13:00</span> — Arrivée</h3>
262
        <div></div>
263
        <h3 class="free"><span class="hour">13:00</span> — 270m</h3>
264
        <div><button>Prendre un rendez-vous</button></div>
265
        <h3 class="info"><span class="hour">17:30</span> — Départ</h3>
266
        <div></div>
267
       </div>
268

    
269
       </div>
270

    
271
       </div>
272
     </td>
273
    </tr>
274
    </tbody>
275
   </table>
276
 </div>
277

    
278
{% endblock %}
279

    
280
{% block dialogs %}
281
  <div id="rdv" style="display: none;">
282
    <form method="post" action="{% url "nouveau-rdv" service=service date=date %}">
283
     {% with new_appointment_form as form %}
284
   <table><tr><td>
285
   <p>
286

    
287
   {{ form.date.label_tag }}
288
   {{ form.date }}
289
   </p>
290
   </td><td>
291
   <p>
292
   {{ form.time.label_tag }}
293
   {{ form.time }}
294
   </p>
295
   </td><td>
296
   <p>
297
   {{ form.duration.label_tag }}
298
   {{ form.duration }}
299
   </p>
300
   </td></tr>
301

    
302
   <tr>
303
   <td>
304
     <h4>{{ form.participants.label_tag }}</h4>
305
   <div id="intervenants">
306
     {{ form.participants }}
307
   </div>
308
   </td>
309
   <td>
310
     <h4>{{ form.patient.label_tag }}</h4>
311
     {{ form.patient }}
312
   </td>
313
   <td>
314

    
315
     <h4>{{ form.act_type.label_tag }}</h4>
316
     {{ form.act_type }}
317
   </td>
318
   </tr>
319
   </table>
320

    
321
   <hr/>
322
   <button>Configurer la périodicité</button>
323
   {% endwith %}
324
   </form>
325
 </div>
326
{% endblock %}
    (1-1/1)