Proyecto de seguimiento de egresados

INSTITUTO TECNOLÓGICO SUPERIOR
“NUESTRA SEÑORA DEL ROSARIO”
TECNOLOGÍA EN ANÁLISIS DE SISTEMAS
TEMA:
“ANÁLISIS, DISEÑO Y DESARROLLO DE UN SISTEMA
INFORMÁTICO PARA EL SEGUIMIENTO DE EGRESADOS Y
GRADUADOS DEL INSTITUTO TECNOLÓGICO SUPERIOR
“NUESTRA SEÑORA DEL ROSARIO”UBICADO ENLA CIUDADDE
LOJA, CANTÓN CATAMAYO PERIODO 2016-2017“
AUTOR:
Dennis Geovanny Guevara Quevedo
TUTOR:
Tlgo. Luis Tillaguango
AÑO LECTIVO
2015- 2016

I
CERTIFICACIÓN
TLGO. LUIS TILLAGUANGO DOCENTE DE LA CARRERA DE ANÁLISIS DE
SISTEMAS DEL INSTITUTO TECNOLÓGICO SUPERIOR “NUESTRA
SEÑORA DEL ROSARIO”.
CERTIFICO:
Que el presente trabajo investigativo, previo a optar el grado de Tecnóloga en
Análisis de Sistemas, titulado “ANÁLISIS, DISEÑO, DESARROLLO DE UN
SISTEMA INFORMÁTICO PARA EL SEGUIMIENTO DE EGRESADOS Y
GRADUADOS DEL INSTITUTO TECNOLÓGICO SUPERIOR “NUESTRA
SEÑORA DEL ROSARIO” UBICADO EN LA CIUDAD DE LOJA, CANTÓN
CATAMAYO PERIODO 2016-2017” elaborado por la estudiante Dennis
Geovanny Guevara Quevedo, ha sido dirigido y revisado en todo el proceso;
cumpliendo con las disposiciones legales vigentes del Instituto Tecnológico
Superior “Nuestra Señora del Rosario”, por lo cual autorizo su presentación,
sustentación y defensa ante el respectivo tribunal de grado.
Catamayo, agosto del 2016
TLGO. LUIS TILLAGUANGO
TUTOR DEL PROYECTO

II
AUTORÍA
Yo, Dennis Geovanny Guevara Quevedo con C.I.: 1105953135 certifico que el
proyecto titulado: “ANÁLISIS, DISEÑO, DESARROLLO DE UN SISTEMA
INFORMÁTICO PARA EL SEGUIMIENTO DE EGRESADOS Y GRADUADOS
DEL INSTITUTO TECNOLÓGICO SUPERIOR “NUESTRA SEÑORA DEL
ROSARIO” UBICADO EN LA CIUDAD DE LOJA, CANTÓN CATAMAYO
PERIODO 2016-2017”, el cual presento como requisito para optar por el título
de Tecnólogo en Análisis de Sistemas del Instituto Tecnológico Superior
"Nuestra Señora del Rosario”, es el producto de mi ardua labor investigativa.
Así mismo, doy fe de este trabajo, es original e inédito, el contenido, efectos
legales y académicos que se desprenden del mismo son exclusividad del autor.
Dennis Geovanny Guevara Quevedo
C.I.: 1105953135
AUTOR

III
RESUMEN
El presente proyecto es realizado debido a la falta de un sistema que permita el
seguimiento de egresados y graduados del Instituto Tecnológico Superior
“Nuestra Señora del Rosario” a través de la web, ya que en la institución existe
dicho sistema, pero este solo es usado a través de cliente servidor, es decir que
solo se puede tener acceso al sistema en la institución generando problemas al
momento de que los usuarios quieran hacer uso del mismo.
Por lo tanto, dicha aplicación web mejorara la usabilidad y accesibilidad para los
usuarios de tal manera que cualquier egresado y graduado pueda obtener su
información de su estado actual, enviar sugerencias al administrador, imprimir
reportes de su información académica y datos personales. Y en el caso del
administrador, podrá registrar egresados y graduados, actualizar sus datos,
generar reportes y en general manejar cualquier información debido al perfil que
desempeña. La secretaria también cumplirá un papel importante ya que ella
también podrá registrar egresados y graduados, buscar información, y generar
reportes de los mismos, teniendo en cuenta que cada perfil debe pasar por una
ventana de logeo con su nombre de usuario y la contraseña.
Por tales razones mencionadas se presenta como proyecto el tema: “ANÁLISIS,
DISEÑO, DESARROLLO DE UN SISTEMA INFORMÁTICO PARA EL
SEGUIMIENTO DE EGRESADOS Y GRADUADOS DEL INSTITUTO
TECNOLÓGICO SUPERIOR “NUESTRASEÑORA DEL ROSARIO” UBICADO
EN LA CIUDAD DE LOJA, CANTÓN CATAMAYO PERIODO 2016-2017”.

IV
INTRODUCCIÓN
El seguimiento de egresados constituye uno de los factores muy importantes
para una institución, como es el caso del Instituto Tecnológico Superior “Nuestra
Señora del Rosario” debido a que los estudiantes que terminan su carrera
deberían ser registrados a través de un sistema informático, con el fin de que la
institución lleve un registro de cada estudiante egresado o graduado, de tal
manera que dicha información obtenida permitirá a la institución saber cómo sus
profesionales se desenvuelven en el ámbito laboral fuera de la institución.
Así, el Instituto Tecnológico Superior “Nuestra Señora del Rosario” ya tiene para
su disposición un sistema de seguimiento de egresados alojado en su propio
servidor local, de tal manera que el encargado del manejo de dicho sistema
puede manipular la información solo en la institución académica.
Por lo tanto, el presente proyecto es redactado por motivo de proyecto de fin de
la carrera de Análisis de sistemas, para la obtención del título de Tlgo. en dicha
carrera realizando un sistema informático que tiene como tema: “ANÁLISIS,
DISEÑO, DESARROLLO DE UN SISTEMA INFORMÁTICO PARA EL
SEGUIMIENTO DE EGRESADOS Y GRADUADOS DEL INSTITUTO
TECNOLÓGICO SUPERIOR “NUESTRA SEÑORA DEL ROSARIO” UBICADO
EN LA CIUDAD DE LOJA, CANTÓN CATAMAYO PERIODO 2016-2017”. Con
la finalidad de reemplazar el sistema local por un sistema que estará a
disposiciónde cualquier usuario debido a que su implementación será en la web.

1
CAPITULO I.
1. Datos del proyecto
1.1. PROBLEMA
Hoy en día la tecnología se presenta como una herramienta indispensable para
satisfacer las necesidades de un ser humano en todos los ámbitos necesarios
que cada persona ejerce.
Muchos de los países cuentan con sistemas especializados para el seguimiento
de los alumnos egresados y graduados en sus instituciones, logrando que dicha
información se pueda almacenar de una manera eficaz y segura.
En el Instituto Tecnológico Superior “Nuestra Señora del Rosario” ubicado en el
cantón Catamayo de la ciudad de Loja, se requiere este sistema, ya que la
institución cuenta con un sistema que no cumple con todas las necesidades
requeridas, es decir, el sistema se encuentra alojado en un servidor Local, de tal
manera que se limite a solo funcionar en la institución, por lo tanto se requiere
que dicho sistema se encuentre funcionando a través de la web, de este modo
los usuarios involucrados puedan acceder a la información del sistema en
cualquier lugar que tenga acceso a la internet, dándoles comodidad.

2
1.2. OBJETIVOS
1.2.1. OBJETIVO GENERAL:
Analizar, diseñar y desarrollar un sistema web que permita el seguimiento de los
egresados y graduados del Instituto tecnológico Superior “Nuestra Señora del
Rosario” para implementarlo en la respectiva página web de la institución con el
fin de que cualquier usuario pueda hacer uso del mismo.
1.2.2. OBJETIVOS ESPECÍFICOS:
 Investigar y analizar los requerimientos necesarios con el fin de que el
sistema cumpla con las necesidades de los usuarios que lo utilizarán.
 Utilizar todos los conocimientos básicos acerca de la accesibilidad para
que la interacción del usuario al sistema sea más adaptable y fácil.
 Desarrollar los diferentes diagramas necesarios con el fin de que el
análisis esté óptimo para la programación.
 Implementar el sistema en la web de tal manera que cualquier usuario
pueda tener acceso al mismo.
 Dar comodidad a los usuarios de hacer uso de la aplicación en cualquier
lugar que exista conexión a internet.
 Facilitar a los egresados y graduados la obtención de su información
personal.

