songtianlun
09b3f06ad4
- Change button classes from `btn` to `btn btn-xs` for all pagination buttons - Ensure consistent styling across all pagination elements These changes standardize the button sizes in the pagination component, improving the visual uniformity. The adjustment enhances user experience by making the pagination buttons more appropriately sized within the interface, without affecting functionality.
86 lines
4.4 KiB
Plaintext
86 lines
4.4 KiB
Plaintext
<%# app/views/shared/_pagination.html.erb %>
|
|
<% if collection.total_pages > 1 %>
|
|
<div class="flex flex-col items-center mt-16 gap-6">
|
|
<!-- 页码信息 -->
|
|
<div class="text-base-content/70 font-light">
|
|
<span class="px-4 py-2 bg-base-200/50 rounded-full">
|
|
Page <%= collection.current_page %> of <%= collection.total_pages %>
|
|
</span>
|
|
</div>
|
|
|
|
<!-- 分页控件 -->
|
|
<div class="join shadow-lg">
|
|
<!-- 首页 -->
|
|
<%= link_to url_for(page: 1, region: params[:region], country: params[:country], sort: params[:sort]),
|
|
class: "join-item btn btn-xs #{collection.first_page? ? 'btn-disabled' : 'btn-ghost'}" do %>
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 19l-7-7 7-7m8 14l-7-7 7-7" />
|
|
</svg>
|
|
<% end %>
|
|
|
|
<!-- 上一页 -->
|
|
<%= link_to url_for(page: collection.prev_page || 1, region: params[:region], country: params[:country], sort: params[:sort]),
|
|
class: "join-item btn btn-xs #{collection.first_page? ? 'btn-disabled' : 'btn-ghost'}" do %>
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
|
|
</svg>
|
|
<% end %>
|
|
|
|
<!-- 页码 -->
|
|
<% page_window = 2 # 当前页面前后显示的页码数 %>
|
|
<% start_page = [1, collection.current_page - page_window].max %>
|
|
<% end_page = [collection.total_pages, collection.current_page + page_window].min %>
|
|
|
|
<% if start_page > 1 %>
|
|
<%= link_to 1, url_for(page: 1, region: params[:region], country: params[:country], sort: params[:sort]),
|
|
class: "join-item btn btn-xs btn-ghost hover:bg-primary/5" %>
|
|
<% if start_page > 2 %>
|
|
<button class="join-item btn btn-xs btn-ghost btn-disabled">...</button>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
<% (start_page..end_page).each do |page| %>
|
|
<% if page == collection.current_page %>
|
|
<button class="join-item btn btn-xs btn-ghost bg-primary/10 font-medium">
|
|
<%= page %>
|
|
</button>
|
|
<% else %>
|
|
<%= link_to page, url_for(page: page, region: params[:region], country: params[:country], sort: params[:sort]),
|
|
class: "join-item btn btn-xs btn-ghost hover:bg-primary/5" %>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
<% if end_page < collection.total_pages %>
|
|
<% if end_page < collection.total_pages - 1 %>
|
|
<button class="join-item btn btn-xs btn-ghost btn-disabled">...</button>
|
|
<% end %>
|
|
<%= link_to collection.total_pages,
|
|
url_for(page: collection.total_pages, region: params[:region], country: params[:country], sort: params[:sort]),
|
|
class: "join-item btn btn-xs btn-ghost hover:bg-primary/5" %>
|
|
<% end %>
|
|
|
|
<!-- 下一页 -->
|
|
<%= link_to url_for(page: collection.next_page || collection.total_pages, region: params[:region], country: params[:country], sort: params[:sort]),
|
|
class: "join-item btn btn-xs #{collection.last_page? ? 'btn-disabled' : 'btn-ghost'}" do %>
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
|
|
</svg>
|
|
<% end %>
|
|
|
|
<!-- 末页 -->
|
|
<%= link_to url_for(page: collection.total_pages, region: params[:region], country: params[:country], sort: params[:sort]),
|
|
class: "join-item btn btn-xs #{collection.last_page? ? 'btn-disabled' : 'btn-ghost'}" do %>
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 5l7 7-7 7M5 5l7 7-7 7" />
|
|
</svg>
|
|
<% end %>
|
|
</div>
|
|
|
|
<!-- 结果统计 -->
|
|
<div class="text-sm text-base-content/60 font-light">
|
|
Showing <%= collection.offset_value + 1 %> to
|
|
<%= collection.last_page? ? collection.total_count : collection.offset_value + collection.limit_value %>
|
|
of <%= collection.total_count %> <%= collection_name || 'items' %>
|
|
</div>
|
|
</div>
|
|
<% end %> |