Monografia Trabajando

UNIVERSIDAD NACIONAL AUTÓNOMA DE NICARAGUA, LEÓN
UNAN-LEÓN
FACULTAD DE CIENCIAS Y TECNOLOGÍA
DEPARTAMENTO DE COMPUTACIÓN
INGENIERÍA EN SISTEMAS DE INFORMACIÓN
PROTOCOLO DE MONOGRAFIA
Tema:
SISTEMA WEB DE INVENTARIO Y FACTURACIÓN DE VENTA PARA LA

TIENDA SYSTEMANAGER UTILIZANDO LA PLANTILLA ADMINLTE, EL
LENGUAJE PHP Y MYSQL.
Autores:
 Br. Carlos Manuel Martínez Chevez
 Br. David Guillermo Martínez Solórzano.
 Br. Yelzon Humberto Delgado Blanco
Tutor:
 MSc. Álvaro Rafael Altamirano Osorio
 Dr. Ms. Jorge Soes Centeno Borge
León, Nicaragua, Julio de 2020
“A LA LIBERTAD POR LA UNIVERSIDAD”

UNIVERSIDAD NACIONAL AUTÓNOMA DE NICARAGUA, LEÓN
UNAN-LEÓN
FACULTAD DE CIENCIAS Y TECNOLOGÍA
DEPARTAMENTO DE COMPUTACIÓN
INGENIERÍA EN SISTEMAS DE INFORMACIÓN
PROTOCOLO DE MONOGRAFIA
Tema:
SISTEMA WEB DE INVENTARIO Y FACTURACIÓN DE VENTA PARA LA

TIENDA SYSTEMANAGER UTILIZANDO LA PLANTILLA ADMINLTE, EL
LENGUAJE PHP Y MYSQL.
Autores: Firmas
 Br. Carlos Manuel Martínez Chevez ___________________
 Br. David Guillermo Martínez Solórzano ___________________
 Br. Yelzon Humberto Delgado Blanco ___________________
Tutor:
 MSc. Álvaro Rafael Altamirano Osorio ___________________
 Dr. Ms. Jorge Soes Centeno Borge ___________________
León, Nicaragua, Julio de 2020
“A LA LIBERTAD POR LA UNIVERSIDAD”

Índice
I. RESUMEN..........................................................................................................................4
II. DEDICATORIA..................................................................................................................5
III. AGRADECIMIENTOS...................................................................................................6
IV. INTRODUCCION...........................................................................................................7
V. PLANTEAMIENTO DEL PROBLEMA...........................................................................8
VI. ALCANCES....................................................................................................................9
VII. ANTECEDENTES.......................................................................................................10
VIII. JUSTIFICACION.........................................................................................................11
IX. OBJETIVOS.................................................................................................................12
9.1. Objetivo General....................................................................................................12
9.2. Objetivos Específicos...........................................................................................12
X. Marco Teórico................................................................................................................13
10.1. Los sistemas de información:........................................................................13
10.2. PHP:......................................................................................................................13
10.3. AdminLTE:...........................................................................................................15
10.4. XAMPP:................................................................................................................15
10.5. SQL:......................................................................................................................16
10.6. MySQL:.................................................................................................................16
10.7. HOST:...................................................................................................................17
10.8. SMTP:...................................................................................................................17
10.9. PROTOCOLO SSL:............................................................................................17
10.10. PROTOCOLO TLS:............................................................................................18
10.11. AUTENTICACION DE MENSAJE:...................................................................18
10.12. REPORTES:.........................................................................................................18
10.13. LIBRERÍA:............................................................................................................19
10.14. LIBRERÍA TCPDF:..............................................................................................19
10.15. Plug-in:.................................................................................................................19
10.16. JQuery DataTable:.............................................................................................20
10.17. MorrisJS:.............................................................................................................20
10.18. ChartJS:...............................................................................................................20
10.19. Date Range Picker:............................................................................................20
1
10.20. Input Mask:..........................................................................................................20
XI. METODOLOGIA..........................................................................................................21
11.1. Tipo de estudio...................................................................................................21
11.2. Métodos...............................................................................................................21
11.3. Unidad de análisis.............................................................................................21
11.4. Técnica de Investigación.................................................................................21
11.5. Planificación de la iteración o ciclo..............................................................22
11.5.1. Determinar o fijar objetivos:....................................................................22
11.5.2. Planificación:..............................................................................................22
11.5.3. Análisis y evaluación de riesgos:..........................................................22
11.5.4. Desarrollar y probar:.................................................................................23
11.5.5. Planificación de la siguiente iteración:................................................23
XII. RECURSOS HARDWARE Y SOFTWARE.............................................................24
a. Hardware:....................................................................................................................24
b. Software:......................................................................................................................24
XIII. ESPECIFICACION DE REQUISITOS DE SOFTWARE........................................25
Información del Proyecto................................................................................................25
Propósito.............................................................................................................................25
Alcance del producto / Software...................................................................................25
Referencias.........................................................................................................................25
Funcionalidades del producto.......................................................................................26
Clases y características de usuarios............................................................................26
Entorno operativo.............................................................................................................26
Requerimientos funcionales...........................................................................................26
1. Administración del sistema....................................................................................26
2. Administración de inventario de producto.........................................................27
3. Gestión de ventas.....................................................................................................28
4. Reportes......................................................................................................................29
Reglas de negocio.............................................................................................................29
Requerimientos de interfaces externas.......................................................................29
Interfaces de usuario....................................................................................................29
Interfaces de hardware.................................................................................................29
Interfaces de software..................................................................................................29
Interfaces de comunicación........................................................................................30
Requerimientos no funcionales.....................................................................................30
10.1 Requisitos de rendimiento.................................................................................30
2
10.2 Seguridad...............................................................................................................30
10.3 Fiabilidad................................................................................................................30
10.4 Disponibilidad........................................................................................................30
Otros requerimientos.......................................................................................................31
11.1 Usabilidad...............................................................................................................31
XIV. DIAGRAMAS...............................................................................................................31
14.1. Diagrama ER.......................................................................................................31
Diagrama relacional..........................................................................................................32
...............................................................................................................................................33
Diagrama de casos de usos............................................................................................33
Desarrollo y documentación del sistema....................................................................37
Administrador:...................................................................................................................38
...............................................................................................................................................38
Administración del Sistema:..........................................................................................39
Datos de la empresa:........................................................................................................39
Editar datos de la empresa.............................................................................................40
Usuarios:.............................................................................................................................41
...............................................................................................................................................41
Roles:...................................................................................................................................43
...............................................................................................................................................43
Estado de la bitácora:......................................................................................................51
Configurar Correo:............................................................................................................52
...............................................................................................................................................63
XV. CONCLUSIONES........................................................................................................70
XVI. RECOMENDACIONES...............................................................................................70
XVII. Bibliografía..............................................................................................................71
XVIII. Anexos.....................................................................................................................72
18.1. CRONOGRAMA:.....................................................................................................72
...............................................................................................................................................72
18.2. GLOSARIO DE TERMINOS:......................................................................................73
Glosario...............................................................................................................................73
 Pruebas: Proceso mediante el cual se realizan actividades para verificar la
óptima función del sistema.................................................................................................73
3
I. RESUMEN
El presente proyecto consiste en desarrollar e implementar una plataforma Web

llamada SYSTEMANAGER la cual está dirigida una tienda del mismo nombre
para administrar principales actividades de manejo de una tienda como
inventario, gestiones de ventas, reportes y bitácora. La principal característica
de esta plataforma es la facilidad de manejo con la que un determinado usuario
tendrá al realizar cualquier actividad concerniente al inventario de sus
productos. Resolviendo así necesidades específicas del usuario ayudando a
una mayor compresión e interacción empresa/cliente. El proyecto implica tres
ramas. La primera de estas ramas es la Programación Web siendo esta la base
principal del proyecto se apoyará en la rama de Diseño Web y sustentará toda
su información en la rama de Base de Datos. Para la realización de este
proyecto es necesario apoyarse en una plantilla llamada AdminLTE, la cual es
de gran ayuda para dar sencillez y fácil uso a las distintas bondades del
proyecto. Las herramientas utilizadas en el desarrollo son herramientas
Microsoft, para la programación se utilizará Visual Studio Code, se trabajará
con MVC para todas las gestiones y procesos de las funciones en la plataforma
y así facilitar el acceso a datos, se implementó en el motor de base de datos
MySQL. La finalidad de esta plataforma administrativa es proporcionar
automaticidad, seguridad, orden, control sobre las acciones principales en la
tienda, facilidades para el acceso a la información. Por lo que esta plataforma
web será uno de los proyectos tecnológicos más completos en cuanto a
administración y manejo de una tienda. y podrá ser monitoreada desde
cualquier parte y en cualquier momento tener información a tiempo real de la
tienda.
4
II. DEDICATORIA
El presente trabajo investigativo lo dedicamos principalmente a Dios, por ser el

inspirador y darnos fuerza para continuar en este proceso de obtener uno de
los anhelos más deseados.
A nuestros padres, por su amor, trabajo y sacrificio en todos estos años,

gracias a ustedes hemos logrado llegar hasta aquí́ y convertirnos en lo que
somos.
A nuestros hermanas (os) por estar siempre presentes, acompañándonos y por

el apoyo moral, que nos brindaron a lo largo de esta etapa de nuestras vidas.
A todas las personas que nos han apoyado y han hecho que el trabajo se
realice con éxito en especial a aquellos que nos abrieron las puertas y
compartieron sus conocimientos.
5
III. AGRADECIMIENTOS
Agradecemos a Dios por bendecirnos la vida, por guiarnos a lo largo de nuestra

existencia, ser el apoyo y fortaleza en aquellos momentos de dificultad y
debilidad.
Gracias a nuestros padres:
Pedro Martínez y Karla Chévez.
Guillermo Martínez y Olga Solórzano.
Jairo Delgado y Natividad Blanco.
Por ser los principales promotores de nuestros sueños, por confiar y creer en
nuestras expectativas, por los consejos, valores y principios que nos han
inculcado.
Agradecemos a nuestros docentes de la Facultad de Ciencias y Tecnología del

Departamento de Computación de la Carrera de Ingeniería en Sistema de
Información de la Universidad Nacional Autónoma de Nicaragua, León (UNAN-
LEÓN), por haber compartido sus conocimientos a lo largo de la preparación de
nuestra profesión, de manera especial, a nuestros tutores:
MSc. Álvaro Rafael Altamirano Osorio.
Dr. Ms. Jorge Soes Centeno Borge.
De nuestro proyecto de investigación quien ha guiado con su paciencia, y

su rectitud como docente.
6
IV. INTRODUCCION
El presente proyecto se refiere a la creación de un sistema web para el manejo

de actividades de registros e inventarios de una tienda. A través de
ordenadores y software es la manera más eficiente y eficaz para llevar el
control ágil y seguro de esta, por lo que los programas especializados se
convierten en una herramienta ideal e indispensable para facilitar el trabajo de
las personas en distintas áreas y brindarles distintas ventajas competitivas a los
usuarios y administradores.
Hay interés al realizar este proyecto ya que encontramos que muchas tiendas
dedicadas a la venta de computadoras y sus respectivos accesorios que aparte
de no tener un sistema de registro pierden tiempo cuando los clientes tienen
que llenar formularios de datos, equipos y facturas.
En este marco de innovación y cambio, la opción de generar entornos
informáticos llenos de bondades y amigable para cualquier usuario, supone
responder de forma integral a los requerimientos que impone la sociedad y las
nuevas necesidades del entorno comercial. Dentro de este contexto de
innovación es donde surgen nuestro sistema informático.
7
V. PLANTEAMIENTO DEL PROBLEMA
Las empresas o negocios tienen en cuenta que la tecnología ya no es un lujo y

