close

Вход

Забыли?

вход по аккаунту

Максимов Егор Михайлович. Разработка веб-приложения для организации индивидуальной научно-исследовательской работы студентов

код для вставки
Содержание
Введение
3
Глава I Постановка задачи
9
1.1
Описание предметной области………………………………………9
1.2
Выбор фремворка для разработки………………………………….10
1.3
Постановка задачи…………………………………………………...17
Глава II Разработка приложения
21
2.1 Модель………………………………………………………………..…21
2.2 Шаблоны и представления…………………………………………….27
2.3 Обработка AJAX-запросов на стороне сервера………………………33
2.4 Загрузка и сбор данных для сохранения на стороне пользователя…35
2.5 Результат работы программы………………………………………….39
Заключение
39
Список литературы
41
Приложение
43
Серверная часть…………………………………………………………….43
Сторона пользователя……………………………………………………...47
Введение
Во все времена вопрос правильного и качественного хранения
информации был одним из наиболее актуальных. Тем более любая отрасль
жизни и деятельности современного человека, так или иначе, завязана на
том, чтобы хранить достаточно большие объемы информации, получать к
ним беспрепятственный доступ, а также стараться свести количество потери
информации к минимуму.
Получение всесторонней информации, так или иначе связанной с
научно-исследовательской деятельностью студентов, находит все большую
актуальность в рамках деятельности вуза. В настоящее время университет
обладает большим количеством крупных структурных подразделений по
основным научным направлениям, в чисто которых входят НИИ
естественных наук, НИИ философии, НИИ психологии и педагогики и т.д. В
следствии чего, с одной стороны так или иначе возникает необходимость
автоматизировать учет и анализировать результаты данного вида
деятельности, в связи со значительным ростом участников. С другой же
стороны, отсутствие хорошо организованной системы организации
индивидуальной научно-исследовательской работы студентов приведет к
невозможности обработки накопленного объема информации.
В настоящее время, научным руководителям приходится лично
предоставлять информацию студентам об их курсовых, дипломных,
магистерских работах, а специально выбранный преподаватель вынужден их
собирать. На первый взгляд, это кажется обычной процедурой, которая не
требует автоматизации, но из-за большого количества студентов и
разнообразия тем работ, начинают появляться проблемы хранения детальной
информации о студентах и их научно-исследовательских работах. Доступ к
этой информации так же труднодоступен, как и ее хранение.
Как следствие, данная необходимость, из соображений рационализации
образовательной деятельности, нуждается в как можно большей
2
автоматизации. Достичь поставленной перед собой цели как нельзя
позволяет обращение к использованию специализированных структур – Баз
Данных (БД). Для больших информационных ресурсов, подчиняющихся
какой-либо логике, применение БД более, чем оправданно. Для операций же
над ними существуют Системы Управления Базами Данных (СУБД). БД
составляют основы комплексов обработки информации, которые называют
Информационными Системами (ИС). Для того, чтобы качественно и
эффективно спроектировать БД для ИС, необходимо, прежде всего, описать
предметную область со всех возможных сторон. Аналогичной значимостью
обладает и тот факт, что правильное проектирование БД должно сократить
избыточность хранимых данных, не нарушить их целостность, а также
максимально уменьшить затраты на обработку информации.
Кроме того, решению этой задачи, в большей степени, способствует
использование актуальных веб-технологий, таких как фреймворк, т.е.
программного обеспечения, облегчающего разработку и объединение разных
компонентов большого программного проекта. Данная отрасль
программирования помогает визуализировать конечный результат, сделав
разработанное приложение наиболее наглядным, что и будет наиболее
полным образом отвечать требованиям заданной предметной области.
В ходе работы, был проведен обзор доступных средств сбора научной
деятельности с целью нахождения варианта, в полной мере
удовлетворяющего сформулированным требованиям.
Academic Line [2] – система управления научно-исследовательской
деятельностью, разработанная специалистами VR GROUP, предназначена
для того, чтобы обеспечить информационную и организационную поддержку
следующих процессов:
• Учет и планирование исследований, распределение как
материально технических, так и интеллектуальных ресурсов вуза.
• Учет интеллектуальной собственности организации, защита
результатов интеллектуальной деятельности.
3
• Подготовка кадров высшей научной квалификации, набор в
аспирантуру и докторантуру.
• Деятельность диссертационных советов.
• Подготовка отчетов по НИД вуза, аспирантуры и докторантуры.
Данный инструмент, в том, что касается организации индивидуальной
научно-исследовательской работы студентов, к сожалению, является
совершенно непригодным.
Истина [3] – система управления информацией о результатах научноисследовательской и педагогической деятельности. Система предназначена
для сбора, учета, систематизации, хранения, анализа и выдачи по запросу
информации, характеризующей результаты деятельности научных и
образовательных организаций.
Эта система управления информацией не удовлетворяет заданным
требованиям в полном объеме, и в следствии чего является неподходящей, в
рамках заданной предметной области.
1C:Университет [4] – решение для автоматизации управленческой
деятельности вуза. Продукт охватывает все уровни деятельности основных
подразделений учреждения высшего профессионального образования и
интегрируется с типовым решениями фирмы «1С» для бухгалтерии и отдела
кадров.
Работа приемной комиссии:
• Планирование проведения приемной кампании
• Формирование личного дела абитуриента
• Формирование необходимого перечня документов абитуриента
Планирование учебного процесса:
• Формирование и учет учебных планов и рабочих учебных планов
(РУП) в соответствии ФГОС-3+..
• Версионирование учебных планов и РУП
• Поддержка двухуровневой системы
4
Расчет и распределение нагрузки:
• Формирование правил расчета нагрузки преподавателей
• Планирование распределения нагрузки кафедр
• Распределение нагрузки по преподавателям
Вышеописанная система не отвечает требованиям по организации
индивидуальной научно-исследовательской работы студентов, что делает ее
неподходящим инструментом в рамках выполнения поставленной задачи.
По результатам проведенного обзора можно сделать вывод о том, что ни
одна из рассмотренных систем не удовлетворяет сформулированным
требованиям в той мере, в которой должна удовлетворять. Это приводит к
необходимости разработки собственного ПО, отвечающего заданным
требованиям в полном объеме.
Выбор инструментов:
• MySQL Workbench [5]. Позволяет осуществить визуальное
проектирование базы данных;
• Язык программирования Python [6]. Он обладает простым и
интуитивным синтаксисом, подробной документацией, а так же он
совместим во множеством современных платформ;
• Фреймворк для создания веб-приложений Django [7]. Так же
обладает подробной документацией, основан на языке Python,
поддерживает архитектуру MTV и встроенный ORM;
• Система контроля версий проекта Git [8]. Необходим для создания
резервных копий проекта на разных его стадиях;
• Фреймворк для создания переносимых интерфейсов Semantic UI
[9]. Обладает особенностью повторного использования элементов
UI в своих проектах;
• jQuery [10] – фреймворк упрощающий взаимодействие с
различными HTML/CSS элементами и возможностями браузеров;
5
Объектом исследования является процесс проектирования и реализации
полнофункциональной информационной системы, отвечающей требованиям
заданной предметной области, а так же создание веб-интерфейса –
инструмента, позволяющего осуществить взаимодействие с реализованной
БД.
Предметом исследования являются содержательные и практические
аспекты разработки веб – приложения согласно принципу MTV.
Целью данной работы является создание инструмента, который
позволял бы максимально ускорить и упростить процесс распределения
индивидуальных научно-исследовательских работ студентов, а также
организовать хранения информации о работах студентов и доступ к ним. Для
этого требуется спроектировать специализированную БД и создать удобный
и понятный веб-интерфейс, позволяющий осуществить взаимодействие с
реализованной БД [11]. Для достижения цели необходими решить
следующие задачи:
• Спроектировать БД, в которой будут храниться данные о
студентах и их научно-исследовательских работах;
• Результат проектирования представить в виде набора объектнореляционных моделей в контексте фреймворка Django.
• Разработать веб-интерфейс для взаимодействия с набором
объектно-реляционных моделей в контексте фреймворка Django
таким образом, чтобы он мог предоставить CRUD-доступ
(создание, чтение, изменение, удаление) к представленным
моделям.
• Сверстать шаблон для заполнения и отображения информации о
индивидуальных научно-исследовательских работах студентов.
Практическая ценность работы определяется необходимостью упростить
трудоемкий процесс распределения и систематизации научноисследовательских работ студентов.
6
Структура работы: в первой главе проводится постановка задачи на
основе анализа процесса генерации индивидуальных научноисследовательских поручений для студентов. Вторая глава сосредоточена на
описании реализации правильно спроектированной БД [12] и принципов
реализации веб-интерфейса – инструмента, осуществляющего
взаимодействие с спроектированной БД, с использованием основных
инструментов [13].
Методы исследования: изучение литературы, анализ ее содержания и
применение необходимой информации к практической реализации
поставленной задачи.
7
Глава I Постановка задачи
1.1 Описание предметной области.
Одной из обязанностей каждого научного руководителя является
постановка задачи каждому студенту в зависимости от выбранной студентом
темы. Преподавателю необходимо для каждого студента сформировать
перечень требований и указаний, которые уже в дальнейшем должны быть
учтены студентом при выполнение его работы. Студент должен получить
подробное описание своей индивидуальной научно-исследовательской
работы:
• Тип работы.
• Тему работы.
• Указания к выполнению работы.
• Список литературы.
• Дату защиты.
На данный момент студенты получают все информацию по электронной
почте или при личной встрече с преподавателем, что означает, что
преподаватель вынужден либо сам заполнять и отсылать электронные
сообщения, содержащие информацию для студентов об их работах, либо при
личной встрече со студентом обсуждать и корректировать всю нужную
студенту информацию. Все это занимает много времени и сил, не говоря уже
про то, что хранение и структурирование информации о работах студентов с
данным подходом либо невозможно, либо задействуются дополнительные
люди, которые собирают информацию о всех работах.
8
1.2 Выбор фремворков для разработки
Для реализации веб-приложения необходимо выбрать фреймворк, при
помощи которого и будет проходить разработка. Рассмотрим некоторые из
них:
Django
Django это свободный веб-фреймворк на языке Python, который является
наверно самым популярным веб-фреймворком на Python. Django следует
шаблону программирования MVC (Model-View-Controller). Сайт на Django
строится из одного или нескольких приложений, которые рекомендуется
делать отчуждаемыми и подключаемыми. Главное преимуществ Django,
отличающие его от своих конкурентов является хорошая документация в том
числе и на русском языке. Django поддерживает работу с основными базами
данных - MySQL, PostgreSQL и Oracle. Он предоставляет уровень
абстракции, который избавляет от необходимости писать SQL-запросы для
получения/сохранения данных в базу данных. Все таблицы, использующиеся
сайтом, описываются в виде классов в отдельном файле models.py. Далее при
помощи методов этих классов, происходит манипуляция с содержимым
таблиц. Таким образом, работа с базой данных становится полностью
объектно-ориентированной.
Так же в Django есть встроенный интерфейс администратора, через который
в удобной форме можно работать с контентом сайта. Наверно поэтому он
имеет самое крупное сообщество среди веб-фреймворков на Python.
TurboGears
Так же, как и Django, TurboGears был разработан для быстрого создания
новостных сайтов. TurboGears это Python веб фреймворк, который состоит из
нескольких составляющих компонент, таких как:
• CherryPy для диспетчеризации url;
• MochiKit для работы с Javascript;
• SQLObject для работы с базой данных;
9
• Kid для работы с шаблонами.
Из недостатков можно отметит - плохая совместимость 1.x и 2.x версий
и не самая хорошая документация.
Pylons
Pylons представляет собой легкий веб-фреймворк который делает упор
на гибкость и быстроту разработки. В настоящее время развитие Pylons
завершено на версии 1.0 и дальнейшего существенного изменения не
планируется. Pylons один из первых проектов который начал использовать
стандарт WSGI и ориентирован на то чтобы сделать веб-разработку быстрой,
гибкой и как можно более простой. Что касается документации, то Pylons ею
абсолютно не занимается.
Zope
Zope представляет собой сервер веб-приложений, написанный на Python
и предназначенный для создания систем управления контентом, интранетприложений, порталов и прочих проектов. Zope расшифровывается как «Z
Object Publishing Environment» (Среда Публикации Объектов Z).
Особенностью Zope является объектно-ориентированность. Все данные
представляются в виде компонентов, занимающих определенное место в
общей иерархии и хранящихся во встроенной объектной базе данных - ZoBD.
И поэтому программирование в Zope сводится к проектированию иерархии
компонентов. Русскоязычной документации по Zope практически нет.
Twisted
Twisted является фрэймворком для написания сетевых приложений на
Python. Основывается на парадигме событийно-ориентированного
программирования. Пользователь пишет функции обратного вызова, которые
затем вызываются фреймворком. Он поддерживает множество протоколов,
имеет модули для создания web-серверов, чат-клиентов и серверов, почтовых
серверов, ssh-серверов.
Web2py
10
Бесплатный и с открытым кодом, полноценный фреймворк уровня
предприятия для гибкой разработки веб-приложений для доступа к БД.
Web2py позволяет создавать и разрабатывать приложения прямо в онлайне.
В целом он очень похож на Django.
Webware
Webware для Python представляет собой набор Python пакетов для
разработки объектно-ориентированных веб приложений.
Рассмотрев преимущества и недостатки всех фремворков остановимся
на Django.
Язык шаблонов Django
Будучи веб фреймверком, Django позволяет динамически генерировать
HTML. Самый распространенный подход - использование шаблонов.
Шаблоны содержат статический HTML и динамические данные, рендеринг
которых описан специальным синтаксисом.
Проект Django может использовать один или несколько механизмов
создания шаблонов (или ни одного, если вы не используете шаблоны).
Django предоставляет бэкенд для собственной системы шаблонов, которая
называется - язык шаблонов Django (Django template language, DTL), и
популярного альтернативного шаблонизатора Jinja2. Сторонние приложения
могут предоставлять бэкенд и для других систем шаблонов.
Django предоставляет стандартный API для загрузки и рендеринга
шаблонов, незавимисо от используемого бэкенда. Загрузка включает в себя
поиск шаблона по названию и предварительную обработку, обычно
выполняется загрузка шаблона в память. Рендеринг означает передачу
данных контекста в шаблон и возвращение строки с результатом.
Язык шаблонов Django – собственная система шаблонов Django. Это
хорошая система шаблонов, но со своими особенностями. Если у вас нет
причин использовать другую систему шаблон, используйте встроенную,
особенно, если разрабатываете распространяемое приложение, содержащее
11
шаблоны. Встроенные шаблоны Django, которые содержат шаблоны,
например django.contrib.admin, используют систему шаблонов Django.
По историческим причинам поддержка шаблонов и встроенная система
шаблонов Django находятся в одном пакете django.template.
Шаблон Django – это просто текстовый файл, или строка Python,
которые следуют языку шаблонов Django. Определенные конструкции
распознаются и интерпретируются шаблонизатором. Основные – это
переменные и теги.
Шаблон рендерится с контекстом. Рендеринг заменяет переменные на их
значения, которые ищутся в контексте, и выполняет теги. Все остальное
выводится как есть.
Синтаксис языка шаблонов Django использует четыре конструкции.
Переменные
Переменные выводят значения из контекста, который является словарем.
Переменные выделяются {{ и }}, например:
My first name is {{ first_name }}. My last name is {{ last_name }}.
Для контекста {'first_name': 'John', 'last_name': 'Doe'} шаблон отрендерит:
My first name is John. My last name is Doe.
Обращение к ключам словаря, атрибутам объектов и элементам списка
выполняется через точку:
{{ my_dict.key }}
{{ my_object.attribute }}
{{ my_list.0 }}
Если значение переменной является вызываемый объект, шаблонизатор
вызовет его без аргументов и подставит результат.
Теги
Теги позволяют добавлять произвольную логику в шаблон.
12
Например, теги могут выводить текст, добавлять логические операторы,
такие как “if” или “for”, получать содержимое из базы данных, или
предоставлять доступ к другим тегам.
Теги выделяются {% и %}, например:
{% csrf_token %}
Большинство тегов принимают аргументы:
{% cycle 'odd' 'even' %}
Некоторые теги требуют закрывающий тег:
{% if user.is_authenticated %}Hello, {{ user.username }}.{% endif %}
Ознакомьтесь со списком всех встроенных тегов и с руководством по
созданию тегов.
Фильтры
Фильтры преобразуют переменные и аргументы тегов.
Могут выглядеть таким образом:
{{ django|title }}
Для контекста {'django': 'the web framework for perfectionists with
deadlines'} этот шаблон выведет:
The Web Framework For Perfectionists With Deadlines
Некоторые фильтры принимают аргументы:
{{ my_date|date:"Y-m-d" }}
Ознакомьтесь со списком встроенных фильтров и руководством по
созданию фильтра.
Комментарии
Комментарии могут выглядеть таким образом:
{# this won't be rendered #}
Тег {% comment %} позволяет добавлять многострочные комментарии.
Основные фреймворки для оформления сайтов
CSS-фреймворки созданы для упрощения работы верстальщика,
исключения ошибок при создании проекта и избавления от скучного
13
монотонного написания одного и того же кода. Профессиональное
сообщество разработчиков до сих пор спорит, хорошо или плохо
использовать фреймворки. Сложно дать однозначный ответ на этот вопрос,
потому что по мере увеличения опыта и с ростом личного профессионализма
можно будет просто написать свою личную CSS-библиотеку под себя и свои
нужды.
Плюсы CSS-фреймворков:
• Кроссбраузерность
• Возможность создать корректный HTML макет даже не очень
опытному специалисту
• Единообразие кода
• Увеличение скорости разработки
Минусы:
• Привязанность к стилю CSS библиотеки
• Избыточный код
Bootstrap
Один из самых известных CSS-фреймворков на сегодняшний день.
Имеет в своем составе шаблоны для отрисовки кнопок, сайдбаров,
навигационных панелей, форм и других элементов сайта. Включает себя
JavaScript-расширения.
Основные инструменты bootstrap — шаблоны, @media, формы,
навигация, алерты, типографика и конечно же, сетки. Bootstrap совместим со
всеми основными современными браузерами, но в старых версиях браузеров
могут быть проблемы. Поддерживает адаптивность. Использует языки Less и
Sass.
Skeleton
Основан на JavaScript и CSS, используется для быстрого и
безошибочного создания адаптивных сайтов которые корректно
отображаются как на больших мониторах, так и на экранах маленьких
гаджетов. Большой плюс Skeleton — его можно приспособить под любой
14
дизайн. Сетка разметки содержит 12 колонок и имеет базовую ширину 960
пикселей. Совместим со всеми основными браузерами.
Kube
Полная свобода для разработчика без навязывания стилей.
Предоставляет максимальную гибкость оформления. Имеет несколько
вариантов сетки и позиционируется создателями как фреймворк для
профессиональных CSS-разработчиков. Использует Less, поддерживает
адаптивный дизайн.
Foundation
Распространенный CSS-фреймворк. Наряду с другими основными
элементами включает в себя несколько HTML шаблонов с различным
расположением блоков на странице. Имеет большой набор компонентов на
JavaScript. Очень серьезный по своим возможностям и составу фреймворк.
Использует Sass. Совместимость кода со всеми основными браузерами.
Semantic UI
Поддержка Firefox, Chrome, Safari, Internet Explorer, Android 4,
Blackberry10. Содержит большое количество компонентов: иконки,
изображения, надписи, меню и другие стандартные компоненты.
Поддерживает последние версии HTML и CSS и имеет хорошую подборку
скриптовых модулей и API. Использует Less. По применимости соревнуется
с bootstrap.
Остановим свой выбор на Semantic UI из-за преимуществ, которые он
предоставляет в сравнении с другими фреймворками.
15
1.3 Требования к веб-приложению.
Создаваемое веб-приложение в первую очередь, должно быть простым в
использовании и сопровождении. Для того, чтобы его код было легко
сопровождать в будущем, было принято решение отказаться от
использования сложных JavaScript-фреймворков (Backbone, React, Angular).
Каждый из этих фреймворков требует определённый уровень подготовки и
опыта, которого может и не быть у тех, кто будет вносить изменения в это
приложение. Также в код должны быть добавлены подробные комментарии,
позволяющие упростить процесс понимания его работы. Ценность этих
комментариев особенно будет заметна спустя пару лет. Одной из основных
задач является добавление возможности хранения данных о индивидуальных
научно-исследовательских работах студентов. Также должна быть
возможность добавить/изменить/удалить данные о научно-исследовательских
работах студентов после их импорта. Для того, чтобы пользователь мог
отредактировать импортированные данные, должна присутствовать
возможность их предпросмотра. Самым главным элементом создаваемого
веб-приложения является инструмент для распределения научноисследовательских работ студентов. Он должен справляться со своей задачей
при минимальном количестве действий со стороны пользователя. Поэтому
необходимо разработать уникальный пользовательский интерфейс,
позволяющий решить эту задачу. Также необходимо добавить возможность
быстрого доступа к актуальной информации о типах, темах, описаниях, дат
защиты работ студентов.. Чтобы научные руководители могли получить
информацию о научно-исследовательских работах студентов, необходимо
создать отдельную страницу, на которой они будут выводится в режиме
«только чтение». Подводя итоги, можно выделить следующий функционал,
который должен быть реализован:
• Функциональность: веб-приложение предоставлять пользователю
возможность просматривать все данные о научноисследовательских работах студентов;
16
• Простота использования: интерфейс веб-приложения должен быть
простым на столько, насколько это возможно;
• Конфиденциальность: каждый пользователь должен иметь достеп
только к своим личным данным;
• БД должна быть спроектирована в соответствии с требованиями
заданной предметной области;
• БД должна быть нормализована, т.е. должны быть устранены все
недостатки структуры, приводящие к избыточности, которая, в
свою очередь, потенциально приводит к различным аномалиям и
нарушением целостности данных;
• Спроектированная БД должна быть описана средствами языка
Python в виде набора объектно-реляционных моделей в контексте
фреймворка Django;
• Фреймворк Django должен быть использован таким образом,
чтобы написанный код был связным, т.е. сосредоточен на
выполнение одной единственной вещи;
• Фреймворк Django должен быть использован таким образом,
чтобы
• написанный код был тестируемым, т.е. таки, чтобы в нем можно
было легко обнаружить проблему;
• Веб-интерфейс должен использовать возможности ORM (ObjectRelational Mapping), которые предоставляет фреймворк Django;
• Веб-интерфейс должен представлять возможность выполнения
всех базовых операций (создание, чтение, изменение, удаление)
для взаимодействия с каждой из таблиц, представленных в базе
данных.
• Использовать фреймворк Semantic UI с расчетом на написание
удобочитаемого программного кода;
17
• Созданные элементы интерфейса на Semantic UI не должны
противоречить принципам создания интерфейса Django.
18
Глава II Разработка приложения
2.1 Модель
Поскольку основным инструментом для создания приложения является
фреймворк Django, то для хранения информации необходимо использовать
модели. Модель – важнейшая часть приложения, которое постоянно
обращается к данным при любом запросе из любой сессии. Она содержит
поля и методы для работы с данными, которые необходимо хранить. Любая
модель в Django является стандартным Python классом [14].
Все данные хранятся в 5-и таблицах. Эти таблицы заданы с помощью
Объектно-Реляционного Отображения (ORM) в виде Django – моделей.
19
Поскольку у каждого студента своя научно-исследовательская работа, то
таблица studsciwork_studentsciwork связана с таблицей studsciwork_student.
Соответственно studsciwork_studentsciwork также привязана к таблицам
studsciwork_studentworktype и studsciwork_studentqualification, в которых
хранятся соответствующие данные о работе студентов.
studsciwork_studentqualification в свою очередь связана с
studsciwork_studentspecialty, которая хранит данные о специальностях
студентов.
Основные классы для генерации таблиц:
Для работы со справочниками
• StudentSpecialty – специальности.
• StudentQualification – квалификации.
• KeyWord – ключевые слова.
• StudentWorkType – типы работ.
• Student – студенты.
Для работы с таблицами
• Task – хранит задания для студентов.
• StudentSciWorks – научные работы.
В таблице studsciwork_studentsciwork содержатся всевозможные типы
работ. Эта таблица имеет поля:
• id – порядковый номер записи в таблице.
• owner_id – владелец записи.
• title – название работы.
• stud_id – студент.
• work_type_id – тип работы.
• qual_id – квалификация.
• target – цель работы.
• url – внешняя ссылка.
• tasks – задания.
20
• final_date – дата защиты работы.
• desc – необязательное подробное описание.
class StudentSciWorks(models.Model):
owner = models.ForeignKey(User)
title = models.CharField(u'JobTitle', unique=True, max_length=255)
stud = models.ForeignKey( Student, verbose_name=u'Student', help_text=u'work Author.')
work_type = models.ForeignKey( StudentWorkType, verbose_name=u'Type', help_text=u'Work type')
qual = models.ForeignKey(StudentQualification, verbose_name=u'Qualification',
help_text=u'Qualification.')
target = models.TextField(u'Objective',max_length=2000)
url = models.CharField(u'Web-link',blank=True, null=True, max_length=255,help_text=u'External
reference is not mandatory.')
keys = models.ManyToManyField(KeyWorld, related_name='keys_works_list',
verbose_name=u'Keywords' )
tasks = models.ManyToManyField(Task, related_name='tasks_works_list', verbose_name=u'Tasks')
final_date = models.DateField(u'DateProtection', blank=True, null=True, help_text=u'Date protection.')
desc = models.TextField(u'Description',max_length=2000, blank=True, null=True, help_text=u'Full
description of an arbitrary.')
def __unicode__(self):
return u'%s' % self.stud
class Meta:
ordering = ["title"]
verbose_name_plural = u'Research work of students'
verbose_name = u'Research work of student'
Листинг 1. Таблица, представленная в виде модели, описывающая типы
работ
В таблице studsciwork_student хранятся данные о студентах. Эта
таблица имеет поля:
• id – порядковый номер записи в таблице.
• first_name - имя студента.
• last_name – фамилия студента.
• middle_name – отчество студента.
• contacts – контакты студента (Телефон, электронный ящик и т.д)
• desc – необязательное подробное описание.
21
class Student(models.Model):
first_name = models.CharField(u'Name',max_length=255)
middle_name = models.CharField(u'Otch',max_length=255)
last_name = models.CharField(u'LastName',max_length=255)
contacts = models.CharField(u'Mail',max_length=255)
desc = models.TextField(u'DopInf',max_length=2000, blank=True, null=True, help_text=u'Optional
additional information.')
def __unicode__(self):
return u'%s %s %s' % (self.last_name,self.first_name,self.middle_name)
class Meta:
ordering = ["last_name"]
verbose_name_plural = u'Stuents'
verbose_name = u'Student'
Листинг 2. Таблица, представленная в виде модели, описывающая
студентов
В таблице studsciwork_studentworktype содержится информация о типе
работы. Эта таблица имеет поля:
• id – порядковый номер записи в таблице.
• name – название типа научной работы студента.
• desc – необязательное подробное описание.
from __future__ import unicode_literals
from django.db import models
from django.contrib.auth.models import User
class StudentWorkType(models.Model):
name = models.CharField(u'Types of student works',max_length=255, unique=True, help_text=u'The
name of the type of research carried out by students.' )
desc = models.TextField(u'Description',max_length=2000, blank=True, null=True,
help_text=u'Optionally, a full description of the type of work.')
def __unicode__(self):
return u'%s' % self.name
class Meta:
ordering = ["name"]
verbose_name_plural = u'Types of student works'
verbose_name = u'Type of student work'
Листинг 3. Таблица, представленная в виде модели, описывающая типы
работы
В таблице studsciwork_studentspecialty содержится информация о
22
используемых специальностях. Эта таблица имеет поля:
• id – порядковый номер записи в таблице.
• name – название специальности.
• desc – необязательное подробное описание.
class StudentSpecialty(models.Model):
name = models.CharField(u'Speciality', unique=True, max_length=255)
desc = models.TextField(u'Description',max_length=2000, blank=True, null=True, help_text=u'Full
description.')
def __unicode__(self):
return u'%s' % self.name
class Meta:
ordering = ["name"]
verbose_name = u'Speciality'
verbose_name_plural = u'Special'
Листинг 4. Таблица, представленная в виде модели, описывающая
специальности
В таблице studsciwork_studentqualification содержится информация о
используемых квалификациях. Эта таблица содержит поля:
• id – порядковый номер записи в таблице.
• name – название квалификации.
• spec_id – специальность.
• desc – необязательное подробное описание.
class StudentQualification(models.Model):
name = models.CharField(u'Title of qualification', unique=True, max_length=255)
spec = models.ForeignKey( StudentSpecialty, verbose_name=u'Specialty', help_text=u'Specialty.')
desc = models.TextField(u'Description',max_length=2000, blank=True, null=True, help_text=u'Full
description.')
def __unicode__(self):
return u'%s' % self.name
class Meta:
ordering = ["name"]
verbose_name_plural = u'Qualifications'
verbose_name = u'Qualification'
Листинг 5. Таблица, представленная в виде модели, описывающая
квалификации
23
Научная работа StudentSciWork предназначена для студента,
обучающегося на некоторой специальности, и выполняющего некоторую
квалификационную работу. Специальность (StudentSpeciality) и
квалификация (StudentQualification) связаны с работой, а не студентом, т.к
студент может сменить специальность или квалификацию в ходе обучения.
Например, после окончания бакалавриата студент поступает в магистратуру.
Предусмотрены задания (Task), которые могут быть поручены
студентам в ходе написания работы.
studsciwork_keyword – таблица для хранения ключевых слов. Эта
таблица содержит поле:
• name – ключевое слово
class KeyWorld(models.Model):
name = models.CharField(u'Name', unique=True, max_length=255)
def __unicode__(self):
return u'%s' % self.name
class Meta:
ordering = ["name"]
verbose_name_plural = u'keywords'
verbose_name = u'keyword'
Листинг 6. Таблица, представленная в виде модели, описывающая ключевые
слова
studsciwork_task – таблица со справочником заданий, составленных
преподавателем для выполнения студентами научных работ. Эта таблица
содержит поля:
• id – порядковый номер записи в таблице.
• owner – владелец записи.
• name – название задания.
• desc – необязательное подробное описание
class Task(models.Model):
owner = models.ForeignKey(User)
name = models.CharField(u'The name of the job', unique=True, max_length=255)
desc = models.TextField(u'The content of the job',max_length=2000, blank=True, null=True,
help_text=u'The content of the job (work plan).')
24
def __unicode__(self):
return u'%s' % self.name
class Meta:
ordering = ["name"]
verbose_name_plural = u'Tasks'
verbose_name = u'Task'
Листинг 7. Таблица, представленная в виде модели, описывающая
справочник
25
2.2 Шаблоны и представление
Будучи веб-фреймворком, Django позволяет динамически генерировать
HTML (Hyper Text Markup Language) – «язык гипертекстовой разметки»,
предназначенный для создания и просмотра Web – страниц в Сети. Самый
распространенный подход для генерации HTML – использование шаблонов.
Шаблоны содержат статический HTML и динамические данные, рендеринг
которых описан специальным синтаксисом в контексте данного фреймворка.
Шаблоны являются основной формой представления данных. Они имеют
свой собственный простой метаязык и являются одним из основных средст
вывода на экран [15].
Разработанное приложение в своей основе содержит 3 шаблона.
templates/stusciwork/form.html
Рис. 2: Страница, для заполнения данными.
Данный шаблон представляет собой форму, которую преподавателю
необходимо заполнить, для указания всех данных, которые студент должен в
итоге получить.
Как только пользователь отправит запрос по указанному выше адресу,
сработает специальный класс, который вызывает необходимый шаблон для
отображения в браузере, а так же содержащий функцию, для сбора и
отображения необходимых данных.
class FormView(TemplateView):
template_name = 'scistudwork/form.html'
def get_context_data(self, *args, **kwargs):
26
context = super(FormView, self).get_context_data(*args, **kwargs)
students = Student.objects.all()
context['students'] = students
return context
Листинг 8: Класс, отвечающий за загрузку страницы выбора студента.
Этот класс собирает из базы такие данные, как год сдачи студентом
работы и ФИО студента.
Пока пользователь не укажет требуемые от него данные, основная часть
страницы, для заполнения формы отправки сообщения будет скрыта.
Рис. 3: Выбор студента
Научный руководитель должен выбрать студента, информацию о работе
которого он хочет получить. Для этого он должен указать студента из
выпадающего списка.
27
Рис. 4: Выбор даты защиты студента
Преподавателю необходимо указать год сдачи студентом работы, чтобы
отобразить на странице просмотра работ необходимую информацию о
данной работе.
Рис. 5: Просмотр работ выбранного студента за выбранный год
После выбора года сдачи работы и студента необходимо нажать на
кнопку подтверждения данных, чтобы отобразить все конкретные работы
студента на странице на которую перенаправляется пользователь:
templates/stusciwork/base.html
Рис. 6: Просмотр работы студента
28
После клика на интересующую пользователя работу откроется
следующий шаблон, который отображает всю информацию о работе
студента.
Как только пользователь отправит запрос по указанному выше адресу,
сработает специальный класс, который вызывает необходимый шаблон для
отображения в браузере, а так же содержащий функцию, для сбора и
отображения необходимых данных.
class BaseView(TemplateView):
template_name = 'scistudwork/base.html'
def get_context_data(self, *args, **kwargs):
context = super(BaseView, self).get_context_data(*args, **kwargs)
work = get_object_or_404(StudentSciWorks, pk=kwargs['pk'])
context['work'] = work
return context
Листинг 9: Класс, отвечающий за загрузку страницы для отображения работы
студента.
Функции всех предыдущих страниц направлены на получение
информации о студентах и их работах, но так же необходимо создать
шаблон, позволяющий заполнять эту информацию о студентах и
генерировать сообщение на почту каждому студенту.
По нажатию кнопки «Создать» пользователь перенаправляется на
страницу:
templates/stusciwork/index.html
29
Рис. 7: Форма для заполнения.
class IndexView(TemplateView):
template_name = 'scistudwork/index.html'
def get_context_data(self, *args, **kwargs):
context = super(IndexView, self).get_context_data(*args, **kwargs)
types = StudentWorkType.objects.all()
context['types'] = types
return context
Листинг 10: Класс, отвечающий за загрузку страницы для заполнения формы.
На данной странице необходимо указать детальную информацию о
студенте и его работе. «Тип работы» реализован в виде выпадающего списка
с выбором из трех элементов:
• Курсовая работа
• Дипломная работа
• Магистерская диссертация
Поле «Описание работы студента» служит для заполнения основной
информации письма, которое отправляется студенту.
30
Рис. 8: Пример заполненной формы
После нажатия кнопки «Отправить» генерируется сообщение на
указанный e-mail адрес и выполняется переход на страницу с просмотром
введенных данных.
Рис. 9: Просмотр информации, которая была помещена в сообщение
31
2.3 Обработка AJAX-запросов на стороне сервера
Для сохранения и загрузки определенных данных используется
технология AJAX (Асинхронный JavaScript и XML). Концепция данной
технологии заключается в следующем: пользовательский интерфейс строится
путем «фонового» обмена данными браузера с веб-сервером [16].
При нажатии на кнопку «Отправить», по адресу /stusciwork/create
передаются данные о индивидуальной научно-исследовательской работе
студента (Тип, описание, дата защиты) в формате JSON (JavaScript Object
Notation – текстовый формат обмена данными, основанный на JavaScript).
Со стороны сервера этот запрос обрабатывается с помощью нескольких
функций:
def post(self, request, *args, **kwargs):
data = self.request.POST
student, created = Student.objects.get_or_create(
first_name=data['first_name'],
last_name=data['last_name'],
middle_name=data['middle_name'],
email=data['email']
)
current_user = User.objects.get(pk=1)
current_qual = StudentQualification.objects.get(pk=1)
work_type = StudentWorkType.objects.get(pk=data['work_type'])
final_date = u'%s-%s-%s' % (data['year'], data['month'], data['day'])
work, work_created = StudentSciWorks.objects.get_or_create(
title=data['title'],
defaults={
"owner": current_user,
"stud": student,
"work_type": work_type,
"qual": current_qual,
"target": data['target'],
"final_date": final_date
}
)
32
work.save()
return HttpResponseRedirect('show/%d' % work.id)
Листинг 11: Функция сбора и сохранения информации.
Данная функция получает данные, присланные пользователем, затем, на
основе этих данных, пытается получить запись о студенте из таблицы
Student, если запись не найдена в базе данных, то создается новая. Тоже
самое происходит и с данными о работе студента.
send_mail(
u'Вам добавлена новая работа!',
u"""
Уважаемый %s %s, вам добавлена новая работа - %s.
тема работы: %s
описание работы:
%s
Дата защиты: %s
"""
% (data['first_name'], data['middle_name'], work_type.name, data['title'], data['target'], final_date),
'',
[data['email']],
fail_silently=True,
)
Листинг 12: Функция отправки сообщения.
Данная функция на основе полученных данных, генерирует сообщение,
которое отправляется на e-mail студенту.
33
2.4 Загрузка и сбор данных для сохранения на стороне
пользователя
Для отображения данных на странице, а также для корректной отправки
данных на сервер используется язык JavaScript и в частности библиотека
jQuery [10]. jQuery – библиотека JavaScript, фокусирующаяся на
взаимодействии JavaScript и HTML. Данная библиотека помогает легко
получать доступ к любому элементу страницы, обращаться к атрибутам и
содержимому этих элементов, а так же манипулировать ими.
При нажатии кнопки «Создать», срабатывает специальное событие,
которое обрабатывается JavaScript функцией с использованием библиотеки
jQuery.
$(document).ready(function() {
function renderYears() {
var yearSelect = $("select[name='year']"),
currentYear = new Date().getFullYear(),
yearItems = '';
for (var year = currentYear; year <= currentYear + 10; year++) {
yearItems += '<option value="' + year + '">' + year + '</option>';
}
yearSelect.append(yearItems);
}
renderYears();
function renderMonths() {
var monthSelect = $("select[name='month']"),
monthItems = '';
for (var month = 1; month <= 12; month++) {
monthItems += '<option value="' + month + '">' + month + '</option>';
}
monthSelect.append(monthItems);
}
renderMonths();
function calcDays(count) {
count = count || 31;
var daySelect = $("select[name='day']"),
dayItems = '';
34
for (var day = 1; day <= count; day++) {
dayItems += '<option value="' + day + '">' + day + '</option>';
}
$(daySelect).html(dayItems);
}
calcDays();
$("select[name='month']").on('change', function() {
var currentYear = $("select[name='year']").val();
var currentDays = moment(currentYear + '-' + this.value, 'YYYY-M').daysInMonth();
calcDays(currentDays);
});
});
Листинг 13. Обработка нажатия кнопки создать.
Как только данные были получены от сервера, происходит проверка, а
именно: по каждому из элементов проверяется, являются ли они пустыми
или нет. Если данные оказались пустыми, то генерируется предупреждение с
просьбой заполнить необходимую информацию. Это необходимо для
корректного отображения информации. Далее происходит заполнение
данными остальных таблиц.
35
2.5 Результат работы программы
На основе созданных моделей мы получили БД, таблицы которой
заполняются из форм, представленных ранее.
Рис.10: Полученные таблицы
После заполнения формы происходит помещение информации в
соответствующие таблицы. Как видно на скриншоте, заполнение таблиц
происходит корректно.
36
Рис.11: Корректно заполненная таблица
После помещения данных в таблицы происходит генерация сообщения и
его отправка приложением на указанный e-mail.
Рис. 12: Сообщение, полученное студентом
37
Заключение
Подводя итог, можно утверждать, что проделанная работа соответствует
обозначенной актуальности. А именно, позволяет максимально
автоматизировать трудоемкий процесс организации индивидуальной научноисследовательской работы студентов и, как следствие реализовать хранение
и просмотр данных о работах студентов.
Завершив выполнение данной работы, можно сделать вывод о том, что
цель работы является полностью достигнутой. В ходе разработки были
соблюдены все требования и достигнуты следующие результаты:
• Спроектирована БД, в которой будут храниться данные о
индивидуальных научно-исследовательских работах студентов;
• Результат проектирования представлен в виде набора объектнореляционных моделей в контексте фреймворка Django;
• Разработан веб-интерфейс для взаимодействия с набором
объектно-реляционных моделей в контексте фреймворка Django
таким образом, что он предоставляет CRUD-доступ к
представленным моделям.
• Разработан веб-интерфейс, с применением шаблонов и стилей,
позволяющих каждому научному руководителю с лёгкостью
добавлять и просматривать данные.
В процессе выполнения данной работы был получен веб-интерфейс,
позволяющий создавать и просматривать данные о индивидуальных научноисследовательских работах студентов, отвечая современным тенденциям
применения веб-технологий в приложениях.
Все полученные результаты являются новыми и могут применяться в
рамках высших учебных заведений. Разработанное приложение является
уникальным в своем роде, полностью отвечая требованиям заданной
предметной области, опережая аналогичные разработки функциональностью,
наглядностью и удобством использования.
38
Система может быть использована в учебном процессе в рамках
существующих требований к организации индивидуальной научноисследовательских работ студентов.
39
Список литературы
1. Системы электронной отчетности о научно-исследовательской
работе сотрудников вуза [Электронный ресурс]. Режим доступа:
http://nir.univ-orel.ru – Дата доступа 06.05.2017
2. Academic Line – система управления научно-исследовательской
деятельности вуза [Электронный ресурс]. Режим доступа
3. Истина – система управления информацией о результатах научноисследовательской деятельности [Электронный ресурс]. Режим
доступа: https://istina.msu.ru/ - Дата доступа
4. 1С:Университет – система управления информацией о результатах
научно-исследовательской деятельности [Электронный ресурс].
Режим доступа: http://solutions.1c.ru/catalog/university/features - Дата
доступа
5. MySQL Workbench documentation [Электронный ресурс]. Режим
доступа: https://dev.mysql.com/doc/workbench/en/ - Дата доступа
6. Python documentation – Режим доступа: https://www.python.org/doc/ –
Дата доступа: 01.07.2016.
7. Django documentation [Электронный ресурс]. – Режим доступа:
djbook.ru/rel1.6/ Дата доступа:
8. Git documentation [Электронный ресурс]. Режим доступа: https://gitscm.com/docs - Дата доступа
9. Semantic UI documentation [Электронный ресурс]. – Режим доступа:
http://legacy.semantic-ui.com/ – Дата доступа: 01.07.2016.
10.jQuery documentation [Электронный ресурс]. – Режим доступа:
http://api.jquery.com/ – Дата
доступа: 01.07.2016
11.Дорофеева В.И., Никольский Д.Н., Федяев Ю.С. “ Особенности
проектирования и реализации системы подготовки электронной
40
отчетности о научной работе в вузе” [Электронный ресурс]. Режим
доступа: https://elibrary.ru/item.asp?id=22285140 - Дата доступа
12. Лутц М. Программирование на Python, том 1-2, 4-е издание / М. Лутц
– СПБ.: Символ плюс, 2011. – 922с.
13. Бизли Д. Python. Подробный справочник, 4-е издание/ Д. Бизли – М.:
Символ плюс, 2010. – 326с.
14. Купер А., Рейман Р., Кронин Д. Алан Купер об интерфейсе. Основы
проектирования взаимодействия. – Пер. с англ. – СПб.: Символ плюс,
2009. – 688с.
15.HTML documentation – Режим доступа:
https://developer.mozilla.org/en-US/docs/Web/HTML – Дата доступа:
01.07.2016.
16.JavaScript documentation – Режим доступа:
https://developer.mozilla.org/ru/docs/Web/JavaScript – Дата доступа:
01.07.2016.
41
Приложение
Серверная часть
•
#!/usr/bin/env python
# -*- coding: utf-8 -*
from django.db import models
from django.contrib.auth.models import User
class StudentWorkType(models.Model):
name = models.CharField(u'Types of student works', max_length=255, unique=True, help_text=u'The name of the
type of research carried out by students.')
def __unicode__(self):
return u'%s' % self.name
class StudentSpecialty(models.Model):
name = models.CharField(u'Speciality', unique=True, max_length=255)
desc = models.TextField(u'Description', max_length=2000, blank=True, null=True, help_text=u'Full description.')
def __unicode__(self):
return u'%s' % self.name
class StudentQualification(models.Model):
name = models.CharField(u'Title of qualification', unique=True, max_length=255)
spec = models.ForeignKey(StudentSpecialty, verbose_name=u'Specialty', help_text=u'Specialty.')
def __unicode__(self):
return u'%s' % self.name
class Task(models.Model):
owner = models.ForeignKey(User)
name = models.CharField(u'The name of the job', unique=True, max_length=255)
desc = models.TextField(u'The content of the job', max_length=2000, blank=True, null=True, help_text=u'The
def __unicode__(self):
return u'%s' % self.name
class Student(models.Model):
first_name = models.CharField(u'Name', max_length=255)
middle_name = models.CharField(u'Otch', max_length=255)
last_name = models.CharField(u'LastName', max_length=255)
email = models.CharField(u'Mail', max_length=255
def __unicode__(self):
return u'%s %s %s' % (self.last_name, self.first_name, self.middle_name)
class StudentSciWorks(models.Model):
owner = models.ForeignKey(User)
title = models.CharField(u'JobTitle', unique=True, max_length=255)
stud = models.ForeignKey(Student, verbose_name=u'Student', help_text=u'work Author.')
work_type = models.ForeignKey(StudentWorkType, verbose_name=u'Type', help_text=u'Work type')
qual = models.ForeignKey(StudentQualification, verbose_name=u'Qualification', help_text=u'Qualification.')
target = models.TextField(u'Objective', max_length=2000)
tasks = models.ManyToManyField(Task, related_name='tasks_works_list', verbose_name=u'Tasks')
42
final_date = models.DateField(u'DateProtection', blank=True, null=True, help_text=u'Date protection.')
def __unicode__(self):
return u'%s' % self.stud
•
Листинг stusciwork/models.py
app_name = 'scistudwork'
urlpatterns = [
url(r'^$', views.FormView.as_view(), name='index_studwork'),
url(r'^create$', views.IndexView.as_view(), name='create_studwork'),
url(r'^show/(?P<pk>\d+)$', views.BaseView.as_view(), name='show_stud_work'),
]
Листинг studsciwork/url.py
# -*- coding: utf-8 -*
from django.shortcuts import render, get_object_or_404
from django.http import HttpResponseRedirect, HttpResponse
from django.template import RequestContext, loader
from django.views.generic import TemplateView
from django.urls import reverse
from django.contrib.auth.models import User
from django.core.mail import send_mail
from scistudwork.models import *
class IndexView(TemplateView):
template_name = 'scistudwork/index.html'
def get_context_data(self, *args, **kwargs):
context = super(IndexView, self).get_context_data(*args, **kwargs)
types = StudentWorkType.objects.all()
context['types'] = types
return context
def post(self, request, *args, **kwargs):
data = self.request.POST
student, created = Student.objects.get_or_create(
first_name=data['first_name'],
last_name=data['last_name'],
middle_name=data['middle_name'],
email=data['email']
)
43
current_user = User.objects.get(pk=1)
current_qual = StudentQualification.objects.get(pk=1)
work_type = StudentWorkType.objects.get(pk=data['work_type'])
final_date = u'%s-%s-%s' % (data['year'], data['month'], data['day'])
work, work_created = StudentSciWorks.objects.get_or_create(
title=data['title'],
defaults={
"owner": current_user,
"stud": student,
"work_type": work_type,
"qual": current_qual,
"target": data['target'],
"final_date": final_date
}
)
work.save()
send_mail(
u'Вам добавлена новая работа!',
u"""
Уважаемый %s %s, вам добавлена новая работа - %s.
тема работы: %s
описание работы:
%s
Дата защиты: %s
"""
% (data['first_name'], data['middle_name'], work_type.name, data['title'], data['target'], final_date),
'',
[data['email']],
fail_silently=True,
)
return HttpResponseRedirect('show/%d' % work.id)
class FormView(TemplateView):
template_name = 'scistudwork/form.html'
def get_context_data(self, *args, **kwargs):
context = super(FormView, self).get_context_data(*args, **kwargs)
# Получаем список студентов
44
students = Student.objects.all()
context['students'] = students
return context
def post(self, *args, **kwargs):
context = self.get_context_data(**kwargs)
students = Student.objects.all()
student = get_object_or_404(Student, pk=self.request.POST['student_id'])
context['stud_work'] = student.studentsciworks_set.filter(final_date__year=self.request.POST['year'])
context['students'] = students
return super(TemplateView, self).render_to_response(context, **kwargs)
class BaseView(TemplateView):
template_name = 'scistudwork/base.html'
def get_context_data(self, *args, **kwargs):
context = super(BaseView, self).get_context_data(*args, **kwargs)
work = get_object_or_404(StudentSciWorks, pk=kwargs['pk'])
context['work'] = work
return context
Листинг studsciwork/view.py
45
Сторона пользователя
<!DOCTYPE HTML>
<html>
<head>
<!— Standard Meta —>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!— Site Properties —>
<title>Responsive Elements - Semantic</title>
<link rel="stylesheet" type="text/css" href="/static/css/semantic.min.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script src="/static/js/semantic.min.js"></script>
</head>
<body>
<style type="text/css">
body {
margin: 5px;
}
</style>
<div class="ui grid container">
<div class="sixteen wide column">
<a class="ui primary basic button" href="{% url 'scistudwork:index_studwork' %}">К списку работ студента</a>
<a class="ui primary basic button" href="{% url 'scistudwork:create_studwork' %}">Создать</a>
</div>
<div class="sixteen wide column">
<h3 class="ui center aligned header">Просмотр работы студента</h3>
<div class="ui equal width form">
<div class="ui container">
<div class="fields">
<div class="field">
<label>Тип работы студента:</label>
<div class="ui visible message">
<p>{{ work.work_type }}</p>
</div>
</div>
<div class="field">
46
<label>E-mail студента:</label>
<div class="ui visible message">
<p>{{ work.stud.email }}</p>
</div>
</div>
<div class="field">
<label>Тема работы:</label>
<div class="ui visible message">
<p>{{ work.title }}</p>
</div>
</div>
</div>
</div>
<div class="ui container">
<div class="fields">
<div class="field">
<label>Описание работы студента:</label>
<div class="ui visible message">
<p>{{ work.target }}</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Листинг templates/studsciwork/base.html
<!DOCTYPE HTML>
<html>
<head>
<!— Standard Meta —>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
47
<!— Site Properties —>
<title>Responsive Elements - Semantic</title>
<link rel="stylesheet" type="text/css" href="/static/css/semantic.min.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script src="/static/js/semantic.min.js"></script>
</head>
<style type="text/css">
body {
margin: 5px;
}
</style>
<body>
<div class="ui grid container">
<div class="sixteen wide column">
<a class="ui primary basic button" href="{% url 'scistudwork:create_studwork' %}">Создать</a>
</div>
<div class="sixteen wide column">
<form action="{% url 'scistudwork:index_studwork' %}" method="post">
{% csrf_token %}
<h3 class="ui center aligned header">Выбор студента</h3>
<div class="ui equal width form">
<div class="ui container">
<div class="fields">
<div class="field">
<label>Год сдачи работы</label>
<select class="ui dropdown" name="year">
<option value="2017">2017</option>
<option value="2018">2018</option>
<option value="2019">2019</option>
<option value="2020">2020</option>
<option value="2021">2021</option>
</select>
</div>
<div class="field">
<label>Студент</label>
<select class="ui dropdown" name="student_id" required>
<option value="" disabled selected>Студент</option>
48
{% for student in students %}
<option value={{student.id}} >{{student.first_name }} {{student.last_name}}</option>
{% endfor %}
</select>
</div>
</div>
<div class="ui container">
<div class="fields">
<div class="field">
<input class="positive ui button" type="submit" value="Подтвердить" />
</div>
</div>
</div>
</div>
</div>
</form>
</div>
<div class="sixteen wide column">
{% if stud_work %}
<table class="ui celled table">
<thead>
<tr>
<th>Название работы</th>
<th>Тип работы</th>
<th>Дата сдачи</th>
</tr>
</thead>
<tbody>
{% for work in stud_work %}
<tr>
<td><a href="{% url 'scistudwork:show_stud_work' work.id %}">{{ work.title }}</a></td>
<td>{{ work.work_type }}</td>
<td>{{ work.final_date }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
{% endif %}
</div>
49
</div>
</body>
</html>
Листинг templates/studsciwork/form.html
<!DOCTYPE HTML>
<html>
<head>
<title>Responsive Elements - Semantic</title>
<!— Standard Meta —>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!— Site Properties —>
<link rel="stylesheet" type="text/css" href="/static/css/semantic.min.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script src="/static/js/semantic.min.js"></script>
<script src="/static/js/moment.min.js"></script>
<script src="/static/js/index.js"></script>
</head>
<body>
<style type="text/css">
body {
margin: 5px;
}
</style>
<div class="ui grid container">
<div class="sixteen wide column">
<a class="ui primary basic button" href="{% url 'scistudwork:index_studwork' %}">К списку работ студента</a>
</div>
<div class="sixteen wide column">
<form method="post">
{% csrf_token %}
<h3 class="ui center aligned header">Описание работы студента</h3>
<div class="ui equal width form">
<div class="ui container">
<div class="fields">
<div class="field">
<label>Фамилия студента</label>
<input name="last_name" placeholder="Фамилия" required>
50
</div>
<div class="field">
<label>Имя студента</label>
<input name="first_name" placeholder="Имя" type="text" required>
</div>
<div class="field">
<label>Отчество студента</label>
<input name="middle_name" placeholder="Отчество" type="text" required>
</div>
</div>
</div>
<div class="ui container">
<div class="fields">
<div class="field">
<label>Выберете тип работы студента</label>
<select class="ui dropdown" name="work_type" required>
<option value="" disabled selected>Тип работы</option>
{% for type in types %}
<option value="{{ type.id }}">{{ type.name }}</option>
{% endfor %}
</select>
</div>
<div class="field">
<label>E-mail студента</label>
<input name="email" type="email" required>
</div>
<div class="field">
<label>Тема работы</label>
<input name="title" type="text" required>
</div>
</div>
</div>
<div class="ui container">
<div class="fields">
<div class="field">
<label>Описание работы студента</label>
<textarea name="target" required></textarea>
</div>
51
</div>
</div>
<div class="ui container">
<div class="fields">
<div class="field">
<label>Дата защиты</label>
</div>
</div>
</div>
<div class="ui container">
<div class="fields">
<div class="field">
<select class="ui dropdown" name="day" type="day" required>
</select>
</div>
<div class="field">
<select class="ui dropdown" name="month" required>
</select>
</div>
<div class="field">
<select class="ui dropdown" name="year" required>
</select>
</div>
</div>
</div>
<div class="ui container">
<div class="fields">
<div class="field">
<button class="positive ui button">Отправить</button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</body>
</html>
52
Листинг templates/studsciwork/index.html
$(document).ready(function() {
function renderYears() {
var yearSelect = $("select[name='year']"),
currentYear = new Date().getFullYear(),
yearItems = '';
for (var year = currentYear; year <= currentYear + 10; year++) {
yearItems += '<option value="' + year + '">' + year + '</option>';
}
yearSelect.append(yearItems);
}
renderYears();
function renderMonths() {
var monthSelect = $("select[name='month']"),
monthItems = '';
for (var month = 1; month <= 12; month++) {
monthItems += '<option value="' + month + '">' + month + '</option>';
}
monthSelect.append(monthItems);
}
renderMonths();
function renderDays(count) {
count = count || 31;
var daySelect = $("select[name='day']"),
dayItems = '';
for (var day = 1; day <= count; day++) {
dayItems += '<option value="' + day + '">' + day + '</option>';
}
$(daySelect).html(dayItems);
}
renderDays();
$("select[name='month']").on('change', function() {
var currentYear = $("select[name='year']").val();
var currentDays = moment(currentYear + '-' + this.value, 'YYYY-M').daysInMonth();
renderDays(currentDays);
});
});
Листинг static/js/index.js
53
1/--страниц
Пожаловаться на содержимое документа