Django Unicorn

По своей природе unicorn - библиотека, которая позволяет вам ускоренно писать ajax запросы, используя только синтаксис python

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

Для начала нам нужно установить библиотеки

pipenv install django
pipenv install django-unicorn

Далее создаем проект и приложение

django-admin startproject OneShot .
python manage.py startapp Pages

Включаем их в наш набор настроек в settings.py

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    "django_unicorn",
    "Pages"
]

И указываем пути для использования скриптов django unicorn

urlpatterns = [
    path('admin/', admin.site.urls),
    path("unicorn/", include("django_unicorn.urls")),
    path("", include("Pages.urls")),
]

После этого создаем в нашем приложении Pages папки components и templates

Обратите внимание на названия файлов:

они должны совпадать
ру файл пишется через нижнее подчеркивание, html через дефис

Это ограничение самого юникорна, связанное с механизмом адресации

Далее создадим простую таблицу

from django.db import models

class Tasks(models.Model):

    task = models.TextField(max_length=350)
    date = models.DateField()

И напишем наш первый компонент

from django_unicorn.components import UnicornView
from Pages.models import Tasks

class MainPageView(UnicornView):
    
    tasks = [[x.task, x.date, x.pk] for x in Tasks.objects.all()]
    new_task = ''
    new_date = ''

    def save(self): 
        new_field = Tasks(task = self.new_task, date = self.new_date)
        new_field.save()
        self.tasks = [[x.task, x.date, x.pk] for x in Tasks.objects.all()]
        self.new_task = ''
        self.new_date = ''
    
    def delete(self, pk):
        field = Tasks.objects.get(id = pk)
        field.delete()
        self.tasks = [[x.task, x.date, x.pk] for x in Tasks.objects.all()]

Здесь нужно обратить внимание на название нашего класса, оно должно совпадать с названием ру файла, но без подчеркиваний, каждое слово с большой буквы и с припиской View

Рассмотрим шаблон

{% load unicorn %}
<html>
  <head>
    {% unicorn_scripts %}
  </head>
  <body>
    <div unicorn:view>
      {% csrf_token %}
      <input type="text" unicorn:model.lazy="new_task" placeholder="New task" id="new_task">
      <input type="text" unicorn:model.lazy="new_date" placeholder="New date" id="new_date">
      <button unicorn:click="save">Add</button>
      {% if tasks %}
        {% for elements in tasks %}
          <p>
            {% for element in elements %}
              {% if forloop.counter == 3 %}
              <button unicorn:click="delete({{element}})">Delete</button>
              {% else %}
                {{element}}
              {% endif %}
            {% endfor %}
          </p>
        {% endfor %}
      {% endif %}
    </div>
  </body>
</html>

Из нового мы загружаем юникорн {% load unicorn %} и его скрипты {% unicorn_scripts %}. Далее мы вставляем {% csrf_token %} непосредственно в body и добавляем unicorn:view к div, чтобы указать библиотеке, с чем именно она должна работать.

Юникорн отправляет все переменные класса, как контекст, по этому мы можем к немку обратиться. Чтобы привязать поле ввода к переменной мы используем конструкцию unicorn:model.lazy="имя_переменной"

К кнопкам мы привязали функции нашего класса, которые будут выполняться по нажатию. На примере функции delete мы можем увидеть прямое указание переменных для обработки.

Настроим маршруты для нашей главной страницы

from django.urls import path
from .components.main_page import MainPageView

urlpatterns = [
    path('', MainPageView.as_view(), name='index'),
]

Задание:

Написать вторую страницу для редактирования записей
Создать механизм педактирования записей