Aplicação “mestre detalhe” em Rails 3.1.3

I – Introdução

  • Neste post vamos mostrar os pontos mais importantes comumente usados ao criarmos um app web usando o formato “mestre detalhe”.
  • Vamos criar uma aplicação web para controle de chamados (tickets), muito comum em ambientes como um Service Desk, que será o nome de nossa aplicação.
  • Para cada ticket, existem várias tarefas associadas, que chamamos aqui de tasks.
  • Se preferir usar o Rails versão 3.2.1, vá para este post.

II – Principais tecnologias usadas neste artigo

  • Linux Ubuntu 11.10
  • Ruby 1.9.2
  • Rails 3.1.3

III – O que não precisamos instalar

IV – Sequência de passos para criação

Passo 01 – Crie a aplicação 

$ rails new service_desk
$ cd service_desk

Passo 02 – Ajuste seu arquivo Gemfile

  • Acrescente as linhas abaixo no arquivo Gemfile
gem 'execjs'    # necessário para Linux
gem 'therubyracer'  # necessário para Linux
  • em seguida…
$ bundle install

Passo 03 – Crie os models da aplicação e execute as migrations

$ rails g scaffold ticket ticket_number:string title:string
$ rails g model task description:string ticket:belongs_to
$ bundle exec rake db:migrate

Passo 04 – Ajuste os models Ticket e Task conforme estão a seguir 

class Ticket
  has_many :tasks
  attr_accessible :ticket_number, :title, :tasks_attributes
  validates :ticket_number, presence: true
  accepts_nested_attributes_for :tasks, :reject_if => proc { |a| a[:description].blank? }, allow_destroy: true
end 

class Task
  belongs_to :ticket
  attr_accessible :description
end

Passo 05 – Copie e cole o arquivo application.html.erb, que está a seguir

  • app/views/layouts/application.html.erb  
<!DOCTYPE html>
<html>
  <head>
    <title>Service Desk</title>
    <%= stylesheet_link_tag "application" %>
    <%= javascript_include_tag "application" %>
    <%= csrf_meta_tags %>
  </head>

  <body>
    <header>
      <h1>Service Desk | Tickets Controller</h1>
    </header>
    <section id="main">
      <%= yield %>
    </section>
    <footer>
      <sub>Service Desk | Ticket Controller Web Application</sub>
    </footer>
  </body>
</html>

Passo 06 – Ajustes para mostrar as tarefas (Tasks)

  • Em app/views/tickets/_form.html.erb, adicione o trecho abaixo, antes do botão submit:
<hr/>
 <h2>Task</h2>
 <table>
   <tr><th>Task</th><th>destroy ?</th></tr>
   <% @ticket.tasks.each do |tsk| %>
     <%= f.fields_for :tasks, tsk do |tsk| %>
       <%= render :partial => 'task', locals: {t: tsk} %>
     <% end %>
   <% end %>
 </table>
 <hr/>
  • Crie um arquivo: app/views/tickets/_task.html.erb
  • Copie e cole o seguinte conteúdo
<tr>
   <td class="field">
     <%= t.text_field :description %>
   </td>
   <td>
     <%= t.check_box :_destroy %>
   </td>
 </tr>

Passo 07 – Ajustes para exibição de Ticket e Tasks

  • Em app/views/tickets/show.html.erb
  • Substitua o que estiver abaixo do campo title, pelo seguinte trecho de código
<hr/>
 <h2>Task</h2>
 <table>
   <tr>
     <th>Task
     </th>
   </tr>
   <% @ticket.tasks.each do |tsk| %>
     <tr>
       <td class="field">
         <%= tsk.description %>
       </td>
     </tr>
   <% end %>
 </table>
 <hr/>
<%= link_to 'New Ticket', new_ticket_path %> |
<%= link_to 'Edit', edit_ticket_path(@ticket) %> |
<%= link_to 'View All', tickets_path %>

Passo 08 – Ajuste as actions New e Edit 

  • Em app/controllers/tickets_controller.rb
  • Ajuste as actions New e Edit para que fiquem como a seguir
def new
 @ticket = Ticket.new
 @ticket.tasks.build
 respond_to do |format|
   format.html # new.html.erb
   format.json { render json: @ticket }
 end
end

def edit
 @ticket = Ticket.find(params[:id])
 @ticket.tasks.build
end

V – Executando a aplicação

  • Para ver o resultado localmente. 
$ rails s

VI – Final Feliz

Pronto! Fizemos o básico para iniciarmos um novo projeto usando Ruby On Rails 3.1.3 no Linux Ubuntu 11.10. A aplicação funciona mantendo dois Models, Ticket e Tasks, num formulário tipo mestre-detalhe.

VII – Referências

(1) Instalação do Ruby On Rails 3.1.1 no Linux Ubuntu 11.10
(2) Ruby On Rails 3.1.3 no Linux Ubuntu 11.10: Iniciando um novo projeto – versão 2
(3) Aplicação “mestre detalhe” em Rails 3.2.1

Anúncios

  1. aparentemente esta incompleto este passo a passo, como fica as actions create, update, destroy de ticket, em meu projeto tive problemas… Abrs.

    • oi Rodrigo,

      Obrigado por ler o meu blog.

      Se vc seguiu o passo a passo, o scaffold criou para vc essas actions automaticamente.

      De qualquer forma essas actions eu copiei e colei abaixo, para vc implementar no seu projeto.

      Boa sorte!

      # POST /tickets
      # POST /tickets.json
      def create
      @ticket = Ticket.new(params[:ticket])

      respond_to do |format|
      if @ticket.save
      format.html { redirect_to @ticket, notice: ‘Ticket was successfully created.’ }
      format.json { render json: @ticket, status: :created, location: @ticket }
      else
      format.html { render action: “new” }
      format.json { render json: @ticket.errors, status: :unprocessable_entity }
      end
      end
      end

      # PUT /tickets/1
      # PUT /tickets/1.json
      def update
      @ticket = Ticket.find(params[:id])

      respond_to do |format|
      if @ticket.update_attributes(params[:ticket])
      format.html { redirect_to @ticket, notice: ‘Ticket was successfully updated.’ }
      format.json { head :ok }
      else
      format.html { render action: “edit” }
      format.json { render json: @ticket.errors, status: :unprocessable_entity }
      end
      end
      end

      # DELETE /tickets/1
      # DELETE /tickets/1.json
      def destroy
      @ticket = Ticket.find(params[:id])
      @ticket.destroy

      respond_to do |format|
      format.html { redirect_to tickets_url }
      format.json { head :ok }
      end
      end


Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s