Rails6.0 | 動画学習サイトを作成| 33 | レビューモデル - 学生向けプログラミング入門

[32]クレジットカード決済の実装　<<　[ホームに戻る]　>> [34]レビューコントローラ

「raty-js」をインストールします。

コマンド
yarn add raty-js@2.9.0

「app\assets\stylesheets\application.scss」ファイルに以下の記述を追加します。

記述追加　app\assets\stylesheets\application.scss(24行目)

@import 'raty-js/lib/jquery.raty';

app\assets\stylesheets\application.scss

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */

 @import 'bulma';
 @import 'bulma-extensions';
 @import 'bulma-extensions/bulma-carousel/dist/css/bulma-carousel.min';

 @import 'noty/lib/noty';
 @import 'noty/lib/themes/sunset';

 @import 'raty-js/lib/jquery.raty';

「app\javascript\packs\application.js」ファイルに以下の記述を追加します。

記述追加　app\javascript\packs\application.js(10行目)

require("raty-js")

app\javascript\packs\application.js

// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.

require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("raty-js")

window.Noty = require("noty")

window.BulmaCarousel = require("bulma-extensions/bulma-carousel/dist/js/bulma-carousel")

$(document).on('turbolinks:load', () => {
    $('.toggle').on('click', (e) => {
        e.stopPropagation();
        e.preventDefault();
        $('#' + e.target.getAttribute('aria-controls')).toggleClass('is-hidden');
    })
})

// Uncomment to copy all static images under ../images to the output folder and reference
// them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>)
// or the `imagePath` JavaScript helper below.
//
// const images = require.context('../images', true)
// const imagePath = (name) => images(name, true)

require("trix")
require("@rails/actiontext")

レビューモデルを作成します。

コマンド
一文です。
rails g model Review review:text stars:bigint project:references user:references --no-test-framework

「db\migrate\20200804091823_create_reviews.rb」ファイルを以下のように更新します。

記述更新　db\migrate\20200804091823_create_reviews.rb
5行目に「, default: 1」の記述を追加しています。

class CreateReviews < ActiveRecord::Migration[6.0]
  def change
    create_table :reviews do |t|
      t.text :review
      t.bigint :stars, default: 1
      t.references :project, null: false, foreign_key: true
      t.references :user, null: false, foreign_key: true

      t.timestamps
    end
  end
end

コマンド　マイグレーション適用
rails db:migrate

「app\models\user.rb」ファイルに以下の記述を追加します。

app\models\user.rb(6行目)

has_many :reviews

app\models\user.rb

class User < ApplicationRecord

  has_many :projects
  has_many :subscriptions
  has_many :projects, through: :subscriptions
  has_many :reviews

  has_one_attached :avatar

  # Include default devise modules. Others available are:
  # :confirmable, :lockable, :timeoutable, :trackable and :omniauthable
  devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :validatable,
         :confirmable, :omniauthable

  #長さ50文字以下　入力必須
  validates :full_name, presence: true, length: {maximum: 50}

  def self.from_omniauth(auth)
    user = User.where(email: auth.info.email).first
    if user
      if !user.provider
        user.update(uid: auth.uid, provider: auth.provider, image: auth.info.image)
      end    
      return user
    else
      where(provider: auth.provider, uid: auth.uid).first_or_create do |user|
        user.email = auth.info.email
        user.password = Devise.friendly_token[0, 20]
        user.full_name = auth.info.name   # ユーザーモデルに名前があると仮定
        user.image = auth.info.image # ユーザーモデルに画像があると仮定
        user.uid = auth.uid
        user.provider = auth.provider
      end
    end
  end  

end

「app\models\project.rb」ファイルに以下の記述を追加します。

１．記述追加　app\models\project.rb(7行目)

has_many :reviews

２．記述追加　app\models\project.rb(16行目)

  def average_rating
    reviews.count == 0 ? 0 : reviews.average(:stars).round(1)
  end

app\models\project.rb

class Project < ApplicationRecord
  belongs_to :user

  has_many :tasks
  has_many :subscriptions
  has_many :users, through: :subscriptions
  has_many :reviews

  has_rich_text :description
  has_many_attached :images
  
  validates :name, presence: true, length: { maximum: 50 }
  validates :description, presence: true, length: { maximum: 500 }
  validates :price, presence: true, numericality: { only_integer: true }

  def average_rating
    reviews.count == 0 ? 0 : reviews.average(:stars).round(1)
  end
end