Вы находитесь на странице: 1из 118

МИНИСТЕРСТВО ОБРАЗОВАНИЯ И НАУКИ РФ

Федеральное государственное бюджетное образовательное учреждение высшего


профессионального образования “Московский государственный технический университет
радиотехники, электроники и автоматики»

Дагестанский филиал

Специальность 230101 «Вычислительные машины, комплексы, системы и сети»


Кафедра Информатики и вычислительной техники

ДОПУЩЕН К ЗАЩИТЕ

Зав. кафедрой Р.В.Гусейнов


_______________________

ДИПЛОМНАЯ РАБОТА
ТЕМА: Интернет-приложение на основе технологии Ajax с
использованием концепции MVC (администраторская часть)
Руководитель работы: ст. преподаватель Латифов М.С.
Консультант по спецчасти: ___________________________________________
Консультант по ____________________________________________________
Консультант по ____________________________________________________
Рецензент: _________________________________________________________

Исполнитель: Магомедрасулова Х. С
Группа: ВО-08, Шифр: ДГС 081009

Махачкала – 2013 г.
МИНИСТЕРСТВО ОБРАЗОВАНИЯ И НАУКИ РФ

Федеральное государственное бюджетное образовательное учреждение высшего


профессионального образования “Московский государственный технический
университет радиотехники, электроники и автоматики»

Кафедра ИиВТ

УТВЕРЖДАЮ

Заведующий кафедрой
Гусейнов Р.В.
“____” ____________________ 2013 г.

ЗАДАНИЕ
на дипломное проектирование

Дипломник Магомедрасулова Х. С. Шифр ДГС 081009


Специальность 230101 Вычислительные машины, комплексы, системы и сети

1. Тема дипломного проекта: Интернет-приложение на основе технологии Ajax


с использованием концепции MVC (администраторская часть)

2. Исходные данные к проекту:


Объект исследования - интернет-приложение
Метод исследования - разработка интернет-приложения с применением Ajax
и MVC

3. Перечень вопросов, подлежащих разработке в специальной части проекта:


Обзор предметной области
Разработка архитектуры администраторской части интернет-приложения
Проектирование базы данных интернет-приложения
Реализация администраторской части интернет-приложения

4. Задание по экономической части проекта:


Расчет экономической эффективности разработки

2
5. Задание по разделу «Экологичность и безопасность проекта»:
Характеристика условий труда программиста
Анализ опасных и вредных факторов, воздействующих на программиста

6. Перечень графических материалов :


Преимущества технологии AJAX
MVC в веб-разработке
Постановка задачи
Схема работы интернет-приложения
Схема базы данных
Диаграмма классов
Примеры страниц интернет-приложения

Всего: 7 листов.

7. Руководитель и консультанты проекта


Должность Подпи
Руководитель и консультанты ФИО
(должность в МИРЭА) сь
Руководитель проекта ст. преподаватель Латифов М. С.
Консультант по специальной
части
Консультант по экономической
части
Консультант по экологической
безопасности и безопасности
жизнедеятельности

8. Календарный график работы над дипломным проектом


Степень готовности проекта К какой дате
25% 28.03.2013
50% 8.04.2013
75% 6.05.2013
100% 3.05.2013

Задание принял к исполнению “11” февраля 2013 г.


Дипломник __________________________________ (подпись)
Руководитель проекта ________________________(подпись)

3
АННОТАЦИЯ

Дипломный проект посвящен изучению современной технологии AJAX


и популярной концепции MVC и использованию их на практике для
создания интернет-приложений.
Целью данного проекта является разработка администраторской части
веб-приложения на примере панели администрирования интернет-магазина.
В дипломной работе рассмотрены современные технологии создания
интернет-приложений, разработана структура администраторской части,
описывается алгоритмы проектирования и программной реализация,
приведены расчеты экономического эффекта от создания приложения.
Результатом дипломной работы является полноценная
администраторская часть интернет-магазина, написанная с использованием
современных языков веб-программирования и технологий: HTML, CSS, PHP,
JavaScript, AJAX.
Объем работы - 114 страниц (из них 40 - приложения), 26 иллюстраций
(в приложениях - 9), 7 таблиц, 20 источников информации.

4
СОДЕРЖАНИЕ

ВВЕДЕНИЕ...................................................................................................................................7

ГЛАВА 1. АНАЛИЗ ПРЕДМЕТНОЙ ОБЛАСТИ.................................................................9

1.1 Обзор современных веб-технологий............................................................................9

1.1.1 Развитие HTML...........................................................................................................9

1.1.2 Современные веб-сервера......................................................................................10

1.1.3 Языки веб-программирования..............................................................................11

1.2 Технология AJAX............................................................................................................15

1.2.1 Описание технологии.............................................................................................15

1.2.2 Принцип работы......................................................................................................16

1.2.3 Преимущества и недостатки AJAX......................................................................20

1.3 Концепция Model-View-Controller.............................................................................22

1.3.1 Классическая реализация MVC............................................................................22

1.3.2 MVC в веб-разработке.............................................................................................25

1.3.3 Типовые решения, предназначенные для организации данных в MVC...29

1.4 Постановка задач и требований к проектируемому интернет-приложению.32

ГЛАВА 2. ВЫБОР ИНСТРУМЕНТОВ И СРЕДСТВ ДЛЯ РАЗРАБОТКИ.....................34

2.1 Выбор языка программирования................................................................................34

2.2 Выбор системы управления базой данных..............................................................36

2.3 Выбор веб-сервера...........................................................................................................37

ГЛАВА 3. ПРАКТИЧЕСКАЯ ЧАСТЬ...................................................................................38

3.1 Архитектура администраторской части интернет-приложения.......................38

3.1.1 Структура интернет-приложения.......................................................................38

3.1.2 Структура корневого каталога интернет-приложения.................................41

3.1.3 Схема работы интернет-приложения.................................................................42

5
3.2 Проектирование базы данных интернет-приложения.........................................44

3.3 Реализация администраторской части интернет-приложения..........................49

3.3.1 Диаграмма классов...................................................................................................49

3.3.2 Описание ядра интернет-приложения..............................................................49

3.3.3 Описание модулей интернет-приложения.......................................................53

ГЛАВА 4. ЭКОНОМИКО-ОРГАНИЗАЦИОННЫЙ РАЗДЕЛ.......................................59

4.1 Экономическое обоснование разработки и использования программного


средства....................................................................................................................................59

4.1.1 Определение трудоёмкости разработки программного средства...............59

4.1.2 Определение стоимости разработки и освоения программного средства


................................................................................................................................................62

4.1.3 Расчёт показателей экономической эффективности программного


средства................................................................................................................................63

ГЛАВА 5. ЭКОЛОГИЧНОСТЬ И БЕЗОПАСНОСТЬ ПРОЕКТА...................................65

5.1 Анализ опасных и вредных факторов, воздействующих на программиста....65

5.1.1 Уровень шума на рабочем месте..........................................................................65

5.1.2 Монотонность труда...............................................................................................66

5.1.3 Недостаточная освещенность...............................................................................67

5.2 Разработка оптимальных условий труда..................................................................68

5.2.1 Снижение уровня шума.........................................................................................68

5.2.2 Устранение монотонности труда.........................................................................69

5.2.3 Принятие мер для снижения утомляемости глаз............................................70

ЗАКЛЮЧЕНИЕ.........................................................................................................................71

СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ...........................................................72

ПРИЛОЖЕНИЯ........................................................................................................................74

Приложение 1. Примеры страниц интернет-приложения........................................74

Приложение 2. Диаграмма классов..................................................................................78

Приложение 3. Программные листинги........................................................................79


6
ВВЕДЕНИЕ

Одним из интенсивно развивающихся направлений, на сегодняшний


день, является предоставление услуг через Интернет.
Интернет-приложения – это приложения, предназначенные для
автоматизированного выполнения каких-либо действий на веб-серверах. В
качестве пользовательского интерфейса, в таком случае, используют
браузеры. Логика веб-приложения построена на взаимодействии браузера и
сервера. Зачастую подобное взаимодействие осуществляется в асинхронном
режиме обмена информацией.
С каждым годом интернет-приложения приобретают все большую
популярность из-за их универсальности, мобильности, удобства
использования и гибкости. Главное преимущество интернет-приложений, в
отличие от классических десктопных – это удобство в поддержке и
администрировании:
 отсутствие необходимости установки приложения на каждое
рабочее место, для полноценной работы требуется браузер и доступ
в Интернет,
 удобство при обновлении версий приложения,
 возможность настройки интерфейса для каждого пользователя.
Существенное преимущество веб-приложений –
платформонезависимость приложения, т.е. функционирование происходит
независимо от операционной системы пользователя. Веб-приложения не

7
требовательны к ресурсам и не предъявляют строгих требований к
аппаратной части.
Сегодня существует множество технологий, позволяющих создавать
надёжные и эффективные интернет-приложения, отвечающие самым
современным требованиям и удобные в использовании. Огромную
популярность, на сегодняшний день, набирает новый подход к разработке
веб-приложений, называемый AJAX, при использовании которой,
приложения не перезагружаются целиком, а за счет асинхронного обращения
к веб-серверу догружают необходимые данные с сервера.
Интернет-приложения, как правило, состоят и клиентской и
администраторской части. Клиентская часть отвечает за пользовательский
интерфейс, взаимодействие с пользователями, в то время как
администраторская часть позволяет работать с содержимым базы данных
приложения и управлять самим приложением.
Цель дипломной работы – изучение современных технологий
разработки интернет-приложений и применение их на практике.
В работе требуется реализовать администраторскую часть интернет-
приложения, в качестве которого будет выступать панель
администрирования интернет-магазина компьютерной техники.

8
ГЛАВА 1. АНАЛИЗ ПРЕДМЕТНОЙ ОБЛАСТИ

1.1 Обзор современных веб-технологий

1.1.1 Развитие HTML

С момента появления Интернета, веб-приложения представляли собой


набор статических страниц, содержащих текст, изображения и гиперссылки.
За годы существования Всемирной паутины архитектура интернет-
приложений, выполняемые ими функции и принципы их построения
претерпели значительные изменения. Появились новые технологии, языки и
принципы разработки веб-приложений.
Основой всех современных веб-приложений является язык разметки
HTML (HyperText Markup Language), разработанный в 1986-1991 годах
британским учёным Тимом Бернерсом-Ли в недрах CERN (Европейского
Центра ядерных исследований). В его основу лег стандартный
обобщённый язык разметки SGML (Standard Generalized Markup Language). В
том же 1991 году был изобретен протокол передачи гипертекстовой
информации (HyperText Transfer Protocol – HTTP), который до сих пор
применяется для передачи данных через Интернет. В своей начальной версии
он делал лишь чуть больше, чем просто открывал и закрывал соединение.

9
Последние версии HTTP (версия 1.0 появилась в 1996 г., а версия 1.1 в 1999)
стали тем протоколом, который сегодня применяется в Интернете.
В 1994 году был создан консорциум W3C (World Wide Web Consor-
tium), в чьи задачи входило разрабатывать и внедрять технологические
стандарты для Всемирной паутины.
В 1995 году появилась первая официальная спецификация HTML 2.0. В
ней появилась возможность вставлять рисунки, гиперссылки и формы
отправки информации на сервер. В марте 1995 года была предложена версия
HTML 3.0, но из-за сложной реализации в браузерах того времени, она так и
не стала стандартом. Самым важным обновлением в данной версии HTML
была поддержка Каскадных таблиц стилей CSS (Cascading Style Sheets),
позволяющих производить графическое описание документа:
задания цветов, шрифтов, расположения отдельных блоков и других аспектов
представления внешнего вида веб-страниц.
С появлением спецификации HTML 3.2 в январе 1997 года начался
подъем в веб-дизайне.
Текущая версия HTML 4.01 была стандартизирована 24 декабря 1999
года. В настоящее время разрабатывается стандарт HTML 5, находящийся в
стадии разработки по состоянию на февраль 2013 года.
Простота HTML, заключающаяся в ограниченности количества тегов и
полного безразличия к структуре документа, превратилась в его главный
недостаток и побудила разработчиков W3C к созданию нового языка
разметки. В результате появился расширяемый язык разметки XML (Xtensi-
ble Markup Language), сочетающий в себе простоту HTML, логику разметки
SGML и удовлетворяющий требованиям Интернета. Он используется для
создания многих веб-приложений, в том числе и для мобильных устройств.
HTTP и HTML, на сегодняшний день, продолжают оставаться удачной
парой, понятной как веб-серверам, так и веб-клиентам, и составляют
фундамент современного Интернета.

10
1.1.2 Современные веб-сервера

Первые веб-сервера CERN httpd написаны Тимом Бернерсом-Ли на


языке программирования С, первая версия которого написана в 1991 году.
Сервер NCSA httpd был одним из первых веб-серверов стандарта HTTP/1.0,
получивший широкое распространение в начале 1990-х.
В 1995 году Брайан Белендорф создал первую версию сервера Apache,
устранивший ошибки NCSA httpd. На данный момент разработка ведётся в
ветке 2.2, а в версиях 1.3 и 2.0 производятся исправления ошибок
безопасности. На текущий момент последняя версия ветки - 2.4.4, для первой
версии это 1.3.42. Ядро Apache включает в себя основные функциональные
возможности, такие как обработка конфигурационных файлов,
протокол HTTP и система загрузки модулей и дополнений. Одним из
основных достоинств сервера является то, что он является бесплатным. В
настоящее время Apache является самым распространенным и занимает 65%
всех веб-серверов.
Второй по популярности современный веб-сервер (13% от общего
числа веб-сайтов) – IIS от компании Microsoft, распространяемый в составе
серверных операционных систем семейства Windows. Сервер поддерживает
технологии CGI, FastCGI, ISAPI и SSI. Сервер является стабильным и
быстрым в работе и имеет возможность подключать дополнительные модули.
IIS поддерживает также технологию .NET, набирающая популярность в среде
разработчиков.
Остальные существующие на данный момент сервера созданы для
выполнения узкопрофильных задач и пользуются сравнительно небольшой
популярностью.

1.1.3 Языки веб-программирования

Языки web-программирования используют для создания динамических


