math_cms/resources/views/filament/pages/upload-exam-paper.blade.php.backup

<x-filament-panels::page>

<div class="space-y-6">
    {{-- 模式选择 --}}
    <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-4">
        <div class="flex gap-4">
            <button
                wire:click="$set('mode', 'upload')"
                class="px-4 py-2 rounded-md font-medium transition-colors {{ $mode === 'upload' ? 'bg-blue-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200' }}"
            >
                <svg class="w-5 h-5 inline-block mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003 3v-1m-4-8l-4-4m0 0L8 8m4-4v12"></path>
                </svg>
                上传试卷照片
            </button>
            <button
                wire:click="$set('mode', 'select_paper')"
                class="px-4 py-2 rounded-md font-medium transition-colors {{ $mode === 'select_paper' ? 'bg-blue-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200' }}"
            >
                <svg class="w-5 h-5 inline-block mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.707.293V19a2 2 0 012-2H5a2 2 0 01-2 2v-14z"></path>
                </svg>
                选择已有试卷评分
            </button>
        </div>
    </div>

    {{-- 上传模式 --}}
    @if($mode === 'upload')
        {{-- 选择老师和学生 --}}
        <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6 mb-6">
            <h2 class="text-lg font-semibold mb-4 flex items-center">
                <svg class="w-5 h-5 mr-2 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path>
                </svg>
                选择老师和学生
            </h2>
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                {{-- 选择老师 --}}
                <div class="form-control w-full">
                    <label class="block text-sm font-medium text-gray-700 mb-2">
                        选择老师 <span class="text-red-500">*</span>
                        @if($isTeacher)
                            <span class="text-green-600 text-xs ml-2">(当前登录)</span>
                        @endif
                    </label>
                    <select
                        wire:model.live="teacherId"
                        @if($isTeacher) disabled @endif
                        class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 @if($isTeacher) bg-gray-100 @endif"
                    >
                        <option value="">请选择老师...</option>
                        @foreach($this->teachers as $teacher)
                            <option value="{{ $teacher->teacher_id }}">
                                {{ trim($teacher->name ?? $teacher->teacher_id) . ($teacher->subject ? " ({$teacher->subject})" : '') }}
                            </option>
                        @endforeach
                    </select>
                </div>

                {{-- 选择学生 --}}
                <div class="form-control w-full">
                    <label class="block text-sm font-medium text-gray-700 mb-2">选择学生 <span class="text-red-500">*</span></label>
                    <select
                        wire:model.live="studentId"
                        wire:loading.attr="disabled"
                        @if(empty($teacherId)) disabled @endif
                        class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 @if(empty($teacherId)) bg-gray-100 @endif"
                    >
                        <option value="">
                            @if(empty($teacherId))
                                请先选择老师
                            @else
                                请选择学生...
                            @endif
                        </option>
                        @foreach($this->students as $student)
                            <option value="{{ $student->student_id }}">
                                {{ trim($student->name ?? $student->student_id) . " ({$student->grade} - {$student->class_name})" }}
                            </option>
                        @endforeach
                    </select>
                </div>
            </div>
        </div>

        {{-- 图片上传和OCR识别组件 --}}
        @if(!empty($teacherId) && !empty($studentId))
            <livewire:upload-exam.upload-form :teacherId="$teacherId" :studentId="$studentId" />
            <livewire:upload-exam.ocr-results />
        @endif

            <div class="mt-6">
                <button
                    type="button"
                    wire:click="startAnalysis"
                    wire:loading.attr="disabled"
                    class="bg-blue-600 text-white px-6 py-2 rounded-md hover:bg-blue-700 disabled:opacity-50 transition-colors"
                >
                    <span wire:loading wire:target="startAnalysis" class="inline-block mr-2">
                        <svg class="animate-spin h-5 w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
                            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
                            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018 8 0 018 0v4a8 8 0 018-8h4a8 8 0 018-8v-8a8 8 0 018-8-4-4-4-4-4-4-4zm-2 4a6 6 0 016-6h4a6 6 0 016-6v8a6 6 0 016-6-4-4-4-4-4-4-4z"></path>
                        </svg>
                    </span>
                    <span wire:loading.remove wire:target="startAnalysis">开始分析</span>
                    <span wire:loading wire:target="startAnalysis">分析中...</span>
                </button>
            </div>

            @if($analyzing)
                <div class="mt-4 bg-blue-50 border border-blue-200 rounded-lg p-4">
                    <div class="flex items-center">
                        <svg class="animate-spin h-5 w-5 text-blue-600 mr-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
                            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
                            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018 8 0 018 0v4a8 8 0 018-8h4a8 8 0 018-8v8a8 8 0 018-8-4-4-4-4-4-4-4z"></path>
                        </svg>
                        <span class="text-blue-800">正在分析试卷，请稍候...</span>
                    </div>
                </div>
            @endif

            @if($analysisError)
                <div class="mt-4 bg-red-50 border border-red-200 rounded-lg p-4">
                    <div class="flex items-center">
                        <svg class="h-5 w-5 text-red-600 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 011-18 0z"></path>
                        </svg>
                        <span class="text-red-800">{{ $analysisError }}</span>
                    </div>
                </div>
            @endif
        </div>
    @endif

    {{-- 选择试卷评分模式 --}}
    @if($mode === 'select_paper')
        <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
            <h2 class="text-xl font-semibold mb-6 flex items-center">
                <svg class="w-6 h-6 mr-2 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.707.293V19a2 2 0 012-2H5a2 2 0 01-2 2v-14z"></path>
                </svg>
                选择已有试卷评分
            </h2>

            {{-- 选择老师和学生 --}}
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                {{-- 选择老师 --}}
                <div class="form-control w-full">
                    <label class="block text-sm font-medium text-gray-700 mb-2">
                        选择老师 <span class="text-red-500">*</span>
                        @if($isTeacher)
                            <span class="text-green-600 text-xs ml-2">(当前登录)</span>
                        @endif
                    </label>
                    <select
                        wire:model.live="teacherId"
                        @if($isTeacher) disabled @endif
                        class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 @if($isTeacher) bg-gray-100 @endif"
                    >
                        <option value="">请选择老师...</option>
                        @foreach($this->teachers as $teacher)
                            <option value="{{ $teacher->teacher_id }}">
                                {{ trim($teacher->name ?? $teacher->teacher_id) . ($teacher->subject ? " ({$teacher->subject})" : '') }}
                            </option>
                        @endforeach
                    </select>
                </div>

                {{-- 选择学生 --}}
                <div class="form-control w-full">
                    <label class="block text-sm font-medium text-gray-700 mb-2">选择学生 <span class="text-red-500">*</span></label>
                    <select
                        wire:model.live="studentId"
                        wire:loading.attr="disabled"
                        @if(empty($teacherId)) disabled @endif
                        class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
                    >
                        <option value="">
                            @if(empty($teacherId))
                                请先选择老师
                            @else
                                请选择学生...
                            @endif
                        </option>
                        @foreach($this->students as $student)
                            <option value="{{ $student->student_id }}">
                                {{ trim($student->name ?? $student->student_id) . " ({$student->grade} - {$student->class_name})" }}
                            </option>
                        @endforeach
                    </select>
                </div>
            </div>

            {{-- 选择试卷 --}}
            @if(!empty($studentId))
                <div class="form-control w-full mt-6">
                    <label class="block text-sm font-medium text-gray-700 mb-2">选择试卷 <span class="text-red-500">*</span></label>
                    <select
                        wire:model.live="selectedPaperId"
                        class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
                    >
                        <option value="">请选择试卷...</option>
                        @foreach($this->studentPapers as $paper)
                            <option value="{{ $paper['paper_id'] }}">
                                {{ $paper['paper_name'] }} ({{ $paper['total_questions'] }}题 / {{ $paper['total_score'] }}分) - {{ $paper['created_at'] }}
                            </option>
                        @endforeach
                    </select>
                </div>
            @endif

            {{-- 评分界面 --}}
            @if($showGrading && count($questions) > 0)
                <div class="mt-6">
                    {{-- 试卷信息 --}}
                    <div class="bg-gray-50 rounded-lg p-4 mb-6">
                        <div class="grid grid-cols-1 md:grid-cols-4 gap-4 text-sm">
                            <div>
                                <span class="font-medium">试卷名称:</span> {{ $paperName }}
                            </div>
                            <div>
                                <span class="font-medium">班级:</span> {{ $paperClass }}
                            </div>
                            <div>
                                <span class="font-medium">学生:</span> {{ $paperStudent }}
                            </div>
                            <div>
                                <span class="font-medium">日期:</span> {{ $paperDate }}
                            </div>
                        </div>
                    </div>

                    {{-- 题目列表（左右布局） --}}
                    <div class="space-y-6">
                        @foreach($this->questions as $index => $question)
                            <div class="border border-gray-200 rounded-lg p-4 md:p-6 shadow-sm hover:shadow-md transition-shadow">
                                <div class="grid grid-cols-1 lg:grid-cols-3 gap-4 md:gap-6">
                                    {{-- 左侧：题目内容 --}}
                                    <div class="lg:col-span-2 order-2 lg:order-1">
                                        <div class="flex flex-wrap items-center gap-2 md:gap-3 mb-4">
                                            <span class="bg-blue-100 text-blue-800 px-2 py-1 rounded text-sm font-medium">
                                                第 {{ $question['question_number'] }} 题
                                            </span>
                                            <span class="bg-gray-100 text-gray-800 px-2 py-1 rounded text-sm">
                                                {{ $question['question_type'] === 'choice' ? '选择题' : ($question['question_type'] === 'fill' ? '填空题' : '解答题') }}
                                            </span>
                                            <span class="text-sm text-gray-600">({{ $question['max_score'] }}分)</span>
                                        </div>

                                        <div class="prose max-w-none text-gray-800">
                                            <p>{!! $question['question_text'] !!}</p>

                                            {{-- 选择题选项 --}}
                                            @if($question['question_type'] === 'choice' && !empty($question['options']))
                                                <div class="mt-4 space-y-2">
                                                    @foreach($question['options'] as $option)
                                                        <div class="flex items-start">
                                                            <span class="w-6 h-6 rounded-full border-2 border-gray-300 flex items-center justify-center text-sm font-medium mr-3 mt-0.5 flex-shrink-0">
                                                                {{ $loop->index === 0 ? 'A' : ($loop->index === 1 ? 'B' : ($loop->index === 2 ? 'C' : 'D')) }}
                                                            </span>
                                                            <span class="text-sm">{{ $option }}</span>
                                                        </div>
                                                    @endforeach
                                                </div>
                                            @endif

                                            {{-- 参考答案 --}}
                                            @if(!empty($question['correct_answer']))
                                                <div class="mt-4 p-3 bg-green-50 border-l-4 border-green-400 rounded-r-md">
                                                    <div class="flex items-start">
                                                        <svg class="w-5 h-5 text-green-600 mr-2 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
                                                        </svg>
                                                        <div class="text-sm">
                                                            <span class="font-medium text-green-800">参考答案：</span>
                                                            <span class="text-green-700 font-mono">{{ $question['correct_answer'] }}</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            @else
                                                <div class="mt-4 p-3 bg-yellow-50 border-l-4 border-yellow-400 rounded-r-md">
                                                    <div class="flex items-start">
                                                        <span class="w-6 h-6 rounded-full bg-yellow-200 text-yellow-700 flex items-center justify-center mr-3 mt-0.5 flex-shrink-0 font-bold">
                                                            !
                                                        </span>
                                                        <div class="text-sm">
                                                            <span class="font-medium text-yellow-800">注意：</span>
                                                            <span class="text-yellow-700">暂无参考答案，请根据题目内容自行判断</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            @endif

                                            {{-- 学生答案 --}}
                                            @if($question['student_answer'])
                                                <div class="mt-3 p-3 bg-blue-50 border-l-4 border-blue-400 rounded-r-md">
                                                    <div class="flex items-start">
                                                        <svg class="w-5 h-5 text-blue-600 mr-2 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path>
                                                        </svg>
                                                        <div class="text-sm">
                                                            <span class="font-medium text-blue-800">学生答案：</span>
                                                            <span class="text-blue-700 font-mono">{{ $question['student_answer'] }}</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            @endif
                                        </div>
                                    </div>

                                    {{-- 右侧：老师判卷 --}}
                                    <div class="lg:col-span-1 order-1 lg:order-2">
                                        <div class="bg-gray-50 rounded-lg p-3 md:p-4 sticky top-4">
                                            <h3 class="font-medium text-gray-900 mb-3 md:mb-4">老师判卷</h3>

                                            {{-- 选择题显示选项 --}}
                                            @if($question['question_type'] === 'choice')
                                                <div class="mb-4">
                                                    <label class="block text-sm font-medium text-gray-700 mb-2">
                                                        题目选项
                                                    </label>
                                                    <div class="space-y-2">
                                                        @foreach($question['options'] ?? [] as $optionIndex => $option)
                                                            <div class="flex items-center">
                                                                <span class="w-6 h-6 rounded-full border-2 border-gray-300 flex items-center justify-center text-sm font-medium mr-2 flex-shrink-0">
                                                                    {{ chr(65 + $optionIndex) }}
                                                                </span>
                                                                <span class="text-sm">{{ $option }}</span>
                                                            </div>
                                                        @endforeach
                                                    </div>
                                                </div>
                                            @endif

                                            {{-- 评分区域：根据题型不同显示不同评分方式 --}}
                                            @if($question['question_type'] === 'choice')
                                                {{-- 选择题：对错单选 --}}
                                                <div class="space-y-3">
                                                    <label class="flex items-center cursor-pointer">
                                                        <input
                                                            type="radio"
                                                            id="question_{{ $index }}_correct"
                                                            name="question_{{ $index }}_is_correct"
                                                            wire:model.live="gradingData.{{ $index }}.is_correct"
                                                            value="true"
                                                            class="mr-2"
                                                        >
                                                        <span class="text-green-700 font-medium">✓ 正确 ({{ $question['max_score'] }}分)</span>
                                                    </label>
                                                    <label class="flex items-center cursor-pointer">
                                                        <input
                                                            type="radio"
                                                            id="question_{{ $index }}_incorrect"
                                                            name="question_{{ $index }}_is_correct"
                                                            wire:model.live="gradingData.{{ $index }}.is_correct"
                                                            value="false"
                                                            class="mr-2"
                                                        >
                                                        <span class="text-red-700 font-medium">✗ 错误 (0分)</span>
                                                    </label>
                                                </div>
                                            @else
                                                {{-- 填空题和解答题/计算题：直接输入分数 --}}
                                                <div>
                                                    <label class="block text-sm font-medium text-gray-700 mb-2">
                                                        得分 (0-{{ $question['max_score'] }}分)
                                                    </label>
                                                    <input
                                                        type="number"
                                                        id="question_{{ $index }}_score"
                                                        name="question_{{ $index }}_score"
                                                        wire:model.live="gradingData.{{ $index }}.score"
                                                        min="0"
                                                        max="{{ $question['max_score'] }}"
                                                        step="0.5"
                                                        class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
                                                        placeholder="请输入得分"
                                                    >
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>

                    {{-- 操作按钮 --}}
                    <div class="flex justify-end mt-8">
                        <div class="space-x-4">
                            <button
                                wire:click="saveGrading"
                                type="button"
                                class="bg-blue-600 text-white px-6 py-2 rounded-md hover:bg-blue-700 transition-colors"
                            >
                                提交评分
                            </button>
                        </div>
                    </div>
                @endif
        </div>
    @endif

    {{-- 最近上传记录 --}}
    <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
        <h2 class="text-lg font-semibold mb-4 flex items-center">
            <svg class="w-5 h-5 mr-2 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6 2a9 9 0 11-18 0 9 9 0 011-18 0z"></path>
            </svg>
            最近试卷记录
        </h2>

        @if(count($this->recentRecords) > 0)
            <div class="overflow-x-auto">
                <table class="min-w-full divide-y divide-gray-200">
                    <thead class="bg-gray-50">
                        <tr>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">试卷名称</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">学生</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">题目数</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">状态</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">创建时间</th>
                        </tr>
                    </thead>
                    <tbody class="bg-white divide-y divide-gray-200">
                        @foreach($this->recentRecords as $record)
                            <tr class="hover:bg-gray-50">
                                <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">
                                    {{ $record['paper_name'] }}
                                </td>
                                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                                    {{ $record['student_name'] ?? '未知' }}
                                </td>
                                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                                    {{ $record['total_questions'] }}
                                </td>
                                <td class="px-6 py-4 whitespace-nowrap">
                                    <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full
                                        @if($record['is_completed'])
                                            bg-green-100 text-green-800
                                        @elseif($record['status'] === 'processing')
                                            bg-yellow-100 text-yellow-800
                                        @else
                                            bg-gray-100 text-gray-800
                                        @endif">
                                        {{ $record['status_text'] ?? $record['status'] }}
                                    </span>
                                </td>
                                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                                    {{ $record['created_at'] }}
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        @else
            <div class="text-center py-8 text-gray-500">
                <svg class="w-12 h-12 mx-auto mb-3 opacity-50" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 13h6m-3-9v9h6m0 6v6m-6-6h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.707.293V19a2 2 0 012-2H5a2 2 0 01-2 2v-14z"></path>
                </svg>
                <p>暂无上传记录</p>
            </div>
        @endif
    </div>

</x-filament-panels::page>