universidad central del ecuador facultad de ingeniería ciencias

UNIVERSIDAD CENTRAL DEL ECUADOR
FACULTAD DE INGENIERÍA CIENCIAS FÍSICAS Y MATEMÁTICA
CARRERA DE INGENIERÍA INFORMÁTICA
DISEÑO E IMPLEMENTACIÓN DE UN SISTEMA WEB PARA COMPRA Y
VENTA DE FLORES EN LA EMPRESA FLORALTIME
TRABAJO DE GRADUACIÓN PREVIO A LA OBTENCIÓN DEL TÍTULO DE
INGENIERO INFORMÁTICO
AUTOR: LANDÍVAR RODRÍGUEZ CHRISTIAN GUSTAVO
TUTOR: ING. JEFFERSON TARCISIO BELTRÁN MORALES
QUITO-ECUADOR
2015
DEDICATORIA
A Dios, por darme la sabiduría y conocimiento para lograr mis objetivos.
A mi madre Roció, por haberme apoyado en todos los momentos de mi vida
con sus consejos, sus valores, por la motivación constante que me ha
permitido ser una persona de bien, y sobre todo por brindarme ese inmenso
amor de madre.
A mi padre Gustavo, por sus ejemplos de lucha, perseverancia y constancia
que lo caracteriza, por sus palabras de aliento para salir adelante en todo
momento de mi vida, el mejor amigo que siempre ha estado a mi lado, doy
gracias a dios por estos padres ejemplares que me has dado.
A mi hermano Esteban, por su inmenso cariño y apoyo.
A mi esposa Angela, mis hijos Valentina y Camilo, ya que gracias a su
apoyo, paciencia y confianza e culminado mi carrera, gracias por estar
siempre a mi lado apoyándome.
Además debo agradecer a todos aquellos excelentes Docentes que con sus
sabios concejos y apoyo continuo contribuyeron no sólo en darme una
formación académica respetable sino también enriquecieron mi formación
personal.
GRACIAS A TODOS!
Christian Gustavo Landívar Rodríguez
ii
AGRADECIMIENTO
Agradezco en primer lugar a Dios por darme la sabiduría y salud necesaria
para culminar éste sueño tan anhelado.
A mis familiares por todo el apoyo incondicional brindado durante la carrera
estudiantil, con sus continuas motivaciones de superación.
Además, mis sinceros y especiales agradecimientos al Ing. Jefferson Beltrán,
Tutor de la Tesis, Ing. Rene Carrillo e Ing. Alicia Andrade, Revisores de la
misma, quienes con sus sabios consejos me han guiado por un buen y
exitoso camino hasta la culminación de la presente tesis.
Christian Gustavo Landívar Rodríguez
iii
iv
v
vi
vii
viii
CONTENIDO
CAPITULO I.................................................................................................... 3
EL PROBLEMA .............................................................................................. 3
1.1.
PLANTEAMIENTO DEL PROBLEMA .......................................................... 3
1.2.
INTERROGANTES DE LA INVESTIGACIÓN ................................................. 3
1.3.
OBJETIVOS DE LA INVESTIGACIÓN ......................................................... 3
1.3.1 Objetivo General ........................................................................... 3
1.3.2 Objetivos Específicos .................................................................... 4
1.4.
ALCANCE ............................................................................................ 4
CAPITULO II................................................................................................... 5
MARCO TEÓRICO ......................................................................................... 5
2.1
FUNDAMENTO TEÓRICO ....................................................................... 5
CAPÍTULO III................................................................................................ 22
METODOLOGÍA ........................................................................................... 22
3.1
SELECCIÓN DE LA METODOLOGÍA ....................................................... 22
CAPÍTULO IV ............................................................................................... 23
DIAGNÓSTICO DE LA SITUACIÓN ACTUAL ............................................. 23
CAPÍTULO V ................................................................................................ 29
DISEÑO DE LA SOLUCION......................................................................... 29
CAPÍTULO VI ............................................................................................... 36
MARCO ADMINISTRATIVO......................................................................... 36
6.1
PRESUPUESTO .................................................................................. 36
6.2
CRONOGRAMA .................................................................................. 36
MATERIALES DE REFERENCIA ................................................................ 37
ix
LISTA DE FIGURAS
FIGURA 2.1: ETAPAS DE LA METODOLOGÍA OOHDM……………...…..23
Figura 2.2: Registro de compra de flor…………………….………....…….25
Figura 2.3: Cambio de Finca en el registro de compra de flor…...…….26
Figura 2.4: Cambio de cantidad en el registro de compra de flor...…...27
Figura 2.5: Cancelación de pedido por parte del cliente…….…..……...28
Figura 2.6: Presupuesto……….…………………..……………………….….38
Figura 2.7: Cronograma...………………………………………….....……....41
x
RESUMEN
PROYECTO DE DISEÑO E IMPLEMENTACIÓN DE UN SISTEMA WEB
PARA COMPRA Y VENTA DE FLORES EN LA EMPRESA FLORALTIME
El creciente uso de la plataforma web para el desarrollo de aplicaciones es
agigantado. Cada vez las empresas dejan de lado el uso de aplicaciones de
escritorio que solo pueden accedidas desde un terminal específico e intentan
trasladar sus aplicaciones al entorno web, el cual les otorga una mejor
accesibilidad teniendo así un mejor control de sus procesos, sin importar el
terminal por el cual desean acceder a la aplicación.
Tomando en consideración las ventajas que supone una aplicación en la
plataforma web, la empresa Floraltime decide incrementar su productividad al
migrar su entorno de trabajo basado íntegramente en aplicaciones de
escritorio a la plataforma web.
El presente trabajo de titulación pretende dotar a la empresa Floraltime de
una aplicación que permita tener una mejor accesibilidad y control a sus
registros de compra y venta de flor, registros de clientes, registros de
aerolíneas, registros de cargueras y registros de fincas.
DESCRIPTORES: DESARROLLO WEB / RECURSOS DE SOFTWARE /
SOFTWARE LIBRE / DISEÑO WEB / BASES DE DATOS / EMPRESA
FLORALTIME
xi
ABSTRACT
DESIGN AND IMPLEMENTATION OF SYSTEM FOR BUYING AND
SELLING FLOWERS FOR FLORALTIME COMPANY
The increasing use of the web platform for the applications development is
massive. Every time the companies leave aside the use of desktop
applications that only can be accessed from a specific terminal and try to
move their applications to the web environment, which grants them a better
accessibility and having a better control of their processes, regardless of the
terminal for which they want to access the application.
Taking into consideration the advantages of an application in the web
platform, the Floraltime Company decides to increase their productivity,
migrating its working environment based entirely on desktop applications to
the web platform.
The present degree project tries to provide to Floraltime company an
application that allows to have a better accessibility and control for its records
of buy and sale flowers, clients records, airlines records, shippers records and
farms records.
DESCRIPTORS: WEB DEVELOPMENT / SOFWARE RESOVICES / OPEN
SOURCE / WEB DESIGN / DATABASE / EMPRESA FLORALTIME
xii
xiii
xiv
INTRODUCCIÓN
La empresa Floraltime actualmente lleva el control de los procesos de
compra y venta de flores por medio de un archivo de Excel, donde se ingresa
el tipo de flor, la preferencia de finca y la cantidad de flor requerida por cada
cliente, diariamente.
La empresa cuenta con convenios de venta de flor con diferentes fincas, los
que sirven para hacer la distribución de los pedidos. Los pedidos son
recibidos por teléfono o correo electrónico. Una vez que el pedido ha sido
confirmado telefónicamente, el pedido es marcado como cumplido.
El presente proyecto de tesis considera el diseño e implementación de un
sistema web para automatizar los procesos de compra y venta de flor y así
llevar un mejor control del estado de todos sus pedidos
El sistema web de una empresa es el conjunto de tecnologías de la
información y las comunicaciones que sirven de soporte a la utilización de
Internet en el seno de la misma, tanto como herramienta para la obtención y
procesamiento de la información, en la toma de decisiones como en la
interrelación de la empresa con su mercado y su entorno.
Los sistemas web afectan a estos dos conceptos fundamentales:

Proceso de toma de decisiones en las distintas actividades
(planificación, dirección, organización y control) y niveles de la
dirección de Marketing de la empresa.

