@extends('layouts.app')

@section('title', _lang('Home-screen Notices'))

@section('content')
    <div class="d-md-flex d-block align-items-center justify-content-between my-4 page-header-breadcrumb">
        <div>
            <h4 class="mb-0">{{ _lang('Home-screen Notices') }}</h4>
            <p class="mb-0 text-muted">{{ _lang('Broadcast a banner to every owner\'s app home screen.') }}</p>
        </div>
    </div>

    @include('partials.alerts')

    <div class="row">
        <div class="col-xl-4">
            <div class="card custom-card">
                <div class="card-header"><div class="card-title">{{ _lang('Publish Notice') }}</div></div>
                <div class="card-body">
                    <form action="{{ route('admin.notices.store') }}" method="POST">
                        @csrf
                        <div class="mb-2">
                            <label class="form-label">{{ _lang('Title') }}</label>
                            <input type="text" name="title" class="form-control" maxlength="200" required value="{{ old('title') }}">
                        </div>
                        <div class="mb-2">
                            <label class="form-label">{{ _lang('Message') }}</label>
                            <textarea name="body" class="form-control" rows="4" maxlength="5000" required>{{ old('body') }}</textarea>
                        </div>
                        <div class="mb-2">
                            <label class="form-label">{{ _lang('Banner colour') }}</label>
                            <select name="banner_color" class="form-select">
                                <option value="green">{{ _lang('Green') }}</option>
                                <option value="blue">{{ _lang('Blue') }}</option>
                                <option value="amber">{{ _lang('Amber') }}</option>
                                <option value="red">{{ _lang('Red') }}</option>
                            </select>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">{{ _lang('Link URL (optional)') }}</label>
                            <input type="url" name="link_url" class="form-control" maxlength="500" placeholder="https://…" value="{{ old('link_url') }}">
                        </div>
                        <button class="btn btn-primary w-100"><i class="bi bi-megaphone"></i> {{ _lang('Publish') }}</button>
                    </form>
                </div>
            </div>
        </div>

        <div class="col-xl-8">
            <div class="card custom-card">
                <div class="card-header"><div class="card-title">{{ _lang('All Notices') }}</div></div>
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table text-nowrap table-hover">
                            <thead>
                                <tr>
                                    <th>{{ _lang('Notice') }}</th>
                                    <th>{{ _lang('Reads') }}</th>
                                    <th>{{ _lang('Status') }}</th>
                                    <th>{{ _lang('Created') }}</th>
                                    <th></th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($notices as $notice)
                                    <tr>
                                        <td>
                                            <span class="fw-semibold">{{ $notice->title }}</span>
                                            <small class="d-block text-muted text-truncate" style="max-width:320px;">{{ $notice->body }}</small>
                                        </td>
                                        <td>{{ $notice->reads_count }}</td>
                                        <td>
                                            <span class="badge {{ $notice->active ? 'bg-success-transparent' : 'bg-secondary-transparent' }}">
                                                {{ $notice->active ? _lang('Active') : _lang('Off') }}
                                            </span>
                                        </td>
                                        <td class="text-muted">{{ $notice->created_at?->format('d M Y') }}</td>
                                        <td class="text-end">
                                            <form action="{{ route('admin.notices.toggle', $notice) }}" method="POST" class="d-inline">@csrf
                                                <button class="btn btn-sm btn-primary-light" title="{{ _lang('Toggle') }}"><i class="bi bi-power"></i></button>
                                            </form>
                                            <form action="{{ route('admin.notices.destroy', $notice) }}" method="POST" class="d-inline" onsubmit="return confirm('{{ _lang('Delete this notice?') }}')">@csrf @method('DELETE')
                                                <button class="btn btn-sm btn-danger-light" title="{{ _lang('Delete') }}"><i class="bi bi-trash"></i></button>
                                            </form>
                                        </td>
                                    </tr>
                                @empty
                                    <tr><td colspan="5" class="text-center text-muted py-4">{{ _lang('No notices yet.') }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
                @if ($notices->hasPages())
                    <div class="card-footer">{{ $notices->links() }}</div>
                @endif
            </div>
        </div>
    </div>
@endsection