Você está na página 1de 33

1 Modelaçã o e Simulaçã o de Sistemas

Sistema de Gestã o de Reservas de um


Grupo de Hotéis
Modelaçã o e Simulaçã o Industrial

Manuel Santos -1141133


Nuno Rocha -1140371
Luís Rodrigues – 1130341

Departamento de Engenharia Eletrotécnica


Instituto Superior de Engenharia do Porto

Junho de 2018

Pá gina 1 de 33
3 Modelaçã o e Simulaçã o de Sistemas

RESUMO

Este relató rio descreve os objetivos, modelaçã o e implementaçã o do projeto final de Modelaçã o e
Simulaçã o de Sistemas, tal como o publico alvo/atores e instruçõ es para a sua utilizaçã o. O trabalho rea-
lizado consiste num sistema de gestã o de uma linha de hotéis (designada pelo nome fictício Hotéis
LUSO), constituído por três entidades no Porto, Lisboa e Algarve.
O desenvolvimento do sistema em questã o utiliza um servidor de alojamento denominado
000Web- Host, da empresa HOSTINGER, que proporciona uma base de dados MySQL e uma interface
grá fico PHPmyadmin.
A construçã o do estilo das pá ginas Web e das funcionalidades envolveu ferramentas como HTML,
PHP, comandos/pedidos mySQL, JavaScript e Bootstrap.

Keywords: Sistema de gestã o, atores, casos de uso, cená rios, HTML, PHP, mySQL, JavaScript,
Bootstrap, PHPmyadmin, website.

Pá gina 3 de 33
5 Modelaçã o e Simulaçã o de Sistemas

1 ÍNDICE
1 Introduçã o.................................................................................................................................................................. 7
1.1 Objetivos e aná lise de requisitos.................................................................................................................. 7
2 Modelaçã o................................................................................................................................................................... 9
2.1 Atores...................................................................................................................................................................... 9
2.1.1 Visitante........................................................................................................................................................ 9
2.1.2 Cliente............................................................................................................................................................ 9
2.1.3 Funcioná rio.................................................................................................................................................. 9
2.2 Casos de uso.......................................................................................................................................................... 9
2.3 Cená rios............................................................................................................................................................... 11
3 Implementaçã o...................................................................................................................................................... 11
3.1 Base de dados.................................................................................................................................................... 13
3.2 Gestã o de contas............................................................................................................................................... 13
3.2.1 Acesso à base de dados........................................................................................................................ 14
3.2.2 Criaçã o de conta cliente....................................................................................................................... 14
3.2.3 Iniciar Sessã o na pá gina web................................................................................................................... 14
3.2.4 Fechar sessã o na pá gina web.................................................................................................................. 15
3.2.5 Visualizar/Editar dados de clientes................................................................................................ 15
3.2.6 Visualizar informaçõ es de cada hotel............................................................................................. 16
3.3 Criaçã o e Gestã o de Reservas...................................................................................................................... 17
3.3.1 Criar reserva............................................................................................................................................. 18
4.1.1 Editar e Eliminar..................................................................................................................................... 21
4.1.2 Visualizar................................................................................................................................................... 22
4.2 O uso de JavaScript.......................................................................................................................................... 22
4.3 O uso de AJAX..................................................................................................................................................... 24
5 Manual de Utilizaçã o............................................................................................................................................ 27
5.1 Pá gina principal................................................................................................................................................ 27
5.2 Criar conta/Iniciar Sessã o............................................................................................................................ 28
5.3 Cliente visualiza e edita a sua conta e reservas...................................................................................28
5.4 Cliente faz reservas......................................................................................................................................... 29
5.5 Funcioná rio Visualiza/Edita dados e reservas de clientes..............................................................30
5.6 Funcioná rio visualiza vagas......................................................................................................................... 31
6 Conclusã o................................................................................................................................................................. 33

Pá gina 5 de 33
7 Modelaçã o e Simulaçã o de Sistemas

1 INTRODUÇÃO
Este trabalho surge no â mbito da unidade curricula Modelaçã o e Simulaçã o de Sistema, tendo por
objetivo aprofundar e aplicar os conceitos de sistemas de informaçã o. Como tal desenvolveu-se um sis-
tema de gestã o de reservas de um grupo de hotéis, sendo desenvolvida uma pá gina web que permite
aos clientes efetuar e editar reservas e aos funcioná rios dos hotéis fazer a gestã o das mesmas.
Para este trabalho houve a necessidade de utilizar diversas linguagens de programaçã o,
utilizando- se o HTML e CSS para a parte estilística da pá gina web, mais precisamente a utilizaçã o do
Bootstrap, que permite o desenvolvimento de aplicaçõ es e pá ginas web com uma interface mais
apelativa na perspetiva do utilizador. Além do CSS utilizam-se linguagens como o JavaScrip. Para a
gestã o de base de dados uti- liza-se a linguagem SQL com a utilizaçã o do phpMyAdmin, que permite a
criaçã o das bases de dados e fazer a sua gestã o. Para a interaçã o entre a base de dados e a pá gina web
utiliza-se a linguagem PHP, sendo responsá vel pelos registos e leituras nas tabelas da base de dados,
bem como responsá vel pelas sessõ es login.