Relación con el mercado y el entorno empresarial que ha de tenerse
en cuenta en la planificación estratégica.
La estructura y funcionamiento de la web se basa en un estándar que
técnicamente se denomina “modelo (o arquitectura) de tres capas”, debido a
que los tres elementos básicos que componen el sistema web de una
1
empresa están dispuestos en tres niveles. Uno que serían los pc clientes,
que albergan los correspondientes programas de software para poder
conectarse e intercambiar datos. El pc se limita a participar como nexo entre
el pc cliente manejado por el usuario final y la organización que es
propietaria y usuaria principal de los datos, información y aplicaciones
intercambiadas. El servidor web se limita a atender la petición de conexión
por parte del pc cliente y suministrar a éste los datos, información o
aplicaciones objeto de la petición, utilizando para ello determinadas páginas
web propias de la organización pero que son “entendidas” universalmente
por cualquier elemento informático conectado a través de Internet gracias al
empleo del protocolo HTTP.
En los sistemas informáticos y bases de datos de propiedad de la empresa
que va a intercambiar datos e información a través del servidor web con el pc
cliente que inició la conexión estarán presentes esos datos e información de
una manera lógica, de acuerdo con lo que los responsables de la
administración de la empresa hayan decidido en función de sus propias y
exclusivas necesidades informativas. Como han de intercambiarse también
con el entorno, se hace preciso un modo de traductor o intérprete que vierta
los datos, información y aplicaciones desde la “presentación” de uso interno
para la empresa a la “presentación” en que los responsables de la gestión
desean que aparezca para el uso externo. Esta presentación hacia el exterior
se llama lógica externa del negocio, y la labor de traducción o interpretación
desde la lógica propia de los datos e informaciones residentes en la empresa
a la lógica externa del negocio corre a cargo del elemento tecnológico
denominado servidor de aplicaciones.
2
CAPITULO I
EL PROBLEMA
1.1. Planteamiento del problema
Actualmente la empresa Floraltime cuenta con una inadecuada forma
de llevar un control sobre sus pedidos. El control se lo hace por medio de un
archivo de Excel que debe ser renombrado cada día.
1.2. Interrogantes de la Investigación
La idea de la presente tesis se genera a partir de varias interrogantes
que nacen de la observación de los problemas que tienen los usuarios al
momento de registrar y llevar un control sobre el estado de los pedidos de los
clientes:
 ¿Qué es lo que requieren los usuarios?
 ¿Qué nivel de conocimiento y manejo de tecnología existe en los
usuarios de la empresa Floraltime?
 ¿Cómo ha crecido tecnológicamente la empresa Floraltime?
 ¿Qué nivel de servicio existe en Floraltime?
 ¿Cuáles son los factores que no han permitido tener un adecuado
control sobre los pedidos en Floraltime?
 ¿Qué procesos serán automatizados?
1.3. Objetivos de la Investigación
1.3.1 Objetivo General
Diseñar e implementar un sistema que permita
tener un adecuado
control sobre los pedidos y despachos a los clientes, así como, de las
adquisiciones a proveedores, garantizando la confiabilidad, seguridad e
integridad de datos.
3
1.3.2 Objetivos Específicos

Realizar el levantamiento de la situación actual de los procesos:
pedidos, despachos, adquisiciones y facturación.

Dotar de un sistema web para la empresa que esté de acuerdo a
sus objetivos y satisfaga las necesidades.

Elaborar el diseño del sistema web para la empresa, que permita
automatizar los procesos antes mencionados usando tecnologías
de última generación, además proveer de una estructura que
facilite el acceso a la información y la toma de decisiones en
Floraltime.
1.4. Alcance
De los objetivos planteados dentro de la investigación podemos decir
que el alcance del proyecto se establece de la siguiente manera:
Hacer un levantamiento de información del estado actual de los procesos de
pedidos, despachos, adquisiciones y facturación.
En el proceso de pedidos, se receptan los requerimientos de flor de los
clientes, los que se receptan por correo electrónico. Seguidamente se verifica
en la orden fija, que son convenios que tiene la empresa con las fincas
proveedoras de flor, si existe todo o parte del pedido del cliente y se registra
la operación en un archivo de Excel.
En el proceso de adquisiciones se registran los pedidos que no fueron
cubiertos por la orden fija y se procede hacer la compra por mercado abierto
es decir pidiendo a las fincas la flor, este proceso se lo realiza por medio de
chat y es también registrado en el archivo de Excel.
El proceso de despacho se encarga de hacerlo la empresa de carga, la
misma que envía por medio de correo electrónico la cantidad de flor
despachada. Esto sirve para el proceso de facturación, en donde se realiza
4
una comparación de lo que se pidió a la finca y lo que realmente fue
despachado por la misma.
Seguidamente se elaborará el diseño y la implementación del sistema web
de tal forma que cumpla con los requerimientos y se ajuste a las expectativas
de la empresa. Todo esto aplicando tecnologías de última generación.
Como lenguajes de programación se utilizará PHP y JavaScript, HTML5 para
la parte visual y la base de datos será MySQL. También se usará MVC
(Modelo Vista Controlador) como patrón para el desarrollo del sistema.
CAPITULO II
MARCO TEÓRICO
2.1
Fundamento Teórico
FUNDAMENTOS DE LA WEB1
El éxito espectacular de la Web se basa en dos puntales fundamentales: el
protocolo HTTP y el lenguaje HTML. Uno permite una implementación simple
y sencilla de un sistema de comunicaciones que nos permite enviar cualquier
tipo de ficheros de una forma fácil, que simplifica el funcionamiento del
servidor, Permitiendo que servidores poco potentes atiendan miles de
peticiones y Simplificando los costes de despliegue.
El otro nos proporciona un mecanismo de composición de páginas enlazadas
simple y fácil, altamente eficiente y de uso o muy simple.
1
http://www.sw-computacion.f2s.com/Linux/004-Desarrollo_de_aplicaciones_web.pdf
5
PROTOCOLO HTTP2
El protocolo HTTP (Hypertext Tranfer Protocol) es el protocolo base de la
WWW. Es un protocolo simple, orientado a conexión y sin estado. Es un
protocolo Orientado a conexión ya que emplea para su funcionamiento un
protocolo de comunicaciones (TCP, Transport Control Protocol) de modo
conectado, un Protocolo que establece un canal de comunicaciones de
extremo a extremo (entre el cliente y el servidor) por el que pasa el flujo de
bytes que constituyen los datos a transferir, en contraposición a los
protocolos de datagrama o no orientados a conexión que dividen los datos en
pequeños paquetes (datagramas) y los envían, pudiendo llegar por vías
diferentes del servidor al cliente. El protocolo no mantiene estado, es decir,
cada transferencia de datos es una conexión independiente de la anterior, no
manteniendo ninguna relación entre ellas.
Esto es así hasta el punto de que para transferir una página Web debemos
enviar el código HTML del texto así como las imágenes que la componen,
pues en la especificación inicial de HTTP, la 1.0, se abrían y usaban tantas
conexiones como componentes tenía la página, transfiriéndose por cada
conexión un componente (el texto de la página o cada una de las imágenes).
HTML53
HTML5 es la actualización de HTML, el lenguaje en el que es creada la web.
HTML5 también es un término de marketing para agrupar las nuevas
tecnologías de desarrollo de aplicaciones web: HTML5, CSS3 y nuevas
capacidades de JavaScript.
2
3
http://www.sw-computacion.f2s.com/Linux/004-Desarrollo_de_aplicaciones_web.pdf
http://www.cristalab.com/tutoriales/introduccion-a-html5-c92171l/
6
La versión anterior y más usada de HTML, HTML4, carece de características
necesarias para la creación de aplicaciones modernas basadas en un
navegador. El uso fuerte de JavaScript ha ayudado a mejorar esto, gracias a
frameworks
como jQuery, jQuery
UI, Sproutcore,
entre
otros.
Flash en especial ha sido usado en remplazó de HTML para desarrollar web
apps que superaran las habilidades de un navegador: Audio, video,
webcams, micrófonos, datos binarios, animaciones vectoriales, componentes
de interfaz complejos, entre muchas otras cosas. Ahora HTML5 es capaz de
hacer esto sin necesidad de plugins y con una gran compatibilidad entre
navegadores.
Nuevas etiquetas de HTML5
HTML4 y HTML5 son 100% compatibles entre sí. Todo el código que tienes
en HTML normal seguirá funcionando sin problemas en HTML5. Para
empezar a usar HTML5 lo único que tienes que hacer es colocar
este DOCTYPE antes de la etiqueta <html>:
Código :
<!DOCTYPE html>
Es un DOCTYPE mucho más simplificado que XHTML (cuyas reglas siguen
siendo usadas) y te permite usar todas las habilidades de HTML5 sin que
nada
de
lo
que
ya
tienes
programado
deje
de
funcionar.
Las principales etiquetas HTML5 nuevas no tienen una representación
especial en pantalla. Todas se comportan como un <div> o un <span>. Pero
cada una tiene un significado semántico superior a un simple div o span.
7
<header>
Hacer cosas como <div id="header"> es un poco estúpido cuando el 99% de
los proyectos web tienen una cabecera. <header> está diseñada para
reemplazar la necesidad de crear divs sin significado semántico.
<hgroup>
Muchos headers necesitan múltiples títulos, como un blog que tiene un titulo
y un tagline explicando el blog. <hgroup> permite colocar un h1, h2 y h3
dentro del header sin afectar el SEO, permitiendo usar otro h1 en el sitio.
En el HTML actual, sólo puedes usar h1 una vez por sitio o el h1 pierde
prioridad de SEO.
<nav>
Igual que <header>, <nav> está diseñado para que ahí coloques la botonera
de navegación principal. Puedes colocar cualquier etiqueta dentro, aunque lo
recomendado es usar listas <ul>. Sólo puedes tener un <nav> por página.
<section>
Define un área de contenido única dentro del sitio. En un blog, sería la zona
donde están todos los posts. En un video de youtube, habría un section para
el video, uno para los datos del video, otro para la zona de comentarios.
<article>
Define zonas únicas de contenido independiente. En el home de un blog,
cada post sería un article. En un post del blog, el post y cada uno de sus
comentarios sería un <article>.
<aside>
Cualquier contenido que no esté relacionado con el objetivo primario de la
página va en un aside. En un blog, obviamente el aside es la barra lateral de
8
información. En el home de un periódico, puede ser el área de indicadores
económicos.
<footer>
Este es obvio. Es el pie de página y todo lo que lo compone.
APLICACIONES WEB4
Una aplicación Web, básicamente, es un programa, en sí muy parecido a
cualquiera de los programas que todos nosotros tenemos en nuestra
computadora, pero con la salvedad de que la computadora que hace correr
ese programa, es el servidor al que nos conectamos a través de nuestro
navegador, convirtiéndose éste en la "pantalla" o ventana en la que
visualizamos las cosas que ocurren al ejecutar las acciones de la aplicación.
El servidor nos devuelve la información en formato HTML y así cualquier
navegador es capaz de interpretar este código para poder visualizar de forma
correcta la información que nos envía la aplicación. Son numerosas las
ventajas de las aplicaciones Web en cualquiera de los campos para los que
se utilicen, ya que permiten facilitar mucho la estructuración y sobre todo el
mantenimiento de la información que se muestra en el sitio Web.
Las aplicaciones Web se pueden utilizar con múltiples fines, desde un
sencillo uso para facilitar la creación de un sitio Web más o menos extenso,
hasta para centralizar toda la información (contabilidad, pedidos, logística,
etc.) de una empresa multinacional, con sedes en diferentes países del
mundo. Al partir toda la información de un mismo punto o base de datos,
permite a todos los usuarios que trabajan con esta información conocer en
tiempo real el estado de la misma.
4
http://wwwisis.ufg.edu.sv/wwwisis/documentos/TE/005.74-A594d/005.74-A594dCapitulo%20II.pdf
9
Por ejemplo una empresa con diferentes sedes que vende productos, del tipo
que sea, catalogado y referenciado y por supuesto almacenado, con un
control de stock. Si un agente comercial de un departamento gestiona el
pedido de una referencia, de la cual solo queda una en el almacén, justo en
el momento en el que se haya ejecutado el pedido, el siguiente agente,
aunque pertenezca a otra sede de otro departamento, que entre para realizar
un pedido de esa misma referencia, podrá informar al cliente de que no hay
unidades en almacén de ese producto, evitando problemas en el servicio al
cliente.
Ventajas como la mencionadas anteriormente, exigen a cambio el esfuerzo,
trabajo
o
inversión
de
mantener
toda
la
información
actualizada
permanentemente para poder así ser útil a todos los usuarios que trabajan
diariamente con la aplicación Web.
TIPOS DE APLICACIONES

