STEP 9: タスクの簡易表示

前回に引き続き、基本の7アクション以外のアクションを追加します。

/tasks/123 で id の値が 123 であるタスクの詳細画面が表示されますが、/tasks/123/simple で簡易表示されるようにしてみましょう。

まず、ルーティングを修正します。

$ edit config/routes.rb

ActionController::Routing::Routes.draw do |map|
  map.root :controller => 'top', :action => 'index'

  map.resources :tasks,
    :member => { :simple => :get },  
    :collection => { :unfinished => :get }
end

:member => { :simple => :get }, という一行を加えています。

"collection" が「集合」を意味するのに対して、"member" は「要素」を意味します。

unfinishedアクションは「未完了タスク」という集合を表示(GET)するものでした。それに対して、simpleアクションは「特定のタスク」を表示(GET)します。ただし、その表示のスタイルを「簡潔(simple)」と指定しています。

続いて、Tasks コントローラにsimpleアクションを追加します。

$ edit app/controllers/tasks_controller.rb

class TasksController < ApplicationController
  (省略)

  def show
    @task = Task.find(params[:id])
  end

  def simple
    @task = Task.find(params[:id])
  end

  (省略)
end

simpleアクション用のテンプレートを作成します。

$ edit app/views/tasks/simple.html.erb

<h1>タスク簡易表示</h1>

<div class="task">
  <%= content_tag(:span, h(@task.subject), :class => @task.done? ? 'done' : '') %>
  <span class="due_date"><%= @task.due_date.strftime('%Y/%m/%d') %></span>
</div>

スタイルシートを修正します。

$ edit public/stylesheets/application.css

(省略)
table.attributes th {
  text-align: right;
  background-color: #cc4;
}

div.task {
  border: 1px solid #008;
  padding: 2px;
}

div.task span.done {
  text-decoration: line-through;
}

div.task span.due_date {
  color: #080;
  font-size: smaller;
}
(省略)

ヘルパーメソッドoperations_on_taskを修正します。

$ edit app/controllers/tasks_controller.rb

module TasksHelper
  def operations_on_task(task)
    links = []
    links << link_to('簡易表示', [ :simple, task ])
    links << link_to('編集', [ :edit, task ])
    links << link_to('完了', '#')
    links << link_to('削除', task, :method => :delete,
      :confirm => '本当に削除しますか？')
    links.join(' | ')
  end
end

ブラウザでタスク一覧ページを表示します。

適当なタスクの「簡易表示」リンクをクリックします。