3
1.3. REQUERIMIENTOS
1.3.1. REQUERIMIENTOS FUNCIONALES
CÓDIGO DESCRIPCIÓN
RF001. Registro de usuarios: Administradores, secretarias y egresados
RF002.
Registro y control de los datos personales de los egresados y
graduados
RF003.
Modificación o actualización de los datos personales de los
egresados y graduados
RF004. Registro y control del trabajo actual de los egresados y graduados
RF005.
Modificación o actualización de los datos del trabajo actual de los
RF006.
Registro y control de los datos académicos de los egresados y
graduados
RF007.
Modificación o actualización de datos académicos de los
egresados y graduados.
RF008. El egresado y graduado solicita información de la institución
RF009. El egresado y graduado solo solicitará reportes de su estado actual
RF010. El egresado y graduado solo tiene acceso a su propia información
RF011.
Presenta reportes del estado académico de los egresados y
graduados
RF012. Presentar reportes del trabajo actual de los egresados y graduados
RF013. Administrar el acceso del sistema para cada usuario
RF014.
Registro y control de datos del director del proyecto de los
RF015.
Modificación o actualización de datos del director del proyecto de
los egresados y graduados
RF016.
Acceso al sistema en 3 perfiles: administrador, secretaria, y
egresados
RF017. El administrador registrará uno o más administradores, si se solicita
Tabla 1 Requerimientos funcionales del sistema
Fuente: Instituto Tecnológico Superior “Nuestra Señora del Rosario”
Elaborada por: Dennis Guevara

4
1.3.2. REQUERIMIENTOS NO FUNCIONALES
1.3.2.1. REQUERIMIENTOS DEL PRODUCTO.
CÓDIGO DESCRIPCIÓN
RNF001. El sistema funcionará en cualquier sistema operativo.
RNF002. El sistema necesitara el lenguaje Java para su uso.
RNF003. El sistema deberá usar el gestor de base de datos Mysql.
RNF004. El sistema deberá estar alojado en un servidor web.
RNF005.
El sistema necesitará para su ejecución un procesador Pentium
Dual Core como mínimo
RNF006.
El sistema necesitara para su ejecución una memoria RAM de 2GB
como mínimo
RNF007. El sistema requerirá un disco duro de mínimo 80GB
RNF008. El sistema requerirá tarjeta de video integrada de 64MB
RNF009.
El sistema requerirá una tarjeta de red para las conexiones a
internet
RNF010. La velocidad de red debe ser como mínimo de 2mb/s
Tabla 2 Requerimientos del producto
1.3.2.2. REQUERIMIENTOS DE USABILIDAD
RF018.
Las contraseñas de los egresados y graduados registrados
deberán ser randómicas
RF019. Los egresados y graduados podrán cambiar su contraseña
RF020.
Los egresados podrán enviar sugerencias al administrador acerca
de su información
RF021.
El administrador podrá ver la información de cualquier perfil
registrado en el sistema (Administradores, Secretaria, Egresados)
RF022. El sistema debe tener campos validados.

5
RNF011.
El tiempo de aprendizaje del sistema por un usuario deberá ser
menos de 2 horas.
RNF012. Los errores cometidos por el usuario deben ser menor a 1%
RNF013. El sistema deberá contar con manuales
RNF014. El sistema deberá contar con mensajes de errores al cometerlos
RNF015. El sistema deberá contar con interfaces fáciles de entender
Tabla 3 Requerimientos de usabilidad del sistema
1.3.2.3. REQUERIMIENTOS DE EFICIENCIA
RNF016.
La velocidad de carga de la aplicación web deberá depender de la
velocidad del internet
RNF017.
Cualquier proceso realizado por el sistema debe ser en menos de
5 segundos
RNF018.
El sistema debe ser capaz de operar con varios usuarios con
sesiones activas
Tabla 4 Requerimientos de eficiencia del sistema
1.3.2.4. REQUERIMIENTOS DE PORTABILIDAD
RNF019.
El sistema operativo funcionara en cualquier sistema operativo
debido a que es una aplicación web.
Tabla 5 Requerimientos de portabilidad del sistema
1.3.2.5. REQUERIMIENTOS DE SEGURIDAD
RNF020.
El administrador será el único que podrá manejar toda la
información del sistema
RNF021. Deberá existir respaldos frecuentes de la información
RNF022.
Las contraseñas guardadas y nombres de usuarios deberán estar
encriptadas
Tabla 6 Requerimientos de seguridad

6
1.3.2.6. REQUERIMIENTOS DE MANTENIBILIDAD
RNF023. El sistema deberá tener un mantenimiento cada mes
RNF024.
El administrador del sistema deberá solucionar errores que se
presentes en el mismo.
Tabla 7 Requerimientos de mantenibilidad del sistema

7Figura 1 Diagrama de actividades
1.4. DIAGRAMA DE ACTIVIDADES

8
1.5. MODELO DEL DOMINIO
Figura 2 Modelo de dominio
..*

9
1.6. DIAGRAMA DE CLASES INICIAL
Figura 3 Diagrama de clases

10
CAPITULO II.
2. CICLO DE VIDA
2.1. MODELO
Para el desarrollo del proyecto de sistema de seguimiento de egresados y
graduados del Instituto Tecnológico Superior “Nuestra Señora del Rosario”, es
muy importante seguir un modelo de desarrollo de software, ya que debemos
seguir una serie de fases de manera ordenada dependiendo del modelo a
escoger con el fin de que el software se desarrolle de manera adecuada.
Por lo tanto, para el sistema de egresados y graduados se seguirá el modelo en
cascada, cuyo modelo es el más básico para los paradigmas de un ciclo de vida
de software. El modelo en cascada presente cinco fases importantes que se
deben seguir para el desarrollo del sistema con éxito las cuales son:
 Requisitos
 Diseño
 Implementación
 Pruebas
 Mantenimiento
Estas fases se deben seguir de manera ordenada, una por una, es decir que
debemos acabar una fase y continuar en otra, como bien lleva titulado este
modelo “cascada”, una vez que una fase se termina ya no se puede regresar.
Figura 4 Modelo en cascada
Fuente: http://metodologiaencascada.blogspot.com
Elaborada por: Misty Solorio

11
2.2. DISEÑO PRELIMINAR
El diseño de ventanas para el sistema de seguimiento de egresados y graduados
será un diseño básico dando a conocer cómo serán las principales ventanas del
sistema, cuyos diseños son los siguientes:
Figura 5 Pantalla de inicio del sistema
Figura 6 Pantalla de inicio de sesión

12
Figura 7 Pantalla de inicio de perfil administrador
Figura 8 Pantalla de registro de datos
Las ventanas presentadas muestran cómo será el sistema una vez terminado,
claro tomando en cuenta que son un modelo básico.

13
2.3. METODOLOGÍA
La metodología que se utilizará es la metodología iconix, ya que este es un
proceso más simplificado que cualquier otra metodología completa para
softwares demasiado complejos y grandes. La metodología iconix se la ha
tomado en cuenta porque esta sirve demasiado bien para el sistema que se
desarrolla ya que no es un sistema de mucha complejidad.
La metodología iconix nos presenta ciertas características que hacen que esta
metodología sea fácil de utilizar:
 Iterativo e incremental: Varias iteraciones ocurren entre el desarrollo del
modelo de dominio y la identificación de los casos de uso. El modelo
estático es incrementalmente refinado por los modelos dinámicos.
 Trazabilidad: Cada paso está referenciado por algún requisito obtenido
anteriormente.
 Dinámica de UML: La metodología iconix orece un uso dinámico de UML
como los diagramas de casos de uso y diagramas de secuencia.
La metodología iconix consta de las siguientes fases a seguir:
 Análisis de requisitos
 Análisis y diseño preliminar
 Diseño
 Implementación
Dichas fases serán desarrolladas tras el desarrollo del sistema mencionado,
tomando en cuenta todos los aspectos importantes y siguiendo los pasos
exactamente como los plantea esta metodología para tener un producto final
eficiente.

14
2.4. ARQUITECTURA
La arquitectura en el desarrollo de un software es muy importante porque nos
permite tener durante el desarrollo del sistema una mejor comprensión y
organización del mismo. Para lo cual se utilizará la arquitectura a 3 niveles o
conocida también a 3 capas como se muestra en la Figura 6.
Figura 9 Arquitectura a 3 capas
2.5. ESTILO
El estilo a utilizar es el modelo vista controlador(MVC) que es el estilo más
utilizado y más común. Es muy eficiente a la hora de programar un sistema ya
que nos permite mantener un orden en el desarrollo del software.
El modelo estará integrado por las diferentes clases y servelts a utilizar en el
sistema de egresados, la vista hace referencia a los JSP, ya que en estos nos
presentan las interfaces graficas que el usuario manipulará y el controlador que
es el punto más importante es la conexión a la base de datos (Figura 6).