Objetivos:
...
1.1 OBJETIVOS E ANÁLISE DE REQUISITOS
O objetivo deste trabalho é desenvolver um sistema de gestã o de reservas de um grupo de hotéis
com capacidades de multi-user. Este sistema deve permitir que os utilizadores tenham uma conta
pessoal, com a qual podem efetuar e editar reservas. Para além disso, deve disponibilizar contas com
permissõ es superiores, para os funcioná rios dos hotéis, para que estes possam gerir as reservas dos
clientes. Estas sã o os requisitos obrigató rios e nos quais o desenvolvimento do projeto se centrou.
Os requisitos facultativos serã o a implementaçã o de uma pá gina de perfil para cada conta, com a
possibilidade de poder alterar estes. Quer seja os clientes editarem os seus dados, como os funcioná rios
editarem os dados dos clientes a pedido destes. Disponibilizar informaçã o sobre as características dos
hotéis. E a inclusã o de uma funcionalidade que dê feedback sobre as vagas nos hotéis do grupo de
acordo com filtros.

Pá gina 7 de 33
9 Modelaçã o e Simulaçã o de Sistemas

Arquitetura do sistema:

2 MODELAÇÃO

2.1 ATORES
O publico alvo pretendido para a utilizaçã o deste sistema está divido entre três papeis, denomina-
dos atores:

2.1.1 VISITANTE
Este é o título atribuído para qualquer utilizador que interaja com o sistema sem possuir qualquer
tipo de registo. O cliente (ponto 2.1.2) é um ator que numa primeira instâ ncia, até à criaçã o de uma
conta, intitula-se como Visitante.
As funçõ es e permissõ es de um visitante sã o muito limitadas, este tem apenas a capacidade de
con- sultar as informaçõ es e condiçõ es dos hotéis e criar contas do tipo Cliente.

2.1.2 CLIENTE
O cliente representa o publico ao qual o serviço deste sistema se destina, podendo usufruir a
capa- cidade de, nã o só consultar as informaçõ es dos hotéis, mas criar, gerir e/ou apagar as suas
reservas.

2.1.3 FUNCIONÁRIO
O funcioná rio é o ator que utiliza o sistema para servir o cliente. Este tem permissã o para consultar as
reservas dos clientes e alterar os seus parâ metros ou elimina-las. Também pode consultar vagas pelo
tipo de quartos, hotéis e por datas.

2.2 CASOS DE USO


Na Tabela 1 sã o apresentados os casos de usos do sistema desenvolvido.

Pá gina 9 de 33
Tabela 1 - Tabela de casos de uso

Ator Use cases


Visitar website
Visitante Criar conta
Visitar website
Editar perfil
Cliente Efetuar reservas
Editar reservas
Visitar website
Editar perfil
Efetuar reservas
Funcionário Editar dados dos clientes
Editar reservas dos clientes
Editar reservas
Pesquisar vagas
Na Figura 1 está representado o diagrama de casos de uso do sistema desenvolvido.

Figura 1 Diagrama de casos de uso


2.3 CENÁRIOS

Tabela 2 Visitante cria conta de cliente

Visitante cria conta de cliente


Descrição Carregar botã o “Criar conta/Iniciar Sessã o”
Preencher o formulá rio “Criar conta”
Carregar no botã o “criar conta”

Tabela 3 Cliente faz reserva

Cliente faz reserva


Descrição Fazer login
Selecionar a pá gina do hotel que pretende
Selecionar o tipo de quarto e datas de entrada e saída
Carregar no botã o “Reservar”

Tabela 4 Cliente visualiza ou altera perfil

Cliente visualiza ou altera perfil


Descrição Fazer login
Carregar no botã o “A minha conta”
Carregar no botã o “Perfil”
Carregar botã o “Editar”
Alterar os campos que se pretende atualizar
Carregar no botã o “Guardar”

Tabela 5 Cliente visualizar ou altera reservas

Cliente visualizar ou altera reservas


Descrição Fazer login
Carregar no botã o “A minha conta”
Carregar no botã o “Reservas”
Editar reservas
Carregar botã o “Editar”
Editar os dados pretendidos
Carregar no botã o “Reservar”
Eliminar reservas
Carregar botã o “Eliminar”
Tabela 6 Funcionário visualiza ou altera dados dos clientes

Funcionário visualiza ou altera dados dos clientes


Descrição Fazer login
Carregar no botã o “Painel administrativo”
Editar dados de clientes (a pedido do cliente)
Carregar botã o “Clientes”
Introduzir email do cliente
Carregar botã o “Editar”
Alterar os campos que se pretende atualizar
Carregar botã o “Guardar”
Visualizar reservas dos clientes
Carregar no botã o “Editar Reservas”
Fazer pesquisa por cliente ou nú mero de reserva
Editar reservas
Carregar botã o “Editar”
Editar os dados pretendidos
Carregar no botã o “Reservar”
Eliminar reservas
Carregar botã o “Eliminar”

Tabela 7 Funcionário visualiza quartos disponíveis

Funcionário visualiza quartos disponíveis


