Commit e23a6c00acdc93132e4e742acaa143ad06518446

Authored by Antoine Duquenoy
1 parent 115e3f68

UI : modifications mineures

* Changement de quelques textes
* Mieux adapté aux mobiles
* Ajout des alertes pour la page d'ajout des utilisateurs
PFE06/src/main/java/com/PFE/ServerManager/MainController.java
... ... @@ -82,10 +82,12 @@ public class MainController {
82 82 modelAndView.setViewName("registration");
83 83 ///////
84 84 if(temp != null) {
85   - modelAndView.addObject("ok", "l'utilisateur existe déjà");
  85 + modelAndView.addObject("message", "L'utilisateur existe déjà !");
  86 + modelAndView.addObject("fail", true);
86 87 }
87 88 else {
88   - modelAndView.addObject("ok", "l'utilisateur a bien été ajouté");
  89 + modelAndView.addObject("message", "L'utilisateur a bien été ajouté !");
  90 + modelAndView.addObject("ok", true);
89 91 customerRepository.save(n);
90 92 }
91 93 modelAndView.setViewName("registration");
... ...
PFE06/src/main/resources/application.properties
... ... @@ -8,9 +8,9 @@ spring.jpa.hibernate.ddl-auto=create
8 8 #"update" met à jour la base données
9 9  
10 10 #Postgres config :
11   -spring.datasource.url=jdbc:postgresql://localhost:5432/sql_only
  11 +spring.datasource.url=jdbc:postgresql://localhost:3306/sql_only
12 12 spring.datasource.username=postgres
13   -spring.datasource.password=idalurf123
  13 +spring.datasource.password=admin
14 14  
15 15  
16 16 # montre les communications JPA avec la BDD
... ...
PFE06/src/main/resources/static/css/home.css
1 1 body { background-color: #FFF; }
2   -/*
  2 +
3 3 .upload-drop-zone {
4 4 height: 200px;
5 5 border-width: 2px;
... ... @@ -9,12 +9,7 @@ body { background-color: #FFF; }
9 9 border-color: #ccc;
10 10 line-height: 200px;
11 11 text-align: center
12   -}*/
13   -/*
14   -body {
15   - padding-top: 70px;
16   - padding-bottom: 30px;
17   -}*/
  12 +}
18 13  
19 14 .theme-dropdown .dropdown-menu {
20 15 position: static;
... ...
PFE06/src/main/resources/static/css/login.css
... ... @@ -20,6 +20,7 @@ body { background-color: #E9EEF2; }
20 20 border-radius: 5px;
21 21 margin: 50px auto;
22 22 max-width: 38%;
  23 + min-width: 400px;
23 24 padding: 50px 70px 70px 71px;
24 25 }
25 26  
... ... @@ -27,7 +28,7 @@ body { background-color: #E9EEF2; }
27 28 margin-bottom:10px;
28 29 }
29 30  
30   -.login-form { text-align:center;}
  31 +.login-form { text-align:center; }
31 32  
32 33 .forgot a {
33 34 color: #777777;
... ...
PFE06/src/main/resources/static/css/registration.css
... ... @@ -20,6 +20,7 @@ body { background-color: #E9EEF2; }
20 20 border-radius: 5px;
21 21 margin: 50px auto;
22 22 max-width: 38%;
  23 + min-width: 400px;
23 24 padding: 50px 70px 70px 71px;
24 25 }
25 26  
... ... @@ -27,14 +28,14 @@ body { background-color: #E9EEF2; }
27 28 margin-bottom:10px;
28 29 }
29 30  
30   -.login-form { text-align:center;}
  31 +.login-form { text-align:center; }
31 32  
32 33 .forgot a {
33 34 color: #777777;
34 35 font-size: 14px;
35 36 text-decoration: underline;
36 37 }
37   -.login-form .btn.btn-primary {
  38 +.login-form .btn.btn-primary {
38 39 background: #f0ad4e none repeat scroll 0 0;
39 40 border-color: #f0ad4e;
40 41 color: #ffffff;
... ... @@ -49,7 +50,6 @@ body { background-color: #E9EEF2; }
49 50 background: #ff9900 none repeat scroll 0 0;
50 51 }
51 52  
52   -
53 53 .back { text-align: left; margin-top:10px; }
54 54  
55 55 .back a {color: #444444; font-size: 13px;text-decoration: none;}
... ...
PFE06/src/main/resources/static/js/home.js
... ... @@ -3,6 +3,7 @@ $(document).ready(function() {
3 3 /********** Tableau **********/
4 4  
5 5 var tableNodes = $('#nodes-table').DataTable( {
  6 + responsive: true,
6 7 select: {
7 8 style: 'multi'
8 9 }
... ...
PFE06/src/main/resources/templates/all.html
... ... @@ -15,7 +15,7 @@
15 15 <div id="app">
16 16 <!-- NAV BAR -->
17 17 <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
18   - <span class="navbar-brand"> votre identifiant : <span th:text="${customerName}" th:remove="tag">Documentations</span></span>
  18 + <span class="navbar-brand"> ID : <span th:text="${customerName}" th:remove="tag">Documentations</span></span>
19 19 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
20 20 <span class="navbar-toggler-icon"></span>
21 21 </button>
... ...
PFE06/src/main/resources/templates/denied.html
... ... @@ -8,8 +8,8 @@
8 8 <body>
9 9 <h1>Access Denied !</h1>
10 10  
11   - <form th:action="@{/login}" method="GET">
12   - <button type="Submit">Se connecter</button>
  11 + <form th:action="@{/}" method="GET">
  12 + <button type="Submit">Accueil</button>
13 13 </form>
14 14  
15 15 </body>
... ...
PFE06/src/main/resources/templates/home.html
... ... @@ -10,6 +10,7 @@
10 10  
11 11 <link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css">
12 12 <link rel="stylesheet" href="https://cdn.datatables.net/select/1.2.7/css/select.dataTables.min.css">
  13 + <link rem="stylesheet" href="https://cdn.datatables.net/responsive/2.2.3/css/responsive.dataTables.min.css">
13 14 <link rel="stylesheet" th:href="@{/css/home.css}">
14 15 <title>Accueil</title>
15 16 </head>
... ... @@ -17,7 +18,7 @@
17 18 <body>
18 19 <div id="app">
19 20 <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
20   - <span class="navbar-brand"> votre identifiant : <span th:text="${customerName}" th:remove="tag">Documentations</span></span>
  21 + <span class="navbar-brand"> ID : <span th:text="${customerName}" th:remove="tag">Documentations</span></span>
21 22 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
22 23 <span class="navbar-toggler-icon"></span>
23 24 </button>
... ... @@ -192,6 +193,7 @@
192 193 <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js" charset="utf-8"></script>
193 194 <script src="https://cdn.datatables.net/select/1.2.7/js/dataTables.select.min.js" charset="utf-8"></script>
194 195 <script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js" charset="utf-8"></script>
  196 + <script src="https://cdn.datatables.net/responsive/2.2.3/js/dataTables.responsive.min.js" charset="utf-8"></script>
195 197 <script th:src="@{/js/home.js}"></script>
196 198 </body>
197 199 </html>
... ...
PFE06/src/main/resources/templates/login.html
... ... @@ -3,7 +3,7 @@
3 3 <head>
4 4  
5 5 <meta charset="utf-8">
6   - <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6 + <meta name="viewport" content="width=device-width, initial-scale=0.8, shrink-to-fit=no">
7 7  
8 8 <link rel="stylesheet" th:href="@{/css/login.css}">
9 9 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
... ... @@ -21,20 +21,19 @@
21 21 </div>
22 22  
23 23 <div th:if="${param.error}">
24   - <div v-if="wrong" class="alert alert-danger" role="alert">
25   - Login ou mot de passe incorrect
  24 + <div class="alert alert-danger" role="alert">
  25 + Pseudo ou mot de passe incorrect
26 26 </div>
27 27 </div>
28 28  
29   -
30 29 <form id="Login" th:action="@{/login}" method="POST">
31 30  
32 31 <div class="form-group">
33   - <input type="text" v-model="user.login" class="form-control" id="inputEmail" placeholder="Login" name="pseudo">
  32 + <input type="text" v-model="user.login" class="form-control" id="inputEmail" placeholder="Pseudo" name="pseudo">
34 33 </div>
35 34  
36 35 <div class="form-group">
37   - <input type="password" v-model="user.password" class="form-control" id="inputPassword" placeholder="Password" name="password">
  36 + <input type="password" v-model="user.password" class="form-control" id="inputPassword" placeholder="Mot de passe" name="password">
38 37 </div>
39 38  
40 39 <button @click.prevent="login" type="submit" class="btn btn-primary">Se connecter</button>
... ...
PFE06/src/main/resources/templates/registration.html
... ... @@ -4,14 +4,14 @@
4 4 <head>
5 5 <title>Enregistrement de nouveaux utilisateurs</title>
6 6 <meta charset="utf-8">
7   - <meta http-equiv="X-UA-Compatible" content="IE=edge">
8   - <meta name="viewport" content="width=device-width, initial-scale=1">
  7 + <meta name="viewport" content="width=device-width, initial-scale=0.8, shrink-to-fit=no">
9 8 <link rel="stylesheet" th:href="@{/css/registration.css}">
10 9 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
11 10 </head>
12 11 <body>
  12 +
13 13 <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
14   - <span class="navbar-brand"> votre identifiant : <span th:text="${customerName}" th:remove="tag">Documentations</span></span>
  14 + <span class="navbar-brand"> ID : <span th:text="${customerName}" th:remove="tag">Documentations</span></span>
15 15 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
16 16 <span class="navbar-toggler-icon"></span>
17 17 </button>
... ... @@ -36,18 +36,32 @@
36 36 </div>
37 37 </div>
38 38 </nav>
  39 +
39 40 <div class="login-form">
40 41 <div class="main-div">
41 42 <div class="panel">
42 43 <h2>Formulaire d'ajout</h2>
43 44 <p>Merci d'entrer le login et le mot de passe du nouvel utilisateur</p>
44 45 </div>
  46 +
  47 + <div th:if="${ok}">
  48 + <div class="alert alert-success" role="alert">
  49 + <span th:utext="${message}"></span>
  50 + </div>
  51 + </div>
  52 +
  53 + <div th:if="${fail}">
  54 + <div class="alert alert-danger" role="alert">
  55 + <span th:utext="${message}"></span>
  56 + </div>
  57 + </div>
  58 +
45 59 <form id="Login" th:action="@{/registration}" method="POST">
46 60 <div class="form-group">
47   - <input type="text" v-model="user.login" class="form-control" id="username" placeholder="Enter UserName" name="pseudo">
  61 + <input type="text" v-model="user.login" class="form-control" id="username" placeholder="Enter le pseudo" name="pseudo">
48 62 </div>
49 63 <div class="form-group">
50   - <input type="password" v-model="user.password" class="form-control" id="password" placeholder="Enter Password" name="password">
  64 + <input type="password" v-model="user.password" class="form-control" id="password" placeholder="Entre le mot de passe" name="password">
51 65 </div>
52 66 <div class="form3">
53 67 <input type="radio" id="role1" name="role" value="ADMIN">
... ... @@ -58,7 +72,7 @@
58 72 </div>
59 73 <button @click.prevent="registration" type="submit" class="btn btn-primary">Ajouter</button>
60 74 </form>
61   - <span th:utext="${ok}"></span>
  75 +
62 76 </div>
63 77 </div>
64 78  
... ...