Gestión de venta de entradas de clubbing, conciertos y eventos
TEATRO DAW - Gestión de eventos y venta de entradas para el teatro.
| ID | Nombre | Github | |
|---|---|---|---|
| 1 | Alberto Acebes | a.acebes.2021@alumnos.urjc.es | alberr22 |
| 2 | Jon Mazcuñan | j.mazcunan.2022@alumnos.urjc.es | jonmazh |
| 3 | Alejandro Rico | a.rico.2022@alumnos.urjc.es | ALEJANDR0-RIC0 |
| 3 | Gaizka Arranbari | g.aranbarri.2022@alumnos.urjc.es | GaizkaURJC |
Representa los diferentes tipos de eventos que se pueden realizar en el teatro, como clubbing, conciertos y eventos corporativos.
- Atributos:
- ID
- Nombre
- Tipo [Clubbing, Concierto, Evento Corporativo]
- Fecha
- Hora
- Descripción
- Precio de entrada
- Capacidad máxima
- Entradas por vender
Representa las entradas vendidas para cada evento.
- Atributos:
- ID
- EventoID
- Precio
- Fecha de venta
- Estado [Disponible, Vendida]
Representa a los usuarios registrados en el sistema.
- Atributos:
- ID
- Nombre
- Contraseña (Hash)
- Teléfono
- TipoUsuario [Administrador, Registrado]
- Fecha de Registro
Representa las reservas realizadas para los eventos corporativos.
- Atributos:
- ID
- ClienteID
- EventoID
- Estado [Confirmado (Pagado), Pendiente, Cancelado]
- Fecha de Inicio
- Fecha de Fin
Representa los comemtarios realizados por los usuarios en los eventos .
- Atributos:
- Evento_ID
- ClienteID
- Comentario
- Fecha_Comentario
- Solo puede navegar por la web para:
- Consultar las fiestas disponibles, precios y lo que incluyen.
- Ver los conciertos anunciados.
- Consultar fotos de eventos realizados.
- Acción posible: Registro para transformarse en un usuario registrado.
- Debe autenticarse para:
- Comprar entradas de cualquier tipo.
- Dejar comentarios en eventos.
- Consultar el historial de compras.
- Solicitar presupuestos para eventos corporativos.
- Uso exclusivo para el jefe de sala.
- Puede realizar las siguientes acciones:
- Editar información de la web.
- Cambiar precios de entradas.
- Añadir/eliminar eventos (clubbing, conciertos).
- Confirmar o rechazar eventos corporativos.
- Gestionar usuarios registrados.
- Solo tiene permisos para navegar y registrarse.
- Permisos:
- Acceder y editar los datos de su cuenta.
- Consultar historial de pedidos.
- Borrar o editar sus comentarios en eventos.
- Permisos:
- Crear, editar y eliminar eventos.
- Confirmar o rechazar eventos corporativos.
- Gestionar cuentas de usuarios registrados.
- Acceso completo a las funciones de un usuario registrado.
Nuestra web permitirá:
- Subida de imágenes para avatares de usuarios y artistas en conciertos.
- Subida de fotos de eventos realizados en el teatro (solo por administradores).
- Gráfico de ocupación de sesiones de noche:
- Porcentaje de ocupación.
- Sexo de los clientes.
- Media de edad.
- Envío de correos electrónicos: Confirmación de creación de cuentas.
- Generador de PDFs: Presupuestos para eventos corporativos.
- Mapa interactivo: Ubicación del teatro.
Nuestra aplicación contará con un sistema de recomendación de eventos para usuarios registrados.
- Tipo: Filtrado basado en contenido.
- Lógica:
- Si el usuario ha asistido a eventos de un género musical específico, se le recomendarán eventos similares basados en descripción o tipo de evento.
- Implementación:
- Usar la base de datos para almacenar las preferencias de los usuarios.
- Consultas avanzadas para encontrar eventos similares.
Comenzamos la navegacion por nuestra pagina web en la pantalla principal, aqui he os optado por la simplicidad con un fondo de la sala de fiesta, arriba encontramos un header con un background-color transparente para darle un toque de elegancia, y donde encontramos una navegacion con la libreria aos, y un login donde el usuario, en caso de no ser anonimo pueda registrarse o iniciar sesion.
Una vez le das al icono de login, se desplegara un modal, en el que rellenando los campos de forma correcta, cada usuario podra acceder a su cuenta y poder realizar diversas funciones.
en caso de no tener cuenta, nuestra aplicacion te da la opcion de registrarte y asi poder obtener los permisos propios de cualquier usuario registrado. Añadiremos una cuenta especial, que sera con un correo especial, que sera la cuneta de administrador, el cual podra hacer funciones especiales y administrar la pagina.
La primera seccion de nuetra aplicacion web, encontramos la seccion de clubbing, la cual muestra las tres fiestas que se celebrar semanalmente en nuestra sala, el usuario podra elegir cualquiera de la tres para ver tematica, hora, precio, estadisticas varias, y en caso de estar registrado y loggeado, podra adquirir su entrada.
En esta seccion, encontramos los conciertos disponibles, donde el usuario podra elegir filtrar entre generos musicales, o navegar y ver todos los que hay disponibles. Si quiere consultar mas detalles de alguno de ellos, podra pinchar en el boton y consultar mas informacion, y en caso de estar registrado, comprar una o varias entradas.
En la parte de las pagina detalle, encontramos una foto del concierto en grande, con una descripcion y atributos del evento, ademas de un boton que te dejara comprar la entrada si estas registrado. Abajo encontramos los comentarios de la gente, con valoraciones.
Por ultimo encontramos la seccion de solicitud de evento corporativo, destinado a jefes o direccion de empresas, que quieran realizar algun tipo de evento para sus trabajadores, etc. El solicitante debera rellenar el fomrulario, y se le generara un pdf, con el presupuesto en base a lo que haya solicitado.
Por ultimo encontramos un footer sencillo, con distina infomracion de la sala y la empresa que la dirige, ademas de los links a las RRSS
Como se puede ver en el diagrama, de la página principal se puede ir al login, a la página de los conciertos o fiestas y a un form en el que se podrá solicitar un evento.
En la página de conciertos o fiestas, se va a poder comprar entradas y si se quisiese escribir un comentario.
En este nuevo diagrama de navegación se observa como ha mejorado la página respecto a la anterior fase. Empezando por la paleta de colores y el diseño de alguna de las páginas, como por la adición de nuevas páginas como la de admin y la implementación de todas las funcionalidades como por ejemplo que se vean a simple vista: el botón de cargar más y la posibilidad de añadir comentarios.
-
Abrir docker
-
Clonar el repositorio:
[git clone https://github.com/SSDD-2025/practica-sistemas-distribuidos-2025-grupo-13.git](https://github.com/CodeURJC-DAW-2024-25/webapp16.git)-
Configurar la base de datos:
Descargar Docker
Usuario:root| Contraseña:password| docker run --rm -e MYSQL_ROOT_PASSWORD=password -e MYSQL_DATABASE=sala_DB -p 3306:3306 --name mySQL_sala -d mysql:8.0.33 --max-allowed-packet=256M -
Compilar y ejecutar la aplicación:
Abrir el Docker y meterse en la conexión creada anteriormente
Run Application en VSCode con Spring Boot -
Acceder a la aplicación:
Ve a https://localhost/8080/
-
Java: JDK 21
- Windows: https://www.oracle.com/java/technologies/downloads/#jdk21-windows
- Linux:
sudo apt install openjdk-21
-
MySQL: v.8.0.33
- Windows: https://dev.mysql.com/downloads/installer/
- Linux:
sudo apt install mysql-server=8.0.33
-
Maven: 4.0.0
-
Spring Boot 3.4.2
-
Docker
-
VSCode + SpringBoot
A continuación se puede ver el diagrama de la base de datos, la cual ha cambiado bastante al propuesto en la preparación.

Cada miembro del equipo debe indicar su contribución en la práctica.
- Tareas realizadas
-
Implementación de la funcionalidad de tickets:
- Los tickets ahora se generan y son descargables desde el perfil del usuario, con la información obtenida de la base de datos.
-
Integración de iconos de inicio/cierre de sesión:
- Se añadieron iconos funcionales para las acciones de login y logout en la interfaz de usuario.
-
Desarrollo de la sección "Clubbing" desde la base de datos:
- La sección "Clubbing" ahora muestra información obtenida directamente de la base de datos, mejorando la dinámica del contenido.
-
Creación de la página de detalle de eventos:
- Se implementó una página de detalle para cada evento, con carga de datos e imágenes desde la base de datos.
-
Diseño de la página de detalle de conciertos con imágenes:
- Se diseñó la página de detalle de conciertos, incluyendo la visualización de fotos asociadas a cada concierto.
- Commits más significativos
Cada apartado realizado está separado por varios commits, no está todo el contenido en uno solo:
- Commit 1: Implementación de la funcionalidad de tickets descargables desde el perfil del usuario.
- Commit 2: Integración de iconos funcionales para las acciones de login y logout.
- Commit 3: Desarrollo de la sección "Clubbing" con datos obtenidos desde la base de datos.
- Commit 4: Creación de la página de detalle de eventos con carga de datos e imágenes desde la base de datos.
- Commit 5: Diseño de la página de detalle de conciertos con visualización de imágenes asociadas.
- Ficheros en los que se ha participado
-
src/main/java/com/daw/daw/PageController.java`
- Controlador principal que gestiona las rutas y la lógica de navegación de la aplicación.
-
src/main/java/com/daw/daw/controller/TicketController.java- Controlador encargado de la gestión y generación de tickets para los usuarios.
-
src/main/resources/templates/paginaPerfil.html- Plantilla que define la estructura y el diseño de la página de perfil de usuario.
-
src/main/resources/templates/clubing.html- Plantilla que muestra la sección "Clubbing" con información dinámica obtenida de la base de datos.
-
src/main/java/com/daw/daw/controller/EventController.java- Controlador responsable de la gestión de eventos, incluyendo la carga de datos y la interacción con la base de datos.
-
Tareas:
- Implementacion de docker para la base de datos SQL de nuestra aplicacion en Springboot, creando una imagen en un container llamado mySQL_sala, a la cual accedemos con un usuario y contraseña especificados en el archivo start_db.sh
- Creacion y gestion de todo lo relacionado con los usuarios de la aplicacion, tanto la precarga de un usuario prueba y un unico usuario ADMIN, tanto como el registro y el loggin de todos los potenciales clientes de manera que todo quede registrado en la base de datos para poder consultar dicha informacion.
- Implementacion de toda la seguridad que maneja el flujo y la proteccion de los datos y las ventanas de nuestra aplicacion web, de manera que a determinadas paginas o funciones solo puede acceder un usuario con un determinado roll, ya sea "USER" o "ADMIN", el usuario anonimo solo podra navegar por la pagina principal.
- Implementacion de tecnologia como el generador de pdfs al solicitar una reserva para un evento corporativo, ademas de la creacion de un algoritmo de recomendacion de conciertos a usuarios dependiendo de las categorias de sus compras pasadas y la autenticacion https, generando un autocertificado firmado por nuestro grupo para implementar el protocolo https.
- Creacion de la entidad de comentarios, creando una base de datos donde se guarda el usuario autor del comentario, el id del evento sobre el que se realiza el comentario, el propio texto que contiene el comentario y su valoracion, para su posterior implementacion.
-
5 commits más significativos (cada apartado realizado está separado por varios commits, no está todo el contenido en uno solo): Commit 1 : Base de datos en Docker Commit 2 : Arreglado videos, boton cargar mas y pdf Commit 3 : Event y User Commit 4 : HTTPS Commit 5 : Admin y Security
-
5 ficheros en los que se ha participado:
src/main/java/com/daw/daw/controller/UserController.java-Controlador de todos los usuarios una vez creada la entidad User.javasrc/main/java/com/daw/daw/security/Security.java-Seguridad de toda la aplicacion con SpringSecuritysrc/main/java/com/daw/daw/model/Event.java-Creacion de tablas en base de datos con todos los atributos y campos necesrios para su implementacionsrc/main/java/com/daw/daw/service/PdfService.java-Implementacion de la tecnologia PDFsrc/main/java/com/daw/daw/service/DataBaseinitializer.java-Carga de datos por defecto en las tablas generadas en la base de datos
- Tareas:
- Filtro de conciertos: filtro que muestra los conciertos por género cuando se pulsa (rock, trap, flamenco...).
- Botón de cargar más: función que carga solo 4 conciertos hasta que se pulsa nuevamente y muestra 4 más (esta función estaba implementada antes pero se tube que hacer nuevamente porque chocaba con el filtro y no funcionaba bien).
- Comprar tickets: función que tras rellenar el formulario de la compra de tickets se guarda en base de datos.
- Crear un evento: lógica y formulario para la creación de conciertos y fiestas.
- 5 commits más significativos : Algunos commits no tienen toda la lógica o les falta un poco, pero son los principales.
- 5 ficheros en los que se ha participado:
-
src/main/java/com/daw/daw/TicketController.java`
- Controlador que se encarga de las funciones de los tickets, en este caso en concrerto crear tickets y descargarlos.
-
src/main/java/com/daw/daw/controller/Ticket.java- Modelo para las tablas de base de datos de los tickets con sus atributos y sus geters y seters.
-
'src/main/java/com/daw/daw/EventController.java`
- Controlador de los eventos (conciertos y fiestas) con sus funciones como crearConcierto o crearFiesta.
-
src/main/resources/static/js/validaciones.js- Archivo con el código para la validación en tiempo real de los forms de login y singup.
-
src/main/resources/static/js/filtroConciertos.js- Archivo con el código para el filtro de elementos y el cargar más.
-
Tareas:
- Funciones del administrador: Eliminacion de usuarios y diferentes tipos de eventos, aceptacion/rechazo de entrevistas.
- Implementacion del algoritmo de recomendación de conciertos.
- Extraccion de comentarios de la base de datos.
- Grafico que muestra la distinccion por generos a la hora de comprar entradas.
-
5 commits más significativos:
-
Commit 1: Arreglo de creación de fiestas y js para la pagina admin.
-
Commit 2: Se ponen todas las funciones necesarias para el administrador.
-
Commit 3: Ordenados los conciertos para cada usuario.
-
Commit 4: Grafico distribucion de genero
-
Commit 5: Admin totalmente funcional
-
5 ficheros en los que se ha participado:
-
src/main/resources/templates/admin.html`
- Todas las funcionalidades y redirecciones de esta pagina.
-
src/main/java/com/daw/daw/controller/EventController.java- Añadida la funcion de eliminacion de eventos, añadido datos de genero y arreglo de creacion de fiestas.
-
src/main/java/com/daw/daw/PageController.java- Implementado el algoritmo para ordenar conciertos segun preferencias.
-
src/main/resources/template/clubing.html- Añadido el grafico de distribución de genero
-
src/main/resources/js/adminSection.js-Creacion del JavaScript para gestionar las diferentes secciones de admin.
📌 Práctica 2: Incorporación de una API REST a la aplicación web, despliegue con Docker y despliegue remoto
Para ejecutar correctamente la aplicación utilizando docker-compose.yml, es necesario cumplir con los siguientes requisitos previos: Tener instalado Docker y Docker Compose en el sistema. Contar con el archivo docker-compose.yml correctamente configurado.
- Levantar el contenedor de la base de datos MySQL ejecutando el siguiente comando:
docker run --rm -e MYSQL_ROOT_PASSWORD=password -e MYSQL_DATABASE=sala_DB -p 3306:3306 --name mySQL_sala -d mysql:8.0.33 --max-allowed-packet=256M- Construir la imagen de la aplicación web desde el Dockerfile:
docker build -t webapp:latest .- Ejecutar la aplicación completa (base de datos + backend/frontend) mediante Docker Compose:
docker-compose upUna vez que todos los servicios estén en funcionamiento, se podrá acceder a la aplicación desde el navegador web. La URL dependerá del puerto configurado en el contenedor web: https://localhost:8443/
Primero, asegúrate de que los repositorios estén actualizados y luego instala Docker y Docker Compose:
# Actualizar repositorios
sudo apt-get update
# Instalar dependencias base
sudo apt-get install ca-certificates curl
# Agregar repositorio oficial de Docker
sudo install -m 0755 -d /etc/apt/keyrings
sudo curl -fsSL https://download.docker.com/linux/ubuntu/gpg -o /etc/apt/keyrings/docker.asc
echo "deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.asc] https://download.docker.com/linux/ubuntu $(. /etc/os-release && echo "$VERSION_CODENAME") stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
# Instalar Docker Engine y Compose
sudo apt-get update
sudo apt-get install docker-ce docker-compose-plugin
# Verificar instalación
sudo docker --version && sudo docker compose versionInstala Maven para compilar el proyecto:
sudo apt-get install maven -y
mvn -versionClona el repositorio de GitHub:
git clone https://github.com/CodeURJC-DAW-2024-25/webapp16
cd webapp16Compila el proyecto con Maven:
mvn clean package -DskipTestsInicia un contenedor MySQL con Docker:
sudo docker run --rm \
-e MYSQL_ROOT_PASSWORD=password \
-e MYSQL_DATABASE=sala_DB \
-p 3306:3306 \
--name mySQL_sala \
-d mysql:8.0.33 \
--max-allowed-packet=256MConstruye la imagen Docker de la aplicación:
sudo docker build -t webapp:latest .Inicia los servicios con Docker Compose:
sudo docker compose up- Tareas:
- API REST de las reservas (bookings).
- Arreglo de la API REST de tickets.
- Controlador API para el gráfico del porcentaje de personas de cada sexo que van a una fiesta.
- Documentar y arreglar la indentacion del programa entero.
- 4 commits más significativos : Algunos commits no tienen toda la lógica o les falta un poco, pero son los principales.
- 5 ficheros en los que se ha participado:
-
'src/main/java/com/daw/daw/API/TicketRestController.java`
-
'src/main/java/com/daw/daw/API/StatisticsController.java`
-
'src/main/java/com/daw/daw/controller/MVC/ReservaMVCController.java`
-
'src/main/java/com/daw/daw/dto/BookingMapper.java`
-
src/main/resources/static/js/main.js
- Tareas:
- API REST de los tickets.
- Despliegue en maquina virtual
- Añadir funcion de eliminar comments a admin.
- Arreglo pagina detalle conciertos.
- 4 commits más significativos : Algunos commits no tienen toda la lógica o les falta un poco, pero son los principales.
- 5 ficheros en los que se ha participado:
-
'src/main/java/com/daw/daw/API/TicketRestController.java`
-
'src/main/java/com/daw/daw/dto/TicketDTO.java`
-
src/main/resources/static/templates/paginaDetalleConcierto.html -
src/main/resources/static/templates/admin.html -
src/main/resources/static/js/AdminSection.js
- Tareas:
- API REST de Usuarios y Comentarios.
- Implementacion de Docker y Docker-Compose
- Toda la gestion e implementacion de la seguridad de la API REST.
- Importacion y eliminacion de imagenes, paginacion y limpieza de codigo.
- 4 commits más significativos : Algunos commits no tienen toda la lógica o les falta un poco, pero son los principales.
- 5 ficheros en los que se ha participado:
-
'src/main/java/com/daw/daw/controller/API/UserRestController.java`
-
'src/main/java/com/daw/daw/controller/API/CommentRestController.java.java`
-
'src/main/java/com/daw/daw/security/jwt`
-
'webapp16/docker-compose.yml`
-
'src/main/java/com/daw/daw/controller/auth/LoginRestController.java`
- Tareas:
- API REST de Eventos.
- Pluggin de Maven para documentacion del PostMan,
- Correccion de nombres de clases y variables.
- Arreglo de los Comenatarios.
- 4 commits más significativos : Algunos commits no tienen toda la lógica o les falta un poco, pero son los principales.
- 5 ficheros en los que se ha participado:
-
'src/main/java/com/daw/daw/controller/API/EventRestController.java`
-
'webApp/api-docs`
-
'src/main/java/com/daw/daw/controller/API/ComentRestController.java`
-
'src/main/java/com/daw/daw/service/EventService.java`
-
'src/main/java/com/daw/daw/service/CommentService.java`
Sigue estos pasos para configurar y ejecutar la aplicación Angular en tu entorno local.
- Node.js
- npm (viene incluido con Node.js)
- Angular v17.x.x
- Docker & Docker-Desktop
- Java 21
- JDK 21
- Clonar el repositorio
Ve a la carpeta donde deseas guardar el proyecto y ejecuta:git clone [[URL_DEL_REPOSITORIO]](https://github.com/CodeURJC-DAW-2024-25/webapp16)
- Dirigirse a la carpeta de frontend
cd \webapp16\
- Instalar dependencias
npm install
- Ejecutar el docker-compose
docker-compose Build
- Levantar el docker-compose
docker-compose up
- Acceder a la url
La url del proyecto en local es la siguiente:
https://localhost:433
- Acceder a la url de angular
La url del proyecto en local de la parte de angular es la siguiente:
https://localhost:433/new
Albero Acebes Sánchez
-
Tareas Realizadas
- Migracion a angular.
- Login y Registro de Usuarios.
- Implemenatcion de Angular en la pagina Principal.
- Solicitud de Reservas y tecnologia PDF.
-
Commits más significativos :
-
Ficheros en los que se ha participado :
/webapp16/src/app/services/login.service.ts/webapp16/docker-compose.ymlwebapp16/src/app/components/singup-modal/webapp16/src/app/pages/home/webapp16/angular.json
Gaizka Aranbarri Berasaluze
-
Tareas Realizadas
- Migracion pagina administrador
- Funciones de eliminar objetos
- Solucionar errores varios en login
- Modales de creacion de eventos
-
Commits más significativos :
-
Ficheros en los que se ha participado :
- 'frontend/src/app/pages/admin/admin.component.ts`
- 'frontend/src/app/pages/admin/admin.component.html`
- 'frontend/src/app/components/concert-modal/concert-modal.component.ts`
- 'frontend/src/app/components/concert-modal/concert-modal.component.ts`
frontend/src/app/components/gender-chart/gender-chart.component.ts
Alejandro Rico González
-
Tareas Realizadas
- Migración de la página de clubbing
- Diseño y funcionamiento de modales de login, singup y compra
- Implementación gráfica
- Documentación
-
Commits más significativos :
-
Ficheros en los que se ha participado :
- 'frontend/src/app/components/buy-modal/buy-modal.component.ts`
- 'frontend/src/app/pages/clubbing/clubbing.component.ts`
- 'frontend/src/app/components/singup-modal/singup-modal.component.ts`
- 'frontend/src/app/pages/clubbing/clubbing.component.html`
frontend/src/app/app.routes.ts
Jon Mazcuñan Hernandez
-
Tareas Realizadas
- Realización de la página de conciertos
- Realización de la página de perfil, y añadido en cabecera
- Implementación de las peticiones relacionadas con tickets
- Implementación de la funcion de cargar más
-
Commits más significativos :
-
Ficheros en los que se ha participado :
- 'comment.service.ts`
- 'profile.component.ts`
- 'concert.component.ts`
- 'comment-modal.component.ts`
buy-modal.component.ts












