RB MUSIC
“RB TICKETS”
Responsables:
ALAN OSSIEL ORTEGA DÍAZ
MAGDALENO MARTÍNEZ UNZUETA
Independencia 7A, Alfredo Barba, Jalisco
15 de octubre de 2024
Introducción:
RB Music S.A. de C.V. Requiere un sistema de tickets el cual será desarrollado a
base un plan de trabajo, por el ING. Magdaleno Martínez Unzueta, y el ING. Alan
Ossiel Ortega Díaz.
El Sistema contará de varios módulos, que permitirán la administración de los
mismos.
Problemas a Resolver:
● Crear Sistema de Tickets Para RB MUSIC S.A. de C.V
Actualmente, la empresa se encuentra en proceso de expansión, por lo que,
contratar a ticketeras externas para eventos propios de la empresa es
inconveniente, ya que, cobran cierta comisión por usar su sistema, imprimir los
boletos y llevar el control de los accesos al evento.
Objetivo General:
● Crear Sistema de Tickets Para RB MUSIC S.A. de C.V con el propósito de
abrir esta nueva Sub-Empresa que permitirá tener control total de venta de
boletos, Secciones, Escenarios, Usuarios, Boletos, Puntos De Venta, Artistas,
Mesas, Asientos, etc.
PROCEDIMIENTO Y DESCRIPCIÓN DE LAS
ACTIVIDADES REALIZADAS:
Para el desarrollo de este proyecto que se realizará para RB MUSIC, S.A. DE C.V.
Se utilizará la plataforma de colaboración en programación BitBucket conectado a
la cuenta de [email protected] la cual se llevará a cabo en conjunto con el
ING. Magdaleno Martínez Unzueta con el correo [email protected], Al igual
que para programar las tareas se estará utilizando la plataforma Jira. Se utilizará
lenguaje de programación C# para el desarrollo de este sistema, en el CCS Visual
Studio y para el front-end utilizaremos Blazor, CSS y Javascript. Para la base de
datos utilizaremos SQL Server.
Semana 1
Configuraciones iniciales
● Documento preliminar de las funcionalidades y los alcances de cada
una.
● Diseño y arquitectura del sistema
○ API -> .NET 8
○ Front -> Blazor Web Assembly
○ Base Datos -> SQL Server
● Implementación de la metodología Engrama para un desarrollo
eficiente y eficaz.
● Configuración del Repositorio Bitbucket
● Configuración del servidor de publicación, base de datos y entorno de
implantación pruebas.
● Diagrama preliminar de base de datos.
Semana 2
Autenticación y autorización
● Registro y acceso a los usuarios por roles.
● Configuración de los módulos del sistema
○ Punto de venta
○ Administración
● Eventos
● Locaciones
● Usuarios administrativos
● Clientes
● Estadísticas
○ Taquilla
○ Recepción QR
● Seguridad por roles y autorización en cada módulo.
Semana 3
Módulo Administración
● Creación de la base de datos según el diseño de la base de datos preliminar.
● Desarrollo de la funcionalidad para dar de alta las locaciones
○ Dar de alta el total de zonas
○ Precio de cada zona
○ Cantidad de boletos por cada zona
○ Mapa del lugar para ver la ubicación de la zona.
● Desarrollo de la funcionalidad para dar de alta los eventos
○ Seleccionar una locación para determinar la cantidad de boletos.
○ Detalles del evento
● Fechas, horarios, detalles, etc.
○ Artista
Semana 4
Boletos y taquilla
● Plantilla para la impresión del boleto
○ Cada impresión de boleto se guardará en la base de datos con
Número de identificación y cliente al que estará asociado.
● Pantalla de taquilla para la venta de boletos físicos.
○ Proceso de selección de evento, tipo de boleto, área entre otros
detalles en la selección del boleto.
○ Formulario para los datos del cliente
○ Registro de tipo de pago para control de ingresos.
● Impresión del boleto
Semana 5
Formulario de compra público general
● Proceso de venta de boleto
○ Formulario de datos del cliente
○ Implementación de método de pago
○ Generación de QR y PDF del boleto.
● Módulo de lectura de QR para poder registrar el ingreso de la persona
Semana 6
Estadísticas
● Listado de eventos y los detalles de cada uno.
● Gráficas del total de boletos vendidos por evento.
● Total de dinero recaudado en cada uno.
● Detalle de cuantos boletos de cada tipo fueron vendidos.
Semana 7 y 8
Pruebas generales del sistema
● Verificar que todos los módulos y las funcionalidades cumplan con la finalidad
esperada.
● Ajusten en diseño o proceso para una mejor experiencia de usuario o de
técnico.
Semana 9
Implementación
● Configuración del entorno de implementación de la aplicación final.
○ Estos deben de ser proporcionados por la empresa.
○ Dominio.
○ Base de datos
Semana 10
Compensaciones
● Semana de compensación por retrasos o complicación en el proceso de
desarrollo
● (No importa que tan profesional este el desarrollo, siempre salen
imprevistos)
Alcance del proyecto:
1. Modulo Login
Describir la funcionalidad esperada del login.
En el módulo de login solo podrán ingresar usuarios que se registren directamente
en el sistema, dados de alta por el administrador (por el momento). Ingresarán con
un correo y una contraseña. Por lo tanto, un correo que no exista en la base de
datos USUARIO no podrá acceder y deberá aparecer un mensaje: “Correo
electrónico o contraseña son incorrectos”.
Sería ideal en un futuro crear un método para que cuando un usuario inicie una
sesión, el administrador pueda ver qué usuarios tienen una sesión activa.
Recuperación de contraseña:
Envío de correo de recuperación: Si un usuario olvida su contraseña, permite
solicitar un enlace a su correo electrónico para restablecerla. Este enlace puede
tener un tiempo de caducidad para mayor seguridad.
2. Módulo Registro
Funcionalidad
El administrador debe ser capaz de dar de alta usuarios por medio de un formulario
de registro, el cual pedirá Nombre, correo electrónico y contraseña.
El nombre puede ser cualquiera, y puede repetirse las veces que sea necesario,
debe comenzar con una letra mayúscula, puede poner un segundo nombre, puede
poner un punto final, no debe haber símbolos o números.
La contraseña debe:
● Contener al menos 6 dígitos.
● Incluye una letra mayúscula.
● Incluye una letra minúscula.
● Incluye por lo menos 1 número.
● Opcional agregar símbolos.
Correo electrónico: Tras el registro, se puede enviar un correo de verificación para
confirmar que el email proporcionado es válido. Esto mejora la seguridad y evita
registros falsos.
Fecha de Registro: Se generará automáticamente al momento del alta.
Rol: Asignación de un rol. Esto puede variar entre roles como "Administrador",
"Punto de venta", "Checador de tickets", “Reportes y Finanzas”, “Gestor de
Eventos”,etc.
Módulo Usuarios:
Datos que debe tener un usuario:
IdUsuario, Nombre, Contraseña, Correo electrónico, Fecha de registro y Rol.
Funcionalidad:
● Los usuarios tendrán acceso a la plataforma según los permisos asignados a
su rol.
● Edición de perfil por parte del usuario: Permitir a los usuarios actualizar
ciertos detalles de su perfil (nombre, correo) desde una interfaz de cuenta
personal.
● Los usuarios podrán cambiar su contraseña, verificando primero la
contraseña actual, después vendrán dos campos más, donde en el primero
pondrá la contraseña nueva y el último para comprobar que son iguales las
contraseñas.
Módulo Roles
Datos que debe tener un Rol.
IdRol, Nombre del Rol, Status (Activo o Inactivo)
Funcionalidad:
● El módulo de roles permitirá definir los permisos y accesos que cada usuario
tendrá dentro del sistema.
● Cada usuario registrado debe tener un rol asignado, y estos roles determinan
qué acciones pueden realizar dentro de la plataforma (e.g., administrar
eventos, vender boletos, ver reportes).
● Los roles podrán ser creados, editar el nombre y eliminados por el
administrador principal.
Tipos de Roles:
Administrador:
Descripción: Tiene acceso completo a todas las funciones del sistema. Puede
gestionar usuarios, eventos, boletos, reportes, zonas y precios. También puede
acceder al punto de venta, checador de tickets y reportes financieros.
Permisos:
● Crear, modificar y eliminar usuarios
● Crear, modificar y eliminar roles en caso de que no tenga usuarios activos.
● Gestionar eventos, artistas y escenarios.
● Acceso al punto de venta.
● Acceso al módulo de estadísticas/ganancias.
● Control total de boletos (generar, vender, apartar, ver QR, escanear, imprimir).
● Ver y modificar precios.
Funcionalidades Extra:
● Suspender cuentas: El administrador podrá suspender o bloquear
temporalmente el acceso a ciertos usuarios (esto en un futuro nos servirá en
caso de que se desee rentar el sistema).
● Reactivación de cuenta: El administrador podrá reactivar cuentas bloqueadas
o suspendidas.
● Bloqueo automático: Establecer un sistema de bloqueo automático tras varios
intentos fallidos de inicio de sesión para evitar ataques de fuerza bruta o
también para bloquearlos después de cierto tiempo de uso (en caso que se
llegue a rentar el sistema).
● Búsqueda por rol, estado, fecha de registro, etc.: Permitir que los
administradores filtren y busquen usuarios por diferentes criterios para
facilitar la gestión.
● Ordenar por actividad reciente o roles: Posibilidad de ordenar la lista de
usuarios por actividad, nombre, rol o estado.
● Historial de actividad: El administrador puede ver las últimas acciones del
usuario y revisar si hay intentos de inicio fallidos.
Supervisor:
Descripción: Similar al administrador, pero con limitaciones. Ideal para jefes de
equipo que supervisan varias áreas, pero no tienen control total.
Permisos:El rol de Supervisor tendrá acceso a:
● Crear y editar artistas.
● Crear y editar escenarios.
● Crear y editar zonas.
● Crear y editar boletos.
● Crear y editar eventos.
Restricciones:
● No puede crear ni eliminar usuarios.
● No puede crear ni modificar roles.
● Solo podrá eliminar, modificar y acceder a los elementos que él mismo haya
creado (eventos, artistas, escenarios, zonas, boletos).
● Podrá acceder a las finanzas de los eventos que haya creado, pero no podrá
modificar ni eliminar información financiera de otros supervisores.
Gestor de Eventos
Descripción: Este rol está orientado a la persona encargada de gestionar y
coordinar los eventos dentro del sistema. Puede crear, modificar y eliminar eventos,
asignar artistas y escenarios, pero no tiene acceso a ventas o finanzas.
Permisos:
● Crear, modificar y eliminar eventos.
● Crear, modificar y eliminar artistas.
● Asignar artistas a los eventos.
● Gestionar escenarios y zonas.
● No tiene acceso a la venta de boletos ni a reportes financieros.
Punto de Venta
Descripción: Este rol está destinado a aquellos que trabajarán en la venta directa
de boletos, ya sea en taquilla física o a través de una plataforma online.
Permisos:
● Acceso al módulo de venta de boletos.
● Ver inventario de boletos disponibles.
● Marcar boletos como vendidos.
● Imprimir boletos.
Checador de Tickets
Descripción: El rol se centra en la verificación de los boletos a la entrada de los
eventos. Los usuarios con este rol podrán escanear códigos QR y validar la
autenticidad del boleto.
Permisos:
Escaneo de códigos QR.
Ver el estado de cada boleto (disponible, vendido, apartado).
Reportes y Finanzas
Descripción: Usuarios con este rol podrán ver gráficos y estadísticas relacionadas
con la venta de boletos, el aforo de los eventos, y el rendimiento financiero de los
mismos.
Permisos:
● Acceso a reportes de ventas, ganancias, boletos vendidos y apartados.
● Visualización de gráficos financieros y estadísticas.
Limitaciones:
No tiene acceso a la creación de eventos o a la gestión de boletos.
Desarrollo:
Bitbucket:
● Crear cuenta en Bitbucket con las credenciales de la empresa.
● Crear proyecto y repositorio en Bitbucket y agregar a
[email protected] como colaborador.
● Tener en cuenta que el código debe de ser privado.
La cuenta con la que se créo bitbucket es [email protected].
Se creó el proyecto RBTICKETS junto con su Repositorio RBTICKETS y su carpeta
“main” donde se le harán las respectivas modificaciones conforme se vaya
modificando el código. También se le envió la invitación a Magdaleno para que
pudiera colaborar y actualizar las versiones.
Crear cuenta de Azure:
Crear Cuenta de Somee y agregar la base de datos al Proyecto Visual
Studio 2022:
Creamos la cuenta gratuita que nos da 30mb de almacenamiento para crear nuestra
base de datos de pruebas con el mismo correo y contraseña.
Copiamos la cadena de conexión y se pega en Visual Code, para agregar la
conexión.
Definición de cómo se trabajará remotamente:
Para trabajar remotamente, el ING. Magdaleno, insertó en el repositorio el proyecto
inicial para trabajar, el cuál fungirá como proyecto base del mismo.
Tenemos diferentes branches, que son los puntos donde publicaremos nuestras
versiones del sistema. En la versión DEV, es la versión en desarrollo, una vez
aprobada la versión, se publica en el main.
Sesión 2 - Organizando trabajo Online 15-10-24 .mp4
En esta sesión se habla todo para el desarrollo del sistema vía remota.
Sesión 3 - Definición de Alzances del Proyecto Y Aplicando Commits Al Proyec…
Sesión 4 - Funcionalidades a la base de datos 16-10-2024.mp4
Desarrollo y Código:
El día 17 de octubre tuvimos una sesión dónde se explicó cómo es la utilización de
Engrama para nuestro proyecto. Engrama es una herramienta desarrollada por el
ING Magdaleno, la cual nos proporciona código pre-hecho a partir de la conexión a
la base de datos previamente creada con Somee. A partir de la cadena de conexión,
engrama puede acceder a las tablas que fueron creadas, y como las tablas ya
tienen una estructura de qué datos y tipo de datos deben llevar, nos da código el
cual podemos utilizar para programar y no tardarnos tanto en el desarrollo.
Todo esto lo vimos en una sesión el día 17 de octubre.
Sesión 5 - Encuadre a Engrama, Programación de las primeras clases 17-10-2…
Para la programación, será de manera estructurada. Siguiendo la siguiente imagen:
1. Cliente:
● Es quien inicia la interacción con el sistema. Puede ser una persona
utilizando una aplicación web, móvil o de escritorio.
● El cliente envía una solicitud al sistema, por ejemplo, para obtener
información, crear un nuevo registro o actualizar uno existente.
2. API (Interfaz de Programación de Aplicaciones):
● Es la puerta de entrada al sistema. Recibe las solicitudes del cliente y las
envía al componente correspondiente para su procesamiento.
● Actúa como un intermediario entre el cliente y el servicio, ocultando la
complejidad interna del sistema.
3. Servicio:
● Es el componente principal del sistema, responsable de procesar las
solicitudes del cliente.
● Contiene la lógica de negocio y las reglas que definen cómo se deben
procesar los datos.
● Interactúa con el repositorio para acceder y modificar los datos.
4. Repositorio:
● Es la capa de acceso a datos. Se encarga de interactuar con la base de
datos para almacenar y recuperar información.
● Aísla la lógica de negocio del acceso a la base de datos, lo que facilita el
mantenimiento y la evolución del sistema.
5. Base de Datos:
● Almacena la información del sistema de forma persistente.
6. Interfaces:
● Son los puntos de conexión entre los diferentes componentes del sistema.
● Permiten que los componentes se comuniquen entre sí de forma
estandarizada.
7. Dominio:
● Representa las entidades y reglas de negocio del sistema.
● Define las estructuras de datos y las operaciones que se pueden realizar
sobre ellas.
Flujo de una solicitud:
1. El cliente envía una solicitud a la API.
2. La API redirige la solicitud al servicio correspondiente.
3. El servicio procesa la solicitud, interactuando con el repositorio si es
necesario.
4. El repositorio accede a la base de datos para obtener o modificar la
información.
5. El servicio devuelve una respuesta a la API.
6. La API envía la respuesta al cliente.
Programación de un Módulo (Roles) Desde 0:
Capa Infraestructura:
Antes de entrar a la programación en Visual Studio, primero tenemos que crear
nuestra tabla en la base de datos. Lo cual, gracias a Engrama nos ahorrará mucho
tiempo de código.
Esto se hará para cada uno de los módulos que se vayan creando. Para comenzar,
accedemos a engrama y en la sección de CommonScripts tenemos plantillas para
crear una base de datos, modificar, y otras cosas más.
Vamos a crear la base de datos, primero en Azure SQL, vamos a agregar el código
correspondiente a la tabla que crearemos.
IF NOT EXISTS (SELECT * FROM sysobjects o WHERE o.NAME = 'Roles')
BEGIN
CREATE TABLE Roles(
iIdRoles INT NOT NULL IDENTITY(1, 1)
CONSTRAINT PK_Roles
PRIMARY KEY (iIdRoles),
vchNombre VARCHAR(50) NOT NULL,
bEstatus BIT NOT NULL
)
END
Una vez que ya esté bien estructurada la tabla, le vamos a dar en arrancar para que
después nos cree la tabla en la Base de Datos de nuestra conection string. Luego
podemos acceder a engrama, para poder ver que ya tenemos nuestra tabla creada:
Del cual, en la sección de abajo tendremos los Procedimientos Almacenados que
podemos hacer, que son los métodos Get para obtener y Save para crear.
Engrama proporciona el código pre-hecho a base de los datos de la tabla y
podemos copiar el código y pasarlo directamente a nuestro Azure SQL para poder
crear el Procedimiento Almacenado y que quede guardado en nuestra base de
datos para poder mandarlo llamar desde nuestra API.
Ya que tenemos el código en Azure SQL, le vamos a dar en ejecutar y se nos va
actualizar nuestra base de datos, agregando automáticamente este método. Al cual
si ya todo sale bien, ahora lo que sigue es programar todo desde Visual Studio para
poder crear nuestros métodos, donde el usuario vendrá a hacer las peticiones de la
información que desea, ya sea para obtener información, crear nueva información,
entre otras cosas.
Para la creación de este módulo primero se tiene que acceder a Engrama Levels,
donde dentro tenemos los niveles de que se mencionaron anteriormente:
Primero que nada tenemos que manipular lo que es Infraestructura, crearemos una
clase en la carpeta Repository, que se llamará UsuariosRepository.cs. Que aquí
estarán los métodos asíncronos para la lógica del negocio. Se creará
UsuariosRepository debido a que un rol es un Usuario y no puede existir primero un
rol antes que un usuario. Por lo tanto, dentro del módulo de Usuarios tendremos los
métodos Get y Post (Para obtener información o mandar información), tanto para los
roles de usuario como para los usuarios mismos.
También al mismo tiempo, creamos la interface de Usuarios el cual se llamará
IUsuariosRepository.cs al cuál aquí le haremos llegar todos los métodos que
creemos que el cliente mandará llamar.
Luego en UsuariosRepository solo se le integra la interface y se implementa el
IDapperManagerHelper que es el que nos ayudará a consultar la base de datos.
Después de integrar esto, Ya podemos crear nuestros métodos, en este caso el
método GetAll Roles, para obtener una lista de todos los roles que tiene nuestra
base de datos.
Donde aquí lo que se hace es llamar al spGetRoles, que posteriormente de agregar
este código en el repositorio, tenemos que agregar el método spGetRoles abajo de
toda la Raíz en RBTickets.Share, dentro de nuestras dependencias Entidades, para
esto, engrama ya nos proporciona el código correspondiente a la clase Entidad.
Ya solo se copia ese código, se pega en el lugar correspondiente:
Luego de esto, tenemos que regresar a la clase UsuarioRepository, para que el
método que creamos que es spGetRoles, lo mandemos a la Interface. Solo le
damos click derecho y exportar a IUsuarioRepository.
Lo que esto, hará que se comunique la interface con nuestra clase Respository.
Una vez que hemos llegado aquí, ya tenemos lista nuestra capa de Infraestructura.
Seguimos con la programación en la capa de dominio.
Capa Dominio:
Para empezar con la programación de la capa dominio, primero tenemos que
empezar con la capa de Core, la cual vamos a llamar UsuarioDominio.cs. En esta
capa también tenemos que mandar llamar a la interfaz IUsuarioDominio.cs, la cual
tenemos que crear en su respectiva carpeta Interfaces.
Tenemos que mandar llamar las clases IConfiguration, IUsuariosRepository que es
donde tenemos nuestros métodos asíncronos, también IMapper y el
IResponseHelper y nombrarlos para después mandarlos llamar dentro de esta
clase.
Nos meteremos a engrama, para seleccionar la capa Dominio, copiar el código y
pegarlo en la respectiva clase.
Engrama es una gran herramienta que ya nos proporciona el código solo para
insertarlo en Visual Studio.
La cual, aquí ya tendremos nuestro código casi listo, pero falta mandar el método
GetRoles a IUsuarioDominio. Para esto con click derecho y mandar a la clase que
queda.
Mandar llamar los servicios:
Una vez que ya tenemos programada la capa Interface y la capa Dominio, tenemos
que meter esta lógica al programa principal, la cual es la clase program.cs.
Aquí se mandan llamar las interfaces IUsuariosRepository y IUsuarioDominio.
Mapear los métodos para que nos devuelva información:
Para esto, tenemos que acceder a la carpeta Helpers, la cual tendrá este archivo
llamado MappingProfiles, que nos permite mapear los métodos que creamos. Para
sacar el código que tenemos que colocar. Primero que nada tenemos que ingresar a
engrama, y en los métodos almacenados vamos a encontrar una columna llamada
config, en la cual nos proporciona el código de mapeo.
Luego en la clase correspondiente se agrega el código y ya tendremos listo nuestro
módulo para poder consultar nuestra Api.
Una vez que se mapean los perfiles de las tablas que vamos ocupar, simplemente
ya podremos arrancar el proyecto
Después de crear todos los controladores con sus respectivos objetos, repositorio y
la capa dominio se procederá a crear las interfaces. Que es la parte más compleja
de todo el desarrollo, ya que aquí vendrá toda lo que el usuario verá en el front end,
y debe haber un correcto funcionamiento de enviar datos, recibirlos, etc.
Para empezar, utilizaremos ahora la parte de PWA, donde aquí se agregan todas las
áreas que vamos a usar para la creación de cada módulo.
En esta sección se crean carpetas en Areas, donde tenemos las áreas de Artistas,
Escenarios, Eventos, Usuarios, Login, Las páginas principales. Y la manera en que
trabajaremos es la siguiente: Cada área tiene su página padre, y cada página padre
manda llamar sus componentes hijos, para que cuando ocupe de uno o de otro, solo
oculte la información de un componente hijo y muestre el que quiero mostrar.
Tenemos la clase Data que va en la carpeta Utiles, que esta erá la más importante
de la carpeta, ya que, contendrá la lógica de los post, y esta también inicializa todo
lo que nosotros queramos mostrar en nuestros componentes hijos o en la página
padre.
Areas que se implementaron en el Desarrollo del Sistema:
Para el desarrollo del sistema. Se dividió en distintas áreas, esto debido a que
tenemos distintos roles y hay áreas restringidas para algunos usuarios.
Desplegaré cada una de las áreas para ver qué funcionalidades tiene cada una:
Administrador:
Usuarios:
En el área de administración, tenemos subcategorías como la de usuarios, donde el
administrador puede ver los usuarios que están dados de alta en el sistema.
Muestra una tabla :
Nombre Apellido Email Nombre de Usuario Rol
Esta tabla nos despliega una lista de los usuarios que tenemos dados de alta en
nuestra base de datos, con la información de cada uno de los usuarios. Arriba
tenemos un buscador que cuando buscamos por nombre o nombre de usuario, nos
despliega la información del usuario. Además, justo al lado tenemos un botón con
un ícono de un lápiz que nos permite editar la información del usuario
Nos abre el mismo formulario que tenemos para dar de alta a un usuario, pero con
los campos llenos por la información del usuario, esto, enseguida se explicará cómo
funciona en la programación. En este formulario, podemos cambiar cualquier dato
del usuario, así como también podemos cambiar el estado de un usuario (Que no se
elimina de la base de datos, debido a que podríamos perder información relacionada
con eventos, artistas, escenarios, boletos que haya generado ese usuario), se hizo
con esta medida de precaución. Podemos cambiar el tipo de rol de los usuarios.
Arriba aparece un botón de volver, que nos devolverá a la pantalla anterior, donde
despliega una tabla con la información de los usuarios.
Y al presionar en Dar de Alta un Usuario, despliega el formulario que anteriormente
se mostró pero con los espacios vacíos, debido a que es un usuario nuevo.
Se agregaron validaciones para que tenga que ingresar información si no, no deja
guardar.
Roles:
Aquí se implementó simplemente cartas con información de cada uno de los roles y
las funcionalidades que tiene cada uno. En sí es solo mostrar información, no
quisimos implementar un área para dar de alta roles, debido a que el sistema tendrá
los roles tan específicos, que no es necesario habilitar más roles. Y todo esto se
hizo con base de datos.
Escenarios:
Introducción
El módulo de escenarios es una herramienta esencial dentro del sistema de gestión
de eventos RB Tickets. Permite a los usuarios crear y configurar diferentes
escenarios, adaptándolos a las necesidades específicas de cada evento.
¿Qué es un Escenario?
Un escenario es una representación virtual del espacio físico donde se llevará a
cabo un evento. En este módulo, puedes definir las zonas del evento (por ejemplo,
General, VIP, Platino), los tipos de boletos disponibles para cada zona (por ejemplo,
Individual, Mesa, Grada), y la capacidad de cada zona.
El módulo de escenarios es un componente esencial del sistema, ya que permite la
creación de distintos tipos de lugares o configuraciones para eventos. Esto se
justifica por la variabilidad en la distribución de zonas y tipos de boletos en cada
evento.
Ejemplo:
Un evento para una agrupación pequeña podría tener dos zonas:
● General: Con boletos de tipo "Persona" y "Grada".
● VIP: Con boletos de tipo "Persona" y "Mesa".
Un evento de mayor envergadura, en el mismo lugar, podría requerir una
configuración diferente:
● Zonas: Premium, Diamante, Oro, VIP y General.
● Tipos de boletos: Mesa, Persona, Cortesías.
Flexibilidad:
El módulo permite crear múltiples escenarios según las necesidades del evento,
configurando zonas, tipos de boletos y sus relaciones.
Relaciones:
● Un escenario puede tener varias zonas.
● Una zona puede tener varios tipos de boletos.
● Un tipo de boleto puede estar disponible en varias zonas.
Flujo de trabajo:
1. Creación del escenario: Se definen las zonas y los tipos de boletos
disponibles en cada zona.
2. Almacenamiento: El escenario, zonas y tipos de boletos se guardan en la
base de datos, manteniendo las relaciones entre ellos.
3. Creación del evento: Se selecciona un escenario existente o se crea uno
nuevo para el evento.
Beneficios:
● Facilita la gestión de eventos con diferentes configuraciones.
● Permite la reutilización de escenarios.
● Simplifica la creación de eventos al tener predefinidas las zonas y tipos de
boletos.
● Mejora la organización y control de la venta de boletos.
Administrador de Escenarios:
Es necesario tener un administrador de escenarios para que el que tenga el rol
adecuado, pueda crear, modificar escenarios, etc.
Manual de Usuario para el Módulo Escenarios:
Esta es la página principal del módulo escenarios
Paso a Paso: Creando un Escenario
1. Accede al Módulo: Dirígete al módulo de escenarios en el sistema RB Tickets.
2. Nuevo Escenario: Haz clic en el botón "Agregar Nuevo".
3. Nombre: Asigna un nombre descriptivo al escenario (por ejemplo, "El patrón Sport-Bar").
De click en “Guardar”
4. Agregar Zonas:
● Haz clic en "Agregar Zona".
● Asigna un nombre a la zona (por ejemplo, "General").
● Selecciona los tipos de boletos disponibles para esa zona.
● Establece la capacidad de la zona.
● Repite estos pasos para agregar más zonas.
5. Guardar: Guarda el escenario.
De esta manera ya tenemos guardado el escenario, ahora ya podemos utilizar el
escenario para mi evento:
Consultar Escenarios:
Este módulo, consiste en solamente permitir a los usuarios a ver los escenarios que
fueron dados de alta, no permite dar de alta nuevos escenarios, ni modificar la
información.
Por ejemplo, aquí solo nos permite ver Detalles del escenario. Y al presionar el
botón nos despliega la información respectiva del escenario:
De tal forma que cuando un rol que solo tenga acceso a consultar los escenarios se
meta, no le va permitir editar escenario. Solamente va poder ver lo que ha dado de
alta el administrador de escenarios.
Eventos:
El módulo de eventos es el núcleo del sistema RB Tickets, ya que gestiona la
creación, configuración y seguimiento de los eventos.
1. Entidades y Relaciones:
● Evento: Representa un evento específico con detalles como nombre, fecha,
hora, descripción, artista y escenario asociado.
● Artista: Almacena información sobre los artistas o grupos que participan en
los eventos.
● Escenario: Se relaciona con el módulo de escenarios para definir la
configuración del espacio del evento.
2. Lógica de Negocio:
● Creación de Eventos:
○ El usuario ingresa los detalles del evento, incluyendo nombre, fecha,
descripción.
○ Se selecciona el artista o grupo principal del evento.
○ Se elige el escenario adecuado para el evento.
3. Flujo de Trabajo:
Pantalla de Gestión de Eventos:
● El usuario accede a la pantalla principal de gestión de eventos.
● Se muestra un listado de los eventos existentes
● El usuario tiene la opción de crear un nuevo evento haciendo clic en un botón.
Formulario de Creación/Edición de Eventos:
● Ingreso de Detalles:
○ El usuario completa los campos obligatorios del evento, como el nombre,
fecha, hora y descripción.
● Selección de Artista:
○ Se despliega una lista de artistas disponibles.
○ El usuario selecciona el artista principal del evento.
● Selección de Escenario:
○ Se presenta una lista de escenarios predefinidos.
○ El usuario elige el escenario que mejor se adapta a las necesidades del
evento.
Formulario para Definir Tipos de Precios:
● Ingreso de Tipos de Venta:
○ El usuario define los diferentes tipos de venta que tendrá el evento (e.g.,
Preventa, Venta General, Venta en Taquilla).
● Asignación de Fechas:
○ Para cada tipo de venta, el usuario establece las fechas de inicio y
finalización.
Formulario de Precios:
● Visualización de Zonas:
○ En función del escenario seleccionado, se muestra una lista de las zonas
disponibles.
● Asignación de Precios:
○ Para cada tipo de venta y zona, el usuario establece los precios
correspondientes.
Guardar y Publicar:
● Una vez completados todos los formularios, el usuario guarda la configuración del
evento.
Regreso a la Pantalla Principal:
● El usuario regresa a la pantalla de gestión de eventos.
● El nuevo evento aparece en el listado.
Agrega Eventos:
Manual de Usuario:
● Pantalla de Gestión de Eventos:
○ Listado de eventos.
○ Opción para crear eventos.
● Formulario de Creación/Edición de Eventos:
○ Campos para ingresar los detalles del evento.
○ Selección de artista.
○ Selección de escenario.
● Formulario para definir los tipos de precios:
○ Campos para ingresar el tipo de venta.
○ Campo para definir la fecha para ese tipo de venta.
En esta parte, nos aparece el número de folio para cada boleto, por ejemplo, los de
tendrán folio del 1 al 6,y los de preventa el folio del 7 al 9.
● Formulario de precios:
○ Despliega una lista de las zonas que se dieron de alta en el escenario
seleccionado para el evento
○ Campos para agregar los precios a los diferentes tipos de precios.
Como el escenario solo tenía dado de alta la zona General y con tipo de precios
Taquilla y Preventa, en este formulario se ponen los precios que tendrá cada tipo de
boleto, para de esta forma vincular cada precio a su boleto.
Por ejemplo, Los boletos de taquilla costarán 50 pesos y los de preventa costarán
20 pesos. Al darle en continuar se nos abrirá otro formulario, donde en este
siguiente meteremos los logotipos que se requieran en el ticket. Esta tabla fue
agregada a la base de datos debido a que los clientes querían que aparecieran sus
logotipos en el ticket, por lo que se optimizó el código de la generación del pdf para
que recibiera los boletos relacionados al evento.
En esta pestaña, tenemos la base de cómo estarían acomodados los logotipos en
caso de que necesitáramos que se suba alguno. En este caso subiré 6 logotipos
para irnos al siguiente módulo y ver cómo quedaría nuestro ticket. Punto Importante:
Solicitar logotipos en blanco y negro debido a que la impresora solo imprime
estos colores. El logotipo de RB Tickets, quedará por default, y siempre saldrá.
Ahora si aparece el botón para guardar el evento, que, al presionarlo, cargará la
página:
Consulta Eventos:
Y aquí tendremos el nuevo evento, Evento Test Documentación, donde al dar clic en
“Detalles” desplegará toda la información respectiva al evento con un nuevo
componente llamado Big Card, y mostrará toda la información respectiva al evento.
Nos despliega toda la información acerca del evento, desde el artista que contiene
el evento, hasta los logotipos que se cargaron para el ticket.
Editar Eventos:
Esta página fue creada específicamente para los roles que tengan acceso a editar
un evento. Donde podrá editar la información del evento, precios, logotipos, tipo de
ventas, folios, etc.
Al dar click en detalles, desplegará un formulario como el de agregar eventos, pero
con la información respectiva al evento que se está consultando, para que de esta
manera, se puedan guardar los nuevos datos del evento.
Por ejemplo, aparecen las Tabs de “Datos Evento”, “Precios” y “Logotipos”, que
cada tab se encargará de guardar cada sección.
Artistas:
Introducción:
El módulo de artistas es una herramienta esencial dentro del sistema de gestión de
eventos RB Tickets. Permite a los usuarios crear y administrar la información de los
artistas que participan en los eventos, incluyendo sus datos básicos, imágenes y
descripciones.
¿Qué es un Artista?
Un artista es cualquier individuo o grupo que participa en un evento, como un cantante, una
banda, un comediante, un orador, etc. En este módulo, puedes almacenar información
relevante del artista, como su nombre, descripción, imagen y redes sociales.
El módulo de artistas es crucial para el sistema, ya que permite llevar un registro organizado
de los artistas y su participación en los eventos. Esto facilita la gestión de la información y la
promoción de los eventos.
Administrador de Artistas:
Es necesario tener un administrador de artistas para que el usuario con el rol
adecuado pueda crear, modificar y eliminar artistas.
Funcionalidades
● Crear un nuevo artista: Puedes agregar un nuevo artista al sistema con su
información básica, imagen y descripción.
● Editar un artista existente: Puedes modificar la información de un artista
previamente creado.
● Eliminar un artista: Puedes eliminar un artista del sistema.
● Buscar artistas: Puedes buscar artistas por su nombre.
● Visualizar la lista de artistas: Puedes ver una lista de todos los artistas
registrados en el sistema.
Flujo de trabajo
1. Crear un artista: Se ingresan los datos básicos del artista, incluyendo su
nombre, descripción, imagen y redes sociales.
2. Almacenamiento: La información del artista se guarda en la base de datos.
3. Asociar un artista a un evento: Al crear un evento, puedes seleccionar un
artista existente o crear uno nuevo para asociarlo al evento.
Beneficios
● Facilita la gestión de la información de los artistas.
● Permite la reutilización de la información de los artistas en diferentes eventos.
● Mejora la organización y control de los artistas participantes en los eventos.
● Proporciona una plataforma centralizada para almacenar y acceder a la
información de los artistas.
Manual de Usuario para el Módulo de Artistas
1. Accede al Módulo: Dirígete al módulo de artistas en el sistema RB Tickets.
Aquí podrás ver un grid de Artistas que han sido dados de alta en el sistema.
Los cuales se ven de la siguiente manera:
Aquí aparecerán 3 botones, el cual es editar, eliminar y agregar nuevo. En
este caso agregaremos un artista nuevo.
2. Nuevo Artista: Haz clic en el botón "Agregar Nuevo".
Este formulario vacío, nos permite ingresar la información del artista que
necesitemos. El campo nombre, Descripción y una imágen del artista.
Completa los campos con la información del artista, incluyendo su nombre,
descripción, imagen y redes sociales.
3. Guardar: Guarda la información del artista.
Editar un Artista
1. Busca al Artista: Busca al artista que deseas editar en la lista de artistas.
2. Editar: Haz clic en el botón "Editar" para modificar la información del artista.
3. Guardar: Guarda los cambios realizados.
Eliminar un Artista
1. Busca al Artista: Busca al artista que deseas eliminar en la lista de artistas.
2. Eliminar: Haz clic en el botón "Eliminar" para eliminar al artista del sistema.
3. Confirmar: Confirma la eliminación del artista.
Buscar Artistas
1. Ingresa el nombre del artista: Ingresa el nombre del artista que deseas
buscar en el campo de búsqueda.
2. Buscar: Haz clic en el botón "Buscar" para buscar al artista.
Punto de venta:
El módulo de punto de venta es una herramienta crucial dentro del sistema de
gestión de eventos RB Tickets. Permite a los usuarios realizar la venta de boletos de
forma rápida y eficiente, con la opción de imprimir los boletos vendidos.
¿Qué es un Punto de Venta?
Un punto de venta es el lugar físico o virtual donde se realiza la venta de boletos
para un evento. Este módulo facilita la gestión de ventas, el control de boletos
disponibles y la generación de reportes.
El módulo de punto de venta es fundamental para el sistema, ya que agiliza el
proceso de venta, reduce errores y proporciona información en tiempo real sobre la
disponibilidad de boletos.
Ejemplo
Un usuario puede seleccionar un evento, elegir la zona, el tipo de boleto y la
cantidad, y luego proceder a la venta. El sistema genera un comprobante de venta
que puede ser impreso.
Funcionalidades
● Seleccionar un evento: Puedes elegir el evento para el cual deseas vender
boletos.
● Elegir la zona y el tipo de boleto: Puedes seleccionar la zona del evento y
el tipo de boleto que el cliente desea comprar.
● Indicar la cantidad: Puedes especificar la cantidad de boletos que se van a
vender.
● Registrar la venta: Puedes registrar la venta de los boletos.
● Imprimir la venta: Puedes imprimir un comprobante de venta.
● Ver el historial de ventas: Puedes visualizar un resumen de las ventas
realizadas.
● Imprimir boletos de forma masiva: Puedes imprimir boletos de forma
masiva para un evento específico.
Manual de Usuario para el Módulo de Punto de Venta
Flujo de trabajo:
1. Seleccionar evento: Se elige el evento para el cual se van a vender boletos.
Seleccionamos el botón de detalles para proceder a vender boletos
Luego proceder a dar click en el botón de pasar a boletos:
2. Elegir zona y tipo de boleto: Se selecciona la zona y el tipo de boleto
deseado.
Se nos desplegarán una lista de botones de color rosa, indicando cada boleto
que generó el sistema. De esta forma lo tendremos de forma más visible y es
más intuitivo seleccionar los boletos a vender.
3. Seleccionar boletos: Se seleccionan los boletos que se van a generar en
esa venta, para después registrar su venta.
En vivo se va actualizando la interfaz. Agregando la zona, el tipo de boleto y
el tipo de precio. En este caso se venden 2 boletos en la zona VIP de tipo
mesa, con el precio VENTA, y dice el total que el cliente tiene que pagar.
Pago con tarjeta:
Aún no se integra la forma de pago en tarjeta, es decir, hasta ahorita es todo
simulado, cuando le ponen pago con tarjeta, el punto de venta tendrá una
terminal que apunte directamente a una cuenta de RB MUSIC, y cuando el
punto de venta vea que la terminal hizo el cargo a la tarjeta correctamente, en
el sistema le pondrá pago con tarjeta, aquí la empresa, ya habrá recibido el
pago, entonces, el otro módulo de estadísticas de recaudaciones tendrá los
ingresos por medio de tarjeta y por medio de efectivo. Así que al final de
cuentas, las cuentas (ingresos) tienen que coincidir con las estadísticas de
recaudación por medio de tarjeta y efectivo.
Pago en efectivo:
Cuando el punto de venta selecciona pago en efectivo, el cliente debe pagar
con efectivo al punto de venta, y este dinero, tiene que coincidir con las
estadísticas de recaudación al final del evento.
4. Registrar venta: Se registra la venta en el sistema.
Al dar click en cualquier forma de pago, ya sea en efectivo o en tarjeta.
Mandará a otra pestaña, donde aparecerá una confirmación para proceder a
confirmar la venta y proceder a la impresión del ticket.
5. Imprimir ticket: Seleccionar la opción de pago realizado y proceder a la
impresión para generar el ticket e imprimirlo con la impresora que se le dio al
punto de venta, ya configurada.
Automáticamente se abrirá una nueva pestaña en el navegador, donde ya se
genera el ticket con los datos del evento correspondiente. Los logotipos que
se subieron en el formulario de eventos.
6. Configurar el tamaño del papel: Al dar click en el botón de imprimir. El
punto de venta tiene que estar seguro de que el tamaño del papel esté
configurado en “Concert Ticket”:
También cerciorarse que el Destino (La impresora) esté conectada y
aparezca como Boca BIDI FGL 26/46 200 DPI.
Una vez que se le de en imprimir, deberá verificar que el ticket salió
correctamente impreso.
7. Confirmar la impresión: Deberá regresar a la pestaña de punto de venta y
seleccionar que el ticket se imprimió correctamente.
Punto importante: Si el ticket no fue impreso correctamente, existe un botón
justo a un lado de confirmar impresión, que vuelve a generar el documento
con los tickets correspondientes. Después de generar, volver a repetir los
pasos 5, 6 y 7.
Manual de Usuario para Impresión masiva:
El módulo de impresión masiva en RB Tickets existe para agilizar la impresión de
boletos en grandes cantidades. En lugar de imprimir cada boleto individualmente,
este módulo permite a los usuarios seleccionar un evento, zona y rango de folios
para imprimir una gran cantidad de boletos a la vez, ahorrando tiempo y esfuerzo,
especialmente en eventos con alta demanda.
Imprimir Boletos de Forma Masiva
1. Accede a la Impresión Masiva: Dirígete a la sección de impresión masiva
dentro del módulo de punto de venta.
2. Selecciona un Evento: Selecciona el evento para el cual deseas imprimir
boletos.
Seleccionar Detalles en el evento que desees imprimir de forma masiva:
Abajo aparece una tabla de los boletos que ya se vendieron, por ejemplo está
la prueba que se realizó anteriormente que fueron 2 boletos, por $600. Y
también otra venta por $200.
3. Elige Zona y Tipo de Boleto: Selecciona la zona y el tipo de boleto que
deseas imprimir.
Automáticamente aparece a un lado los boletos que se pueden imprimir y las
cantidades, por ejemplo.
4. Imprime los Boletos: Haz clic en el botón "Imprimir Boletos". El sistema se
llevará aproximadamente de 30 - 1 minuto en generar el documento con los
100 boletos.
Manual de Usuario del Módulo Escáner:
El módulo escáner en RB Tickets permite validar la autenticidad de los boletos en el
acceso a los eventos. Funciona leyendo el código de barras o código QR del boleto,
ya sea impreso o en un dispositivo móvil, y verificando su validez en la base de
datos del sistema.
¿Cómo funciona?
1. Escaneo: Un usuario con el rol adecuado utiliza un
escáner físico o la cámara de un dispositivo móvil para leer el
código del boleto.
2. Validación: El sistema verifica si el boleto es
válido, si ha sido utilizado previamente, y si
corresponde al evento y zona correctos.
3. Respuesta: El sistema indica si el boleto es
válido o no, mostrando un mensaje en el dispositivo y,
en algunos casos, activando una señal visual o sonora.
Ahora vamos a proceder a crear lo que sigue después del diseño, que será crear un
spGetBoletos, ¿Porqué? Este procedimiento almacenado, nos va permitir en vase al
iIdVenta obtener toda la información de lo que yo ocupo del boleto, permitiéndome
hacer inners Joins en mi base de datos para ir obteniendo la información que ocupo
para mandar esta información a mi plantilla e imprimir los boletos.
Eventos Online:
Este es un nuevo módulo, que va permitir al usuario Administrador del sistema, dar
de alta eventos que ya tenemos registrados en Eventos, para pasarlos en línea se
creó este módulo.
El objetivo es que no todos los eventos que creemos los venderemos en la página.
Podemos crear eventos locales donde los clientes no compren los boletos digitales y
la generación de tickets físicos sería dentro del punto de venta ya creado. O
simplemente, los puntos de venta se meterán al evento y podrán vender boletos
físicos dentro de este mismo e imprimirlos al momento.
Se reutilizó el spGetEventos del punto de venta, para que los eventos que tengo en
punto de venta me aparezcan en una lista de eventos en este nuevo módulo.
Primero se creó una tabla en base de datos para guardar los eventos que estarán
online. Esta es la estructura de esa tabla:
Primero está el id del Evento que estará Online, enseguida estará la relación con los
eventos que ya tenemos en la base de datos, luego la fecha de Inicio de la venta
Online y el estatus del evento Online.
Esto servirá para mantener la relación con los eventos que ya tenemos en nuestra
base de datos.
Para llenar esta tabla, lo primero que hice fue un spSaveEventoVentaOnline, que
aquí deberá de llevar los datos idEventos, la Fecha de inicio y el Estatus.
Entonces con este sp se guardará el evento en la tabla. Realicé un formulario
sencillo para llenar esta información.
Se programó el objeto, la entidad y todo hasta llegar al endpoint. Entonces lo
siguiente es. ¿Cómo voy a recibir el id eventos? Pensé en hacer un MudSelect,
donde el usuario vea los eventos que están dados de alta en punto de venta.
Entonces se le manda una lista de eventos a ese mudselect ya llena con
información, a través del spSaveEventoVentaOnlineSave se manda este evento. Y
el componente de formulario quedó de la siguiente manera:
Como se puede observar en la imagen, se puede seleccionar un evento para
meterlo a que esté en línea, junto con un selector de fecha que permite al usuario
seleccionar la fecha de inicio de venta online.
Luego tenemos la página principal con un grid de eventos Online. Estos son solo los
eventos que tenemos online.
Que al darle click en detalles nos despliega esta información:
Se creó un componente que muestra la fecha de inicio de venta del evento. Para
que no puedan editar ningún dato. y por debajo se muestra la bigcard del evento,
con los datos del Artista, el escenario, las zonas y sus tipo de boletos.
También se creó una página especial para editar estos eventos, donde también se
muestran cards de los eventos que están en línea:
y al darle en detalles nos manda al componente EditarEventosVentaOnline:
Donde sencillamente podemos poner si un evento está activo o inactivo en los
eventos online y podemos modificar la fecha de inicio de venta.
Con estos sencillos componentes podemos modificar, y crear eventos en línea.
Estadísticas:
El módulo de estadísticas, permite a los administradores de los eventos, ver la
información crucial sobre el rendimiento de los eventos y las ventas de boletos.
Funcionalidades:
● Visualización de datos: Permite visualizar datos importantes como la
cantidad de boletos vendidos, los ingresos generados y la asistencia a los
eventos.
● Generación de reportes: Facilita la generación de reportes personalizados
como de ventas por zona y el tipo de boleto.
● Exportación de datos: Permite exportar los datos de las estadísticas en
diferentes formatos, como hojas de cálculo, para su posterior análisis o
presentación.
Beneficios:
● Monitoreo del rendimiento: Permite a los organizadores de eventos
monitorear el rendimiento de sus eventos en tiempo real.
● Identificación de áreas de mejora: Ayuda a identificar áreas de mejora en la
estrategia de ventas y la organización de eventos.
● Toma de decisiones informadas: Facilita la toma de decisiones informadas
basadas en datos concretos sobre las ventas y la asistencia a los eventos.
● Optimización de la rentabilidad: Permite optimizar la rentabilidad de los
eventos al proporcionar información detallada sobre los ingresos y los costos.
Tenemos tres páginas principales, una es para ver la venta de boletos, así como las
entradas de asistencia al evento. La otra es para ver lo recaudado monetariamente
de un evento. Y la última página es para ver las estadísticas de los eventos online.
Estadísticas Boletos y Entradas (Eventos Locales):
La página principal de estadísticas es un grid con todos los eventos.
La página al acceder a detalles muestra la siguiente información:
Tenemos una gráfica por ventas semanales, al lado tenemos unas estadísticas de
ventas por zonas del evento y por último una tabla que compara los boletos
vendidos de una zona con las asistencias del evento.
RbTicket.com
El proyecto de rbticket.com se llevó acabo el día 15 de enero, terminando el proceso
el día 15 de marzo.
Este proyecto se hizo utilizando la tecnología Angular, donde se controla todo con el
sistema principal creado con blazor, entregando el producto con las siguientes
capturas:
Esa la página principal. Donde en la parte del footer, tenemos varias sub-secciones,
como la página de acerca de nosotros:
Y tenemos el servicio que ofrece la empresa, que es para que los managers
contacten a nuestra tiquetera y vendan su evento con nosotros, donde la empresa
RB Tickets va a mapear su evento y vender sus boletos en línea, además de que
ofrece los servicios de venta de boletos en taquilla, impresión de los mismos en
forma física y en línea.
En la sección de nuestra red, redirigen a las páginas oficiales de la empresa RB
Music y De La Calle Al Éxito.
Luego tenemos las secciones legales, que fue uno de los conflictos que se tuvo con
conekta. Ya que si deseas registrar una empresa, esta página web tiene que tener
Políticas de privacidad, y sus respectivas políticas de devoluciones.
Luego a continuación tenemos las políticas de privacidad, que es donde se define
que se harán con los datos del usuario, donde se define que los datos que el
usuario ingresa solo se usarán para próximos módulos de usuario, para mandar
promociones de eventos, y para la entrega de boletos digitales.
Luego en la sección de ayuda tenemos las preguntas frecuentes, donde
desglosamos algunas preguntas que el usuario podría tener al momento de comprar
tickets en nuestro sitio web.
Y por último tenemos la sección de contacto, donde se muestran los horarios de
oficina y soporte del sitio web, dudas o cualquier asunto de tickets.
Se colocó un evento ficticio para la entrega de este sistema, donde al dar click en el
evento, te da las especificaciones de lo que se registró en el sistema:
Para cada evento se tiene que crear un mapa, en el área de diseño se hizo con un
programa parecido a Adobe Illustrator, donde debemos trabajar con vectores:
Este escenario se diseñó de la siguiente manera:
Se deja a continuación un enlace de descarga del archivo del escenario de ejemplo:
EditarImagen.svg , la capa 1 contiene la estructura general de las capas.
Al deshabilitar esta capa y abrir cualquier otra capa, se ve la estructura y
organización de cada una de las filas, y de los asientos que están representados
con círculos:
Y así para cada una de las capas.
Para la programación, se tiene que hacer lo siguiente:
Primero se creó el componente pancho-wordl-tour, que este es el componente que
contiene la capa1 del archivo svg, y se le agregan acciones a cada uno de las
capas, para que cuando se seleccione, te abra la zona que se seleccione, en este
caso será abrir alguna otra capa.
Ya al abrir la otra capa, deberá mostrar los círculos y a cada círculo en
programación se le agregó un onclickcirculo, para que este traiga información desde
la base de datos de cuál seleccionó y a continuación se agregan los boletos a una
tabla justo a un lado donde al darle en continuar llevará al cliente a un formulario
que debe llenar con sus datos:
Al darle click en pasar a cobro, le mandará al usuario un correo electrónico con la
URL de donde tiene que pagar con conekta y de igual manera abrirá rápidamente el
link de pago en otra pestaña del navegador:
Al pasar la tarjeta de prueba que nos da conekta nos aparecerá la siguiente pantalla
y alrededor de un minuto, el usuario recibirá sus boletos digitales en un documento
PDF.
Con este documento, el usuario podrá ingresar al evento, escaneando el qr con el
sistema online, con el scanner.