@extends('helper.include.view.modal', ['id' => 'modal-detalhe3', 'class_size' => 'modal-lg'])

@section('modal-start')
    <form class="form-inline" ng-submit="vm.DRE.gravar()">
@overwrite

@section('modal-header-left')

<h4 class="modal-title">
    @{{ vm.TITULO_DETALHE }}
</h4>

@overwrite

@section('modal-header-right')

	<button type="button" class="btn btn-default btn-fechar-modal btn-voltar" data-dismiss="modal" data-hotkey="esc">
      <span class="glyphicon glyphicon-chevron-left"></span> Voltar
    </button>	

@overwrite

@section('modal-body')
<div style="height: calc(100vh - 200px);">
    
    <div class="table-ec table-scroll" style="height: calc(100vh - 250px);">
        <table class="table table-striped table-bordered table-condensed table-no-break table-middle table-low">
            <thead>
                <tr gc-order-by="vm.DETALHE.ORDER_BY">                  
					<th field="CONTA_DESC">Conta Contábil</th>
					<th field="VALOR" style="text-align: right;">VALOR</th>
					<th field="PERC" style="text-align: right;">%</th>
            </thead>
            <tbody>
            <tr
                    ng-repeat="item in vm.DETALHE.DADOS | orderBy : vm.DETALHE.ORDER_BY"
                    ng-focus="vm.DETALHE.SELECTED = item"
                    ng-class="{ 'selected' : vm.DETALHE.SELECTED == item }"
                    tabindex="0"
                    style="font-size: 15px;"
                    >
                    <td>
                        <span>
                            @{{ item.CONTA_DESC }}
                        </span>
                    </td>
                    <td style="text-align: right;"> 
                        <span>
                            @{{ item.VALOR | number:2 }}
                        </span>
                    </td>
                    <td style="text-align: right;">
                        <span>
                            @{{ (item.VALOR / vm.DETALHE.VALOR) * 100 | number:2 }}
                        </span>
                    </td>
                </tr>

                <tr
                    tabindex="0"
                    style="font-size: 15px; font-weight: bold; background-color: #e0e0e0;"
                    >
                    <td>
                        <span>
                            Total
                        </span>
                    </td>
                    <td style="text-align: right;"> 
                        <span>
                            @{{ vm.DETALHE.DADOS[0].TOTAL | number:2 }}
                        </span>
                    </td>
                    <td style="text-align: right;">
                        <span>
                            @{{ 100 | number:2 }}
                        </span>
                    </td>
                </tr>

            </tbody>
        </table>
    </div>

    <br>
    <span style="margin-top: 10px; ">Total:@{{ vm.DETALHE.VALOR | number:2 }} </span>

</div>
</form>

@overwrite