... |
... |
@@ -1,5 +1,71 @@ |
1 |
|
-¡Clica en **"Editar "** y modifica el contenido de esta página, luego clica en **"Guardar y ver "** para ver las modificaciones en tu página! |
|
1 |
+{{groovy}} |
|
2 |
+// Conectar a la base de datos |
|
3 |
+def db = groovy.sql.Sql.newInstance('jdbc:mysql://10.100.200.31:8285/games', 'root', 'xwiki', 'com.mysql.jdbc.Driver') |
2 |
2 |
|
3 |
|
-= = A continuación un texto de relleno para mostrarte la apariencia de la página = |
|
5 |
+// Iniciar tabla HTML |
|
6 |
+def table = """ |
|
7 |
+{{html}} |
|
8 |
+<style> |
|
9 |
+ table { |
|
10 |
+ border-collapse: collapse; |
|
11 |
+ width: 100%; |
|
12 |
+ font-family: Arial, sans-serif; |
|
13 |
+ } |
|
14 |
+ th, td { |
|
15 |
+ border: 1px solid #ddd; |
|
16 |
+ padding: 8px; |
|
17 |
+ } |
|
18 |
+ th { |
|
19 |
+ background-color: #f2f2f2; |
|
20 |
+ font-weight: bold; |
|
21 |
+ text-align: center; |
|
22 |
+ } |
|
23 |
+ tr:nth-child(even) { |
|
24 |
+ background-color: #f9f9f9; |
|
25 |
+ } |
|
26 |
+ tr:hover { |
|
27 |
+ background-color: #f1f1f1; |
|
28 |
+ } |
|
29 |
+ img { |
|
30 |
+ width: 50px; /* Ajusta el ancho de la imagen */ |
|
31 |
+ height: 25px; /* Ajusta la altura de la imagen */ |
|
32 |
+ object-fit: cover; /* Mantiene la relación de aspecto y recorta si es necesario */ |
|
33 |
+ } |
|
34 |
+</style> |
|
35 |
+<table> |
|
36 |
+ <thead> |
|
37 |
+ <tr> |
|
38 |
+ <th>ID</th> |
|
39 |
+ <th>TITULO</th> |
|
40 |
+ <th>SISTEMA</th> |
|
41 |
+ <th>COMPLETADO</th> |
|
42 |
+ <th>CARATULA</th> |
|
43 |
+ </tr> |
|
44 |
+ </thead> |
|
45 |
+ <tbody> |
|
46 |
+""" |
4 |
4 |
|
5 |
|
-Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
|
48 |
+// Recorrer las filas de la tabla de la base de datos y añadirlas a la tabla HTML |
|
49 |
+db.eachRow('SELECT * FROM games_list') { row -> |
|
50 |
+ table += """ |
|
51 |
+ <tr> |
|
52 |
+ <td>${row.id}</td> |
|
53 |
+ <td>${row.titulo}</td> |
|
54 |
+ <td>${row.sistema}</td> |
|
55 |
+ <td>${row.estado}</td> |
|
56 |
+ <td><img src='${row.caratula}'/></td> |
|
57 |
+ </tr> |
|
58 |
+ """ |
|
59 |
+} |
|
60 |
+ |
|
61 |
+// Cerrar la tabla HTML |
|
62 |
+table += """ |
|
63 |
+ </tbody> |
|
64 |
+</table> |
|
65 |
+{{/html}} |
|
66 |
+""" |
|
67 |
+ |
|
68 |
+// Usar out.print para renderizar la tabla como HTML |
|
69 |
+out.print(table) |
|
70 |
+ |
|
71 |
+{{/groovy}} |