HUFERSIL.WEBDEVELOPER

Criando um catálogo de produtos com Lumine e CodeIgniter – Parte 3

Hoje veremos:

  • Como organizar nossos diretórios
  • Criar uma tela de login para a parte administrativa

Como organizar nossos diretórios

Nesta aplicação, iremos criar uma área administrativa e uma área publica.

A parte administrativa, iremos chamar de admin. A pública, de site.

Tudo que está dentro da pasta “application” não poderá ser acessado externamente quando o sistema estiver em produção. Portanto, as imagens, arquivos CSS e JavaScript deverão estar fora da pasta “application”. Então, criaremos uma pasta para podermos armazenar estes tipos de arquivo.

Tendo isto em mente, crie a seguinte estrutura de diretórios:

  • c:\www\vitrine\assets
  • c:\www\vitrine\assets\css
  • c:\www\vitrine\assets\imagens
  • c:\www\vitrine\assets\js
  • c:\www\vitrine\application\views\admin
  • c:\www\vitrine\application\views\site

Para cada controller criada, seja administativa ou pública, iremos também criar um diretório na área correspondente para podermos armazenar as visualizações de comportamento. Cada método dentro de uma controller é um comportamento, e ficará extremamente mais simples de manter o sistema se criarmos um arquivo view para cada método.

Seguindo esta linha de raciocínio, criaremos mais um diretório:

  • c:\www\vitrine\application\views\admin\login

Como podemos ver facilmente, este diretório armazenará os arquivos de visualização da controller “login” da parte administrativa.

Para facilitarmos o desenvolvimento, vamos criar um “template principal” para a parte administrativa. As visualizações de comportamento de cada método serão, na verdade, trechos menores que irão ser incorporados dentro do template principal. Em outras palavras, vamos fazer um “include” do trecho a ser visualizado dentro do template principal. Este template principal já terá as partes mais importantes, como topo, rodapé, menu principal de navegação, etc. As visualizações terão somente o “miolo”, que serão incorporadas ao template.

Antes de criarmos o template, abaixo o arquivo CSS usado para o admin. Salve o arquivo em assets/css/admin.css

@CHARSET "UTF-8";
/*************************************/
/* Tela de Login
/*************************************/
* {
	margin: 0px;
	padding: 0px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	font-style: normal;
}
.login-box {
	margin-top: 200px;
	width: 450px;
	margin-left: auto;
	margin-right: auto;
	border: 1px solid #999999;
	padding: 5px;
	border-radius: 5px;
}
.login-box p {
	clear: both;
	padding-bottom: 5px;
}
.login-box label {
	display: block;
	float: left;
	width: 120px;
	padding-top: 2px;
	padding-right: 10px;
	text-align: right;
}
.login-box #btnLogin {
	margin-left: 160px;
	padding: 4px;
}
.login-box h1 {
	border-radius: 5px;
	font-size: 14px;
	font-weight: bold;
	color: #555555;
	margin-bottom: 10px;
	background-color: #EFEFEF;
	padding: 4px 4px 4px 25px;
	background-image: url("http://www.iconfinder.com/ajax/download/png/?id=36090&s=16");
	background-position: 3px center;
	background-repeat: no-repeat;
}
.login-box .erro{
	padding: 4px;
	background-color: #FFFF55;
	color: #FF0000;
	font-weight: bold;
	margin-bottom: 10px;
}

Nosso arquivo de template por enquanto será bem simples, para poder facilitar nossos estudos. Vamos criar uma estrutura básica e fazer a verificação de existência do arquivo que será incluido. Salve este arquivo em application/views/admin/template.php:

	<!DOCTYPE html>
	<html>
	<head>
		<title>Sistema de Gerenciamento de Conteudo</title>
		<meta charset="UTF-8" />

		<link rel="stylesheet" type="text/css"  href="<?php echo base_url('assets/css/admin.css'); ?>" />

	</head>
	<body>

	<?php
	// o arquivo de template a ser incluido foi informado?
	if(!empty($_template)){
		// procuramos ele a partir deste arquivo
		$_template = dirname(__FILE__) . '/' . $_template;
		// se existir, fazemos o include
		if(file_exists($_template)){
			include $_template;

		// se nao existir, enviamos uma mensagem
		} else {
			echo 'Template "', $_template, '" não existe!';
		}

	// se nao informou, enviamos uma mensagem
	} else {
		echo 'Template nao informado!';
	}
	?>

	</body>
	</html>

Pronto! Agora nossas visualizações de comportamento (views) da área administrativa serão bem mais simples!

Vamos agora criar nossa visualização da tela de login. Salve o arquivo em application/views/admin/login/index.php

