Rails7.1 | 動画学習アプリ作成 | 21 | プロジェクトとタスクモデル - 学生向けプログラミング入門

↓↓クリックして頂けると励みになります。

【20 | trestle】 << 【ホーム】 >> 【22 | アクションテキスト(ActionText)】

プロジェクトとタスクのモデルを作成していきます。

コマンド（２つ）
rails g model Project name:string content:text price:bigint user:references

rails g model Task title:string note:text video:string header:boolean tag:bigint project:references

「db\migrate\20200802073112_create_tasks.rb」ファイルに記述を追加します。

記述追加　db\migrate\20200802073112_create_tasks.rb(7行目)
「, null: false, default: false」の記述を追加しています。

t.boolean :header, null: false, default: false

db\migrate\20200802073112_create_tasks.rb

class CreateTasks < ActiveRecord::Migration[7.1]
  def change
    create_table :tasks do |t|
      t.string :title
      t.text :note
      t.string :video
      t.boolean :header, null: false, default: false
      t.bigint :tag
      t.references :project, null: false, foreign_key: true

      t.timestamps
    end
  end
end

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

プロジェクトモデルにバリデーションを追加します。
「app\models\project.rb」ファイルを以下のように編集します。

記述更新　app\models\project.rb

class Project < ApplicationRecord
  belongs_to :user
  has_many :tasks
  
  validates :name, presence: true, length: { maximum: 50 }
  validates :price, presence: true, numericality: { only_integer: true }
end

タスクモデルにもバリデーションを追加します。
「app\models\task.rb」ファイルを以下のように編集します。

記述更新　app\models\task.rb

class Task < ApplicationRecord
  belongs_to :project

  validates :title, presence: true, length: { maximum: 50 }
  validates :video, presence: true
  validates :tag, presence: true
  validates :project, presence: true
end

ユーザモデルに以下の記述を追加します。

記述追加　app\models\user.rb(3行目)

has_many :projects

app\models\user.rb

class User < ApplicationRecord

  has_many :projects

  has_one_attached :avatar

  validates :full_name, presence: true, length: {maximum: 50}
  
  # Include default devise modules. Others available are:
  # :confirmable, :lockable, :timeoutable, :trackable and :omniauthable
  devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :validatable,
          :confirmable, :omniauthable

  def self.from_omniauth(auth)
    user = User.where(email: auth.info.email).first

    if user
      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

tresteでプロジェクトとタスクの管理ができるように実装します。

「app\admin\dashboard_admin.rb」ファイルの8,9行目にプロジェクトとタスクの記述を追加します。

@project_count = Project.count()
@task_count = Task.count()

記述追加　【app\admin\dashboard_admin.rb】8,9行目

Trestle.admin(:dashboard) do
    menu do
        item :dashboard, icon: "fa fa-tachometer"
    end
    controller do 
        def index
            @user_count = User.count()
            @project_count = Project.count()
            @task_count = Task.count()
        end
    end
end

「app\views\admin\dashboard\index.html.erb」ファイルを以下のように編集します。

記述編集　【app\views\admin\dashboard\index.html.erb】

<div class="main-content-area">
    <div class="main-content-container">
        <div class="main-content">
            <div class="row">
                <div class="col-md-3 bg-primary">
                    <div class="card text-white text-center">
                        <h1><%= @user_count %></h1>
                        <p>ユーザー</p>
                    </div>
                </div>
                <div class="col-md-3 bg-warning">
                    <div class="card text-white text-center">
                        <h1><%= @project_count %></h1>
                        <p>プロジェクト</p>
                    </div>
                </div>
                <div class="col-md-3 bg-success">
                    <div class="card text-white text-center">
                        <h1><%= @task_count %></h1>
                        <p>タスク</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>