@extends('layouts.site')

@section('page_class', 'page-news')
@section('title', 'AI 资讯 - AIWeb')
@section('meta_description', '追踪 AI 行业动态、模型发布与产品更新，快速获取高价值信息。')
@section('canonical', route('news.index'))

@section('content')
<section class="module-hero">
    <div class="position-relative">
        <span class="hero-chip"><i class="bi bi-newspaper"></i> 资讯聚合</span>
        <h1 class="h2 fw-bold mt-2">AI 行业资讯追踪</h1>
        <p class="hero-subtext">聚合官方、媒体和社区动态，按时间线与可信度快速筛选。</p>
    </div>
</section>

<div class="module-grid">
    <div>
        <section class="block-card p-3 p-lg-4 mb-3">
            <form method="get" action="{{ route('news.index') }}" class="row g-2 align-items-end">
                <div class="col-md-8">
                    <label class="form-label" for="newsSearchKeyword">关键词</label>
                    <input id="newsSearchKeyword" class="form-control" type="search" name="q" value="{{ $filters['q'] ?? '' }}" placeholder="例如：发布会、融资、开源…" aria-label="按关键词搜索资讯" autocomplete="off" spellcheck="false">
                </div>
                <div class="col-md-3">
                    <label class="form-label" for="newsCategorySelect">分类</label>
                    <select id="newsCategorySelect" class="form-select" name="category">
                        <option value="">全部分类</option>
                        @foreach($categories as $category)
                            <option value="{{ $category->slug }}" @selected(($filters['category'] ?? '') === $category->slug)>{{ $category->name }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-1 d-grid">
                    <button class="btn btn-primary" type="submit" aria-label="筛选资讯"><i class="bi bi-search me-1" aria-hidden="true"></i>筛选</button>
                </div>
            </form>
        </section>

        <section class="block-card p-3 p-lg-4">
            @forelse($items as $article)
                <article class="entry-item mb-3 mb-lg-2 d-flex gap-3">
                    <div class="d-none d-md-block text-center" style="min-width:78px;">
                        <div class="fw-semibold">{{ $article->published_at?->format('m-d') ?? '--' }}</div>
                        <div class="small text-muted-soft">{{ $article->published_at?->format('H:i') ?? '' }}</div>
                    </div>
                    <div class="flex-grow-1 min-w-0">
                        <div class="d-flex flex-wrap gap-2 mb-1">
                            <span class="chip">{{ $article->source_level?->label() ?? '来源未知' }}</span>
                            @if($article->is_stale)
                                <span class="chip">可能过期</span>
                            @endif
                        </div>
                        <a class="h5 text-decoration-none mb-1 d-inline-block" href="{{ route('news.show', $article->slug) }}">{{ $article->title }}</a>
                        <p class="text-muted-soft mb-0 line-clamp-2">{{ $article->excerpt }}</p>
                    </div>
                </article>
            @empty
                <p class="text-muted-soft mb-0">暂无资讯数据</p>
            @endforelse

            <div class="mt-3">{{ $items->links() }}</div>
        </section>
    </div>

    <aside>
        <section class="block-card p-3 mb-3">
            <h3 class="section-title mb-3">热门模型榜</h3>
            @forelse($sidebarModels as $model)
                <article class="pb-2 mb-2 border-bottom" style="border-color:var(--line)!important;">
                    <a class="fw-semibold text-decoration-none" href="{{ route('models.show', $model->slug) }}">{{ $model->name }}</a>
                    <div class="small text-muted-soft">综合 {{ $model->total_score }} 分</div>
                </article>
            @empty
                <p class="text-muted-soft small mb-0">暂无数据</p>
            @endforelse
        </section>

        <section class="block-card p-3">
            <h3 class="section-title mb-3">推荐教程</h3>
            @forelse($sidebarGuides as $guide)
                <article class="pb-2 mb-2 border-bottom" style="border-color:var(--line)!important;">
                    <a class="fw-semibold text-decoration-none" href="{{ route('guides.show', $guide->slug) }}">{{ $guide->title }}</a>
                    <div class="small text-muted-soft">{{ $guide->difficulty }}</div>
                </article>
            @empty
                <p class="text-muted-soft small mb-0">暂无教程</p>
            @endforelse
        </section>
    </aside>
</div>
@endsection