c

CritickalGames · Mar 22, 2024 · c96be78 · c96be78
1 parent e02138a
commit c96be78
Show file tree

Hide file tree

Showing 6 changed files with 197 additions and 0 deletions.
diff --git a/albion/CSS/css.css b/albion/CSS/css.css
@@ -0,0 +1,18 @@
+.sidebar {
+    height: 100%;
+    position: fixed;
+    top: 0;
+    right: 0;
+    background-color: #ccc; /* Cambia el color de fondo a gris */
+    padding: 20px;
+    border-left: 1px solid #dee2e6;
+}  
+
+.content {
+  margin-right: 300px; /* Ancho del aside */
+}
+
+.table-container {
+  height: 400px; /* Altura máxima de la tabla */
+  overflow-y: auto; /* Hace que la tabla sea desplazable verticalmente */
+}
diff --git a/albion/Index.html b/albion/Index.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Bootstrap 5 Example</title>
+  <!-- Bootstrap CSS -->
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
+  <!-- CSS personalizado -->
+  <link href="CSS/css.css" rel="stylesheet">
+  <!-- AJAX importado -->
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
+</head>
+<body>
+
+<div class="container-fluid">
+  <div class="row">
+    <!-- Aside -->
+    <aside class="col-lg-3 col-md-4 col-sm-6 col-12 sidebar">
+      <p id="mensaje">Hola</p>
+      <!-- Menú desplegable con botones -->
+      <div class="dropdown">
+        <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-bs-toggle="dropdown" aria-expanded="false">
+          Menú
+        </button>
+        <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+          <li><button class="dropdown-item" type="button" onclick="mostrarTitulo(this)">Botón 1</button></li>
+          <li><button class="dropdown-item" type="button" onclick="mostrarTitulo(this)">Botón 2</button></li>
+          <li><button class="dropdown-item" type="button" onclick="mostrarTitulo(this)">Botón 3</button></li>
+        </ul>
+      </div>
+    </aside>
+    <!-- Contenido principal -->
+    <main class="col-lg-9 col-md-8 col-sm-6 col-12 content">
+      <div class="table-container">
+        <table class="table">
+          <thead>
+            <tr>
+              <th scope="col">Encabezado 1</th>
+              <th scope="col">Encabezado 2</th>
+              <th scope="col">Encabezado 3</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <td>Dato 1</td>
+              <td>Dato 2</td>
+              <td>Dato 3</td>
+            </tr>
+            <!-- Más filas -->
+          </tbody>
+        </table>
+      </div>
+    </main>
+  </div>
+</div>
+
+<!-- Bootstrap Bundle with Popper -->
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
+
+<!-- Script JavaScript -->
+<script src="JS/main.js"></script>
+</body>
+</html>
diff --git a/albion/JS/main.js b/albion/JS/main.js
@@ -0,0 +1,19 @@
+function mostrarTitulo(btn) {
+    var titulo = btn.innerHTML;
+    document.getElementById("mensaje").innerHTML = titulo;
+}
+// Hacer una petición AJAX al archivo PHP
+$.ajax({
+    url: 'PHP/main.php',
+    type: 'GET',
+    dataType: 'json',
+    success: function(data) {
+        // Manipular los datos recibidos
+        console.log("data");
+        console.log(data);
+    },
+    error: function(XMLHttpRequest, status, error) {
+        // Manejar errores
+        console.error(error);
+    }
+});
diff --git a/albion/PHP/Modelo/MConexion.php b/albion/PHP/Modelo/MConexion.php
@@ -0,0 +1,48 @@
+<?php
+
+class MConexion {
+    private $servername = "localhost";
+    private $username = "root";
+    private $password = "";
+    private $database = "albion_tabla";
+    private $conn;
+
+    // Constructor
+    public function __construct() {
+        $this->conn = new mysqli($this->servername, $this->username, $this->password, $this->database);
+
+        // Verificar conexión
+        if ($this->conn->connect_error) {
+            die("Error de conexión: " . $this->conn->connect_error);
+        }
+    }
+
+    // Método para ejecutar consultas SQL
+    public function query($sql) {
+        $result = $this->conn->query($sql);
+        return $result;
+    }
+
+    // Método para cerrar la conexión
+    public function close() {
+        $this->conn->close();
+    }
+}
+
+// Ejemplo de uso:
+/*
+$conexion = new MConexion();
+
+$sql = "SELECT * FROM tu_tabla";
+$resultado = $conexion->query($sql);
+
+if ($resultado->num_rows > 0) {
+    // Procesar los resultados
+} else {
+    echo "No se encontraron resultados.";
+}
+
+$conexion->close();
+*/
+
+?>
diff --git a/albion/PHP/main.php b/albion/PHP/main.php
@@ -0,0 +1,21 @@
+<?php
+// Incluir la clase de conexión
+include 'Modelo/MConexion.php';
+
+// Crear una instancia de la clase de conexión
+$conexion = new MConexion();
+
+// Ejecutar una consulta de ejemplo
+$sql = "SELECT * FROM items";
+$resultado = $conexion->query($sql);
+
+// Convertir el resultado en un array asociativo y enviarlo como JSON
+$rows = array();
+while($row = $resultado->fetch_assoc()) {
+    $rows[] = $row;
+}
+echo json_encode($rows);
+
+// Cerrar la conexión
+$conexion->close();
+?>
diff --git a/albion/SQL/sql.sql b/albion/SQL/sql.sql
@@ -0,0 +1,27 @@
+-- Crear la tabla "img"
+CREATE TABLE img (
+  nombre VARCHAR(20) PRIMARY KEY,
+  formato CHAR(3) CHECK (formato IN ('png', 'jpg'))
+);
+
+-- Crear la tabla "items"
+CREATE TABLE items (
+  identificador INT AUTO_INCREMENT PRIMARY KEY,
+  nombre VARCHAR(15) NOT NULL,
+  sub_nombre VARCHAR(35),
+  tier INT NOT NULL CHECK (tier >= 1 AND tier <= 8),
+  lv INT CHECK (lv >= 0 AND lv <= 4),
+  img_nombre VARCHAR(20),
+  FOREIGN KEY (img_nombre) REFERENCES img(nombre)
+);
+
+-- Crear la tabla "precios"
+CREATE TABLE precios (
+  identificador INT,
+  país ENUM ('pantano', 'montaña', 'bosque', 'desierto', 'pradera', 'medio'),
+  lugar ENUM ('ciudad', 'pueblo'),
+  precio INT,
+  orden_tipo ENUM ('de venta', 'de compra'),
+  PRIMARY KEY (identificador, país, lugar),
+  FOREIGN KEY (identificador) REFERENCES items(identificador)
+);