<div ng-include="'views/pageHeader.html'"></div>
<div class="container" style="" ng-controller="CollapseGeralCtrl">
    <div ng-controller="ocorrenciasController" ng-init="carregarOcorrencias(procurar_dados,false)">
        <div class="">
            <div class="col-xs-6 col-md-6" style="padding:0">
                <label style="color:#333366; font-size:14pt; margin-right:10pt">OCORRÊNCIAS</label>
            </div>
            <div class="col-xs-6 col-md-6" style="text-align:right; padding:0px">
                <button type="button"
                        ng-disabled="mnuGESTAO.PEditar==false"
                        class="btn btn-primary btn-md"
                        ng-click="openModalEncaminhamentos()">
                    Encaminhar
                </button>
            </div>
            <br />
            <br />
        </div>

        <div class="col-md-12" style="padding:3px;" collapse="isCollapsed">
            <div class="col-md-4" style="margin-bottom:5px">
                <div class="input-group">
                    <input type="text"
                           class="form-control"
                           placeholder="Procurar..."
                           ng-model="procurar_dados"
                           ng-change="carregarOcorrencias(procurar_dados,false)"
                           ng-debounce
                           style="">
                    <span class="input-group-addon apontar"
                          popover-placement="bottom"
                          popover-trigger="mouseenter"
                          data-popover="Pesquisa avançada"
                          ng-click="openModalPesquisaAvancadaOcorrencia()">
                        Pesquisa avançada <span class="glyphicon glyphicon-search"></span>
                    </span>

                </div>
            </div>

            <div class="col-md-12 table-responsive margem">

                <div class="sep1" id="tabCadastro" style="border-top:1px solid #EEE; height:468px; overflow-x:hidden">
                    <table class="table table-hover table-striped">
                            <tr>
                                <th>Data</th>
                                <th>Hora</th>
                                <th>Nº Inv</th>
                                <th>Descrição</th>
                                <th>Gestor</th>
                                <th>Encaminhado</th>
                                <th>Local</th>
                                <th>Sit.</th>
                                
                                <th style="min-width:80px; width:100px; text-align:right">
                                    <button type="button"
                                            class="btn btn-primary btn-sm"
                                            popover-placement="left"
                                            popover-trigger="mouseenter"
                                            data-popover="Nova ocorrência"
                                            ng-click="openModalEditarOcorrencia(null)"
                                            ng-disabled="mnuGESTAO.PCriar==false">
                                        <span class="glyphicon glyphicon-plus"></span>
                                    </button>
                                </th>
                            </tr>
                        <tr ng-repeat="item in lstOcorrencias" ng-click="selOcorrencia(item);"
                            class="apontar" ng-class="{info:item.PkOcorrencia==selectedOcorrencia.PkOcorrencia}" ng-style="getCorLinhaEncerrado(item.Estado==='R')">
                            <td>{{item.DataStr}}</td>
                            <td>{{item.Hora}}</td>
                            <td>{{item.NumInv}}</td>
                            <td>
                                <input type="text" onfocus="this.blur()" readonly="readonly" ng-model="item.Descricao" class="input_tab readonly" />
                            </td>
                            <td>
                                <input type="text" onfocus="this.blur()" readonly="readonly" ng-model="item.NomeResponsavel" class="input_tab readonly" />
                            </td>
                            <td>
                                <input type="text" onfocus="this.blur()" readonly="readonly" ng-model="item.GestorEnc" class="input_tab readonly" />
                            </td>
                            <td>
                                <input type="text" onfocus="this.blur()" readonly="readonly" ng-model="item.Local" class="input_tab readonly" />
                            </td>
                            <td style="width:20px">
                                <input type="text" readonly="readonly" ng-model="item.Estado" class="input_tab readonly"
                                       popover-placement="left"
                                       popover-trigger="mouseenter"
                                       data-popover="{{item.DescricaoEstado}}" />
                            </td>

                            <td style="min-width:80px; width:100px; text-align:right">
                                <button popover-placement="left"
                                        popover-trigger="mouseenter"
                                        data-popover="Detalhes"
                                        ng-click="selOcorrencia(item); carregarDetalhesOcorrencias(item); setCollapse(true)"
                                        type="button" class="btn btn-default btn-xs">
                                    <span class="glyphicon glyphicon-list"></span>
                                </button>
                                <button ng-disabled="mnuGESTAO.PEditar==false" popover-placement="left"
                                        popover-trigger="mouseenter"
                                        data-popover="Editar"
                                        ng-click="openModalEditarOcorrencia(item)"
                                        type="button" class="btn btn-default btn-xs">
                                    <span class="glyphicon glyphicon-pencil"></span>
                                </button>
                                <button ng-disabled="mnuGESTAO.PApagar==false" popover-placement="left"
                                        popover-trigger="mouseenter"
                                        data-popover="Remover"
                                        ng-click="confirmarApagarOcorrencia(item)"
                                        type="button" class="btn btn-warning btn-xs">
                                    <span class="glyphicon glyphicon-remove"></span>
                                </button>
                            </td>
                        </tr>
                    </table>

                </div>
            </div>
            <br />

            <button ng-click="carregarOcorrencias(procurar_dados,true)" type="button"
                    ng-disabled="itemsLoaded==false || totalLoaded==0"
                    class="btn btn-primary btn-md">
                <span class="glyphicon glyphicon-forward"></span> Ver mais
            </button>
            <img src="images/preloader.gif" width="32" ng-hide="itemsLoaded==true || items.length==0" style="margin-left:10px; margin-right:10px" />
        </div>
        <div class="col-md-12" style="padding:3px" collapse="!isCollapsed">

            <button type="button" class="btn btn-primary btn-sm" ng-click="setCollapse(false)">
                <span class="glyphicon glyphicon-arrow-left"></span>
            </button>
            <label class="text-primary" style="margin-left:10px">{{selectedOcorrencia.Descricao}}</label>

            <hr />



            <div class="table-responsive margem">
                <table class="table" style="margin:0">
                    <thead>
                        <tr>
                            <th style="min-width:100px; width:100px">Emissor</th>
                            <th style="min-width:80px; width:80px">Data/Hora</th>
                            <th style="min-width:100px; width:100px">Assunto</th>
                            <th style="min-width:100px; width:100px">Texto da nota</th>
                            <th style="text-align:right; width:50px">
                                <button popover-placement="top"
                                        popover-trigger="mouseenter"
                                        data-popover="Adicionar" ng-disabled="mnuGESTAO.PEditar==false"
                                        ng-click="openModalEditarDetalheOcorrencia(null,selectedOcorrencia.PkOcorrencia)"
                                        type="button" class="btn btn-primary btn-sm">
                                    <span class="glyphicon glyphicon-plus"></span>
                                </button>
                            </th>
                        </tr>
                    </thead>
                </table>
                <div class="sep1" style="border-top:1px solid #EEE; height:468px; overflow-x:hidden">
                    <table class="table table-hover table-striped">
                        <tbody>
                            <tr ng-repeat="item in lstDetalhesOcorrencia" ng-click="selDetalhesOcorrencia(item)"
                                class="apontar" ng-class="{info:item.PkDetalhe==selectedDetalhesOcorrencia.PkDetalhe}">
                                <td style="min-width:100px; width:100px">
                                    {{item.Emissor}}
                                </td>
                                <td style="min-width:80px; width:80px">{{item.DataHora}}</td>
                                <td style="min-width:100px; width:100px">{{item.Assunto}}</td>
                                <td style="min-width:100px; width:100px">{{item.TextoNota}}</td>
                                <td style="text-align:right; width:50px">
                                    <button popover-placement="top"
                                            popover-trigger="mouseenter"
                                            data-popover="Editar" ng-disabled="mnuGESTAO.PEditar==false"
                                            ng-click="openModalEditarDetalheOcorrencia(item,item.FkOcorrencia)"
                                            type="button" class="btn btn-default btn-xs">
                                        <span class="glyphicon glyphicon-pencil"></span>
                                    </button>
                                    <button ng-disabled="mnuGESTAO.PApagar==false" popover-placement="left"
                                            popover-trigger="mouseenter"
                                            data-popover="Remover"
                                            ng-click="confirmarApagarDetalhesOcorrencia(item)"
                                            type="button" class="btn btn-warning btn-xs">
                                        <span class="glyphicon glyphicon-remove"></span>
                                    </button>
                                </td>
                            </tr>
                        </tbody>

                    </table>

                </div>
            </div>

        </div>
    </div>


</div>

<style>
    .horizontal-collapse {
        height: 70px;
    }

    .navbar-collapse.in {
        overflow-y: hidden;
    }
</style>

<script>
    $(document).ready(function () {
        $('.date').mask('0000-00-00');

    });
</script>