15
Figura 10 Diagrama de casos de uso general
CAPITULO III
3. DESARROLLO DEL PRODUCTO
3.1. DIAGRAMA DE CASOS DE USO

16
3.2. HERRAMIENTAS
Netbeans
Netbeans es el IDE de programación, cuya programación que se va a
desarrollar el sistema de egresados y graduados utilizando JSPs, ya que
en general el sistema va a ser web.
Enterprise Architect
Esta herramienta nos será de gran ayuda ya que sirve para desarrollar los
respectivos diagramas UML para el proyecto de sistema de egresados y
graduados, cuya herramienta es fácil de usar y nos permite desarrollar
sinnúmeros de diagramas.
Mysql
Herramienta primordial, ya que es el servidor de base de datos utilizado por
la mayoría de los programadores debido a su facilidad de gestionar, dicho
lenguaje de base de datos será donde se almacenará toda la información
del sistema de egresados y graduados
Adobe Reader
La herramienta Adobe Reader es utilizada, ya que los reportes generados
por el sistema de egresados y graduados se generan en formato PDF y el
programa nos permitirá abrir dichos reportes para el usuario.
Mysql workbench
Gestor de base de datos que permite llevar a cabo la creación de bases de
datos, tablas a través de su interfaz gráfica

17
3.3. DIAGRAMA DE ROBUSTEZ
Figura 11 Diagrama de robustez general

18
3.4. DIAGRAMA DE SECUENCIA
Figura 12 Diagrama de secuencia del administrador

19
3.5. DIAGRAMA DE ESTADOS
Figura 13 Diagrama de estados del administrador

20
3.6. DIAGRAMA DE PAQUETES
Figura 14 Diagrama de paquetes general

21
3.7. DIAGRAMA DE DISTRIBUCIÓN
Figura 15 Diagrama de distribución

22
CAPITULO IV
4. Implementación
4.1. Prototipado
Figura 16 Pantalla final de selección de perfiles
Figura 17 Pantalla final de inicio sesión

23
Figura 18 Pantalla principal del administrador
Figura 19 Pantalla de registro de datos personales del egresado

24
Figura 20 Pantalla de matriz de secretaria
4.2. Código
4.2.1. Código de la ventana de selección de perfiles
<%--
2 Document : PrincipalBienvenida
3 Created on : 21-abr-2016, 19:52:23
4 Author : Dennis Guevara
5 --%>
6
7 <%@page contentType="text/html" pageEncoding="UTF-8"%>
8 <!DOCTYPE html>
9 <html>
10 <head>
11 <%--Código para colocar el icono favicon --%>
12 <link rel="icon" type="image/ico" href="Imagenes/favicon.ico"/>
13 <meta http-equiv="Content-Type" content="text/html; charset=UTF-
8">
14 <title>Bienvenida</title>
15 <%--Codigo CSS para los componentes, menus, etc--%>
16 <style type="text/css">
17 img {
18 float: left;

25
19 -webkit-transition: margin 0.2s ease-out;
20 -moz-transition: margin 0.2s ease-out;
21 -ms-transition: margin 0.2s ease-out;
22 transition: margin 0.2s ease-out;
23 }
24 .ex1 img:hover {
25 margin-bottom: 55px;
26 }
27 </style>
28
29 </head>
30 <body background="Imagenes/Originals/encabezado.png"
style="background-repeat: no-repeat;">
31
32 <div style="float: left;">
33 <img src="Imagenes/escudo.png">
34 </div>
35
36 <div style="float: right;">
38 </div>
39
40 <div style="float: contour top;">
41 <font face="Segoe Print" size="5">
42 <center>
43 <br>
44 <b>INSTITUTO TECNOLÓGICO SUPERIOR<br>
45 "NUESTRA SEÑORA DEL ROSARIO"<br><br>
46 SISTEMA DE SEGUIMIENTO DE EGRESADOS Y GRADUADOS</b>
47 </center>
48 </font>
49 </div>
50 <center><div Style="margin-top: 80px;">
51
52 <table style="border-radius: 50px 50px 0px 0; background-color:
#00cc99; height: 40px; width: 1162px; border-collapse: separate;
53 -webkit-background-origin: border !important;
54 -moz-background-origin: border !important;
55 background-origin: border-box !important;