Descrição Fazer login
Carregar no botã o “Painel Administrativo”
Carregar no botã o “Criar Reservas”
Selecionar os requisitos pretendidos
Carregar no botã o “Pesquisar”
13 Modelaçã o e Simulaçã o de Sistemas

3 IMPLEMENTAÇÃO
Neste capítulo será descrevido o processo de desenvolvimento e implementaçã o do sistema.

3.1 BASE DE DADOS


A base de dados, construída através de phpMyAdmin, encontra-se esquematizada na Figura 2.
Exis- tem duas tabelas (Tabela Clientes e Funcioná rios) responsá veis pelo armazenamento das
informaçõ es dos registos de contas criadas pelos respetivos atores. As tabelas Hotéis, Quartos e
TQuartos (tipos de quartos) sã o responsá veis pelo armazenamento das informaçõ es dos diferentes
hotéis.

 A Tabela Hotéis contem o registo de todos os hotéis da linha, com a sua morada e outras
informaçõ es gerais;
 A Tabela Quartos contem o nú mero de quartos total que existe em cada hotel por tipo de
quarto (Exemplo: No hotel Porto, existem 100 quartos do tipo Duplo);
 A Tabela TQuartos contem a informaçã o relativa aos tipos de quartos de cada hotel (Ex:
Tipo Individual, Características: uma cama singular, …).
Por fim, a Tabela Reservas possui os registos das reservas criadas pelos Clientes. Aqui, a tabela
encontra-se ligada pelo email dos Clientes e pelo nome do Hotéis pois cada um dos registos encontra-se
em funçã o de um registo de cada uma destas tabelas.

Figura 2 - Esquema da base de dados

Pá gina 13 de 33
3.2 GESTÃO DE CONTAS

3.2.1 ACESSO À BASE DE DADOS


Para que a pá gina web possa aceder à base dados desenvolvida utiliza-se a funçã o mysqli_connect, que
tem como parâ metros de entrada o nome do servidor, nome de utilizador, palavra-passe e o nome da
base de dados, conforme pode ser observado na Figura 3. Esta pá gina é chamada sempre que haja a ne-
cessidade de fazer-se acesso à s vá rias tabelas da base de dados.

Figura 3 Acesso à Base de Dados

3.2.2 CRIAÇÃO DE CONTA CLIENTE


Para o criar conta na pá gina dos Hotéis Luso o cliente deve preencher um formulá rio no qual indicará o
nome, email (que será usado com username no login), morada (opcional), contacto (opcional), NIF
(opci- onal) e palavra-passe. Estes dados serã o depois envia através do método de POST para a pá gina
POST_criar_conta.php, que faz a encriptaçã o da palavra-passe através da funçã o passwor_hash, como é
possível observar na Figura 4. Depois de recebidos os dados e encriptada a palavra-passe, os dados sã o
introduzidos na tabela de clientes através da funçã o mysqli_query e o comando INSERT INTO, como se
pode observar na Figura 4.

Figura 4 Criação de conta cliente

3.2.3 INICIAR SESSÃO NA PÁGINA WEB


Para um cliente ou funcioná rio iniciar sessã o na pá gina web, este terá de preencher um formulá rio onde
introduzirá o email e palavra-passe, estes dados serã o enviados através do método POST para o
POST_log_in.php. De seguida verifica-se se o email introduzido encontra-se registado na base de dados
de clientes ou funcioná rios, se sim entã o essa linha da base de dados é guardada num array. Depois
compara- se a palavra-passe que foi introduzida pelo utilizador com a que está na base de dados. Como
a palavra- passe na base de dados encontra-se encriptada, torna-se necessá rio utilizar a funçã o
password_verify que verifica se a palavra-passe introduzida pelo utilizador corresponde à versã o
encriptada na base de dados. Se a palavra-passe corresponder à que está na base de dados, entã o cria-se
uma variá vel de sessã o para o email e a password. É também criada uma variá vel de sessã o para o caso
de os dados de login estarem incorretos, mas também uma para o tipo de conta, para que as restantes
pá ginas da pá gina web, consigam distinguir se é um cliente ou administrador a aceder à pá gina. Na
Figura 5 é apresentado um excerto do có digo que demonstra o aquilo que foi explicado.
Figura 5 Iniciar Sessão

3.2.4 FECHAR SESSÃO NA PÁGINA WEB


Para o cliente ou administrador fechar sessã o da pá gina dos Hó teis Luso, existe o botã o “Terminar Ses-
sã o”, que chama a pá gina logout.php que apaga o conteú do das variá veis de sessã o através da funçã o
unset, conforme podemos observar na Figura 6.

Figura 6 Terminar Sessão

3.2.5 VISUALIZAR/EDITAR DADOS DE CLIENTES


A pá gina web dos Hotéis Luso permite que os clientes possam visualizar e editar os seus dados, mas
tam- bém os funcioná rios do hotel podem alterar os dados dos mesmos. Para tal os dados como nome,
morada e contato, que se encontram guardados na tabela clientes da base de dados sã o armazenados
em variá veis de sessã o, como se pode observar na Figura 7.
Figura 7 Armazenamento de dados de clientes em variáveis de sessão

