@extends('layouts.master')

@section('content')
    <div class="cover-image"></div>
    <div class="page-description"></div>
    <div class="page-content">
        <div class="red-button mark-as-read" url="{{ route('alerts.mark-as-read') }}">Alle als gelesen markieren</div>
        <div class="red-button mark-as-read selected-alerts" url="{{ route('alerts.mark-as-read') }}">Ausgewählte als gelesen markieren</div>

        <table id="alert_index_list" data-toggle="table" data-search="true" data-toolbar="#toolbar" data-classes="table table-no-bordered" data-escape="false" class="table">
            <thead>
                <tr>
                    <th data-sortable="false" data-field="title" data-switchable="false">Neuigkeiten</th>
                </tr>
            </thead>
            <tbody>
                @foreach($alerts as $alert)
                    <tr>
                        <td>
                            <div class="alert-checkbox">
                                <input class="alert-checkbox-input" type="checkbox" value="{{ $alert->id }}">
                            </div>
                            <div class="alert-link @if ($alert->read) read @endif">
                                <a href="{{ route('alerts.show', $alert->id) }}">
                                    @if(strlen($alert->title) > 55)
                                        {{ substr($alert->title, 0, 50) }}...
                                    @else
                                        {{ $alert->title }}
                                    @endif
                                </a>
                            </div>
                            <div class="alert-date">
                                {{ (new DateTime($alert->created_at))->format('d.m.Y H:i:s') }}
                            </div>
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </div>
@endsection

@section('back_button')
    <a href="{{ route('home') }}" class="grey-button">Zurück</a>
@endsection