@extends('layouts.blit')
@section('Breadcrumbs')
    {!! Breadcrumbs::render('home') !!}
@endsection
@section('content')
    <div class="the-box rounded">
        <div class="demand-index-open-2">
            <div class="person">
                <div class="text-center text-uppercase" style="color:white; padding: 5px; background-color: {{ $demand->type_demand->color }}">
                    <h2 style="margin-top: 15px">{{$demand->type_demand->name}}</h2> <p>{{ $demand->protocol }}</p>
                </div>
                <div class="col-md-12 text-left" style="margin: 20px 0 20px">
                    <a href="/demands" class="btn btn-lg btn-default">
                        <i class="fa fa-backward"></i>VOLTAR
                    </a>
                </div>
                <div class="content" style="margin-top: 30px">
                    <h1>{{ $demand->subject }}</h1>
                    <h3>Destino: {{ $demand->secretariat->name }}</h3>
                    <p><strong>LINK DO USUÁRIO: </strong>{{ url('/ouvidoria/consultar?p='. $demand->protocol .'&c='. $demand->password ) }}</p>
                    <div class="row">
                        <div class="col-md-3">
                            <h4>Protocolo: {{ $demand->protocol }}</h4>
                        </div>
                        <div class="col-md-3">
                            <h4>Data: {{ $demand->created_at->format('d/m/Y H:i:s') }}</h4>
                        </div>
                        <div class="col-md-3">
                            <h4>Status: {{ \App\Models\DemandStatusDemand::where('demand_id',$demand->id)->get()->last()->status->name }}</h4>
                        </div>
                        <div class="col-md-3">
                            <h4>Situação: {{$demand->closed ? 'Fechada' : 'Aberta'}}</h4>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="list-group">
                                <li href="#" class="list-group-item">
                                    <h4 class="list-group-item-heading">
                                        {{ $demand->created_at->format('d/m/Y H:i:s') }} | 61 anos atras                                    </h4>
                                    <p class="list-group-item-text">{!! nl2br($demand->text) !!}</p>
                                    <ul class="no-border" style="border: 0px">
                                        <h3>RESPOSTAS</h3>
                                        @forelse($demand->answers()->orderBy('created_at','desc')->get() as $key => $answer)
                                            <li href="#" class="list-group-item no-border" style="border: 0px">
                                                <h4 class="list-group-item-heading text-danger">
                                                    {{ $answer->created_at->format('d/m/Y H:i:s') }} | 61 anos atras                                                </h4>
                                                <p class="list-group-item-text text-primary">{!! nl2br($answer->answer) !!}</p>
                                            </li>
                                        @empty
                                            <li href="#" class="list-group-item no-border" style="border: 0px">
                                                <h4 class="list-group-item-heading text-danger">
                                                    ESTE CHAMADO AINDA NÃO FOI RESPONDIDO.
                                                </h4>
                                            </li>
                                        @endforelse
                                    </ul>
                                </li>
                            </div>
                        </div>
                    </div>
                    @if(!$demand->closed)
                        <div class="row" style="margin-bottom: 30px">
                            <div class="col-md-12">
                                <div class="jumbotron">
                                    <h3>RESPONDER CHAMADO</h3>
                                    <form action="/demands/{{ $demand->id }}/answers" method="POST">
                                        {{ csrf_field() }}
                                        <div class="row">
                                            @include('answers.fields')
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                        <div class="row" style="margin-bottom: 30px">
                            <div class="col-md-12">
                                <form id="closeDemand{{$demand->id}}" action="/demands/{{ $demand->id }}/close" method="POST">
                                    {{ csrf_field() }}
                                    <button type="button" onclick="return closeDemand({{$demand->id}})" class="btn btn-lg btn-danger pull-right"><i class="fa fa-close"></i> FECHAR ESTE CHAMADO</button>
                                </form>
                            </div>
                        </div>
                    @endif
                    <div class="col-md-12 text-left" style="margin: 20px 0 20px">
                        <a href="/demands" class="btn btn-lg btn-default">
                            <i class="fa fa-backward"></i>VOLTAR
                        </a>
                    </div>
                    <div class="clearfix"></div>
                </div>
            </div>
        </div>
    </div>
    <script>
        var closeDemand = function (id) {
            swal({
                title: "Deseja ENCERRAR este chamado?",
                text: "Caso ENCERRAR, Registro não poderá ser reaberto!",
                icon: "warning",
                buttons: true,
                dangerMode: true,
            })
                .then((willDelete) => {
                    if (willDelete) {
                        $('#closeDemand'+id).submit();
                    }
                });
        }
    </script>
@endsection