EasyRecon/Hunt3r

View on GitHub
backend/app/views/admin/invoices/template/template.html.erb

Summary

Maintainability
Test Coverage
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
</head>
<body>
<style>
    .clearfix:after {
        content: "";
        display: table;
        clear: both;
    }

    a {
        color: #5D6975;
        text-decoration: underline;
    }

    body {
        position: relative;
        width: 21cm;
        height: 29.7cm;
        margin: 0 auto;
        color: #001028;
        background: #FFFFFF;
        font-family: Arial, sans-serif;
        font-size: 12px;
        font-family: Arial;
    }

    header {
        padding: 10px 0;
        margin-bottom: 30px;
    }

    #logo {
        text-align: center;
        margin-bottom: 10px;
    }

    #logo img {
        width: 90px;
    }

    h1 {
        border-top: 1px solid  #5D6975;
        border-bottom: 1px solid  #5D6975;
        color: #5D6975;
        font-size: 2.4em;
        line-height: 1.4em;
        font-weight: normal;
        text-align: center;
        margin: 0 0 20px 0;
        background: url(dimension.png);
    }

    #project {
        float: left;
    }

    #project span {
        color: #5D6975;
        text-align: right;
        width: 52px;
        margin-right: 10px;
        display: inline-block;
        font-size: 0.8em;
    }

    #company {
        float: right;
        text-align: right;
    }

    #project div,
    #company div {
        white-space: nowrap;
    }

    table {
        width: 100%;
        border-collapse: collapse;
        border-spacing: 0;
        margin-bottom: 20px;
    }

    table tr:nth-child(2n-1) td {
        background: #F5F5F5;
    }

    table th,
    table td {
        text-align: center;
    }

    table th {
        padding: 5px 20px;
        color: #5D6975;
        border-bottom: 1px solid #C1CED9;
        white-space: nowrap;
        font-weight: normal;
    }

    table .service,
    table .desc {
        text-align: left;
    }

    table td {
        padding: 20px;
        text-align: right;
    }

    table td.service,
    table td.desc {
        vertical-align: top;
    }

    table td.unit,
    table td.qty,
    table td.total {
        font-size: 1.2em;
    }

    table td.grand {
        border-top: 1px solid #5D6975;;
    }

    #notices .notice {
        color: #5D6975;
        font-size: 1.2em;
    }

    footer {
        color: #5D6975;
        width: 100%;
        height: 30px;
        position: absolute;
        bottom: 0;
        border-top: 1px solid #C1CED9;
        padding: 8px 0;
        text-align: center;
    }
</style>
<header class="clearfix">
  <div id="logo">
    <h2><%= @invoice_data.user_name %> <%= @invoice_data.user_lastname %></h2>
  </div>
  <h1>INVOICE <%= @invoice_id %></h1>
  <div id="company" class="clearfix">
    <div><%= @invoice_data.user_name %> <%= @invoice_data.user_lastname %></div>
    <div><%= @invoice_data.user_address %></div>
    <div><%= @invoice_data.user_phone %></div>
    <div><%= @invoice_data.user_email %></div>
    <div><span>SIRET :</span> <%= @invoice_data.user_siret %></div>
    <div><span>VAT :</span> <%= @invoice_data.user_vat_number %></div>
  </div>
  <div id="project">
    <div><span>PROJECT</span> <%= @invoice_data.client_project %></div>
    <div><span>CLIENT</span> <%= @invoice_data.client_name %></div>
    <div><span>BTW</span> <%= @invoice_data.client_btw %></div>
    <div><span>ADDRESS</span><%= @invoice_data.client_address %></div>
    <div><span>EMAIL</span> <%= @invoice_data.client_email %></div>
    <div><span>DATE</span> <%= @invoice_date %></div>
  </div>
</header>
<main>
  <table>
    <thead>
    <tr>
      <th class="service">DATE</th>
      <th class="desc">DESCRIPTION</th>
      <th>PRICE EXCL.</th>
      <th>QTY</th>
      <th>TOTAL EXCL.</th>
    </tr>
    </thead>
    <tbody>
    <% max_amount = 0 %>
    <% @payouts.each do |id, value| %>
      <% max_amount = (max_amount + value[:amount]).round(2) %>
      <tr>
        <td style="width: 20%;" class="service"><%= value[:date] %></td>
        <td style="width: 50%;" class="desc"><%= id %> : <%= value[:title] %></td>
        <td style="width: 10%;" class="unit"><%= value[:amount] %>€</td>
        <td style="width: 10%;" class="qty">1</td>
        <td style="width: 10%;" class="total"><%= value[:amount] %>€</td>
      </tr>
    <% end %>

    <tr>
      <td colspan="4">SUBTOTAL EXCL.</td>
      <td class="total"><%= max_amount %>€</td>
    </tr>
    <tr>
      <% if @invoice_data.user_vat %>
        <% vat_amount = (max_amount * 0.2).round(2) %>
        <td colspan="4">VAT 20%</td>
        <td class="total"><%= vat_amount %>€</td>
      <% else %>
        <% vat_amount = 0 %>
        <td colspan="4">VAT 0%</td>
        <td class="total"><%= vat_amount %>€</td>
      <% end %>
    </tr>
    <tr>
      <td colspan="4" class="grand total">TOTAL</td>
      <td class="grand total"><%= max_amount + vat_amount %>€<br /></td>
    </tr>
    </tbody>
  </table>

  <div id="notices">
    <div>NOTICE:</div>
    <div class="notice">This invoice is subject to the EU-reverse charge tax mechanism</div>
  </div><br /><br /><br />

  <table>
    <thead>
    <tr>
      <th class="service"></th>
      <th class="desc">BANK</th>
      <th>IBAN</th>
      <th>BIC</th>
    </tr>
    </thead>
    <tbody>
    <tr>
      <td class="service"></td>
      <td class="desc"><%= @invoice_data.user_bank %></td>
      <td class="unit"><%= @invoice_data.user_iban %></td>
      <td class="qty"><%= @invoice_data.user_bic %></td>
    </tr>
    </tbody>
  </table>
</main>
</body>
</html>