Добавлен: 11.03.2024
Просмотров: 50
Скачиваний: 0
СОДЕРЖАНИЕ
1.4 Программное обеспечение веб-сервера
2.1.1. Анализ пользовательской аудитории
2.1.3. Структура страницы сайта
2.1.4. Логическая структура сайта
3 РАЗРАБОТКА СТРУКТУРЫ БАЗЫ ДАННЫХ
4 ОПИСАНИЕ СТРУКТУРЫ КЛИЕНСКОЙ ЧАСТИ
4.1 Описание интерфейса «Обычный пользователь»
База данных под названием shop имеет таблицы:
1) category
2) product
3) product order
4) user
Структура таблицы category приведена на рис. 2.
Рис. 2 – Структура таблицы category
Содержимое таблицы category приведена на рис. 3.
Рис. 3 – Содержимое таблицы category
Структура таблицы product приведена на рис.4.
Рис. 4 – Структура таблицы product
Содержимое таблицы product приведено на рис. 5.
Рис. 5 – Содержимое таблицы product
Структура таблицы product_order приведена на рис.6.
Рис. 6 – Структура таблицы product_order
Содержимое таблицы product_order приведена на рис. 7.
Рис. 7 – Содержимое таблицы product_order
Структура таблицы user приведена на рис.8.
Рис. 8 – Структура таблицы user
Содержимое таблицы user приведено на рис. 9.
Рис. 9 – Содержимое таблицы user
4 ОПИСАНИЕ СТРУКТУРЫ КЛИЕНСКОЙ ЧАСТИ
4.1 Описание интерфейса «Обычный пользователь»
Начало работы начинается с главной страницы сайта (Рисунок 10).
Рисунок 10 – Главная страница сайта
Для получения доступа к функционалу пользователя, необходимо воспользоваться кнопкой Вход, которая направит пользователя на форму запроса данных для входа в систему. (Рисунок 11)
Рисунок 11 – Меню пользователя
Появившийся новый пункт “Редактировать”, служит для просмотра имени, изменения пароля в системе. Пункт “Список покупок”, служит для просмотра истории покупок. Для завершения работы необходимо использовать кнопку Выход.
4.2 Описание интерфейса «Администратор»
Если воспользоваться входом в систему под аккаунтом администратора меню системы примет следующий вид (Рисунок 12).
Рисунок 12 – Меню администратора
В данном виде меню появилось несколько пунктов: Управление товарами, управление категориями, управление заказами. При помощи этих пунктов администратор системы имеет возможность вносить изменения в справочники системы.
Рисунок 13 – Управление товарами
В данном пункте мы можем полностью изменять информацию о товарах. (Рисунок 13).
Пример работы с одним из товаров приведен на рисунке (Рисунок 14).
Рисунок 14 – Изменение информации о товаре
Рисунок 15 – Управление категориями
Позволяет изменять название категории на главной странице, изменять порядковый новый и отображать/скрывать подпункты меню.
Пример одной из категории приведен на рисунке (рисунок 16)
Рисунок 16 – Настройка категории
4.3 Инструкция пользователя
Для входа в систему служит кнопка Вход, после чего откроется пункт авторизации (Рисунок 18).
Рисунок 18 – Меню авторизации пользователя.
Для зарегистрированных пользователей доступна возможность редактирования данных и список покупок. (Рисунок 19).
Рисунок 19 – Просмотр информации для авторизованных пользователей.
Рисунок 20 – Редактирование данных.
Данная система позволяет изменить свое имя и пароль.
Для незарегистрированных пользователей служит кнопка Регистрация, после чего откроется пункт регистрации. (Рисунок 21).
Рисунок 21 – Регистрация пользователя.
ЗАКЛЮЧЕНИЕ
Результатом курсовой работы стало создание информационной системы. Она имеет интуитивно-понятный и дружелюбный интерфейс и функционал.
В процессе выполнения работы была создана база данных, с применением среды MySQL. Реализация проекта велась с применением языков CSS, HTML, PHP, а также м использованием языка SQL запросов для обращения и изменения информации в связанной базе данных системы.
Во время работы над данным курсовым проектом были решены следующие задачи:
- Была поставлена и изучена предметная область;
- Спроектирована структура сайта;
- Создан многостраничный веб-сайт;
- Разработана база данных.
Возможные недостатки и доработки сайта на перспективу:
1) Все фото на сайте одного размера – предусмотреть отображение разных размеров.
2) В карточке товара сделать хороший просмотр фото.
3) Сделать поиск товаров.
4) Реализовать блог (разработать БД, модель, контроллер, вью, работа с другими частями приложения).
5) Админка для администратора (добавить блог).
6) Улучшить интерактивность при наведении на товар (css/html).
СПИСОК ЛИТЕРАТУРЫ
- Дакетт, Джон HTML и CSS. Разработка и дизайн веб-сайтов) / Джон Дакетт. - Москва: Наука, 2017. - 480 c. ISBN 978-5-699-64193-2
- Вадим Дунаев. HTML, скрипты и стили. BHV, Санкт-Петербург, 2015. ISBN 978-5-9775-3317-1.
- Н. Закас, Джереми Мак-Пик, Джо Фосетт. Ajax для профессионалов. Перевод: Александр Киселев. Символ, Санкт-Петербург, 2015. ISBN 978 5 93286-081-6.
- Дронов, В. HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов / В. Дронов. - М.: БХВ-Петербург, 2011. - 416 c. ISBN 978-5-9775-0596-3.
- Adobe Dreamweaver CS6. Официальный учебный курс. Эксмо, Москва, 2014. ISBN 978-5-699-69655-0.
- Чои Вин. Как спроектировать современный сайт. Питер, Санкт-Петербург, 2011. ISBN 978-5-459-00579-0.
- А. Годин, К. Джонсон, К. Уоррен, М. Уэбер, Брайан Хоган. Книга веб-программиста: секреты профессиональной разработки веб-сайтов. Питер, Санкт-Петербург, 2013. ISBN 978-5-459-01510-2.
- Кирилл Сухов. HTML 5. Путеводитель по технологии. ДМК, Москва, 2013. ISBN 978-5-94074-910-3.
- Алан Купер, Дэйв Кронин, Кристофер Носсел, Роберт Рейман. Алан Купер об интерфейсе. Основы проектирования взаимодействия. Символ, Санкт-Петербург, 2015. ISBN 978-5-93286-132-5
- Дронов, Владимир JavaScript и AJAX в Web-дизайне / Владимир Дронов. - Москва: Высшая школа, 2012. - 736 c. ISBN 978-5-9775-0251-1
ПРИЛОЖЕНИЯ
<?php
declare(strict_types = 1);
// FRONT CONTROLLER
// 1. Общие настройки
ini_set('display_errors','1');
error_reporting(E_ALL);
session_start();
// 2. Подключение файлов системы
define('ROOT', dirname(__FILE__));
//include_once (ROOT.'/models/Product.php');
//require_once(ROOT.'/components/Router.php');
//require_once(ROOT.'/components/Db.php');
require_once(ROOT.'/components/Autoload.php');
// 4. Вызов Router
$router = new Router();
$router->run();
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>Главная</title>
<link href="/template/css/bootstrap.min.css" rel="stylesheet">
<link href="/template/css/font-awesome.min.css" rel="stylesheet">
<link href="/template/css/prettyPhoto.css" rel="stylesheet">
<link href="/template/css/price-range.css" rel="stylesheet">
<link href="/template/css/animate.css" rel="stylesheet">
<link href="/template/css/main.css" rel="stylesheet">
<link href="/template/css/responsive.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
<link rel="shortcut icon" href="/template/images/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144"
href="/template/images/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114"
href="/template/images/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72"
href="/template/images/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="/template/images/ico/apple-touch-icon-57-precomposed.png">
</head><!--/head-->
<body>
<header id="header"><!--header-->
<?php if (isset($isAdmin) && $isAdmin == true ):?>
<a href="/admin/" class="adminPanel">Перейти в админ панель</a>
<?php endif;?>
<div class="header_top"><!--header_top-->
<div class="container">
<div class="row">
<div class="col-sm-6">
<div class="contactinfo">
<ul class="nav nav-pills">
<li><a href="#"><i class="fa fa-phone"></i> +71234567890</a></li>
<li><a href="#"><i class="fa fa-envelope"></i> Gilev@yandex.ru</a></li>
</ul>
</div>
</div>
<div class="col-sm-6">
<div class="social-icons pull-right">
<ul class="nav navbar-nav">
<li><a href="#"><i class="fa fa-facebook"></i></a></li>
<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</div><!--/header_top-->
<div class="header-middle"><!--header-middle-->
<div class="container">
<div class="row">
<div class="col-sm-4">
<div class="logo pull-left">
<a href="index.html"><img src="/template/images/home/logo.png" alt=""/></a>
</div>
</div>
<div class="col-sm-8">
<div class="shop-menu pull-right">
<ul class="nav navbar-nav">
<li>
<a href="/cart/"><i class="fa fa-shopping-cart"></i> Корзина
(<span id="cart-count"><?php echo UserCart::countItems(); ?></span>)</a>
</li>
<?php if (User::isGuest()): ?>
<li><a href="/user/login/"><i class="fa fa-lock"></i> Вход</a></li>
<?php else: ?>
<li><a href="/cabinet/"><i class="fa fa-user"></i> Аккаунт</a></li>
<li><a href="/user/logout/"><i class="fa fa-unlock"></i> Выход</a></li>
<?php endif; ?>
<!-- <li><a href="/cabinet/"><i class="fa fa-user"></i> Аккаунт</a></li>-->
<!-- <li><a href="/user/login"><i class="fa fa-lock"></i> Вход</a></li>-->
<!-- <li><a href="/user/logout/"><i class="fa fa-unlock"></i> Выход</a></li>-->
</ul>
</div>
</div>
</div>
</div>
</div><!--/header-middle-->
<div class="header-bottom"><!--header-bottom-->
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="mainmenu pull-left">
<ul class="nav navbar-nav collapse navbar-collapse">
<li><a href="/">Главная</a></li>
<li class="dropdown"><a href="#">Магазин<i class="fa fa-angle-down"></i></a>
<ul role="menu" class="sub-menu">
<li><a href="/catalog/">Каталог товаров</a></li>
<li><a href="/cart/">Корзина</a></li>
</ul>
</li>
<li><a href="/contacts/">Контакты</a></li>
</ul>
</div>
</div>
</div>
</div>
</div><!--/header-bottom-->
</header><!--/header-->
<script src="/template/js/jquery.js"></script>
<script src="/template/js/bootstrap.min.js"></script>
<script src="/template/js/jquery.scrollUp.min.js"></script>
<script src="/template/js/price-range.js"></script>
<script src="/template/js/jquery.prettyPhoto.js"></script>
<script src="/template/js/main.js"></script>
<script>
$(document).ready(function(){
// $(".item").first().addClass("active");
$(".add-to-cart").click(function () {
// alert('Товар добавлен');
var id = $(this).attr("data-id");
$.post("/cart/addAjax/"+id, {}, function (data) {
$("#cart-count").html(data);
});
return false;
});
});
</script>
<script src="/template/js/addToCart.js"></script>
</body>
</html>
<?php include ROOT . '/views/layouts/header.php'; ?>
<section>
<div class="container">
<div class="row">
<div class="col-sm-4 col-sm-offset-4 padding-right">
<?php if (isset($errors) && is_array($errors)): ?>
<ul>
<?php foreach ($errors as $error): ?>
<li> - <?php echo $error; ?></li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
<div class="signup-form"><!--sign up form-->
<h2>Вход на сайт</h2>
<form action="#" method="post">
<input type="email" name="email" placeholder="E-mail" value="<?php echo $email; ?>"/>
<input type="password" name="password" placeholder="Пароль" value="<?php echo $password; ?>"/>
<input type="submit" name="submit" class="btn btn-default" value="Вход" />
</form>