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

@section('modal-start')
    <form class="form-inline">
@overwrite

@section('modal-header-left')

<h4 class="modal-title">
	<!-- @{{vm.Relatorio.SELECTED.DESCRICAO}} -->
	<span>11081 - Relatórios Personalizados - Comparativo de Relatórios</span>
</h4>

@overwrite

@section('modal-header-right')
	
	<button type="button" class="btn btn-default btn-fechar-modal btn-voltar" ng-click="vm.Relatorio.fecharModalComparativo()" data-hotkey="esc">
		<span class="glyphicon glyphicon-chevron-left"></span> Voltar
    </button>	

@overwrite

@section('modal-body')
<div style="height: calc(100vh - 180px);">

    <ul class="list-inline">

        <div style="display: -webkit-inline-box;" class="consulta-relatorio-comparativo"></div>

    </ul>

    <!--  -->

    <div style="width: 100%; height: calc(100% - 60px); display: inline-flex; flex-wrap: wrap; flex-direction: row; align-items: center;">

        <div class="CodeMirror-aba-janela-dupla box-card-comparacao" ng-repeat="item in vm.ARRAY_DADOS_COMPARATIVO track by item.ID">

            <div class="row" style="text-align: center;">

                <div class="form-group">
                    <input type="checkbox" id="click_5643534_a_@{{ item.ID }}" class="form-control" 
                        ng-checked="item.RELATORIO_BASE == 1" 
                        ng-true-value="1"	ng-false-value="0" 
                        ng-model="item.RELATORIO_BASE" 
                        ng-change="vm.Relatorio.changeBase(item)" 
                        ng-disabled="vm.Relatorio.BLOK_TROCA_BASE" 
                        ng-readonly="vm.Relatorio.BLOK_TROCA_BASE">
                    <label for="click_5643534_a_@{{ item.ID }}" style="margin-left: 5px; font-weight: bold">
                        Registro Base
                    </label>
                </div>

                <br>
                <br>
                <legend></legend>

                <div class="form-group">
                    <label>ID:</label>
                    <input 
                        type="text" 
                        class="form-control input-menor" 
                        ng-model="item.DESC_ID" 
                        readonly="readonly"> 
                </div>

                <div class="form-group">
                    <label>Código:</label>
                    <input 
                        type="number" 
                        min="28000" 
                        step="1" 
                        class="form-control input-menor" 
                        ng-model="item.CODIGO" 
                        ng-readonly="true"> 
                </div>

                <div class="form-group">
                    <label>Versão:</label>
                    <input 
                        type="text" 
                        ng-number-format="0" 
                        min="1" 
                        max="99999999" 
                        step="1" 
                        class="form-control input-menor" 
                        ng-model="item.VERSAO" 
                        ng-readonly="true" 
                        style="text-align: end;">
                </div>

                <div class="form-group">
                    <label>Descrição:</label>
                    <input 
                        type="text" 
                        class="form-control input-medio" 
                        ng-model="item.DESCRICAO" 
                        ng-readonly="true" 
                        style="width: 350px;">
                </div>

                <br>
                <br>

                <div class="form-group" ng-show="item.RELATORIO_BASE == 1 || !vm.Relatorio.ICON_VISIVEL" style="height: 20px;">
                </div>

                <div class="form-group" ng-show="item.DIVERGENTE == 0 && item.RELATORIO_BASE == 0 && vm.Relatorio.ICON_VISIVEL">
                    <span class="glyphicon glyphicon-ok" style="color: #22bb44;"></span> Este Relatório é similiar ao REGISTRO BASE
                </div>

                <div class="form-group" ng-show="item.DIVERGENTE == 1 && item.RELATORIO_BASE == 0 && vm.Relatorio.ICON_VISIVEL">
                    <span class="glyphicon glyphicon-remove" style="color: #ff0000;"></span> Este Relatório não é similiar ao REGISTRO BASE
                </div>

            </div>

            <br>
            <legend>SQL</legend>

            <textarea style="height: calc(50% - 20px);" id="sql_comparativo@{{ item.ID }}" class="sql_comparativo@{{ item.ID }}"></textarea>

        </div>

        <!-- 

        <div class="CodeMirror-aba-janela-dupla box-card-comparacao" style="border: none !important;">

            <div class="row" style="height: 100%; text-align: center;">

                <! -- <button 
                    type="button" 
                    class="btn btn-primary" 
                    ng-click="" 
                    data-hotkey="f6">
                    <span class="glyphicon glyphicon-plus"></span> Adicionar Relatório
                </button> -- >

                <div style="display: -webkit-inline-box;" class="consulta-relatorio-comparativo"></div>

            </div>

        </div>
    
        -->

    </div>

</div>
</form>

@overwrite