موقع شكايات ب php و mysql الجزء الخامس والأخير
نظرة سريعة بالفيديو
1- الملف add-admin.php
<?php
require('header.php');
?>
<article>
<main class="container">
<div class="add-plainte">
<h1 class="head-one">
Ajouter un admin
</h1>
<div>
<?php
if(isset($_POST['submit'])){
$query = new Query();
$code = $query->makeCode();
$values = array(
'fullname' => $database->escape_string($_POST['name']),
'email' => $database->escape_string( $_POST['email']),
'password' => sha1($code)
);
if($query->insert_admin($values)){
echo '<div class="container alert-success">Admin ajouté avec succés gardez votre mot de passe <span class="code">'.$code.'</span></div>';
}else{
echo '<div class="container alert-danger">Une erreur est survenue réessayer plutard!</div>';
}
}
?>
<form method="post" action="add-admin.php">
<div class="form-group">
<label for="name" sr-only="">Nom & Prénom*
</label>
<input type="text" name="name" placeholder="Nom & Prénom" required="" class="form-control">
</div>
<div class="form-group">
<label for="email" sr-only="">Email*
</label>
<input type="email" name="email" required="" placeholder="email" class="form-control">
</div>
<div class="form-group">
<input type="submit" name="submit" class="btn-primary" value="Valider">
</div>
</form>
</div>
</div>
</main>
</article>
<?php require('footer.php');?>
2- الملف log-admin.php
<?php
require('header.php');
?>
<article>
<main class="container">
<div class="add-plainte">
<h1 class="head-one">
Connexion
</h1>
<div>
<?php
if(isset($_POST['submit'])){
$query = new Query();
$password = $database->escape_string($_POST['passe']);
$email = $database->escape_string( $_POST['email']);
if($query->auth($password,$email)){
$query->redirect('admin.php');
}else{
echo '<div class="container alert-danger">Email ou mot de passe est incorrect !</div>';
}
}
?>
<form method="post" action="log-admin.php">
<div class="form-group">
<label for="email" sr-only="">Email*
</label>
<input type="email" name="email" required="" placeholder="email" class="form-control">
</div>
<div class="form-group">
<label for="password" sr-only="">Passe*
</label>
<input type="password" name="passe" required="" placeholder="Mot de passe" class="form-control">
</div>
<div class="form-group">
<input type="submit" name="submit" class="btn-primary" value="Valider">
</div>
</form>
</div>
</div>
</main>
</article>
<?php require('footer.php');?>
3- الملف logout.php
<?php
require('database/Query.php');
$query = new Query($id);
$query->logout();
?>
4- الملف header.php
<?php
require('database/Query.php');?>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Chikaya.com</title>
</head>
<body>
<header>
<nav class="container">
<ul class="navbar">
<li>
<a href="index.php">Accueil</a>
</li>
<li>
<a href="contact-us.php">Contact</a>
</li>
<li>
<a href="about-us.php">Qui sommes-nous?</a>
</li>
<?php if(isset($_SESSION['admin_id']) && $_SESSION['admin'] == true):?>
<li>
<a href="admin.php">Admin</a>
</li>
<li>
<a href="logout.php">Déconnexion</a>
</li>
<?php endif;?>
</ul>
</nav>
</header>
5- الملف style.css
فالملف style.css كنزيد تعديلات اخرى خاصة ب les pages لي زدنا ولي غادي تضيف تغييرات عليهم الكود ديال الملف بعد التعديل هو :
html{
font-family:Verdana, Geneva, Tahoma, sans-serif;
background-color: #ecf0f1;
padding: 0;
margin: 0;
box-sizing: border-box;
font-size: 20px;
}
.container {
width: 1110px;
margin: 0 auto;
}
header{
background-color: #27ae60;
margin-top:-14px;
}
ul.navbar{
list-style: none;
}
ul.navbar li{
display: inline-block;
padding: 15px;
margin-right: 10px;
border-radius: 3px;
}
ul.navbar li a{
text-decoration: none;
color: #fff;
border-radius: 10px;
font-size: 20px;
padding: 10px;
}
ul.navbar li:hover{
background-color: #0b7738;
color: #fff;
}
div.plainte{
background-color: #fff;
border: 1px solid rgb(177, 170, 170);
padding: 10px;
}
div.add-plainte{
background-color: #fff;
border: 1px solid rgb(177, 170, 170);
padding: 10px;
width: 40%;
margin-left: 350px;
margin-bottom: 10px;
}
.head-one{
font-size: 25px;
font-weight: 400;
padding: 10px;
margin-top: -1px;
border-radius: 3px;
color: #fff;
background-color: #27ae60;
}
.btn-primary{
background-color: #27ae60;
color: #fff;
padding: 10px;
border: none;
font-size: 15px;
cursor: pointer;
box-shadow: 2px #000;
border-radius: 5px;
}
.btn-primary:hover{
background-color: #0a8a3f;
}
ul.forms{
list-style: none;
}
ul.forms li{
display: inline-block;
margin-right: 10px;
}
form input,label{
display: block;
margin-bottom: 10px;
}
label{
font-size: 18px;
color: #27ae60;
}
.form-control{
border: solid 1px #c9C9C9;
padding: 10px;
margin: 0 0 10px 0;
width: 300px;
font-size: 20px;
}
form{
margin: 0 0 10px 60px;
}
.alert-success{
color: #fff;
background-color: #599773;
padding: 10px;
border-radius: 5px;
margin-bottom: 10px;
width: 60%;
line-height: 40px;
}
.alert-danger{
color: #fff;
background-color: #a82514;
padding: 10px;
border-radius: 5px;
margin-bottom: 10px;
width: 60%;
}
.alert-info{
color: #fff;
background-color: #5563df;
padding: 10px;
border-radius: 5px;
margin-bottom: 10px;
width: 60%;
}
.code{
background-color: #fff;
color: #599773;
padding: 5px;
border-radius: 5px;
}
.center{
text-align: center;
font-size: 20px;
font-weight: 700;
color: #0b7738;
}
.table{
background-color: #fff;
width: 50%;
}
th{
color: #27ae60;
font-weight: bold;
}
th,
td{
border: 2px dashed rgb(116, 43, 43);
padding: 5px;
font-size: 70%;
text-align: center;
}
h2{
text-align: center;
background-color: #fff;
width: 60%;
margin: 0 auto;
margin-bottom: 20px;
padding: 10px;
color: #27ae60;
text-transform: uppercase;
font-weight: 300;
border-radius: 5px;
}
a{
text-decoration: none;
}
a.trash:after{
content:'\f1f8';
color:rgb(97, 7, 7);
font-size: 100%;
font-family: 'FontAwesome';
margin-right: 5px;
}
a.edit:after{
content:'\f040';
color:rgb(247, 144, 10);
font-size: 100%;
font-family: 'FontAwesome';
}
.status .success{
background: #018543;
color: #fff;
padding:5px;
border-radius: 5px;
}
.status .failed{
background: #a82514;
color: #fff;
padding:5px;
border-radius: 5px;
}
.status .info{
background: #040274;
color: #fff;
padding:5px;
border-radius: 5px;
}