O cliente na “Minha Conta” e o funcioná rio na “Painel Administrativo” podem entã o visualizar e editar
os dados de clientes. Para que o cliente possa editar os seus dados, ele tem ao seu dispor um formulá rio
preenchido com os dados atuais, podendo alterar cada um deles, sendo depois os dados atualizados na
base de dados. Já o funcioná rio pode pesquisar pelos dados dos clientes através do email dos mesmos,
depois terá um formulá rio já preenchido com os dados atuais dos clientes e poderá editar cada um
deles, sendo atualizado na base de dados. Para se atualizar os dados de um determinado cliente é
utilizado a funçã o mysqli_query juntamente com o comando UPDATE, como se pode observar na Figura
8.

Figura 8 Atualização dos dados de clientes na base de dados

3.2.6 VISUALIZAR INFORMAÇÕES DE CADA HOTEL


Como já foi enunciado neste relató rio, na base de dados desenvolvida foi criada uma tabela com
informa- çõ es (morada, piscina, jardim) de cada hotel, sendo estas informaçõ es apresentadas na pá gina
dos mes- mos. Para fazer a leitura dos dados que estã o na base de dados utiliza-se a funçã o
mysqli_query junta- mente com o comando SELECT, sendo estes dados apresentado na zona de
informaçõ es dos hotéis do grupo Luso, como se pode observar na Figura 9.
Figura 9 Informações dos Hotéis do grupo Luso

3.3 CRIAÇÃO E GESTÃO DE RESERVAS


A componente do sistema relacionado com as reservas pode ser dividida em quatro açõ es: Criar,
visualizar, editar e eliminar.
Todas as funçõ es sã o executadas em dois passos em ficheiros diferentes (exceto a visualizaçã o
que será descrita mais abaixo). Existe um ficheiro que gera uma pá gina de interface com o utilizador,
respon- sá vel pela receçã o do pedido e outro que processo o pedido e comunica-o à base de dados.
3.3.1 CRIAR RESERVA

Existem três ficheiros com um formulá rio de preenchimento para realizar o pedido de criaçã o de
uma reserva (Porto.php, Lisboa.php e Algarve.php respetivamente ao hotel pretendido). O funciona-
mento de todos estes é idêntico (Figura 10):

Figura 10 - Código para gerar o formulário de criação de uma reserva

Os parâmetros desejados pelo cliente sã o recebidos em inputs de um form HTML, sendo alguns de
escolha mú ltipla (Radio) ou de seleçã o de datas (date). Ao premir o botã o de submissã o (button
type=’sub- mit’), os valores preenchidos sã o enviados para um ficheiro “POST_interp_res.php”,
juntamente com dois valores de tipo hidden identificando em que hotel está a ser criada a reserva e com
o endereço do ficheiro de origem para o cliente ser automaticamente redirecionado para esta pá gina
depois de submetido pe- dido.
O ficheiro de submissã o do pedido é composto por uma secçã o de validaçã o dos dados recebidos,
outra para a verificaçã o da existência de vagas e, por fim, de envio dos dados estruturados para base de
dados. A secçã o de validaçã o verifica as seguintes condiçõ es:
1. Se o pedido é de criaçã o ou ediçã o: Este ficheiro é utilizado para submeter um destes dois
pedidos, pois estes funcionam de forma muito semelhante. A variá vel $edit controla o tipo
de funçã o a executar (1 para editar, 0 para criar). Para criar, o parâmetro mail do Cliente é
retirado de uma variá vel de sessã o:
Figura 11 - Controlo da função no ficheiro POST_interp_res.php

2. Se todos os campos do formulá rio foram preenchidos e se as datas sã o vá lidas: Na Figura


12, da linha 19 à 22 verificasse se todos os campos do formulá rio foram preenchidos. Da
linha 25 à 47, as datas sã o processadas e transformados em valores numéricos para serem
comparados. A data de inicio nunca pode ser inferior à data do momento da criaçã o da re-
serva e nunca pode ser superior à data do fim.

Figura 12 - Validação de dados no ficheiro POST_interp_res.php

A secçã o de verificaçã o da existência de vagas (Figura 13) faz uma busca na Tabela de reservas à
procura de qualquer registo que intersete os dados do registo a criar (linhas 57 a 60). Para isto ele pro-
curo por todas as reservas do mesmo hotel e tipo de quarto e compara as datas. Como se encontra
esque- matizado na Figura 14, duas vagas intersetam-se em uma das seguintes situaçõ es:
1. Se a data de inicio da reserva existente for superior à data de inicio e inferior à data de fim
da reserva a criar;
2. Se a data de inicio da reserva a criar for superior à data de inicio e inferior à data de fim da
reserva existente;
3. Se ambas as datas da reserva a criar encontram-se dentro do período da reserva existente
ou vice-versa.
Figura 13 - Função para verificação da existência de vagas

Dia 1 2 3 4
Inicio Fim
Caso 1
Inicio Fim

Inicio Fim
Caso 2

Intersecçõ es
Inicio Fim

Inicio Fim
Caso 3
Inicio Fim

