Rails,是否可以根据包含余额的表的列值来更改颜色?

时间:2015-11-01 10:00:11

标签: ruby-on-rails

index.html.erb

    <% balance = 0 %>

    <table align="center" width="50%" cellpadding="1" cellspacing="5">  
        <tr>
            <td>Amount</td>
            <td>Discount</td>
            <td>Paid</td>
            <td>Balance</td>
        </tr>   

<% @statements.each do |statement| %>

  <tr class="tr-<%= cycle('odd', 'even') %>">

    <td class="col-1"><%= statement.date %></td>
    <td class="col-3"><%= statement.description %></td>

    <td class="col-1"><%= number_with_precision(statement.amount, :delimiter => ",", :precision => 2) %></td>

    <td class="col-1 neg"><%= number_with_precision(statement.discount, :delimiter => ",", :precision => 2) %></td>

    <td class="col-1 neg"><%= number_with_precision(statement.paid, :delimiter => ",", :precision => 2) %></td>


<% balance += statement.amount.to_f - statement.discount.to_f - statement.paid.to_f %>

        <% color = balance >= 0 ? "pos" : "neg" %>

        <td class="col-1 <%= color %>"><%= number_with_precision(balance.abs, :delimiter => ",", :precision => 2) %></td>

</tr>

    <% end %>

  </table>

<center><p><b><%= number_to_currency(balance.abs, :unit => 'AED ', :delimiter => ",", :precision => 2) %></b></p></center>

我想改变平衡实体的颜色,当平衡为正时它必须显示黑色,当消极时它必须显示为红色。

这是我的application.css.scss

.pos { color: #000; }
.neg { color: #f00; }

我没有按预期得到结果。

请查看以下结果;

Sample data

picture

2 个答案:

答案 0 :(得分:0)

当然,just use CSS

#app/assets/stylesheets/application.css
tr.pos { color: #000; }
tr.neg { color: #f00; }

#app/views/controller/index.html.erb
<% color = balance >= 0 ? "pos" : "neg" %>

<td class="col-1 <%= color %>"><%= number_with_precision(statement.discount, :delimiter => ",", :precision => 2) %></td>  
<td class="col-1 <%= color %>"><%= number_with_precision(statement.paid, :delimiter => ",", :precision => 2) %></td>
<td class="col-1 <%= color %>"><%= number_with_precision(balance += statement.amount.to_f - statement.discount.to_f - statement.paid.to_f, :delimiter => ",", :precision => 2) %></td>

答案 1 :(得分:0)

Rick是对的,但是有一个小故障。

正如我在上面的评论中提到的,在计算新值之前,余额的值用于分配类.neg or .pos。这是因为它取了之前的balance值来为它提供类,如附带的样本所示。

以下是在使用它来使其正常工作之前计算新值的方法:

<% balance = 0 %>

<table align="center" width="50%" cellpadding="1" cellspacing="5">  
    <tr>
        <td>Amount</td>
        <td>Discount</td>
        <td>Paid</td>
        <td>Balance</td>
    </tr>

    <% @statements.each do |statement| %>

    <tr>

        <td><%= statement.amount %></td>

        <td class="neg"><%= statement.discount %></td>  
        <td class="neg"><%= statement.paid %></td>

       <% balance += statement.amount.to_f - statement.discount.to_f - statement.paid.to_f %>

        <% color = balance >= 0 ? "pos" : "neg" %>

        <td class="<%= color %>"><%= balance  %></td>

    </tr>

    <% end %>

</table>

请注意,在任何操作中使用它之前,我们首先计算了balance的新值。这样,在分配类时,balance保存当前循环的实际值和正确值。

试试这个,让我们知道你对视图的看法......