math_cms/resources/views/filament/pages/exam-history.blade.php

<x-filament-panels::page>
    @push('styles')
        <style>
            .exam-card {
                transition: all 0.3s ease;
            }
            .exam-card:hover {
                transform: translateY(-2px);
                box-shadow: 0 8px 20px rgba(0,0,0,0.12);
            }
            .status-badge {
                display: inline-block;
                padding: 4px 12px;
                border-radius: 12px;
                font-size: 12px;
                font-weight: 500;
            }
        </style>
    @endpush

    <div class="space-y-6">
        <!-- 页面标题 -->
        <div class="flex justify-between items-center">
            <div>
                <h2 class="text-2xl font-bold text-gray-900">卷子历史记录</h2>
                <p class="mt-1 text-sm text-gray-500">
                    查看所有历史生成的试卷，支持导出、复制和删除操作
                </p>
            </div>
        </div>

        <!-- 筛选器 -->
        <x-filament::card>
            <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
                <input
                    wire:model.live="search"
                    placeholder="搜索试卷名称..."
                    icon="heroicon-m-magnifying-glass"
                />

                <select
                    wire:model.live="statusFilter"
                    placeholder="筛选状态"
                >
                    <option value="">-- 全部状态 --</option>
                    <option value="draft">草稿</option>
                    <option value="completed">已完成</option>
                    <option value="graded">已评分</option>
                /select>

                <select
                    wire:model.live="difficultyFilter"
                    placeholder="筛选难度"
                >
                    <option value="">-- 全部难度 --</option>
                    <option value="基础">基础</option>
                    <option value="进阶">进阶</option>
                    <option value="竞赛">竞赛</option>
                /select>

                button
                    color="gray"
                    wire:click="reset"
                >
                    <x-heroicon-m-arrow-path class="w-5 h-5 mr-2" />
                    重置
                /button>
            </div>
        </x-filament::card>

        <!-- 试卷列表 -->
        <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
            <!-- 左侧：试卷列表 -->
            <div class="lg:col-span-2 space-y-4">
                @if(count($this->exams()['data']) > 0)
                    @foreach($this->exams()['data'] as $exam)
                        <x-filament::card class="exam-card cursor-pointer" wire:click="viewExamDetail('{{ $exam['paper_id'] }}')">
                            <div class="flex items-start justify-between">
                                <div class="flex-1">
                                    <div class="flex items-center gap-3 mb-2">
                                        <h3 class="text-lg font-semibold text-gray-900">{{ $exam['paper_name'] }}</h3>
                                        <span class="status-badge" style="background: {{ getStatusColor($exam['status']) }}20; color: {{ getStatusColor($exam['status']) }};">
                                            {{ getStatusLabel($exam['status']) }}
                                        </span>
                                    </div>

                                    <div class="grid grid-cols-3 gap-4 text-sm text-gray-600">
                                        <div>
                                            <span class="text-gray-500">题目数量：</span>
                                            <span class="font-medium">{{ $exam['question_count'] }} 题</span>
                                        </div>
                                        <div>
                                            <span class="text-gray-500">总分：</span>
                                            <span class="font-medium">{{ $exam['total_score'] }} 分</span>
                                        </div>
                                        <div>
                                            <span class="text-gray-500">难度：</span>
                                            <span class="px-2 py-0.5 rounded text-white text-xs" style="background: {{ getDifficultyColor($exam['difficulty_category']) }};">
                                                {{ $exam['difficulty_category'] }}
                                            </span>
                                        </div>
                                    </div>

                                    <div class="mt-3 text-xs text-gray-500">
                                        <span>创建时间：{{ \Carbon\Carbon::parse($exam['created_at'])->format('Y-m-d H:i') }}</span>
                                    </div>
                                </div>

                                <div class="flex flex-col gap-2 ml-4">
                                    button
                                        color="primary"
                                        size="sm"
                                        wire:click.stop="exportPdf('{{ $exam['paper_id'] }}')"
                                    >
                                        <x-heroicon-m-arrow-down-tray class="w-4 h-4 mr-1" />
                                        导出
                                    /button>
                                    button
                                        color="gray"
                                        size="sm"
                                        wire:click.stop="duplicateExam({{ json_encode($exam) }})"
                                    >
                                        <x-heroicon-m-document-duplicate class="w-4 h-4 mr-1" />
                                        复制
                                    /button>
                                </div>
                            </div>
                        </x-filament::card>
                    @endforeach

                    <!-- 分页 -->
                    <div class="mt-6">
                        {{ $this->meta()['total'] }} 条记录，共 {{ $this->meta()['total_pages'] }} 页
                        <div class="mt-4 flex justify-center">
                            <div class="flex gap-2">
                                @if($currentPage > 1)
                                    button
                                        color="gray"
                                        size="sm"
                                        wire:click="$set('currentPage', {{ $currentPage - 1 }})"
                                    >
                                        上一页
                                    /button>
                                @endif

                                <span class="px-4 py-2 text-sm text-gray-600">
                                    第 {{ $currentPage }} 页
                                </span>

                                @if($currentPage < $this->meta()['total_pages'])
                                    button
                                        color="gray"
                                        size="sm"
                                        wire:click="$set('currentPage', {{ $currentPage + 1 }})"
                                    >
                                        下一页
                                    /button>
                                @endif
                            </div>
                        </div>
                    </div>
                @else
                    <x-filament::card class="text-center py-12">
                        <x-heroicon-o-document-duplicate class="w-16 h-16 text-gray-400 mx-auto mb-4" />
                        <div class="text-lg font-medium text-gray-900 mb-2">暂无试卷记录</div>
                        <div class="text-sm text-gray-500 mb-4">
                            请前往"智能出卷"页面生成您的第一份试卷
                        </div>
                        button
                            color="primary"
                            wire:click="$dispatch('navigateToIntelligentExam')"
                        >
                            <x-heroicon-m-sparkles class="w-5 h-5 mr-2" />
                            去出卷
                        /button>
                    </x-filament::card>
                @endif
            </div>

            <!-- 右侧：试卷详情 -->
            <div class="lg:col-span-1">
                @if($selectedExamId && !empty($selectedExamDetail))
                    <x-filament::card sticky>
                        <x-slot name="header">
                            <div class="flex items-center justify-between">
                                <h3 class="text-lg font-semibold text-gray-900">试卷详情</h3>
                                button
                                    color="gray"
                                    size="sm"
                                    wire:click="$set('selectedExamId', null)"
                                >
                                    <x-heroicon-o-x-mark class="w-4 h-4" />
                                /button>
                            </div>
                        </x-slot>

                        <div class="space-y-4">
                            <div>
                                <div class="text-sm text-gray-500">试卷名称</div>
                                <div class="font-medium text-gray-900">{{ $selectedExamDetail['paper']['paper_name'] ?? '' }}</div>
                            </div>

                            <div class="grid grid-cols-2 gap-4">
                                <div>
                                    <div class="text-sm text-gray-500">题目数量</div>
                                    <div class="font-medium text-gray-900">{{ $selectedExamDetail['paper']['question_count'] ?? 0 }} 题</div>
                                </div>
                                <div>
                                    <div class="text-sm text-gray-500">总分</div>
                                    <div class="font-medium text-gray-900">{{ $selectedExamDetail['paper']['total_score'] ?? 0 }} 分</div>
                                </div>
                            </div>

                            <div>
                                <div class="text-sm text-gray-500">难度分类</div>
                                <div class="mt-1">
                                    <span class="px-2 py-0.5 rounded text-white text-xs" style="background: {{ getDifficultyColor($selectedExamDetail['paper']['difficulty_category'] ?? '') }};">
                                        {{ $selectedExamDetail['paper']['difficulty_category'] ?? '' }}
                                    </span>
                                </div>
                            </div>

                            <div>
                                <div class="text-sm text-gray-500">创建时间</div>
                                <div class="font-medium text-gray-900">
                                    {{ \Carbon\Carbon::parse($selectedExamDetail['paper']['created_at'])->format('Y-m-d H:i') }}
                                </div>
                            </div>

                            <div>
                                <div class="text-sm text-gray-500 mb-2">题目列表</div>
                                <div class="space-y-2 max-h-64 overflow-y-auto">
                                    @foreach($selectedExamDetail['questions'] ?? [] as $idx => $question)
                                        <div class="p-2 bg-gray-50 rounded text-sm">
                                            <div class="font-medium text-gray-900">{{ $idx + 1 }}. {{ Str::limit($question['stem'] ?? '', 50) }}</div>
                                            <div class="text-xs text-gray-600 mt-1">
                                                {{ $question['knowledge_point'] ?? '' }} |
                                                难度: {{ $question['difficulty'] ?? 0 }}
                                            </div>
                                        </div>
                                    @endforeach
                                </div>
                            </div>

                            <div class="pt-4 border-t space-y-2">
                                button
                                    color="primary"
                                    class="w-full"
                                    wire:click="exportPdf('{{ $selectedExamId }}')"
                                >
                                    <x-heroicon-m-arrow-down-tray class="w-4 h-4 mr-2" />
                                    导出PDF
                                /button>

                                button
                                    color="gray"
                                    class="w-full"
                                    wire:click="duplicateExam({{ json_encode($selectedExamDetail['paper']) }})"
                                >
                                    <x-heroicon-m-document-duplicate class="w-4 h-4 mr-2" />
                                    复制试卷配置
                                /button>

                                button
                                    color="danger"
                                    class="w-full"
                                    wire:click="deleteExam('{{ $selectedExamId }}')"
                                >
                                    <x-heroicon-m-trash class="w-4 h-4 mr-2" />
                                    删除试卷
                                /button>
                            </div>
                        </div>
                    </x-filament::card>
                @else
                    <x-filament::card class="text-center py-12">
                        <x-heroicon-o-information-circle class="w-12 h-12 text-gray-400 mx-auto mb-3" />
                        <div class="text-sm text-gray-600">
                            点击左侧试卷查看详情
                        </div>
                    </x-filament::card>
                @endif
            </div>
        </div>
    </div>
</x-filament-pages::page>