Inicio Fim
Caso 4
Inicio Fim
Dia 1 2 3 4
Inicio Fim
Caso 1
Inicio Fim
Vagas

Inicio Fim
Caso 2
Inicio Fim
Reserva a criar Reserva existente

Figura 14 - Esquema de avaliação da intersecção cronológica entre reservas

Por fim, retira-se o nú mero total de quartos desse tipo da tabela de quartos e compara-se ao nú -
mero de registos que intersetam esta reserva (linha 62). Se este ú ltimo for superior ou igual, nã o exis-
tem vagas, caso contrá rio, procede-se para a estruturaçã o dos dados.

De seguida é, das linhas 62 a 101, foi implementada uma funçã o que recolhe o numero de todos os
quartos ocupados pelas reservas intercetantes, faz uma contagem dos nú meros em ordem ascendente e
quando encontrar um numero que salte mais do que uma unidade do anterior (Exemplo: Quartos 1, 2, 3,
5, 6, …), utiliza esse valor intermediá rio como o numero de quarto da reserva a criar.
Por fim, gera-se um valor de reserva (linhas 106 a 111), incrementando uma unidade à reserva de
maior valor e enviam-se todos estes dados numa string (INSERT INTO reservas VALUES
($nres,'$mail','$hotel',$NumQuarto,'$tipoq','$din','$dout')) para a base de dados. Terminado o processo, o
utilizador é redirecionado para a pá gina onde fez o registo. Surge um alerta indicando se a reserva foi
efetuada ou se surgiu um problema juntamente com informaçã o da sua causa.
3.3.2 EDITAR E ELIMINAR

A funçã o editar é muito semelhante à de criar reserva. Esta pode ser efetuada através da pá gina
do cliente (contacl.php) ou no painel de administraçã o (padmin.php). Em ambas as situaçõ es é chamada
uma tabela com todos os registos de reservas que se encontram na base de dados (No caso da pá gina de
cliente, a tabela encontra-se numa divisã o e no painel encontra-se num ficheiro à parte cujo output será
colocado na mesma pá gina através de AJAX). Em cada registo é colocado um botã o que permite a ediçã o
ou elimi- naçã o (linhas 231 e 232 na Figura 15).
No caso de eliminaçã o, ao carregar no botã o, é enviado por href duas variá veis com o nú mero de
reserva a eliminar e com o ficheiro de origem para o ficheiro POST_eliminar_res.php, onde é construído o
comando para apagar o registo na base de dados (DELETE FROM reservas WHERE nreserva=$delete).
No caso de editar, o utilizador é direcionado para a pá gina do ficheiro Editar_Reservas.php, onde
surge um formulário semelhante ao formulário de criar reservas, com a exceçã o de que os inputs
possuem valores default correspondentes aos valores atuais da reserva.
Submetendo o pedido, o processo para a submissã o do pedido é efetuado no mesmo ficheiro de
submissã o de criar contas, mas o email do cliente é enviado por um input, o numero da reserva
mantem- se igual e o comando é substituído por: UPDATE reservas SET hotel='$ho-
tel',nquarto=$NumQuarto,tquarto='$tipoq',entrada='$din',saida='$dout' WHERE nreserva=$nres").

Figura 15 - Tabela de visualização de registos de reserva


3.3.3 VISUALIZAR
Por ú ltimo, alem de ser possível visualizar o registo das reservas existentes descrito em cima, no
Painel Administrativo é possível visualizar o nú mero de total de quartos livres em cada hotel, colocando
apenas as datas da reserva pretendida (A funçã o encontra-se no ficheiro AJAX_pesquisa_vagas.php). Esta
funçã o está dividida em duas partes. Primeiro é feita uma gestã o dos inputs idêntica à funçã o criar
reser- vas, com a exceçã o de que nã o existe um preenchimento obrigató rio de todos os campos, é
apenas neces- sá rio pelo menos a data de entrada (se a data de saída for omitida, é assumido que a
reserva tem apenas um dia). De seguida é identificada a situaçã o e pesquisa a correr a partir dos valores
recebidos. Se todos os dados forem preenchidos, a pesquisa é feita apenas por uma vaga da mesma
forma que é efetuada ao criar uma reserva. Se forem omitidos alguns campos, é apresentado uma lista
de vagas nos diferentes hotéis e tipos de quartos (com uma lista do nú mero de quartos livres, Figura
16).

Figura 16 - Visualização de vagas

3.4 O USO DE JAVASCRIPT