que debe formar parte integral de un modelo de negocio. De ello surge la
necesidad de implementar proyectos que involucran a las tecnologías de la
información.
Las tareas rutinarias de recopilar, transmitir, registrar y revisar información en
una tienda en la que se venden de computadoras, accesorios tecnológicos,
muchas veces se llevan a cabo de forma manual.
Hoy en día contamos con una avanzada tecnología como los servicios online
sin embargo este recurso no es aprovechado al máximo en las tiendas para
facilitar el control de los equipos.
Una deficiente organización en el inventario genera costos adicionales, ya que
se debe asumir la perdida de realizar una venta cuando no se encuentran los
productos a tiempo, pues no se sabe con exactitud si hay productos
disponibles, hasta que se revisa físicamente el inventario de la tienda; lo
anterior, genera incertidumbre y obstaculiza la toma de decisiones por parte del
propietario. Y ya que el control de inventarios es un factor que influye en la
reducción de costos de las microempresas, se debe implementar un sistema
informático, para que de esta manera se obtengan mejores utilidades y
beneficios para la organización.
8
VI. ALCANCES
El proyecto web SYSTEMANAGER dirigido a tiendas o empresas tiene como

finalidad:
Buscar la manera de tener implementada la mayoría de las funcionalidades que
permitan un correcto manejo de un inventario, ventas y otras actividades diarias
de una tienda.
Brindar a los diversos usuarios una fácil interacción con las diversas
funcionalidades de la plataforma. Este proyecto web alojara funcionalidades
como gestión de usuarios, gestión de ventas, gestión de inventario, bitácora,
reportes, facturas. Todas estas funcionalidades hacen este proyecto tan viable
y completo ente la necesidad de automatizar y tener un mejor control por
cualquier tienda.
Una de las principales bondades de SYSTEMANAGER es el manejo de roles
de usuarios el cual permitirá al administrador mantener el control no solo del
sitio en cuestión, sino que además podrá delegar permisos sobre los demás
usuarios y las actividades que estos podrán hacer en la plataforma.
Ser uno de los sitios web más completos al momento de brindar automaticidad
y orden a una tienda determinada
9
VII. ANTECEDENTES
En primer lugar, se tiene que, en 2013 fue presentado en la Universidad

Nacional Autónoma de Nicaragua (UNAN-LEON), León, “Sistema de
automatización de ventas, compras y registros del salón de belleza (Conceptos
Hair Designers Barber shop And Spa)” Por Br: Mario Baltodano, Aldo Berrios,
Alicia Bustamante, como requisito para optar al título de ingeniero en sistemas
información.
En este trabajo se describe un estudio sobre experiencias llevadas a cabo en el
salón de belleza “conceptos Hair Designers Barber shop and spa”, y de cómo
su inventario funciona de forma manual y todos los registros y controles se
realizaban manualmente en papel y en hojas de Excel por lo que se crea un
sistema que automatice todos los movimientos del negocio.
El éxito de estos sistemas se deberá al apoyo y seguimiento continuo que le dé
una entidad determinada al proyecto, de este modo se logrará una mejora en la
calidad de la atención al cliente y la ampliación en la cobertura a las actividades
comerciales de la tienda.
A continuación, se plantea otro de los antecedentes que ha servido como
referencia para la elaboración del proyecto haciéndose una revisión del trabajo
elaborado por: Iris Carranza, Santos Huete, Marlong Valle, titulado “Propuesta
de un Sistema de Control de Inventario Manual para la empresa Taller Cristal
S.A ubicado en la ciudad de Chinandega, en el primer semestre del año 2019”
para optar al título de licenciado en Contaduría Pública y Finanzas. En la
Universidad Nacional Autónoma de Nicaragua (UNAN-LEON), León julio 2019,
el objetivo de este trabajo fue realizar una evaluación
10
VIII. JUSTIFICACION
En los últimos tiempos, muchos negocios de tiendas de computadoras y

accesorios han aceptado la importancia de administrar sus negocios con mayor
eficacia, tal como es la facturación, control de inventario y agilidad al atender al
cliente. Por lo cual la información ha pasado a ser valiosa y esencial en la
administración de los negocios.
Para facilitar la información de la empresa, un negocio se debe administrar de
manera rápida y ordenada. Cualquier administrador de negocios debe
comprender que, así como se vende un producto o se generan ganancias es
importante la información que se obtiene al hacer esas operaciones, para estar
al tanto de si el negocio está en buenas condiciones o está decayendo y así
desarrollar mejores estrategias para aumentar la competitividad.
La base de toda empresa comercial es el control de los productos que entran y
salen, de aquí la importancia del control de inventario, este manejo nos
permitirá mantener un control oportunamente, así como conocer un estado
confiable de la situación económico de la tienda.
El uso de un sistema de información puede generar ventajas competitivas,
porque hoy en día es necesario que los negocios se adapten al uso de las
nuevas tecnologías de información para estar a nivel competitivo en el
mercado. La implementación de un sistema de inventario y facturación puede
generar muchos beneficios como la automatización de cada proceso, rapidez
en las tareas de la gestión de la información, que conlleva a una mejor
administración.
Con la implementación del sistema web se podrá tener un control total del
inventario y la facturación. El sistema genera informes de las ventas y
productos existentes. Otro aspecto importante, es que dicho sistema permitirá
resguardar la información de forma exacta y confiable, la cual estará disponible
para su respectivo análisis y contribuir a la toma de decisiones del negocio.
11
IX. OBJETIVOS
IX.1. Objetivo General
 Desarrollar un sistema web que permita el control de inventario y ventas,

así como la generación de reportes de la tienda SYSTEMANAGER,
utilizando el lenguaje PHP, la plantilla AdminLTE y el gestor de bases de
datos relacional MySQL.
IX.2. Objetivos Específicos
 Crear una base de datos relacional para almacenar la información del

inventario y las ventas.
 Generar una bitácora para llevar el control de las operaciones realizadas

por los usuarios del sistema.
 Utilizar la plantilla AdminLTE para crear interfaces de usuario de calidad

visual y de fácil uso.
 Generar reportes que puedan ser exportados en los siguientes formatos:

PDF y Excel.
12
X. Marco Teórico
El marco teórico que fundamenta esta investigación nos permitirá conocer

sobre los principales conceptos asociados a los sistemas de información su
clasificación y características más generales, también se pretende dar a
conocer más a fondo acerca de los sistemas transaccionales en especial los
sistemas para control de inventario; así también las técnicas y procedimientos
para el desarrollo de un sistema de información.
X.1. Los sistemas de información:
James Senn (1992) declara que en el sentido más amplio un sistema “es un
conjunto de componentes que interactúan entre sí para lograr un objetivo
común”.
Alonzo Tamayo álzate (2005) propone que “Sistema es un conjunto ordenado
de componentes o partes que están estructurados, relacionados e
interrelacionados a través de distintos canales de comunicación y control, y
buscan el logro de objetivos y metas plenamente definidos”.
Andreu, Ricart y Valor (1991), un sistema de información queda definido como:
“conjunto formal de procesos que, operando sobre una colección de datos
estructurada de acuerdo a las necesidades de la empresa, recopila, elabora y
distribuyen selectivamente la información necesaria para la operación de dicha
empresa y para las actividades de dirección y control correspondientes,
apoyando, al menos en parte, los procesos de toma de decisiones necesarios
para desempeñar funciones de negocio de la empresa de acuerdo con su
estrategia”.
X.2. PHP:
PHP (acrónimo recursivo de PHP: Hypertext Preprocessor) es un lenguaje de

código abierto muy popular especialmente adecuado para el desarrollo web y
que puede ser incrustado en HTML
PHP está enfocado principalmente a la programación de scripts del lado del
servidor, por lo que se puede hacer cualquier cosa que pueda hacer otro
programa CGI, como recopilar datos de formularios, generar páginas con
contenidos dinámicos, o enviar y recibir cookies. Aunque PHP puede hacer
mucho más.
13
Existen principalmente tres campos principales donde se usan scripts de PHP.
 Scripts del lado del servidor: Este es el campo más tradicional y el
foco principal. Son necesarias tres cosas para que esto funcione: el
analizador de PHP (módulo CGI o servidor), un servidor web y un
navegador web. Es necesario ejecutar el servidor con una instalación de
PHP conectada. Se puede acceder al resultado del programa de PHP
con un navegador, viendo la página de PHP a través del servidor. Todo
esto se puede ejecutar en su máquina si está experimentado con la
programación de PHP
 Scripts desde la línea de comandos: Se puede crear un script de PHP

y ejecutarlo sin necesidad de un servidor o navegador. Solamente es
necesario el analizador de PHP para utilizarlo de esta manera. Este tipo
de uso es ideal para scripts que se ejecuten con regularidad empleando
cron (en *nix o Linux) o el Planificador de tareas (en Windows). Estos
scripts también pueden usarse para tareas simples de procesamiento de
texto.
 Escribir aplicaciones de escritorio: Probablemente PHP no sea el

lenguaje más apropiado para crear aplicaciones de escritorio con una
interfaz gráfica de usuario, pero si se conoce bien PHP, y se quisiera
utilizar algunas características avanzadas de PHP en aplicaciones del
lado del cliente, se puede utilizar PHP-GTK para escribir dichos
programas. También es posible de esta manera escribir aplicaciones
independientes de una plataforma.
PHP puede emplearse en todos los sistemas operativos principales, incluyendo
Linux, muchas variantes de Unix (incluyendo HP-UX, Solaris y OpenBSD),
Microsoft Windows, macOS, RISC OS y probablemente otros más. PHP admite
la mayoría de servidores web de hoy en día, incluyendo Apache, IIS, y muchos
otros. Esto incluye cualquier servidor web que pueda utilizar el binario de PHP
FastCGI, como lighttpd y nginx. PHP funciona tanto como módulo como
procesador de CGI.
Una de las características más potentes y destacables de PHP es su soporte
para un amplio abanico de bases de datos. Escribir una página web con acceso
a una base de datos es increíblemente simple utilizando una de las extensiones
específicas de bases de datos (p.ej., para mysql), o utilizar una capa de
abstracción como PDO, o conectarse a cualquier base de datos que admita el
estándar de Conexión Abierta a Bases de Datos por medio de la extensión
ODBC.
X.3. AdminLTE:
14
AdminLTE es una popular plantilla de aplicación web de código abierto para
paneles de control y paneles de administración para Bootstrap creado por el
estudio Almsaeed. Es una solución de código abierto que permite una
construcción y personalización sencillas. AdminLTE es una plantilla HTML
receptiva que se basa en el marco CSS Bootstrap 3. Utiliza todos los
componentes de Bootstrap en su diseño y cambia el estilo de muchos
complementos de uso común para crear un diseño coherente.
AdminLTE se basa también en un diseño modular, que permite personalizarlo y
construirlo fácilmente. La idea es que cada uno de estos elementos sea un
plugin o un widget a través del cual uno va creando la interfaz de usuario tanto
por la parte de front-end como de back-end, trabaja mayormente con el
framework Bootstrap, facilitándote muchas herramientas y opciones para
realizar los proyectos que desees, con esta plantilla se puede administrar
sistemas, y crear CRUDs de forma rápida y elegante. Al instalarlo contamos
con vistas reusables y responsive que se adaptan de manera íntegra, desde
computadoras a dispositivos móviles.
Algunas características importantes de esta plantilla de administración:
 AdminLTE está basado en Bootstrap 3.
 El estudio Almsaeed proporciona documentación de soporte.
 Usa LESS CSS, más fácil que aprender que CSS o SASS.
 Es una solución que está alojada en GitHub. Por tanto, se pueden hacer
