Projet

Général

Profil

Télécharger (3,75 ko) Statistiques
| Branche: | Tag: | Révision:

calebasse / mockups / un-membre.html @ master

1
<!DOCTYPE html>
2
<html lang="fr">
3
  <head>
4
    <meta charset="utf-8"/>
5
    <title>APS42 — Gestion du personnel</title>
6
    <link rel="stylesheet" type="text/css" media="all" href="css/style.css"/>
7
    <link rel="stylesheet" type="text/css" media="all" href="css/smoothness/jquery-ui-1.8.21.custom.css"/>
8

    
9
    <script src="js/jquery-1.7.2.min.js"></script>
10
    <script src="js/jquery-ui-1.8.21.custom.min.js"></script>
11
    <script src="development-bundle/ui/i18n/jquery.ui.datepicker-fr.js"></script>
12
    <script>
13
	$(function() {
14
		$('#lundi').click(function() {
15
			$('#lundi-dlg').dialog({title: 'Plages du lundi',
16
				width: '950px',
17
				  buttons: [ { text: "Annuler",
18
					       click: function() { $(this).dialog("close"); } },
19
					     { text: "Valider",
20
					       click: function() { $(this).dialog("close"); } }]}
21
			);
22
			});
23
	});
24
	</script>
25
  </head>
26
  <body>
27
  <div id="wrap-large">
28
    <div id="header">
29
      <h1><a href="accueil.html">APS 42</a></h1>
30
      <span>Gestion - CMPP</span>
31
    </div>
32
    <div id="splash" class="cmpp">
33
      <div id="user-links">
34
        <a href="connexion.html">Déconnexion</a>
35
      </div>
36
    </div>
37
    <div id="content">
38

    
39
    <div id="appbar">
40
    <h2>Personnel - Durant François <span class="en-conge">(en congé jusqu'au 3 septembre)</span></h2>
41
    <a href="admin-personnel.html">Retourner à l'administration du personnel</a>
42
    <button>Supprimer</button>
43
    </div>
44

    
45
    <div id="info-membre">
46
     <div class="frame">
47
     <h3>État civil</h3>
48
     <button class="save"></button>
49
     <p><label>Nom :</label> <input value="Durant"/>
50
     <label>Prénom(s) :</label> <input value="François"/>
51
     <label>Genre :</label> <input value="M"/></p>
52
     </div>
53

    
54
     <div class="frame">
55
     <h3>Services</h3>
56
     <button class="save"></button>
57

    
58
     <p class="services">
59
     <input type="checkbox" checked="checked"><label>CMPP</label></input>
60
     <input type="checkbox" checked="checked"><label>CAMSP</label></input>
61
     <input type="checkbox"><label>SESSAD TED</label></input>
62
     <input type="checkbox"><label>SESSAD DYS</label></input>
63
     </p>
64

    
65
     </div>
66

    
67
     <div class="frame" id="schedule">
68
     <h3>Horaires de travail</h3>
69

    
70
     <table>
71
     <thead><tr><th id="lundi">Lundi</th><th>Mardi</th><th>Mercredi</th><th>Jeudi</th><th>Vendredi</th><th>Samedi</th><th>Dimanche</th></tr></thead>
72
     <tbody>
73
      <tr>
74
       <td>De 13h30 à 17h30</td>
75
       <td>De 8h30 à 12h30<br/>De 13h30 à 17h30</td>
76
       <td>-</td>
77
       <td>De 8h30 à 12h30<br/>De 13h30 à 17h30</td>
78
       <td>-</td>
79
       <td>-</td>
80
       <td>-</td>
81
      </tr>
82
     </tbody>
83
     </table>
84
     </div>
85

    
86
     <div class="frame">
87
     <h3>Congés</h3>
88
     <button class="save"></button>
89
     <ul>
90
      <li>Du 20 août au 3 septembre 2012 (en cours)</li>
91
      <li>Du 3 au 10 octobre 2012</li>
92
      <li>Du 24 décembre 2012 au 4 janvier 2013 (congés annuels)</li>
93
     </ul>
94
     </div>
95

    
96
    </div>
97

    
98
    <div id="footer">
99
100
    </div>
101
  </div>
102

    
103
  <div id="lundi-dlg" style="display: none;">
104
    <table>
105
    <tr>
106
    <th>Heure début</th> <th>Heure fin</th> <th>Date début</th> <th>Date fin</th> <th>Périodicité</th> <th>Services</th>
107
    </tr>
108
    <tr>
109
    <td><input value="13h30" size="8"/></td> <td><input value="17h30" size="8"/></td> <td><input value="20/04/2012" size="12"/></td> <td><input value="-" size="12"/></td> <td><select><option>Toutes les semaines</option></select></td> <td><select><option>CAMSP</option><option>CMPP</option><option>...</option><option>+</option></select></td> <td><button>-</button></td>
110
    </tr>
111

    
112
    <tr class="expired"> <td>13h30</td> <td>15h30</td> <td>2/01/2012</td> <td>14/04/2012</td> <td>2× par mois</td> <td>CAMSP</td> <td><button>déver.</button> </tr>
113
    </table>
114
    <button>+</button>
115
  </div>
116

    
117
  </body>
118
</html>
(21-21/23)