@extends('layouts.app')



@section('content')

<link href="{{asset('css/profile.css')}}" rel="stylesheet">

    <div class="profile d-flex">
        <div class="row">
            <h2 class="mt-2 mb-3">Administração - Notícias</h2>
        </div>
    </div>
    <div class="profile justify-content-center">
        <div class="row">
            <div class="col-sm-12 col-lg-2">
                <ul class="nav flex-column nav-pills nav-pills-primary">
                    <li class="nav-item">
                        <a href="javascript:void();" data-target="#list" data-toggle="pill" class="nav-link {{ $action=='LIST' ? 'active show' : ''}}"><span class="hidden-xs">LISTA DE NOTÍCIAS</span></a>
                    </li>
                    <li class="nav-item">
                        <a href="javascript:void();" data-target="#destaq" data-toggle="pill" class="nav-link {{ $action=='DESTAQ' ? 'active show' : ''}}"><span class="hidden-xs">EM DESTAQUE</span></a>
                    </li>
                    <li class="nav-item">
                        <a href="javascript:void();" data-target="#mobile" data-toggle="pill" class="nav-link {{ $action=='mobile' ? 'active show' : ''}}"><span class="hidden-xs">Disponivel na APP</span></a>
                    </li>
                    @can('inserir noticias')
                        <li class="nav-item">
                            <a href="javascript:void();" data-target="#new" data-toggle="pill" class="nav-link {{ $action=='EDIT' ? 'active show' : ''}}"><span class="hidden-xs">NOVA NOTÍCIA</span></a>
                        </li>
                    @endcan
                    @can('inserir categoria')
                        <li class="nav-item">
                            <a href="javascript:void();" data-target="#category" data-toggle="pill" class="nav-link {{ $action=='CATEGORY' ? 'active show' : ''}}"><span class="hidden-xs">Categorias</span></a>
                        </li>
                        <li class="nav-item">
                            <a href="javascript:void();" data-target="#related" data-toggle="pill" class="nav-link {{ $action=='RELATED' ? 'active show' : ''}}"><span class="hidden-xs">Temas</span></a>
                        </li>
                    @endcan
                </ul>
            </div>

            <div class="col-sm-12 col-lg-10">
	            <div class="card z-depth-3">
	                <div class="card-body">
		                <div class="tab-content p-3">

                            <!-- LISTA DE NOTICIAS NA APP-->
							<div class="tab-pane {{ $action=='mobile' ? 'active' : '' }}" id="mobile">
		                        <div class="col-sm-12 col-lg-12" style="overflow-x: auto ">  
		                            <table class="table table-hover table-striped">
		                                <thead>
											<th>#</th>
								            <th>Título</th>
								            <th>Categoria</th>
                                            <th>Assunto</th>
                                            <th>Data</th>
                                            <th>Última atualização</th>
                                            <th colspan="3">Acções</th>
								        </thead>
								        <tbody>
                                            
                                            @forelse ($app as $key => $n)
                                                <tr>
                                                    <td>{{ $key+1 }}</td>
                                                    <td>{!! $n->news_title !!}</td>
                                                    <td>{{ $n->category->name }}</td>
                                                    <td>{!! $n->related->related_name !!}</td>
                                                    <td nowrap>{{ $n->news_date }}</td>
                                                    <td nowrap>{{ $n->updated_at }}</td>
                                                    <td><a href="{{ route('showNews',$n->news_url) }}"><img src="{{asset('img/info.png')}}" width="25px" /></a></td>
                                                    @can('editar noticias')
                                                        <td><a href="{{ route('news.edit',$n->news_id) }}"><img src="{{asset('img/edit.png')}}" width="25px"/></a></td>
                                                    @endcan
                                                    @can('apagar noticias')
                                                        <td><a href="{{ route('deleteNews',$n->news_id) }}"><img src="{{asset('img/del.png')}}" width="25px"/></a></td>
                                                    @endcan
                                                </tr>    
                                            @empty
                                                <tr><td colspan="7" align="center">Não existe notícias em destaque</td></tr>
                                            @endforelse
										
										</tbody>
		                            </table>
		                        </div>
                            </div>
                            <!-- FIM DA LISTA -->

                             <!-- LISTA DE NOTICIAS EM DESTAQUE-->
							<div class="tab-pane {{ $action=='DESTAQ' ? 'active' : '' }}" id="destaq">
		                        <div class="col-sm-12 col-lg-12" style="overflow-x: auto ">  
		                            <table class="table table-hover table-striped">
		                                <thead>
											<th>#</th>
								            <th>Título</th>
								            <th>Categoria</th>
                                            <th>Assunto</th>
                                            <th>Data</th>
                                            <th>Última atualização</th>
                                            <th colspan="3">Acções</th>
								        </thead>
								        <tbody>
                                            
                                            @forelse ($news->where('news_destaq',1) as $key => $n)
                                                <tr>
                                                    <td>{{ $key+1 }}</td>
                                                    <td>{!! $n->news_title !!}</td>
                                                    <td>{{ $n->category->name }}</td>
                                                    <td>{!! $n->related->related_name !!}</td>
                                                    <td nowrap>{{ $n->news_date }}</td>
                                                    <td nowrap>{{ $n->updated_at }}</td>
                                                    <td><a href="{{ route('showNews',$n->news_url) }}"><img src="{{asset('img/info.png')}}" width="25px" /></a></td>
                                                    @can('editar noticias')
                                                        <td><a href="{{ route('news.edit',$n->news_id) }}"><img src="{{asset('img/edit.png')}}" width="25px"/></a></td>
                                                    @endcan
                                                    @can('apagar noticias')
                                                        <td><a href="{{ route('deleteNews',$n->news_id) }}"><img src="{{asset('img/del.png')}}" width="25px"/></a></td>
                                                    @endcan
                                                </tr>    
                                            @empty
                                                <tr><td colspan="7" align="center">Não existe notícias em destaque</td></tr>
                                            @endforelse
										
										</tbody>
		                            </table>
		                        </div>
                            </div>
                            <!-- FIM DA LISTA -->

                            <!-- LISTA DE NOTICIAS -->
                            <div class="tab-pane {{ $action=='LIST' ? 'active' : '' }}" id="list">
                                <div class="col-sm-12 col-lg-12" style="overflow-x: auto">
                                    <form action="{{ route('searchNewsByTitle') }}" method="POST" name="races">
                                        @csrf
                                        <div class="form-group row">
                                            <label class="col-lg-12">
                                                <strong>Procurar</strong>
                                            </label>
                                        </div>
                                        <div class="form-group row">
                                            <label class="col-lg-3 col-form-label form-control-label">Nome</label>
                                            <div class="col-lg-9">
                                                <input class="form-control" type="text" name="news_title" value="">
                                            </div>
                                        </div>
                                        <div class="form-group row">
                                            <div class="col-lg-12" align="right">
                                                <a href="{{ route('news.index')}}"><input type="button" class="btn btn-secondary" value="Limpar" /></a>	
                                                <input type="submit" class="btn btn-primary" value="Procurar" />
                                            </div>
                                        </div>
                                    </form>
                                </div>

                                <div class="col-sm-12 col-lg-12" style="overflow-x: auto ">
                                    <div class="form-group row">
                                        <label class="col-lg-12">
                                            <strong>Lista de todas as notícias</strong>
                                        </label>
                                    </div>   
		                            <table class="table table-hover table-striped">
		                                <thead>
                                            <th>#</th>
                                            <th>Imagem</th>
								            <th>Título</th>
								            <th>Categoria</th>
                                            <th>Assunto</th>
                                            <th>Data</th>
                                            <th>Última atualização</th>
                                            <th colspan="3">Acções</th>
								        </thead>
								        <tbody>
                                            
                                            @forelse ($news as $key => $n)
                                                <tr>
                                                    <td>{{ $n->news_id }}</td>
                                                    <td><img src="{{ asset(config('app.url').'/'.$n->news_img)}}" width="55px" /></td>
                                                    <td>{!! $n->news_title !!}</td>
                                                    <td>{{ $n->category->name }}</td>
                                                    <td>{!! $n->related->related_name !!}</td>
                                                    <td nowrap>{{ $n->news_date }}</td>
                                                    <td nowrap>{{ $n->updated_at }}</td>
                                                    <td><a href="{{ route('showNews',$n->news_url) }}"><img src="{{asset('img/info.png')}}" width="25px" /></a></td>
                                                    @can('editar noticias')
                                                        <td><a href="{{ route('news.edit',$n->news_id) }}"><img src="{{asset('img/edit.png')}}" width="25px"/></a></td>
                                                    @endcan
                                                    @can('apagar noticias')   
                                                        <td><a href="{{ route('deleteNews',$n->news_id) }}"><img src="{{asset('img/del.png')}}" width="25px"/></a></td>
                                                    @endcan
                                                </tr>    
                                            @empty
                                                <tr><td colspan="7" align="center">Não existe notícias para apresentar</td></tr>
                                            @endforelse
										
										</tbody>
                                    </table>
                                    <div>{{ $news->links() }}</div>
		                        </div>
                            </div>
                            <!-- FIM DA LISTA -->

                            <!-- FORMULÁRIO NOTICIAS-->
                            @can('inserir noticias')
                            <div class="tab-pane {{ $action=='EDIT' ? 'active' : '' }} " id="new">
                                <div class="col-sm-12 col-lg-12">
                                    <form action="{{ isset($editnews) ? route('news.update',$editnews->news_id) : route('news.store')}}" method="POST" name="newnews" enctype="multipart/form-data">
                                        @csrf
                                        @if(isset($editnews))
                                            @method('PUT')
                                        @endif
                                        <div>
                                            <div class="form-group row">
                                                <label class="col-lg-12">
                                                    <strong>{{ $action=='EDIT'?'Editar notícia':'Nova notícia'}}</strong>
                                                </label>
                                            </div>

                                            <div class="form-group row">
                                                <label class="col-12" style="font-size: 0.9em">Para cria uma noticia deverá preencher todos os campos, antes de iniciar verifique
                                                    se encontra-se criada a <strong>Categoria e o Tema</strong> da noticias. Atenção que caso noticia esteja ativa irá aparecer 
                                                    no aplicativo mobile do Euroindy.
                                                </label>
                                            </div>
    
                                            <div class="form-group row">
                                                <label class="col-lg-3 col-form-label form-control-label">Título
                                                    <p style="font-size: 0.7em;">Título da noticia, máximo 20 caracteres devido ao espaço no aplicativo mobile.</p>
                                                </label>
                                                <div class="col-lg-9">
                                                <input class="form-control" type="text" name="news_title" value="{{ isset($editnews)?$editnews->news_title:'' }}">
                                                </div>
                                            </div>
    
                                            <div class="form-group row">
                                                <label class="col-lg-3 col-form-label form-control-label">URL
                                                    <p style="font-size: 0.7em;">O URL da notícia será criado automaticamente em função do titulo da notícia.</p>
                                                </label>
                                                <div class="col-lg-9">
                                                <input class="form-control" type="text" name="news_url" value="{{ isset($editnews)?$editnews->news_url:'' }}" disabled >
                                                </div>
                                            </div>
    
                                            <div class="form-group row">
                                                <label for="textarea" class="col-lg-3 col-form-label form-control-label">Introdução
                                                    <p style="font-size: 0.7em;">Pequena instrodução da notícia que será apresentada na frente da página caso a opção "Destaque" seja 
                                                    ativada. <strong>A introdução será repetida dentro da pagina da noticia.</strong></p>
                                                </label>
                                                <div class="col-lg-9">
                                                    <textarea class="form-control" id="textarea-sub" rows="6" name="news_subtitle">
                                                        {{ isset($editnews)?$editnews->news_subtitle:'' }}
                                                    </textarea>
                                                </div>
                                            </div>
    
                                            <div class="form-group row">
                                                <label for="textarea" class="col-lg-3 col-form-label form-control-label">Corpo
                                                    <p style="font-size: 0.7em;">O corpo da noticia é onde tems as informações principais da noticia. Uma explicação mais completa do 
                                                    objectivo da noticia. Este texto só será apresentado dentro da pagina da noticia</strong></p>
                                                </label>
                                                <div class="col-lg-9">
                                                    <textarea class="form-control" name="news_html" rows="9" id="editorBody">
                                                        {{ isset($editnews)?$editnews->news_html:'' }}
                                                    </textarea>
                                                </div>
                                            </div>

                                            <div class="form-group row" style="background-color: silver; padding: 0.5em">
                                                <label for="textarea" class="col-lg-3 col-form-label form-control-label"><Strong>Descrição na aplicação Euroindy</strong>
                                                    <p style="font-size: 0.7em;">Descrição da noticia é onde temos as informações principais. Este campo só sera apresentado na aplicação movel do Euroindy</p>
                                                </label>
                                                <div class="col-lg-9">
                                                    <textarea class="form-control" name="news_body" rows="5">
                                                        {{ isset($editnews)?$editnews->news_body:'' }}
                                                    </textarea>
                                                </div>
                                            </div>
                                            
                                        
                                            <div class="form-group row">
                                                <label for="photo" class="col-lg-3 col-form-label form-control-label">Imagem
                                                    <p style="font-size: 0.7em;">Imagem principal da notícia. É apresentada em todos os locais de notícias 
                                                        (Frente, Pagina da Noticias, Relacionados, Destaque). <strong>Aconcelhado colocar uma imagem já com as medidas estabelecidas</strong></p>
                                                </label>
                                                <div class="col-lg-9">
                                                    <input type="file" class="form-control-file" id="photo" name="news_img">
                                                </div>
                                            </div>

                                            @if(Auth::user()->hasRole('super-admin'))
                                                <div class="form-group row">
                                                    <label for="url" class="col-lg-3 col-form-label form-control-label" style="color: red">Endereço da Imagem -> news_img
                                                        <p style="font-size: 0.7em;">Para ajustes de compatibilidade entre as duas platarformas web</p>
                                                    </label>
                                                    <div class="col-lg-9">
                                                        <input type="text" class="form-control" id="url" name="news_new_url" value="{{ isset($editnews)?$editnews->news_img:''}}">
                                                    </div>
                                                </div>
                                            @endif
                                            
    
                                            <div class="form-group row">
                                                    <label class="col-lg-3 col-form-label form-control-label">Legenda da imagem
                                                        <p style="font-size: 0.7em;"><strong>Campo obrigatório</strong> texto que explicativo da imagem. Será apresentado caso o browser 
                                                            não carregue a imagem ou que não exista a imagem</p>
                                                    </label>
                                                    <div class="col-lg-9">
                                                        <input class="form-control" type="text" value="{{ isset($editnews)?$editnews->news_img_alt:'' }}" name="news_img_alt">
                                                    </div>
                                            </div>
    
                                            <div class="form-group row">
                                                <label class="col-lg-3 col-form-label form-control-label">Categoria
                                                    <p style="font-size: 0.7em;">Defina uma categoria para a notícia. Todas a notícias da mesma categoria serão agrupadas e apresentadas numa pagina. 
                                                    Exemplo: Provas Euroindy
                                                    </p>
                                                </label>
                                                    <div class="col-lg-9">
                                                        <select name="category_id" class="form-control">
                                                            @foreach ($categorys as $category)
                                                                <option value="{{$category->id}}" @isset($editnews)@if($editnews->news_category == $category->name) selected @endif @endisset>{{ $category->name }}</option>
                                                            @endforeach
                                                            </select>
                                                    </div>
                                            </div>
                    
                                            <div class="form-group row">
                                                <label class="col-lg-3 col-form-label form-control-label">Relacionado
                                                    <p style="font-size: 0.7em;">O mesmo que a categoria mas de uma forma mas especifica. Exemplo: Taça Euroindy Março 2022
                                                        </p>
                                                </label>
                                                    <div class="col-lg-9">
                                                        <select name="news_related" class="form-control">
                                                        
                                                            @foreach ($related as $rel)
                                                                <option value="{{$rel->related_id}}"  @isset($editnews)@if($editnews->Related()->first() !== null )@if($editnews->Related()->first()->related_altname == $rel->related_altname) selected @endif @endif @endisset>{{ $rel->related_name }}</option>
                                                            @endforeach
                                                        </select>
                                                    </div>
                                            </div>
    
                                            <div class="form-group row">
                                                <label class="form-check-label col-form-label col-lg-3" for="kiosk">Em destaque
                                                    <p style="font-size: 0.7em;">Apresenta a notícia na frente da página 
                                                        </p>
                                                </label>
                                                <div class="col-lg-6">
                                                    <input type="hidden" name="news_destaq" value="0" />
                                                    <input class="form-check-input" type="checkbox" id="kiosk" name="news_destaq" value="1" @isset($editnews)@if($editnews->news_destaq == 1) checked @endif @endisset/>
                                                </div>
                                            </div>
    
                                            <div class="form-group row">
                                                <label class="form-check-label col-form-label col-lg-3" for="kiosk">Activa
                                                    <p style="font-size: 0.7em;">A notícia é apresentada em todo o website, caso não selecione a noticia ficará arquivada
                                                        </p>
                                                </label>
                                                <div class="col-lg-6">
                                                <input type="hidden" name="news_active" value="0" /> 
                                                <input class="form-check-input" type="checkbox" id="kiosk" name="news_active" value="1" @isset($editnews)@if($editnews->news_active == 1) checked @endif @endisset/>
                                                </div>
                                            </div>
    
                                            <div class="form-group row">
                                                <label class="form-check-label col-form-label col-lg-3" for="kiosk">App na App
                                                    <p style="font-size: 0.7em;">A notícia é apresentada na aplicação mobile do Euroindy
                                                    </p>
                                                </label>
                                                <div class="col-lg-6">
                                                <input type="hidden" name="news_app" value="0" /> 
                                                <input class="form-check-input" type="checkbox" id="kiosk" name="news_app" value="1" @isset($editnews)@if($editnews->news_app == 1) checked @endif @endisset />
                                                </div>
                                            </div>
    
                                        <hr />
    
                                            <div class="form-group row">
                                                <div class="col-lg-12" align="right">	
                                                    <input type="submit" class="btn btn-primary" value="Guardar" />
                                                </div>
                                            </div>
    
                                        </div>
                                    </form> 
                                </div>
                                
                            </div>
                            @endcan
                            <!-- FIM DO FORMULÁRIO -->
                            @can('inserir categoria')
                            <!-- CATEGORIAS -->
                            <div class="tab-pane {{ $action=='EDITCAT' ? 'active' : '' }}" id="category">
                                <div class="col-lg-12">
                                    @include('admin.includes.categorys')
                                </div>
                            </div>
                            <!-- END -->

                            <!-- TEMAS -->
                            <div class="tab-pane" id="related">
                                <div class="col">
                                    <form id="frmSaveTerm" action="{{ route('temas.store') }}" method="POST">
                                        @csrf
                                        <div>
                                            <div class="form-group row">
                                                <label class="col-lg-12">
                                                    <strong>Novo tema</strong>
                                                </label>
                                            </div>
                                            <div class="form-group row">
                                                <label class="col-lg-3 col-form-label form-control-label">Nome</label>
                                                <div class="col-lg-9">
                                                    <input class="form-control" type="text" name="related_name" value="" />
                                                </div>
                                            </div>
                                            <div class="form-group row">
                                                <div class="col-12" align="right">	
                                                    <input type="submit" class="btn btn-primary" value="Guardar" />
                                                </div>
                                            </div>
                                        </div>
                                    </form>

                                    <form id="frmEditTerm" action="{{ route('updateTem') }}" method="POST" style="display: none;">
                                        @csrf
                                        <div>
                                            <div class="form-group row">
                                                <label class="col-lg-12">
                                                    <strong>Editar Tema</strong>
                                                </label>
                                            </div>
                                            <div class="form-group row">
                                                <label class="col-lg-3 col-form-label form-control-label">Nome</label>
                                                <div class="col-lg-9">
                                                    <input class="form-control" type="text" name="name" id="temName" value="" />
                                                </div>
                                            </div>
                                            <div class="form-group row">
                                                <div class="col-12" align="right">
                                                    <input type="hidden" id="temId" name="id" value="" />
                                                    <input type="button" class="btn btn-secondary" id="temCancel" value="Cancelar" />	
                                                    <input type="submit" class="btn btn-primary" value="Editar" />
                                                </div>
                                            </div>
                                        </div>
                                    </form>
                                   
                                    <div class="form-group row">
                                        <label class="col-lg-12">
                                            <strong>Listagem</strong>
                                        </label>
                                    </div>  
		                            <table class="table table-hover table-striped">
		                                <thead>
                                            <th>#</th>
                                            <th>Nome</th>
                                            <th>Data</th>
                                        </thead>
                                        <body>
                                            @forelse ($related as $rel)
                                            <tr>
                                                <td>{{ $rel->related_id }}</td>
                                                <td>{{ $rel->related_name }}</td>
                                                <td>{{ $rel->created_at }}</td>
                                                <td><a onclick="temEdit('{{ $rel->related_name}}',{{ $rel->related_id }})"><img src="{{asset('img/edit.png')}}" width="25px"/></a></td>
                                                <td><a href=""><img src="{{asset('img/del.png')}}" width="25px"/></a></td>
                                            </tr>
                                            @empty
                                            <tr>
                                                <td colspan="3" align="center">Não existe temas para apresentar</td>
                                            </tr>
                                            @endforelse
                                        </body>
                                    </table>
                                </div>
                            </div>
                            <!-- END -->
                            @endcan
                        </div>
                    </div>
                </div>
            </div>
    </div>

    <script>
        var editorBody = new Jodit('#editorBody', {
            "uploader" : {
                "insertImageAsBase64URI": true
            }
        });
        
        
        function catEdit(name,id){
            $('#frmSave').hide();
            $('#frmEdit').show();
            $('#categoryId').val(id);
            $('#catEditName').val(name);
        }

        function temEdit(name,id){
            $('#frmSaveTerm').hide();
            $('#frmEditTerm').show();
            $('#temId').val(id);
            $('#temName').val(name);

        }

        function cancelEdit(){
            console.log('Click Cancel')
        }

    
    </script>
@endsection