<?php include_once('../../../config.php') ?>

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Sisplan Web | Controle de Embarque</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="../dist/css/adminlte.min.css?versao=3.264.14.1">
  <link rel="stylesheet" href="../plugins/fontawesome-free/css/all.min.css?versao=3.264.14.1">
  <link href='https://fonts.googleapis.com/css?family=Roboto:400,300,500,600,700,400italic' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" type="text/css" href="../dist/css/dataTables.bootstrap4.min.css?versao=3.264.14.1" />
  <link href='dist/css/bootstrap.min.css?versao=3.264.14.1'>
  <link rel="stylesheet" href="../dist/css/custom.css?versao=3.264.14.1">
  <link rel="stylesheet" href="../dist/css/sisplan.css?versao=3.264.14.1">
  <link rel="stylesheet" href="../dist/css/sisplan.newColorsButtons.css?versao=3.264.14.1">
  <link rel="stylesheet" href="dist/css/sisplan.adjustDataTableButtons.css?versao=3.264.14.1">
  <link rel="stylesheet" type="text/css" href="../plugins/datatables-keytable/css/keyTable.bootstrap4.min.css?versao=3.264.14.1">
  <link rel="stylesheet" type="text/css" href="../dist/css/responsive.bootstrap.min.css?versao=3.264.14.1">
  <link rel="shortcut icon" href="../favicon.ico">
  <link rel="stylesheet" href="../plugins/toastr/toastr.min.css?versao=3.264.14.1">
  <link rel="stylesheet" type="text/css" href="../dist/css/driver.min.css?versao=3.264.14.1" />
  <link rel="stylesheet" href="../dist/css/jquery-ui.css?versao=3.264.14.1">
  <link rel="stylesheet" href="../dist/css/cadastro.css?versao=3.264.14.1">
  <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
  <link rel="stylesheet" type="text/css" href="dist/css/dataTables.bootstrap4.min.css?versao=3.264.14.1" />

  <style>
    .card-totais {
      margin-top: 2%;
    }
    #rodape {
      margin-left: 0;
      padding-top: 0;
    }
    #txtDados {
      padding-top: .7%;
      padding-left: .85%;
    }
    .input-group-append>a>i {
      margin-left: 0 !important;
      padding-left: 5px;
      padding-right: 5px;
    }
    .grupo_botao>button>i {
      margin-left: 0 !important;
      padding-left: 5px;
      padding-right: 5px;
    }
    .bg-light {
      background-color: #f8f9fa08 !important;
    }
    .focus:read-only:focus {
      border-color: #aa1212 !important;
    }
    .labelCheck {
      font-size: 110%;
      padding: 0.2%;
      margin-left: 1%;
    }
    .configCheck {
      -ms-transform: scale(1.5);
      -moz-transform: scale(1.5);
      -webkit-transform: scale(1.5);
      -o-transform: scale(1.5);
      transform: scale(1.5);
      padding: 10px;
    }
    .checkboxMoeda {
      border: solid #e0e4e6;
      border-radius: 4px;
      border-width: 2px;
      padding: .8%;
    }
    .bordaTab {
      border: solid #e0e4e6;
      border-radius: 4px;
      border-width: 2px;
      margin-top: 9.6%;
    }
    .bordaRadio {
      border: 2px solid #e0e4e6;
      border-radius: 4px;
      height: 38px;
      padding-right: 50%;
    }
    #checkPrecoManual {
      margin-left: 10px;
    }
    .table.dataTable tbody td {
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
    }
    .table-responsive {
      overflow-x: auto;
    }
    .card {
      border: none !important;
    }
    .div-infos {
      background-color: #262626;
      color: white;
      padding: 5px 10px 5px 10px;
      border-radius: 10px;
      max-width: 450px;
      width: 100%;
      display: flex;
      align-items: center;
      border: 1px solid black;
      transition: background-color 0.15s ease-in-out;
      transition: transform 0.15s ease-in-out;
    }
    .div-infos:hover {
      background-color: #515151;
    }
    .div-infos.clicado {
      background-color: #515151;
      transform: translateY(-5px);
      border-color: #be0000;
    }
    .icon-container {
      flex: 0 0 auto;
      margin-right: 10px;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 50px;
    }
    .value-container {
      flex: 1;
    }
    .value-container>label {
      margin-bottom: 0px
    }
    .value-container>input {
      color: white !important;
      border: none;
      font-size: 15pt;
      padding: 0 !important;
    }
    th {
      white-space: nowrap;
    }
    .dataTables_scrollBody {
      overflow: visible !important;
    }
    .dropdown-menu {
      z-index: 1000;
      top: -30px !important;
      left: 20px;
      transform: translate3d(-20px, 25px, 0px) !important;
      position: relative
    }
    .table-responsive {
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }
    #tabelaEmbarque {
      width: 100% !important;
    }
    .dataTables_scrollHeadInner {
      width: 100% !important;
    }
    .dataTables_scrollBody thead th {
      visibility: hidden;
    }
    .dataTables_scrollHead {
      overflow: visible !important;
    }  </style>