No website desenvolvido recorreu-se a JavaScript para desenvolver algumas funcionalidades.
Nesta secçã o ir-se-á identifica-las e explicar a sua implementaçã o.
Existem vá rias pá ginas que sã o comuns aos vá rios atores do sistema, como as três pá ginas dos ho-
téis, a pá gina “A Minha Conta” e a pá gina inicial. E no canto superior direito destas existem botõ es, com
os quais os atores interagem, que têm de ser filtrados consoante o ator, por exemplo, o visitante nã o
pode ter um botã o “A Minha Conta” ou um botã o “Terminar Sessã o” se este nã o tem uma conta,
enquanto que o cliente já pode ver estes botõ es, mas nã o pode ver o botã o “Painel Administrativo” ou o
botã o “Criar Conta”, entre outros casos.
Para fazer esta filtragem foi criada a funçã o hide_btn(), desenvolvida em JavaScript, que pode ser
visualizada na Figura 17. Esta funçã o, começa por verificar a variá vel de sessã o mail que guarda o email
da conta com sessã o iniciada, caso nã o esteja nenhuma conta ligada esta variá vel estará vazia. Com esta
verificaçã o é possível determinar se está alguma conta com sessã o iniciada, caso esteja, é necessá rio
saber que tipo de conta é, se de funcioná rio, ou de cliente. Para tal, é verificada outra variá vel de
sessã o
tipoconta, que será igual a 1 se for uma conta de cliente, e será igual a 2 se for uma conta de funcioná rio.
Sabendo estes dados, é possível escolher que botõ es esconder. Para esconder os botõ es é usado o
método document.getElementById(‘elementID’).style.display que, ao ser-lhe atribuído o valor ‘none’, irá
fazer com o que o elemento com o id ‘elementID’, nã o fique visível para o utilizador. Esta funçã o é
executada sempre que a pá gina é carregada.

Figura 17 Função hide_btn()

A pá gina “A Minha Conta”, é uma pá gina que contém algumas funcionalidades que recorrem a Ja-
vaScript para além da funçã o hide_btn(), como por exemplo a funçã o preencher_dados(). Esta, é
executada sempre que a pá gina é carregada para preencher o perfil do utilizador da conta com os dados
guardados na base de dados. Para tal, é utilizado o método document.getElementById(‘elementID’).value,
ao qual será atribuído o valor da variá vel de sessão nome, morada, contacto ou nif, dependendo do
elementID esco- lhido. As variá veis de sessã o sã o criadas quando esta pá gina é carregada. O có digo desta
funçã o pode ser visualizado na Figura 18.

Figura 18 Função preencher_dados()


Para além desta funçã o, existe mais uma desenvolvida em JavaScript, que serve para habilitar os
campos com os dados do utilizador, a funçã o fenable(). Esta, é executada quando o utilizador carregar
no botã o “Editar”, para permitir que este edite os seus dados de perfil. O estado destes inputs é alterado
recorrendo ao método document.getElementById(‘elementID’).disabled, ao qual é atribuído o valor ‘false’
para que estes sejam passem a estar editá veis.
Outra funcionalidade que recorre a JavaScript é a funçã o res_warning() que é executada sempre
que a pá gina é carregada, para que quando seja feita, ou editada, uma reserva, transmitir ao utilizador
informaçã o sobre a mesma, como por exemplo, se as datas sã o invá lidas, se faltam preencher dados ou
para transmitir que a reserva foi efetuada com sucesso. A informaçã o é recebida dos scripts que
efetuam, ou tentam efetuar, as reservas através do URL. Assim, quando é executada, esta funçã o obtém
o URL atra- vés do objeto window.location juntamente com a propriedade href. De seguida, é
identificado o valor da variá vel info, presente no URL, através da funçã o getURLParameter(info) e caso o
valor retornado por esta funçã o seja diferente de null, entã o será feito o output desse valor usando a
funçã o alert(). O có digo desta funçã o está representado na Figura 19.

Figura 19 Função res_warning()

Outra funcionalidade, para qual foi usada JavaScript pode ser visualizada ao introduzir a
password no momento da criaçã o da conta. A funçã o pass_check() é executada sempre que, quando o
campo “Pas- sword” ou o campo “Confirme a password” estiver selecionado, uma tecla do teclado for
levantada, isto é, é executada com o evento onkeyup. Esta funçã o compara os valores dos dois campos
mencionados an- teriormente e, caso estes sejam diferentes, é colocado um contorno vermelho à volta
do segundo para indicar que as passwords nã o sã o iguais e o botã o “Criar conta” é desativado para
evitar que o utilizador submeta o formulá rio. Caso os valores sejam iguais, é colocado um contorno
verde à volta do segundo campo e é ativado o botã o “Criar conta”. Os contornos sã o colocados
adicionando, e removendo, classes ao input “Confirme a password” usando os métodos
document.getElementById(‘elementID’).class- List.add(‘ClassName’) e
document.getElementById(‘elementID’).classList.remove(‘ClassName’) respetiva- mente. Sendo que a
ClassName será is-valid para o contorno verde e is-invalid para contorno vermelho, estas sã o classes do
Bootstrap.

3.5 O USO DE AJAX


Na pá gina “Painel Administrativo”, acessível aos funcioná rios, recorreu-se a AJAX para implemen-
tar algumas funcionalidades de pesquisa.
Um exemplo dessas funcionalidades é visível na tab “Clientes”, na qual o funcioná rio pode inserir
o email do cliente e ao carregar no botã o “Pesquisar”, os campos presentes nesta tab serã o preenchidos
com os dados do cliente sem que a pá gina seja recarregada. Na Figura 20 pode ser visualizado a funçã o
pesquisa_dados_cliente() responsá vel por efetuar o pedido HTTP.
Figura 20 Função pesquisa_dados_cliente()