Desarrollo de sitios Web básicos.
Hay empresas o profesionales que por su tipo de negocio o producto,
solamente precisan tener un pequeño espacio Web para mostrar de
forma sencilla información sobre su actividad, contacto, etc. Se
utilizará como tarjeta de visita para presentar a sus clientes. Estos
sitios Web, aun siendo sencillos en sus contenidos, pueden ofrecer
una buena imagen de la empresa o el profesional a sus visitantes. Los
diseñadores y desarrolladores tienen lo siguiente como objetivos
principales: Diseño bueno y atractivo, buena estructuración, fácil
navegación, optimización de imágenes y acabado completo del sitio.

Web en flash.
Hace ya bastante tiempo que la Compañía Macromedia desarrolló la
tecnología de flash, para abrir un mundo nuevo de posibilidades de
10
animación y movimiento a la presentación de sitios Web. Hoy en día,
cualquier navegador de cualquier fabricante o plataforma lleva
incorporado el plugin que permite la correcta visualización de este tipo
sitios web.

Aplicaciones de contenido.
Existen muchas empresas y profesionales que desean utilizar Internet
como medio para publicar o difundir bien sus servicios o sus estudios
profesionales, para llegar a un público al que antes de la existencia de
Internet no se podía llegar. Este tipo de aplicaciones son ideales para
el crecimiento de contenidos a lo largo del tiempo ya que están
estructuradas y permiten ampliar, prácticamente hasta donde se
desee, los contenidos del sitio Web.

Aplicaciones e-learning.
La competitividad del mercado, cada día mayor, nos obliga a todos a
mantener una formación permanente en nuestro trabajo o profesión,
con el fin de estar al día de las últimas novedades que se producen.
Lo anterior unido a la falta de tiempo que todos sufrimos, ha llevado a
muchas empresas a ofrecer cursos de formación continua a través de
Internet, lo que se conoce por e-learning.

Comercio electrónico.
Por todos es sabido que el comercio electrónico está sufriendo un
espectacular auge en los últimos años. Cada día son más las
personas que realizan por Internet, desde la compra de alimentos y
enseres para su casa, hasta la compra de determinados productos
muy específicos que no se encuentran habitualmente el cualquier
comercio tradicional.