al estudio peticiones o mejorar el producto.
 Funcionalidad de la plantilla AdminLTE

Adaptamos la plantilla AdminLTE al (MVC)
Vamos adaptar la plantilla AdminLTE al patrón modelo vista controlador (MVC)
pero antes necesitamos saber que es el patrón vista controlador.
El patrón (MVC) (Model, View, Controller) o Modelo, Vista, Controlador, es un
tipo de diseño que separa en capas bien definidas el desarrollo de una
aplicación.
Cuenta con 3 partes que son las siguientes:
 El Modelo encargado de la lógica de la aplicación y la conexión con la
base datos.
 El controlador es el encargado de gestionar las peticiones del usuario,

procesarlas invocando al modelo y mostrarlas al usuario a través de las
vistas.
 Las vistas son las responsables de mostrar al usuario el resultado que

obtienen del modelo a través del controlador.
15
El usuario con lo que siempre
se va a encontrar es con las
Este sería el usuario final el vistas y cuando el usuario
que está frente a la pantalla hace una solicitud al sistema
de computador. USUARIO
ya sea a través de un
formulario o a través de un
botón que necesite traer
El controlador la VISTA información de la base datos
recibe y se la retorna entonces esa solicitud pasa al
a la vista para que la controlador.
vista la pueda
imprimir. El controlador es el
que controla valga la
redundancia esa
Esta sería la pantalla y CONTROLADOR información la depura
aquí estaría el proyecto.
y se la manda al
modelo.
Traer esa
información que está Modelo que está
solicitando el usuario oculto en un búnker
y luego esa MODELO como si estuviera
información se la va protegido por toda
a devolver al una fortaleza encima.
controlador.
Ya libremente podrá
ir a conectarse a la
base datos.
Es un proceso donde se trabaja como una especie tripartita para que cada
escenario vaya haciendo más y más oculto o más y más protegido de tal forma
que el usuario final tenga mucha dificultad poder acceder a lo que es la
información delicada del proyecto que es la base datos.
De esta forma evitamos ataques, agregamos seguridad informática a nuestro
proyecto obviamente tendremos que también validar información a través de
los formularios:
 El cruce de Hory.
 El cruce de origen.
16
 El cruce de keigo.
Los ataques se Injection todo es tipo de cosas los tenemos que prevenir.
Pero gracias a este patrón modelo vista controlador podemos ser más
organizados en la construcción del proyecto.
Se puede modular izar y lo podemos hacer por módulos lamía y si necesitamos
agregar más módulos fácilmente lo podemos hacer gracias a este patrón
modelo vista controlador y finalmente nuestro proyecto queda muy protegido.
Conceptos para adaptar el sistema ya sea un teléfono, Tablet y

PC
Veremos 4 tipos de tamaños para visualizar el diseño en las 4 pantallas más
importantes:
1. Móvil Responsive 320 pixeles.
Nos aparece la opción de poder personalizar el tamaño responsivo.

El tamaño que se recomienda para visualizar las pantallas de los
dispositivos es de menor a mayor.
320x320 que es la pantalla para dispositivo móvil en posición vertical.
Como podemos observar esta es la estructura de la plantilla tanto para los
botones como para los bloques.
2. Tablet portrais que viene a ser como portarretrato posición vertical
768 pixeles.
El tamaño 768 pixeles es como si tuvieras una Tablet en posición vertical.

Como podemos observar nos habilita la botonera en el lado izquierdo.
Igual podemos volver a ocultar y nos amplia un poco más la estructura de la
plantilla.
3. Tablet Landscape que es la posición horizontal o un paisaje 1024 o
1366 pixeles.
El tamaño 1024 pixeles que es la Tablet, pero ya en posición horizontal.

El tamaño 1366 pixeles viene siendo la pantalla de portátil en adelante.
4. PC o Escritorio vamos a mirar a partir de 1366 pixeles en adelante.
17
Estructura del sistema
Nuestro proyecto es un sistema de inventario y facturación de ventas el cual
tendrá muchas funcionalidades a la hora de facilitar la administración de una
empresa o negocio.
Esta estructurado de la siguiente manera:
Inicio de sesión
 Login:
 Usuario
 Administrador
 Especial
 Vendedor
 Contraseña
 Una contraseña única que se le dará cada usuario.
Barra de Navegación:
 Logotipo:
 Icono del logotipo.
 Logotipo.
Vamos a tener dos tipos de logotipos:

 El logotipo en mini cuando el logotipo este oculto en la barra de
navegación (Sidebar).
 El logotipo normal cuando el logotipo este visible en la barra de

navegación (Sidebar).
 Sidebar:
Que nos servirá para desplegar los dos tipos de logotipo:
 El logotipo en mini.
 El logotipo normal.
 Apariencia del perfil:

 Imagen del usuario.
 Perfil de usuario.
18
 Y un cierre de sesión del sistema.
Menú lateral
 Menú del perfil del usuario:
 Imagen del perfil del usuario
 Nombre del perfil del usuario que está conectado al sistema.
 Y la opción que está en línea el usuario en el sistema.
 Menú de búsqueda:
 Buscador para el menú de navegación del sistema.
 Menú de navegación:
El menú de navegación va a tener:
 Vistas
 Controladores
 Modelos
Cada uno de los módulos y modelos tendrá un icono que lo representara y

cada módulo va a tener una vista.
Cada módulo va tener su controlador y su modelo.
Para los siguientes módulos de:
 Administración_Sistema
 Administración_Inventario
 Gestión_Ventas
 Reportes_empresa
Cada uno de estos módulos va a necesitar su controlador y su modelo para

que controle todo el CRUD.
Cuando hablamos de CRUD estamos hablando de un acrónimo que significa
ampliar un poquito este tamaño de texto.
C reate (Crear)
R ead (Leer)
U pdate (Actualizar)
19
D elete (Borrar)
Esta es la interacción que realizamos en las bases de datos Crear, Leer,
Actualizar y Borrar.
Entonces cuando hacemos un CRUD estamos haciendo un gestor y
necesitamos un gestor para cada uno de los módulos.
Porque vamos a tener que:
 Crear cada uno de los módulos.
 Hacer lectura para cada uno de los módulos para ver lo que está en la
base de datos.
 Actualizar cada uno de los módulos.
 Borrar cada uno de los módulos.
Entonces hay que hacer un gestor para cada uno de estos módulos:
 Gestor de Datos de la empresa
 Gestor de Usuarios.
 Gestor de Roles
 Gestor de Configuración del correo.
 Gestor de Categoría.
 Gestor de Productos.
 Gestor de Ventas
 Gestor de Clientes
 Gestor de Cotización
Cada uno de esos módulos les debemos realizar un CRUD.

El CRUD lo realizamos de manera mucho más amigable y mucho más fácil a
través del controlador y del modelo.
Vista – Controlador – Modelo

Entonces aquí volvemos otra vez a la figura del patrón modelo vista controlador
porque:
La vista le manda toda la información al controlador.
El controlador al modelo.
Y luego se regresa otra vez para vista.
 Menú de Administración_Sistema
 Datos de la Empresa.
20
 Usuarios.
 Roles
 Estado de la Bitácora
 Menú de Administración_Inventario
 Categoría.
 Producto.
 Menú de Gestión_Ventas
 Ventas.
 Clientes.
 Cotizaciones
 Menú de Reportes_Empresa
 Ganancias_Ventas.
 Productos_Vendidos.
 Vendedores.
 Compradores.
Página de Inicio
 Panel de control
 Nombre de la empresa.
 Información de la empresa.
 Bienvenido al sistema
 Dara la bienvenida.
 Nombre del perfil y rol del usuario en sesión.
 Cuerpo del documento

Constará con 4 caja superiores que son las siguientes:
 Clientes
 Icono de clientes.
 Cantidad total de los clientes.
 Categorías
 Icono de categorías.
21
 Cantidad total de categorías de los productos.
 Productos
 Icono de Productos.
 Cantidad total de los productos.
 Ventas
 Icono de venta.
 Cantidad total de las ganancias de ventas.
Además, constara con la siguiente información de la tienda.

 Gráfico de ganancias
 Mostrar un gráfico de ganancias de ventas de mayor a
menor con año-mes-día.
 Productos más vendidos

 Mostrar un gráfico de los productos más vendidos.
 Mostrar la imagen del producto.
 Nombre del producto.
 Porcentaje del producto.
 Productos agregados recientemente

 Mostrar la imagen del producto.
 Nombre del producto.
 Precio del producto.
Pie de página (Footer)

 Desarrolladores
 Nombre de los desarrolladores del sistema.
 Sitio de los desarrolladores

 Página web de los desarrolladores.
 Derechos reservados
 Todos los derechos reservados.
22
X.4. XAMPP:
XAMPP es una distribución de Apache que incluye varios softwares libres. El

nombre es un acrónimo compuesto por las iniciales de los programas que lo
constituyen: el servidor web Apache, los sistemas relacionales de
administración de bases de datos MySQL y MariaDB, así como los lenguajes
de programación Perl y PHP. La inicial X se usa para representar a los
sistemas operativos Linux, Windows y Mac OS X.
 Apache: el servidor web de código abierto es la aplicación más usada
globalmente para la entrega de contenidos web. Las aplicaciones del
servidor son ofrecidas como software libre por la Apache Software
Foundation.
 MySQL/MariaDB: XAMPP cuenta con uno de los sistemas relacionales

de gestión de bases de datos más populares del mundo. En
combinación con el servidor web Apache y el lenguaje PHP, MySQL
sirve para el almacenamiento de datos para servicios web. En las
versiones actuales de XAMPP esta base de datos se ha sustituido por
MariaDB.
 PHP: es un lenguaje de programación de código de lado del servidor

que permite crear páginas web o aplicaciones dinámicas. Es
independiente de plataforma y soporta varios sistemas de bases de
datos.
 Perl: este lenguaje de programación se usa en la administración del

sistema, en el desarrollo web y en la programación de red. También
permite programar aplicaciones web dinámicas.
Además de estos componentes principales, esta distribución gratuita también
incluye, según el sistema operativo, otras herramientas como el servidor de
23
correo Mercury, el programa de administración de bases de datos
phpMyAdmin, el software de analítica web Webalizer, OpenSSL, Apache
Tomcat y los servidores FTP FileZilla o ProFTPd
Un servidor XAMPP se puede instalar rápido y fácilmente como sistema de test
local bajo Linux, Windows con un único archivo ejecutable. El paquete del
software contiene los mismos componentes que se utilizan en cualquier
servidor web, de forma que permite a los desarrolladores testar proyectos
localmente y transferirlos cómodamente a sistemas reales
X.5. SQL:
SQL (Structured Query Language) es un lenguaje estándar e interactivo de