26
56 background: #107f63;
57 background: -webkit-linear-gradient(top, #FF6666 0,
#FF0000 33%, #330000 100%) no-repeat;
58 background: -moz-linear-gradient(top, #FF6666 0, #FF0000
33%, #330000 100%) no-repeat;
59 background: -o-linear-gradient(top, #FF6666 0, #FF0000
33%, #330000 100%) no-repeat;
60 background: -ms-linear-gradient(top, #FF6666 0, #FF0000
33%, #330000 100%) no-repeat;
61 -svg-background: linear-gradient(top, #FF6666 0, #FF0000
33%, #330000 100%) no-repeat;
62 background: linear-gradient(to bottom, #00cc99 0, #00cc99
33%, #107f63 100%) no-repeat;
63 -webkit-box-shadow:1px 1px 2px 1px rgba(0, 0, 0, 0.35);
64 -moz-box-shadow:1px 1px 2px 1px rgba(0, 0, 0, 0.35);
65 box-shadow:1px 1px 2px 1px rgba(0, 0, 0, 0.35);
66 border-width: 0;
67 font-family: Segoe Print, Segoe Print, Segoe Print;
68 font-weight: bold;
69 font-size: 14px;
70 cursor: pointer;
71 border: 1px solid;">
72 <td width="1162">
73 <font face="Segoe Print" size=3 color="black">
74 <center><b>INGRESO</b></center>
75 </font>
76 </td>
77 </table>
78 <%--Imagenes de la ventana principal mostrando los perfiles del sistema--%>
79 <table style=" box-shadow: 5px 5px 10px 0px; height: 339px;
padding-left: 95px; width: 1169px">
80 <td style="margin-left: 5px;">
81 <div class="ex1">
82 <a href="IniciarSesionAdmin.jsp"><img style="box-shadow:
4px 4px 4px 0px; color: #00cc99; border-radius: 50px"
src="Imagenes/InicioAdmin.png" /></a>
83 </div>
84 </td>
85

27
86 <td>
88 <a href="IniciarSesionSecre.jsp"><img style="box-shadow:
4px 4px 4px 0px; color: #00cc99; border-radius:
50px" src="Imagenes/InicioSecretaria.png"></a>
89 </div>
90 </td>
91
92 <td>
94 <a href="IniciarSesionEgre.jsp"><img style="box-shadow: 4px
4px 4px 0px; color: #00cc99; border-radius: 50px"
src="Imagenes/InicioEgresado.png"></a>
95 </div>
96 </td>
97 </table>
98 </div></center>
99 </body>
100 </html>
4.2.2. Código de pantalla de inicio sesión
1 <%--
2 Document : IniciarSesionAdmin
3 Created on : 16-may-2016, 14:52:27
5 --%>
6
7 <%@page import="javax.swing.JOptionPane"%>
8 <%@page import="Modelo.Consulta"%>
10 <!DOCTYPE html>
11 <html>
12 <head>
8">

28
17
19 img {
20 float: left;
21 -webkit-transition: margin 0.2s ease-out;
22 -moz-transition: margin 0.2s ease-out;
23 -ms-transition: margin 0.2s ease-out;
24 transition: margin 0.2s ease-out;
25 }
26 .ex1 img:hover {
27 margin-bottom: 55px;
28 }
29 </style>
30
31 </head>
33
34 <div style="float: left;">
36 </div>
37
38 <div style="float: right;">
40 </div>
41
42 <div style="float: contour top;">
44 <center>
45 <br>
46 <b>INSTITUTO TECNOLÓGICO SUPERIOR <br>
48 SISTEMA DE SEGUIMIENTO DE EGRESADOS Y
GRADUADOS</b>
49 </center>
50 </font>
51 </div>
52
53 <%--Componentes cajas de texto, y botones necesarios para el login--%>

29
54 <table style="position:absolute;top:300px;left:125px; border-radius:
50px 50px 0px 0; background-color: #00cc99; height: 40px; border-
collapse: separate;
59 background: -webkit-linear-gradient(top, #FF6666 0, #FF0000
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
61 background: -o-linear-gradient(top, #FF6666 0, #FF0000 33%,
#330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #107f63 100%) no-repeat;
68 border-width: 0;
71 font-size: 14px;
72 cursor: pointer;
74 <td width="1045">
76 <center><b>INICIAR SESIÓN</b></center>
77 </font>
78 </td>
79 </table>
80
81 <table style="position:absolute;top:340px;left:125px; box-shadow: 5px
10px 0px; height: 339px; padding-left: 20px; width: 1050px">
82 <td>
83 <img src="Imagenes/Login1.png" />

30
84 </td>
85
86 <td>
88 <%--Llamada al servelt InicioSesionAdmin para iniciar sesion--%>
89 <form method="post" action="InicioSesionAdmin">
90 <b>Usuario:&nbsp &nbsp &nbsp &nbsp<input style="height: 22px;
border: 1px solid #00cc99;" type="text"
name="txtUsuarioAdmin" maxlength="20" size="25"
placeholder="Ingrese nombre de usuario"><br>
91 Contraseña: &nbsp<input style="height: 22px; border: 1px
solid #00cc99;" type="password" name="txtContrasenaAdmin"
maxlength="20" size="25"
placeholder="****************"></b><br><br>
92 &nbsp<input style="height: 75px; width: 160px;
93 border-collapse: separate;
#FF0000 33%, #330000 100%) no-repeat;
99 background: -moz-linear-gradient(top, #FF6666 0,
#FF0000 33%, #330000 100%) no-repeat;
100 background: -o-linear-gradient(top, #FF6666 0,
#FF0000 33%, #330000 100%) no-repeat;
101 background: -ms-linear-gradient(top, #FF6666 0,
#FF0000 33%, #330000 100%) no-repeat;
102 -svg-background: linear-gradient(top, #FF6666 0,
#FF0000 33%, #330000 100%) no-repeat;
103 background: linear-gradient(to bottom, #00cc99 0,
#00cc99 33%, #107f63 100%) no-repeat;
104 -webkit-border-radius:12px;
105 -moz-border-radius:12px;
106 border-radius:12px;
107 -webkit-box-shadow:1px 1px 2px 1px rgba(0, 0, 0,
0.35);
108 -moz-box-shadow:1px 1px 2px 1px rgba(0, 0, 0,
0.35);

31
110 border-width: 0;
111 padding:0 20px;
112 margin:0 auto;
115 font-size: 14px;
116 cursor: pointer;
117 border: 1px solid;" type="Submit" value="INGRESAR"
name="btnIngresarAdmin">
118 </form>
119 </font>
120 </td>
121 <td>
122 <img src="Imagenes/Login.png" />
123 </td>
124 </table>
125
126 <div style="position: absolute; left:633px; top:536px;">
127 <form method="post" action="PrincipalBienvenida.jsp">
128 &nbsp&nbsp &nbsp<input style="height: 75px; width: 160px;
129 border-collapse: separate;
133 background: -webkit-linear-gradient(top,
#FF6666 0, #FF0000 33%, #330000 100%) no-
repeat;
134 background: -moz-linear-gradient(top, #FF6666
0, #FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
136 background: -ms-linear-gradient(top, #FF6666
0, #FF0000 33%, #330000 100%) no-repeat;
137 -svg-background: linear-gradient(top, #FF6666
0, #FF0000 33%, #330000 100%) no-repeat;
138 background: linear-gradient(to bottom, #00cc99
0, #00cc99 33%, #107f63 100%) no-repeat;

32
142 -webkit-box-shadow:1px 1px 2px 1px rgba(0, 0,
0, 0.35);
0.35);
146 padding:0 20px;
147 margin:0 auto;
152 border: 1px solid black;" type="Submit"
value="CANCELAR" name="btnCancelar"><br>
153 </form>
154 </div>
155
156 <%--Validación para cerrar la sesión--%>
157 <%
158 if (request.getParameter("cerrar") != null) {
159 session.invalidate();
160 }
161 %>
162 </body>
163 </html>
164
4.2.2.1. Código del servelt para iniciar sesión del administrador
1 /*
2 * To change this license header, choose License Headers in Project Properties.
3 * To change this template file, choose Tools | Templates
4 * and open the template in the editor.
5 */
6 package Servidores;
7
8 import Controlador.Conexion;

33
9 import java.io.IOException;
10 import java.io.PrintWriter;
11 import java.sql.Connection;
12 import java.sql.ResultSet;
13 import java.sql.Statement;
14 import javax.servlet.ServletException;
15 import javax.servlet.annotation.WebServlet;
16 import javax.servlet.http.HttpServlet;
17 import javax.servlet.http.HttpServletRequest;
18 import javax.servlet.http.HttpServletResponse;
19 import javax.servlet.http.HttpSession;
20 import javax.swing.JOptionPane;
21
22 /**
23 *
24 * @author Dennis Guevara
25 */
26 @WebServlet(name = "InicioSesionAdmin", urlPatterns =
{"/InicioSesionAdmin"})
27 public class InicioSesionAdmin extends HttpServlet {
28
29 /**
30 * Processes requests for both HTTP <code>GET</code> and
<code>POST</code>
31 * methods.
32 *
33 * @param request servlet request
34 * @param response servlet response
35 * @throws ServletException if a servlet-specific error occurs
36 * @throws IOException if an I/O error occurs
37 */
38 public String Usu, Cla;
39 protected void processRequest(HttpServletRequest request,
HttpServletResponse response)
40 throws ServletException, IOException {
41 response.setContentType("text/html;charset=UTF-8");
42 try (PrintWriter out = response.getWriter()) {
43//Obtención del valor de las cajas de texto de la pantalla inicio sesión del
administrador

34
44 String Usuario = request.getParameter("txtUsuarioAdmin");
45 String Contraseña = request.getParameter("txtContrasenaAdmin");
46 HttpSession sesion=request.getSession();
47 sesion.setAttribute("user", Usuario);
48 sesion.setAttribute("pass", Contraseña);
49
50 //Código para ejecutar comandos de mysql
51 String sql = "";
52 String sql2 = "";
53 sql = "SELECT NombreUsuario FROM administrador WHERE
NombreUsuario='" + Usuario + "'";
54 sql2 = "SELECT Contrasena FROM administrador WHERE
Contrasena='" + Contraseña + "'";
55
56 //Códigos para obtener los valores de nombre de usuario y
contraseña del administrador
57 try {
58 Statement st = (Statement) cn.createStatement();
59 ResultSet rs = st.executeQuery(sql);
60 while (rs.next()) {
61 Usu = rs.getString(1);
62 }
63
64 ResultSet rs2 = st.executeQuery(sql2);
65 while (rs2.next()) {
66 Cla = rs2.getString(1);
67 }
68
69 } catch (Exception e) {
70 }
71
72 //Código para validación de datos correctos al momento de ingresar
73 if (Usuario.equals(Usu) && Contraseña.equals(Cla)) {
74 if (Usuario.equals("") || Contraseña.equals("")) {
75 JOptionPane.showMessageDialog(null, "¡Error, Usuario o
contraseña incorrectos!");
76 response.sendRedirect("IniciarSesionAdmin.jsp");
77 } else {
78 if (Usuario.equals(Usu) && Contraseña.equals(Cla)) {

35
79 response.sendRedirect("PrincipalAdmin.jsp");
80 }
81 }
82 } else {
83 JOptionPane.showMessageDialog(null, "¡Error, Usuario o
contraseña incorrectos!");
84 response.sendRedirect("IniciarSesionAdmin.jsp");
85 }
86 }
87 }
88
89 // <editor-fold defaultstate="collapsed" desc="HttpServlet methods. Click
on the + sign on the left to edit the code.">
90 /**
91 * Handles the HTTP <code>GET</code> method.
92 *
97 */
98 @Override
99 protected void doGet(HttpServletRequest request, HttpServletResponse
response)
101 processRequest(request, response);
102 }
103
104 /**
105 * Handles the HTTP <code>POST</code> method.
106 *
111 */
112 @Override
113 protected void doPost(HttpServletRequest request, HttpServletResponse
response)

36
116 }
117
118 /**
119 * Returns a short description of the servlet.
120 *
121 * @return a String containing servlet description
122 */
123 @Override
124 public String getServletInfo() {
125 return "Short description";
126 }// </editor-fold>
127 Conexion cc = new Conexion();
128 Connection cn = cc.conexion();
129 }
130
4.2.3. Código de la pantalla principal del administrador
1 <%--
2 Document : PrincipalAdmin
3 Created on : 16-may-2016, 15:27:23
5 --%>
6
8 <!DOCTYPE html>
9 <html>
10 <head>
8">
14 <title>Principal</title>
15
16 <%--Codigo CSS para estilos del menu y demás componentes de la
pantalla--%>

37
18 * {
19 padding: 0;
20 margin: 0;
21 }
22
23 .wrapper {
24 width: 100%;
25 margin: auto;
26 overflow:hidden;
27 }
28 header {
29 margin-top: 38px;
30 width: 100%;
31 position: fixed;
32 z-index: 10;
33 background: rgba(105,255,143,1);
34 background: -moz-linear-gradient(top, rgba(105,255,143,1)
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
35 background: -webkit-gradient(left top, left bottom, color-
stop(0%, rgba(105,255,143,1)), color-stop(50%, rgba(105,255,143,1)), color-
stop(100%, rgba(0,107,27,1)));
36 background: -webkit-linear-gradient(top, rgba(105,255,143,1)
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
37 background: -o-linear-gradient(top, rgba(105,255,143,1) 0%,
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
38 background: -ms-linear-gradient(top, rgba(105,255,143,1) 0%,
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
39 background: linear-gradient(to bottom, rgba(105,255,143,1)
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
40 filter: progid:DXImageTransform.Microsoft.gradient(
startColorstr='#69ff8f', endColorstr='#006b1b', GradientType=0 );
41 color:#00000;
42 }
43 ul, ol{
44 list-style:none;
45 }
46 .nav li a {

38
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
stop(100%, rgba(0,107,27,1)));
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
55
56 color:#000000;
57 text-decoration:none;
58 padding: 15px 12px;
59 display:block;
60 font-family: Segoe Print;
61 font-size: 13px;
62 }
63 .nav li a:hover{
65 background: -moz-radial-gradient(center, ellipse cover,
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
66 background: -webkit-gradient(radial, center center, 0px, center
center, 100%, color-stop(0%, rgba(105,255,143,1)), color-stop(50%,
rgba(105,255,143,1)), color-stop(100%, rgba(0,189,47,1)));
67 background: -webkit-radial-gradient(center, ellipse cover,
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
68 background: -o-radial-gradient(center, ellipse cover,
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
69 background: -ms-radial-gradient(center, ellipse cover,
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
70 background: radial-gradient(ellipse at center,
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);

39
startColorstr='#69ff8f', endColorstr='#00bd2f', GradientType=1 );
73 border-bottom: 1px solid;
74 border-top: 1px solid;
75 }
76 .nav > li {
77 float:left;
78 }
79 .nav li ul {
80 display:none;
81 position:absolute;
82 min-width:200px;
83 }
84 .nav li:hover > ul{
85 display:block;
86 }
87 .nav li ul li{
88 position:relative;
89 }
90 .nav li ul li ul{
91 right:-200px;
92 top:0px;
93 }
94
95 .nav li .flecha{
96 font-size: 9px;
97 padding-left: 6px;
98 display: none;
99 }
100
101 .nav li a:not(:last-child) .flecha {
102 display: inline;
103 }
104
105 .nav li .flecha{
106 font-size: 9px;

40
108 display: none;
109 }
110
112 display: inline;}
113 </style>
114 </head>
style="background-repeat: no-repeat; width: 100%">
116 <div style="position: absolute;bottom: 0px; right: 0px;">
117 <img src="Imagenes/graduacion2.png">
118 </div>
119
120 <div style="position: absolute;bottom: 0px; left: 0px;">
121 <img src="Imagenes/graduacion.png">
122 </div>
123
124 <%--Menu de la pantalla--%>
125 <header>
126 <section class="wrapper">
127 <nav>
128 <ul class="nav">
129 <li>
130 <a href="PrincipalAdmin.jsp"><img
src="Imagenes/inicio.png" width="23" height="23"/> Inicio</a>
131 </li>
132 <li>
133 <a href=""><img src="Imagenes/informacion.png"
width="23" height="23"/>Registrar información<span
class="flecha">&#9660</span></a>
134 <ul>
135 <li><a href="RegistroAdministrador.jsp">Registrar
administrador</a></li>
136 <li><a href="RegistroSecretaria.jsp">Registrar
secretaria</a></li>
137 <li><a href="">Registrar egresado<span
138 <ul>

41
139 <li><a
href="RegistroEgresadoPersonales.jsp">Registrar dts personales</a></li>
140 <li><a
href="BuscarEgresadoIngresoAcademicos.jsp">Registrar dts académicos</a></li>
141 <li><a
href="BuscarEgresadoIngresoTrabajo.jsp">Registrar dts del trabajo</a></li>
142 </ul>
143 </li>
144 </ul>
145 </li>
146
147 <li>
148 <a href=""><img src="Imagenes/soli.png" width="23"
height="23"/> Actualizar información</a>
149 <ul>
150 <li><a href="BuscarAdministrador.jsp">Actualizar
151 <li><a href="BuscarSecretaria.jsp">Actualizar
secretaria</a></li>
152 <li><a href="">Actualizar egresado<span
153 <ul>
154 <li><a
href="BuscarEgresadoPersonales.jsp">Actualizar dts personales</a></li>
155 <li><a href="">Actualizar dts
académicos</a></li>
156 <li><a href="">Actualizar dts trabajo</a></li>
157 </ul>
158 </li>
159 </ul>
160 </li>
161
162 <li>
163 <a href=""><img src="Imagenes/notifi.png" width="23"
height="23"/> Notificaciones</a>
164 </li>
165
166 <li>

42
167 <a href=""><img src="Imagenes/reporte.png" width="23"
height="23"/> Reportes<span class="flecha">&#9660</span></a>
168 <ul>
169 <li><a href="Reporte.jsp">Reportes generales</a></li>
170 </ul>
171 </li>
172
173 <li>
174 <a href=""><img src="Imagenes/ayuda.png" width="23"
height="23"/> Ayuda</a>
175 </li>
176
177 <li>
178 <a href=""><img src="Imagenes/admin.png" width="23"
height="23"/> Administrador</a>
179 </li>
180
181 <li>
182 <a href="IniciarSesionAdmin.jsp?cerrar=true"><img
src="Imagenes/salir.png" width="23" height="23"/> Salir</a>
183 </li>
184 </ul>
185 </nav>
186 </section>
187 </header>
188 <center><div style="width: 1000px;
189 height: 300px;
190 position: absolute;
191 top: 50%;
192 left: 50%;
193 margin-top: -180px;
194 margin-left: -500px;">
196 <center>
197 <br>
GRADUADOS</b>

43
201 </center>
202 </font>
203 </div></center>
204
205 <%--Código para no permitir el ingreso a la pagina en caso de que la
sesion este inactiva--%>
206 <%
207 HttpSession sesion = request.getSession();
208 String usu;
209 String pas;
210 if (sesion.getAttribute("user") != null && sesion.getAttribute("pass") !=
null) {
211 usu = sesion.getAttribute("user").toString();
212 pas = sesion.getAttribute("pass").toString();
213 } else {
214
out.print("<script>location.replace('IniciarSesionAdmin.jsp');</script>");
215 }
216 %>
217
218 <center><div style="margin-top: 0px; border-radius: 0px 0px 0px 0;
background-color: #00cc99; height: 40px; width: 100%; position:
fixed;background: rgba(0,107,27,1);
219 background: -moz-linear-gradient(top, rgba(0,107,27,1) 0%,
rgba(105,255,143,1) 50%, rgba(105,255,143,1) 100%);
stop(100%, rgba(105,255,143,1)));
221 background: -webkit-linear-gradient(top, rgba(0,107,27,1) 0%,
rgba(105,255,143,1) 50%, rgba(105,255,143,1) 100%);
rgba(105,255,143,1) 50%, rgba(105,255,143,1) 100%);
rgba(105,255,143,1) 50%, rgba(105,255,143,1) 100%);
224 background: linear-gradient(to bottom, rgba(0,107,27,1) 0%,
rgba(105,255,143,1) 50%, rgba(105,255,143,1) 100%);
startColorstr='#006b1b', endColorstr='#69ff8f', GradientType=0 );">

44
227 <center><b><div style="margin-top: 13px;">BIENVENIDO
ADMINISTRADOR</div></b></center>
228 </font>
229 </div></center>
230
231 </body>
232 </html>
233
4.2.4. Código de la pantalla de ingreso de datos personales del egresado
1 <%--
2 Document : RegistroEgresado
3 Created on : 02-jun-2016, 21:59:06
5 --%>
6
8 <!DOCTYPE html>
9 <html>
10 <head>
8">
15
17 * {
18 padding: 0;
19 margin: 0;
20 }
21
22 .wrapper {
23 width: 100%;
24 margin: auto;
25 overflow:hidden;
26 }
27 header {

45
29 width: 100%;
30 position: fixed;
31 z-index: 10;
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
stop(100%, rgba(0,107,27,1)));
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
40 color:#00000;
41 }
42 ul, ol{
43 list-style:none;
44 }
45 .nav li a {
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
stop(100%, rgba(0,107,27,1)));
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);

46
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
54
55 color:#000000;
58 display:block;
60 font-size: 13px;
61 }
62 .nav li a:hover{
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
74 }
75 .nav > li {
76 float:left;
77 }
78 .nav li ul {
79 display:none;

47
81 min-width:200px;
82 }
84 display:block;
85 }
86 .nav li ul li{
88 }
90 right:-200px;
91 top:0px;
92 }
93
94 .nav li .flecha{
95 font-size: 9px;
97 display: none;
98 }
99
102 }
103
105 font-size: 9px;
107 display: none;
108 }
109
112 </style>
113
114 </head>
116 <form method="post" action="REP">
117

48
118 <header>
120 <nav>
122 <li>
124 </li>
125 <li>
127 <ul>
secretaria</a></li>
131 <ul>
132 <li><a
133 <li><a
134 <li><a
135 </ul>
136 </li>
137 </ul>
138 </li>
139
140 <li>
142 <ul>
secretaria</a></li>

49
146 <ul>
147 <li><a
148 <li><a
href="BuscarEgresadoAcademicos.jsp">Actualizar dts académicos</a></li>
trabajo</a></li>
150 </ul>
151 </li>
152 </ul>
153 </li>
154
155 <li>
156 <a href=""><img src="Imagenes/notifi.png"
width="23" height="23"/> Notificaciones</a>
157 </li>
158
159 <li>
160 <a href=""><img src="Imagenes/reporte.png"
width="23" height="23"/> Reportes<span class="flecha">&#9660</span></a>
161 <ul>
162 <li><a href="Reporte.jsp">Reportes
generales</a></li>
163 </ul>
164 </li>
165
166 <li>
167 <a href=""><img src="Imagenes/ayuda.png"
width="23" height="23"/> Ayuda</a>
168 </li>
169
170 <li>
171 <a href=""><img src="Imagenes/admin.png"
width="23" height="23"/> Administrador</a>
172 </li>
173
174 <li>

50
176 </li>
177 </ul>
178 </nav>
179 </section>
180 </header>
182 height: 100px;
184 left: 50%;
185 margin-left: -500px;
186 margin-top: 90px;">
188 <center>
189 <br>
191 "NUESTRA SEÑORA DEL ROSARIO"<br>
GRADUADOS</b>
193 </center>
194 </font>
195 </div></center>
196
197
198
199 <%--Componentes cajas de texto, y botones nesesarios para el login-
-%>
50px 50px 0px 0; background-color: #00cc99; height: 40px;border: black 1px
solid; border-collapse: separate;
#FF0000 33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;

51
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #107f63 100%) no-repeat;
220 <td width="1193">
222 <center><b>REGISTRO DE DATOS PERSONALES DEL
EGRESADO</b></center>
223 </font>
224 </td>
225 </table>
226
227 <table style="position:absolute;top:340px;left:50px; box-shadow: 5px
5px 10px 5px; height: 265px; padding-left: 20px; width: 1200px; color:
#3a523b">
228 </table>
229 <div style="position:absolute;top:362px;left:85px; border: black 1px
solid;width: 542px; height: 30px; padding-top: 2px; background: #00cc99;
border-radius: 50px 50px 0px 0; border-collapse: separate;
#FF0000 33%, #330000 100%) no-repeat;

52
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #107f63 100%) no-repeat;
248 border: 1px solid">
249 <center><b><font face="Segoe Print" size="3">Datos
Personales</b></font></center>
250
251 <div style="padding-top: 10px; padding-left: 5px; border: black
1px solid; height: 178px;">
252 <pre><font face="Segoe Print" size="3">Nombres:* <input
style="width: 150px" type="text" name="txtENombres" placeholder="Ingrese
Nombres"> Apellidos:* <input style="width: 148px" type="text"
name="txtEApellidos" id="IDEApellido" placeholder="Ingrese Apellidos">
253 País:* <select style="height: 22px; width: 154px;" name="cmbEPais">
254 <option value="Seleccionar">Seleccionar</option>
255 <option value="Alemania">Alemania</option>
256 <option value="Argelia">Argelia</option>
257 <option value="Argentina">Argentina</option>
258 <option value="Australia">Australia</option>
259 <option value="Austria">Austria</option>
260 <option value="Bélgica">Bélgica</option>
261 <option value="Bolivia">Bolivia</option>
262 <option value="Brasil">Brasil</option>
263 <option value="Canadá">Canadá</option>

53
264 <option value="Chile">Chile</option>
265 <option value="China">China</option>
266 <option value="Colombia">Colombia</option>
267 <option value="Corea">Corea</option>
268 <option value="Costa Rica">Costa Rica</option>
269 <option value="Cuba">Cuba</option>
270 <option value="Dinamarca">Dinamarca</option>
271 <option value="Ecuador">Ecuador</option>
272 <option value="Egipto">Egipto</option>
273 <option value="El Salvador">El Salvador</option>
274 <option value="España">España</option>
275 <option value="Estados Unidos">Estados Unidos</option>
276 <option value="Francia">Francia</option>
277 <option value="Guatemala">Guatemala</option>
278 <option value="Haití">Haití</option>
279 <option value="Honduras">Honduras</option>
280 <option value="Italia">Italia</option>
281 <option value="Jamaica">Jamaica</option>
282 <option value="Japón">Japón</option>
283 <option value="México">México</option>
284 <option value="Nicaragua">Nicaragua</option>
285 <option value="Nigeria">Nigeria</option>
286 <option value="Noruega">Noruega</option>
287 <option value="Polonia">Polonia</option>
288 <option value="Portugal">Portugal</option>
289 <option value="Puerto Rico">Puerto Rico</option>
290 <option value="Suiza">Suiza</option>
291 <option value="Tailandia">Tailandia</option>
292 <option value="Turquía">Turquía</option>
293 <option value="Ucrania">Ucrania</option>
294 <option value="Uruguay">Uruguay</option>
295 <option value="Venezuela">Venezuela</option>
296 </select> Cédula:* <input style="width: 147px"
type="text" name="txtECedula" placeholder="xxxxxxxxxx">
297 Sexo:* <select style="height: 22px; width: 156px;" name="cmbESexo">
298 <option value="Seleccionar" selected>Seleccionar</option>
299 <option value="Masculino">Masculino</option>
300 <option value="Femenino">Femenino</option>
301 <option value="Otros">Otros</option>

54
302 </select> Pasaporte: <input style="width: 147px" type="text"
name="txtEPasaporte" placeholder="xxxxxxxxxx">
303 Fecha de nacimiento:* <input style="width: 75px" type="text"
name="txtEFechaNacimiento" placeholder="dd/mm/aaaa"> Edad: <input
style="width: 147px" type="text" name="txtEEdad" placeholder="xx">
304 Email:* <input style="width: 150px" type="text" name="txtEEmail"
placeholder="example@gmail.com"> Estado Civil: <select style="height: 22px;
width: 150px;" name="cmbEEstadoCivil">
305
<option value="Seleccionar" selected>Seleccionar</option>
306
<option value="Casado">Casado</option>
307
<option value="Soltero">Soltero</option>
308
<option value="Divorciado">Divorciado</option>
309 </select>
310 </pre>
311
312 </div>
313 </div>
314
315
316 <div style="position:absolute;top:362px;left:670px; border: black 1px
solid;width: 542px; height: 30px; padding-top: 2px; background: #00cc99;
border-radius: 50px 50px 0px 0; border-collapse: separate;
#FF0000 33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;

55
33%, #330000 100%) no-repeat;
33%, #107f63 100%) no-repeat;
336 <center><b><font face="Segoe Print" size="3">Datos
Informativos</b></font></center>
337
338 <div style="padding-top: 18px; padding-left: 5px; border: black
1px solid; height: 170px;">
339 <pre><font face="Segoe Print" size="3">Dirección:* <input
style="width: 150px" type="text" name="txtEDireccion" placeholder="Ingrese
Dirección"> Provincia:* <input style="width: 150px" type="text"
name="txtEProvincia" placeholder="Ingrese Provincia">
340 Teléfono:* <input style="width: 146px" type="text" name="txtETelefono"
placeholder="xxxxxxxxx"> Especialidad:* <select style="height: 22px; width:
135px;" name="cmbEEspecialidad">
342 <option value="Analisis de sistemas">Análisis de
Sistemas</option>
343 <option value="Contabilidad">Contabilidad y
Auditoria</option>
344 </select>
345 Celular:* <input style="width: 150px" type="text" name="txtECelular"
placeholder="xxxxxxxxxx"> Estado:* <select style="height: 22px; width: 153px;"
name="cmbEEstadoAcademico">
347 <option value="Egresado">Egresado</option>
348 <option value="Graduado">Graduado</option>
349 </select>

56
350 <center>Contraseña:* <input style="width: 150px" type="password"
name="txtEContrasena" placeholder="**********"></center>
351 </pre>
352 </div>
353 </div>
0px 0px 50px 50px; box-shadow: 5px 5px 10px 5px; background-color:
#00cc99; height: 85px;border: black 1px solid; width: 1202px; border-collapse:
separate;
#FF0000 33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #107f63 100%) no-repeat;
374 <td>
375 <center><input style="height: 50px; width: 150px; font-family:
Segoe Print; font-size: 15px; border-collapse: separate;

57
380 background: -webkit-linear-gradient(top, #FF6666
0, #FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
385 background: linear-gradient(to bottom, white 0,
white 33%, #107f63 100%) no-repeat;
0.35);
0.35);
393 padding:0 20px;
394 margin:0 auto;
399 border: 1px solid;" type="Submit" value="Registrar"
name="btnERegistrar"></center>
400 </form>
401 </td>
402 <td>
403 <form method="post" action="RegistroEgresadoPersonales.jsp">
404 <center><input style="height: 50px; width: 150px; font-family: Segoe
Print; font-size: 15px; border-collapse: separate;

58
#FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
414 background: linear-gradient(to bottom, white 0, white
33%, #107f63 100%) no-repeat;
422 padding:0 20px;
423 margin:0 auto;
428 border: 1px solid;" type="Submit" value="Nuevo"
name="btnENuevo"></center>
429 </form>
430 </td>
431 <td>
432 <form method="post" action="PrincipalAdmin.jsp">
433 <center><input style="height: 50px; width: 150px; font-family: Segoe
Print; font-size: 15px; border-collapse: separate;

59
#FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
443 background: linear-gradient(to bottom, white 0, white
33%, #107f63 100%) no-repeat;
451 padding:0 20px;
452 margin:0 auto;
457 border: 1px solid;" type="Submit" value="Cancelar"
name="btnECancelar"></center>
458 </form>
459 </td>
460 </table>
461 </form>
462
463 <%
465 String usu;
466 String pas;
467 if (sesion.getAttribute("user") != null && sesion.getAttribute("pass") != null)
{

60
470 } else {
471 out.print("<script>location.replace('IniciarSesionAdmin.jsp');</script>");
472 }
473 %>
474 <center><div style="margin-top: 0px; border-radius: 0px 0px 0px 0;
background-color: #00cc99; height: 40px; width: 100%; position:
fixed;background: rgba(0,107,27,1);
475 background: -moz-linear-gradient(top, rgba(0,107,27,1) 0%,
rgba(105,255,143,1) 50%, rgba(105,255,143,1) 100%);
476 background: -webkit-gradient(left top, left bottom, color-stop(0%,
rgba(0,107,27,1)), color-stop(50%, rgba(105,255,143,1)), color-stop(100%,
rgba(105,255,143,1)));
477 background: -webkit-linear-gradient(top, rgba(0,107,27,1) 0%,
rgba(105,255,143,1) 50%, rgba(105,255,143,1) 100%);
rgba(105,255,143,1) 50%, rgba(105,255,143,1) 100%);
rgba(105,255,143,1) 50%, rgba(105,255,143,1) 100%);
480 background: linear-gradient(to bottom, rgba(0,107,27,1) 0%,
rgba(105,255,143,1) 50%, rgba(105,255,143,1) 100%);
startColorstr='#006b1b', endColorstr='#69ff8f', GradientType=0 );">
483 <center><b><div style="margin-top: 13px;">BIENVENIDO
ADMINISTRADOR</div></b></center>
484 </font>
485 </div></center>
486
487
488 </body>
489 </html>

61
4.2.4.1. Código del servelt para ingresar datos personales del egresado a
la base de datos
1 /*
2 * To change this license header, choose License Headers in Project Properties.
3 * To change this template file, choose Tools | Templates
4 * and open the template in the editor.
5 */
6 package Servidores;
7
8 import Controlador.Conexion;
9 import Modelo.DatosPersonalesEgresado;
10 import com.mysql.jdbc.PreparedStatement;
11 import java.io.IOException;
12 import java.io.PrintWriter;
13 import java.sql.Connection;
14 import javax.servlet.ServletException;
15 import javax.servlet.annotation.WebServlet;
16 import javax.servlet.http.HttpServlet;
17 import javax.servlet.http.HttpServletRequest;
18 import javax.servlet.http.HttpServletResponse;
19 import javax.swing.JOptionPane;
20
21 /**
22 *
23 * @author Dennis Guevara
24 */
25 @WebServlet(name = "REP", urlPatterns = {"/REP"})
26 public class RegistroEgresadoPersonales extends HttpServlet {
27
28 /**
29 * Processes requests for both HTTP <code>GET</code> and
<code>POST</code>
30 * methods.
31 *

62
36 */
37 protected void processRequest(HttpServletRequest request,
HttpServletResponse response)
39 response.setContentType("text/html;charset=UTF-8");
40 try (PrintWriter out = response.getWriter()) {
41 /* TODO output your page here. You may use following sample code.
*/
42 int op = JOptionPane.showConfirmDialog(null, "¿Desea guardar los
datos?");
43 if (op == JOptionPane.YES_OPTION) {
44 //Obtencion de valores de las cajas de texto de la ventana de
registro de datos perosnales del egresado
45 String Nombres = request.getParameter("txtENombres");
46 String Apellidos = request.getParameter("txtEApellidos");
47 String Pais = request.getParameter("cmbEPais");
48 String Cedula = request.getParameter("txtECedula");
49 String Sexo = request.getParameter("cmbESexo");
50 String Pasaporte = request.getParameter("txtEPasaporte");
51 String FechaNacimiento =
request.getParameter("txtEFechaNacimiento");
52 String Edad = request.getParameter("txtEEdad");
53 String Email = request.getParameter("txtEEmail");
54 String EstadoCivil = request.getParameter("cmbEEstadoCivil");
55 String Direccion = request.getParameter("txtEDireccion");
56 String Provincia = request.getParameter("txtEProvincia");
57 String Telefono = request.getParameter("txtETelefono");
58 String Especialidad = request.getParameter("cmbEEspecialidad");
59 String Celular = request.getParameter("txtECelular");
60 String EstadoAcademico =
request.getParameter("cmbEEstadoAcademico");
61 String Contraseña = request.getParameter("txtEContrasena");
62
63
64 //Validación de campos, en el caso de que esten vacios
65 if(Nombres.equals("") || Apellidos.equals("") ||
Pais.equals("Seleccionar") || Cedula.equals("") || Sexo.equals("Seleccionar") ||
Pasaporte.equals("") || FechaNacimiento.equals("") || Edad.equals("") ||
Email.equals("") || EstadoCivil.equals("Seleccionar") || Direccion.equals("") ||

63
Provincia.equals("") || Telefono.equals("") || Especialidad.equals("Seleccionar") ||
Celular.equals("") || EstadoAcademico.equals("Seleccionar") || Contraseña.equals("")){
66 JOptionPane.showMessageDialog(null,"¡Error, No se puede
guardar porque existen campos vacios!");
67 response.sendRedirect("RegistroEgresadoPersonales.jsp");
68 }
69 else{
70 try {
71 //Código para registrar a la base de datos
72 PreparedStatement pst = (PreparedStatement)
cn.prepareStatement("INSERT INTO egresado_datos_personales(Nombres, Apellidos,
Pais, Cedula, Sexo, Pasaporte, FechaNacimiento, Edad, Email,
EstadoCivil,Direccion,Provincia,Telefono,Especialidad,Celular,EstadoAcademico,Cont
rasena) VALUES(?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?,?)");
73 DatosPersonalesEgresado egre=new
DatosPersonalesEgresado(Nombres, Apellidos, Pais, Cedula, Sexo, Pasaporte,
FechaNacimiento, Edad, Email, EstadoCivil, Direccion, Provincia, Telefono,
Especialidad, Celular, EstadoAcademico, Contraseña);
74
75 pst.setString(1, egre.getNombres());
76 pst.setString(2, egre.getApellidos());
77 pst.setString(3, egre.getPais());
78 pst.setString(4, egre.getCedula());
79 pst.setString(5, egre.getSexo());
80 pst.setString(6, egre.getPasaporte());
81 pst.setString(7, egre.getFechaNacimiento());
82 pst.setString(8, egre.getEdad());
83 pst.setString(9, egre.getEmail());
84 pst.setString(10, egre.getEstadoCivil());
85 pst.setString(11, egre.getDireccion());
86 pst.setString(12, egre.getProvincia());
87 pst.setString(13, egre.getTelefono());
88 pst.setString(14, egre.getEspecialidad());
89 pst.setString(15, egre.getCelular());
90 pst.setString(16, egre.getEstadoAcademico());
91 pst.setString(17, egre.getContrasena());
92
93 pst.executeUpdate();

64
94 JOptionPane.showMessageDialog(null, "Los datos se han
guardado correctamente");
95 response.sendRedirect("PrincipalAdmin.jsp");
96
97 } catch (Exception e) {
98 out.printf("error");}}
99 }else{
100 response.sendRedirect("RegistroEgresadoPersonales.jsp");
101 }
102 }
103 }
104
105 // <editor-fold defaultstate="collapsed" desc="HttpServlet methods. Click
on the + sign on the left to edit the code.">
106 /**
107 * Handles the HTTP <code>GET</code> method.
108 *
113 */
114 @Override
115 protected void doGet(HttpServletRequest request, HttpServletResponse
response)
118 }
119
120 /**
121 * Handles the HTTP <code>POST</code> method.
122 *
127 */
128 @Override

65
129 protected void doPost(HttpServletRequest request, HttpServletResponse
response)
132 }
133
134 /**
135 * Returns a short description of the servlet.
136 *
137 * @return a String containing servlet description
138 */
139 @Override
140 public String getServletInfo() {
141 return "Short description";
142 }// </editor-fold>
143 Conexion cc = new Conexion();
144 Connection cn = cc.conexion();
145 }
4.2.5. Código de la pantalla de matriz de las secretarias
1 <%--
2 Document : BuscarSecretaria
3 Created on : 28-jul-2016, 20:12:36
5 --%>
6
7 <%@page import="Modelo.ConsultaSecretaria"%>
8 <%@page import="java.util.List"%>
9 <%@page import="Modelo.BuscarSecretaria"%>
11 <!DOCTYPE html>
12 <html>
13 <head>
8">
17 <title>Buscar Secretaria</title>

66
18
20 * {
21 padding: 0;
22 margin: 0;
23 }
24
25 .wrapper {
26 width: 100%;
27 margin: auto;
28 overflow:hidden;
29 }
30 header {
32 width: 100%;
33 position: fixed;
34 z-index: 10;
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
stop(100%, rgba(0,107,27,1)));
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
43 color:#00000;
44 }
45 ul, ol{
46 list-style:none;
47 }
48 .nav li a {

67
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
stop(100%, rgba(0,107,27,1)));
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
0%, rgba(105,255,143,1) 50%, rgba(0,107,27,1) 100%);
57
58 color:#000000;
61 display:block;
63 font-size: 13px;
64 }
65 .nav li a:hover{
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);
rgba(105,255,143,1) 0%, rgba(105,255,143,1) 50%, rgba(0,189,47,1) 100%);

68
77 }
78 .nav > li {
79 float:left;
80 }
81 .nav li ul {
82 display:none;
84 min-width:200px;
85 }
87 display:block;
88 }
89 .nav li ul li{
91 }
93 right:-200px;
94 top:0px;
95 }
96
97 .nav li .flecha{
98 font-size: 9px;
100 display: none;
101 }
102
105 }
106
108 font-size: 9px;

69
110 display: none;
111 }
112
115 #div1 {
116 overflow:scroll;
117 height:255px;
118 width:100%;
119 background: white;
120 border: solid 2px;
121 box-shadow: 5px 5px 10px 0px;
123 }
124 #div1 table {
125 width: 100%;
126 background-color:white;
127 }
128 </style>
129 </head>
style="background-repeat: no-repeat; width: 100%">
131 <header>
133 <nav>
135 <li>
137 </li>
138 <li>
140 <ul>
secretaria</a></li>