Esta funçã o recebe o email do cliente, que será enviado para o ficheiro
AJAX_pesquisa_dados_clientes.php através do método GET. Neste ficheiro, será feita a pesquisa dos dados
e depois será feito echo de uma string formada por estes dados separados por vírgulas. Esta string será
recebida na funçã o pesquisa_dados_cliente()que a irá dividir em novas strings usando as vírgulas como
referência para determinar o inicio e o fim dos dados. A receçã o da resposta do ficheiro php é
assinalada pela propriedade readystate, esta quando for igual a 4 significa que o pedido terminou e a
resposta está pronta. De seguida, estes dados sã o colocados nos campos através do método
document.getElemen- tById(‘elementID’).value.

Uma outra funcionalidade que recorre a AJAX encontra-se na segunda tab, “Editar Reservas”.
Nesta, o funcioná rio pode introduzir o email do cliente, ou o nú mero de uma reserva, e apó s carregar no
botã o “Pesquisar” irá ser apresentada uma tabela com todas as reservas do cliente, ou com a reserva
inserida. A implementaçã o desta funcionalidade é parecida com a anterior, mudando apenas alguns
aspetos. A funçã o, pesquisa_reservas(), na qual será feito o pedido HTTP, irá receber dois parâmetros, o
valor do campo de inserçã o do email e o valor do campo de inserçã o do nú mero da reserva. Um destes
campos estará vazio assim, é verificado qual dos valores nã o é igual a null para que seja enviado para o
ficheiro AJAX_pesquisa_reservas.php através do método GET. Neste ficheiro, é efetuada a pesquisa na
base de da- dos e é feito echo da tabela com os resultados da pesquisa. Este será recebido na funçã o
pesquisa_reser- vas() que irá coloca-lo na tag p com o id table_reservas.
Uma terceira funcionalidade que usa AJAX é visível na terceira tab do painel administrativo,
“Visu- alizar vagas”. Nesta, o funcioná rio introduz dados como o hotel, a data de entrada, a data de saída
e o tipo de quarto, sendo necessá rio preencher pelo menos as datas, e é informado sobre o nú mero de
quartos disponíveis de cada tipo em cada hotel. Para implementar tal funcionalidade, os dados inseridos
pelo funcioná rio sã o enviados para a funçã o pesquisar_vagas(). Esta, começa por determinar os radio
buttons selecionados através de dois ciclos for, um para os radio buttons referentes ao hotel e outro para
os de seleçã o do tipo de quarto. Tal como nas funçõ es anteriores é feito um pedido HTTP, neste caso
para o ficheiro AJAX_pesquisa_vagas.php que irá receber os parâmetros do formulá rio através do
método GET. Neste ficheiro serã o feitas pesquisas na base de dados para determinar quais as vagas
disponíveis de acordo com os dados inseridos e irá fazer echo da informaçã o a mostrar ao funcioná rio,
que será recebida na funçã o pesquisar_vagas() que irá escrevê-la na tag p com o id table_vagas.
27 Modelaçã o e Simulaçã o de Sistemas

4 MANUAL DE UTILIZAÇÃO

4.1 PÁGINA PRINCIPAL


A pá gina dos Hotéis Luso pode ter três tipos de utilizadores, ou seja, o visitante, o cliente e o
funci- oná rio. O primeiro apenas pode visualizar informaçõ es dos hotéis do grupo (Porto, Lisboa e
Algarve), nã o podendo realizar qualquer tipo de operaçõ es, como por exemplo reservas. A Figura 21
ilustra a pá gina inicial do website, sendo esta a pá gina que o visitante começa por visualizar.

Figura 21 Página inicial do website

Pá gina 27 de 33
4.2 CRIAR CONTA/INICIAR SESSÃO
Para o visitante criar conta de cliente este terá de clicar em “Criar Conta/Iniciar Sessã o”, onde terá
acesso à pá gina da Figura 22. De seguida terá de preencher o formulá rio “Criar Conta”, sendo o nome,
email e password de preenchimento obrigató rio e a morada, contacto e NIF de cará ter opcional. Depois
de criada a conta, o já cliente (pois já tem conta criada), pode fazer login na pá gina, podendo deste modo
realizar as mais variadas operaçõ es disponíveis para clientes.

Figura 22 Criar Conta e Iniciar Sessão

4.3 CLIENTE VISUALIZA E EDITA A SUA CONTA E RESERVAS


Depois de iniciada a sessã o, o cliente é redirecionado para a pá gina principal. Esta surge agora com alte-
raçõ es na barra de navegaçã o, podendo aceder “A Minha Conta” ou “Terminar Sessã o”. Em “A Minha
Conta” o cliente pode visualizar o seu perfil e editá-lo, bastando clicar em “Editar” e atualizar os dados
pretendidos, carregando no final em “Guardar” para serem guardadas as atualizaçõ es, tal como é
possível observar na Figura 23.

Figura 23 Visualizar e alterar perfil de cliente

Dentro do “A minha conta” o cliente pode ainda visualizar, editar ou eliminar as suas reservas, clicando
em “Reservas”, acedendo à pá gina da Figura 24. Para o cliente eliminar a sua reserva basta clicar em
“Eliminar” na reserva que pretende excluir.
Figura 24 Visualizar, editar e eliminar reservas

