css - wice_grid gem：添加动态颜色

Question

我有 wice_grid gem 制作的下表，我需要根据用户选择的状态为“当前状态”列创建一个动态 css，我已经在状态模型中具有颜色属性和背景属性。

 <div class="tab-content">
          <div class="tab-pane active" id="tab1">
            <p><%= grid(@tickets_grid, show_filters: :when_filtered) do |g|
              g.column name:  'Ticket title', attribute: 'title', :auto_reload => true
              g.column name:  'Publish Date' do |ticket|
                time_ago_in_words(ticket.created_at)
              end
              g.column name:  'Sender', attribute: 'user_name', model: 'User', auto_reload: true do |ticket|
                ticket.user.user_name if ticket.user
              end
              g.column name:  'Sender role', attribute: 'type_of_user', model: 'UserType', auto_reload: true do |ticket|
                ticket.user.user_type.type_of_user if ticket.user
              end
              g.column name:  'Assigned Department', attribute: 'name', model: 'EmployeeDepartment', auto_reload: true do |ticket|
                ticket.employee_department.name if ticket.employee_department
              end

              g.column name: 'Current State', attribute: 'name', model: 'State', auto_reload: true do |ticket|
                if ticket.state
                  ticket.state.name
                else
                  Not defined yet
                end
              end
              g.column do |ticket|
                link_to('Read this thread', ticket_path(ticket))
              end
              end -%></p>
            </div>

Answer 1

通过以下方式解决：

g.column name: 'Current State', attribute: 'name', model: 'State', auto_reload: true do |ticket|
                if ticket.state
                  if ticket.state.name == 'Emergency'
                    [ticket.state.name, {style: 'background-color:  rgb(255, 0, 0)'}]

                  elsif ticket.state.name == 'High'
                    [ticket.state.name, {style: 'background-color:  rgb(255, 165, 0)'}]

                  elsif ticket.state.name == 'Normal'
                    [ticket.state.name, {style: 'background-color:  rgb(255, 255, 0)'}]

                  end
                else
                 'Not defined yet'
               end
         end