⭐️[管理画面] 掲示板/ユーザのCRUD機能の作成
概要
手順
・今回の課題では、今までの課題で使ったことがある機能もあったので、
この課題で新しく出てきた機能で、自分の理解の薄い内容のみアウトプットしていきます!
メニューのアクティブ・非アクティブ化
Bootstrapを使用しているので、例えば下記のようにclassにactiveを含めると、アクティブにしてくれます。
<a class="nav-link active" href="#">Active</a>
これを使って、アクティブにしたいときにはclass
にactive
を含めるようにして実装していきます。
三項演算子を使って、真のときはactive、偽のときは何も返さない(''
)ようにします。
controller_path
でコントローラー名を取得できる。
・view(_sidebar.html.erb)で、ヘルパーメソッドを使い
そのメニューにいる時にメニューをアクティブ、
いない時に非アクティブに出来る。
<li class="nav-item"> <%= link_to admin_boards_path, class: "nav-link #{active_if('admin/boards')}" do %> <i class="nav-icon far fa-file"></i> <p> <%= t('boards.index.title') %> </p> <% end %> </li>
<li class="nav-item"> <%= link_to admin_users_path, class: "nav-link #{active_if('admin/users')}" do %> <i class="nav-icon far fa-user"></i> <p> <%= t('users.index.title') %> </p> <% end %> </li>
ransackを使った範囲指定の検索機能
今回は作成日を指定して検索できるように実装しました。 掲示板の「いつからいつまで」の検索条件について、「いつまで」部分をカスタマイズします。
・config/initializers配下にransack.rbファイルを作成し、lteq_end_of_day
というpredicate(述語)を追加します。
predicate(述語)とは、
title_or_body_cont
の、_cont
のような検索する範囲を定義するものだと解釈しました。
・created_at_lteq
だと0:00が基準になってしまうので正しく絞り込みができないので、
lteq
をカスタマイズしたいと思います。
arel_predicate: 'lteq'
でカスタマイズしたいpredicateを指定。
formatter: proc { |v| v.end_of_day }
では、end_of _day
というすでに裏方で定義されているメソッドを
formatter: proc { |v| v.〇〇}
の〇〇に代入すれば、
lteqをend_of_dayに置き換えることができる。
end_of_dayとはデフォルトの設定を置き換えることができるメソッド。
https://api.rubyonrails.org/classes/Time.html#method-i-end_of_day
・viewに反映
app/views/admin/users/_search.html.erb <%= search_form_for @search, url: admin_users_path do |f| %> <div class="row"> <div class="form-inline align-items-center mx-auto"> <div class="col-auto"> <%= f.search_field :first_name_or_last_name_cont, class: 'form-control', placeholder: t('defaults.search_word') %> </div> <div class="col-auto"> <%= f.select :role_eq, User.roles_i18n.invert.map{|key, value| [key, User.roles[value]]}, { include_blank: t('defaults.unspecified') }, { class: 'form-control mr-1' } %> </div> <div class="col-auto"> <%= f.submit class: 'btn btn-primary' %> </div> </div> </div> <% end %>
enum_helpを使ったenum値の多言語化対応
gem 'enum_help'
で
bundle install
enum_helpというgemを導入する。
config/locales配下に日本語化用のファイルを下記のように用意。
ja: enums: user: role: general: 一般 admin: 管理者
Userモデルで定義している
enum role: { general: 0, admin: 1 }
この記述を下記のようにi18nの翻訳機能を使う事によって、ユーザーのrole(権限)も翻訳したものを表示できるようになる。
# app/views/admin/users/_user.html.erb <%= user.role_i18n %>
✅総括
今回の課題で基礎編は終わりなので、応用編に進む前にしっかりと自分の理解が足りていない箇所の復習をして更なる知識や自走力の向上に向けて学習の方頑張っていきたいです!!