doctype html
html
  head
    title Ordine Effettuato

    //- import css/scss stylesheets
    //- these file names will be replace by gulp with proper css file paths
    link(rel="stylesheet", href="../sass/basic.scss")
    link(rel="stylesheet", href="../sass/one/styles.scss")

    //- embdedded css allowed, but not sass
    style.
        .red {
            background-color: #E84C50;
        }

        .full-width {
            width: 100%;
        }

  body(yahoofix, style="background: #ffffff")
    - var baseimg = baseurl + '/'
    span(id='body_style', style='display:block')
      table(cellpadding="10", cellspacing="0", width="600", align="center")
        tr
          td(class="whitespace", height="10")
            p &nbsp;
        if (orders.items && orders.items.length > 0)
          - var mystorehouse = orders.items[0].order.storehouse
        else
          - var mystorehouse = null

        tr
          td(class="emailContainer", valign="top")
            - var mioheader = mystorehouse.email_html_header
            if (mioheader)
              p!= mioheader

            - var mioname = name
            if (!mioname)
              - var mioname = user.username              
            
            p Ciao #{mioname},

            if (orders.items[0].order.quantitypreordered > 0)
              - var miomakeorder = mystorehouse.email_html_GAS_makeorder
            else
              - var miomakeorder = mystorehouse.email_html_makeorder

            if (miomakeorder)
              p!= miomakeorder
            else
              p Ti arriverà una email quando i prodotti saranno disponibili per poterli venire a ritirare.
              p Il pagamento, se non diversamente comunicato, potrai farlo direttamente in sede.


            tr
              td(class="whitespace", height="10")
                p &nbsp;

                - var totalPrice = orders.totalPrice
                - var note = orders.note
                - var index = 0

                each rec in orders.items
                  - var descr = rec.order.product.productInfo.name
                  - var img = rec.order.product.productInfo.imagefile
                  - var price = rec.order.price
                  - var after_price = rec.order.after_price
                  - var TotalPriceProduct = rec.order.TotalPriceProductstr
                  if (rec.order.gasordine)
                    - var gasordine = rec.order.gasordine.name
                  else
                    - var gasordine = ''
                  
                  - var qty = rec.order.quantity
                  - var qtypreordered = rec.order.quantitypreordered
                  if (rec.order.product.productInfo.sfuso && rec.order.product.productInfo.weight)
                    - qtypreordered = qtypreordered * rec.order.product.productInfo.weight
                  else if (rec.order.product.productInfo.weight)
                    - qtypreordered = qtypreordered + ' x ' + rec.order.product.productInfo.weight                  

                  - var unit = rec.order.product.productInfo.unitstr
                  - index = index + 1

                  table(cellpadding="0", cellspacing="0", width="100%", summary="", border="0", align="center")
                    tr
                      td(class="column", valign="center" width="40")
                        p.boldhigh #{index}.

                      td(class="column sectionArticleImage", valign="top" width="150")
                        table(cellpadding="0", cellspacing="0", summary="", border="0")
                          tr
                            td
                              img(src=baseimg + img, alt="", width="150")
                      td(class="column", valign="top")

                        table(cellpadding="0", cellspacing="0", summary="", border="0")
                          if (qtypreordered > 0)
                            tr
                              td(class="sectionContent", valign="top")
                                p Gas Ordine: #{gasordine}
                                p &nbsp;
                          tr
                            td(class="sectionContentTitle boldhigh", valign="top")
                              p #{descr}
                          tr
                            td(class="sectionContent", valign="top")
                              p Prezzo: #{price} € #{after_price}
                          if (qty > 0)
                            td(class="sectionContent", valign="top")
                              p Quantità: #{qty} #{unit}
                          if (qtypreordered > 0)
                            td(class="sectionContent", valign="top")
                              p Quantità Prenotata: #{qtypreordered} #{unit}
                          tr
                            td(class="sectionContent", valign="top")
                              p Totale: #{TotalPriceProduct} €

                if (note)
                  p Note Aggiuntive: #{note}<br>

                p.sectionContentTitle.boldhigh.sectionTotal Totale Ordine: #{totalPrice} €
        tr
          td(class="whitespace", height="10")

        tr
          td
            - var miofooter = mystorehouse.email_html_footer
            if (miofooter)
              p!= miofooter
            else
              p Grazie Mille

        table.footer(cellpadding="0", cellspacing="0", width="100%", summary="", border="0", align="center")
          tr
            td(class="whitespace", height="10")
              p &nbsp;
          tr
            td.firma
              p!= dataemail.firma

          tr
            td.disclaimer
              p!= dataemail.disclaimer_out

          tr
            td.bottom
              p!= dataemail.disc_bottom_out

          tr
            td(class="whitespace", height="10")
              p &nbsp;

style(type="text/css").
    html, body {
        padding: 0;
        margin: 0;
    }

    p {
        font-size: 1rem;
    }

    .divbtn {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .btn-lg {
        padding: 5px;
        margin: 5px;
        font-size: 26px;
        cursor: pointer;
        color: white;
        background: #027be3 !important;
        border-radius: 28px;

    }