acceso a bases de datos relacionales que permite especificar diversos tipos de
operaciones en ellas, gracias a la utilización del álgebra y de cálculos
relacionales, el SQL brinda la posibilidad de realizar consultas con el objetivo
de recuperar información de las bases de datos de manera sencilla. Las
consultas toman la forma de un lenguaje de comandos que permite
seleccionar, insertar, actualizar, averiguar la ubicación de los datos, y más.
X.6. MySQL:
MySQL, es un sistema de gestión de base de datos relacional o SGBD que

permiten el almacenamiento, modificación y extracción de la información en
una base de datos, además de proporcionar herramientas para añadir, borrar,
modificar y analizar los datos. Este gestor de base de datos en multihilo y
multiusuario, lo que le permite ser utilizado por varias personas al mismo
tiempo, e incluso, realizar varias consultas a la vez, lo que lo hace sumamente
versátil.
Este gestor de base de datos es muy utilizado en desarrollo web, ya que
permite a los desarrolladores y diseñadores, realizar cambios en sus sitios de
manera simple, con tan sólo cambiar un archivo, evitando tener que modificar
todo el código web. Esto se debe a que MySQL, trabaja con un sistema
24
centralizado de gestión de datos, que permite realizar cambios en un solo
archivo y que se ejecuta en toda la estructura de datos que se comparte en la
red.
X.7. HOST:
El alojamiento web (en inglés web hosting) es el servicio que provee a

los usuarios de Internet un sistema para poder almacenar información,
imágenes, vídeo, o cualquier contenido accesible vía web. Es una analogía de
“hospedaje o alojamiento en hoteles o habitaciones” donde uno ocupa un lugar
específico, en este caso la analogía alojamiento web o alojamiento de páginas
web, se refiere al lugar que ocupa una página web, sitio web, sistema, correo
electrónico, archivos etc. en internet o más específicamente en un servidor que
por lo general hospeda varias aplicaciones o páginas web.
X.8. SMTP:
El SMTP es un protocolo de red que se emplea para enviar y recibir correos

electrónicos (emails). Cabe destacar que un protocolo de red es un conjunto de
normativas y reglas que posibilitan la circulación de información en una red
informática. En este caso, el SMTP forma parte de los llamados protocolos de
Internet.
25
Cuando una persona envía un correo electrónico a través de este protocolo, lo
que ocurre es que el cliente de correo (como Outlook Express o Mozilla
Thunderbird) presenta el mensaje en cuestión a un servidor de correo a través
del SMTP. El servidor envía el mensaje al Mail Transfer Agent (MTA), que
apela al Domain Name System (DNS) para buscar el registro MX. Cuando éste
acepta el correo, lo deriva a su vez a un Mail Delivery Agent (MDA), que puede
volver a recurrir al SMTP para entregarlo al servidor de correo. Mediante
el IMAP, finalmente, el usuario receptor puede recuperar el mensaje en su
cliente de correo electrónico.
X.9. PROTOCOLO SSL:
Es el acrónimo de Secure Sockets Layer (capa de sockets seguros), es un

protocolo de seguridad desarrollado por la empresa Netscape Communications
para lograr que la transmisión de datos entre un servidor y un usuario, o
viceversa, a través de Internet, sea completamente segura. El SSL es un
protocolo abierto, por lo que puede ser empleado por cualquier fabricante de
aplicaciones para Internet, siendo una de sus grandes ventajas el hecho de
que se pueda utilizar con cualquiera de los protocolos de servicios más
comunes del Internet (HTTP, FTP, SMTP, etc.), aunque lo más normal es que
se utilice para el tráfico de la web vía el protocolo HTTP.
26
X.10. PROTOCOLO TLS:
Transport Layer Security o capa de seguridad de transporte (TLS) es una

versión actualizada y más segura del protocolo SSL que proporciona cifrado de
datos y autenticación de aplicaciones entre cliente/servidor, siendo muy útil y
necesario sobre todo cuando se envían mensajes a través de redes inseguras,
como por ejemplo, el envío de correo electrónico.
El protocolo TLS establece una conexión segura por medio de un canal cifrado
entre un cliente y un servidor. De esta manera, logra que el intercambio de
información o datos se establezca en un ambiente seguro y libre de ataques,
protegiendo la privacidad del usuario y evitando en gran medida delitos
informáticos.
X.11. AUTENTICACION DE MENSAJE:
Un código de autenticación (Message authentication code o MAC) es un

pequeño bloque de datos adjunto a un mensaje que el destinatario usa para
verificar la integridad del mensaje. Dichos códigos se usan cuando se envían
ciertos tipos de datos cifrados o seguros para que el remitente pueda verificar y
confirmar que el mensaje no ha sido comprometido. Los códigos de
autenticación de mensajes pueden aparecer en mensajes como transferencias
electrónicas de fondos y correos electrónicos.
Cuando se genera un mensaje, el código de autenticación del mensaje se crea
al mismo tiempo. El mensaje se envía al destinatario, y cuando el destinatario
lo abre, el contenido del mensaje se ejecuta a través de un algoritmo para crear
un nuevo código de autenticación de mensaje. Este nuevo código se compara
con el código enviado junto con el mensaje original. Si los códigos son iguales,
27
el mensaje se autentica. Si hay una diferencia, indica que algo sobre el
mensaje cambió entre el remitente y el destinatario
X.12. REPORTES:
En el ámbito de la informática, los reportes son informes que organizan y

exhiben la información contenida en una base de datos. Su función es aplicar
un formato determinado a los datos para mostrarlos por medio de un diseño
atractivo y que sea fácil de interpretar por los usuarios.
Este tipo de documento (que puede ser impreso, digital, audiovisual, etc.)
pretende transmitir una información, aunque puede tener diversos objetivos. El
reporte puede ser la conclusión de una investigación previa o adoptar una
estructura de problema-solución en base a una serie de preguntas. En el caso
de los informes impresos, el texto suele ir acompañado por gráficos,
diagramas, tablas de contenido y notas al pie de página.
X.13. LIBRERÍA:
Se emplea el término librería para referirse a una biblioteca, por la similitud con
el original inglés library. Ambos términos, biblioteca y librería, son correctos
según las definiciones de la RAE. Una biblioteca o librería es un Kit de
herramientas software pequeño y autónomo que ofrece una serie de
funcionalidades compiladas y codificadas en un lenguaje de programación las
cuales sirven de unos métodos o interfaces para realizar la funcionalidad que
se requiere. Normalmente se usa junto con otras librerías y herramientas para
28
hacer una aplicación completa, ya que por lo general las bibliotecas no son
ejecutables, pero sí pueden ser usadas por ejecutables que las necesiten para
poder funcionar.
X.14. LIBRERÍA TCPDF:

TCPDF es una clase de software libre PHP para generar documentos PDF. Es
uno de los proyectos Open Source más activos del mundo, que se utiliza a
diario por millones de usuarios y se incluyen en miles de CMS y aplicaciones
Web, como por ejemplo Prestashop que genera las facturas utilizando esta
potente librería.
X.15. Plug-in:
En informática, un complemento o plug-in es una aplicación (o programa
informático) que se relaciona con otra para agregarle una función nueva y
generalmente muy específica. Esta aplicación adicional es ejecutada por la
aplicación principal e interactúan por medio de la interfaz de programación de
aplicaciones.
Un Plug-in sirve para que una herramienta adquiera muchas más posibilidades
a base de incorporar más funciones. Cuantos más se instalen en una
plataforma, más facilidades ofrecerá esta para que el usuario que la emplea no
tenga que contar con otros programas para llevar a cabo otras tareas. Otro
objetivo del plugin es hacer más fácil la labor de quien recurre a él. Agiliza el
trabajo y a la vez, puede ofrecer unas cotas de calidad bastante elevadas.
29
X.16. JQuery DataTable:
DataTable es un plugin para JQuery que permite agregar en las tablas de tu

página Web un aspecto liviano y las funciones para buscar, ordenar y paginar
los resultados de forma rápida. Es una herramienta altamente flexible,
construida sobre los fundamentos de la mejora progresiva, que permite agregar
fácilmente todas estas funciones avanzadas a cualquier tabla HTML.
X.17. MorrisJS:
Morris.js es una biblioteca de gráficos JavaScript basada en el muy competente
raphael.js, Se ha llegado a incluir en muchos proyectos últimamente porque
son realmente simples de implementar y ahora, en la rama maestra, admiten la
capacidad de cambiar el tamaño de la página. Con Morris.js se pueden
implementar dibujos de gráficos de barras, líneas, áreas y también diagramas
circulares. Posee un estilo bastante simple, que podría ir a la perfección con
sitios de estilo minimalista y diseño plano.
X.18. ChartJS:
30
Chart JS es un plugin JavaScript simple, flexible y muy completo para los
diseñadores gráficos y desarrolladores que desean incrustar gráficas en las
páginas Web. Esta es una de las formas más elegantes de incorporar este tipo
de elementos gráficos ya que no requiere JQuery. Para instalar en tu página
Web tan solo es necesario incluir el plugin en la cabecera de tu página.
X.19. Date Range Picker:

Date Range Picker, un componente JavaScript para ofrecer la posibilidad de
elegir un intervalo de fechas. Diseñado para trabajar bajo el framework
Bootstrap. Este componente fue construido para la presentación de informes en
un intervalo de fechas. Este selector se puede conectar a cualquier elemento
de una página Web apareciendo 2 calendarios para la selección de fechas,
horas o rangos definidos como por ejemplo los últimos 30 días.
31
X.20. Input Mask:
En la programación de computadoras, jQuery Input Mask es un complemento
de JavaScript, es un jQuery ligero y fácil de usar que facilita la creación de una
máscara de entrada. Una máscara de entrada ayuda al usuario con la entrada
garantizando un formato predefinido. Esto puede resultar útil para fechas,
números, números de teléfono, etc. jQuery Input Mask también garantiza la
integridad de los datos al evitar errores de transcripción.
XI. METODOLOGIA
A continuación, se dará a conocer la metodología, procesos y herramientas que

son utilizados para el desarrollo de esta investigación. Se describirá los
procesos que intervienen en todo el desarrollo de SYSTEMANAGER.
XI.1. Tipo de estudio
Se considera una investigación aplicada tecnológica. Inicia de los

conocimientos teóricos para la construcción de un producto: un sistema para el
control de inventario y facturación de los negocios.
XI.2. Métodos
Utilizaremos el método de modelo en espiral porque iremos agregando y
mejorando la aplicación dependiendo de las necesidades y complicaciones que
nos encontremos algunas ventajas que este método nos presenta es que este
puede adaptarse y aplicarse a lo largo de la vida del software de
computadoras.
El modelo en espiral demanda una consideración directa de los riesgos
técnicos en todas las etapas del proyecto y si se aplica adecuadamente debe
reducir los riesgos antes de que se conviertan en problemas, también utiliza la
construcción de prototipos como mecanismo de reducción de riesgos, y por
32
último que este es un enfoque realista del desarrollo de sistemas y de software
a gran escala
En el caso del desarrollo del sistema se aplican los principios y métodos de la
ingeniería del software. Se utilizará el modelo de desarrollo en espiral.
XI.3. Unidad de análisis
La unidad de análisis de esta investigación es el Sistema de gestión del

