<div class="row">
  <div class="page-wrapper chiller-theme toggled">
    <nav id="sidebar" class="sidebar-wrapper">
      <menu-admin name={{name}} dock={{dock}}></menu-admin>
      <link-exit></link-exit>
    </nav>

    <main class="page-content">
      <div class="container justify-content-md-center">

        <h2>Pedido {{order.orderId}}</h2>

        <p ng-show="mensagem.length" class="alert alert-info">{{mensagem}}</p>

        <div class="row form-login" ng-init="inicio()">

          <div class="col-md-6">
            <div class="card border-dark mb-3" style="width: 25rem;">
              <div class="card-header text-white bg-dark"><i class="fas fa-user"></i> {{order.clientFirstName}} {{order.clientLastName}}</div>
              <div class="card-body text-dark">
                <p class="card-text">CPF: {{(order.clientCpf).slice(0,3)+"."+(order.clientCpf).slice(3,6)+"."+(order.clientCpf).slice(6,9)+"-"+(order.clientCpf).slice(9,11)}}</p>
                <!--<p class="card-text">Telefone: {{((order.phone).slice(0,3)+"("+(order.phone).slice(3,5)+")"+(order.phone).slice(5,14)).replace("+55", "")}}</p>-->
                <p class="card-text">Telefone: {{(order.phone).replace("+55", "")}}</p>
              </div>
            </div>
          </div>

          <div class="col-md-5">
            <div class="card border-dark mb-3" style="width: 18rem;">
              <div class="card-header text-white bg-dark"><i class="fa fa-shopping-cart"></i> Pedido: {{order.orderId}}</div>
              <div class="card-body text-dark">
                <p class="card-text">Vtex Sequence: {{order.sequence}}</p>
                <p class="card-text status">Status: {{order.statusDescription}}</p>
                <a href="#/orders/{{order.orderId}}/invoice" id="fp" class="btn btn-primary">Faturar Pedido</a>
              </div>
            </div>
          </div>
        </div>

        <div class="row">
          <div class="col-md-6">
            <div class="card border-dark mb-3" style="width: 25rem;">
              <div class="card-header text-white bg-dark"><i class="fas fa-truck"></i> Entrega</div>
              <div class="card-body text-dark">
                <p class="card-text">{{order.adressReceiverName}}</p>
                <p class="card-text">{{order.street}}, {{order.numberAdress}} - {{order.neighborhood}} - {{order.complementAdress}}</p>
                <p class="card-text">{{order.city}}, {{order.state}} - CEP {{order.postalCode}}</p>
              </div>
            </div>
          </div>

          <div class="col-md-5">
            <div class="card border-dark mb-3 value" style="width: 18rem;">
              <div class="card-header text-white bg-dark hd"><i class="fas fa-dollar-sign"></i> Valores</div>
              <div class="card-body text-dark">
                <p class="card-text">Itens: {{(order.totalValue / 100).toFixed(2).replace(".", ",")}}</p>
                <p class="card-text">Desconto: {{(order.descountValue / 100).toFixed(2).replace(".", ",")}} </p>
                <p class="card-text">Frete: {{(order.shippingValue / 100).toFixed(2).replace(".", ",")}}</p>

              </div>
              <div class="card-footer text-white bg-dark ft">Total: {{(order.value / 100).toFixed(2).replace(".", ",")}}</div>
            </div>
          </div>
        </div>

        <div class="row">

          <div class="col">
            <table class="table">
              <thead>
                <tr>
                  <th scope="col">Bhan</th>
                  <th scope="col">Produto</th>
                  <th scope="col">Qtd</th>
                  <th scope="col">R$</th>
                  <th scope="col">EAN</th>
                  <th scope="col"></th>
                  <th scope="col">Link</th>
                  <th scope="col">Estoque</th>
                </tr>
              </thead>
              <tbody ng-repeat="i in item">
                <tr>
                  <th scope="row">{{i.refId}}</th>
                  <td>{{i.productName}}</td>
                  <td class="text-center">{{i.quantity}}</td>
                  <td class="text-center"><strong>{{ ((i.price - (-i.discountPrice)) / 100).toFixed(2).replace(".", ",") }}</strong></td>
                  <td>{{i.ean}}</td>
                  <td><img ng-src="{{i.imageUrl}}" alt="{{i.productName}}"></td>
                  <td><a href="https://www.sejaconvicto.com.br{{i.detailUrl}}" class="btn btn-primary">Ver no Site</a></td>
                  <td class="text-center"><span ng-class="{'stock-success':i.statusStock > 0, 'stock-danger':i.statusStock < 0 || i.statusStock == 0 || i.statusStock == null}">{{i.statusStock}}</span></td>
                </tr>
              </tbody>

            </table>

          </div>

        </div>

      </div>
    </main>

  </div>

</div>