<form action="<?php echo site_url('admin/login/do_login'); ?>" method="post">
	<div class="login-box">
		<h1>Efetue seu login</h1>
		<?php
		// pegando o segmento de informacao na URL
		switch($this->uri->segment(4)){
			case 'informe_seus_dados':
				echo '<div class="erro">Usuário ou senha em branco</div>';
			break;
			case 'usuario_nao_encontrado':
				echo '<div class="erro">Nenhum usuário encontrado com as credenciais informadas</div>';
			break;
		}
		?>
		<p>
			<label for="email">E-mail</label>
			<input type="email" value="" id="email" name="email" />
		</p>
		<p>
			<label for="senha">Senha</label>
			<input type="password" value="" id="senha" name="senha" />
		</p>

		<input type="submit" value="Efetuar Login" id="btnLogin" name="btnLogin" />
	</div>
</form>

Note que para este arquivo fizemos somente o formulário de login sem a necessidade de outras informações, como topo, rodapé, etc, pois estas informações já estão no arquivo template.php. Bem mais simples, não?.

Agora que já criamos nosso arquivo de visualização principal (template.php) e login (login/index.php), vamos criar nossa controller para podermos fazer o login no sistema.

Para isso, crie uma controller chamada login.php com o conteúdo abaixo:

<?php
/**
* Controller para efetuar o login e logout do sistema administrativo.
*
* @author Hugo Ferreira da Silva
* @link http://www.hufersil.com.br
*
*/
class Login extends AdminController {
	/**
	 * Carrega a visualização de login
	 *
	 * @author Hugo Ferreira da Silva
	 */
	public function index(){
		$this->display('login/index');
	}

	/**
	 * Efetua a validação do usuário no sistema e efetua o login do mesmo.
	 *
	 * Caso as credenciais estejam corretas, gravamos as informações de login
	 * na sessão.
	 *
	 * @author Hugo Ferreira da Silva
	 */
	public function do_login(){
		// nova instancia de usuario
		$user = new Usuario();

		// pegamos as informações do formulario.
		$user->email = $this->input->post('email');
		$user->senha = $this->input->post('senha');

		// se uma informação ficou em branco,
		// redirecionamos para a tela de login
		if(empty($user->email) || empty($user->senha)){
			redirect('admin/login/index/informe_seus_dados');
		}

		// colocamos a senha em md5
		$user->senha = md5($user->senha);

		// faz a consulta obtendo o numero de resultados
		$total = $user->find(true);

		// se não encontrou nada
		if( $total == 0 ){
			redirect('admin/login/index/usuario_nao_encontrado');
		}

		// se encontrou, colocamos os dados do usuario na sessão
		$_SESSION['usuario'] = $user->toArray();

		// redirecionamos o usuario para a tela de produtos.
		redirect('admin/produtos/index');
	}

	/**
	 * Efetua o logout do usuario
	 *
	 * Limpa os dados da seção e envia o usuário para a tela de login
	 *
	 * @author Hugo Ferreira da Silva
	 */
	public function do_logout(){
		$_SESSION = array();
		redirect('admin/login/index');
	}
}

Salve este arquivo como application/controllers/admin/login.php

Se tudo foi seguido corretamente, ao acessar a URL http://localhost/vitrine/admin/login/index você deverá ver a tela abaixo:

Para praticar, tente fazer a controller de produtos com um método index e uma visualização simples.

Na próxima matéria vamos fazer a controller de usuários.

@braços e fiquem com Deus!

7 Responses to “Criando um catálogo de produtos com Lumine e CodeIgniter – Parte 3”

  • Pedro Wallauschek diz:

    Todos os passos feitos e refeitos e está dando o erro:
    Erro interno do Servidor!

    O servidor encontrou um erro interno e não foi possível completar sua requisição. O servidor está sobrecarregado ou existe um erro em um script CGI.

    não sei mais oq fazer pra passar desse ponto do tutorial.

  • Pedro Wallauschek diz:

    encontrei, o erro está no seu .htaccess, tem q apagar o lixo html q rentrou junto ” “

  • Corrigindo
    Ola Sr. Hugo acompanhando o seu tutorial, na parte 3 (treis0 da o seguinte erro:
    404 Page Not Found
    The page you requested was not found.
    O que será que deu errado.

  • Eduardo Assis diz:

    Eu também estou com o mesmo erro que o Vantuir de Souza postou acima:
    404 Page Not Found
    The page you requested was not found.

    Alguém poderia nos ajudar?

  • kazumy diz:

    Olá Hugo, estou seguindo o seu tutorial e não estou conseguindo efetuar o login. Retorna “Nenhum usuário encontrado com as credenciais informadas”.

    Adicionei novo usuário, e-mail e senha na tabela usuário e continuo sem acesso. Tem alguma ideia do que pode estar acontecendo?
    Obrigado e parabéns pelo tutorial.

  • Alisson diz:

    Olá, Hugo.
    Estou tentando acompanhar seu tutorial, mas não consigo sair desta parte. O navegador retorna um erro 404:

    Objeto não encontrado!

    A URL requisitada não foi encontrada neste servidor. Se você digitou o endereço (URL) manualmente, por favor verifique novamente a sintaxe do endereço.

    Se você acredita ter encontrado um problema no servidor, por favor entre em contato com o webmaster.

    Pode me ajudar?

Deixar uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *

*

Pode usar estas etiquetas HTML e atributos: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">