inventario y facturación de una tienda comercial de computadoras y sus
respectivos accesorios.
XI.4. Técnica de Investigación
Para la realización de este proyecto se utilizarán las siguientes técnicas:

Entrevista a los propietarios de tiendas de computaras: Se realizarán
entrevistas informales a los dueños de la tienda. En cada entrevista las
preguntas serán abiertas con la intención de generar un ambiente de confianza
con los entrevistados, ya que estos son las primeras fuentes de información
para recopilar los requisitos del software.
Observación: En cada visita a tiendas con accesorios tecnológicos y
computadoras se observará de manera directa todos los procesos y
transacciones que se realizan en la tienda.
Test de pruebas al sistema de MÁSTER MANAGER: En cada iteración del
software se aplicarán diferentes tipos de pruebas al sistema. Una de la más
importantes son las pruebas de usabilidad con estas se podrá evaluar si hay
una buena interacción entre el usuario y el sistema.
También se aplicarán pruebas de Estrés, en estas pruebas el sistema será

sometido a condiciones extremas de trabajo para ver el comportamiento de
este y verificar la solidez del sistema en momento de carga extrema.
XI.5. Planificación de la iteración o ciclo.
XI.5.1. Determinar o fijar objetivos:

 Decidimos, qué proyecto íbamos a elegir.
 Para donde y para quien lo vamos a realizar.
33
Los objetivos se determinan conjuntamente con el cliente. Al mismo tiempo, se
discuten posibles alternativas y se especifican las condiciones marco (por
ejemplo, sistemas operativos, entornos y lenguajes de programación).
Después de la decisión del proyecto y de la aceptación que nos dio el cliente
para realizar ese proyecto, empezamos a fijar la Misión y visión del proyecto.
Después de tener concreto esos puntos, continuamos a realizar la entrevista al
cliente, esto para ver que requerimientos va tener el proyecto que nuestro
cliente necesita.
XI.5.2. Planificación:
 Revelación de requerimientos iniciales o luego de una iteración.
Revisamos todo lo hecho, evaluándolo, y con ello decidimos si continuamos
con las fases siguientes y planificamos la próxima actividad.
XI.5.3. Análisis y evaluación de riesgos:

Se identifican y evalúan los riesgos potenciales. También se evalúan las
alternativas existentes. Los riesgos son registrados, evaluados y luego
reducidos utilizando prototipos, simulaciones y softwares de análisis. En este
ciclo, existen varios prototipos como plantillas de diseño o componentes
funcionales
En esta etapa el cliente evalúa el prototipo, si da su conformidad, termina el
proyecto. En caso contrario, incluimos los nuevos requerimientos solicitados
por el cliente en la siguiente interacción
Revisamos todo lo hecho, evaluándolo, y con ello decidimos si continuamos
con las fases siguientes y planificamos la próxima actividad.
XI.5.4. Desarrollar y probar:

Los prototipos se amplían y se añaden funcionalidades. El código real es
escrito, probado y migrado a un entorno de prueba varias veces hasta que el
software pueda ser implementado en un entorno productivo.
XI.5.5. Planificación de la siguiente iteración:

El siguiente ciclo se planifica al final de cada etapa. Si se producen errores, se
buscan soluciones. y si una alternativa es una mejor solución, se prefiere en el
siguiente ciclo
34
 Decidimos usar el modelo en espiral, esto porque se sujeta a previos
cambios.
 Llevamos a cabo el desarrollo del análisis del proyecto
 Realizamos actividades de prueba para el proyectó
XII. RECURSOS HARDWARE Y SOFTWARE
a. Hardware:
35
Para la realización de este proyecto se hizo uso de las siguientes
herramientas:
 1 PC con las siguientes características:
 Memoria RAM 4GB
 500 GB en Disco Duro
 Procesador AMD E1-2100 APU
 Velocidad de procesamiento 1.7 GHz
 Sistema operativo de 64 bits
b. Software:
Las herramientas software que emplearemos son:
 XAMPP
 MySQL
 PHP 7
 Bootstrap 4
 Admin LTE
 JavaScript
 Windows 10 (Sistema Operativo)
 JQuery DataTable
 MorrisJS
 ChartJS
 Date Range Picker
 Input Mask
 Visual Studio Code
 SublimeText
XIII. ESPECIFICACION DE REQUISITOS DE SOFTWARE
36
Información del Proyecto
Empresa / Organización SYSTEMANAGER
Proyecto SYSTEMANAGER
Cliente DUEÑOS DE EMPRESA
Gerente / Líder de
Proyecto
Integrantes del Equipo 1.Carlos Manuel Martínez Chevez.
2.David Guillermo Martínez Solórzano
3.Yelzon Humberto Delgado Blanco
Propósito
SYSTEMANAGER
Definir las especificaciones funcionales, no funcionales y del sistema para la

implementación de una aplicación web.
Crear un sitio web que permita el control de inventario y gestiones de venta,
registrando cada una de las operaciones mediante una bitácora y asegurando
que la base de datos posea valores correctos.
Alcance del producto / Software

Diseño y desarrollo del sistema web SYSTEMANEGER.
Se creará un sistema web que comprenda todo lo que es inventario, reportes y
muchas actividades administrativas diarias.
Estará dirigido a cualquier tienda en general que desee solventar problemas de
registros y que además proporcionará información en tiempo real del estado
general de la tienda.
Referencias
Título del documento Referencia
WebSA (Web Software http://www.dlsi.ua.es/~santi/papers/websatr.pdf
Architecture)
Mantis Bug Tracker https://www.mantisbt.org/
Funcionalidades del producto

Este sistema tendrá funciones agrupadas en las siguientes categorías:
37
1. Administración del sistema.
2. Administración de inventario de productos.
3. Gestión de ventas.
4. Reportes.
Clases y características de usuarios

Los roles de usuarios son fundamentales para un sistema complejo ya que con
ello podemos filtrar el acceso de acuerdo con la responsabilidad que tiene la
persona dentro del negocio.
En este sistema aplicaremos tres tipos de usuarios y cada uno de ellos tendrá
un perfil específico para que su interacción con el sistema sea el correcto:
 El administrador: que tendrá acceso a toda la funcionalidad del sistema.
 El especial: que serán aquellas personas encargadas de gestionar el
inventario del negocio y a quien el administrador le podría otorgar otras
funciones.
 El vendedor: que son aquellas personas que podrán generar las ventas
y alimentar la base datos de los clientes, además podrá crear
cotizaciones requeridas.
Entorno operativo
Este sitio web podrá ser accedido desde cualquier navegador instalado en una
máquina que tenga cualquier sistema operativo (Windows, Linux, Mac, Android,
etc.).
Requerimientos funcionales
1. Administración del sistema
Ref. Funcionalidad Descripción Actor

1.1 Iniciar sesión Los usuarios deben Todos los
ingresar al sistema con usuarios
un nombre de usuario y
contraseña.
1.2 Registrar datos de Insertar datos Administrador
empresa. descriptivos de la
empresa.
1.3 Establecer Poner un porcentaje de Administrador
porcentaje de ganancia a todos los
ganancias productos.
1.4 Crear usuario Se agrega un nuevo Administrador
usuario al sistema.
38
1.5 Editar usuario Cambiar información de Administrador
un determinado usuario.
1.6 Eliminar usuario Eliminar un determinado Administrador
usuario.
1.7 Crear roles de Se crearán roles para Administrador
usuario brindar permisos a cada
usuario del sistema.
1.8 Modificar permisos Se agregarán o quitarán Administrador
del usuario especial permisos otorgados al
usuario especial
1.9 Actualizar estado de Guardar cada Sistema
bitácora movimiento o actividad
del negocio en el
sistema, eliminando
primero la primera
entrada si se ha
alcanzado el límite.
1.1 Visualizar el estado Muestra en una vista Administrador
0 de la bitácora todas las entradas de la
bitácora dando la opción
de filtrar las entradas de
un determinado usuario.
2. Administración de inventario de producto.

2.1 Listar y Agregar Listar todas las categorías Administrador,
categoría existentes y agregar con un Especial
nombre que diferencie a
cada cierto grupo de
productos semejantes.
2.2 Editar categoría Listar todas las categorías Administrador,
existentes y elegir una para Especial
cambiar de información.
2.3 Eliminar categoría Listar todas las categorías Administrador,
existentes y elegir la Especial
categoría a eliminar.
2.4 Listar y Agregar Se pondrá información Administrador,
producto necesaria para identificar un Especial
nuevo producto.
2.5 Editar producto Listar todos los productos y Administrador,
elegir el producto al que se le Especial
cambiara la información.
2.6 Eliminar producto Listar todos los productos y Administrador,
elegir el producto al que Especial
eliminaremos.
2.7 Buscar producto Se introducirá un nombre o Administrador,
39
código del producto para su vendedor
visualización.
3. Gestión de ventas.

3.1 Listar y Crear ventas Se elegirá el o los productos Administrador,
a vender a un cliente que se Vendedor
ingresará al sistema.
3.2 Editar venta Se listarán todas las ventas y Administrador,
se elegirá a la que se le Vendedor
cambiará la información.
3.3 Eliminar venta Se listarán todas las ventas y Administrador,
se elegirá a la que se Vendedor
eliminará.
3.4 Listar y Agregar Se pondrá información Administrador,
clientes necesaria para identificar al Vendedor
comprador.
3.5 Editar cliente Editar un determinado Administrador,
cliente. Vendedor
3.6 Eliminar cliente Eliminar un determinado Administrador,

cliente. Vendedor
3.7 Listar y Crear Verificar información de Administrador,

cotizaciones. productos para los clientes. vendedor
3.8 Editar cotización. Cambiar información de Administrador,

cotización determinada. vendedor
3.9 Eliminar cotización. Eliminar cotización Administrador,

determinada. vendedor
3.10 Código de Barra Detectar el producto Administrador,

mediante código de barras. vendedor
4. Reportes.

4.1 Generar reporte de Se mostrarán las ventas Administrador
venta por cliente. realizadas por un cliente
40
especifico.
ventas por producto. realizadas de un determinado
producto.
venta por vendedor. realizadas por un
determinado vendedor.
Reglas de negocio
El porcentaje de impuesto al valor agregado estarán siendo cambiadas

respecto el producto a vender, de igual forma se hará con los porcentajes de
descuento, el único que podrá modificar o agregar productos al inventario será
el usuario administrador de igual forma tendrá acceso a todo el sistema y sus
funciones. Solo el administrador podrá cambiar las contraseñas a los usuarios.
Requerimientos de interfaces externas
Interfaces de usuario
La interfaz con el usuario consistirá en un conjunto de ventanas con botones,
imágenes enlazadas a otras páginas, listas y campos de textos, campos
desplegables como el menú. Ésta deberá ser construida específicamente para
el sistema propuesto y, será visualizada desde un navegador de internet.
Interfaces de hardware
El cliente en este caso el dueño o encargado del negocio deberá contar con un
dispositivo de computo con al menos las siguientes características.
 Adaptadores de red.
 Procesador de 1.7GHz o superior.
 Memoria mínima de 1024 MB.
 Mouse.
 Teclado
 Impresora
 Conexión a internet.
