Project

General

Profile

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

calebasse / calebasse / agenda / templates / agenda / index.html @ a87d6ad7

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
        if ($target.is(':visible')) {
33
          $target.click();
34
        }
35
      }
36
  $(function() {
37
    $('#tabs').tabs();
38

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

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

    
49
    $('.textedit').on('keydown', function() {
50
        $('button', this).removeAttr("disabled");
51
    });
52
    $('.textedit button').on('click', function() {
53
        var textarea = $(this).prev();
54
        $.ajax({
55
            url: '/api/event/' + $(this).data("event-id") + '/?format=json',
56
            type: 'PATCH',
57
            contentType: 'application/json',
58
            data: '{"description": "' + textarea.val() + '"}'
59
        });
60
    });
61

    
62

    
63
    /* Gestion du filtre sur les utilisateurs */
64
		$('#filtre input').keyup(function() {
65
			var filtre = $(this).val();
66
      if (filtre) {
67
        $('#users li').each(function() {
68
          if ($(this).text().match(filtre)) {
69
            $(this).show();
70
          } else {
71
            $(this).hide();
72
          }
73
        });
74
      } else {
75
        $('#users li').show();
76
      }
77

    
78
		});
79
    $('#agenda-date').datepicker({
80
      dateFormat: "DD d MM yy",
81
      onClose: function(dateText, inst) {
82
        console.log('close');
83
      }
84
    });
85
    $('#agenda-date').on('change', function () {
86
      window.location.href=replace_anchor('../' + $(this).datepicker('getDate').toISOString().substr(0,10), make_anchor());
87
    });
88
		$('.date').datepicker({showOn: 'button'});
89
		$('#add-intervenant-btn').click(function() {
90
			var text = $(this).prev().val();
91
			$('#intervenants ul').append('<li><input type="checkbox" value="' + text + '" checked="checked">' + text + '</input></li>');
92
			$(this).prev().val('').focus();
93
			return false;
94
		});
95
    $('#newrdv').click(function() {
96
      var participants = $('.person-item.active').map(function (i, v) { return $(v).data('worker-id'); });
97
      var qs = $.param({participants: $.makeArray(participants) }, true);
98
      var new_appointment_url = "{% url 'nouveau-rdv' service=service date=date %}?" + qs;
99
      $('#rdv').load(new_appointment_url,
100
        function () {
101
          function onsuccess(response, status, xhr, form) {
102
            var parse = $(response);
103
            if ($('.errorlist', parse).length != 0) {
104
              $('#rdv').html(response);
105
              $('#rdv form').ajaxForm({
106
                success: onsuccess,
107
              });
108
              $('#rdv .datepicker-date').datepicker({dateFormat: 'yy-m-d', showOn: 'button'});
109
              console.log('error');
110
            } else {
111
              console.log('success');
112
              window.location.reload(true);
113
            }
114
          }
115
          $('#rdv .datepicker-date').datepicker({dateFormat: 'yy-m-d', showOn: 'button'});
116
          $('form', this).ajaxForm({
117
            success: onsuccess
118
          });
119
          $(this).dialog({title: 'Nouveau rendez-vous',
120
              width: '800px',
121
              buttons: [ { text: "Fermer",
122
                     click: function() { $(this).dialog("close"); } },
123
                   { text: "Ajouter",
124
                     click: function() { $("#rdv form").submit(); } }]});
125
      });
126
    });
127
	});
128
	</script>
129
  <style>
130
    .person-item span { display: none; }
131
    .person-item.active span { display: inline; }
132
    #agenda-date { width: 20em; }
133
  </style>
134
{% endblock %}
135

    
136
{% block title %}{{ block.super }} - Agenda {% endblock %}
137

    
138
{% block header %}
139
  {{ block.super }}
140
  <span>Agenda - {{ service_name }}</spam>
141
{% endblock %}
142

    
143
{% block appbar %}
144
    <h2>Agenda</h2>
145
    <a href="../..">Retourner à l'accueil</a>
146
    <button>Nouvel événement (autre)</button>
147
    <button id="newrdv">Nouveau rendez-vous patient</button>
148
{% endblock %}
149

    
150
{% block beforecontent %}
151
    <div id="extra-top-links">
152
     <a href="activite-du-service">Activité du service</a>
153
154
     <a href="validation-des-actes">Validation des actes</a>
155
156
     <a href="rendez-vous-periodiques">Rendez-vous périodiques</a>
157
    </div>
158

    
159

    
160
    <div id="users">
161
    <div id="filtre">
