math_cms/resources/views/filament/resources/pre-question-candidate-resource/pages/list-pre-question-candidates.blade.php

<div class="ui-page">
    <div class="mx-auto flex max-w-7xl flex-col gap-6 px-4 py-8">
        @include('filament.partials.page-header', [
            'kicker' => 'Markdown 导入',
            'title' => 'Step 2 · 结构识别与预览',
            'subtitle' => '左侧查看卷子结构，右侧进行题目校对与批量入库。',
            'actions' => view('filament.partials.density-toggle') . view('filament.partials.quick-links'),
        ])

        <div class="grid grid-cols-1 gap-4 md:grid-cols-3 xl:grid-cols-5">
            <div class="ui-stat">
                <div class="ui-stat-label">总题数</div>
                <div class="ui-stat-value">{{ $this->summaryStats['total'] ?? 0 }}</div>
            </div>
            <div class="ui-stat">
                <div class="ui-stat-label">待审核</div>
                <div class="ui-stat-value text-amber-600">{{ $this->summaryStats['pending'] ?? 0 }}</div>
            </div>
            <div class="ui-stat">
                <div class="ui-stat-label">已审核</div>
                <div class="ui-stat-value text-blue-600">{{ $this->summaryStats['reviewed'] ?? 0 }}</div>
            </div>
            <div class="ui-stat">
                <div class="ui-stat-label">已接受</div>
                <div class="ui-stat-value text-emerald-600">{{ $this->summaryStats['accepted'] ?? 0 }}</div>
            </div>
            <div class="ui-stat">
                <div class="ui-stat-label">已拒绝</div>
                <div class="ui-stat-value text-rose-600">{{ $this->summaryStats['rejected'] ?? 0 }}</div>
            </div>
        </div>

        <div class="grid grid-cols-1 gap-6 lg:grid-cols-12">
            <div class="lg:col-span-4 space-y-6">
                <div class="ui-card">
                    <div class="ui-card-header">
                        <div>
                            <div class="ui-section-title">卷子结构</div>
                            <div class="ui-subtitle">source_papers → paper_parts</div>
                        </div>
                    </div>
                    <div class="ui-card-body space-y-4">
                        @forelse($this->paperTree as $paper)
                            <div class="rounded-xl border border-slate-200 bg-slate-50 px-4 py-3">
                                <div class="text-sm font-semibold text-slate-900">{{ $paper['title'] }}</div>
                                <div class="mt-2 space-y-2">
                                    @foreach($paper['parts'] ?? [] as $part)
                                        <div class="flex items-center justify-between rounded-lg border border-slate-200 bg-white px-3 py-2 text-sm">
                                            <span class="text-slate-700">{{ $part['title'] }}</span>
                                            <span class="ui-badge-muted">{{ $part['count'] }} 题</span>
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                        @empty
                            @include('filament.partials.empty-state', [
                                'title' => '暂无解析结构',
                                'description' => '请先完成 Markdown 解析流程。',
                            ])
                        @endforelse
                    </div>
                </div>

                <div class="ui-card">
                    <div class="ui-card-header">
                        <div>
                            <div class="ui-section-title">Step 3 · 审核入库</div>
                            <div class="ui-subtitle">使用批量操作提交入库</div>
                        </div>
                    </div>
                    <div class="ui-card-body text-sm text-slate-500">
                        选中候选题后，使用批量操作「入库到筛选库」完成审核流程。
                    </div>
                </div>
            </div>

            <div class="lg:col-span-8">
                <div class="ui-card">
                    <div class="ui-card-header">
                        <div>
                            <div class="ui-section-title">题目预览与校对</div>
                            <div class="ui-subtitle">右侧支持编辑与状态标记</div>
                        </div>
                        <div class="ui-badge-muted">支持批量操作</div>
                    </div>
                    <div class="ui-card-body">
                        {{ $this->table }}
                    </div>
                </div>
            </div>
        </div>
    </div>
    @include('filament.partials.loading-overlay')
</div>
@push('scripts')
<script>
    document.addEventListener('DOMContentLoaded', () => {
        const params = new URLSearchParams(window.location.search);
        const importId = params.get('import_id') || '';
        const source = new EventSource(`/admin/markdown-imports/stream?type=pre-question-candidates&import_id=${importId}`);
        let refreshTimer = null;

        const refreshLivewire = () => {
            if (refreshTimer) return;
            refreshTimer = setTimeout(() => {
                refreshTimer = null;
            }, 800);

            if (!window.Livewire || !Livewire.find) {
                return;
            }

            document.querySelectorAll('[wire\\:id]').forEach((el) => {
                const id = el.getAttribute('wire:id');
                const component = id ? Livewire.find(id) : null;
                if (component && typeof component.$refresh === 'function') {
                    component.$refresh();
                }
            });
        };

        source.addEventListener('update', (event) => {
            try {
                JSON.parse(event.data || '{}');
            } catch (e) {
                return;
            }
            refreshLivewire();
        });

        window.addEventListener('beforeunload', () => source.close());
    });
</script>
@endpush