Interfaces de software
 Sistema Operativo:
 Windows 7 o superior.
 Explorador: Mozilla o Chrome
 Servidor local XAMPP.
 Plantilla AdminLTE.
 Gestor de bases de datos MySQL
 Framework Bootstrap
41
Interfaces de comunicación
Los servidores, clientes y aplicaciones se comunicarán entre sí, mediante

protocolos estándares en internet, siempre que sea posible. Por ejemplo,
para transferir archivos o documentos deberán utilizarse protocolos
existentes (FTP u otros convenientes).
Requerimientos no funcionales
10.1 Requisitos de rendimiento
 Garantizar que el diseño de las consultas u otro proceso no afecte el

desempeño de la base de datos, ni considerablemente el tráfico de la
red.
10.2 Seguridad
 Garantizar la confiabilidad, la seguridad y el desempeño del sistema

informático a los diferentes usuarios. En este sentido la información
almacenada o registros realizados podrán ser consultados y
actualizados permanente y simultáneamente, sin que se afecte el tiempo
de respuesta.
 Garantizar la seguridad del sistema con respecto a la información y
datos que se manejan tales sean documentos, archivos y contraseñas.
 Facilidades y controles para permitir el acceso a la información al
personal autorizado a través de Internet, con la intención de consultar y
subir información pertinente para cada una de ellas.
10.3 Fiabilidad
 El sistema debe tener una interfaz de uso intuitiva y sencilla

 La interfaz de usuario debe ajustarse a las características de la web de
la empresa, dentro de la cual estará incorporado el sistema de gestión
de procesos.
10.4 Disponibilidad
 La disponibilidad del sistema debe ser continua con un nivel de servicio

de 7 días por 24 horas, garantizando un esquema adecuado que permita
la posible falla en cualquiera de sus componentes, contar con una
contingencia, generación de alarmas.
Otros requerimientos
11.1 Usabilidad
 El sistema deberá proveer una interfaz amigable al usuario, que sea fácil
de aprender y de usar. Se pretenda que la navegación entre las distintas
funcionalidades del sistema sea realizada en forma sencilla. Esta
42
interfaz ofrecerá funcionalidades para realizar tareas específicas en
forma automática.
XIV. DIAGRAMAS
XIV.1. Diagrama ER
Análisis y diseño del sistema.

Definiremos las entidades con las que trabajaremos en la base de datos de
nuestro sistema.
Productos: En esta entidad estableceremos toda la información y detalle de

los productos, así como podremos manejar las existencias y alteraciones que
estos tengan ya sea en costo o descripción, esto a tiempo real.
Usuarios: Aquí llevaremos control e información de todas las personas que
podrán hacer uso de esta plataforma. Además, esta entidad se enlazará con la
tabla rol para asignárseles permisos de las actividades que podrán realizar.
43
Datos de la empresa: Esta entidad contendrá toda la información necesaria
que define a la empresa ante sus clientes como nombre, RUC y otros. Datos
que serán de ayuda en la facturación y cotización.
Ventas: Guardaremos toda información: datos del cliente, información del
producto y el usuario que ha efectuado la venta. Todo esto por medio de las
relaciones entre las diferentes entidades correspondientes con la información:
(usuario, cliente, producto).
Roles: A través de esta entidad delegaremos permisos a los distintos usuarios
que tendrán uso del sistema, teniendo a si mejor control y seguridad en las
actividades de la empresa. Los atributos de esta entidad están dados en base a
todas las actividades del negocio o empresa que se podrán delegar a los
usuarios.
Categorías: Cada producto pertenecerá a una categoría, lo cual hará más fácil
su búsqueda y se llevará mejor control por medio de esta entidad. Y estará
relacionada con la entidad producto.
Correo: Esta entidad es de suma importancia ya que juega un rol muy
importante para lo que es las cotizaciones y facturas.
Clientes: Por medio de esta entidad guardaremos información primordial de los
clientes. Los atributos de esta entidad serán referidos a información de
identificación del usuario, detalle y frecuencia de sus compras.
Diagrama relacional
Del diagrama entidad relación se realizó el modelo relacional de la base de
datos (Ver Figura No 6), en el que se puede apreciar todas las tablas de la
base de datos catagorias, ventas, productos, usuarios, clientes, perfiles,
configuracioncorreo, datosempresa. Este modelo se diseñó con Mysql
Workbench. El diagrama relacional se exporto al Gestor de Base de datos que
usa el sistema actualmente, Mysql 5.1, con este último paso se terminó el
desarrollo de la base de datos del sistema.
44
Diagrama de casos de usos
45
Con este diagrama se especifica la secuencia de cada actividad del sistema
web de igual forma se identifican las actividades más principales y esenciales
para el correcto funcionamiento de SYSTEMANAGER.
En el diagrama anterior se pueden contemplar los actores principales que
interactuaran con el sistema, cabe mencionar que el más importante es el
administrador, este tiene control y acceso de todo el sistema, así como de
todos los procesos. Se determinó que las actividades principales del sistema
son:
 Realizar venta
 Control de productos
 Gestión de usuarios
 Generar reportes
 Actualización de bitácora
A continuación, se pude apreciar las actividades básicas de iteración de los

procesos más comunes de la tienda, como lo es la venta de un producto.
Diagrama de venta
46
Este diagrama muestra de forma general la comunicación entre los usuarios y
objetos más generales del sistema, y las reacciones del sistema cuando el
usuario ejerza alguna acción. Se observa que los objetos más esenciales para
el sistema son: el inventario, las ventas, datos de cliente y factura. Los usuarios
más importantes son el cliente y el vendedor. En la misma Figura, se refleja el
proceso que ocurre cuando un el cliente pide un producto, el vendedor deberá
verificar si es un cliente nuevo o existente, el sistema deberá proporcionar esta
información, luego el vendedor al verificar la existencia del producto solicitado
procederá a realizar la venta y el sistema generará la factura con los datos
correspondientes.
En el siguiente diagrama se observa la dinámica con el proceso de más

frecuencia como lo es el de agregar productos al inventario del sistema.
Diagrama de inventario.
47
El administrador será el único que podrá llevar a cabo este proceso y para eso
tendrá que verificarse como tal en el sistema por seguridad.
Una ves que el administrador se ha verificado podrá buscar en el menú gestión
de inventario y posterior agregar el producto llenando todos los campos
solicitados por el sistema para detalles del producto.
Desarrollo y documentación del sistema.

SYSTEMANAGER cuenta con un sistema de Log-in, a continuación, se
describe: Iniciar sesión: Los usuarios deben ingresar al sistema con un
nombre de usuario y contraseña. Si el usuario ha olvidado su contraseña solo
tendrá 5 oportunidades para acceder al sistema de lo contrario se bloqueará su
cuenta y solo podrá ser resuelto por el administrador. Cabe destacar que habrá
3 tipos de usuario los cuales después de su inicio de sesión tendrán vistas y
permisos que difieren en relación a su rol como trabajador.
48
Administrador:
Página principal
Esta es la vista principal y en este caso el usuario en sesión es el administrador
el cual tiene accesos y permisos de todo el sistema por ende se mostrarán
todos los reportes de la tienda.
Elementos que serán comunes en la mayoría de las vistas es el menú situado a
la izquierda de la pantalla que solo difiere en los permisos y vistas del usuario
en sesión. En este caso el menú que visualizará el administrador tendrá todos
los módulos del sistema: administración del sistema, administración de
inventario, gestión de venta y reportes de la empresa también hay una barra de
búsqueda que permitirá a todos los usuarios buscar de forma detallada sus
permisos o asignaciones, tanto en el menú como en la barra de navegación se
muestra el usuario en sesión. Hay una barra de navegación principal donde
podemos ver el logotipo de la empresa, así como los catálogos, las ventas e
información del usuario en sesión y permitirá un cierre de sesión del sistema al
usuario.
49
Administración del Sistema:
Dentro del menú del administrador podremos encontrar el primer módulo del
sistema al cual tiene acceso el administrador: Administración del sistema.
Dentro de este módulo podremos encontrar a la vez 5 funcionalidades a las
cual el administrador tiene permisos.
La primera funcionalidad es:
Datos de la empresa:
Esta funcionalidad tiene como objetivo visualizar la información acerca de la
tienda que en ese momento este administrando el sistema SYSTEMANAGER,
50
Dentro de esta vista podremos observar en la parte derecha de la pantalla un
botón DataTable que tiene la función de editar datos de la empresa:
Editar datos de la empresa
Se podrá modificar la información de la tienda cuando sea requerido y una
barra de búsqueda el cual facilitará y agilizará la búsqueda de cualquier
negocio o tienda.
51
Usuarios:
Esta funcionalidad permite al administrador del sistema tener una ágil y fácil
administración de los usuarios en el sistema.
El administrador también puede visualizar y posee el permiso de dar de baja a
un usuario y cambiar de estado es decir si el usuario estará “activo” o “inactivo”
en el sistema, nos presentara también cuando fue la última vez que un usuario
estuvo activo en el sistema.
También cuenta con una barra de búsqueda que facilitara y agilizara la
búsqueda de los usuarios.
52
Dentro de esta misma vista podremos encontrar 2 botones con funcionalidades
importantes:
Arriba a la derecha podremos encontrar el botón de agregar usuarios que
tendrá las siguientes funcionalidades:
Agregar usuario:
Con esta función el administrador tiene el permiso de agregar nuevos usuarios
y recopilar información acerca de los usuarios.
53
Y con el botón de editar que se encuentra a la derecha de la pantalla
tendremos la opción de editar la información del usuario si es requerido.
Editar usuario:
Roles:
Con esta funcionalidad el administrador tiene permisos para administrar todo el
sistema de roles y poder otorgar tareas específicas o prioridades a los roles
que luego los usuarios en el sistema podrán cumplir de acuerdo a su rol
establecido.
también podrá editar permisos relacionados a cierto rol y tendrá la posibilidad
de eliminar el rol que desee.
También cuenta con una barra de búsqueda que facilitara y agilizara la
búsqueda de los roles.
54
Dentro de esta misma vista observamos el botón Agregar Nuevo Rol que le
dará al administrador la opción de agregar un nuevo rol si es necesario.
Se le dará una descripción o nombre de rol y los permisos que se le atribuirán
al usuario.
A continuación, se mostrarán los permisos que el administrador puede otorgar
en cada categoría:
 Gestión_Ventas
 Reportes
55
Administración_Sistema.
56
Administración_Inventario
Gestión_Ventas.
57
58
Reportes.
59
También esta vista cuenta con un botón de Editar Roles que el usuario
administrador puede usar si es requerido.
Editar Roles:
Modificaremos el nombre del rol y le otorgaremos permisos o le quitaremos
dependiendo del rol que tendrá el usuario.
A continuación, se mostrará la función botón Editar Roles en las siguientes
categorías.
 Gestión_Ventas
 Reportes