70
144 <ul>
145 <li><a
146 <li><a
147 <li><a
148 </ul>
149 </li>
150 </ul>
151 </li>
152
153 <li>
155 <ul>
secretaria</a></li>
159 <ul>
160 <li><a
académicos</a></li>
162 <li><a href="">Actualizar dts trabajo</a></li>
163 </ul>
164 </li>
165 </ul>
166 </li>
167
168 <li>
169 <a href=""><img src="Imagenes/notifi.png" width="23"
height="23"/> Notificaciones</a>
170 </li>

71
171
172 <li>
173 <a href=""><img src="Imagenes/reporte.png" width="23"
height="23"/> Reportes<span class="flecha">&#9660</span></a>
174 <ul>
175 <li><a href="Reporte.jsp">Reportes generales</a></li>
176 </ul>
177 </li>
178
179 <li>
180 <a href=""><img src="Imagenes/ayuda.png" width="23"
height="23"/> Ayuda</a>
181 </li>
182
183 <li>
184 <a href=""><img src="Imagenes/admin.png" width="23"
height="23"/> Administrador</a>
185 </li>
186
187 <li>
189 </li>
190 </ul>
191 </nav>
192 </section>
193 </header>
194
196 height: 100px;
198 left: 50%;
199 margin-left: -500px;
200 margin-top: 90px;">
202 <center>
203 <br>
205 "NUESTRA SEÑORA DEL ROSARIO"<br>

