Добавил черновой вариант пагинации и переделал шаблоны

This commit is contained in:
Viner Abubakirov
2026-01-03 13:11:34 +05:00
parent 96a9f47d9d
commit 765e8b46ec
8 changed files with 105 additions and 73 deletions

View File

@@ -1,4 +1,5 @@
from django import views as django_views from django import views as django_views
from django.views.generic import ListView
from django.shortcuts import render from django.shortcuts import render
from django.http.request import HttpRequest from django.http.request import HttpRequest
from django.shortcuts import get_object_or_404 from django.shortcuts import get_object_or_404
@@ -8,16 +9,27 @@ from music.models import Artist
from music.models import Album from music.models import Album
class TrackListView(django_views.View): class TrackListView(ListView):
def get(self, request: HttpRequest, *args, **kwargs): model = Track
tracks = Track.objects.all().select_related("album__artist",).order_by("id") template_name = "music/track_list.html"
return render(request, "music/track_list.html", {"tracks": tracks}) context_object_name = "tracks"
paginate_by = 25
def get_queryset(self):
return (
super().get_queryset()
.select_related("album", "album__artist")
.order_by("id")
)
class ArtistListView(django_views.View): class ArtistListView(ListView):
def get(self, request: HttpRequest, *args, **kwargs): model = Artist
artists = Artist.objects.all() template_name = "music/artist_list.html"
return render(request, "music/artist_list.html", {"artists": artists}) context_object_name = "artists"
paginate_by = 25
def get_queryset(self):
return super().get_queryset().order_by("id")
class ArtistDetailView(django_views.View): class ArtistDetailView(django_views.View):
@@ -26,10 +38,14 @@ class ArtistDetailView(django_views.View):
return render(request, "music/artist_detail.html", {"artist": artist}) return render(request, "music/artist_detail.html", {"artist": artist})
class AlbumListView(django_views.View): class AlbumListView(ListView):
def get(self, request: HttpRequest, *args, **kwargs): model = Album
albums = Album.objects.all().order_by("id") template_name = "music/album_list.html"
return render(request, "music/album_list.html", {"albums": albums}) context_object_name = "albums"
paginate_by = 25
def get_queryset(self):
return super().get_queryset().order_by("id")
class AlbumDetailView(django_views.View): class AlbumDetailView(django_views.View):

View File

@@ -2,25 +2,23 @@
<link rel="stylesheet" href="{% static 'css/album_list.css' %}"> <link rel="stylesheet" href="{% static 'css/album_list.css' %}">
<div class="container"> <div class="album-container">
<div class="album-container"> {% for album in albums %}
{% for album in albums %} <div class="album-card">
<div class="album-card"> <a href="{% url 'music:album_detail' album.id %}" class="album-link">
<a href="{% url 'music:album_detail' album.id %}" class="album-link"> {% if album.cover_image %}
{% if album.cover_image %} <img src="{{ album.cover_image.url }}" alt="{{ album.name }}" class="album-cover">
<img src="{{ album.cover_image.url }}" alt="{{ album.name }}" class="album-cover"> {% else %}
{% else %} <img src="{% static 'img/no-cover.png' %}" alt="No cover" class="album-cover">
<img src="{% static 'img/no-cover.png' %}" alt="No cover" class="album-cover"> {% endif %}
{% endif %}
<div class="album-info"> <div class="album-info">
<h3 class="album-name">{{ album.name }}</h3> <h3 class="album-name">{{ album.name }}</h3>
<p class="album-artist">{{ album.artist }}</p> <p class="album-artist">{{ album.artist }}</p>
</div> </div>
</a> </a>
</div> </div>
{% empty %} {% empty %}
<p>No albums available.</p> <p>No albums available.</p>
{% endfor %} {% endfor %}
</div>
</div> </div>

View File

