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

<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>

<div class="shadow-sm p-3 mb-2 bg-white rounded card card-body">
    <div class="row">
        <div class="col mb-1">
            <h4 class="text-info text-nowrap mb-0"><?=$Titulo?></h4>
        </div>
        <div class="col mb-1 text-right">
            <div class="btn-group dropleft">
                <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                <!--<button class="btn btn-secondary dropdown-toggle" type="button" id="" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">-->
                <!--<a class="btn btn-secondary dropdown-toggle" href="#" role="button" id="" data-toggle="dropdown" aria-haspopup="false" aria-expanded="true">-->
                    Menu
                </button>
                <div class="dropdown-menu">
                    <a class="dropdown-item" href="javascript:void(0);" onclick="location.href='<?=buildUrl( "item/addedit", "s_TipoProc=nvo" )?>';" title="Nuevo Item">Nuevo &nbsp;&nbsp; <i class="fa fa-file-alt" aria-hidden="true"></i></a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item" href="javascript:void(0)" onclick="location.href='<?=buildUrl( "item/listStkMin", "" )?>';" title="Stock Minimo">Stock Minimo &nbsp;&nbsp; <i class="fa fa-list-ol" aria-hidden="true"></i> </a>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
changeIcon = function( elm, name )
{
    var elms    = $( elm ).find( "svg" );
    var elm_sel = elms.first();

    if( $( "#" + name ).is( ":visible" ) )
    {
        $( elm_sel ).removeClass( "fa-angle-down" );
        $( elm_sel ).addClass( "fa-angle-right" );
    }
    else
    {
        $( elm_sel ).removeClass( "fa-angle-right" );
        $( elm_sel ).addClass( "fa-angle-down" );
    }
}
</script>
<div id="accordion" class="mb-2">
    <div class="card">
        <div class="card-header">
            <a data-toggle="collapse" href="#collapseThree" aria-expanded="true" aria-controls="collapse1" 
                class="text-info" onclick="changeIcon( this,'collapseThree' );" id="cotent_a_collapse" 
                >
                <h5 class="mb-0"> Filtro <i class="fas fa-angle-right pull-right"></i></h5>
            </a>
        </div>
        <div id="collapseThree" class="collapse show" data-parent="#accordion">
            <div class="card-body pb-1" style="background-color: antiquewhite;">
                <form class="" name="form1" id="form1" method="POST" action="">
                    <div class="form-row mx-0">
                        <div class="col-md-3 mb-1">
                            <label class="col-form-label" for="ClienteNom">Cliente</label>
                            <input type="text" class="form-control" name="ClienteNom" id="ClienteNom" placeholder="Nombre del Cliente">
                        </div>
                        <div class="col-md-3 mb-1">
                            <label class="col-form-label" for="Estado">Estado CPE</label>
                            <select class="form-control" name="Estado" id="Estado" style="background-color: khaki;">
                                <option value=""> - Seleccione - </option>
                                <?php foreach ( $a_Estados as $s_Key => $s_Values ){ ?>
                                <option value="<?=$s_Key?>" <?php if( $s_Key == "P" ){ echo "SELECTED"; } ?> > <?=$s_Values?> </option>
                                <?php } ?>
                            </select>
                        </div>
                        <div class="col-md-3 mb-1">
                            <label class="col-form-label" for="EstadoWeb">Estado Web</label>
                            <select class="form-control" name="EstadoWeb" id="EstadoWeb" style="background-color: khaki;">
                                <option value=""> - Seleccione - </option>
                                <?php foreach ( $a_EstadosWeb as $s_Key => $s_Values ){ ?>
                                <option value="<?=$s_Key?>" > <?=$s_Values?> </option> <!-- <?php if( $s_Key == "CE" ){ echo "SELECTED"; } ?>  -->
                                <?php } ?>
                            </select>
                        </div>
                        <div class="col-md-3 mb-1 ">
                            <div class="col-auto">
                                <label class="sr-only" for="FechaDocumento1">Fecha Desde</label>
                                <div class="input-group mb-2">
                                    <div class="input-group-prepend">
                                        <div class="input-group-text"><?=addImgButton( "calendar.png", array( "class"=>"", "height"=>24 ) )?></div>
                                    </div>
                                    <input type="text" class="form-control text-center" id="FechaDocumento1" name="FechaDocumento1" placeholder="Fecha Desde" value="<?//=date( "Y-m-d" )?>">
                                    <script type="text/javascript">
                                    $( "#FechaDocumento1" ).datepicker( { dateFormat: "yy-mm-dd", changeYear:true, yearRange: "-5:+0", changeMonth: true, onClose: function (){ this.focus(); } } );
                                    </script>
                                </div>
                            </div>
                            <div class="col-auto">
                                <label class="sr-only" for="FechaDocumento2">Fecha Hasta</label>
                                <div class="input-group mb-2">
                                    <div class="input-group-prepend">
                                        <div class="input-group-text"><?=addImgButton( "calendar.png", array( "class"=>"", "height"=>24 ) )?></div>
                                    </div>
                                    <input type="text" class="form-control text-center" id="FechaDocumento2" name="FechaDocumento2" placeholder="Fecha Hasta">
                                    <script type="text/javascript">
                                    $( "#FechaDocumento2" ).datepicker( { dateFormat: "yy-mm-dd", changeYear:true, yearRange: "-5:+0", changeMonth: true, onClose: function (){ this.focus(); } } );
                                    </script>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-row mx-0">
                        <div class="col-md-3 mb-1">
                            <label class="col-form-label" for="Tipo">Tipo de Documento</label>
                            <select class="form-control" name="Tipo" id="Tipo" style="background-color: khaki;">
                                <option value=""> - Seleccione - </option>
                                <?php foreach( $a_VTA_TipoDocumento  as $o_VTA_TipoDocumentoBN ){ ?>
                                    <option value="<?=$o_VTA_TipoDocumentoBN->getIdTipoDocumento()?>"> <?=$o_VTA_TipoDocumentoBN->getDescripcionLocal()?> </option>
                                <?php } ?>
                                <option value="OS"> ORDEN DE VENTA </option>
                            </select>
                        </div>
                        <div class="col-md-3 mb-1">
                            <label class="col-form-label" for="Numero">Nro Comprobante</label>
                            <div class="form-inline">
                                <select class="form-control w-25" name="Serie" id="Serie" style="background-color: khaki;">
                                    <option value=""> Serie </option>
                                    <?php foreach ( VTA_DocumentoFN::recuperarFiltroSerie() as $s_Key => $s_Values ){ ?>
                                        <option value="<?=$s_Key?>" > <?=$s_Values?> </option>
                                    <?php } ?>
                                </select>
                                <input type="text" class="form-control w-75" name="Numero" id="Numero" placeholder="No Comprobante">
                            </div>
                        </div>
                        <div class="col-md-3 mb-1">
                            <label class="col-form-label" for="AceptadaxSunat">Sunat</label>
                            <select class="form-control" name="AceptadaxSunat" id="AceptadaxSunat" style="background-color: khaki;">
                                <option value=""> - Seleccione - </option>
                                <option value="SI"> SI </option>
                                <option value="NO"> NO </option>
                            </select>
                        </div>
                        <div class="col-md-3 mb-1">
                            <label class="col-form-label" for="AnuAceptadaPorSunat">Sunat Anulados</label>
                            <select class="form-control" name="AnuAceptadaPorSunat" id="AnuAceptadaPorSunat" style="background-color: khaki;">
                                <option value=""> - Seleccione - </option>
                                <option value="SI"> SI </option>
                                <option value="NO"> NO </option>
                            </select>
                        </div>
                    </div>
                    <div class="text-center mt-2">
                        <button class="btn btn-primary text-center" type="button" onclick="findControl();">Buscar</button>
                        <button class="btn btn-primary text-center" type="button" onclick="massiveProcess();">Procesar</button>
                        <a data-toggle="collapse" href="#collapseThree" class="text-info" onclick="changeIcon( $( '#cotent_a_collapse' )[0], 'collapseThree' );" style="background: none;">
                            Contraer <i class="fas fa-angle-up"></i>
                        </a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

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

<?php include_partial( "grid" ); ?>

<script>
$( document ).bind
(
    'keyup', 
    function( e ) 
    {
        if( e.which === 13 ) //ENTER
        {
            findControl();
        }
        if( e.which === 107 || e.which === 27 ) //tecla +
        {
            $( "#cotent_a_collapse" ).trigger( "click" );
        }
    }
);
</script>