72
GRADUADOS</b>
207 </center>
208 </font>
209 </div></center>
210 <%
212 String usu;
213 String pas;
214 if (sesion.getAttribute("user") != null && sesion.getAttribute("pass")
!= null) {
217 } else {
218
out.print("<script>location.replace('IniciarSesionAdmin.jsp');</script>");
219 }
220 %>
221
222 <div style="width: 1200px;
223 height: 300px;
225 top: 20%;
226 left: 40%;
227 margin-top: -150px;
228 margin-left: -598px;">
229 <div>
230 <%--Componentes cajas de texto, y botones nesesarios para el login-
-%>
0px 0px 0px 0; background-color: #00cc99; height: 40px; border-collapse:
separate;
#FF0000 33%, #330000 100%) no-repeat;

73
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #330000 100%) no-repeat;
33%, #107f63 100%) no-repeat;
251 <td width="1194">
253 <center><b>ACTUALIZAR SECRETARIA</b></center>
254 </font>
255 </td>
256 </table>
257
258 <table style="position:absolute;top:340px;left:125px; height: 360px;
padding-left: 20px;"></table>
259 <form method="post" action="">
260 <div style="position:absolute;top:365px;left:150px;">
261 <center><font face="Segoe Print" size="3">
262 Parametro:
263 <select style="height: 24px; width: 100px; border: 1px
solid #003300;" name="cmbSParametro">
264 <option value="Seleccionar"
selected>Seleccionar</option>
265 <option value="NombreBuscarS">Nombre</option>
266 <option value="ApellidoBuscarS">Apellido</option>
267 <option value="CedulaBuscarS">Cédula</option>

