Produits Entr'ouvert » Calebasse

{% extends "calebasse/base.html" %}

{% load url from future %}

{% block extrascripts %}

<script>

    function replace_anchor(url, anchor) {

        var splitted = url.split('#');

        return splitted[0] + '#' + encodeURI(anchor);

    }

    function extract_anchor() {

        if (window.location.href.indexOf('#') == -1) {

            return "";

        }

        var splitted = window.location.href.split('#');

        return decodeURI(splitted[1]).split(',');

    }

    function make_anchor() {

        return $.makeArray($('.person-item.active').map(function (v, i) { return '_' + $(i).attr('id'); })).join(',');

    }

    function toggle_worker(worker_selector) {

        $(worker_selector).toggleClass('active');

        // update the anchor

        var anchor = make_anchor();

        var new_uri = replace_anchor(window.location.href, anchor);

        console.log(new_uri);

        window.location.href = new_uri;

        $('a[href^="../"]').each(function (i, a) {

            $(a).attr('href', replace_anchor($(a).attr('href'), anchor));

        });

        var $target = $($(worker_selector).data('target'));

        $target.toggle();

        if ($target.is(':visible')) {

            $target.click();

        }

    }

    $(function() {

        $('#tabs').tabs();

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

        $('.person-item').on('click', function() {

            toggle_worker(this);

        });

        // select all anchors

        $.each(extract_anchor(), function (i, anchor) {

            $('#'+anchor.substr(1)).each(function (i, worker_selector) { toggle_worker(worker_selector); });

        });

        $('.textedit').on('keydown', function() {

            $('button', this).removeAttr("disabled");

        });

        $('.textedit button').on('click', function() {

            var textarea = $(this).prev();

            var span = textarea.prev()

            var btn = $(this)

            $.ajax({

                url: '/api/event/' + $(this).data("event-id") + '/?format=json',

                type: 'PATCH',

                contentType: 'application/json',

                data: '{"description": "' + textarea.val() + '"}',

                success: function(data) {

                    btn.attr('disabled', 'disabled');

                    span.html('Commentaire modifiée avec succès');

                }

            });

        });

        $('.appointment').on('click', function() {

            $('.textedit span', this).html('');

        });

        $('.remove-appointment').on('click', function() {

            var r = confirm("Etes-vous sûr de vouloir supprimer le rendez-vous " + $(this).data('rdv') + " ?");

            if (r == true)

            {

                $.ajax({

                    url: '/api/occurrence/' + $(this).data('occurrence-id') + '/',

                    type: 'DELETE',

                    success: function(data) {

                        window.location.reload(true);

                        return false;

                    }

                });

            }

            return false;

        });

        /* Gestion du filtre sur les utilisateurs */

        $('#filtre input').keyup(function() {

            var filtre = $(this).val();

            if (filtre) {

                $('#users li').each(function() {

                    if ($(this).text().match(filtre)) {

                        $(this).show();

                        } else {

                        $(this).hide();

                    }

                });

                } else {

                $('#users li').show();

            }

        });

        $('#agenda-date').datepicker({

            dateFormat: "DD d MM yy",

            onClose: function(dateText, inst) {

                console.log('close');

            }

        });

        $('#agenda-date').on('change', function () {

            window.location.href=replace_anchor('../' + $(this).datepicker('getDate').toISOString().substr(0,10), make_anchor());

        });

        $('.date').datepicker({showOn: 'button'});

        $('#add-intervenant-btn').click(function() {

            var text = $(this).prev().val();

            $('#intervenants ul').append('<li><input type="checkbox" value="' + text + '" checked="checked">' + text + '</input></li>');

            $(this).prev().val('').focus();

            return false;

        });

        $('#newrdv').click(function() {

            var participants = $('.person-item.active').map(function (i, v) { return $(v).data('worker-id'); });

            var qs = $.param({participants: $.makeArray(participants) }, true);

            var new_appointment_url = "{% url 'nouveau-rdv' service=service date=date %}?" + qs;

            $('#rdv').load(new_appointment_url,

            function () {

                function onsuccess(response, status, xhr, form) {

                    var parse = $(response);

                    if ($('.errorlist', parse).length != 0) {

                        $('#rdv').html(response);

                        $('#rdv form').ajaxForm({

                            success: onsuccess,

                        });

                        $('#rdv .datepicker-date').datepicker({dateFormat: 'yy-m-d', showOn: 'button'});

                        console.log('error');

                        } else {

                        console.log('success');

                        window.location.reload(true);

                    }

                }

                $('#rdv .datepicker-date').datepicker({dateFormat: 'yy-m-d', showOn: 'button'});

                $('form', this).ajaxForm({

                    success: onsuccess

                });

                $(this).dialog({title: 'Nouveau rendez-vous',

                    width: '800px',

                    buttons: [ { text: "Fermer",

                        click: function() { $(this).dialog("close"); } },

                    { text: "Ajouter",

                        click: function() { $("#rdv form").submit(); } }]});

            });

        });

    });

</script>

  <style>

    .person-item span { display: none; }

    .person-item.active span { display: inline; }

    #agenda-date { width: 20em; }

  </style>

{% endblock %}

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

{% block header %}

  {{ block.super }}

  <span>Agenda - {{ service_name }}</spam>

{% endblock %}

