@extends('layouts.app')

@php
    $viewMode = request('view', 'grid');
    $pricingOptions = [
        '' => '全部收费类型',
        'free' => '免费',
        'paid' => '付费',
        'subscription' => '订阅',
        'trial' => '试用',
    ];
@endphp

@section('content')
<div class="page-header">
    <h1>{{ $category->name }}</h1>
    <p>{{ $category->description }}</p>
</div>

<form class="filter-bar" method="get">
    <input type="hidden" name="view" value="{{ $viewMode }}">
    <select name="tag">
        <option value="">全部标签</option>
        @foreach($tags as $tag)
            <option value="{{ $tag->slug }}" @selected($tagSlug === $tag->slug)>{{ $tag->name }}</option>
        @endforeach
    </select>
    <select name="pricing">
        @foreach($pricingOptions as $value => $label)
            <option value="{{ $value }}" @selected($pricing === $value)>{{ $label }}</option>
        @endforeach
    </select>
    <button type="submit" class="primary-button">筛选</button>
</form>

<div class="view-toggle">
    <a href="{{ request()->fullUrlWithQuery(['view' => 'grid']) }}" class="{{ $viewMode === 'grid' ? 'active' : '' }}">网格</a>
    <a href="{{ request()->fullUrlWithQuery(['view' => 'list']) }}" class="{{ $viewMode === 'list' ? 'active' : '' }}">列表</a>
</div>

@if($products->total() > $moreThreshold)
    <div class="more-panel">
        <span>该分类内容较多</span>
        <a href="{{ $products->nextPageUrl() ?? $products->url(1) }}" class="more-link">查看更多</a>
    </div>
@endif

@if($viewMode === 'list')
    <div class="article-list">
        @forelse($products as $product)
            <a class="article-item" href="{{ route('products.show', $product->slug) }}">
                <div class="article-title">{{ $product->name }}</div>
                <div class="article-summary">{{ $product->summary }}</div>
            </a>
        @empty
            <div class="empty">暂无产品</div>
        @endforelse
    </div>
@else
    <div class="product-grid">
        @forelse($products as $product)
            @include('partials.product-card', ['product' => $product])
        @empty
            <div class="empty">暂无产品</div>
        @endforelse
    </div>
@endif

<div class="pagination">
    {{ $products->links() }}
</div>
@endsection