@@ -2,26 +2,24 @@
<link rel="stylesheet" href="{% static 'css/artist_list.css' %}"> <link rel="stylesheet" href="{% static 'css/artist_list.css' %}">
<div class="container"> <div class="artist-container">
<div class="artist-container"> {% for artist in artists %}
{% for artist in artists %} <div class="artist-card">
<div class="artist-card"> <a href="{% url 'music:artist_detail' artist.id %}" class="artist-link">
<a href="{% url 'music:artist_detail' artist.id %}" class="artist-link">
{% if artist.cover_image %} {% if artist.cover_image %}
<img src="{{ artist.cover_image.url }}" alt="{{ artist.name }}" class="artist-photo"> <img src="{{ artist.cover_image.url }}" alt="{{ artist.name }}" class="artist-photo">
{% else %} {% else %}
<img src="{% static 'img/no-artist.png' %}" alt="No photo" class="artist-photo"> <img src="{% static 'img/no-artist.png' %}" alt="No photo" class="artist-photo">
{% endif %} {% endif %}
<div class="artist-info"> <div class="artist-info">
<h3 class="artist-name">{{ artist.name }}</h3> <h3 class="artist-name">{{ artist.name }}</h3>
</div> </div>
</a> </a>
</div> </div>
{% empty %} {% empty %}
<p>No artists available.</p> <p>No artists available.</p>
{% endfor %} {% endfor %}
</div>
</div> </div>

View File

@@ -0,0 +1,11 @@
{% if page_obj.has_previous %}
<a href="?page={{ page_obj.previous_page_number }}">← Назад</a>
{% endif %}
<span>
Страница {{ page_obj.number }} из {{ page_obj.paginator.num_pages }}
</span>
{% if page_obj.has_next %}
<a href="?page={{ page_obj.next_page_number }}">Вперёд →</a>
{% endif %}

View File

@@ -1,23 +1,22 @@
{% load static %} {% load static %}
<link rel="stylesheet" href="{% static 'css/track_list.css' %}"> <link rel="stylesheet" href="{% static 'css/track_list.css' %}">
<div class="container">
<ul class="track-list"> <ul class="track-list">
{% if tracks %} {% if tracks %}
{% for track in tracks %} {% for track in tracks %}
<li class="track-item" data-track-id="{{ track.id }}" data-track-src="{{ track.file.url }}"> <li class="track-item" data-track-id="{{ track.id }}" data-track-src="{{ track.file.url }}">
<div class="track-info"> <div class="track-info">
<h3 class="track-title">{{ track.title }}</h3> <h3 class="track-title">{{ track.title }}</h3>
<p class="track-artist">Исполнитель: {{ track.album.artist }}</p> <p class="track-artist">Исполнитель: {{ track.album.artist }}</p>
</div>
</li>
{% endfor %}
{% else %}
<div class="empty-state">
<i class="fas fa-music"></i>
<p>Нет добавленных треков</p>
</div> </div>
{% endif %} </li>
</ul> {% endfor %}
</div> {% else %}
{% include 'components/player.html' %} <div class="empty-state">
<i class="fas fa-music"></i>
<p>Нет добавленных треков</p>
</div>
{% endif %}
</ul>

View File

@@ -3,5 +3,8 @@
{% block content %} {% block content %}
<h1>Album List</h1> <h1>Album List</h1>
{% include 'components/album_list.html' with albums=albums %} <div class="container">
{% include 'components/album_list.html' %}
{% include 'components/pagination.html' %}
</div>
{% endblock %} {% endblock %}

View File

@@ -3,5 +3,8 @@
{% block title %}Artist List{% endblock %} {% block title %}Artist List{% endblock %}
{% block content %} {% block content %}
<h1>Artist List</h1> <h1>Artist List</h1>
{% include 'components/artist_list.html' with artists=artists %} <div class="container">
{% include 'components/artist_list.html' with artists=artists %}
{% include 'components/pagination.html' with page_obj=page_obj %}
</div>
{% endblock %} {% endblock %}

View File

@@ -1,5 +1,9 @@
{% extends 'base.html' %} {% extends 'base.html' %}
{% block content %} {% block content %}
{% include 'components/track_list.html' %} <div class="container">
{% include 'components/track_list.html' %}
{% include 'components/pagination.html' %}
{% include 'components/player.html' %}
</div>
{% endblock %} {% endblock %}