{% block appbar %}

    <h2>Agenda</h2>

    <a href="../..">Retourner à l'accueil</a>

    <button>Nouvel événement (autre)</button>

    <button id="newrdv">Nouveau rendez-vous patient</button>

{% endblock %}

{% block beforecontent %}

    <div id="extra-top-links">

     <a href="activite-du-service">Activité du service</a>

     —

     <a href="validation-des-actes">Validation des actes</a>

     —

     <a href="rendez-vous-periodiques">Rendez-vous périodiques</a>

    </div>

    <div id="users">

    <div id="filtre">

     <input type="text"/>

    </div>

    <dl>

     {% for workers_type in workers_types %}

     <dt>{{ workers_type.type }}</dt>

     <dd><ul>

       {% for worker in workers_type.workers %}

       <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>

       {% endfor %}

     </ul></dd>

     {% endfor %}

   </dl>

 </div>

{% endblock %}

{% block content %}

<div class="content">

   <div id="datesel">

     <a href="../{{ previous_month|date:"SHORT_DATE_FORMAT"}}">««</a>

     <a href="../{{ previous_day|date:"SHORT_DATE_FORMAT"}}">«</a>

   <!-- <span>Jeudi 5 juillet 2012</span> -->

   <input id="agenda-date" value="{{ date|date:"DATE_FORMAT" }}"/>

   <a href="../{{ next_day|date:"SHORT_DATE_FORMAT"}}">»</a>

   <a href="../{{ next_month|date:"SHORT_DATE_FORMAT"}}">»»</a>

   </div>

   <table>

    <tbody>

    <tr>

     <td id="dispos">

      Disponibilités

      <table>

        {% for start_time, quaters in disponibility.items %}

          <tr class="hour-mark">

              <td rowspan="4">{{ start_time }}:00</td>

              {% for quater in quaters|slice:":1" %}

                {% for value in quater %}

                <td class="worker-{{ value.id }} agenda {{ value.dispo }}" style="display: none; "></td>

                {% endfor %}

              {% endfor %}

          </tr>

          {% for quater in quaters|slice:"1:4" %}

            <tr>

              {% for value in quater %}

                <td class="worker-{{ value.id }} agenda {{ value.dispo }}" style="display: none; "></td>

              {% endfor %}

            </tr>

          {% endfor %}

        {% endfor %}

      </table>

     </td>

     <td id="agendas">

       <div id="tabs">

       <ul>

        {% for worker_agenda in workers_agenda %}

           <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>

        {% endfor %}

       </ul>

       {% for worker_agenda in workers_agenda %}

       <div id="tabs-worker-{{ worker_agenda.worker.id }}" class="tabs agenda worker-{{ worker_agenda.worker.id }}" style="display: none;">

         <a class="print" href="#">Imprimer</a>

         <div>

           {% for appointment in worker_agenda.appointments %}

           <h3 class="{{ appointment.type }} appointment">

             <span class="hour">{{ appointment.begin_hour }}</span>

             {% if appointment.title %} — {{ appointment.title }}  {% endif %}

             {% if appointment.length %} — {{ appointment.length }}m {% endif %}

             {% if appointment.workers_initial %} —{{ appointment.workers_initial }} {% endif %}

             {% if appointment.act_type %} — {{ appointment.act_type }} {% endif %}

             {% if appointment.room %} — {{ appointment.room }} {% endif %}

             <span class="right">

                 {% if appointment.service and appointment.service != service %}

                 <span class="box {{ appointment.service }}" title="{{ appointment.service }}"></span>

                 {% endif %}

                 {% if appointment.convocation_sent %}

                 <img title="Une convocation a été envoyée" src="{{ STATIC_URL }}images/emblem-mail.png">

                 {% endif %}

                 {% if appointment.description %}

                 <img title="Un commentaire existe" src="{{ STATIC_URL }}images/emblem-documents.png">

                 {% endif %}

                 {% if appointment.event_id %}

                 <button type="button"><img title="Editer un rendez-vous" src="{{ STATIC_URL }}images/accessories-text-editor.png"></button>

                 <button data-occurrence-id="{{ appointment.occurrence_id }}" data-rdv="{{ appointment.title }}"  type="button" class="remove-appointment">

                     <img title="Supprimer un rendez-vous" src="{{ STATIC_URL }}images/list-remove.png">

                 </button>

                 {% endif %}

            </span>

           </h3>

           <div>

             {% if appointment.type == 'free' %}<button class='booking' data-hour="{{ appointment.begin_hour }}">Prendre un rendez-vous</button> {% endif %}

             {% if appointment.event_id %}

             <div class="tabs-worker-{{ worker_agenda.worker.id }} textedit">

                 <span></span>

                 <textarea>{{ appointment.description }}</textarea>

                 <button disabled="disabled" data-event-id="{{ appointment.event_id }}">✔</button>

             </div>

             {% endif %}

             {% if appointment.patient_record_id %}

             <a href="/{{ service }}/dossiers/{{ appointment.patient_record_id }}">Dossier patient</a> -

             <a href="#">Prochains rendez-vous</a> -

             <a href="#">Convoquer patient</a>

             {% endif %}

           </div>

           {% endfor %}

         </div>

       </div>

       {% endfor %}

       </div>

       </div>

     </td>

    </tr>

    </tbody>

   </table>

 </div>

{% endblock %}

{% block dialogs %}

  <div id="rdv" style="display: none;">

 </div>

{% endblock %}