riq0h/rails8-memoapp
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

まともなページネーション

Browse source
This commit is contained in:
Rikuoh Tsujitani 2025-02-26 06:57:17 +09:00
parent 6dd33e849b
commit 5181ddd083
Signed by: riq0h
GPG key ID: 010F09DEA298C717
2 changed files with 21 additions and 7 deletions

2
app/views/memos/_form.html.erb
View file

@ -2,7 +2,7 @@
<div class="space-y-6"> <div class="space-y-6">
<%= form_with(model: memo, <%= form_with(model: memo,
class: "space-y-6", class: "space-y-6",
data: { turbo: true }) do |f| %> data: { turbo: false }) do |f| %>
<% if memo.errors.any? %> <% if memo.errors.any? %>
<div class="bg-red-50 p-4 rounded-md"> <div class="bg-red-50 p-4 rounded-md">
<div class="text-red-700"> <div class="text-red-700">

26
app/views/memos/index.html.erb
View file

@ -12,7 +12,7 @@
class: "bg-blue-500 hover:bg-blue-600 text-white font-bold py-2 px-4 rounded-lg transition-colors duration-200", class: "bg-blue-500 hover:bg-blue-600 text-white font-bold py-2 px-4 rounded-lg transition-colors duration-200",
data: { turbo_frame: "modal" } do %> data: { turbo_frame: "modal" } do %>
<span class="flex items-center"> <span class="flex items-center">
＋ 出力開始 ＋ 入力
</span> </span>
<% end %> <% end %>
</div> </div>
@ -22,9 +22,23 @@
<%= render @memos %> <%= render @memos %>
<%= render "empty_results", query: @q&.content_cont if @memos.empty? %> <%= render "empty_results", query: @q&.content_cont if @memos.empty? %>
</div> </div>
<div class="text-center mt-8"> <% unless @memos.empty? %>
<%= link_to_next_page @memos, "気力十分😤", <div class="text-center mt-8 flex justify-center items-center gap-4">
class: "inline-flex items-center px-4 py-2 bg-blue-500 hover:bg-blue-600 text-white font-medium rounded-lg transition-colors duration-200", <div class="flex-1 text-right">
data: { turbo_frame: "memos-container" } %> <%= link_to_previous_page @memos, "後退",
</div> class: "inline-flex items-center px-4 py-2 bg-gray-500 hover:bg-gray-600 text-white font-medium rounded-lg transition-colors duration-200",
data: { turbo_frame: "memos-container" } if @memos.current_page > 1 %>
</div>
<div class="text-gray-700 mx-2">
<%= @memos.current_page %> / <%= @memos.total_pages %> 枚数
</div>
<div class="flex-1 text-left">
<%= link_to_next_page @memos, "前進",
class: "inline-flex items-center px-4 py-2 bg-blue-500 hover:bg-blue-600 text-white font-medium rounded-lg transition-colors duration-200",
data: { turbo_frame: "memos-container" } %>
</div>
</div>
<% end %>
<% end %> <% end %>