math_cms/resources/views/filament/pages/question-review.blade.php

<x-filament::page>
    @php
        $mineruBlocks = $mineru['blocks'] ?? [];
        $builderQuestions = $builder['questions'] ?? [];
    @endphp

    <div class="space-y-4">
        <x-filament::section>
            {{ $this->form }}
            @if($message)
                <div class="text-sm text-gray-600 mt-2">{{ $message }}</div>
            @endif
        </x-filament::section>

        <x-filament::section key="page-{{ $book }}-{{ $page }}">
            <div class="grid grid-cols-1 lg:grid-cols-2 gap-4 items-start">
                <div class="space-y-2 sticky top-4">
                    <div class="flex items-center justify-between">
                        <div>
                            <h3 class="text-lg font-semibold">整页预览 (page {{ $page }})</h3>
                            @if(!empty($paths))
                                <div class="text-[11px] text-gray-500">builder: {{ $paths['builder_page'] ?? '' }}</div>
                            @endif
                        </div>
                        <div class="text-xs text-gray-500">点击页码自动加载</div>
                    </div>
                    @if(!empty($pagePngBase64))
                        @php
                            $width = $mineru['width'] ?? 0;
                            $height = $mineru['height'] ?? 0;
                            $targetHeight = 820;
                            $scale = ($height > 0) ? ($targetHeight / $height) : 0.28;
                            $showWidth = $width ? $width * $scale : 520;
                            $showHeight = $targetHeight;
                        @endphp
                        <div class="relative border rounded overflow-hidden bg-gray-100" style="max-width: 100%; height: {{ $showHeight }}px; width: {{ $showWidth }}px;">
                            <img loading="lazy" src="data:image/png;base64,{{ $pagePngBase64 }}" style="height: 100%; width: auto; max-width: 100%; object-fit: contain;" />
                            @if($showOverlay)
                                @foreach($mineruBlocks as $b)
                                    @php
                                        $bbox = $b['bbox'] ?? [0,0,0,0];
                                        $x = $bbox[0] * $scale; $y = $bbox[1] * $scale;
                                        $w = ($bbox[2]-$bbox[0]) * $scale; $h = ($bbox[3]-$bbox[1]) * $scale;
                                        if ($w < 4 && $h < 4) continue;
                                        $color = 'rgba(59,130,246,0.25)';
                                        $type = strtolower($b['type'] ?? 'text');
                                        if($type === 'figure') $color = 'rgba(16,185,129,0.25)';
                                        if($type === 'table') $color = 'rgba(234,179,8,0.25)';
                                        if($type === 'formula') $color = 'rgba(239,68,68,0.25)';
                                    @endphp
                                    <div class="absolute border border-blue-500"
                                         style="pointer-events: none; left: {{ $x }}px; top: {{ $y }}px; width: {{ $w }}px; height: {{ $h }}px; background: {{ $color }};"
                                         title="{{ $b['type'] ?? '' }}">
                                    </div>
                                @endforeach
                            @endif
                        </div>
                    @else
                        <div class="text-sm text-gray-500">无页面图片</div>
                    @endif
                </div>

                <div class="space-y-2">
                    <h3 class="text-lg font-semibold">生成题目（{{ count($builderQuestions) }}）</h3>
                    <div class="h-[820px] overflow-auto text-sm bg-gray-50 rounded p-3 space-y-3">
                        @foreach($builderQuestions as $idx => $q)
                            <div class="border border-gray-200 rounded p-2 space-y-2">
                                <div class="flex items-center justify-between">
                                    <div class="font-semibold">Q{{ $q['index'] ?? ($idx+1) }} ({{ $q['type'] ?? '' }})</div>
                                    <div class="flex items-center gap-2">
                                        @if(!empty($q['qa_flags']))
                                            <span class="text-xs text-amber-600">QA: {{ implode(',', $q['qa_flags']) }}</span>
                                        @endif
                                        <x-filament::button wire:click="saveQuestion({{ $idx }})" color="success" size="sm">加入草稿</x-filament::button>
                                    </div>
                                </div>
                                <div class="text-gray-800 text-sm">{{ $q['stem'] ?? '' }}</div>
                                @if(!empty($q['options']))
                                    <div class="text-xs text-gray-700 space-y-1">
                                        @foreach($q['options'] as $k=>$v)
                                            <div>{{ $k }}. {{ $v }}</div>
                                        @endforeach
                                    </div>
                                @endif
                                @if(!empty($q['images']))
                                    <div class="flex flex-wrap gap-2">
                                        @foreach($q['images'] as $img)
                                            <div class="border rounded bg-white p-1 text-xs text-blue-700">
                                                {{ $img['path'] ?? 'img' }}
                                            </div>
                                        @endforeach
                                    </div>
                                @endif
                                <div class="text-[11px] text-gray-500">
                                    raw_blocks: {{ isset($q['raw_blocks']) ? json_encode($q['raw_blocks']) : '' }}
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </x-filament::section>

        @if($mineruBlocks)
            <x-filament::section>
                <details>
                    <summary class="cursor-pointer font-semibold">MinerU Blocks（{{ count($mineruBlocks) }}）点击展开</summary>
                    <div class="mt-2 max-h-[360px] overflow-auto text-xs bg-gray-50 rounded p-3 space-y-2">
                        @foreach($mineruBlocks as $b)
                            <div class="border border-gray-200 rounded p-2">
                                <div class="font-semibold">{{ $b['type'] ?? 'text' }} / cat: {{ $b['category_id'] ?? '' }}</div>
                                <div class="text-gray-600">bbox: {{ json_encode($b['bbox'] ?? []) }}</div>
                                <div class="text-gray-600 truncate">text: {{ $b['text'] ?? ($b['content'] ?? '') }}</div>
                            </div>
                        @endforeach
                    </div>
                </details>
            </x-filament::section>
        @endif

        @if($builder)
            <x-filament::section>
                <h3 class="text-lg font-semibold mb-2">整页题目 JSON（编辑后可“保存到草稿”）</h3>
                <textarea wire:model.defer="builderJson" class="w-full h-[720px] min-h-[720px] text-xs font-mono border rounded p-2 resize-y">{{ $builderJson }}</textarea>
            </x-filament::section>
        @endif
    </div>
</x-filament::page>