Project

General

Profile

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

calebasse / mockups / conges.html @ aff120df

1
<!DOCTYPE html>
2
<html lang="fr">
3
  <head>
4
    <meta charset="utf-8"/>
5
    <title>APS42 — Congés</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
		$('#new-membre').click(function() {
15
			$('#new-membre-dlg').dialog({title: 'Nouvel accès',
16
				  width: '300px',
17
				  buttons: [ { text: "Fermer",
18
					       click: function() { $(this).dialog("close"); } },
19
					     { text: "Ajouter",
20
					       click: function() {
21
					       $(this).dialog("close"); } } ]
22
					});
23
			});
24
	});
25
	</script>
26
  </head>
27
  <body>
28
  <div id="wrap-large">
29
    <div id="header">
30
      <h1><a href="accueil.html">APS 42</a></h1>
31
      <span>Gestion - CMPP</span>
32
    </div>
33
    <div id="splash" class="cmpp">
34
      <div id="user-links">
35
        <a href="connexion.html">Déconnexion</a>
36
      </div>
37
    </div>
38
    <div id="content">
39

    
40
    <div id="appbar">
41
    <h2>Gestion des personnes — Congés</h2>
42
    <a href="gestion-personnes.html">Retourner à la gestion des personnes</a>
43
    </div>
44

    
45
    <h3>Congés du personnel</h3>
46

    
47
    <h4>En cours</h4>
48

    
49
    <ul>
50
     <li><a href="un-membre.html">Durant François</a>, du 20 août au 3 septembre 2012</li>
51
    </ul>
52

    
53
    <h4>À venir</h4>
54

    
55
    <table id="conges-a-venir">
56
    <tr>
57
    <th>Août</th>
58
    <th>Septembre</th>
59
    <th>Octobre</th>
60
    </tr>
61
    <tr>
62
    <td>
63
    <ul>
64
     <li><a href="#">Dupont Gloria</a>, le 30 août 2012, de 14h à 17h30</li>
65
    </ul>
66
    </td>
67
    <td>
68
    <ul>
69
     <li><a href="#">Dupont Gloria</a>, le 2 septembre 2012</li>
70
    </ul>
71
    </td>
72
    <td>
73
    <ul>
74
     <li><a href="un-membre.html">Durant François</a>, du 3 au 10 octobre 2012</li>
75
     <li><a href="#">Dupont Gloria</a>, du 8 au 15 octobre 2012</li>
76
     <li>...</li>
77
    </ul>
78
    </td>
79
    </tr>
80
    </table>
81

    
82
    <h3>Congés annuels</h3>
83
    <ul>
84
      <li>Du 24 décembre 2012 au 4 janvier 2013</li>
85
    </ul>
86
    <button>Gestion des congés annuels</button>
87

    
88
    <h3>Affichage interactif</h3>
89

    
90
    <p>Afficher la liste des congés pris entre
91
    <input size="20"/> et <input size="20"/>
92
    <button>Valider</button>
93
    </p>
94

    
95
    </div>
96

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

    
102
  <div id="new-membre-dlg" style="display: none;">
103
   <form>
104
   <p>
105
    <label for="id_nom">Identifiant :</label>
106
    <input id="id_nom" type="text" name="nom"/>
107
   </p>
108
   <p>
109
    <label for="id_password">Mot de passe :</label>
110
    <input id="id_password" type="text" name="password"/>
111
   </p>
112
   <p>
113
    <label for="id_member">Membre du personnel associé :</label>
114
    <input id="id_member" type="text" name="member"/>
115
   </p>
116
   </form>
117
  </div>
118
  </body>
119
</html>
(7-7/23)