Administración_Sistema.
60
Administración_Inventario
61
Gestión_Ventas
62
Reportes
63
Estado de la bitácora:
Esta funcionalidad como su nombre lo indica permite al administrador del
sistema verificar el estado de la bitácora, el administrador puede acceder a esta
función para saber qué acciones fueron realizadas en el sistema. Estado de la
bitácora también nos muestra en qué fecha se realizó dicha acción y que
usuario la realizó.
64
Esta funcionalidad también está equipada con un combo box en la parte
superior izquierda que nos permite elegir la cantidad de registros que
deseamos ver en la pantalla. Al mismo tiempo que también se nos muestra una
barra de búsqueda en la parte superior derecha que nos permite agilizar la
búsqueda permitiéndonos buscar por fecha y usuario.
Configurar Correo:
Y por último tenemos la funcionalidad Configuración de Correo, con esta
funcionalidad es como el administrador es capaz de la configuración de correo
electrónico. Podemos administrar un correo electrónico que pertenecerán a la
tienda los cuales contarán con su determinado host y puerto.
65
Se nos muestra también un botón en el cual le podremos editar la información
del correo electrónico si es necesario.
66
Administración de Inventario:
Dentro del menú del administrador podremos encontrar el segundo módulo del
sistema al cual tiene acceso el administrador: Administración de Inventario.
Dentro de este módulo podremos encontrar 2 funcionalidades a las cual el
administrador tienes permisos.
La primera funcionalidad que encontramos es:
Categoría:
En esta vista podremos observar que el usuario administrador tendrá la opción
de agregar una nueva categoría de producto, tendrá la opción de editarla si es
necesario y eliminarla.
A continuación, se mostrarán las funcionalidades Agregar Nueva Categoría y

Editar Categoría
67
Agregar Nueva Categoría:
Con esta funcionalidad el usuario administrador contará con un botón en la
parte superior izquierda con el cual podrá agregar nuevas categorías de
productos.
Editar Categoría:
En la parte derecha contara con botones DataTable que le permitirán editar el
nombre de la categoría de un producto o eliminar cierta categoría en el caso de
ser necesario.
Editaremos el nombre de la categoría de un producto
68
Productos:
Esta seria la segunda y última funcionalidad de nuestro segundo módulo, con la
cual el administrador tiene los permisos para agregar un nuevo producto,
además de eso tiene muchas más opciones como las que podemos ver a
simple vista como ver el número exacto de productos que se encuentran en el
sistema catalogados por colores: verde, amarillo y rojo y acciones como editar
producto donde el administrador puede agregar una descripción del producto
existente, agregar una imagen del producto, fijar un determinado precio de
venta y asignarle una categoría al producto.
Además, se nos muestra cuando fue agregado el producto y por supuesto la
opción de eliminar un producto si es necesario.
69
A continuación, se mostrará las funcionalidades Agregar Nuevo Producto y
Editar producto de la vista Administración de los productos.
Agregar Nuevo Producto:

Como podemos observar para agregar un nuevo producto se nos mostrara un
formulario que tendremos que llenar.
1. En combo box para seleccionar la categoría en que queremos que este
el producto.
2. Se nos pedirá el código que tendrá en producto.
3. Se nos pedirá una descripción del producto
4. Ingresaremos con un valor la cantidad del producto que estará en
existencia.
5. Nos pedirá el precio que tendrá el producto y el precio a vender del
producto
6. Se nos muestra un combo box al cual nosotros elegiremos el porcentaje
deseado
7. Por ultimo nos pedirá que subamos una imagen del producto que
estamos agregando.
70
Editar Producto:
Como su nombre indica esta funcionalidad permite al usuario administrador
poder editar en cualquier caso necesario luego de que se halla agregado cierto
producto.
71
Gestión de ventas:
Dentro del menú del administrador encontramos el tercer módulo del sistema al
cual tiene acceso el administrador: Gestión de ventas.
administrador tiene permisos.
Ventas:
Esta funcionalidad tiene como objetivo permitirle al usuario administrador
agregar una nueva venta en el sistema SYSTEMANAGER el cual pedirá los
datos de la venta en proceso tal como nombre del vendedor, forma de pago,
importe de pago, importe de vuelto, etc. También nos dará la opción de elegir a
un cliente si ya está registrado en el sistema o crear un nuevo cliente.
Así también el sistema mostrará la fecha de la compra y el administrador
también podrá:
 Visualizar venta
 Imprimir recibo de pago
 Editar venta
 Eliminar venta
 Hacer histórico de pago
72
A continuación, se mostrará el formulario del botón agregar de la vista venta.
Cuando vamos a crear una nueva venta se nos presenta el siguiente formulario
que tendremos que llenar.
1. A continuación, ingresaremos el nombre del vendedor
2. La fecha en que se hace la venta
3. El cliente que hará la venta, si el cliente es nuevo se agregara
4. Luego se ingresa la fecha de vencimiento
5. Luego fijamos el tiempo de entrega del producto
6. Se pondrá el código del producto en el código de barra para buscarlo
En la parte derecha de la pantalla podremos ver el inventario de los
productos para tener una mejor agilidad y organización a la hora de crear
una venta.
Y por último al final del formulario se seleccionará el tipo de pago que hará el
cliente.
73
Se mostrará un DataTable de imprimir la venta realizada en formato pdf.
74
Editar la venta:
Se muestra el formulario de la función Editar Venta.
Se modificará la venta en caso que el cliente desee cambiar o agregar otro
producto.
Histórico de pago:
En la vista Administración de Ventas se mostrará un DataTable que será el
histórico de pago donde se mostrará el
1. Id de pago
2. Fecha de pago
3. Método de pago
4. Importe de pago
5. Importe de vuelto
Y además contara con un DataTable de imprimir un recibo de pago de la venta
y un DataTable de eliminar el pago de la venta realizada
75
Recibo impreso:
76
Clientes:
Con esta funcionalidad el usuario administrador tiene la potestad de agregar un
nuevo cliente o ya sea poder editar cierta información de este mismo como
nombre, correo, cedula, teléfono, el total de compras que ha hecho, etc.
Igualmente, el usuario administrador puede eliminar a un usuario si es
requerido, también podemos observar dentro de esta funcionalidad una barra
de búsqueda que agiliza en gran medida la búsqueda de usuarios en el
sistema.
77
A continuación, se mostrará el formulario que debe de llenar el usuario
administrador en el botón de agregar un nuevo cliente.
Se ingresará:
1. Nombre de cliente
2. Cedula del cliente
3. Correo del cliente
4. Número telefónico de cliente
5. Dirección del cliente
6. Fecha de nacimiento
78
Editar cliente:
A continuación, se muestra la función editar cliente que le da al usuario
administrador la opción de modificar en caso de que el cliente lo requiera.
Cotizaciones:
Para finalizar con el 3 modulo del menú del administrador nos encontramos con
su última funcionalidad: Cotizaciones.
Esta funcionalidad permite al usuario administrador poder agregar una nueva
cotización de x producto en donde el administrador llenara un formulario con la
debida información acerca de la cotización en cuestión.
En la parte de la derecha podemos observar que se encuentran diferentes
botones DataTable con el cual el administrador podrá:
1. Imprimir cotización
2. Enviar una cotización por correo electrónico
3. Editar una cotización
4. Eliminar cotización
79
Y por último en esta función también tendrá la opción de generar una venta
siempre y cuando la cotización se encuentra vigente.
A continuación, se mostrará el botón de agregar una nueva cotización.
80
El cual se llenará con la siguiente información:
1. A continuación, se mostrará el nombre del vendedor
6. Se pondrá el nombre del cliente a cotizar
7. En la parte derecha de la pantalla se nos mostrara el inventario de los
productos
8. Y se guardara la cotización.
A continuación, se mostrará la función imprimir del DataTable imprimir en la
vista principal.
Imprimir:
Imprimirá la cotización en formato pdf
81
Editar cotización:
Se podrá modificar una cotización en el caso requerido.
En la vista principal de Administración de las Cotizaciones se mostrará un

DataTable Generar Venta con 2 tipos de funcionalidad:
1.Se generará una venta cuando la cotización este vigente.
2.Se mostrará cuando la cotización esta vencida y no habrá acceso.
82
Reportes de empresa:
Dentro del menú del administrador encontramos el cuarto y último módulo del
sistema al cual tiene acceso el administrador: Reportes de empresa.
administrador tiene permisos.
Ganancias de ventas:
Aquí podremos visualizar las ganancias de las ventas de la empresa por
cantidad y por rango de fecha.
También se podrá imprimir la información de las ganancias de las ventas en un
reporte en Excel.
83
Productos vendidos:
Nos muestra un gráfico de pastel en el cual nos permite visualizar los 10
productos más vendidos de la tienda.
Vendedores:
Con este grafico podremos visualizar los vendedores de la tienda y
visualizamos la cantidad de ganancias que han hecho los vendedores.
84
Compradores:
Con este grafico podremos visualizar a los compradores que han comprado en
la empresa y visualizamos la cantidad de compras que ha hecho cada
comprador.
A continuación, describiremos al segundo usuario del sistema

SYSTEMANAGER el Vendedor y explicaremos su funcionamiento y los
permisos que este tendrá en el sistema.
85
Vendedor:
Página principal de Vendedor.
Esta es la vista principal y en este caso el usuario en sesión es el Vendedor el
cual tiene acceso y permiso solo a Gestión de Ventas en el sistema
SYSTEMANAGER.
Elementos que serán comunes en esta vista es el menú situado a la izquierda
de la pantalla que solo difiere en los permisos y vistas del usuario en sesión. En
este caso el menú que visualizará el Vendedor tendrá acceso solo a gestión de
venta. También hay una barra de búsqueda que permitirá a todos los usuarios
buscar de forma detallada sus permisos o asignaciones, tanto en el menú como
en la barra de navegación se muestra el usuario en sesión. Hay una barra de
navegación principal donde podemos ver el logotipo de la empresa, así como
los catálogos, las ventas e información del usuario en sesión y permitirá un
cierre de sesión del sistema al usuario.
86
Gestión de Ventas:
Dentro del menú del Vendedor encontramos el único modulo al cual se le
permite tener acceso al vendedor, Gestión de Ventas.
Este módulo cuenta con 3 funcionalidades a las cuales el Vendedor tiene
permiso.
La primera funcionalidad es:
Ventas:
Esta funcionalidad tiene como objetivo permitirle al usuario Vendedor agregar
una nueva venta en el sistema SYSTEMANAGER el cual pedirá los datos de la
venta en proceso tal como nombre del vendedor, forma de pago, importe de
pago, importe de vuelto, etc. También nos dará la opción de elegir a un cliente
si ya está registrado en el sistema o crear un nuevo cliente.
Así también el sistema mostrará la fecha de la compra.
En este módulo el usuario Vendedor solo tiene permiso de imprimir la venta.
87
A continuación, se mostrará el formulario del botón agregar de la vista venta.
Cuando vamos a crear una nueva venta se nos presenta el siguiente formulario
que tendremos que llenar.
9. A continuación, ingresaremos el nombre del vendedor
14. Se pondrá el código del producto en el código de barra para buscarlo
En la parte derecha de la pantalla podremos ver el inventario de los
productos para tener una mejor agilidad y organización a la hora de crear
una venta.
88
Y por último al final del formulario se seleccionará el tipo de pago que hará el
cliente.
Se mostrará un DataTable de imprimir la venta realizada en formato pdf.
89
Clientes:
Con esta funcionalidad el usuario Vendedor puede agregar un nuevo cliente o
ya sea poder editar cierta información de este mismo como nombre, correo,
cedula, teléfono, el total de compras que ha hecho, etc.
Igualmente, el usuario Vendedor puede eliminar a un usuario si es requerido,
también podemos observar dentro de esta funcionalidad una barra de
búsqueda que agiliza en gran medida la búsqueda de usuarios en el sistema.
90
A continuación, se mostrará el formulario que debe de llenar el usuario
Vendedor en el botón de agregar un nuevo cliente.
Se ingresará:
1. Nombre de cliente
2. Cedula del cliente
3. Correo del cliente
4. Número telefónico de cliente
5. Dirección del cliente
6. Fecha de nacimiento
91
Editar cliente:
A continuación, se muestra la función editar cliente que le da al usuario
Vendedor la opción de modificar en caso de que el cliente lo requiera.
92
Cotizaciones:
Para finalizar el modulo del menú de Vendedor nos encontramos con su última
funcionalidad: Cotizaciones.
Esta funcionalidad permite al usuario Vendedor poder agregar una nueva
cotización de x producto en donde el administrador llenara un formulario con la
debida información acerca de la cotización en cuestión.
En la parte de la derecha podemos observar que se encuentran diferentes
botones DataTable con el cual el administrador podrá:
1. Imprimir cotización
2. Enviar una cotización por correo electrónico
3. Editar una cotización
4. Eliminar cotización
Y por último en esta función también tendrá la opción de generar una venta
siempre y cuando la cotización se encuentra vigente.
93
A continuación, se mostrará el botón de agregar una nueva cotización.
El cual se llenará con la siguiente información:

1. A continuación, se mostrará el nombre del vendedor
6. Se pondrá el nombre del cliente a cotizar
7. En la parte derecha de la pantalla se nos mostrara el inventario de los
productos
8. Y se guardara la cotización.
94
A continuación, se mostrará la función imprimir del DataTable imprimir en la
vista principal.
Imprimir:
Imprimirá la cotización en formato pdf.
95
Editar cotización:
Se podrá modificar una cotización en el caso requerido.
En la vista principal de Administración de las Cotizaciones se mostrará un

DataTable Generar Venta con 2 tipos de funcionalidad:
96
1.Se generará una venta cuando la cotización este vigente.
2.Se mostrará cuando la cotización esta vencida y no habrá acceso.
XV. CONCLUSIONES
XVI. RECOMENDACIONES
XVI.1. Implementar ventas al crédito
XVI.2. Implementar comercio Electrónico.
XVI.3. Revisar respaldos periódicos de la base de datos.
XVI.4. Habilitar en el sistema las ventas al crédito.
XVI.5. Contar con un certificado SSL oficial.
97
Bibliografía
Aguilar, J. (2008-2020). Joseaguilar. Obtenido de DataTables jQuery plugin:

https://www.jose-aguilar.com/blog/datatables-jquery-plugin/#:~:text=DataTables
%20es%20un%20plugin%20para,los%20resultados%20de%20forma%20r
%C3%A1pida.
Chávez, V. H. (2010). sistema de informacion para control, seguimiento y
mantenimiento del equipamiento hospitalario. Lima, Perú.
Como Funciona.com. (2020). Como Funciona. Obtenido de ¿Cómo funciona
AdminLTE?: https://como-funciona.com/adminlte/
Cordero, E. J. (2017). desarrollo de software para el control de reparaciones y ventas
de repuestos. León, Nicaragua.
Culturacion. (2020). ¿Qué es la encriptación TLS y para que se utiliza? Obtenido de
¿Qué es la encriptación TLS?: https://culturacion.com/la-encriptacion-tls-se-
utiliza/
Culturacion. (2020). ¿Que es y para que sirve Mysql? Obtenido de Concepto de
MySQL : https://culturacion.com/que-es-y-para-que-sirve-mysql/
Garcia, M. (30 de Mayo de 2020). NETTIX. Obtenido de ¿QUE ES XAMPP Y COMO
PUEDO USARLO?: https://www.nettix.com.pe/blog/web-blog/que-es-xampp-y-
como-puedo-usarlo
jQueryScript.net. (2012-2020). jQuery Input Mask Plugin. Obtenido de jQuery Input
Mask Plugin: https://www.jqueryscript.net/form/Easy-jQuery-Input-Mask-Plugin-
inputmask.html#:~:text=jQuery%20Input%20Mask%20is%20a,numerics%2C
%20phone%20numbers%2C%20etc.
98
Leydi Roxana Velásquez, C. A. (2014). Systema de inventario y facturacion de la
tienda de accesorios de computadoras y celulares ''Decosys'' . Estelí,
Nicaragua.
PHP.net. (2001-2020). ¿Que puede hacer PHP? Obtenido de PHP.net:
https://www.php.net/manual/es/intro-whatcando.php
XVII. Anexos
XVII.1. CRONOGRAMA:
CRONOGRAMA SYSTEM MANAGER

Meses: 1 2 3 4 5 6
ETAPAS ACTIVIDADES
Semanas: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 18 19 20 21 22 23 24 25
Decidimos, qué proyecto íbamos a elegir.
DETERMINAR O
FIJAR OBJETIVOS
Para donde y para quien lo vamos a realizar.
Revelación de requerimientos iniciales o luego

PLANIFICACION
de una iteración.
Se identifican y evalúan los riesgos potenciales y
Análisis y también se evalúan las alternativas existentes.
evaluación de Revisamos todo lo hecho, evaluándolo, y con ello
riesgos decidimos si continuamos con las fases
siguientes y planificamos la próxima actividad
Los prototipos se amplían y se añaden
funcionalidades
Desarrollar y probar
El código real es escrito, probado y migrado a un
entorno de prueba
Planificación de la El ciclo se planifica al final de cada etapa y si se

siguiente iteración producen errores, se buscan soluciones
99
XVII.2. GLOSARIO DE TERMINOS:
Glosario
 Plantilla AdminLTE: Excelente plantilla “opensource” para la creación de

software responsivos.
 JQuery DataTable: Plugin para la creación de tablas dinámicas.
 MorrisJS: Plugin para creación de gráficos dinámicos y estadísticas.
 ChartJS: Plugin para creación de gráficos dinámicos.
 Date Range Picker: Plugin para la realización de selección de rangos de
fechas.
 Input Mask: Plugin para enmascarar entradas de formularios.
 TCPDF: Extensión creada para PHP para la impresión de formato PDF.
 HTML: Para la creación del desarrollo de las páginas.
 CSS: Para la creación de organizar las presentaciones y aspecto de la
página web.
 Bootstrap: Será el framework que nos va a ayudar a que nuestro
software quede responsivo tal cual como lo trae ya de una vez la plantilla
AdminLTE.
 JavaScript: Para la creación efectos atractivos y dinámicos en las
páginas web.
 Usuario: Persona que puede ingresar a la zona privada del SIS-WEB, a
través de un proceso de autenticación utilizando nombre de usuario y
contraseña.
 Rendimiento: Referencia al resultado deseado efectivamente obtenido
por cada unidad que realiza la actividad, donde el término unidad puede
referirse a un individuo, un equipo, un departamento o una sección de
una organización.
100
 Permiso: Parámetro que especifica si su poseedor dispone de acceso a
una determinada función del sistema o a una parte de la interfaz de
usuario del sistema
 Rol: Es un conjunto de permisos que puede asignarse a un usuario.
 Administrador del Sistema: Persona encargada de ofrecer el soporte
técnico y operativo al SIS-WEB.
 Pruebas: Proceso mediante el cual se realizan actividades para verificar
la óptima función del sistema.
101

Monografia Trabajando

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Monografia Trabajando

Cargado por

Copyright:

Formatos disponibles

UNIVERSIDAD NACIONAL AUTÓNOMA DE NICARAGUA, LEÓN

FACULTAD DE CIENCIAS Y TECNOLOGÍA

SISTEMA WEB DE INVENTARIO Y FACTURACIÓN DE VENTA PARA LA

 Br. Carlos Manuel Martínez Chevez

 Br. David Guillermo Martínez Solórzano.

 Br. Yelzon Humberto Delgado Blanco

 MSc. Álvaro Rafael Altamirano Osorio

 Dr. Ms. Jorge Soes Centeno Borge

León, Nicaragua, Julio de 2020

“A LA LIBERTAD POR LA UNIVERSIDAD”

FACULTAD DE CIENCIAS Y TECNOLOGÍA

SISTEMA WEB DE INVENTARIO Y FACTURACIÓN DE VENTA PARA LA

 Br. Carlos Manuel Martínez Chevez ___________________

 Br. David Guillermo Martínez Solórzano ___________________

 Br. Yelzon Humberto Delgado Blanco ___________________

 MSc. Álvaro Rafael Altamirano Osorio ___________________

 Dr. Ms. Jorge Soes Centeno Borge ___________________

León, Nicaragua, Julio de 2020

“A LA LIBERTAD POR LA UNIVERSIDAD”

El presente proyecto consiste en desarrollar e implementar una plataforma Web

El presente trabajo investigativo lo dedicamos principalmente a Dios, por ser el

A nuestros padres, por su amor, trabajo y sacrificio en todos estos años,

A nuestros hermanas (os) por estar siempre presentes, acompañándonos y por

Agradecemos a Dios por bendecirnos la vida, por guiarnos a lo largo de nuestra

Gracias a nuestros padres:

Pedro Martínez y Karla Chévez.

Guillermo Martínez y Olga Solórzano.

Jairo Delgado y Natividad Blanco.

Agradecemos a nuestros docentes de la Facultad de Ciencias y Tecnología del

MSc. Álvaro Rafael Altamirano Osorio.

Dr. Ms. Jorge Soes Centeno Borge.

De nuestro proyecto de investigación quien ha guiado con su paciencia, y

El presente proyecto se refiere a la creación de un sistema web para el manejo

Las empresas o negocios tienen en cuenta que la tecnología ya no es un lujo y

El proyecto web SYSTEMANAGER dirigido a tiendas o empresas tiene como

En primer lugar, se tiene que, en 2013 fue presentado en la Universidad

En los últimos tiempos, muchos negocios de tiendas de computadoras y

IX.1. Objetivo General

 Desarrollar un sistema web que permita el control de inventario y ventas,

IX.2. Objetivos Específicos

 Crear una base de datos relacional para almacenar la información del

 Generar una bitácora para llevar el control de las operaciones realizadas

 Utilizar la plantilla AdminLTE para crear interfaces de usuario de calidad

 Generar reportes que puedan ser exportados en los siguientes formatos:

El marco teórico que fundamenta esta investigación nos permitirá conocer

X.1. Los sistemas de información:

PHP (acrónimo recursivo de PHP: Hypertext Preprocessor) es un lenguaje de

 Scripts desde la línea de comandos: Se puede crear un script de PHP

 Escribir aplicaciones de escritorio: Probablemente PHP no sea el

 Funcionalidad de la plantilla AdminLTE

 El controlador es el encargado de gestionar las peticiones del usuario,

 Las vistas son las responsables de mostrar al usuario el resultado que

Conceptos para adaptar el sistema ya sea un teléfono, Tablet y

Nos aparece la opción de poder personalizar el tamaño responsivo.

El tamaño 768 pixeles es como si tuvieras una Tablet en posición vertical.

El tamaño 1024 pixeles que es la Tablet, pero ya en posición horizontal.

Vamos a tener dos tipos de logotipos:

 El logotipo normal cuando el logotipo este visible en la barra de

 Apariencia del perfil:

Cada uno de los módulos y modelos tendrá un icono que lo representara y

Cada uno de estos módulos va a necesitar su controlador y su modelo para

 Actualizar cada uno de los módulos.

 Borrar cada uno de los módulos.