<?php use_helper('UrlFunctions'); ?>
<?php use_helper( 'IncludePartial' ); ?>
<?php use_helper( 'UtilFunctions' ); ?>

<style>
.grid
{
    border: 1px solid #77d5f7;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}
.grid th 
{
    border-color: #77d5f7;
    background-color: #0a7db1;
    font-weight: normal;
    font-size: 11px;
    font-family: Verdana,Arial,sans-serif;
    height: 24px;
    padding: 0 2px;
}
.grid td 
{
    border-left: 0 none;
    border-right-color: #77d5f7;
    border-right-style: solid;
    border-right-width: 1px;
    border-bottom-color: #77d5f7;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    padding: 0 2px;
    /*white-space: pre;*/
    height: 22px;
    /*border: 1px solid #77d5f7;*/
}
.grid td div
{
    overflow: hidden; white-space: nowrap; width: 150px; font-size: 10px;
}
</style>

<style type="text/css">
.ui-dialog .ui-dialog-titlebar-close 
{
    position: absolute;
    right: .3em;
    top: 50%;
    width: 20px;
    margin: -10px 0 0 0;
    padding: 1px;
    height: 20px;
    background-position: -96px -128px;
    /*background-image: url("images/ui-icons_056b93_256x240.png");*/
    background-image: url("<?=Constantes::ROOT_DIR_APP?>web/css/jquery/themes/start_1.12.1/images/ui-icons_056b93_256x240.png");
}
</style>

<style type="text/css">
    #example_wrapper .row
    {
        margin-right: 0;
        margin-left: 0;
    }
    table.dataTable tbody tr:hover
    {
        background-color: #DAE6FE !important;;
    }
    .table td, .table th
    {
        padding: 8px;
        font-size: 13px;
        vertical-align: middle;
        white-space: nowrap;
    }
    th { white-space: nowrap; }
</style>

<script type="text/javascript">
showAlertBootStrap = function( elm_id_content, class_default, message_alert )
{
    var html_alert = '<div class="alert ' + class_default + ' alert-dismissible fade show" role="alert"> ' +
            '' + message_alert +
            '<button type="button" class="close" data-dismiss="alert" aria-label="Close">' +
                '<span aria-hidden="true">&times;</span>' +
            '</button>' +
        '</div>';
    $( "#" + elm_id_content ).append( html_alert );
}
</script>

<?php
include_partial
(
    "infohead",
    array
    (
        "o_VTA_DocumentoBN"     => $o_VTA_DocumentoBN,
        "o_GSS_MonedaMastBN"    => $o_GSS_MonedaMastBN,
        "o_MST_PersonaMastFN"   => $o_MST_PersonaMastFN,
        "block"                 => ""
    )
);
?>

<div id="content_alert" style=""></div>

<div class="card" class="mb-2" style="margin-top: 5px;">
    <?php if( $b_Edicion ){ ?>
    <div class="" style="text-align: right;">
        <button type="button" class="btn btn-primary btn-sm" aria-label="Right Align" onclick="agregarNuevoMetodoPago();">
            <!--<i class="fas fa-file"></i>-->
            Agregar Pago
        </button>
    </div>
    <?php } ?>

    <div class="table-responsive">
        <table class="grid" cellspacing="0" cellpadding="0" border="0" align="center" width="100%" style="border-bottom: medium none;">
            <thead>
                <tr>
                    <th width="2%" style="text-align: center;" nowrap> # </th>
                    <th width="20%" style="text-align: center;" nowrap>Medio Pago</th>
                    <th width="10%" style="text-align: center;" nowrap>Nro Doc</th>
                    <th width="10%" style="text-align: center;" nowrap>Fecha Doc</th>
                    <th width="10%" style="text-align: center;" nowrap>Monto</th>
                    <th width="10%" style="text-align: center;" nowrap>Aplicar</th>
                    <th width="10%" style="text-align: center;" nowrap>Estado</th>
                </tr>
            </thead>
            <tbody>
            <?php $f_TotalAcumulado = 0 ?>
            <?php foreach ( $a_FCO_DocRecibo as $key => $o_FCO_DocReciboBN ) { ?>
                <?php
                $f_TotalAcumulado = $f_TotalAcumulado + $o_FCO_DocReciboBN->getMonto();
                ?>
                <tr>
                    <td align="center"> <?=$key+1?> </td>
                    <td align="center"><?=$o_FCO_DocReciboBN->getObjectTipoPago()->getNombre()?></td>
                    <td align="center"><?=$o_FCO_DocReciboBN->getReciboNumero()?></td>
                    <td align="center"><?=substr( $o_FCO_DocReciboBN->getReciboFecha(), 0, 10 )?></td>
                    <td align="center"><?=number_format( $o_FCO_DocReciboBN->getMonto(), 2 )?></td>
                    <td align="center"><?=number_format( $o_FCO_DocReciboBN->getMontoAplicado(), 2 )?></td>
                    <td align="center"><?=$o_FCO_DocReciboBN->getFlujoEstadoDesc()?></td>
                </tr>
            <?php } ?>
                <tr>
                    <td colspan="5"> &nbsp; </td>
                    <th style="text-align: right;"> <b>TOTAL ACUMULADO: </b></th>
                    <th style="text-align: center;"><b> S/. <?=$f_TotalAcumulado?> </b> </th>
                </tr>
            </tbody>
            
            <!--
            <tbody>
                <tr>
                    <th align="center" style="border-bottom-left-radius: 5px; height: 24px; border-bottom-right-radius: 5px;" colspan="8"> &nbsp; </th>
                </tr>
            </tbody>
            -->
        </table>
    </div>
</div>