74
268 </select>
269 <input style="height: 22px; border: 1px solid #003300;"
type="text" name="txtBuscarSecre" size="15" placeholder="xxxxxxxxxxxxxxxxx">
270
271 <input style="height: 40px; width: 105px; border-collapse:
separate;
276 background: -webkit-linear-gradient(top, #FF6666
0, #FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
#FF0000 33%, #330000 100%) no-repeat;
281 background: linear-gradient(to bottom, #00cc99 0,
#00cc99 33%, #107f63 100%) no-repeat;
0.35);
0.35);
289 padding:0 20px;
290 margin:0 auto;
295 border: 1px solid;" type="Submit" value="Buscar"><br>
296 <%--aqui va la tabla de busqeuda parametro--%>

75
297
298 <%
299 if (request.getParameter("cmbSParametro") != null) {
300 if
(request.getParameter("cmbSParametro").equals("ApellidoBuscarS")) {
301 String apellido =
request.getParameter("txtBuscarSecre");
302 List<BuscarSecretaria> secre =
ConsultaSecretaria.BuscarSecretariaApellido(apellido);
303 for (int i = 0; i < secre.size(); i++) {
304 %>
305 <center><br>
306 <font face="Segoe Print">
307 <table style="margin-top:-10px; font-family: Segoe
Print; font-size: 14.5px;">
308 <thead>
309 <th style="border: solid 1px; border-radius: 5px;
background: #66ffff">Nombres </th>
310 <th style="border: solid 1px; border-radius: 5px;
background: #66ffff">Apellidos </th>
311 <th style="border: solid 1px; border-radius:
5px;background: #66ffff">Cédula </th>
5px;background: #66ffff">Dirección </th>
5px;background: #66ffff">Teléfono </th>
5px;background: #66ffff">Correo </th>
5px;background: #66ffff">Sexo </th>
5px;background: #66ffff">Edad </th>
5px;background: #66ffff">NombreUsuario </th>
318 </thead>
319
320 <tr>
321 <td style="border: solid
1px;"><%=secre.get(i).getNombre()%> </td>

Proyecto de seguimiento de egresados

Proyecto de seguimiento de egresados

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Similar a Proyecto de seguimiento de egresados

Similar a Proyecto de seguimiento de egresados (20)

Último

Último (20)

Proyecto de seguimiento de egresados