Aplicaciones de gestión.
Desde luego si hay una función estrella para las aplicaciones
informáticas es la gestión y contabilidad en las empresas. La gran
mayoría de las pequeñas empresas, adquieren o adquirieron su primer
11
ordenador con el objetivo de utilizarlo para la gestión de la
contabilidad y en su caso de almacén. La tecnología Web permite
crear un nuevo concepto para este tipo de aplicaciones.
HISTORIA DEL PHP5
PHP comenzó siendo un conjunto de scripts escritos en Perl que permitían a
su creador. Rasmus Lerdorf, el control de los accesos a sus Páginas
personales. A este conjunto de Scripts les denominó como personal Home
Page Tools. Poco a poco, Ramus fue complementando las funcionabilidades
básicas de sus herramientas escribiendo programas en C. En 1995 decidió
liberar el código fuente escrito en C para que cualquiera pudiera utilizarlo e,
incluso, colaborar en su mejora.
De este modo Nació PHP/FI. A finales de 1997 se libera PHP/FI 2.0,
pasando de ser el proyecto de una sola persona al desarrollo de un equipo.
Tuvo un seguimiento estimado de varios miles de usuarios en todo el mundo,
con aproximadamente 50,000 dominios informando que lo tenían instalados,
lo que sumaba alrededor del 1% de los dominios de Internet.
En junio de 1998 se liberó oficialmente PHP 3.0, anunciando como sucesor
oficial de PHP/FI 2.0, si bien había sido completamente reescrito por Andi
Gutmans y Zeev Zuraski. Una de las mejores características de PHP 3.0 que
trajo a docenas de desarrolladores a unirse y enviar nuevos módulos de
extensión era su gran extensibilidad, además de proveer a los usuarios
finales de una sólida infraestructura para muchísimas bases de datos,
protocolos,
APIs.
En
su
apogeo,
PHP
3.0
estaba
aproximadamente un 10% de los servidores Web en Internet.
5
http://geneura.ugr.es/~victor/cursillos/javascript/js_intro.html
12
instalado
en
EVOLUCION DE PHP6
El siguiente paso en la evolución de PHP consistió en la reescritura de su
núcleo, dando lugar a un nuevo motor denominado Zend (acrónimo de los
apellidos Zeev y Andi). PHP 4.0, basado en este motor, y acoplado con un
gran rango de nuevas características adiciónales, fue oficialmente liberado
en mayo de 2000.
Además de la mejora de ejecución de esta versión, PHP 4.0 incluía otras
características clave, como el soporte para la mayoría de los servidores Web,
sesiones HTTP forma nativa, ciertas facilidades de orientación a objetos,
compatibilidad con las expresiones regulares de Perl, Buffers de salida,
encriptación, formas más seguras de controlar las entradas de Usuarios y
muchas nuevas Construcciones de lenguaje, etc.
La ultima y actual versión de PHP, liberada en julio de 2004, es la 5.0 está
basada en el nuevo motor Zend 2, el cual ha vuelto a ser reescrito por
completo. Entre sus características y novedades más resaltables está el
completo soporte para la programación orientada a objetos (que a buen
seguro satisfará a los más apasionados y ortodoxos seguidores de este
paradigma de la programación). También incorpora la gestión de
excepciones, una nueva librería de XML (libxm12), soporte nativo para el
sistema gestor de base de datos SQLite, y mejoras en la gestión de las
cadenas de caracteres. PHP 5.0 soporta también MySQLi, Una nueva
ampliación de MySQL (está diseñada para trabajar con la versión 4.1.2 o
superior), la cual, además de la Interfaz habitual, encierra una Interfaz
basada en objetos.
6
http://geneura.ugr.es/~victor/cursillos/javascript/js_intro.html
13
¿QUE SE PUEDE HACER CON PHP?7
Aunque principalmente se utiliza para programar scripts que van a ser
ejecutados en servidores Web, no hay que olvidar que puede utilizarse como
cualquier otro lenguaje (Perl,C ,Python ,Shell,etc.) para escribir programas
que se ejecuten desde la línea de comandos, es decir, sin la necesidad de
que se ejecute conjuntamente con un servidor Web. De todas formas, es en
el entorno Web donde se ha conseguido su mayor aceptación, Y es que PHP
no sólo nos permite realizar todas las acciones propias de un Script CGI
tradicional (procesamiento
de formularios,
manipulación de
cookies,
generación de páginas con contenidos dinámicos), sino que también nos
proporciona las siguientes posibilidades:
- Soporte para múltiples sistemas operativos; Unix (entre otras, Linux, HPUX, Solaris y OpenBSD), Microsoft Windows, Mac Os X, RISC OS.
Actualmente está en preparación para las plataformas IBM OS/390 y AS/400.
- Soporte para múltiples servidores Web: Apache, Microsoft Internet
Information Server, Personal Web Server, Netscape e iPlanet, Oreilly
Website Pro Server, Caudium, Xitami, OmniHTTPd Y muchos otros.
- Soporte para ODBC y extensiones DBX.
- Soporte para comunicarse con otros servicios usando protocolos tales como
LDAP, IMAP, SNMP, NNTP, POP3, HTTP, COM (en Windows) y muchos
otros.
- Puede utilizar objetos Java de forma transparente, como objetos PHP.
- La extensión de CORBA puede ser utilizada para acceder a objetos
remotos.
7
http://geneura.ugr.es/~victor/cursillos/javascript/js_intro.html
14
- PHP soporta WDDX para intercambio de datos entre lenguajes de
programación Web.
- Generación de resultados en múltiples formatos como XHTML, XML
ficheros de imágenes, ficheros PDF y películas Flash.
- Manejo de expresiones regulares POSIX Extended o Perl.
- Funciones de comercio electrónico, como Cybercash, Cybermut Verisign
Payflow Pro y CCVS para pasarelas de pago.
- Otras extensiones muy interesantes son las funciones del motor de
búsquedas mnoGosearch, funciones para pasarelas de IRC, utilidades de
compresión (gzip, bz2), convención de calendarios y traducciones.
MODO DE FUNCIONAMIENTO DE PHP8
El intérprete PHP puede ser ejecutado por el servidor Web de dos modos
distintos: como módulo del propio servidor (interfaz SAPI, Server Application
programming Interface) o como programa externo a éste (modo CGI,
Common Gateway Interface). A grandes rasgos, ejecutar un programa CGI le
supone a la maquina donde se está ejecutando el servidor Web llamar al
sistema operativo para que realice las siguientes tareas básicas: cargar el
programa en memoria, anotarlo en la lista de tareas, lanzar su ejecución,
esperar a que termine y, por fin, descargarlo de memoria y de la lista de
tareas. Tantas veces el cliente pida la ejecución de un programa CGI, tantas
veces se repetirán estas acciones en la maquina servidora.
Es fácil imaginar que, si el número de peticiones en medio-alto, el
rendimiento general de esta ésta se verá proporcionalmente degradado, no
ya sólo por el número de tareas simultáneas a realizar, sino por la ocupación
8
http://geneura.ugr.es/~victor/cursillos/javascript/js_intro.html
15
de la memoria física del equipo servidor con las copias del programa CGI
ejecutándose.
Por otra parte, podemos pensar en un SAPI como un protocolo que permite
acceder directamente a las funciones internas del servidor, por tanto a través
del SAPI podemos añadir nuevas funcionabilidades a un servidor Web (por
ejemplo, acceso a base de datos, autentificación de usuarios, cacheó de
páginas, generación de imágenes al vuelo, etc.). Lo más interesante de esta
característica es que todas estas nuevas funcionabilidades se van ejecutar
de forma más rápida y eficiente ya que lo van hacer en el espacio de
memoria del propio servidor. Esto significa que las ejecuciones de los
programas las hará el propio servidor Web y, por tanto, serán mucho más
rápidas y eficaces (no habrá creación de procesos nuevos ni ocupación extra
de la memoria física con copias de éstos). Según el fabricante de servidores,
existen varios tipos de API`s: Apache API para el servidor Apache, ISAPI de
Microsoft para su producto Internet Information Server, NSAPI de AOL para
el servidor ¡planet (antes, Netscape Enterprise Server) y WSAPI.
JAVASCRIPT9
JavaScript es un lenguaje interpretado, al igual que VisualBasic, Perl, TCL...
sin embargo, posee una característica que lo hace especialmente idóneo
para trabajar en Web, usado principalmente en "clientes web", ya que son
los navegadores que utilizamos para viajar por ella los que interpretan (y por
tanto ejecutan) los programas escritos en JavaScript. De
esta forma,
podemos enviar documentos a través de la Web que incorporan el código
fuente de un programa, convirtiéndose de esta forma en documentos
dinámicos, y dejando de ser simples fuentes de información estáticas.
9
http://geneura.ugr.es/~victor/cursillos/javascript/js_intro.html
16
Los programas en JavaScript no son la primera forma que conoce la Web
para transformar información, dado que el uso de CGIs está ampliamente
difundido. La diferencia básica que existe entre un programa CGI y uno
escrito en JavaScript es que el CGI se ejecuta en el servidor de páginas Web
mientras que el programa en JavaScript se ejecuta en el cliente (es decir, en
el navegador). Por regla general, el CGI necesita unos datos de entrada (que
normalmente se proporcionan mediante un formulario), los procesa y emite
un resultado en forma de documento HTML. Esto implica tres transacciones
en la red.
La primera carga la página del formulario, la segunda envía los datos al
servidor, y la tercera recibe la nueva página que ha generado el CGI. Por el
contrario, los programas escritos en JavaScript se ejecutan en el navegador
del cliente, sin necesidad de que intervenga el servidor. De esta forma, una
sola transacción basta para cargar la página en la que se encuentra tanto el
formulario, para los datos de entrada, como el programa en JavaScript que
proporciona los resultados.
CARACTERISTICAS DE JAVASCRIPT10
Las dos principales características de tiene el lenguaje JavaScript son:

Es un lenguaje basado en objetos(es decir, el paradigma de
programación es básicamente el de la programación dirigida a objetos,
pero con menos restricciones).

JavaScript es además un lenguaje orientado a eventos, debido por
supuesto al tipo de entornos en los que se utiliza
(Windows y
sistemas X-Windows). Esto implica que gran parte de la programación
en JavaScript se centra en describir objetos (con sus variables de
10
http://geneura.ugr.es/~victor/cursillos/javascript/js_intro.html
17
instancia y métodos de "clase") y escribir funciones que respondan a
movimientos del ratón, pulsación de teclas, apertura y cerrado de
ventanas o carga de una página, entre otros eventos.
WAMP11
Es la abreviación de Windows, Apache, MySQL y PHP y es un proyecto
desarrollado por franceses. Este paquete instala la versión 2.2 de Apache,
PHP5, MySQL 5.0.27, PhpMyAdmin y SQLite manager en tu computadora.
Una de las ventajas de este paquete es la ofrecer la versión de PHP5 en el
instalador y sus constantes actualizaciones.
La instalación es bastante sencilla y destaca que los servicios de apache y
de MySQL se instalarán en Windows bajo los nombres de wampapache y
wampmysqld para no interferir con otras instalaciones previas de estos
servidores.
APACHE WEB SERVER12
Es un servidor web libre, es decir, el encargado de construir y devolver las
páginas web que solicitan los navegadores. Su nombre procede de "a patchy
server", por ser una versión "parcheada" en 1995 de uno de los primeros
servidores web, el NCSA HTTPD, y actualmente corre
en muy diversas
plataformas (Unices, Windows, etc.). Debido a su licencia libre pero no
copyleft, existen también versiones propietarias de Apache, aunque es
desarrollado y mantenido por la comunidad del software libre a través de la
Fundación Apache.
11
http://www.maestrosdelweb.com/ampfacil/
12
http://www.colombiaaprende.edu.co/html/mediateca/1607/articles-108379_archivo.pdf
18
PHPMYADMIN13
PHPMYADMIN es una utilidad que nos sirve para interactuar con una base
de datos de forma muy sencilla y desde una interfaz web. Nos sirve por
ejemplo para crear bases de datos, tablas, borrar o modificar dados, añadir
registros, hacer copias de seguridad, etc. Es una aplicación tan útil que casi
todos los hosting con MySQL disponen de ella, por ello se analizará su
instalación. Además, vamos a usarlo para crear los usuarios MySQL para así
poder utilizar las bases de datos de forma segura. Al ser una aplicación
escrita en PHP, necesita de Apache y MySQL para poder funcionar.
BASE DE DATOS RELACIONALES14
Existen muchos tipos de base de datos en función del modo en que
almacenan y acceden a la información que guardan: Relacional, jerárquica,
en la red, orientada a objetos, etc. Ejemplos de gestores de bases de datos
relacionales o RDBMS (Relational Database Management System) hay
muchos: MySQL, SQLite, Orale, Informix, SyBase, Microsoft SQL Server,
Postgres, Msql, etc.
Básicamente, un gestor de base de datos relacionales almacena los datos en
Tablas, cada una de las cuales está formada por filas (o registros), y estas, a
su vez, están formadas por columnas (o campos), Antes de definir una tabla,
hay que normalizarla, procesó que consiste en evitar redundancia, es decir,
que la información éste duplicada ya que, si hubiera que cambiar un dato que
estuviera repetido, habría que cambiar varias veces.
13
http://www.maestrosdelweb.com/phpmysqlap/#a4
14
http://geneura.ugr.es/~victor/cursillos/javascript/js_intro.html
19
MySQL15
De entre todos los gestores anteriormente mencionados, la elección de
MySQL como gestor de base de datos radica en que es gratuito tanto para
usos privados, cómo comerciales (sólo hay que pagar en el caso de que se
desarrolló un producto comercial que éste basado en MySQL), en su
disponibilidad para distintos sistemas operativos (la mayor parte de los
sabores Unix, Windows 9X/NT/2000/XP, OS/2 etc.), en que es capaz de
trabajar con millones de registros y porque, además es muy rápido y no
necesita grandes recursos de máquina.
DISEÑO DE BASE DE DATOS
Una única base de datos relacional puede contener cualquier número de
tablas, esto plantea las preguntas de cuántas tablas debe tener una base de
datos y de qué campos bebe tener cada tabla. Dichas decisiones son la base
del diseño de datos.
Un buen diseño hace que resulte fácil trabajar con la base de datos y ofrece
suficiente flexibilidad como para admitir los requisitos futuros. Un diseño
pobre obstaculiza las operaciones select, proyect y join, haciendo que la
base de datos resulte poco flexible y sea difícil trabajar con ella.
DISEÑO FORMAL DE UNA BASE DE DATOS
Una base de datos verdaderamente relacional es aquella que sigue el
llamado modelo relacional formulado inicialmente por E.F.Codd, un
investigador de IBM. El modelo relacional describe la base de datos, tablas,
15
http://geneura.ugr.es/~victor/cursillos/javascript/js_intro.html
20
registros, campos, operadores como select, Project y join de un modo formal,
matemático. Uno de los puntos fuertes del modelo relacional es que es
matemáticamente completo (un término que coloquialmente significa que no
contiene incoherencias ni le faltan vínculos). El resultado es un modelo de
base de datos con una capacidad de aplicación sin precedentes a una gama
de problemas enormemente amplia.
En una tecnología relacional, el proceso de organizar los campos en tablas
se denomina normalización, porqué con cada paso el diseño se aproxima
cada vez más al estándar relacional (es decir, la norma relacional). Los
expertos han propuesto muchos grados de normalización, pero todos
parecen estar de acuerdo con los cincos primeros:
Primera Forma Normal: Un campo dado de un registro dado sólo puede
contener un valor, esto prohíbe todo tipo de grupos que se repiten dentro de
un único registro, para implementar grupos que se repiten, diseñe una tabla
con registros que se repiten.
Segunda Forma Normal: Cada Campo no clave debe depender de todos los
campos de la clave principal.
Tercera Forma Normal: Ningún campo no clave depende de otro campo no
clave.
Cuarta
Forma
Normal:
Esta
Forma
prohíbe
varias
relaciones
independientes de unos a varios entre los campos de la clave principal y los
campos no clave. Para conseguir la cuarta forma normal tendrá que crear
una tabla aparte para cada relación de uno a varios independientes.
21
Quinta Forma Normal: Esta forma es muy extrema y suele ignorarse,
requiere descomponer una tabla en las partes más pequeñas posibles para
eliminar toda la redundancia.
CAPÍTULO III
METODOLOGÍA
3.1
Selección de la Metodología
Es precisa la aplicación de un conjunto de conceptos, estándares y
metodologías así tenemos:
UML (Lenguaje Unificado de Modelado): esta notación nos permite
modelar, analizar y diseñar el software de manera tal que se pueda
documentar y construir. Hay que tomar en cuenta que en el modelado se
pueden incluir aspectos conceptuales tales como procesos de negocio y
funciones del sistema.
OOHDM (Método de Diseño Hipermedia Orientado a Objeto)16: es una
metodología orientada a objetos que propone un proceso de desarrollo de
cinco fases que son: obtención de requerimientos, Modelo Conceptual,
Diseño Navegacional, Diseño de Interfaz Abstracta e Implementación, donde
se combinan notaciones gráficas UML con otras propias de la metodología.
Esta metodología mantiene modelos de los cuales el más importante es el
diseño navegacional, debido a la abstracción y fácil diseño, en este modelo
tenemos la 4 forma en que las pantallas se abrirán después de seleccionar
una de las opciones del mismo.
En la figura se muestra los pasos necesarios para cumplir con la metodología
de desarrollo de software conocida como OOHDM. La primera fase es la
16
http://inversionesyy.blogspot.com/2010/11/metodologias-de-aplicaciones-web.html
22
obtención de requerimiento que
consiste en realizar el levantamiento de
información y requerimientos mediante reuniones y observaciones. La
segunda fase es el Modelo Conceptual la cual construye un esquema
conceptual que representa objetos, sus relaciones y colaboraciones que
existen en el dominio designado. La tercera fase es el Diseño Navegacional
consiste en unificar una serie de tareas para obtener este diseño en la
aplicación, es decir para cada Identificador de usuario (UID) se crearán
diagramas de contexto. La cuarta etapa de Diseño de Interfaz Abstracta
utilizará ADV (Vista de Datos Abstracta), modelos abstractos que especifican
la organización y el comportamiento de la interfaz. Finalmente en la quinta
fase de Implementación se debe determinar donde se almacenarán los
objetos y con qué lenguaje se desarrollarán las interfaces, para que el
sistema sea desarrollado, entre en la etapa de pruebas y posteriormente sea
publicado.
Figura 2.1: Etapas de la metodología OOHDM
CAPÍTULO IV
DIAGNÓSTICO DE LA SITUACIÓN ACTUAL
4.1
Captura de Requerimientos17
17
Ingeniería de requisitos en aplicaciones para la web, María José Escalona, Nora Koch,
https://www.lsi.us.es/docs/informes/LSI-2002-4.pdf
23
La captura de requisitos es la actividad mediante la que el equipo de
desarrollo de un sistema de software extrae, de cualquier fuente de
información disponible, las necesidades que debe cubrir dicho sistema. El
proceso de captura de requisitos puede resultar complejo, principalmente si
el entorno de trabajo es desconocido para el equipo de analistas, y depende
mucho de las personas que participen en él.
La técnica usada fue la realización de entrevistas al personal involucrado y
se determinó que se necesita un sistema que permita a los usuarios tener
mayor accesibilidad a datos de clientes, cargueras aerolíneas, fincas,
variedades, tipos de flor y proceso de compras.
A continuación se muestra los casos de uso recogidos durante el proceso de
captura de requerimientos en la empresa Floraltime.
Registrar compra de flor:
24
Figura 2.2: Registro de compra de flor
Nombre del Caso de Uso:
Registrar compra de flor
Descripción:
Registra la información de compras
de flor.
Actores:
Usuario Buyer (comprador)
Precondiciones:
El usuario de tener el pedido de un
cliente.
Flujo principal:
1. Usuario recepta pedido de
clientes.
2. Usuario pide disponibilidad de
flor a fincas.
3. Usuario compra la flor según
disponibilidad de la finca.
4. Usuario registra la compra en
25
archivo Excel.
Cambio de Finca en el registro de compra de flor:
Figura 2.3: Cambio de Finca en el registro de compra de flor
Nombre del Caso de Uso:
Cambio de Finca en el registro de
compra de flor
Descripción:
Registra el cambio de finca en la
compra de flor.
Actores:
Usuario Buyer (comprador)
Finca
Precondiciones:
La compra debe estar registrada en
el archivo de Excel de registro de
compras..
Flujo principal:
1. Usuario llama a la finca a
confirmar la compra.
2. Finca no confirma la compra.
3. Usuario pide disponibilidad de
flor a fincas.
26
4. Usuario compra la flor según
disponibilidad de la finca.
5. Usuario registra la compra en
archivo Excel.
Cambio de cantidad en el registro de compra de flor:
Figura 2.4: Cambio de cantidad en el registro de compra de flor
Nombre del Caso de Uso:
Cambio de cantidad en el registro
de compra de flor
Descripción:
Registra el cambio de cantidad en
la compra de flor.
Actores:
Usuario Buyer (comprador)
Finca
Precondiciones:
La compra debe estar registrada en
el archivo de Excel de registro de
27
compras..
Flujo principal:
1. Usuario llama a la finca a
confirmar la compra.
2. Finca no confirma la cantidad.
3. Usuario pide disponibilidad de
flor a fincas.
4. Usuario compra la flor según
disponibilidad de la finca.
5. Usuario registra la compra en
archivo Excel.
Cancelación de pedido por parte del cliente:
Figura 2.5: Cancelación de pedido por parte del cliente
Nombre del Caso de Uso:
Cancelación de pedido por parte del
cliente.
Descripción:
Registra cancelación de pedido por
parte del cliente.
28
Actores:
Usuario Buyer (comprador)
Cliente
Precondiciones:
------
Flujo principal:
1. Cliente llama a usuario a
cancelar el pedido.
2. Usuario registra la cancelación
en archivo Excel.
CAPÍTULO V
DISEÑO DE LA SOLUCION
El diseño de la solución se basa en los siguientes diagramas.
Diagrama de clases:
29
30
31
32
33
34
35
CAPÍTULO VI
MARCO ADMINISTRATIVO
6.1
Presupuesto
El plan de tesis nos proporciona una visión del tiempo requerido para
completar los componentes del proyecto, y a su vez el costo de desarrollar
un proyecto, el mismo que depende de múltiples variables incluyendo costos
de mano de obra, costos de materiales, infraestructura, equipo y utilidades.
Por lo que se presenta una hoja de presupuesto. (Figura 2.6)
6.2
Cronograma
Las actividades programadas en la presente tesis, serán desarrolladas
tentativamente en los siguientes tiempos. (Figura 2.7)
36
MATERIALES DE REFERENCIA
Bibliografía
1. http://www.sw-computacion.f2s.com/Linux/004Desarrollo_de_aplicaciones_web.pdf
2. http://www.cristalab.com/tutoriales/introduccion-a-html5-c92171l/
3. http://wwwisis.ufg.edu.sv/wwwisis/documentos/TE/005.74A594d/005.74-A594d-Capitulo%20II.pdf
4. http://geneura.ugr.es/~victor/cursillos/javascript/js_intro.html
5. http://www.maestrosdelweb.com/ampfacil/
6. http://www.colombiaaprende.edu.co/html/mediateca/1607/articles108379_archivo.pdf
7. http://www.maestrosdelweb.com/phpmysqlap/#a4
8. http://inversionesyy.blogspot.com/2010/11/metodologias-deaplicaciones-web.html
9. Ingeniería de requisitos en aplicaciones para la web, María José
Escalona, Nora Koch, https://www.lsi.us.es/docs/informes/LSI-20024.pdf
37
Figura 2.6: Presupuesto
PRESUPUESTO PARA TESIS DE GRADO
DISEÑO E IMPLEMENTACIÓN DE UN SISTEMA WEB PARA COMPRA
TESIS:
DE FLORES EN LA EMPRESA FLORALTIME
Valor
ITEM
RUBRO
Nº
Unidad
Cantidad
unitario
Valor
Nº
$
$
0
0.00
0.00
0
0.00
0.00
0
0.00
0.00
1 RECURSOS
INSTITUCIONALES UCE
SUBTOTAL UCE
0.00
2 RECURSOS
EMPRESARIALES
EMPRESA:
Materias primas:
0
0.00
0.00
0
0.00
0.00
0
0.00
0.00
0
0.00
0.00
0
0.00
0.00
empresa
0
0.00
0.00
Personal de apoyo
0
0.00
0.00
Material de laboratorio:
Uso de equipo de la
SUBTOTAL EMPRESA
0.00
3 RECURSOS HUMANOS
Tutor de trabajo de
0
38
0.00
0.00
graduación
Tribunal de trabajo de
graduación
0
0.00
0.00
0
0.00
0.00
Investigador (autor de
trabajo de grado)
SUBTOTAL RECURSOS HUMANOS
0.00
RECURSOS
4 MATERIALES
Material de escritorio:
Impresora laser
1
250,00
12,50
Computadora portátil
1
500,00
25,00
Tóner negro
2
79,00
3,95
Tóner cian
1
110,00
5,50
Tóner magenta
1
110,00
5,50
Tóner amarillo
1
110,00
5,50
Recarga toners
2
25,00
50,00
Flash memory
1
25,00
1,25
Resmas de papel
4
3,50
14,00
Esferos
3
0,25
0,75
Libretas
2
1,00
2,00
100
3,00
15,00
4
0,50
2,00
Páginas
800
0,03
24,00
Páginas
500
0,05
25,00
Páginas
0
0,00
0,00
5
3,50
17,50
25
15,00
18,75
Impresiones
Carpetas
Copias
Material bibliográfico:
Fotocopias de libros
Transcripción borrador
trabajo de grado
Anillados borradores
Empastado del trabajo de
grado
SUBTOTAL DE RECURSOS MATERIALES
5 OTROS (Gastos: agua,
Días
39
209,45
153
3,00
14,00
luz, telf.)
Credenciales
1
5,00
5,00
Horas Hombre
Horas
1000
2,00
2000,00
Transporte
Días
153
1,50
180,00
Internet
Meses
6
29,00
174,00
Uso de equipo personal
Horas
918
0,50
367,20
SUBTOTAL OTROS
2595,20
TOTAL
2804,65
IMPREVISTOS (15%)
514,00
TOTAL DEL PRESUPUESTO
3318,65
40
Figura 2.7: Cronograma
41
MANUALES
Manual para la ejecución del programa fuente
1. Verificar que la carpeta floraltime2 que se encuentre en esta
dirección c:\wamp\www\
2. Verificar que la base de datos floraltime3 se encuentre creada.
Ingresamos
a
esta
dirección
http://localhost/phpmyadmin
y
obtenemos esta pantalla. Al lado izquierdo debe aparecer el
nombre de la base de datos.
42
3. Verificamos que la estructura de tablas de la base de datos esté
creada en la siguiente pantalla.
4.
Abrimos en cualquier editor de texto el siguiente archivo
c:\wamp\www\floraltime2\includes\db_constants.php y verificamos
que el archivo tenga estas opciones por defecto.
5.
Finalmente vamos al browser y escribimos la dirección
http://localhost/floraltime2 y accederemos a la aplicación.
43
Manual de instalación del software utilizado
Este proyecto va a ser ejecutado en un ambiente Windows Server 2008
en una intranet. Como servidor de aplicaciones se usará Apache, el motor
de base de datos será MySQL y el lenguaje de servidor será PHP, para lo
cual vamos a usar la última versión del paquete WampServer. Este
paquete posee todo el software necesario para la ejecución del proyecto.
1. Ingresar a esta dirección de internet e ir a la opción Descargas y
descargamos la última versión disponible para 32 bits.
2.
Una vez descargado el software procedemos a ejecutarlo,
haciendo doble clic sobre el icono. Inmediatamente nos aparecerá
la siguiente pantalla y damos clic en ejecutar.
44
3. Seguimos los pasos siguientes dando clic en Next.
45
4.
En la siguiente pantalla escogemos el directorio de
instalación. Dejamos el directorio por defecto que nos presenta
c:\wamp y damos click en Next.
5.
Por ultimo damos clic en Install y esperamos que se copien
los archivos.
46
6.
Ahora el instalador nos pide configurar el servidor de email
para que puedan legar las notificaciones. Dejamos las opciones por
defecto.
7. Y por último dejamos activada la opción Launch WampServer2 now
y damos clic en Finish.
8. Ahora debemos encender WampServer y verificar en el browser si
la instalación fue satisfactoria.
47
48
9. En la barra de direcciones del browser escribimos localhost y
debemos obtener esta pantalla como indicativo que la instalación
fue un éxito.
49
Manual de Programas Ejecutables
1. Copiar la carpeta floraltime2 que se encuentra en los programas
fuentes a la dirección c:\wamp\www\
2. Para crear la base de datos vamos al browser y escribimos la
dirección http://localhost/phpmyadmin y obtenemos esta pantalla.
3. A continuación damos click en la opción Base de datos y creamos
la misma con el nombre floraltime3. Debemos observer la base de
datos a la izquierda.
50
4. Ahora vamos a dar click en el botón Seleccionar archivo y
escogemos el archivo c:\wamp\www\floraltime2\db\Floraltime3.sql
que se encuentra en los programas fuentes para crear toda la
estructura de tablas de la base de datos y damos click en
Continuar.
5. Finalmente obtendremos esta pantalla y la estructura de tablas de
la base de datos estará creada.
51
6.
Ahora debemos configurar el acceso a la base de datos para
la aplicación. Abrimos en cualquier editor de texto el siguiente
archivo c:\wamp\www\floraltime2\includes\db_constants.php y el
archive debe tener estas opciones por defecto.
7.
Finalmente vamos al browser y escribimos la dirección
http://localhost/floraltime2 y accederemos a la aplicación.
52
Manual de Usuario
El sistema se compone de varias pantallas con las cuales puede
interactuar el usuario. A continuación procederé a mostrarlas.
Una vez instalados el servidor de aplicaciones Apache y la base de datos
en el motor de base de datos MySQL, procedemos a ingresar la siguiente
dirección en la barra de direcciones de cualquier browser.
http://localhost/floraltime2/
Pantalla de Login
En esta pantalla el usuario ingresa su usuario y contraseña para el
ingreso al sistema.
Pantalla de Aerolíneas
En esta pantalla se puede visualizar toda la información referente a las
Aerolíneas con las que trabaja la empresa.
53
Para editar la información simplemente damos doble clic sobre el valor de
la columna que se quiere editar. Si el valor a editar es un combo solo
escogeremos la opción deseada y se editara.
Al dar doble clic se pone un borde alrededor del texto a editar y damos
Enter para guardar los cambios y nos aparecerá un mensaje indicando
que la operación se realizó con éxito.
54
Podemos navegar por todos los resultados utilizando los botones de
navegación
Procedemos al uso del cuadro de búsqueda, el cual busca en todos los
registros escribiendo la palabra o texto y dando Enter a continuación.
Ahora procedemos a utilizar el botón de ingreso de un Nuevo Registro.
Aparecerá la siguiente pantalla, en la cual se procederá a ingresar los
datos deseados. Los campos marcados con un asterisco rojo son
Campos requeridos.
55
Cabe indicar que las pantallas de Cargueras, Fincas, Clientes, Tipos
de Flor, Variedades y Tipos de Empaque tienen el mismo
comportamiento en cuanto al proceso de ingreso, edición, búsqueda
y navegación.
Pantalla de Productos
Esta pantalla tiene un funcionamiento similar a las demás pantallas, con la
diferencia de que al momento de editar e ingresar datos, el
comportamiento cambia ligeramente.
Al dar clic en el botón de Nuevo Registro nos parecerá esta pantalla en la
ingresaremos nuestra información. Al dar clic sobre el combo Tipo Flor y
escoger cualquiera de las opciones, se procederá a calcular todas las
Variedades que hayan sido guardadas bajo ese Tipo de Flor. Este
proceso se lo hizo previamente en la pantalla de ingreso de datos de
Variedades.
56
57
Finalmente en la pantalla de Ingreso de Producto damos clic en Guardar y
se habrá guardado un nuevo registro en Producto.
Pantalla de Compras
Finalmente tenemos la Pantalla de Compras en la cual registraremos
todos los pedidos realizados por los Clientes de la siguiente forma.
Haciendo uso del botón Nuevo Registro nos aparece la siguiente pantalla
de ingreso.
En la cual procedemos a llenar el encabezado, Cliente, Aerolínea,
Carguera, Fecha de Entrega y Estado. A continuación se procede a
añadir
los
productos
requeridos.
Se
escoge
el
producto
y
automáticamente se procede a calcular los combos de Finca, Dimensión y
Tipo Empaque, se llenan a más de eso los cuadros de texto
pertenecientes a Tipo Flor y Variedad.
58
Al momento de escoger una opción en el combo Finca, se calculará
automáticamente el Stock asignado en la pantalla de ingreso de
productos, si existe Stock se creará un combo con opciones numéricas
según la cantidad ingresada en el Stock bajo la columna Cantidad, caso
contrario si no existe Stock signado se mantendrá el cuadro de texto.
Para añadir un nuevo reglón de pedido damos clic en Añadir producto y
se creara un renglón nuevo para el ingreso de un nuevo producto. Si se
quiere borrar un renglón se lo puede hacer usando el botón Borrar al final
de cada renglón.
59
Finalmente se procede a guardar, si todos los campos marcados como
requeridos están llenos se procederá al ingreso del pedido de compra y
se mostrará este en la pantalla principal de compras. Si alguno de los
campos requeridos no se encuentra lleno un aviso aparecerá.
En la pantalla principal de Compras se puede manipular únicamente el
estado del pedido de compra, existe la posibilidad de buscar por fecha.
Los registros mostrados en la pantalla principal de compras son los
encabezados de los pedidos de compra, se puede expandir o contraer el
detalle de cada pedido de compra usando los botones azules de + y –
ubicados en la parte izquierda de cada renglón.
60
Finalmente la forma de salir del sistema es dando clic en el link Logout
ubicado en cada pantalla en la parte superior derecha.
61
Manual Técnico
Para la elaboración de este sistema se utilizó PHP, JavaScript, Jquery y
CSS, los cuales están en perfecta armonía para que las pantallas tengan
el comportamiento deseado.
PHP ha sido implementado bajo el patrón de diseño MVC y utilizando
Programación Orientada a Objetos, a continuación se da una introducción
a este patrón de diseño.
Patrón de Diseño MVC
El patrón de diseño MVC organiza el código en base a su función. De
hecho, este patrón separa el código en tres capas:

La capa del modelo define la lógica de negocio (la base de datos
pertenece a esta capa).

La vista es lo que utilizan los usuarios para interactuar con la
aplicación (los gestores de plantillas pertenecen a esta capa).

El controlador es un bloque de código que realiza llamadas al
modelo para obtener los datos y se los pasa a la vista para que los
muestre al usuario.
62
Basado en este patrón las clases de PHP se han creado de la
siguiente manera:

Existen archivos con la terminación Core que son los
controladores y se encargan de todas las interacciones entre
la capa de negocio y la vista.
63

Existen archivos con la terminación Model que son los
encargados exclusivamente de controlar la interacción con la
base de datos.

Existen archivos con la terminación View y se encargan
exclusivamente de proveer la vista.
64
La codificación de un archivo Core es la siguiente:
ComprasCore.php
<?php
require_once($_SERVER['DOCUMENT_ROOT'].'/floraltime2/includ
es/Model/ComprasModel.php');
require_once($_SERVER['DOCUMENT_ROOT'].'/floraltime2/includ
es/Model/ProductoModel.php');
class ComprasCore
{
private $comprasModelHandler = null;
private $productoModelHandler = null;
private $comprasViewHandler = null
public function __construct()
{
$this->comprasModelHandler = new ComprasModel();
$this->comprasViewHandler = new ComprasView();
$this->commonViewHandler = new CommonView();
}
public function getHeaderLinksView()
{
return $this->commonViewHandler->getHeaderLinksView();
}
65
private function getAddNewCompraHtml()
{
$carguerasArray
>getAllCargueras();
=
$this->carguerasModelHandler-
$array = array();
foreach($carguerasArray as $carguera)
{
$array[]
=
array('id'=>$carguera['id_carguera'],'value'=>$carguera['nombre_carguera'
]);
}
$comboCargueras
=
>getComboHtml('cargueras_cmb',$array,'form_cmb');
$aerolineasArray
>getAllAerolineas();
=
$this-
$this->aerolineasModelHandler-
$array = array();
foreach($aerolineasArray as $aerolinea)
{
$array[]
=
array('id'=>$aerolinea['id_aerolinea'],'value'=>$aerolinea['nombre_aeroline
a']);
}
$comboAerolineas
=
>getComboHtml('aerolineas_cmb',$array,'form_cmb');
$clientesArray
>getAllClientes();
=
$array = array();
66
$this-
$this->clientesModelHandler-
foreach($clientesArray as $cliente)
{
$array[]
array('id'=>$cliente['id_clientes'],'value'=>$cliente['nombre_clientes']);
=
}
$comboClientes
=
>getComboHtml('clientes_cmb',$array,'form_cmb');
$estadosArray
>getEstados();
=
$this-
$this->estadosCompraModelHandler-
$comboEstadoHtml
>getEstadoCombo($estadosArray);
=
$this-
$firstRowHtml = $this->getRowHtml(1);
$html
=
$this->comprasViewHandler>getAddNewCompraView($comboEstadoHtml,$comboCargueras,$combo
Aerolineas,$comboClientes,$firstRowHtml);
return $html;
}
$estadoArray['id'] = $comboId_p;
$estadoArray['options'] = $estadoOptionsHtml;
$estadoComboHtml
=
$this->commonViewHandler>estadoComboView($estadoArray,$disabled);
return $estadoComboHtml;
}
67
}
?>
Existen dos archivos especializado en gestionar la conexión a la base de
datos, el primero simplemente define las constates de conexión a la base
de datos y el otro es usado por cada uno de los archivos con terminación
Model, la codificación de los mismos es la siguiente.
db_constants.php
<?php
define("DB_HOST", "localhost");
define("DB_USER", "user");
define("DB_PSWD", "pass");
define("DB_NAME", "nombre_base_de_datos");
?>
DAO.php
<?php
require_once($_SERVER['DOCUMENT_ROOT'].'/floraltime2/includes/db_
constants.php');
//Clase para conectarse a la db
class DAO
{
private $recordSet;
private $sql;
private $numRows;
private $insertedId;
private $databaseConnection = NULL;
public function __construct()
{
//session_start();
$this->resetDAO();
}
68
public function resetDAO()
{
$this->recordSet = NULL;
$this->sql = NULL;
$this->numRows = NULL;
$this->insertedId = NULL;
}
public function setQuery($sql)
{
$this->sql = $sql;
}
public function getRecordSet()
{
return $this->recordSet;
}
public function getNumRows()
{
return $this->numRows;
}
public function getInsertedId()
{
69
return $this->insertedId;
}
public function throwQueryError($functionName, $query)
{
$string = "Failure: Function =>".$functionName." - Query:
".$query;
throw new Exception($string);
}
public function connect()
{
try
{
$this->databaseConnection
mysqli_connect(DB_HOST, DB_USER, DB_PSWD, DB_NAME);
=
//$_SESSION["dbh"] = $this->databaseConnection;
}
catch(Exception $e)
{
//$_SESSION["dbh"] = NULL;
$this->closeConnection();
$this->throwQueryError('connect', $e->getMessage());
}
}
70
private function query($queryText)
{
try
{
$result = NULL;
$this->connect();
$result
>databaseConnection,$queryText);
=
mysqli_query($this-
}
catch(Exception $e)
{
$result = NULL;
$this->closeConnection();
$this->throwQueryError('query', $e->getMessage());
}
return $result;
}
private function closeConnection()
{
mysqli_close($this->databaseConnection);
}
public function executeQuery($populateArray = true)
{
71
$resultSet = NULL;
$dataset = $this->query($this->sql);
//Do we have an insert or replace query?
if (stristr($this->sql, "insert") !== FALSE || stristr($this->sql,
"replace") !== FALSE)
{
$this->insertedId
>databaseConnection);
=
mysqli_insert_id($this-
}
elseif(is_object($dataset))
{
$this->numRows = mysqli_num_rows($dataset);
//Populate data
if($populateArray == true)
{
$resultSet = array();
while($row = mysqli_fetch_assoc($dataset))
{
$resultSet [] = $row;
}
}
else
{
$resultSet = $dataset;
}
}
72
else
{
//is boolean
$resultSet = $dataset;
}
$this->recordSet = $resultSet;
$this->closeConnection();
return $this->recordSet;
}
public function cleanSpecialCharacters($string_p)
{
$this->connect();
return
>databaseConnection, $string_p);
mysqli_real_escape_string($this-
}
}
?>
Esta es la implementación de un archivo con terminación Model.
EstadosCompraModel.php
<?php
require_once($_SERVER['DOCUMENT_ROOT'].'/floraltime2/includes/DA
O.php');
class EstadosCompraModel
{
73
private $db_handler = NULL;
public function __construct()
{
$this->db_handler = new DAO();
}
/*
* Funcion
*
getEstados - Obtiene todos los estados
* Retorna
*
Un arreglo con los datos de todos los estados
*/
public function getEstados()
{
$sql = "SELECT id_estados_compra, estado_compra
FROM estados_compra";
$this->db_handler->setQuery($sql);
$result = $this->db_handler->executeQuery();
return $result;
}
public function getEstadoCompraNameById($estadoId)
{
$sql = "SELECT estado_compra
FROM estados_compra
WHERE id_estados_compra = '".$estadoId."'";
$this->db_handler->setQuery($sql);
$result = $this->db_handler->executeQuery();
return $result[0]['estado_compra'];
}
74
}
?>
Esta es la implementación de una archivo con terminación View
DimensionesView.php
<?php
class DimensionesView
{
public function __construct()
{
}
private function parseTemplates($htmlCode,$placeHolders)
{
$output = '';
if(!empty($htmlCode) && count($placeHolders) > 0)
{
foreach($placeHolders as $key => $value)
{
$htmlCode
str_replace("###$key###",$value,$htmlCode);
}
$output = $htmlCode;
}
return $output;
}
75
=
private function mainResultsTemplate()
{
$html = '<div id="results">
<table id="main-table">
###headers###
###results###
</table>
</div>';
return $html;
}
public function mainResultsView($data)
{
$htmlCode = $this->mainResultsTemplate();
$placeHolders = array("headers"=>$data['headers'],
"results"=>$data['results']);
$html = $this->parseTemplates($htmlCode,$placeHolders);
return $html;
}
public function resultsHeaderView()
{
76
$htmlCode = $this->resultsHeaderTemplate();
return $htmlCode;
}
private function resultsHeaderTemplate()
{
$html = '<tr id="header-results">
<td id="header0" class="header"></td>
<td
id="header1"
<td
id="header2"
class="header">Dimension</td>
class="header">Estado</td>
</tr>';
return $html;
}
private function detailResultsTemplate()
{
$html = '<tr class="###color### resultRow" id="row_###id###">
<td><input
type="checkbox"
id="row_###id###" name="rows[]" class="textColumn" value="###id###"
/></td>
<td><input
id="nombre_###id###"
class="textColumn
value="###nombre###" readonly="readonly" /></td>
type="text"
textColumn1"
<td>###estado_combo###</td>
77
</tr>';
return $html;
}
public function detailResultsView($data)
{
$htmlCode = $this->detailResultsTemplate();
$placeHolders = array("id"=>$data['id'],
"nombre"=>$data['nombre'],
"estado_combo"=>$data['estado_combo'],
"color"=>$data['color']);
$html = $this->parseTemplates($htmlCode,$placeHolders);
return $html;
}
private function getAddNewDimensionTemplate()
{
$html = '<div id="dialog-form" title="Nueva Dimension">
<p class="validateTips">* = Campos
requeridos.</p>
<br/>
78
<form
id="form_new_record"
name="form_new_record">
<label
for="name"
class="txt_label">Nombre</label>
<input type="text" name="name"
id="name" class="form_txt" />
<span class="required">*</span>
<label
for="estado"
class="txt_label">Estado</label>
###estado_combo###
<input
name="guardarNuevo"
id="guardarNuevo"
class="form_button ui-corner-all" />
type="button"
value="Guardar"
<input
type="button"
name="cancelar" id="cancelar" value="Cancelar" class="form_button uicorner-all" />
</form>
</div>';
return $html;
}
public function getAddNewDimensionView($estadoCombo)
{
$htmlCode = $this->getAddNewDimensionTemplate();
$placeHolders = array("estado_combo"=>$estadoCombo);
$html = $this->parseTemplates($htmlCode,$placeHolders);
return $html;
}
79
}
?>
En este proyecto se usó JavaScript y al ser este un lenguaje de
programación que se ejecuta en el browser tiene la ventaja de ser muy
liviano. Se ha tratado de emular el patrón de diseño de MVC pero en
JavaScript.
Así existen 3 archivos Controller, Modules y Sandbox. Los archivos
Controller se encargan de proveer las funcionalidades por ejemplo de una
librería en este caso JQuery, además se encarga de controlar a sus
Modules, los cuales representan porciones de una página web que
realizan cierta acción, por ejemplo si una página posee un carrusel de
fotos, dicho carrusel debe ser un Module. Y finalmente el Sandbox que es
el encargado de comunicar a los Modules con su único controlador es
decir el Controller.
De esta manera ha tratado de estructurar el código de JavaScript, de igual
manera se hizo uso de Programación Orientada a Objetos en JavaScript.
Esta es la forma de crear clases en JavaScript
var DimensionesCore = function()
{
var self = this;
var instanceActionButtonsModule = null;
self.resultsRowModuleInstanceArray = null;
var
createActionButtonsModule
function(moduleId_p,data_p,sandbox_p)
{
var instance = null;
instance = new ActionButtonsModule();
instance.init(moduleId_p,data_p,sandbox_p);
return instance;
};
80
=
var startActionButtonsModuleHandler = function()
{
var data_p = null;
var sandbox = new DimensionesSandbox();
sandbox.init(self);
instanceActionButtonsModule
=
createActionButtonsModule("ActionButtonsModuleId", data_p, sandbox);
};
};
81
DIAGRAMA FISICO DE LA BASE DE DATOS
82
83

Download Report