страниц и делятся на серверные (обрабатываемые веб-серверами) и
11
клиентские (команды обрабатываются браузерами). Для связи с сервером
используется интерфейс CGI (Common Gateway Interface — «общий
интерфейс шлюза»).
Разработку первого клиентского языка вела компанией Nombas в 1992
году. Язык, названный Cmm («Си-минус-минус») должен был стать
достаточно мощным, чтобы заменить макросы, сохраняя при этом схожесть с
языком С, но так и не получил широкого распространения.
В 1995 году группа разработчиков компаний Netscape Communications
и Sun Microsystems Марк Андрисин и Билл Джой под руководством
Брендона Айха создали язык LiveScript, который впоследствии был
переименован в JavaScript и стандартизован Европейской компьютерной
ассоциацией. Также по инициативе компании Netscape была проведена
стандартизация языка ассоциацией ECMA, стандартизированная версия
получила название ECMAScript и описывается стандартом ECMA-262. В
настоящий момент все современные браузеры поддерживают стандарт
ECMAScript 5.1. Старые версии браузеров поддерживают по крайней мере
ECMAScript 3.
JavaScript — интерпретируемый, объектно-ориентированный, кросс-
платформенный язык. Программы написанные на JavaScript называют
скриптами. Широкое применение язык находит в браузерах для
придания интерактивности веб-страницам.
Одним из преимуществ JavaScript, работающего на стороне клиента,
является его способность манипулировать родительским документом HTML,
а достигается это за счет использования интерфейса DOM .
При разработке веб-приложений используются множество библиотек
JavaScript, которые представляют собой набор многократно используемых
объектов и функций. Среди популярных библиотек можно выделить Dojo,
jQuery, Adobe life, Extjs, Mootools, Prototype и другие.
Также существует серверная реализация языка JavaScript – Node
или Node.js, основанная на движке V8, используемая для создания
12
высокопроизводительных и хорошо масштабируемых клиентских и
серверных приложений.
В 1996 году компания Microsoft выпустила аналог языка JavaScript,
названный JScript. Первым браузером, поддерживающим эту реализацию,
был Internet Explorer 3.0.
Среди серверных языков наибольшую популярность приобрели языки
PHP, Python, Ruby, а также .NET языки программирования популярной
технологии ASP.NET (C#, Visual Basic.NET, и JScript .NET).
Самым популярным языком веб-программирования является язык PHP
– серверный язык сценариев, разработанный специально для веб-
программирования. Разработка языка была начата в 1994 году Расмусом
Лердорфом, а затем адаптированная многими людьми, пока не стал широко
используемым продуктом.
Основные преимущества языка: простой синтаксис, высокое
быстродействие, поддержка большинством хостингов. Синтаксис языка
испытал влияние таких языков, как C, Java и Perl c добавлением нескольких
специфичных для PHP особенностей.
Язык и его интерпретатор разрабатываются группой энтузиастов в
рамках проекта с открытым кодом и распространяется под собственной
лицензией. В настоящее время текущая версия PHP – пятая,
характеризующая полной переделкой механизма Zend, который лежит в
основе языка и усовершенствованием ряда языковых конструкций.
Привлекательность PHP в том, что на нем написаны многие
популярные движки: Drupal, Typo3, Joomla, Wordpress и фреймворки:
CakePHP, Kohana, Zend Framework, Symfony, CodeIgniter и Yii.
Высокую популярность приобрел язык Ruby и фреймворк Ruby on
Rails, предоставляющий архитектурный образец Model-View-Controller. С
его помощью можно очень быстро создать сайт с требуемой
функциональностью. Недостаток Ruby – низкое быстродействие. На его

13
основе построены такие популярные проекты как Twitter, Diaspora, Look At
Me, Basecamp, GitHub и другие.
Не менее популярен язык Python и Django - свободный фреймворк
для веб-приложений, использующий шаблон проектирования MVC,
применяемый в крупных и известных сайтов, таких как Instagram, Disqus,
Mozilla и др. Одним из существенных архитектурных отличий фреймворка от
остальных – структура сайта на Django представляет собой один или
несколько приложений в виде подключаемых модулей. Еще одно
существенное отличие – обработчики URL в Django конфигурируются при
помощи регулярных выражений и не выводятся автоматически из структуры
моделей контроллеров. Основной принцип работы фреймворка - DRY -
принципа разработки программного обеспечения, цель которого состоит в
снижении повторения различного рода информации.
В операционной системе Windows используется технология ASP.NET.
ASP.NET. Главной особенностью разработки Web-приложений при помощи
ASP.NET является возможность использовать любой язык программирования
среды исполнения .NET.
Технология привлекательна тем, что можно от самых простых сайтов,
состоящих их нескольких страниц, до очень сложных, обрабатывающих
миллионы запросов в день. Основной недостаток – достаточно дорогие
хостинги и необходимость покупки серверной лицензии, в случае с
выделенным хостингом. В 2007 году в ASP.NET был добавлен фреймворк
ASP.NET MVC Framework для создания веб-приложений, который
реализует шаблон Model-View-Controller.

14
1.2 Технология AJAX

1.2.1 Описание технологии

Впервые об AJAX (Asynchronous Javascript and XML —


«асинхронный JavaScript и XML») заговорили после опубликовании статьи
Джесси Джеймса Гарретта, соучредителя и президента Adaptive Path, фирмы
по разработке архитектуры информационных систем, — «Ajax: A New Ap-
proach to Web Applications» (Ajax: Новый подход к веб-приложениям) в
феврале 2005 года. В статье он описал новый подход к разработке веб-
приложений – асинхронная связь между клиентом и сервером, открывающей
возможности использования объекта XMLHttpRequest, предоставляемого
всеми современными браузерами, который уже использовался в
приложениях Google, а также дал название новой технологии.
Несмотря на шумиху, поднятой вокруг этой технологии, в ней нет ни
одного нового или революционного компонента – все компоненты AJAX
существуют, по крайней мере, с 1998 года. По сути это даже не новая
технология, а эффективный способ совместного использования нескольких
самостоятельных технологий, основанный на двух принципах:
 обращение к серверу без перезагрузки;
 динамическое изменение содержания страницы.
15
В состав AJAX вовлечены следующие компоненты:
• Средства отображения страниц – HTML, XHTML и CSS,
• Динамические средства манипулирования структурой страницы –
объектная модель документа (Document Object Model – DOM) ,
• Средства обмена данными и их обработки - XML и XSLT,
• Механизмы асинхронной передачи данных с сервера с помощью объекта
XMLHttpRequest,
• JavaScript – связующее звено, объединяющее все эти компоненты.
Особую популярность AJAX приобрела после использования его
компанией Google в сервисах Gmail, Google Maps и Google Suggest.
С точки зрения перспектив веб-разработки, AJAX обладает наилучшей
согласованностью между функциональностью, реализуемой на стороне
клиента, и функциональностью, реализуемой на стороне сервера, при
выполнении действий, затребованных пользователем. До этого места
функциональность клиента и функциональность сервера рассматривались как
отдельные части, которые работают независимо друг от друга в ответ на
действия, предпринимаемые пользователем. AJAX предлагает новое решение
– распределить нагрузку между клиентом и сервером, дав им возможность
взаимодействовать друг с другом, пока пользователь работает со страницей.

1.2.2 Принцип работы

В классическом веб-приложении (рис. 1), получая запрос от клиента,


браузер отправляет HTTP-запрос серверу.

16
Рисунок 1. Схема работы классического веб-приложения
Сервер обрабатывает запрос, генерирует полностью новую веб-
страницу и отправляет ее браузеру. Само веб-приложение может выступать в
качестве клиента других служб, например, базы данных или другого веб-
приложения, расположенного на другом сервере. Такая модель работы
приложения называется синхронной.
В синхронной модели все процессы выполняются последовательно,
один за другим (рис. 2). Минусом такой модели является тот факт, что
пользователю не доступны другие операции, пока происходит обмен
данными, к тому же если потребуется обновить лишь небольшую часть веб-
страницы, то приходится обновлять всю старицу целиком.

17
Рисунок 2. Диаграмма синхронной модели работы веб-приложения

Технология AJAX - асинхронна. В асинхронной модели (рис. 3) при


отправке запроса на сервер, пользователь может обращаться к другим
функциям. Асинхронная модель характеризуется почти мгновенной
реакцией на действия пользователя, что создает впечатление удобного и
быстрого приложения.

Рисунок 3. Диаграмма асинхронной модели работы веб-приложения

18
При получении запроса приложение загружает написанный на
JavaScript специальный движок AJAX.

Рисунок 4. Схема работы AJAX приложения


AJAX-движок отвечает как за отображение веб-страницы, так и за
взаимодействие приложения с сервером. Он позволяет пользователю
осуществлять асинхронное взаимодействие с сервером. Таким образом,
пользователю нет необходимости наблюдать за загрузкой новой страницы,
пока сервер обрабатывает запросы. Любой ответ на действия пользователя,
которой не требует обращения к серверу, например, простая проверка
данных, осуществляется AJAX-движком самостоятельно. При
необходимости обращения движка к серверу, для запроса некоторых данных,
загрузки дополнительной части интерфейса или отправки данных на сервер,
то движок осуществляет это асинхронно и обычно посредством обмена XML
данными без задержек для пользователя.
AJAX-приложение состоит из двух частей:

19
1. Клиентская. Исполняется на стороне клиента и написана на языке
JavaScript. Здесь происходит сбор и подготовка информации для
отправки запроса на сервер, открывается соединения с указанием типа
запроса (GET или POST), URL серверной части, флага асинхронного
режима. Затем происходит непосредственная отправка запроса и
обработка ответа серверной части.
2. Серверная, которая исполняется на сервере и написана на любом языке
программирования. Здесь происходит обработка полученных данных и их
отправка к клиенту.
Наиболее важным аспектом AJAX является та часть процесса, которая
относится к HTTP-запросу. Асинхронная отправка данных на сервер и
получение в ответ дополнительных данных является основным назначением
AJAX.
Первоначальным аспектом Ajax-процесса является открытие
соединения с сервером. Особенность всей методологии Ajax заключается в
передаче данных от клиента (например, веб-браузера) к серверу. Первой
стадией отправки данных на сервер является приведение их к такому
формату, который мог бы легко прочитан сервером.
Объект XMLHTTPRequest (XHR) – низкоуровневая основа
большинства AJAX-приложений, использующая запросы HTTP (HTTPS)
напрямую к веб-серверу и загружая полученные данные прямо в
вызывающий скрипт. Аспектом создания и использования XMLHttpRequest,
который ставит его выше всех остальных упрощенных форм односторонней
связи, является возможность чтения различных текстовых форматов данных,
посылаемых сервером. В некоторых AJAX-фреймворках вместо
XMLHttpRequest могут использоваться IFrame или SCRIPT-тег.
Сценарий на стороне сервера отправляет свой ответ по протоколу
HTTP, при этом ответ должен иметь такой формат, который легко может
быть разобран JavaScript-кодом на стороне клиента. Можно выбрать любой

20
формат передачи данных: HTML, простой текст, XML. Один из известных
форматов передачи – JSON (JavaScript Object Notation).
AJAX, в первую очередь, используют для небольших элементов
управления. Эта технология является прекрасным решением в таких случаях,
как:
 быстрая отправка сообщения без перезагрузки страницы,
 проверка правильности введенных данных,
 редактирование заполненных полей в формах,
 реализация опросов на сайте,
 разработка простых чатов,
 подгрузка данных с сервера и др.

1.2.3 Преимущества и недостатки AJAX

Несмотря на привлекательность данной технологии, в ней существует


ряд достоинств и недостатков.
Преимущества AJAX:
• Важным достоинством технологии является возможность в случае
обновления данных веб-страницы, не перезагружая всю страницу,
загрузить лишь изменившуюся часть, что позволяет значительно
сократить трафик.
• Снижение нагрузки на сервер за счет сокращения числа повторного
создания новых страниц и передачи их клиенту .
• Возможность непрерывной подгрузки информации с сервера. Самый
распространенный пример – чат, куда постоянно поступают все новые
сообщения, непрерывно подгружаемые с сервера. Также, через AJAX, без
перезагрузки страницы, пользователь может отсылать сообщения на
сервер.

21
• Ускорение реакции интерфейса. Пользователю виден результат действий
быстрее, поскольку загружается только изменившаяся часть веб-
страницы.
С AJAX также связаны и потенциальные трудности:
• Динамически подгружаемое содержимое не индексируется,
вследствие чего оно не доступно поисковым машинам.
• Отсутствие интеграции со стандартными инструментами браузера,
т. к. динамически создаваемые страницы не регистрируются
браузером в истории посещения страниц, поэтому не работает
кнопка «Назад».
• Отсутствие возможности сохранения страницы в закладки
браузера.
• Нефункциональность AJAX в случае отключения в браузере
JavaScript.

1.3 Концепция Model-View-Controller

22
1.3.1 Классическая реализация MVC

MVC (Model-View-Controller) – самая распространенная на


сегодняшний день концепция разработки приложений.
Впервые схема была предложена в конце 70-х годов прошлого столетия
для языка SmallTalk Трюгве Реенскаугом. Задачей было придумать такое
архитектурное решение, которое позволило бы манипулировать данными
графического интерфейса так, чтобы изменение этих данных не влияло бы на
логику и данные приложения. Таким решением и стала новая концепция
проектирования, зародившаяся в недрах Xerox PARC.
Классическая реализация MVC предполагает разделение
пользовательского интерфейса, данных приложения и управляющей логики
на три оставляющих, которые и дали название этой концепции: Модель,
Представление и Контроллер.
Модель (Model) содержит данные предметной области, передает их
представлению и реагирует на команды контроллера. Предполагается, что
модель ничего не знает о существовании контроллера и представления, что
позволяет бы вносить изменения в контроллер и представление, не
затрагивая при том модели и даже была возможность взаимодействовать
нескольких представлений и контроллеров с одной и той же моделью.
Обычно различают два типа модификации модели в зависимости от ее
роли.
Passive Model (пассивная модель) никак не воздействует на
представление или контроллер и используется ими только в качестве
источника данных для отображения. Все изменения модели
отслеживаются контроллером, он же отвечает за изменение представления,
если это необходимо.
Active Model (активная модель) имеет возможность
оповестить представление об изменениях, и представление может эти
изменения отобразить.

23
Классическую реализацию паттерна MVC принято ассоциировать
именно с активной моделью.
Представление (View) отвечает за отображение данных средствами
графического интерфейса и реагирует на изменения модели.
Представление имеет свободный доступ к данным модели, однако не может
ничего в ней менять. Для взаимодействия с контроллером представление
реализует некий интерфейс, известный контроллеру, что позволяет менять
представления независимо и иметь несколько представлений на один
контроллер.
Контроллер (Controller) управляет действиями пользователя, оповещая
модель о необходимости изменений. Контроллер может работать с
несколькими представлениями. В классической версии MVC контроллер не
передает данные из модели в представление.
Схема взаимодействия компонентов MVC (рис. 5):
Контроллер реагирует на действия пользователя и вызывает
соответствующие изменения данных модели. После, модель сообщает
представление о том, что она изменилась. Представление обращается
к модели за обновленными данными, после чего их и отображает.

Рисунок 5. Схема взаимодействия компонентов MVC

24
Существуют два принципиальных типа разделения компонентов
концепции MVC: отделение представления от модели и отделение
контроллера от представления.
Отделение Представления от Модели — один из методов
проектирования программного обеспечения, наличие которого производят по
ряду причин.
 Реализация Представления и Модели относятся к совершенно разным
сферам веб-программирования. Представление отвечает на вопросы
разработки механизмов пользовательского интерфейса и
эргономичности интерфейса приложения для пользователя. В то время
как работа с Моделью предполагает упор на бизнес-логику и на
взаимодействии с базой данных.
 В зависимости от ситуации, одна и та же информация может быть
отображена разными способами в приложении. Отделение
Представления от Модели позволяет разработать, в таком случае, один
и тот же код Модели для нескольких Представлений.
Главное преимущество в отделении Представления от Модели -
программисты, занимающиеся разработкой модели, не будут осведомлены о
работе над интерфейсом Представления, что существенно облегчит
разработку Модели и позволит с легкостью расширить количество
Представлений для одной и той же Модели. Кроме того, изменение
интерфейса Представления не потребует изменения Модели.
Отделение Контроллера от Представления не так эффективен, в
отличие от предыдущего тип разделения. Практически во всех версиях
Smalltalk разделение на Контроллер и Представление не проводилось. На
практике каждому Представлению соответствует один соответствующий
Контроллер.
Полезность применения данной концепции заключатся в том, что:
1. К одной и той же Модели можно сопоставить
несколько Представлений, не затрагивая при этом реализации Модели.
25
2. Не затрагивая реализацию Представлений, имеется возможность
изменить реакции на действия пользователей, для этого достаточно
использовать другой Контроллер.
3. Имеется возможность разделения полномочий разработчиков.
Развитие объектно-ориентированной парадигмы программирования и
введение понятия шаблонов проектирования привели к созданию ряда
модификаций концепции MVC. В период широкой популярности веб-
приложений, шаблон MVC был адаптирован и к веб-разработке.

1.3.2 MVC в веб-разработке

Модель-вид-контроллер — схема использования нескольких паттернов


проектирования, с помощью которых модель данных приложения и
пользовательский интерфейс разделены на отдельные компоненты так, что
модификация одного из компонентов оказывает минимальное воздействие на
остальных.
Идея, которая лежит в основе данной концепции, состоит в том, чтобы
разделить так называемую «бизнес-логику» от ее визуализации. За счет
этого повышается возможность их повторного использования.
Приложение разделяется на три основных компонента:
Модель, Представление и Контроллер.
Модель отражает структуру данных и используется для
манипулирования логикой приложения. Она не взаимодействует напрямую с
пользователем и не генерирует HTML-код. К одной модели можно
сопоставить несколько видов, не затрагивая при этом реализации модели.
Вид (представление) – обычные веб-страницы, которые преобразуют
данные, полученные от модели, к виду, удобному для пользователя. Виды
содержат HTML-разметку и небольшие вставки PHP-кода для обхода,
форматирования и отображения данных. Вид не должен напрямую

26
обращаться к базе данных, не должен работать с данными, полученными из
запроса пользователя. В качестве отображения может быть применен
шаблон. Виды обычно разделяют на общий шаблон, содержащий разметку,
общую для всех страниц и части шаблона, которые используют для
отображения данных выводимых из модели. Допускается наличие
нескольких различных видов, наилучшим образом подходящих для текущей
ситуации.
Контроллер управляет запросами пользователя, получаемыми в виде
запросов HTTP GET или POST. Его основная функция — вызывать и
координировать действие необходимых ресурсов и объектов, нужных для
выполнения действий, задаваемых пользователем. Обычно контроллер
вызывает соответствующую модель для задачи и выбирает подходящий для
него вид.

Рисунок 6. Взаимодействия компонентов MVC в веб-приложении

Диаграмма последовательностей компонентов MVC представлена на


рисунке 7.
1. При запуске веб-приложения скрипт инициализации создает экземпляр
приложения и запускает его на выполнение.
2. Контроллер генерирует Представление страницы.
3. Представление отображается пользователю.

27
Рисунок 7. Диаграмма последовательностей MVC

Первые три этапа реализуются без использования Модели. Далее идет


последовательность, где задействована Модель:

28
4. После получения запроса от пользователя, создается экземпляр
запрошенного Контроллера и вызывается указанное действие.
5. Далее вызываются методы Модели, изменяющие ее.
6. Генерируется представление.
7. Представление запрашивает данные для отображения.
8. Модель возвращает запрошенные данные.
9. Представление отображает результаты пользователю.
В зависимости от внутренней логики приложения возможны случаи,
когда после получения запроса от пользователя, контроллер либо формирует
представление страницы, либо вызывает методы модели, модель уведомляет
представление об изменения и обновленное представление отображается
пользователю. При использовании, например, технологии AJAX (рис. 8)
возможны случаи, когда приложение получает запрос, вызывает указанное
действие контроллера, в представлении генерируется отображение для ввода
данных, после того, как данные введены, вызывается тот же контроллер,
который проверяет и обрабатывает полученные данные и формирует
другое представление или же обновляет текущее.

Рисунок 8. Взаимодействия компонентов MVC в веб-приложении


при AJAX запросе

29
Шаблон MVC примечателен в веб-разработке тем, что при создании
сложных проектов позволяет отделить работу веб-программиста или группы
программистов, дизайнера, верстальщика и т. д.

1.3.3 Типовые решения, предназначенные для организации данных


в MVC

При реализации концепции MVC используется большое


количество шаблонов проектирования для организации Контроллеров и
Представлений, основанных на концепции объектно-ориентированного
проектирования.
Представление с преобразованием (Transform View)
Представление, поочередно обрабатывающее данные модели и
преобразующая их в код HTML.
При запросах к базе данных получаем необходимые данные.
Визуализацией полученных данных занимается Представление в схеме
Model-View- Controller, задачей которого является формирование данных в
web-странице, когда на входе есть данные Модели, а на выходе HTML.
В основе шаблона лежит идея написания программы, которая бы
просматривала данные Модели и преобразовывала их в код HTML. В
процессе выполнения такая программа последовательно проходит по
структуре данных и, обнаруживая новый фрагмент данных, создает их
описание в виде HTML. Т. е. для каждого входного элемента подбирается
подходящее преобразование.
Представление по шаблону (Template View)
Заполняет шаблон Представления информацией при помощи
специальных маркеров, указанных в шаблоне.
Идея шаблона состоит в том, чтобы вставить в текст готовой
статической HTML-страницы маркеры, указывающие на данные Модели.
При вызове страницы для обслуживания запроса эти маркеры будут

30
заменены результатами выборки данных из базы данных. Подобная схема
позволяет создавать статическую часть страницы с помощью обычных
средств, а для получения динамической информации маркеры обращаются к
отдельным частям программы.

Двухэтапное представление (Two Step View)


Выполняет преобразование данных в HTML в два шага: сначала
формируется логическая структура веб-страницы, а затем - заполняется
отформатированными данными.
На первом этапе данные, полученные от Модели, организуются в
некую структуру, которая описывает визуальные элементы Представления.
На втором этапе полученная структура преобразуется в код HTML.
Шаблон может быть построен как на основе шаблона Transform
View, так и на основе шаблона Template View.
Контроллер страниц (Page Controller)
Предполагает наличие отдельного контроллера для каждой
страницыWeb-сайта. Page Controller – шаблон, в котором один контроллер
приложения отвечает за отображение одной веб-страницы. Это может быть
не только отдельная страница, хранящаяся на веб-сервере, но и отдельный
объект, который отвечает за страницу.
На практике количество контроллеров не всегда в точности
соответствует количеству страниц, поскольку иногда при щелчке на ссылке
открываются страницы с разным динамическим содержимым.
Шаблон удобно использовать для сайтов с достаточно простой логикой
контроллера. В этом случае большинство адресов URL могут обрабатываться
с помощью страниц сервера, а более сложные случаи — с применением
вспомогательных объектов.
Контроллер запросов (Front Controller)
Контроллер, обрабатывающий все запросы к сайту. Объединяет все
действия по обработке запросов в одной точке, распределяя их выполнение
31
посредством единственного объекта обработчика. Выбор команды может
происходить статически или динамически.
Обработка все запросов, поступающие к веб-сайту, обычно состоит из
двух этапов: обработчика запросов и последовательности операций.
Обработчик запросов — это объект, который выполняет получение POST-
или GET-запросов, поступивших на веб-сервер. Он извлекает необходимую
информацию из адреса URL и входных данных запроса, после чего решает,
какое действие необходимо инициировать, и делегирует его выполнение
соответствующей операции .
Обработчик и операции обычно реализуются в виде классов. Выбор
операции может происходить статически или динамически. Статический вы-
бор операции подразумевает проведение синтаксического анализа адреса
URL, а динамический — извлечение некоторого стандартного фрагмента
адреса URL и динамическое создание экземпляра класса команды.
Веб-сервер должен быть сконфигурирован на использование кон-
троллера запросов при начальной загрузке приложения, а распределение
запросов будет выполнять обработчик запросов.
Контроллер приложения (Application Controller)
Единая точка управления отображением и выполнением приложения.
Входные Контроллеры обращаются к контроллеру приложения за
командами, которые следует применить к Модели, и за Представлениями,
которые необходимо использовать в определенном контексте приложения.
Контроллер приложения выполняет в таком случае две основные функции:
выбор логики, применяемая в каждой конкретной ситуации, и выбор
Представления, которое следует отобразить. Для осуществления этих
функций Контроллер приложения поддерживает два вида ссылок на классы –
одну для команд и одну для представлений.
Приложение может иметь несколько Контроллеров приложений,
управляющих его составными частями.

32
1.4 Постановка задач и требований к проектируемому
интернет-приложению

Как и любая сложная информационная система, так и интернет-


приложения нуждаются в администрировании. Администратор
отвечает за работоспособность приложения и наделен
соответствующими возможностями по управлению объектами базы
данных приложения.
В данной дипломной работе требуется спроектировать и реализовать
администраторскую часть интернет-приложения с использованием
технологии AJAX и концепции MVC.
Разрабатываемое приложение будет представлять собой панель
администрирования интернет - магазина.
Проектируемая администраторская часть должна удовлетворять
следующим требованиям:
1. эргономичный интерфейс, интуитивно понятный и учитывающий
особенности восприятия информации и аспекты работы
администраторов с приложением,
2. возможность гибкого управления базой данных,
3. возможность расширения структуры базы данных,
4. безопасная аутентификация,
5. минимально возможная функциональность,
6. возможность расширения существующего функционала.

33
Разрабатываемая панель администрирования интернет-магазина
должна содержать следующий необходимый минимум функций:
 управление товарами:
o добавление новых товаров;
o удаление товаров;
o редактирование товаров;
 управление категориями товаров:
o добавление категорий;
o удаление категорий;
o редактирование категорий;
 управление заказами:
o просмотр заказов;
o редактирование заказов;
o отмена заказов;
o оплата заказов;
 управление пользователями:
o просмотр пользователей;
o просмотр заказов пользователей.
 переписка с пользователями:
o модерация комментариев;
o добавление ответа на комментарий.

34
ГЛАВА 2. ВЫБОР ИНСТРУМЕНТОВ И СРЕДСТВ ДЛЯ
РАЗРАБОТКИ

2.1 Выбор языка программирования

Выбор языка программирования должен удовлетворять следующим


требованиям:
 гибкость языка,
 кроссплатформенность,
 производительность,
 масштабируемость,
 переносимость,
 иметь свободную лицензию,
 низкую стоимость,
 простота использования,
 доступность и открытость спецификации.
В качестве основного инструмента я выбрала язык программирования
PHP 5 для серверной части и JavaScript – для клиентской.

35
PHP - это скриптовый язык, который легко может быть встроен в
HTML и широко применяемый для разработки web-приложений. PHP
доступен для большинства операционных систем, включена также поддержка
большинства современных веб-серверов. Преимуществом PHP является
поддержка многих баз данных.
Начиная с версии PHP 5, включена полная поддержка ООП, которая до
этой версии обеспечивалась лишь частично.
В настоящее время поддерживается подавляющим большинством
хостинг-провайдеров и является одним из лидеров среди языков веб-
программирования, позволяющих разработчикам легко создавать
интерактивные страницы.
В интернет-приложении язык программирования PHP используется с
целью:
 программирования логии интернет-приложения;
 взаимодействия с базой данных;
 обработки данных на сервере, полученной от Ajax.
Язык предоставляет полный доступ к исходному коду, его
можно свободно использовать, изменять и распространять.
Для программирования клиентской части приложения используется
язык JavaScript – кроссплатформенный скриптовый язык.
В проектируемом интернет-приложении Javascript используется в
следующих целях:
 проверка данных формы перед передачей их на сервер;
 объединение компонентов Ajax;
 моделирования связи с базой данных;
 обработка ответов полученных от сервера и вывод их
пользователю.
При проектировании данного интернет-приложения была использована
библиотека Javascript – jQuery. Эта библиотека помогает легко получать
36
доступ к любому элементу DOM, обращаться к атрибутам и содержимому
элементов DOM и манипулировать ими. Также библиотека jQuery
предоставляет удобный интерфейс прикладного программирования по работе
с Ajax.
Преимущества jQuery перед JavaScript :
- существенное уменьшение объема программного кода, по сравнению
с JavaScript, и, как следствие, читабельность кода,
- обширная и удобная документация,
- использование Ajax намного проще,
- наличие огромного количества плагинов.

2.2 Выбор системы управления базой данных

Для хранения данных используется относительно небольшая и быстрая


реляционная система управления базами данных (СУБД) MySQL.
MySQL характеризуется большой скоростью, надежностью, легкостью
в использовании, поддержкой множеством платформ.
База данных MySQL имеет широкий круг возможностей, поддерживает
неограниченное количество одновременно работающих с базой данных
пользователей, обеспечивая при этом быстрое выполнение команд.
Количество строк в таблицах может достигать 50 миллионов.
В поcледней версии MySQL 5.0 были сделаны значительные
изменения, в отличие от предыдущих, а также добавлены новые
функциональные возможности, таких как:
 поддержка подзапросов,
 усовершенствование поддержки интернационализации,
 кэш-запросы, существенно увеличивающие скорость выполнения
повторяющих запросов.

37
MySQL представляет собой программное обеспечение с открытым
кодом. Пакет MySQL доступен по схеме двойного лицензирования. Его
можно свободно использовать до тех пор, пока соблюдаются требования
лицензии GNU (GPL). При распространении приложений, не попадающих
под действие этой лицензии, требует приобретения коммерческой лицензии.
Связка MySQL с языком PHP, на сегодняшний день, является самой
популярной.

2.3 Выбор веб-сервера

Денвер – локальный сервер (Apache, PHP, MySQL, Perl и т.д.) и


программная оболочка. Используется веб-разработчиками для разработки
сайтов на локальной Windows-машине без необходимости выхода в
интернет.
Базовый пакет Денвера содержит:
 Инсталлятор.
 Apache, SSL, SSI, mod_rewrite, mod_php.
 PHP 5 с поддержкой MySQL, sqLite.
 MySQL 5 с поддержкой транзакций.
 Система управления виртуальными хостами.
 Система управления запуском и завершением всех компонентов
Денвера.
 phpMyAdmin — система управления MySQL через веб-интерфейс.
 Эмулятор sendmail и SMTP, поддерживается работа совместно с PHP,
Perl, Parser и т.д.
38
Особенность Денвера – его полная автономность. Денвер
устанавливается в единственный каталог и вне его ничего не изменяет.
Единожды установив Денвер, можно затем просто переписывать его на
другие машины. Все конфигурирование и настройка под конкретную машину
происходит автоматически.
Использование локального сервера вызвано необходимостью
возможности предварительного просмотра и тестирования разработанного
веб-приложения.

Все перечисленные инструментальные средства имеют свободную


лицензию и распространяются бесплатно, что позволяет избежать
дополнительных затрат на разработку.

ГЛАВА 3. ПРАКТИЧЕСКАЯ ЧАСТЬ

3.1 Архитектура администраторской части


интернет-приложения

3.1.1 Структура интернет-приложения

В соответствии с задачами администраторской части проектируемого


интернет-приложения структура панели управления интернет-магазина будет
следующие разделы (рис. 9): главная страница, страница управления
заказами, каталогом товаров, пользователями и обратная связь.

39
Главная страница

Каталог Пользовател Обратная


Заказы
товаров и связь

Категории

Товары

Рисунок 9. Структура администраторской части интернет-магазина

При работе с заказами имеется возможность просмотра не только


списка всех заказов, но и полной информации отдельного заказа. На странице
просмотра отдельного заказа предусмотрена возможность смены статуса
заказа, изменение данных о покупателе и содержимого заказа.

Изменение
статуса заказа

Просмотр Изменение
отдельного данных о
заказа покупателе
Заказы (главная
страница) Просмотр
Изменение
содержимого
содержимого
отдельного
заказа
заказа

Рисунок 10. Схема работы с заказами

Работа с каталогом товаров делится на две части: работу с категориями


товаров и работу со списком товарами.

40
Работа с категориями включает в себя добавление новой категории и
просмотр информации о категории, в которой имеется возможность
редактировать саму категорию либо удалить ее.

Редактирован
Просмотр ие категории
информации
Категории о категории Удаление
(главная
Добавление категории
страница)
новой
категории

Рисунок 11. Схема работы с категориями товаров

Для удобства просмотра списка всех категорий, их отображение


реализовано в виде раскрывающего дерева, где в качестве корневых узлов
дерева выступают родительские категории, а в качестве раскрывающихся
узлов дерева – дочерние категории.
Работа с каталогом товаров, как и с категориями, включает
возможности добавления и просмотра информации об отдельном товаре.

Добавление
изображения
товара
Редактирован
Просмотр
ие
информации
Товары информации
о товаре
(главная о товаре
страница) Добавление Удаление
нового товара товара

Рисунок 12. Схема работы с товарами

При работе с покупателями имеется возможность просмотра списка


заказов отдельного клиента.
41
Покупатели Просмотр
Информация о
(главная информации о
заказах
страница) пользователе

Рисунок 13. Схема работы с покупателями

Работа с покупателями предусматривает также возможность обратной


связи с посетителями.

Просмотр Добавиление
информации о ответа к
Обратная связь комментарии комментарию
(главная
страница)
Модерация
сообщения

Рисунок 14. Схема работы обратной связи


Для реализации логической структуры приложения в данной
дипломной работе применятся концепция проектирования логики веб-
приложения – MVC, а также объектно-ориентированная парадигма
программирования. Таким образом, необходимо создать шесть классов для
управления частями администраторской панели.
Просмотр содержимого, изменение статуса заказа, изменение данных о
покупателе и содержимого заказа, добавление нового, редактирование и
удаление товара, редактирование и удаление категорий товаров, раскрытие
узлов дерева категорий реализованы средствами AJAX.

3.1.2 Структура корневого каталога интернет-приложения

В корне приложения находятся основные папки и файлы:


42
 application – основные рабочие файлы
 core – ядро приложения
 css – подключаемые стили
 image – изображения для оформления сайта
 lib – библиотека дополнительных функций
 script – скрипты
 upload – загружаемые изображения
 .htaccess – файл дополнительной конфигурации веб-сервера
 index.php – точка входа в приложение

Папка application содержит следующие папки:


 controller – контроллеры приложения
 model – модели приложения
 view – представления приложения

Все запросы к серверу приложения переадресовываются на один файл


– index.php. Базовые классы, необходимые для функционирования
приложения, будут храниться в папке core. Классы, модели и представления
реализованных компонентов приложения будут храниться в
соответствующих папках controller, model и view.

3.1.3 Схема работы интернет-приложения

Схематическое изображение алгоритма работы интернет-приложения,


в соответствии с концепцией MVC представлена на рисунке 15.

43
index.php Router->start()
Браузер Подключение ядра Анализирует URL.
Запрашивает Выявление текущего
приложения.
страницу Контроллера, действия и
Запуск
интернет- параметров.
приложения.
приложения. Перенаправление
запроса.

Диспетчеризация

Controller
Проверка полученных
данных View Браузер
Получение данных из Представление вида Отображение
модели. страницы. полученной
Генерирование Подстановка страницы
Представления. переменных.
Передача переменных
Представлению.

Model
Работа с базой
данных

Рисунок 15. Схема работы интернет-приложения

1. С помощью файла .htaccess все запросы к интернет-приложению


перенаправляются на входную точку – файл index.php.
2. index.php загружает ядро приложения и запускает контроллер-
маршрутизатор.
3. Контроллер-маршрутизатор (Router) анализирует URL, выявляя
текущий Контроллер, действие и передаваемые параметры.
4. Используя контроллер-маршрутизатор, запрос браузера переадресуется
к действию Контроллера (метод Контроллера).
5. Текущий метод Контроллера обращается к Модели для получения
данных из базы данных.
6. После получения данных, они возвращаются в метод Контроллера.
44
7. Когда метод Контроллера выполнил все необходимые операции, он
передает полученные данные в Представление
8. Представление отображается в браузере.

3.2 Проектирование базы данных интернет-приложения

База данных является основной частью любого приложения, в котором


предусмотрено не только хранение данных, но и их обработка.
Администраторская часть интернет-приложения работает с базой данных
более плотно, по сравнению с клиентской частью, и, по сути, является
инструментом, осуществляющим настройку базы данных.

Для реализации полнофункционального интернет-магазина


реализованы следующие таблицы в базе данных:
 client — пользователи;
 category — категории товаров;
45
 product — товары;
 order — общая информация о заказе;
 item_order — табличная часть заказов;
 comment – сообщения посетителей;
 answer_comment – ответы администратора.

Рассмотрим подробно структуру таблиц.


Таблицы order и item-order содержат информацию о заказах. Две таблицы
необходимы для того, чтобы разделить общую информацию о заказах и
списки заказанных товаров. В таком случае обеспечивается минимизация
объемов базы данных и повышается скорость обработки информации.
Таблица order содержит общую информацию о заказе. Таблица item-order
хранит информацию о содержимом отдельного заказа.

Таблица 1. order – информация о заказах


№ Идентификатор Тип данных Наименование
1 id int(11) первичный ключ
2 id_user int(11) id пользователя
3 amount float общая сумма заказа
4 date date дата заказа
5 status varchar(50) статус заказа

Таблица 2. item_order – информация о содержимом заказа


№ Идентификатор Тип данных Наименование
1 id int(11) первичный ключ
2 id_order int(11) id заказа
46
3 id_product int(11) id товара
4 name varchar(150) название товара
5 count int(11) количество
6 cost float цена

В таблице category хранятся наименования категорий товаров. Для


избавления от потребности дополнительных запросов определения
существования родительских и дочерних категорий, в базу данных добавлено
дополнительное поле children. Данное поле позволит сократить количество
запросов к базе данных.

Таблица 3. category – список категорий товаров


№ Идентификатор Тип данных Наименование
1 id int(11) первичный ключ
2 title int(11) название категории
3 id_parent varchar(50) id родительской категории
наличие дочерних категорий:
 0 – отсутствие дочерних
4 children tinyint(1) категорий;
 1 – присутствие дочерних
категорий.

В таблице product хранится каталог товаров. Записи в каталоге товаров


хранятся вечно или до тех пор, пока есть хоть один заказ, в
котором присутствует соответствующий товар.

Таблица 4. product – информация по товарам


№ Идентификатор Тип данных Наименование
1 id int(11) первичный ключ
2 id_category int(11) id категории

47
3 name varchar(150) название товара
4 price int(11) цена товара
5 quantity int(11) количество товара на складе
6 image varchar(250) изображение товара
7 description text описание товара

В таблице client хранятся данные о клиентах интернет-магазина.

Таблица 5. client – информация о покупателях


№ Идентификатор Тип данных Наименование
1 id int(11) первичный ключ
2 login varchar(30) логин покупателя
3 password varchar(30) пароль покупателя
4 firstname varchar(50) фамилия покупателя
5 lastname varchar(50) имя покупателя
6 email varchar(30) email покупателя
7 address text адрес покупателя
8 phone varchar(30) телефон покупателя

Таблицы comment и answer_comment предназначены для организации


обратной связи. Таблица comment содержит все сообщения от посетителей
интернет-магазина.

Таблица 6. comment – информация о заказах


№ Идентификатор Тип данных Наименование
1 id int(11) первичный ключ
2 firstname varchar(50) автор сообщения
3 email varchar(30) email посетителя

48
4 date date дата заказа
5 text text текст комментария
наличие ответа:
6 answer tinyint(1)  0 – отсутствие ответа;
 1 – наличие ответа.
статус комментария:
7  0 – ожидает одобрения;
mod int(1)
 1 – одобрен;
 2 – запрещен.

Таблица answer_comment содержит ответы администраторов на


сообщения от посетителей интернет-магазина.

Таблица 7. answer_comment – информация о заказах


№ Идентификатор Тип данных Наименование
1 id int(11) первичный ключ
2 id_comment int(11) id комментария
3 answer_text text текст ответа

На рисунке 16 изображены связи между таблицами базы данных.

49
Рисунок 16. Схема базы данных

3.3 Реализация администраторской части


интернет-приложения
50
3.3.1 Диаграмма классов

Диаграмма классов представлена в приложении 2.


Реализованные классы интернет-приложения разделены на два типа:
классы, входящие в состав ядра приложения и классы модулей
администраторской части.
Ядро приложения – множество служебных классов для обработки
запросов, подключения к удаленной базе данных, генерирования
представления, а также классы контроллера и модели, от которых будут
наследоваться все классы контроллеров и моделей модулей приложения.
В процессе разработки были реализованы следующие классы
контроллеров прикладных модулей: “главная страница”, “заказы”,
“категории”, “товары”, “пользователи”, “комментарии”.
Для реализации ajax-запросов был реализован специальный
программный файл с помощью библиотеки Jquery. Он принимает запрос от
приложения, перенаправляет их соответствующему методу контроллера и
выводит результат прямо на страницу приложения.
Исходные листинги представлены в приложении 3. В силу того, что
листинги всех компонентов заняли бы более 100 страниц, то представлены
только исходные коды ядра и модуля «Заказы».

3.3.2 Описание ядра интернет-приложения

Router – Класс-маршрутизатор.
Отвечает за анализ запросов, выделяя запрашиваемый контроллер и
действие и перенаправляя данный запрос. Блок схема алгоритма работы
анализа запросов представлена на рисунке 17.

51
Рисунок 17. Блок схема процесса анализа запросов

Класс содержит 2 метода:


 getInstance() – реализует шаблон “Одиночка”, гарантирующий
наличие у класса только одного экземпляра, и предоставляющий к
нему глобальную точку доступа.

52
 start() – выделяет из текущего запроса контроллер и его метод, а
также передаваемые параметры, затем создает объект контроллера и
вызывает его метод.

View – Класс генерации представления.


Класс получает шаблон представления и передаваемые ему
переменные и генерирует из них представление приложения. Содержит 2
метода:
 fetch_part($template, $params ) – подключает шаблон и
устанавливает для него переменные.
 render($template, $params) – генерирует представление.

Database – Класс соединения с базой данных.


Отвечает за соединение с удаленной базой данных и его закрытие.
 connect() – устанавливает соединение с базой данных.
 close() – закрывает соединение с базой данных.

Model – Класс базовой модели.


Класс наследуется от Database и содержит всего один метод:
 __construct() – конструктор класса, вызывает метод родительского
класса для соединения с базой данных.
Все реализуемые модели интернет-приложения будут наследоваться от
базовой модели.

Controller – Класс базового контроллера.


Класс, от которого будут наследовать все контроллеры приложения.
Методы:
 __construct() – конструктор класса, создает экземпляр объекта
класса представления.

53
 get_view() – устанавливает общий для всего интернет-приложения
шаблон представления.

AJAX-файл.
Принимает запрос от приложения, перенаправляет их
соответствующему методу контроллера и выводит результат прямо на
страницу приложения.
 showBox(id) – выводит список купленных товаров в виде
всплывающего окошка. Принимает на вход ID заказа.
 hideBox() – закрывает окошко со списком купленных товаров.
 boxAddEditShow() – выводит на экран окно добавления
(редактирования).
 deleteItemOrder(idProduct, idOrder) – удаляет товар из текущего
заказа и обновляет сумму заказа. Принимает на вход ID товара и
текущего заказа.
 boxListShow() – выводит список статусов заказа.
 changeStatus(id) – изменяет статус заказа. Принимает на вход ID
заказа.
 editClient(id) – редактирует информацию о клиенте. Принимает на
вход ID заказа.
 addItemOrder(idOrder) – добавляет товар в текущий заказ и
обновляет сумму заказа. Принимает на вход ID заказа.
 getChildCategory(id) – подгружает на страницу дочерние категории.
Принимает на вход ID родительской категории.
 addProduct() – добавляет новый товар в базу данных.
 editProduct(id) – редактирует информацию о товаре в базе данных.
Принимает на вход ID товара.
 deleteProduct(id) – удаляет товар из базы данных. Принимает на вход
ID товара.

54
 addCat() – добавление новой категории.
 editCat(id) – редактирование информации о категории. Принимает
на вход ID категории.
 yesComment(id) – одобрение комментария посетителя. Принимает на
вход ID сообщения.
 noComment(id) – запрещение комментария посетителя. Принимает
на вход ID сообщения.
 addAnswer(id) – добавление ответа администратора. Принимает на
вход ID сообщения.

3.3.3 Описание модулей интернет-приложения

Модуль “Главная страница”.


Данный модуль отвечает за отображение главной страницы интернет-
магазина, в котором будут отображаться новые заказы и последние
комментарии пользователей.
Класс контроллера Controller_Index содержит следующие методы-
действия:
 index – отвечает за генерирование шаблона главной страницы и
вызов модели, извлекающий из базы данных заказы со статусом
«новый».
Класс модели Model_Index содержит всего один метод:
 get_list_new_order() – производит выборку из таблицы «Заказы»
поля со статусом новый.
 get_list_new_comment() – производит выборку из таблицы
«Комментарии» комментарии, ожидающие модерации.

Модуль “Заказы”.
Данный модуль отвечает за работу с заказами интернет-магазина.
Контроллер Controller_Order содержит следующие методы:
55
 index- генерирует шаблон главной страницы заказов и вызывает
модель, выводящий все заказы, сортированные в обратном порядке.
 about – формирует страницу, отображающую полную информацию
об отдельном заказе, идентификационный номер которого
передается через метод GET.
 delete – удаляет товар из заказа и обновляет общую сумму заказа.
Принимает на вход идентификаторы товара и заказа. Вызывается с
помощью AJAX-запроса.
 newstatus – действие, изменяющий статус текущего заказа и
вызываемое AJAX-запросом. Принимает на вход идентификатор
заказа и новый статус заказа.
 additem – добавление товара в текущий заказ через AJAX, принимая
идентификатор заказа, идентификатор товара и его количество и
передавая их в базу данных.
Класс модели Model_Order содержит следующие методы:
 get_num_order() – определяет количество заказов в базе данных.
 get_list_order($start, $per) – формирует список заказов.
 get_order_info_client($id_order) – формирует список заказов
отдельного пользователя.
 get_about_order($id_order) – возвращает полную информацию о
заказе, включая список товаров в заказе и информацию о
покупателе.
 get_list_order_item($id_order) – возвращает детальную информацию
о пунктах, входящих в состав отдельного заказа.
 update_order($id_product, $id_order) – обновляет общую стоимость
заказа.
 delete_product_order($id_product, $id_order) – удаляет товар из
заказа.
 get_amount_order($id_order) – возвращает общую стоимость заказа.

56
 update_status_order($id_order, $new_status) – изменяет статус заказа.
 add_item_order($id_order, $id_product, $name, $count) – добавление
товара в заказ.

Модуль “Категории”.
Модуль отвечает за работу с категориями товаров. Контроллер модуля
Controller_Category содержит следующие действия:
 index – вызывает представление главной страницы для работы с
категориями в виде раскрывающегося дерева. По умолчанию
выводятся главные категории. При нажатии на кнопку раскрытия
узла дерева, вызывается метод parent, в который передается
идентификатор родительской категории.
 about – формирует страницу, выводящую информацию о категории.
Принимает в качестве параметра идентификатор этой категории.
 parent – выводит дерево дочерних категорий. Вызывается AJAX
методом и принимает на вход идентификатор родительской
категории.
 add – добавление новой категории. Вызывается AJAX методом и
принимает на вход идентификатор родительской категории и
название новой категории.
 edit – редактирование информации о категории, принимает
идентификатор, новое название категории и вызывается
посредством AJAX.
Класс модели Model_Category содержит следующие методы:
 get_main_category() – возвращает список главных категорий.
 get_about_category($id_category) – получение информации о
категории.
 get_child_category($id_parent) – формирование списка дочерних
категорий.

57
 get_list_category() – возвращает список категорий.
 tree_category($list, $id_parent, $select, $t='') – рекурсивная функция
для составления дерева категорий, по отношению к родительской
категории.
 add_new_category($title, $id_parent) – добавление новой категории.
 edit_category($id_category, $title, $id_parent, $old_parent) -
редактирвание информации о категории.

Модуль “Товары”.
Данный модуль служит для работы со списком товаров.
В класс модуля Controller_Product входят следующие методы:
 index – формирует главную страницу и выводит список всех товаров
из базы данных.
 about – генерирует информационную страницу об отдельном
товаре, принимает на вход идентификатор товара.
 add – добавляет в базу данных новый товар посредством AJAX
запроса. Принимает на вход название нового товара, категории, к
которой он относится, количество и стоимость.
 edit – редактирование информации о товаре, вызываемый AJAX
методом и принимающим на вход новое название товара, его
количество и стоимость.
 delete – удаление товара из базы данных. Принимает идентификатор
удаляемого товара. Вызывается средствами AJAX.
 upload – добавление изображения товара.
Класс модели Model_Product содержит следующие методы:
 get_num_product() – определение количества товаров в базе данных.
 get_list_product($start, $per) – формирует список товаров.
 get_about_product($id) – возвращает информацию о товаре.

58
 get_product_image($id) – выводит строку, состоящую из названий
изображений товаров через символ “|”.
 add_new_product($new_product) – добавляет в базу данных нового
товара.
 edit_product($id, $product) – редактирование информации о товаре.
 delete_product($id) – удаление товара.
 add_images($id, $img) – добавление изображения товара.

Модуль “Покупатели”.
Предназначен для работы с пользователями.
Контроллер модуля Controller_Client содержит следующие действия:
 index – формирует главную страницу, выводящий список всех
покупателей интернет-магазина.
 about – генерирует страницу, выводящую информацию о покупателе
и всех его заказов. Принимает на вход идентификатор покупателя.
 order – формирование страницы, выводящую информацию о
содержимом отдельного заказа покупателя. Вызывается AJAX
методом. Принимает идентификатор пользователя и заказа.
 edit – редактирование информации о покупателе. Принимает на вход
идентификатор пользователя, и новые данные о покупателе.
Вызывается AJAX методом.
Класс модели содержит следующие методы:
 get_num_client() – возвращает количество покупателей.
 get_list_client($start, $per) – формирует список покупателей.
 get_info_client($id_client) – получение информации о покупателе.
 get_list_order_client($id_client) – формирование списка заказов
покупателя.
 edit_data_client($id_client, $new_data) – редактирование информации
о покупателе.
59
Модуль “Обратная связь”.
Данный модуль отвечает за переписку с пользователями интернет-
магазина.
Контроллер Controller_Comment содержит следующие методы:
 index- генерирует шаблон главной страницы переписки и вызывает
модель, выводящий все комментарии, сортированные в обратном
порядке.
 about – формирует страницу, отображающую информацию о
сообщении пользователя, идентификационный номер которого
передается через метод GET.
 yes_comment – одобряет комментарий. Принимает на вход
идентификаторы сообщения. Вызывается с помощью AJAX-запроса.
 no_comment – запрещает комментарий. Принимает на вход
идентификаторы сообщения. Вызывается с помощью AJAX-запроса.
 add_answer – добавление ответ на комментарий через AJAX-запрос,
принимая идентификатор комментария и текст сообщения ответа.
Класс модели Model_Order содержит следующие методы:
 get_num_comment()– определяет количество сообщений
пользователей в базе данных.
 get_list_comment($start, $per)– формирует список комментариев.
 get_about_comment($id) – возвращает информацию о комментарии
пользователя.
 change_status_comment ($id_comment, $status) – изменение статуса
модерации комментария.
 add_answer_comment($id_comment, $text) – добавление ответа на
комментарий пользователя.

60
ГЛАВА 4. ЭКОНОМИКО-ОРГАНИЗАЦИОННЫЙ
РАЗДЕЛ

4.1 Экономическое обоснование разработки и использования


программного средства

В данном разделе дипломной работы определяются следующие показатели:


- трудоёмкость и стоимость процесса разработки программного
средства;
- срок реализации программного средства;
- экономия затрат на оплату машинного времени;
- экономия затрат на заработную плату;
- экономия материальных затрат;
- общая годовая экономия текущих эксплуатационных затрат;
- капитальные затраты, связанные с освоением системы;
- расчётный коэффициент экономической эффективности;
- срок окупаемости долгосрочных инвестиций.
Разработка программы предусматривает проведение всех стадий
проектирования (техническое задание, эскизный проект, технический проект,
рабочий проект) и относится к 3-ей группе сложности. По степени новизны
программный продукт относится к группе «В».

4.1.1 Определение трудоёмкости разработки программного средства

Общий объём разработанного ПС (V0):


V0 = 10000 условных машинных команд

61
Общая трудоемкость разработки программного средства (ПС)
рассчитывается по формуле
T 0 =K сл⋅Т р (4.1)
где Тр – значение трудоемкости, определенной
по объему разрабатываемого ПС для соответствующей группы
сложности, Ксл – дополнительный коэффициент сложности.
На основании общего объема ПС и группы сложности определим, что
такому объему условных машинных команд будут соответствовать затраты
труда Тр = 445 чел.-дн.
Коэффициент сложности рассчитывается по следующей формуле:
n
К сл =1+ ∑ К i (4.2)
i =1
где Кi – коэффициент, учитывающий уровень
повышения сложности по дополнительным характеристикам ПП, n –
количество дополнительно учитываемых характеристик.
Ксл =1 + 0.08 = 1,08 (4.3)
Таким образом, общая трудоемкость равна
T 0 =445⋅1 , 08=356 чел.-дн. (4.4)
Трудоемкость каждой стадии разработки, учитывающего уровень
повышения сложности ПС:

эскизный проект (ЭП):


Т ЭП =L эп⋅K H⋅T 0 , (4.5)

техническое задание (ТЗ):


Т ТЗ= Lтз⋅K H⋅T 0 , (4.6)

технический проект (ТП):


Т ТП =Lтп⋅K H⋅T 0 , (4.7)

рабочий проект (РП):


Т РП =L рп⋅K H⋅К Т⋅T 0 , (4.8)

внедрение (ВН):
Т ВН =Lвн⋅K H⋅T 0 ,

(4.9)

62
где Li – удельный вес трудоемкости i-ой стадии разработки, Кн –
поправочный коэффициент, учитывающий степень новизны ПП, Кт –
поправочный коэффициент, учитывающий степень использования в
разработке типовых стандартных программ.
Разрабатываемое приложение можно отнести к группе «В» с
коэффициентом новизны Кн = 0,7 и коэффициентами удельных весов
трудоемкости: Lэп = 0,09, Lтз = 0,07, Lтп = 0,07, Lрп = 0,61, Lвн = 0,16.
Кроме того, степень охвата реализуемых функций разрабатываемого сайта
типовыми ПС выше 60%, следовательно, поправочный коэффициент Кт =
0,6. Отсюда найдем значения трудоемкостей каждой стадии разработки:
T ЭП =0 , 09⋅0 ,7⋅356≈22 , 4 чел-дн,

T ТЗ=0 , 07⋅0 , 7⋅356≈17 ,5 чел-дн,

T ТП =0 , 07⋅0 , 7⋅356≈17 ,5 чел-дн,

T РП =0 , 61⋅0 , 7⋅0 ,6⋅356≈91 , 2 чел-дн,

T ВН =0 , 16⋅0 , 7⋅356≈40 чел-дн.

Уточненная трудоемкость рассчитывается с учетом распределения по


стадиям рассчитывается по формуле:
k
T у =∑ Т i
i=1 , (4.10)
где Тi - трудоёмкость разработки i-й стадии, n – количество стадий
разработки, таким образом:
T у =22. 4+17 .5+17 .5+91. 2+40=188 .6 чел-дн
Необходимый срок реализации ПС (в годах) определяют по формуле:
n Ti
t =∑
i =1 N ⋅Ф
i (4.11)

63
где Ni – количество разработчиков, принимающих участие в разработке ПС
на i-й стадии; Ф – фонд времени одного разработчика в течение года, Тi -
трудоемкость разработки i-й стадии.
Таким образом необходимый срок реализации ПС составляет:
188 , 6
t= ≈0 , 3
3⋅230 года приблизительно 98 дней

4.1.2 Определение стоимости разработки и освоения программного


средства

Затраты, связанные с разработкой и освоением системы, включают


затраты на разработку и освоение ПС :
K пс =К разр + К осв , (4.12)
Стоимость разработки:

К разр =
З ⋅W ⋅t
мес н
раз + Ц ⋅Т ⋅К
мч раз мульт
Д , (4.13)
где Змес – среднемесячная заработная плата одного разработчика, руб.;
WH – коэффициент отчислений на социальные нужды (1,26);
Д – среднее число рабочих дней в месяц;
Цмч – цена одного часа машинного времени, руб.;
Траз – трудоёмкость работ, чел.-дн.(принимается равной 20% от Ту);
Кмульт – коэффициент мультипрограммности, характеризующий способ
организации работы, обеспечивающий одновременное выполнение
нескольких программ.
13000⋅1 , 26
К разр = ⋅98+ 75⋅38⋅1=75815,5
22 руб.
Стоимость освоения ПС:

К осв =
З ⋅W ⋅t
мес н
осв + Ц ⋅Т ⋅К
мч осв мульт
Д , (4.14)

где toce – трудоёмкость освоения системы (10% от Ту), чел.-дн.,

64
Тосв – затраты машинного времени на основание ПС пользователем (3 дня по 8
часов • 0,75 = 18 часов).
13000⋅1 , 26
К разр = ⋅18,86+75⋅18⋅1=15392,13
22 руб.

Тогда Кпс = 75815,5+15392,13= 91207,6 руб.

4.1.3 Расчёт показателей экономической эффективности


программного средства

Расчёт экономии затрат на оплату машинного времени при использовании


ПС (при замене базового ПС) в расчёте на полный объём работ:

t −t
Э мв = Ц ⋅К
мч мульт⋅100
1 2
V ⋅N
⋅ 0 обр
, (4.15)
где Nобр – число обращений к ПС за последний год,
t1 и t2 - средний расход машинного времени на единицу работ,
выполняемых с помощью базового и нового программного средства, час на
100 условных единиц.
0 ,66−0 , 25
Э мв=75⋅1⋅ ⋅10000⋅252=774900
100 руб.
Экономия затрат на заработную плату в организации пользователя:
Э зрп= З ⋅W ⋅( Ш − Ш )⋅Ч
мес н 1 2 мес , (4.16)
где Ш 1 , Ш2 – количество сотрудников в организации пользователя при
базовом и новом варианте ПС, чел.,
Чмес - количество месяцев в году.
Э зрп=13000⋅1 ,26⋅( 4−1)⋅12=589680 руб.
Амортизация вычислительной техники:
А г= В ⋅0 , 5⋅N
т а , (4.17)
где Вт - первоначальные затраты на приобретение техники, руб.;
0,5 - коэффициент, отражающий использование техники,
приходящихся на данное ПС в год;
65
Na - коэффициент амортизационных отчислений (в год).
А г=100000⋅0 ,5⋅0 , 15=7500 руб
Общая экономия текущих затрат за год составит:
Э г= Э мв + Э мз + Э зрп− А г . (4.18)
Э г=774900+504 +589680−7500=1357584 руб.
Годовой экономический эффект:
Э ф= Э +Е г норм⋅ К пс . (4.19)
Э ф=1357584+0 ,3⋅91207,6=1384946,3 руб.
Ожидаемый срок окупаемости всех инвестиций:

Т инв =
( К +В пс т)

Э г . (4.20)
(91207 , 6+100000 )
Т инв = =0,14
1384946 , 3 года.
Ожидаемый срок окупаемости инвестиций в ПС:

Т пс =
К пс

Э г . (4.21)
91207 , 6
Т пс= =0,07
1384946 , 3 года.
Коэффициент сравнительной экономической эффективности:
1 1
Еинв = Еинв =
Т инв , Т пс (4.22)
1 1
Еинв = =0 ,7 Еинв = =14 ,3
0 , 14 , 0 , 07
Таким образом, экономическое обоснование разработки ПС показывает
целесообразность его применения, т.к. годовая экономия составит 1357584
руб., а годовой экономический эффект - 135946,3 руб. Ожидаемый срок
окупаемости инвестиций в ПС – в течение двух месяцев.

66
ГЛАВА 5. ЭКОЛОГИЧНОСТЬ И БЕЗОПАСНОСТЬ
ПРОЕКТА

При работе за компьютером программист подвергается воздействию


ряда опасных и вредных производственных факторов, таких как:
 плохой микроклимат помещения;
 недостаточная освещенность рабочего места;
 превышающий допустимые нормы шум;
 опасность поражения электрическим током.
Работа за компьютером также характеризуется значительным
умственным напряжением и нервно-эмоциональной нагрузкой
программистов, высокой зрительной напряженностью и достаточно большой
нагрузкой на мышцы рук при работе с клавиатурой.

5.1 Анализ опасных и вредных факторов, воздействующих на


программиста

5.1.1 Уровень шума на рабочем месте


67
На человека постоянно воздействуют различные акустические факторы
(шум, ультразвук и инфразвук), действие которых на организм человека не
ограничиваются воздействием на орган слуха. Повышенный уровень шума
влияет на нервную систему, способствует психическим заболеваниям.
Шум является общебиологическим раздражителем, приводит к
нарушению сна, утомление, снижению внимания, человек становится
забывчивым раздражительным, подвержен стрессам и депрессиям.
Основными источниками шума в компьютере являются:
 Вентиляторы:
o вентилятор блока питания,
o вентилятор процессора,
o вентилятор видеокарты.
 Жесткий диск.
 Приводы оптических дисков.
К тому же корпус системного блока играет роль резонатора, привнося
низкочастотные составляющие в общую картину шума.

5.1.2 Монотонность труда

Монотонность труда человека характеризуется выполняемыми им


однообразной, порой не очень интересной, но необходимой работы. Под
влиянием монотонности он становится вялым и безучастным к работе.
Длительное пребывание в фиксированной рабочей позе, необходимость
ввода с клавиатуры большого количества информации, отсутствие
перерывов, — все это отрицательно действует на организм человека, приводя
к преждевременному утомлению.
Многие операции вынуждают программиста пребывать в позах,
требующих длительного статического напряжения мышц спины шеи, рук,
ног. Это приводит к появлению болезненности, одеревенелости и онемения в

68
мышцах шеи и плечевого пояса, болях в позвоночнике, болезненности и
одеревенелости в мышцах рук и ног.
Причиной болезней пальцев и кистей рук является специфика работы
на клавиатуре: программисты с высокой скоростью повторяют одни и те же
движения.

5.1.3 Недостаточная освещенность

Отсутствие или недостаточность освещения влияет на


функционирование зрительного аппарата, вызывает быструю усталость и
болезни глаз, снижает внимательность, а также способствует развитию
близорукости.
Низкий уровень освещенности вызывает сонливость и значительно
уменьшает производительность труда. Наблюдается также снижение
интенсивности обмена веществ в организме и ослабление его реактивности.
Повышенная яркость света, блики (отражение света от блестящих
поверхностей), пульсация светового потока (мерцание изображения)
оказывают вредное воздействие на здоровье человека – раздражение
зрительных органов, утомление, головные боли.

69
5.2 Разработка оптимальных условий труда

Вопросы, относящиеся к организации и охраны труда при работе за


компьютером, регулируются Трудовым кодексом Российской Федерации
и СанПиН 2.2.2/2.4.1340-03 "Гигиенические требования к ПЭВМ и
организации работы".

5.2.1 Снижение уровня шума

Уровни шума на рабочих местах не должны превышать значений,


установленных СанПиН 2.2.4/2.1.8.562-96 и составляют не более 50 дБА
(акустический децибел). На рабочих местах в помещениях, где размещены
шумные агрегаты, уровень шума не должен превышать 75 дБА.
В настоящее время существуют полностью бесшумные настольные
компьютеры, в которых применяется жидкостное охлаждение,
звукопоглощающий корпус, бесшумный жесткий диск. Однако такие
решения обходятся в кругленькую сумму и не подходят для условий
предприятия.
Стоит отметить, что приемлемый уровень шума для каждого человека
индивидуален, но в большинстве случаев уровень до 30 дБ на расстоянии 1 м
можно считать комфортным.
70
Существуют также бюджетные решения для снижения уровня шума,
исходящих от компьютера.
Непосредственно на весь выходной шум системного блока влияет
архитектура корпуса системного блока и материал, из которого он сделан.
Лучше всего выбирать корпус с возможностью установки 1-2 фронтальных
вентиляторов, 1 на задней стенке и 1 вентилятором на верхней крышке.
Критерии выбора малошумных вентиляторов для корпуса и видео-
карты следующие:
1. большой диаметр лопастей (от 80 мм);
2. низкое значение силы тока (0.1-0.2 А);
3. редкое расположение лопастей;
4. гидроподшипники.
Также эффективным методом снижения шума является уменьшение
напряжения на вентиляторах. На разъёмах определённых конструкций это
делается простой установкой в свободные контакты резисторов. Уменьшение
скорости вращения вентиляторов позволяет снизить шум от вентилятора.

5.2.2 Устранение монотонности труда

С целью снижения напряженности труда и уменьшения отрицательного


влияния монотонности необходимо проведение следующих мероприятий:
 перерывы в работе;
 чередование различных работ,
 введение в режим труда функциональной музыки.
Для сохранения здоровья программиста следует придерживаться
некоторых несложных правил:
 удобное рабочее место и обеспечение нормального функционирования
опорно-двигательного аппарата и кровообращения;
 максимальное время работы за компьютером в течение рабочего дня не
должно превышать 8-10 часов;
71
 перерывы в работе за компьютером продолжительностью 10 минут
через каждые 1 часа работы;
 продолжительность непрерывной работы за компьютером без перерыва
не должна превышать 2 часа;
 нерегламентированные перерывы длительностью 1-3 минуты.
Чтобы избежать ряда серьезных заболеваний, связанных с
неподвижностью при работе за компьютером, к рабочему месту предъявляют
ряд требований:
1. Рабочий стол должен иметь пространство для ног высотой не менее 60 см,
шириной — не менее 50 см, глубиной на уровне колен — не менее 45 см и
на уровне вытянутых ног — не менее 65 см.
2. Рабочий стул или кресло должны быть подъемно-поворотным,
регулируемым по высоте и углам наклона сиденья и спинки, а также
расстоянию спинки от переднего края сиденья.
3. Клавиатуру следует располагать на расстоянии 10-30 см от края,
обращенного к программисту.
Следует также придерживаться следующих простых правил:
1. Для предотвращения усталости кистей рук следует использовать удобные
клавиатуру и мышь.
2. Ровно держать спину.
3. Стараться больше двигаться во время перерывов.

5.2.3 Принятие мер для снижения утомляемости глаз

Лучшим решением для организации освещения помещения будет


использование искусственного света. Так как солнечный свет непостоянен и
дает блики, то идеальным помещением будет просторная светлая комната,
где компьютер расположен далеко от окна.
Следует избегать работы за компьютером в ночное время суток.

72
Монитор компьютера следует располагаться на расстоянии не ближе
50 см от глаз пользователя.
При длительной работе за компьютером, необходимы перерыв каждые
полчаса. В перерывах нужно постараться выполнять упражнения для глаз,
подходящим решением является трехминутные перерывы каждый час. Также
следует индивидуально настроить монитор так, чтобы его яркость и
контрастность были комфортными для зрения.

ЗАКЛЮЧЕНИЕ

Создание современных интернет-приложений требует от


разработчиков постоянного слежения за совершенствованием технологий. В
рамках данной дипломной работы были рассмотрены один из самых
современных и перспективных подходов к созданию сайтов без перезагрузки
страниц — технологию AJAX и широко применяемая концепция разработки
логики веб-приложений – шаблон MVC.
В ходе выполнения дипломного проектирования были использованы
современные web-технологии и разработана рабочая версия
администраторской части интернет-приложения. Реализована базовая
функциональность, разработаны схемы программы, структура базы данных
и модули интернет-приложения.
Интернет-приложение создано на базе свободно распространяемого
открытого программного обеспечения, является кроссплатформенным и
предполагает возможности расширения.
Также была рассчитана экономическая эффективность разработки
интернет-приложения и были рассмотрены вопросы, связанные с
безопасностью труда на рабочем месте разработчика программного
обеспечения.
73
СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ

1. Беляков Р.И. Безопасность жизнедеятельности на производстве.


Охрана труда. – СПб.: “Лань”, 2006. – 512 с.
2. Веллинг Л., Томсон Л. Разработка веб-приложений с помощью PHP и
MySQL, 4-е изд.: Пер. с анг. - М.: ООО “И. Д. Вильямс”, 2012. – 848 с.
3. Гамма Э., Хелм Р., Джонсон Р., Влиссидес Дж. Приемы объектно-
ориентированного проектирования. Паттерны проектирования. –
СПб.: “Питер”, 2007. – 366 с.
4. Гутманс Э., Баккен С., Ретанс Д. PHP 5. Профессиональное
программирование.: Пер. с англ. – СПб.: “Символ-Плюс”, 2006. – 704
с.
5. Дари К., Бринзаре Б., Черчез Тоза Ф., Бусика М. AJAX и PHP:
разработка динамических веб-приложений. – СПб.: “Символ-Плюс”,
2007. – 336 с.
6. Дейт Дж. К. Введение в системы баз данных. 8-е издание. – М.: ООО
“И. Д. Вильямс”, 2005. – 1328 с.

74
7. Зандстра М. PHP: объекты, шаблоны и методики программирования,
3-е изд.: Пер. с анг. – М.: ООО “И. Д. Вильямс”, 2012. – 560 с.
8. Крейн Д., Паскарелло Э., Даррен Д. AJAX в действии. – М.: ООО “И.
Д. Вильямс”, 2006. – 640 с.
9. Маклафлин Б. Изучаем Ajax – СПб.: “Питер”, 2007. – 443c.
10. Маринченко А.В. Безопасность жизнедеятельности (учебное
пособие) – М.: ИТК “ Дашков и Ко”, 2007. – 360с.
11.Фаулер М. Архитектура корпоративных программных приложений.:
Пер. с анг. – М.: ООО “И. Д. Вильямс”, 2006. – 544 с.
12.Фримен Э., Фримен Э., Сьерра К., Бейтс Б. Паттерны проектирования.
– СПб.: “Питер”, 2011. – 656 с.
13.Хольцнер C. Ajax. Библия программиста. — М.: “Диалектика”, 2009. –
553 с.
14.Шлосснейгл Дж. Профессиональное программирование на
PHP.: Пер. с англ. – М.: ООО “И. Д. Вильямс”, 2006. – 624 с.
15. Sweat, J. PHP | Architect's Guide to PHP Design Patterns / J. Sweat
– Marco Tabini & Associates, Inc., 2005. – 340 c.
16. Гарретт Д. Д. «Ajax: A New Approach to Web Applications» [В
Интернете]. – 2005г. – http://www.adaptivepath.com/publications/essays/
archives/000385.php
17. Шалаев Ю. Снижение шума системного блока компьютера [В
Интернете]. – 2008 г. – http://oldoctober.com/ru/snizhenie-shuma-
sistemnogo-
bloka/
18. http://www.w3.org/ - Официальный сайт Консорциума Всемирной
паутины.
19. http://php.net – Официальная документация языка PHP.
20. http://jquery.com/ - Официальный сайт проекта jQuery.

75
ПРИЛОЖЕНИЯ

Приложение 1. Примеры страниц интернет-приложения

Главная страница

76
Рисунок 1. Главная страница интернет-приложения

Страница «Заказы»

Рисунок 2. Страница управления заказами

77
Рисунок 3. Страница просмотра полной информации о заказе

Рисунок 4. AJAX-страница изменения данных о покупателе


78
Страница «Каталог товаров»

Рисунок 5. Страница отображения категорий товаров

Рисунок 6. AJAX-страница добавления нового товара

79
Рисунок 7. Страница просмотра информации о товаре

80
Рисунок 8. AJAX-страница редактирования информации о товаре
Приложение 2. Диаграмма классов

Рисунок 9. Диаграмма классов интернет-приложения

81
Приложение 3. Программные листинги

Листинг 1. Скрипт инициализации базы данных


--
-- База данных: `eshop`
--

-- --------------------------------------------------------
--
-- Структура таблицы `answer_comment`
--

CREATE TABLE IF NOT EXISTS `answer_comment` (


`id` int(11) NOT NULL AUTO_INCREMENT,
`id_comment` int(11) NOT NULL,
`text_answer` text NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=2 ;

-- --------------------------------------------------------
--
-- Структура таблицы `category`
--

CREATE TABLE IF NOT EXISTS `category` (


`id` int(11) NOT NULL AUTO_INCREMENT,
`title` varchar(50) NOT NULL,
`id_parent` int(11) NOT NULL,
`children` tinyint(1) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=59 ;

-- --------------------------------------------------------

82
--
-- Структура таблицы `client`
--

CREATE TABLE IF NOT EXISTS `client` (


`id` int(11) NOT NULL AUTO_INCREMENT,
`login` varchar(30) NOT NULL,
`password` varchar(30) NOT NULL,
`firstname` varchar(50) NOT NULL,
`lastname` varchar(50) NOT NULL,
`email` varchar(30) NOT NULL,
`address` text NOT NULL,
`phone` varchar(30) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=13 ;

-- --------------------------------------------------------
--
-- Структура таблицы `comment`
--

CREATE TABLE IF NOT EXISTS `comment` (


`id` int(11) NOT NULL AUTO_INCREMENT,
`firstname` varchar(50) NOT NULL,
`email` varchar(50) NOT NULL,
`data` date NOT NULL,
`text` text NOT NULL,
`answer` tinyint(1) NOT NULL,
`mod` int(1) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=4 ;

-- --------------------------------------------------------
--
-- Структура таблицы `item_order`

83
--

CREATE TABLE IF NOT EXISTS `item_order` (


`id` int(11) NOT NULL AUTO_INCREMENT,
`id_order` int(11) NOT NULL,
`id_product` int(11) NOT NULL,
`name` varchar(150) NOT NULL,
`count` int(11) NOT NULL,
`cost` float NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=16 ;

-- --------------------------------------------------------
--
-- Структура таблицы `order`
--

CREATE TABLE IF NOT EXISTS `order` (


`id` int(11) NOT NULL AUTO_INCREMENT,
`id_user` int(11) NOT NULL,
`amount` float NOT NULL,
`date` date NOT NULL,
`status` varchar(50) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=12 ;

-- --------------------------------------------------------
--
-- Структура таблицы `product`
--

CREATE TABLE IF NOT EXISTS `product` (


`id` int(11) NOT NULL AUTO_INCREMENT,
`id_category` int(11) NOT NULL,
`name` varchar(150) NOT NULL,

84
`price` int(11) NOT NULL,
`quantity` int(11) NOT NULL,
`image` varchar(250) NOT NULL,
`description` text NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=18 ;

Листинг 2. Исходные коды ядра приложения


/www/core/router.php
<?php
/**
* Router
*
* Класс - маршрутизатор
*/
class Router{

static $_instance;
/**
* Паттерн "одиночка"
*
* @return object
*/
static function getInstance() {
if(!(self::$_instance instanceof self))
self::$_instance = new self();
return self::$_instance;
}

/**
*
*/
function start() {
$request = $_SERVER['REQUEST_URI'];
$splits = explode ('/', trim($request,'/'));

//выделяем текущий контроллер


$controller = !empty($splits['0'])
? 'Controller_'.ucfirst($splits['0'])
: 'Controller_Index';

//выделяем текущее действие


$action = !empty($splits['1'])
? 'action_'.$splits['1']
: 'action_index';

//выделяем текущие параметры


85
if (!empty($splits[2])) {
$keys = $value = array();
for ($i = 2, $cnt = count($splits); $i < $cnt; $i++) {

if ($i%2 == 0)
$keys[] = $splits[$i];
else
$value[] = $splits[$i];
}
if (count($keys) == count($value)) {
$params = array_combine ($keys, $value);
}else {
echo 'ERROR';
}

if (isset ($params))
$_GET = $params;

}
if(class_exists($controller)) {
// создаем объект контроллера
$controller_name = new $controller;

if (method_exists($controller_name, $action)) {
// вызываем действие контроллера
$controller_name->$action();
}else{
header("HTTP/1.0 404 Not Found");
echo 'К сожалению такой страницы не существует';
}

}else{
header("HTTP/1.0 404 Not Found");
echo 'К сожалению такой страницы не существует';
}
}

/www/core/database.php
<?php
/**
* Database
*
* Класс соединения с базой данных
*
*/
class Database{
86
public $connect;
public $database;

/**
* Соединение с базой данных
*
*/
function connect() {
$host = 'localhost';
$user = 'root';
$password = '';
$db = 'eshop';

$this->connect = mysql_connect ($host, $user,


$password)or die ('Ошибка соединения'.mysql_error ());
$this->database = mysql_select_db ($db, $this-
>connect)or die (mysql_error ());
mysql_set_charset('utf-8');
}

/**
* Закрытие соединения с базой данных
*/
function close() {
mysql_close($this->conn);
}
}

/www/core/model.php
<?php
/**
* Model
*
* Класс главной модели
87
*/
class Model extends Database {

function __construct() {
parent::connect();
}
}

/www/core/controller.php
<?php
/**
* Controller
* Класс главного контроллера
*/
class Controller {

/**
* Модель
*
* @var object
*
*/
public $model;
/**
*Представление
*
* @var object
*
*/
public $view;
/**
*Заголовок страницы
*
* @var string
*
88
*/
protected $title;
/**
*Содержание страницы
*
* @var string
*
*/
protected $content;

/**
* Конструктор класса
*
*/
function __construct() {
$this->view = new View();
$this->title = 'Панель управления: ';
}

/**
* Установка общего вида шаблона
*/
function get_view() {
$vars = array ('title' => $this->title,
'content' => $this->content);
echo $this->view->render('layout.php', $vars);
}
}

/www/core/view.php
<?php
/**
* View
*
* Класс генерации представления
89
*
*/
class View {

/**
* Подключение шаблона страницы
*
* @param string $template Подключаемый шаблон
* @param array $params Передаваемые переменные
* @return Подключаемый шаблон с установлеными переменными
*/
function fetch_part($template, $params = array ()) {
// Установка переменных для шаблона.
foreach ($params as $k => $v) {
$$k = $v;
}
ob_start();
include '/application/view/'.$template;
return ob_get_clean();
}

/**
* Генерация шаблона
*
* @param string $template Подключаемый шаблон
* @param array $params Передаваемые переменные
* @return Полностью сгенерированный шаблон
*/
function render($template, $params = array ()) {
return $this->fetch_part($template, $params);
}
}

/www/core/bootstrap.php
90
<?php
/**
* Файл загрузки ядра приложения
*
*/
include_once ("router.php");
include_once ("database.php");
include_once ("view.php");
include_once ("controller.php");
include_once ("model.php");

Листинг 3. Исходные коды файлов инициализации приложения


/www/.htaccess
AddDefaultCharset UTF-8
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [L]
RewriteRule ^.*$ index.php [L]

AuthType Basic
AuthName 'Authorization please'
AuthUserFile /home/admin/www/.htpasswd
Require valid-user

/www/index.php
<?php

include_once ("/core/bootstrap.php");
include ("/lib/pagination.php");

function __autoload($class){
$fname = str_replace('_', '/', strtolower($class));
91
require_once ('application/'.$fname.'.php');
}
$router = Router::getInstance();
$router->start(); // запускаем маршрутизатор

Листинг 4. Исходные коды модуля «Заказы»


Модель
/www/application/model/order.php
<?php
class Model_Order extends Model {

/**
* Определение колличества заказов
*
* @return integer колличество заказов
*/
function get_num_order() {

$sql = "SELECT `id`


FROM `order`";
$result = mysql_query($sql) or die (mysql_error());
$num_rows = mysql_num_rows($result);

return $num_rows;
}

/**
* Составление списка заказов
*
* @param integer $start начало выборки
* @param integer $per колличество отбираемых записей
* @return array список заказов
*/

92
function get_list_order($start, $per) {

$sql = "SELECT `order`.`id`,


`order`.`amount`,
`order`.`date`,
`order`.`status`,
`client`.`lastname`,
`client`.`firstname`
FROM `order`, `client`
WHERE `order`.`id_user` = `client`.`id`
ORDER BY `id` DESC
LIMIT $start, $per";
$result = mysql_query($sql) or die (mysql_error());

$list = array();
while ($row = mysql_fetch_assoc($result)){
$list[] = $row;
}
return $list;
}

/**
* Получение информации о заказе одного клиента
*
* @param integer $id_order ID заказа
* @return array
*/
function get_order_info_client($id_order) {

$sql = "SELECT `name`,`count`,cost`


FROM `item_order`
WHERE `id_order` = '$id_order'";
$result = mysql_query($sql) or die (mysql_error());

$list = array();
93
while ($row = mysql_fetch_assoc($result)){
$list[] = $row;
}
return $list;
}

/**
* Получение даных об отдельном заказе
*
* @param integer $id_order ID заказа
* @return array
*/
function get_about_order($id_order) {

$sql = "SELECT `order`.`id`,


`order`.`id_user`,
`order`.`date`,
`order`.`status`,
`order`.`amount`,
`client`.`lastname`,
`client`.`firstname`,
`client`.`email`,
`client`.`address`,
`client`.`phone`
FROM `order`, `client`
WHERE `order`.`id` = '$id_order' AND
`order`.`id_user` = `client`.`id`";
$result = mysql_query($sql) or die (mysql_error());

$list = array();
while ($row = mysql_fetch_assoc($result)){
$list[] = $row;
}
return $list;
}

94
/**
* Получение списка товаров в корзине
*
* @param integer $id_order ID заказа
* @return array
*/
function get_list_order_item($id_order) {

$sql = "SELECT `item_order`.`id_product`,


`item_order`.`name`,
`item_order`.`count`,
`item_order`.`id_order`,
`item_order`.`cost`,
`product`.`price`
FROM `item_order`, `product`
WHERE `item_order`.`id_order` = '$id_order'
AND`product`.`id`=`item_order`.`id_product`";
$result = mysql_query($sql) or die (mysql_error());

$list = array();
while ($row = mysql_fetch_assoc($result)){
$list[] = $row;
}
return $list;
}

/**
* Обновление заказа
*
* @param integer $id_product ID товара
* @param integer $id_order ID заказа
*/
function update_order($id_product, $id_order) {

95
$sql = "SELECT `cost`
FROM `item_order`
WHERE `id_order` = '$id_order' AND
`id_product` = '$id_product'";
$result = mysql_query($sql) or die (mysql_error());
$row = mysql_fetch_array ($result);

$sql = "UPDATE `order`


SET `amount` = `amount`- $row[0]
WHERE `id` = '$id_order'";
mysql_query($sql) or die (mysql_error());

/**
* Удаление товара из корзины
*
* @param integer $id_product ID товара
* @param integer $id_order ID заказа
*/
function delete_product_order($id_product, $id_order) {

$sql = "DELETE FROM `item_order`


WHERE `id_product` = '$id_product' AND
`id_order` = '$id_order'";
mysql_query($sql) or die (mysql_error());

/**
* Получение общей суммы заказа
*
* @param integer $id_order ID заказа
* @return iteger сумма заказа
*/
96
function get_amount_order($id_order) {

$sql = "SELECT `amount`


FROM `order`
WHERE `id` = '$id_order'";
$result = mysql_query($sql) or die (mysql_error());
$row = mysql_fetch_array ($result);
$amount = $row[0];

return $amount;
}

/**
* Обновление статуса заказа
*
* @param integer $id_order ID заказа
* @param string $new_status новый статус заказа
*/
function update_status_order($id_order, $new_status) {

$sql = "UPDATE `order`


SET `status` = '$new_status'
WHERE `id` = '$id_order'";
mysql_query($sql) or die ("ERROR:".mysql_error());
}

/**
* Получение цены товара
*
* @param integer $id_product ID товара
* @return integer цена товара
*/
function get_item_price($id_product){

$sql = "SELECT `price`


97
FROM `product`
WHERE `id` = '$id_product'";
$result = mysql_query($sql) or die (mysql_error());
$row = mysql_fetch_array ($result);
$price = $row[0];

return $price;

/**
* Доваление товара в корзину
*
* @param integer $id_order ID заказа
* @param integer $id_product ID товара
* @param string $name наименование товара
* @param integer $count колличество товара
* @return array
*/
function add_item_order($id_order, $id_product, $name,
$count) {

$price = $this->get_item_price($id_product);
$cost = $price * $count;
//обновить общую стоимость заказа
$sql = "UPDATE `order`
SET `amount` = `amount` + $cost
WHERE `id` = '$id_order'";
mysql_query($sql) or die (mysql_error());

//добавить новый пункт в заказ


$sql = "INSERT INTO `item_order` (`id_order`,
`id_product`,
`name`,`count`,
`cost`)
98
VALUES ('$id_order', '$id_product',
'$name','$count',
'$cost')";
mysql_query($sql) or die (mysql_error());

$new_item_order = array('id_order' => $id_order,


'id_product' => $id_product,
'name' => $name,
'count' => $count,
'cost' => $cost,
'price' => $price);
return $new_item_order ;
}}

Контроллер
/www/application/controller/order.php
<?php
/**
* Controller_Order
*
* Контроллер страницы заказов
*
*/
class Controller_Order extends Controller{

/**
* Формирование главной странцы заказов
*
*/
function action_index() {
$this->model = new Model_Order();
$list_order = array ();

//колличество заказов
$num_order = $this->model->get_num_order();
99
$per_page = (isset ($_GET['pagesize']))
? (int) ($_GET['pagesize'])
: 10;

$page = (isset ($_GET['page'])) ? (int)($_GET['page']): 1;


$paginat = new Pagination($num_order, $per_page,
$page);
$paginat->set_uri('/order/index');
$list_order = $this->model->get_list_order($paginat-
>start_row, $paginat->per_page);
$link = $paginat->create_pagination();
$page_size = $paginat->create_pagesize();

$this->title = $this->title .'Заказы';


$this->content = $this->view->render('order_index.php',
array ('list_order' => $list_order,
'num_order' => $num_order,
'page_size' => $page_size,
'links' => $link));
$this->get_view();
}

/**
* Формирование страницы информации о заказе
*
*/
function action_about() {
$this->model = new Model_Order();
$about_order = array ();

$id_order = isset($_GET['id']) ? intval($_GET['id']) : null;


$about_order = $this->model->get_about_order($id_order);
$item_order = $this->model->get_list_order_item($id_order);

100
$this->title = $this->title .'Заказы';
$this->content = $this->view->render('order_about.php',
array ('order' => $about_order,
'item_order' => $item_order));
$this->get_view();
}

/**
* AJAX удаление товара из заказа
*
* @return integer обновленная сумма заказа
*
*/
function action_delete() {
$this->model = new Model_Order();
$id_product = isset($_GET['product'])
? intval($_GET['product'])
: null;
$id_order = isset($_GET['order'])
? intval($_GET['order'])
: null;

$this->model->update_order($id_product, $id_order);
$this->model->delete_product_order($id_product,
$id_order);
$amount_order = $this->model->
get_amount_order($id_order);

echo json_encode($amount_order);
}

/**
* AJAX смена статуса заказа
*
* @return string новый статус заказа
101
*
*/
function action_newstatus() {
$this->model = new Model_Order();

$id_order = isset($_GET['id'])
? intval($_GET['id']) : null;
$status = (isset ($_POST['select']))
? ($_POST['select']) : "ERROR";
$this->model->update_status_order($id_order, $status);
echo $status;
}

/**
* AJAX добавление товара в заказ
*
* @return integer обновленная сумма заказа
*
*/
function action_additem() {
$this->model = new Model_Order();

$id_order = isset($_GET['id'])
? intval($_GET['id']) : null;
$id_product = (isset ($_POST['id_product']))
? ($_POST['id_product']) : "ERROR";
$name = (isset ($_POST['name']))
? ($_POST['name']) : "ERROR";
$count = (isset ($_POST['count']))
? ($_POST['count']) : "ERROR";

$new_item_order = $this->model->
add_item_order($id_order, $id_product, $name, $count);
$amount_order = $this->model->
get_amount_order($id_order);
102
$new_item_order['amount'] = $amount_order;

echo json_encode($new_item_order);
}
}

Представление
/www/application/view/layot.php
<!DOCTYPE HTML>
<html>
<head>
<title><?php echo $title?></title>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8">
<link rel="stylesheet" type="text/css" href="/css/
style.css">
<script type="text/javascript" src="/script/
jquery.js"></script>
<script type="text/javascript" src="/script/
admin.js"></script>
</head>
<body>
<div id="wrapper">
<div id="header">
<p>Панель администратора</p>
</div>

<div id="navigator">
<ul class="menu">
<li><a href="/">Главная</a></li>
<li><a href="/order">Заказы</a></li>
<li><a href="/category">Каталог товаров</a>
<ul>
<li><a href="/
category">Категории</a></li>
103
<li><a href="/product">Товар</a></
li>
</ul>
</li>
<li><a href="/client">Покупатели</a></li>
<li><a href="/comment">Обратная связь</a></
li>
</ul>
</div>

<div id="content">
<?php echo $content ?>
</div>
</div>

<div id="footer">
<p>&copy; 2013 Магомедрасулова Хадижат,
по всем вопросам обращайтесь по e-mail:
<a
href="mailto:khadizham@yandex.ru">khadizham@yandex.ru</a>
</p>
</div>
</body>
</html>

/www/application/view/order_index.php
<div class="content_caption">
<p>Список заказов<?php echo ' ('.$num_order.')' ?></p>
</div>
<div class="content_sheet">
<div class="per_page">
<?php echo $page_size ?>
</div>
<table>
<tr>
104
<th>ID</th>
<th>Статус</th>
<th>Дата</th>
<th>Покупатель</th>
<th>Сумма</th>
<th>Товары</th>
</tr>
<?php foreach ($list_order as $order): ?>
<tr>
<td><a href="/order/about/id/<?php echo $order['id'] ?
>"><?php echo $order['id'] ?></a></td>
<td><?php echo $order['status'] ?> </td>
<td><?php echo $order['date'] ?> </td>
<td><?php echo $order['lastname'].' '.$order['first-
name'] ?> </td>
<td><?php echo $order['amount']. ' RUR' ?> </td>
<td><a id="<?php echo $order['id'] ?>" href="#"
onmouseover="showBox(this.id)"
onmouseout="hideBox()"><img src="/
image/info.png" alt="info"></a></td>
</tr>
<?php endforeach ?>
</table>
<div class="pages">
<?php echo $links ?>
</div>
</div>

<div id="box">
<div>Содержимое заказа</div>
</div>

/www/application/view/order_about.php
<div class="content_caption">
<p>Заказ №<?php echo $_GET['id']?></p>

105
</div>
<div class="content_sheet">
<div id="return">
<a href="/order">&#8592 Вернуться</a>
</div>
<div class="table">
<p>Информация о заказе</p>
<?php foreach ($order as $v): ?>
<dl class="content_data">
<dt>ID:</dt>
<dd><?php echo $v['id'] ?></dd>
<dt>Дата заказа:</dt>
<dd><?php echo $v['date'] ?></dd>
<dt>Сумма заказа:</dt>
<dd id="amount"><?php echo $v['amount'] ?> RUR</dd>
<dt>Статус:</dt>
<dd id="status"><?php echo $v['status'] ?>
<button id="change" onclick="boxList-
Show()">Изменить</button>
</dd>
</dl>
</div>
<div class="table">
<p>Информация о покупателе </p>
<table id="form_list">
<tr>
<th>Покупатель:</th>
<td class="fio"><?php echo $v['lastname'].'
'.$v['firstname'] ?></td>
</tr>
<tr>
<th>e-mail:</th>
<td class="email"><?php echo $v['email'] ?></td>
</tr>
<tr>

106
<th>Адрес:</th>
<td class="address"><?php echo $v['address'] ?></td>
</tr>
<tr>
<th>Телефон:</th>
<td class="phone"><?php echo $v['phone'] ?></td>
</tr>
</table>
<div class="button">
<button onclick="editClient(<?php echo
$v['id_user'] ?>)">Редактировать</button>
</div>
</div>

<table id="table_item_order">
<tr>
<th>Товары в корзине</th>
<th>Цена</th>
<th>Количество</th>
<th>Сумма</th>
<th>Удалить</th>
</tr>
<?php foreach ($item_order as $vs): ?>
<tr id="<?php echo $vs['id_product']?>">
<td><?php echo
htmlspecialchars($vs['name']) ?></td>
<td><?php echo $vs['price'] ?> RUR</td>
<td><?php echo $vs['count'] ?> шт.</td>
<td><?php echo $vs['cost']?> RUR</td>
<td><a href="javascript:void(0)"
onclick="deleteItemOrder(<?php
echo $vs['id_product']?>, <?php echo $vs['id_order']?>)">
<img src="/image/del.png" alt="delete"></a>
</td>
</tr>

107
<?php endforeach ?>
</table>
<div id="foot">
<button onclick="addItemOrder(<?php echo
$vs['id_order']?>)">Добавить в корзину</button>
<p class="td_p"><span>ИТОГ: </span><?php echo
$v['amount'] ?> RUR</p>
</div>
<?php endforeach ?>
</div>

<div id="box_add_edit">
<?php foreach ($order as $v): ?>
<a class="box_close"></a>
<p>Редактировать покупателя</p>
<table>
<tr>
<th>Фамилия:</th>
<td><input class="lastname" type="text" value="<?
php echo $v['lastname']?>"></td>
</tr>
<tr>
<th>Имя:</th>
<td><input class="firstname" type="text" value="<?
php echo $v['firstname'] ?>"></td>
</tr>
<tr>
<th>e-mail:</th>
<td><input class="email" type="text" value="<?php
echo $v['email'] ?>"></td>
</tr>
<tr>
<th>Адрес:</th>
<td><input class="address" type="text" value="<?
php echo $v['address'] ?>"></td>

108
</tr>
<tr>
<th>Телефон:</th>
<td><input class="phone" type="text" value="<?php
echo $v['phone'] ?>"></td>
</tr>
</table>
<div>
<button id="save_edit_client">Сохранить</button>
<button id="cancel_edit_client">Отмена</button>
</div>
<?php endforeach ?>
</div>

<div id="box_list">
<?php foreach ($order as $v): ?>
<select>
<option value="Новый">Новый</option>
<option value="Ожидает проверки">Ожидает
проверки</option>
<option value="Подтвержден">Подтвержден</option>
<option value="Оплачен">Отменен</option>
<option value="Отправлен">Отправлен</option>
<option value="Доставлен">Доставлен</option>
<option value="Оплачен">Оплачен</option>
</select>
<button onclick="changeStatus(<?php echo $v['id'] ?
>)">Сохранить</button>
<?php endforeach ?>
</div>

<div id="box_add_item">
<a class="box_item_close"></a>
<p>Добавление товара</p>
<table>

109
<tr>
<th>ID:</th>
<td><input id="id_product" type="text"
value=""></td>
</tr>
<tr>
<th>Название товара:</th>
<td><input id="name" type="text" value=""></td>
</tr>
<tr>
<th>Колличество:</th>
<td><input id="sum" type="text" value=""></td>
</tr>
</table>
<div>
<button id="add_item">Добавить</button>
<button id="cancel_add_item">Отмена</button>
</div>
</div>

Листинг 5. Исходные коды AJAX-движка


admin.js (часть исходного кода для модуля «Заказы»)

/**
* Функция вывода на экран окошка добавления/редактирования
*
*/
function boxAddEditShow(){
$("#box_add_edit").fadeIn();

//вывести окно в центр экрана


window_width = $(window).width();
window_height = $(window).height();
obj_width = $("#box_add_edit").width();
obj_height = $("#box_add_edit").height();
110
$("#box_add_edit").css('top',
(window_height/2)-(obj_height/2))
.css('left',
(window_width/2)-(obj_width/2));

/**
* Функция удаления товара из текущего заказа
*
* @param {integer} idProduct ID удаляемого продукта
* @param {integer} idOrder ID заказа
*/
function deleteItemOrder(idProduct, idOrder) {

var idTag = "#" + idProduct;

$.ajax({
type: 'GET',
async: false,
url: "/order/delete/order/" + idOrder + "/product/" +
idProduct,
dataType: 'json',
success: function(data) {
$(idTag).remove();

//обновляем общую сумму заказа на странице


var txt = '<span>ИТОГ: </span>' + data+ ' RUR';
$(".td_p").html(txt);
$("#amount").text(data + " RUR");
}
});
}

/**
111
* Функция вывода списка статусов заказа
*
* @returns возвращает текущий статус
*/
function boxListShow(){

$("#box_list").show();

obj_left = $("#change").offset().left;
obj_top = $("#change").offset().top;
$("#box_list").css({"left": obj_left, "top": obj_top});

var slct = $("#box_list select").val();

return slct;
}

/**
* Функция изменения статуса заказа
*
* @param {integer} id ID заказа
* @return {string} новый статус заказа
*/
function changeStatus(id){

var newStatus = $("#box_list select").val();

$.ajax({
type: "POST",
async: false,
url: "/order/newstatus/id/" + id,
data: { select: newStatus },
success: function (data) {
var txt = data+ '<button id="change" onclick="boxList-
Show(' + id + ')">Изменить</button>';
112
$("#status").html(txt);
$("#box_list").hide();
}
});

/**
* Функция редактирования информации о клиенте
*
* @param integer id ID клиента
* @return {array} новые данные о клиенте
*/
function editClient(id) {

boxAddEditShow();

//получить текущие данные о клиенте


var lastname = $('input.lastname').val();
var firstname = $('input.firstname').val();
var email = $('input.email').val();
var address = $('input.address').val();
var phone = $('input.phone').val();

//если нажата кнопка отмены или закрытия окошки,


//то вернуть значения полей в исходное состояние
$(".box_close").click(function(){
$("#box_add_edit").fadeOut();
$('input.lastname').val(lastname);
$('input.firstname').val(firstname);
$('input.email').val(email);
$('input.address').val(address);
$('input.phone').val(phone);
});
$("#cancel_edit_client").click(function(){
113
$("#box_add_edit").fadeOut();
$('input.lastname').val(lastname);
$('input.firstname').val(firstname);
$('input.email').val(email);
$('input.address').val(address);
$('input.phone').val(phone);
});

//сохранить новые данные при нажатии на кнопку сохранения


$("#save_edit_client").click(function(){

lastname = $('input.lastname').val();
firstname = $('input.firstname').val();
email = $('input.email').val();
address = $('input.address').val();
phone = $('input.phone').val();

if (lastname =='') {
$('tr input.lastname').after("Введите фамилию");
} else if (firstname =='') {
$('tr input.firstname').after("Введите имя");
} else if (email =='') {
$('tr input.email').after("Введите e-mail");
} else if (address =='') {
$('tr input.address').after("Введите адрес");
} else if (phone =='') {
$('tr input.phone').after("Введите телефон");
} else {
$.ajax({
type: "POST",
async: false,
url: "/client/edit/id/" + id,
data: { lastname: lastname,
firstname: firstname,
114
email: email,
address: address,
phone: phone },
success: function (data) {
//обновить данные о клиенте на странице
$("#form_list td.fio")
.text(lastname + ' ' +firstname);
$("#form_list td.email")
.text(email);
$("#form_list td.address")
.text(address);
$("#form_list td.phone")
.text(phone);
$("#box_add_edit").fadeOut();
}
});

}
});

/**
* Функция добаления товара в текущий заказ
*
* @param {integer} idOrder ID заказа
* @return {array} новый товар
*/
function addItemOrder(idOrder){
$("#box_add_item").show();

var idProduct;
var nameProduct;
var countProduct;

115
window_width = $(window).width();
window_height = $(window).height();
obj_width = $("#box_add_item").width();
obj_height = $("#box_add_item").height();
$("#box_add_item").css('top', (window_height/2)-
(obj_height/2)+5).css('left', (window_width/2)-(obj_width/2));

//если нажата кнопка отмены или закрытия окошки,


//то очистить поля
$(".box_item_close").click(function(){
$("#box_add_item").hide();
$('#id_product').val("");
$('#name').val("");
$('#sum').val("");
});
$("#cancel_add_item").click(function(){
$("#box_add_item").hide();
$('#id_product').val("");
$('#name').val("");
$('#sum').val("");
});

//добавить товар при нажатии на кнопку сохранения


$("#add_item").click(function(){
idProduct = $('#id_product').val();
nameProduct = $('#name').val();
countProduct = $('#sum').val();

if (idProduct =='') {
$('tr input#sum').after("Введите код товара")
} else if (nameProduct =='') {
$('tr input#id_product')
.after("Введите наименование товара");
} else if (countProduct =='') {
$('tr input#id_product')
116
.after("Введите колличество");
} else {
$.ajax({
type: "POST",
async: false,
url: "/order/additem/order/" + idOrder,
dataType: "json",
data: { id_product: idProduct,
name: nameProduct,
count: countProduct
},
success: function (data) {

var txt = "<tr id=" + data['id_product'] +"><td>" +


data['name'] + "</td>" +
"<td>" + data['price'] + "RUR</td>" +
"<td>" + data['count'] + "шт.</td>" +
"<td>" + data['cost'] + "RUR</td>" +
"<td><a href=" + "javascript:void(0) " +
"onclick=" + "deleteItemOrder(" + data['id_product'] +
"," + data['id_order'] + ")>" +
"<img src=" + "/image/del.png" + "></a></td></tr>";
$("#table_item_order").append(txt);

var tx = '<span>ИТОГ: </span>' + data['amount']+ ' RUR';


$(".td_p").html(tx);
$("#amount").text(data['amount'] + " RUR");

$('#id_product').val("");
$('#name').val("");
$('#sum').val("");
$("#box_add_item").hide();
}
});
}

117
});
}

118

Вам также может понравиться