162
     <input type="text"/>
163
    </div>
164
    <dl>
165
     {% for workers_type in workers_types %}
166
     <dt>{{ workers_type.type }}</dt>
167
     <dd><ul>
168
       {% for worker in workers_type.workers %}
169
       <li id="selector-worker-{{worker.id}}" class="person-item" data-worker-id="{{worker.id}}" data-target=".worker-{{worker.id}}.agenda">{{ worker.display_name }} <span title="cliquer pour déselectionner">(-)</span></li>
170
       {% endfor %}
171
     </ul></dd>
172
     {% endfor %}
173
   </dl>
174
 </div>
175
{% endblock %}
176

    
177
{% block content %}
178
<div class="content">
179
   <div id="datesel">
180
     <a href="../{{ previous_month|date:"SHORT_DATE_FORMAT"}}">««</a>
181
     <a href="../{{ previous_day|date:"SHORT_DATE_FORMAT"}}">«</a>
182
   <!-- <span>Jeudi 5 juillet 2012</span> -->
183
   <input id="agenda-date" value="{{ date|date:"DATE_FORMAT" }}"/>
184
   <a href="../{{ next_day|date:"SHORT_DATE_FORMAT"}}">»</a>
185
   <a href="../{{ next_month|date:"SHORT_DATE_FORMAT"}}">»»</a>
186
   </div>
187

    
188
   <table>
189
    <tbody>
190
    <tr>
191
     <td id="dispos">
192
      Disponibilités
193
      <table>
194
        {% for start_time, quaters in disponibility.items %}
195
          <tr class="hour-mark">
196
              <td rowspan="4">{{ start_time }}:00</td>
197
              {% for quater in quaters|slice:":1" %}
198
                {% for value in quater %}
199
                <td class="worker-{{ value.id }} agenda {{ value.dispo }}" style="display: none; "></td>
200
                {% endfor %}
201
              {% endfor %}
202
          </tr>
203
          {% for quater in quaters|slice:"1:4" %}
204
            <tr>
205
              {% for value in quater %}
206
                <td class="worker-{{ value.id }} agenda {{ value.dispo }}" style="display: none; "></td>
207
              {% endfor %}
208
            </tr>
209
          {% endfor %}
210
        {% endfor %}
211
      </table>
212
     </td>
213

    
214
     <td id="agendas">
215
       <div id="tabs">
216
       <ul>
217
        {% for worker_agenda in workers_agenda %}
218
           <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>
219
        {% endfor %}
220
       </ul>
221
       {% for worker_agenda in workers_agenda %}
222
       <div id="tabs-worker-{{ worker_agenda.worker.id }}" class="tabs agenda worker-{{ worker_agenda.worker.id }}" style="display: none;">
223
         <a class="print" href="#">Imprimer</a>
224
         <div>
225
           {% for appointment in worker_agenda.appointments %}
226
           <h3 class="{{ appointment.type }}"><span class="hour">{{ appointment.begin_hour }}</span>
227
             {% if appointment.title %} — {{ appointment.title }}  {% endif %}
228
             {% if appointment.length %} — {{ appointment.length }}m {% endif %}
229
             {% if appointment.room %} — {{ appointment.room }} {% endif %}
230
           </h3>
231

    
232
           <div>
233
             {% if appointment.type == 'free' %}<button class='booking' data-hour="{{ appointment.begin_hour }}">Prendre un rendez-vous</button> {% endif %}
234
             {% if appointment.description %}
235
             <div class="tabs-worker-{{ worker_agenda.worker.id }} textedit">
236
                 <textarea>{{ appointment.description }}</textarea>
237
                 <button disabled="disabled" data-event-id="{{ appointment.event_id }}"></button>
238
             </div>
239
             {% endif %}
240
             {% if appointment.patient_record_id %}
241
             <a href="/{{ service }}/dossiers/{{ appointment.patient_record_id }}">Dossier patient</a> -
242
             <a href="#">Prochains rendez-vous</a> -
243
             <a href="#">Convoquer patient</a>
244
             {% endif %}
245
           </div>
246
           {% endfor %}
247
         </div>
248
       </div>
249
       {% endfor %}
250

    
251
       </div>
252

    
253
       </div>
254
     </td>
255
    </tr>
256
    </tbody>
257
   </table>
258
 </div>
259

    
260

    
261
{% endblock %}
262

    
263
{% block dialogs %}
264
  <div id="rdv" style="display: none;">
265
 </div>
266
{% endblock %}
(2-2/3)