</head>

<body class="sidebar-mini layout-fixed">
  <div class="wrapper">


    <div class="content-wrapper">
      <div class="content-header">
        <div class="col-12 text-left p-0 mt-3 mb-2">
          <div class="card px-0 pt-4 pb-0 mt-3 mb-3">
            <div class="flex ajustPadding">
              <h2 class="col-12">
                <strong class="ml-3">Controle de Embarque</strong>
                <button type="button" class="btnTutorial" style="margin-top: -10px!important;" id="tutorial">
                  <i class="fas fa-question-circle"></i>
                </button>
              </h2>
            </div>

            <fieldset style="margin-top:-20px;">
              <div class="card-body" style="padding-left: 0rem!important; padding-right: 0rem!important; padding-bottom: 0">
                <form id="msform" class="mt-0">
                  <div class="form-card" id="tourGeral">
                    <div>
                      <div class="card-body pt-2 ml-1 mr-1">
                        <div class="row justify-contend-between">

                          <div class="col-lg-4 col-12 form-group">
                            <label data-error="wrong" data-success="right" for="txtNumero">Número *</label>
                            <div class="input-group">
                              <input type="text" class="input-default focus form-control" id="txtNumero" name="txtNumero" placeholder="Número">
                            </div>
                          </div>

                          <div class="col-lg-2 col-12 radioGroup">
                            <label data-error="wrong" data-success="right">Situação</label>
                            <div class="form-check">
                              <input class="form-check-input" value="0" type="radio" name="radio" id="radioPendentes" checked>
                              <label class="form-check-label" for="radio">
                                Pendente
                              </label>
                            </div>
                            <div class="form-check">
                              <input class="form-check-input" value="1" type="radio" name="radio" id="radioFechado">
                              <label class="form-check-label" for="radio">
                                Fechado
                              </label>
                            </div>
                          </div>

                          <div class="col-lg-2 col-12 form-group ml-auto p-2">
                            <label data-error="wrong" data-success="right" for="dtCadastro">Data cadastro:</label>
                            <div class="input-group">
                              <input type="date" readonly disabled class="input-default focus form-control" id="dtCadastro" name="dtCadastro">
                            </div>
                          </div>

                          <div class="col-lg-5 mb-1 col-12 form-group" style="margin-top:-7px;">
                            <label data-error="wrong" data-success="right" for="txtNota">Nota</label>
                            <div class="input-group">
                              <input type="text" class="input-default focus form-control" id="txtNota" name="txtNota" class="form-control" placeholder="Nota">
                              <div class="input-group-append">
                                <button class="btn bg-danger" id="btn-Nota" name="btn-Nota" data-button="absolute" type="button"><i class="m-0 p-0 fas fa-search"></i></button>
                                <button class="btn bg-danger" id="btn-limpa-Nota" type="button"><i class="m-0 p-0 fas fa-trash"></i></button>
                              </div>
                            </div>
                          </div>
                          <div class="container-fluid mt-2" id="divTabelaEmbarque">
                            <div class="row">
                              <div class="col-sm-12 table-responsive table-sm  campo table-select -0 pb-1 pt-0">
                                <table id="tabelaEmbarque" class="table table-sm-sisp table-hover" width="100%">
                                  <thead>
                                    <!-- <tr>
                                      <th class="th-xl">Fatura</th>
                                      <th class="th-xl">Série</th>
                                      <th class="th-xl">Codcli</th>
                                      <th class="th-xl">Nome</th>
                                      <th class="th-xl">Cod. Transp.</th>
                                      <th class="th-xl">Nome Transp.</th>
                                      <th class="th-xl">Conferido</th>
                                      <th class="th-xl">Qtde Caixas</th>
                                      <th class="th-xl">Peso Bruto</th>
                                      <th class="th-xl">Valor</th>
                                      <th class="th-xl">Volumes</th>
                                      <th class="th-xl">Endereço</th>
                                      <th class="th-xl">Estado</th>
                                      <th class="th-xl">Cidade</th>
                                      <th class="th-xl">Bairro</th>
                                      <th class="th-xl">Inscrição</th>
                                      <th class="th-xl">UF</th>
                                      <th class="th-xl">CNPJ</th>
                                      <th class="th-xl">Telefone</th>
                                    </tr> -->
                                  </thead>
                                  <tbody>
                                  </tbody>
                                </table>
                              </div>
                            </div>
                          </div>
                          <div class="container-fluid mt-2">
                            <div id="divTabelaConferencia" class="row card mb-1 d-none">
                              <div class="col-sm-12 mt-1 justify-content-between">
                                <div class="col-lg-3 col-3 form-group mb-0">
                                  <label data-error="wrong" data-success="right" class="ml-1" style="margin-top:-1rem;" for="txtNumCaixa">Conferência</label>
                                  <div class="input-group">
                                    <input type="text" class="input-default focus form-control ml-1" id="txtNumCaixa" name="txtNumCaixa" class="form-control" placeholder="Num. Caixa">
                                  </div>
                                </div>
                                <div class="col-sm-12 pt-0 pb-0 table-responsive" id="divTabelaConferencia">
                                  <table id="tabelaConferencia" class="table table-sm-sisp table-select table-hover" width="100%">
                                    <thead>
                                      <tr>
                                        <td class="th-xl">Nota Fiscal</td>
                                        <td class="th-xl">Caixa</td>
                                        <td class="th-xl">Qtde</td>
                                        <td class="th-xl">Conferido</td>
                                      </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                  </table>
                                </div>
                              </div>
                            </div>
                            <div class="col-sm-12 d-flex justify-content-between mb-3 divs-info" id="divInfos">

                              <div class="ml-2 div-infos" id="divNotas">
                                <div class="icon-container">
                                  <i class="fas fa-file-invoice" style="font-size: 3em;"></i>
                                </div>
                                <div class="value-container">
                                  <label data-error="wrong" class="labelGeral" data-success="right" for="txtTotalNotas">Notas</label>
                                  <input style="max-width: 130px;" readonly type="text" class="input-default focus form-control validate" value='0' id="txtTotalNotas" name="txtTotalNotas">
                                </div>
                              </div>

                              <div class="ml-2 div-infos" id="divVolumes">
                                <div class="icon-container">
                                  <i class="fas fa-boxes" style="font-size: 3em;"></i>
                                </div>
                                <div class="value-container">
                                  <label data-error="wrong" class="labelGeral" data-success="right" for="txtTotalVolumes">Volumes</label>
                                  <input style="max-width: 130px;" readonly type="text" class="input-default focus form-control validate" value='0' id="txtTotalVolumes" name="txtTotalVolumes">
                                </div>
                              </div>

                              <div class="ml-2 div-infos" id="divPesoBruto">
                                <div class="icon-container">
                                  <i class="fas fa-weight" style="font-size: 3em;"></i>
                                </div>
                                <div class="value-container">
                                  <label data-error="wrong" class="labelGeral" data-success="right" for="txtPesoBruto">Peso Bruto</label>
                                  <input style="max-width: 130px;" readonly type="text" class="input-default focus form-control validate" value='0' id="txtPesoBruto" name="txtPesoBruto">
                                </div>
                              </div>

                              <div class="ml-2 div-infos" id="divValor">
                                <div class="icon-container">
                                  <i class="fas fa-dollar-sign" style="font-size: 3em;"></i>
                                </div>
                                <div class="value-container">
                                  <label data-error="wrong" class="labelGeral" data-success="right" for="txtValorTotal">Valor</label>
                                  <input style="max-width: 130px;" readonly type="text" class="input-default focus form-control validate" value='0' id="txtValorTotal" name="txtValorTotal">
                                </div>
                              </div>

                              <div class="ml-2 div-infos d-none" id="divCaixas">
                                <div class="icon-container">
                                  <i class="fas fa-box" style="font-size: 3em;"></i>
                                </div>
                                <div class="value-container">
                                  <label data-error="wrong" class="labelGeral" data-success="right" for="txtCaixa">Caixas</label>
                                  <input style="max-width: 130px;" readonly type="text" class="input-default focus form-control validate" value='0' id="txtCaixa" name="txtCaixa">
                                </div>
                              </div>

                              <div class="ml-2 div-infos d-none" id="divCxConf">
                                <div class="icon-container">
                                  <i class="fas fa-archive" style="font-size: 3em;"></i>
                                </div>
                                <div class="value-container">
                                  <label data-error="wrong" class="labelGeral" data-success="right" for="txtCxConf">Cx. Conf.</label>
                                  <input style="max-width: 130px;" readonly type="text" class="input-default focus form-control validate" value='0' id="txtCxConf" name="txtCxConf">
                                </div>
                              </div>

                              <div class="ml-2 div-infos d-none" id="divSaldo">
                                <div class="icon-container">
                                  <i class="fas fa-receipt" style="font-size: 3em;"></i>
                                </div>
                                <div class="value-container">
                                  <label data-error="wrong" class="labelGeral" data-success="right" for="txtSaldo">Saldo</label>
                                  <input style="max-width: 130px;" readonly type="text" class="input-default focus form-control validate" value='0' id="txtSaldo" name="txtSaldo">
                                </div>
                              </div>

                            </div>
                          </div>
                        </div>
                      </div>
                      <div class="d-flex justify-content-end flex-wrap gap-2 mt-1 mb-2" style="margin-right:2rem!important">
                        <button type="button" name="gravar" id="btnGravaEmbarque" class="btn btn-sisp btnVerde marginBtnH"><i class="fas fa-save"></i> Gravar</button>
                        <button type="button" name="remover" id="btnRemoveNota" class="btn btn-sisp btn-danger marginBtnH d-none"><i class="fas fa-trash"></i> Remover Nota</button>
                        <button type="button" id="voltarAcesso" class="btn btn-sisp btn-secondary marginBtnH"><i class="fas fa-arrow-left"></i> Voltar</button>
                      </div>
                    </div>
                  </div>
                </form>
              </div>

            </fieldset>
          </div>
        </div>
      </div>
    </div>


    <?php
    include_once('../../../modais.php');
    ?>

    <aside class="control-sidebar control-sidebar-dark">
    </aside>
  </div>

  <?php
  include_once('../../../modais.php');
  ?>

  <aside class="control-sidebar control-sidebar-dark">
  </aside>
  </div>

  <script src="../plugins/jquery/jquery.min.js?versao=3.264.14.1"></script>
  <script src="../plugins/jquery-ui/jquery-ui.min.js?versao=3.264.14.1"></script>
  <script type="text/javascript" src="../dist/js/jquery.dataTables.js?versao=3.264.14.1"></script>
  <script type="text/javascript" src="../dist/js/dataTables.bootstrap4.min.js?versao=3.264.14.1"></script>
  <script src="../plugins/sweetalert2/sweetalert2.min.js?versao=3.264.14.1"></script>
  <script src="../plugins/toastr/toastr.min.js?versao=3.264.14.1"></script>

  <script>
    $.widget.bridge('uibutton', $.ui.button);
  </script>

  <script src="../plugins/bootstrap/js/bootstrap.bundle.min.js?versao=3.264.14.1"></script>

  <script src="../dist/js/adminlte.min.js?versao=3.264.14.1"></script>

  <script src="../dist/js/requisicoes.js?versao=3.264.14.1"></script>
  <script src="../dist/js/cliente/entidade.js?versao=3.264.14.1"></script>
  <script src="../dist/js/loadingoverlay.min.js?versao=3.264.14.1"></script>
  <script src="../dist/js/valida_cpf_cnpj.js?versao=3.264.14.1"></script>
  <script src="../plugins/moment/moment.min.js?versao=3.264.14.1"></script>
  <script src="../plugins/jquery-validation/jquery.validate.min.js?versao=3.264.14.1"></script>
  <script src="../dist/js/sisplan.js?versao=3.264.14.1"></script>
  <script src="../dist/js/popper.min.js?versao=3.264.14.1"></script>
  <script src="../dist/js/tippy-bundle.umd.js?versao=3.264.14.1"></script>
  <script src="../utils/funcoes.js?versao=3.264.14.1"></script>
  <script src="../dist/js/jquery.maskMoney.min.js?versao=3.264.14.1"></script>
  <script src="../utils/cookies.js?versao=3.264.14.1"></script>
  <script src="../dist/js/driver.min.js?versao=3.264.14.1"></script>
  <script src="../dist/js/dataTables.keyTable2.js?versao=3.264.14.1"></script>
  <script type="text/javascript" src="../config.js?versao=3.264.14.1"></script>
  <script type="text/javascript" src="../dist/js/sum().js?versao=3.264.14.1"></script>
  <script type="text/javascript">
    $(document).ready(async function() {

      if (getCookie('usuario') == "") {
        window.location.href = `${BASE_URI}/login`;
        return;
      }
      let usuario = getCookie('usuario');
      let empresa = getCookie('empresa');

      ipInterno = IP_INTERNO;
      ipExterno = IP_EXTERNO;
      basicAuth = BASIC_AUTH;

      const temAcesso = await temAcessoTela('EMBARQUE');
      if (!temAcesso.resultado) {
        toastrAcesso(temAcesso, BASE_URI);
        return;
      }
      sArquivo = `${BASE_URI}/pages/embarque/embarque/embarque.js?versao=3.264.14.1`;
      insereJavaScriptPagina(sArquivo);

    });
  </script>
</body>

</html>