6d1f526394
Move pagination logic to preserve filter query parameters (school_id, order_by, asc, per_page) when navigating between pages. - Added QueryParams field to Pagination struct and pageURL() helper - Server-side: buildListCoursesQueryParams() encodes active filters into pagination links as query string - Client-side: setupPaginationLinks() intercepts pagination link clicks, reads current filter state from DOM selects, and constructs full URLs with all parameters preserved - Added data-paginated/data-base-url/data-current-page attributes to pagination nav for JS targeting Closes #1
106 lines
2.8 KiB
Plaintext
106 lines
2.8 KiB
Plaintext
package bootstrap
|
||
|
||
import "strconv"
|
||
|
||
type IndexCourseCategoryItem struct {
|
||
ID string
|
||
Name string
|
||
Description string
|
||
ExampleThemes []string
|
||
Count int
|
||
}
|
||
|
||
// courseItemCard is a card that renders a single course thematic item
|
||
// that holds multiple learning types. It expected to have a basic description
|
||
// and an amount of items.
|
||
templ courseItemCard(item IndexCourseCategoryItem) {
|
||
<div class="card">
|
||
<div class="card-body">
|
||
<h5 class="card-title">{ item.Name }</h5>
|
||
<hr/>
|
||
<p>{ item.Description }</p>
|
||
if len(item.ExampleThemes) > 0 {
|
||
<p>В данной категории вы можете найти курсы по темам:</p>
|
||
<ul>
|
||
for _, exampleItem := range item.ExampleThemes {
|
||
<li>
|
||
<span class="d-inline-block text-truncate col-8">{ exampleItem }</span>
|
||
</li>
|
||
}
|
||
</ul>
|
||
}
|
||
<div class="d-flex justify-content-between align-items-center">
|
||
<a href={ templ.URL("/courses/" + item.ID) } class="btn btn-sm btn-outline-primary col-6">
|
||
Open
|
||
</a>
|
||
<small class="text-body-secondary">
|
||
{ strconv.Itoa(item.Count) } items.
|
||
</small>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
}
|
||
|
||
templ courseCategory(items []IndexCourseCategoryItem) {
|
||
<div class="container w-75 mb-4">
|
||
<div class="row g-4">
|
||
for _, item := range items {
|
||
<div class="col-12 col-md-8 col-lg-4">
|
||
@courseItemCard(item)
|
||
</div>
|
||
}
|
||
</div>
|
||
</div>
|
||
}
|
||
|
||
type Pagination struct {
|
||
Page int
|
||
TotalPages int
|
||
BaseURL string
|
||
QueryParams string
|
||
}
|
||
|
||
func (p Pagination) pageURL(page int) string {
|
||
url := p.BaseURL + "?page=" + strconv.Itoa(page)
|
||
if p.QueryParams != "" {
|
||
url += "&" + p.QueryParams
|
||
}
|
||
return url
|
||
}
|
||
|
||
templ pagination(p Pagination) {
|
||
if p.Page > 0 && p.TotalPages > 0 {
|
||
<nav aria-label="Page navigation" data-paginated="true" data-base-url={ p.BaseURL } data-current-page={ strconv.Itoa(p.Page) }>
|
||
<ul class="pagination justify-content-center">
|
||
<li class={ "page-item" , templ.KV("disabled", p.Page==1), }>
|
||
<a href={ templ.URL(p.pageURL(p.Page-1)) } class="page-link">Previous</a>
|
||
</li>
|
||
for i := max(p.Page-2, 1); i < min(p.TotalPages, 10); i++ {
|
||
<li
|
||
class={ "page-item" , templ.KV("active", p.Page==i), }
|
||
>
|
||
<a href={ templ.URL(p.pageURL(i)) } class="page-link">{ strconv.Itoa(i) }</a>
|
||
</li>
|
||
}
|
||
<li class={ "page-item" , templ.KV("disabled", p.Page==p.TotalPages), }>
|
||
<a href={ templ.URL(p.pageURL(p.Page+1)) } class="page-link">Next</a>
|
||
</li>
|
||
</ul>
|
||
</nav>
|
||
}
|
||
}
|
||
|
||
type MainPageParams struct {
|
||
Breadcrumbs BreadcrumbsParams
|
||
Categories []IndexCourseCategoryItem
|
||
Pagination Pagination
|
||
}
|
||
|
||
templ MainPage(pageType PageKind, s stats, params MainPageParams) {
|
||
@root(pageType, s) {
|
||
@listCoursesSectionHeader(params.Breadcrumbs)
|
||
@courseCategory(params.Categories)
|
||
@pagination(params.Pagination)
|
||
}
|
||
}
|