mockups: relayout the "new appointment" dialog

This commit is contained in:
Frédéric Péters 2012-10-11 14:16:08 +02:00
parent 9dfb2c8ade
commit b723a1ff8f
2 changed files with 35 additions and 9 deletions

View File

@ -38,10 +38,16 @@
}); });
}); });
$('#agenda-date').datepicker(); $('#agenda-date').datepicker();
$('.date').datepicker(); $('.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() { $('#newrdv').click(function() {
$('#rdv').dialog({title: 'Nouveau rendez-vous', $('#rdv').dialog({title: 'Nouveau rendez-vous',
width: '500px', width: '800px',
buttons: [ { text: "Fermer", buttons: [ { text: "Fermer",
click: function() { $(this).dialog("close"); } }, click: function() { $(this).dialog("close"); } },
{ text: "Ajouter", { text: "Ajouter",
@ -273,19 +279,20 @@
<div id="rdv" style="display: none;"> <div id="rdv" style="display: none;">
<form> <form>
<table><tr><td>
<p> <p>
<label for="id_date">Date:</label> <label for="id_date">Date:</label>
<input id="id_date" class="date" name="date" value="5/7/2012"/> <input id="id_date" class="date" name="date" value="5/7/2012"/>
</p> </p>
<table><tr><td> </td><td>
<p> <p>
<label for="id_debut">Heure de début :</label> <label for="id_debut">Heure de début :</label>
<input id="id_debut" type="text" name="debut" maxlength="10"/> <input id="id_debut" type="text" name="debut" maxlength="10"/>
</p> </p>
</td><td> </td><td>
<p> <p>
<label for="id_fin">Heure de fin :</label> <label for="id_duree">Durée :</label>
<input id="id_fin" type="text" name="fin" maxlength="10"/> <input id="id_duree" type="text" name="duree" maxlength="10"/>
</p> </p>
</td></tr> </td></tr>
@ -297,14 +304,18 @@
<li><input type="checkbox" value="Bob Léponge" checked="checked">Bob Léponge</input></li> <li><input type="checkbox" value="Bob Léponge" checked="checked">Bob Léponge</input></li>
<li><input type="checkbox" value="Sandy Kilo" checked="checked">Sandy Kilo</input></li> <li><input type="checkbox" value="Sandy Kilo" checked="checked">Sandy Kilo</input></li>
</ul> </ul>
<a href="#">Ajouter</a><br/> <input/><button id="add-intervenant-btn"></button>
<a href="#">Tout le monde</a> <p><small>(champ avec autocomplétion)</small></p>
<!-- <a href="#">Tout le monde</a> -->
</div> </div>
</td> </td>
<td> <td>
<h4>Patient</h4> <h4>Patient</h4>
<input name="patient"/> <input name="patient"/>
<a href="#">rechercher</a> <br/>
<p><small>(champ avec autocomplétion)</small></p>
</td>
<td>
<h4>Type d'acte</h4> <h4>Type d'acte</h4>
<select> <select>
@ -315,7 +326,8 @@
</tr> </tr>
</table> </table>
<a class="button">Configurer la périodicité</a> <hr/>
<button>Configurer la périodicité</button>
</form> </form>
</div> </div>

View File

@ -913,3 +913,17 @@ table#activity tr td.hour {
font-size: 120%; font-size: 120%;
font-weight: bold; font-weight: bold;
} }
#id_date,
#id_debut,
#id_duree {
width: 6em;
}
#rdv table {
width: 100%;
}
#rdv table td {
width: 30%;
}