Para editar as suas reservas o cliente deve clicar na em “Editar” na reserva que pretende modificar,
acendo à janela da Figura 25. Nesta janela o cliente poderá variar todos os parâ metros da sua reserva,
ou seja, o hotel, tipo de quarto e data de entrada e saída.

Figura 25 Editar reservas

4.4 CLIENTE FAZ


RESERVAS
Para o cliente efetuar reservas dever primeiramente aceder à pá gina do hotel desejado (Porto, Lisboa
ou Algarve), acedendo por exemplo à pá gina da Figura 26. Nesta pá gina o cliente poderá selecionar o
tipo de quarto (Individual, Duplo e Familiar) e data de entrada e saída, clicando no final em “Reservar”.

Figura 26 Efetuar Reservas


4.5 FUNCIONÁRIO VISUALIZA/EDITA DADOS E RESERVAS DE CLIENTES
Um funcioná rio do hotel poderá aceder e editar os dados dos clientes (a pedido dos mesmos), para tal
terá de iniciar sessão com um email que se encontre guardado na tabela de funcioná rios da base de
dados. Depois de iniciar sessã o como funcioná rio, o utilizador irá ser redirecionado para a pá gina
principal, so- frendo a barra de navegaçã o alteraçõ es, ou seja, poderá aceder à “A Minha Conta” tal como
os clientes, onde poderá visualizar e editar a conta de funcioná rio, pode aceder ao “Painel
Administrativo” e “Termi- nar Sessã o”
No “Painel Administrativo” o funcioná rio poderá visualizar e editar os dados dos clientes, bastando
entrar na á rea “Clientes” e introduzir o email do cliente, clicando de seguida em “Pesquisar”. Depois de
introdu- zido o email do cliente o funcioná rio visualizará um formulá rio já preenchido com os dados
desse cliente, tal como o demonstrado na Figura 27, podendo editá -los clicando em “Editar” e atualizar
os dados pre- tendidos. Para as alteraçõ es serem realizadas no final o utilizador deve clicar em
“Guardar”.

Figura 27 Funcionário visualiza/edita dados de clientes

Uma outra funcionalidade que o funcioná rio tem disponível é poder visualizar, editar ou eliminar uma
reserva do cliente, bastando para tal aceder ao “Painel Administrativo” na á rea “Editar Reservas”. Aqui
o funcioná rio poderá fazer uma pesquisa por cliente, preenchendo o campo “Email do cliente”, ou por
nú - mero de reserva, preenchendo o campo “Nú mero de reserva”, clicando no final em “Pesquisar”, tal
como o demonstrado na Figura 28. Despois de efetuada a pesquisa o funcioná rio poderá editar a
reserva do cliente, clicando em “Editar”, abrindo uma nova janela onde poderá fazer a atualizaçã o dos
dados. O fun- cioná rio poderá ainda eliminar um ou vá rias reservas do cliente, clicando em “Eliminar”
Figura 28 Funcionário visualiza, edita ou elimina reserva de cliente

4.6 FUNCIONÁRIO VISUALIZA VAGAS


O funcioná rio tem ainda uma outra funcionalidade, ou seja, poder visualizar as vagas de um
determinado quarto (Individual, Duplo ou Familiar) de um dos hotéis do grupo, para uma data de
entrada e saída a indicar. Para tal, o funcioná rio deve entrar no “Painel Administrativo” e selecionar a
á rea “Visualizaçã o de Vagas”. Aqui vai aceder à janela apresentada na Figura 29, onde poderá selecionar
o hotel, a data de entrada e saída e o tipo de quarto, clicando no final em “Pesquisar”. No final será
apresenta uma mensa- gem que indicará se existem ou nã o vagas.

Figura 29 Visualização de vagas


33 Modelaçã o e Simulaçã o de Sistemas

5 CONCLUSÃO
Concluído este trabalho verifica-se que os objetivos principais foram cumpridos, e, portanto, a pá gina
web desenvolvida permite aos utilizadores (visitantes, clientes e funcioná rio) efetuar as operaçõ es
prin- cipais que se pretende num sistema de gestã o de reservas de hotéis, permitindo ao visitante ter
acesso à s informaçõ es dos hotéis, o cliente efetuar reservas e editá -las e ao funcioná rio visualizar,
controlar e editar reservas de todo o grupo de hotéis. O sistema desenvolvido é assim um sistema
versá til que pode- ria ser aplicado a um grupo de hotéis real, embora houvessem pormenores que
poderiam ser melhorados, como por exemplo, o funcioná rio poder efetuar reservas, uma demonstraçã o
mais ilustrativa do estado de ocupaçã o dos hotéis a curto e longo prazo, entre outros possíveis
melhoramentos.
Este trabalho permitiu aprofundar conhecimentos de base de dados, linguagens de programaçã o como
PHP, Java Script, Ajax, SQL, CSS e HTML, sendo por isso um contributo positivo para os elementos do
grupo.

Referências Bibliográficas

...

Pá gina 33 de 33

Você também pode gostar