<html>

<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
    <table style="width:100%">
            <tbody>
                   <tr>
                       <td rowspan="4">
                           <p> <img src="{#asset logo_utm_nuevo.png @encoding=dataURI}" style="width: 110px; position: relative; left:0px;"></p>
                       </td>
                       <th><center>UNIVERSIDAD TECNICA DE MANABI</center></th>
                   <td rowspan="0">
                       <img src='https://api.qrserver.com/v1/create-qr-code/?size=120x120&data={{codigo_rol}}'/>
                       {{!--<img src='https://chart.googleapis.com/chart?chl={{codigo_rol}}&chs=120x120&cht=qr&chld=H%7C0'/>--}}
                       </td>
                   </tr>
                   <tr style="max-width:800px"><th> <center><font size=3>Dirección de Administración de Talento Humano</font></center></th></tr>
                   <tr style="max-width:800px"><td><center><font size=3>SIGA - ROL DE PAGOS</font></center></td></tr>
                   <tr><td><center>{{regimen}}</center></td></tr>
                   
            </tbody>
        </table>
    <style>
        {#asset style_vertical.css @encoding=utf8}
    </style>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/jsbarcode/3.11.4/JsBarcode.all.min.js'></script>
    <script src='https://code.jquery.com/jquery-3.6.0.min.js'></script>
</head>

<body>
    <div class="invoice-box">

        {{!-- ENCABEZADO NOMINA --}}
        

        {{!-- DETALLES FUNCIONARIO --}}
        
        <center>
            
            <table cellpadding="2" cellspacing="2" class="table_head_ride">
                <tr>
                    <td width="100%">
                        <div class="div_body_ride">
                            <table cellpadding="0" cellspacing="0" class="table_head_ride_segmento">
                                
                                <tr>
                                    <td colspan="2" >
                                        <b>DATOS DE LA NOMINA </b>
                                    </td>
                                </tr>
                                <tr>
                                    <td width="60%">
                                        <b>Descripción: </b> {{rol_pago}}
                                    </td>
                                    <td width="40%">
                                        <b>Fecha de Emisión: </b> {{f_impresion}}                                        
                                    </td>
                                </tr>
                                <tr>
                                    <td width="60%">
                                        <b>Año: </b> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {{anio}}
                                    </td>
                                    <td width="40%">
                                        <b>Mes: </b> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{mes}} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;                                     
                                    </td>
                                </tr>
                                <br>
                                <tr>
                                    <td colspan="2" >
                                        <b>DATOS DEL FUNCIONARIO </b>
                                    </td>
                                </tr>
                                <tr>
                                    <td width="60%">
                                        <b>Identificación: </b>
                                        {{cedula}}
                                    </td>
                                </tr>
                                <tr>
                                    <td width="60%">
                                        <b>Funcionario: </b> &nbsp;&nbsp;
                                        {{funcionario}}
                                    </td>
                                    <td width="40%">
                                        <b>Cargo: </b> &nbsp;&nbsp;
                                        {{cargo}}
                                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2" >
                                        <b>DATOS DE LA CUENTA BANCARIA </b>
                                    </td>
                                </tr>
                                <tr>
                                    <td width="60%">
                                        <b>Tipo de Cuenta: </b> {{tipo_cuenta}}
                                    </td>
                                    <td width="40%">
                                        <b>Número de cuenta: </b> {{numero_cuenta}}                                        
                                    </td>
                                </tr>
                                <tr>
                                    <td width="60%">
                                        <b>Banco: </b> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{banco}}
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </td>
                </tr>
            </table>
        </center>

        {{!-- DETALLES NOMIA --}}
        <center>
            <table cellpadding="2" cellspacing="1" class="table_head_ride">
                <tr>
                    <td width="100%">
                        <table cellpadding="3" cellspacing="0" class="table_body_ride">
                            <thead>
                                <td width="10%">
                                    #
                                </td>
                                <td width="60%">
                                    Ingreso
                                </td>
                                <td width="30%">
                                    Monto
                                </td>
                            </thead>
                            {{#each ingresos}}
                                <tr>
                                    <td align="center" style="font-size:10px">
                                        {{numero}}
                                    </td>
                                    <td align="center" style="font-size:10px">
                                        {{rubro}}
                                    </td>
                                    <td align="right" style="font-size: 10px;">
                                        {{valor}}
                                    </td>
                                </tr>
                            {{/each}}

                            
                        </table>
                    </td>
                </tr>
            </table>
            <table cellpadding="2" cellspacing="1" class="table_head_ride">
                <tr>
                    <td width="100%">
                        <table cellpadding="3" cellspacing="0" class="table_body_ride">
                            <thead>
                                <td width="70%">
                                    Total Ingreso -->
                                </td>
                                <td width="30%" align="right" style="font-size: 10px;">
                                    {{total_ingreso}}
                                </td>
                            </thead>
                        </table>
                    </td>
                </tr>
            </table>
            <table cellpadding="2" cellspacing="1" class="table_head_ride">
                <tr>
                    <td width="100%">
                        <table cellpadding="3" cellspacing="0" class="table_body_ride">
                            <thead>
                                <td width="10%">
                                    #
                                </td>
                                <td width="60%">
                                    Descuentos
                                </td>
                                <td width="30%">
                                    Monto
                                </td>
                            </thead>
                            {{#each egresos1}}
                                <tr>
                                    <td align="center" style="font-size:10px">
                                        {{numero}}
                                    </td>
                                    <td align="center" style="font-size:10px">
                                        {{rubro}}
                                    </td>
                                    <td align="right" style="font-size: 10px;">
                                        {{valor}}
                                    </td>
                                </tr>
                            {{/each}}
                            

                            
                        </table>
                    </td>
                </tr>
            </table>
            <table cellpadding="2" cellspacing="1" class="table_head_ride">
                <tr>
                    <td width="100%">
                        <table cellpadding="3" cellspacing="0" class="table_body_ride">
                            <thead>
                                <td width="70%">
                                    Total Descuento -->
                                </td>
                                <td width="30%" align="right" style="font-size: 10px;">
                                    {{total_egreso}}
                                </td>
                            </thead>
                        </table>
                    </td>
                </tr>
            </table>
            <table cellpadding="2" cellspacing="1" class="table_head_ride">
                <tr>
                    <td width="100%">
                        <table cellpadding="3" cellspacing="0" class="table_body_ride">
                            <thead>
                                <td width="10%">
                                    #
                                </td>
                                <td width="60%">
                                    Aportes
                                </td>
                                <td width="30%">
                                    Monto
                                </td>
                            </thead>
                            {{#each egresos2}}
                                <tr>
                                    <td align="center" style="font-size:10px">
                                        {{numero}}
                                    </td>
                                    <td align="center" style="font-size:10px">
                                        {{rubro}}
                                    </td>
                                    <td align="right" style="font-size: 10px;">
                                        {{valor}}
                                    </td>
                                </tr>
                            {{/each}}

                            
                        </table>
                    </td>
                </tr>
            </table>
            <table cellpadding="2" cellspacing="1" class="table_head_ride">
                <tr>
                    <td width="100%">
                        <table cellpadding="3" cellspacing="0" class="table_body_ride">
                            <thead>
                                <td width="70%">
                                    Total Aporte -->
                                </td>
                                <td width="30%" align="right" style="font-size: 10px;">
                                    {{total_aporte}}
                                </td>
                            </thead>
                        </table>
                    </td>
                </tr>
            </table>
            <table cellpadding="2" cellspacing="1" class="table_head_ride">
                <tr>
                    <td width="100%">
                        <table cellpadding="3" cellspacing="0" class="table_body_ride">
                            <thead>
                                <td width="70%">
                                    Liquido a Pagar
                                </td>
                                <td width="30%" align="right" style="font-size: 10px;">
                                    {{total}}
                                </td>
                            </thead>
                        </table>
                    </td>
                </tr>
            </table>
        </center>

    </div>
    <script type="text/javascript">
        $(function () {
            JsBarcode("#barcode", "{{infoTributaria.claveAcceso}}", {
                width: 1,
                height: 40,
                textAlign: "center",
                textMargin: 2,
                fontSize: 11,
                margin: 2,
                fontOptions: "bold"
            });
        });
    </script>
</body>

</html>