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

<x-filament-panels::page>

<div class="space-y-6">
    {{-- 模式选择 --}}
    <div class="card bg-base-100 shadow-lg border">
        <div class="card-body">
            <div class="flex gap-4">
                <button
                    wire:click="$set('mode', 'upload')"
                    class="btn {{ $mode === 'upload' ? 'btn-primary' : 'btn-outline' }}"
                >
                    <svg class="w-5 h-5" 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="btn {{ $mode === 'select_paper' ? 'btn-primary' : 'btn-outline' }}"
                >
                    <svg class="w-5 h-5" 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.293.707V19a2 2 0 01-2 2z"></path>
                    </svg>
                    选择已有试卷打分
                </button>
            </div>
        </div>
    </div>

    {{-- 上传模式 --}}
    @if($mode === 'upload')
        <div class="card bg-base-100 shadow-lg border">
            <div class="card-body">
                <h2 class="card-title text-xl mb-4">
                    <svg class="w-6 h-6" 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>
                    上传考试卷子
                </h2>

                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                    {{-- 左侧：选择老师和学生 --}}
                    <div class="space-y-4">
                        {{-- 选择老师 --}}
                        <div class="form-control w-full">
                            <label class="label">
                                <span class="label-text font-medium">选择老师 <span class="text-error">*</span></span>
                            </label>
                            <select
                                wire:model.live="teacherId"
                                class="select select-bordered w-full"
                            >
                                <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="label">
                                <span class="label-text font-medium">选择学生 <span class="text-error">*</span></span>
                            </label>
                            <select
                                wire:model.live="studentId"
                                class="select select-bordered w-full"
                                @if(empty($teacherId)) disabled @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 class="form-control w-full">
                        <label class="label">
                            <span class="label-text font-medium">卷子图片 <span class="text-error">*</span></span>
                        </label>

                        @if($uploadedImage)
                            {{-- 图片预览 --}}
                            <div class="relative">
                                <img
                                    src="{{ $uploadedImage->temporaryUrl() }}"
                                    class="w-full h-48 object-cover rounded-lg border"
                                    alt="预览"
                                >
                                <button
                                    type="button"
                                    wire:click="removeImage"
                                    class="btn btn-circle btn-sm btn-error absolute top-2 right-2"
                                >
                                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
                                    </svg>
                                </button>
                            </div>
                            <label class="label">
                                <span class="label-text-alt text-success">
                                    {{ $uploadedImage->getClientOriginalName() }}
                                    ({{ number_format($uploadedImage->getSize() / 1024, 1) }} KB)
                                </span>
                            </label>
                        @else
                            {{-- 上传区域 --}}
                            <div
                                x-data="{ uploading: false, progress: 0 }"
                                x-on:livewire-upload-start="uploading = true"
                                x-on:livewire-upload-finish="uploading = false"
                                x-on:livewire-upload-error="uploading = false"
                                x-on:livewire-upload-progress="progress = $event.detail.progress"
                                class="relative"
                            >
                                <input
                                    type="file"
                                    id="uploadedImage"
                                    wire:model.live="uploadedImage"
                                    class="hidden"
                                    accept="image/jpeg,image/png,image/webp"
                                >
                                <label
                                    for="uploadedImage"
                                    class="flex flex-col items-center justify-center w-full h-48 border-2 border-dashed rounded-lg cursor-pointer hover:bg-base-200 transition-colors"
                                    x-bind:class="{ 'border-primary bg-primary/5': uploading }"
                                >
                                    {{-- 上传进度 --}}
                                    <div x-show="uploading" class="flex flex-col items-center justify-center">
                                        <div class="radial-progress text-primary" x-bind:style="'--value:' + progress + '; --size: 5rem; --thickness: 4px;'" role="progressbar">
                                            <span class="text-sm font-bold" x-text="progress + '%'"></span>
                                        </div>
                                        <p class="mt-3 text-base font-semibold text-primary">正在上传...</p>
                                    </div>

                                    {{-- 默认上传提示 --}}
                                    <div x-show="!uploading" class="flex flex-col items-center justify-center pt-5 pb-6">
                                        <svg class="w-10 h-10 mb-3 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"></path>
                                        </svg>
                                        <p class="mb-2 text-sm text-gray-500">
                                            <span class="font-semibold">点击上传</span> 或拖拽文件
                                        </p>
                                        <p class="text-xs text-gray-400">
                                            支持 JPG、PNG、WebP (最大 10MB)
                                        </p>
                                    </div>
                                </label>
                            </div>
                        @endif
                    </div>
                </div>

                {{-- 提交按钮 --}}
                <div class="card-actions justify-end mt-6">
                    <button
                        type="button"
                        wire:click="submitUpload"
                        class="btn btn-primary"
                        @if($isUploading) disabled @endif
                    >
                        @if($isUploading)
                            <span class="loading loading-spinner"></span>
                            上传中...
                        @else
                            <svg class="w-5 h-5 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>
                            上传并识别
                        @endif
                    </button>
                </div>
            </div>
        </div>
    @endif

    {{-- 选择试卷模式 --}}
    @if($mode === 'select_paper')
        <div class="card bg-base-100 shadow-lg border">
            <div class="card-body">
                <h2 class="card-title text-xl mb-4">
                    <svg class="w-6 h-6" 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.293.707V19a2 2 0 01-2 2z"></path>
                    </svg>
                    选择试卷并打分
                </h2>

                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                    {{-- 选择老师 --}}
                    <div class="form-control w-full">
                        <label class="label">
                            <span class="label-text font-medium">选择老师 <span class="text-error">*</span></span>
                        </label>
                        <select
                            wire:model.live="teacherId"
                            class="select select-bordered w-full"
                        >
                            <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="label">
                            <span class="label-text font-medium">选择学生 <span class="text-error">*</span></span>
                        </label>
                        <select
                            wire:model.live="studentId"
                            class="select select-bordered w-full"
                            @if(empty($teacherId)) disabled @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>

                {{-- 试卷类型 --}}
                @if(!empty($studentId))
                    <div class="form-control w-full mt-4">
                        <label class="label">
                            <span class="label-text font-medium">试卷形式 <span class="text-error">*</span></span>
                        </label>
                        <select
                            wire:model.live="paperType"
                            class="select select-bordered w-full"
                        >
                            @foreach($this->paperTypes as $value => $label)
                                <option value="{{ $value }}">{{ $label }}</option>
                            @endforeach
                        </select>
                    </div>

                    {{-- 选择试卷 --}}
                    <div class="form-control w-full mt-4">
                        <label class="label">
                            <span class="label-text font-medium">选择试卷 <span class="text-error">*</span></span>
                        </label>
                        <select
                            wire:model.live="selectedPaperId"
                            class="select select-bordered w-full"
                        >
                            <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(!empty($selectedPaperId) && count($this->selectedPaperQuestions) > 0)
                    <div class="mt-6">
                        <h3 class="text-lg font-semibold mb-4">题目列表</h3>
                        <div class="space-y-4">
                            @foreach($this->selectedPaperQuestions as $question)
                                <div class="card bg-base-200 border">
                                    <div class="card-body">
                                        <div class="flex items-start justify-between">
                                            <div class="flex-1">
                                                <div class="flex items-center gap-2 mb-2">
                                                    <span class="badge badge-primary">第 {{ $question['question_number'] }} 题</span>
                                                    <span class="badge badge-outline">{{ $question['question_type'] }}</span>
                                                    <span class="text-sm text-gray-500">({{ $question['score'] }}分)</span>
                                                </div>
                                                <div class="prose max-w-none">
                                                    @math($question['content'])
                                                </div>
                                                <div class="mt-2 text-sm text-success">
                                                    <strong>参考答案:</strong> @math($question['answer'])
                                                </div>
                                            </div>
                                        </div>

                                        {{-- 评分区域 --}}
                                        <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mt-4 pt-4 border-t">
                                            {{-- 学生答案 --}}
                                            <div class="form-control">
                                                <label class="label">
                                                    <span class="label-text">学生答案</span>
                                                </label>
                                                <input
                                                    type="text"
                                                    wire:model="questionGrades.{{ $question['id'] }}.student_answer"
                                                    class="input input-bordered input-sm"
                                                    placeholder="输入学生答案..."
                                                >
                                            </div>

                                            {{-- 对错判断(选择题/填空题) --}}
                                            @if(in_array($question['question_type'], ['选择题', '填空题']))
                                                <div class="form-control">
                                                    <label class="label">
                                                        <span class="label-text">对错</span>
                                                    </label>
                                                    <div class="flex gap-2">
                                                        <label class="label cursor-pointer gap-2">
                                                            <input
                                                                type="radio"
                                                                wire:model="questionGrades.{{ $question['id'] }}.is_correct"
                                                                value="1"
                                                                class="radio radio-success radio-sm"
                                                            >
                                                            <span class="label-text">正确</span>
                                                        </label>
                                                        <label class="label cursor-pointer gap-2">
                                                            <input
                                                                type="radio"
                                                                wire:model="questionGrades.{{ $question['id'] }}.is_correct"
                                                                value="0"
                                                                class="radio radio-error radio-sm"
                                                            >
                                                            <span class="label-text">错误</span>
                                                        </label>
                                                    </div>
                                                </div>
                                            @endif

                                            {{-- 评分(计算题/简答题) --}}
                                            @if(in_array($question['question_type'], ['计算题', '简答题', '解答题']))
                                                <div class="form-control">
                                                    <label class="label">
                                                        <span class="label-text">得分</span>
                                                    </label>
                                                    <input
                                                        type="number"
                                                        wire:model="questionGrades.{{ $question['id'] }}.score"
                                                        class="input input-bordered input-sm"
                                                        min="0"
                                                        max="{{ $question['score'] }}"
                                                        step="0.5"
                                                        placeholder="0-{{ $question['score'] }}"
                                                    >
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>

                        {{-- 提交按钮 --}}
                        <div class="flex justify-end mt-6">
                            <button
                                type="button"
                                wire:click="submitManualGrading"
                                class="btn btn-primary"
                            >
                                <svg class="w-5 h-5 mr-2" 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>
                                提交评分
                            </button>
                        </div>
                    </div>
                @endif
            </div>
        </div>
    @endif

    {{-- 最近上传记录 --}}
    <div class="card bg-base-100 shadow-lg border">
        <div class="card-body">
            <h2 class="card-title text-lg mb-4">
                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
                </svg>
                最近上传记录
            </h2>

            @if(count($this->recentRecords) > 0)
                <div class="overflow-x-auto">
                    <table class="table table-zebra">
                        <thead>
                            <tr>
                                <th>学生</th>
                                <th>文件名</th>
                                <th>试卷形式</th>
                                <th>状态</th>
                                <th>进度</th>
                                <th>上传时间</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($this->recentRecords as $record)
                                <tr
                                    class="hover:bg-base-200 cursor-pointer transition-colors"
                                    onclick="window.location.href='{{
                                        $record['type'] === 'ocr_upload'
                                            ? route('filament.admin.pages.exam-analysis', ['recordId' => $record['record_id']])
                                            : route('filament.admin.pages.exam-analysis', ['paperId' => $record['paper_id']])
                                    }}'"
                                >
                                    <td>{{ $record['student_name'] ?? '未知' }}</td>
                                    <td class="max-w-xs truncate" title="{{ $record['paper_name'] }}">
                                        <div class="flex items-center gap-2">
                                            @if($record['type'] === 'ocr_upload')
                                                <svg class="w-4 h-4 text-gray-500 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
                                                </svg>
                                            @elseif($record['type'] === 'graded_paper')
                                                <svg class="w-4 h-4 text-green-500 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>
                                            @else
                                                <svg class="w-4 h-4 text-blue-500 flex-shrink-0" 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.293.707V19a2 2 0 01-2 2z"></path>
                                                </svg>
                                            @endif
                                            <span>{{ $record['paper_name'] }}</span>
                                        </div>
                                    </td>
                                    <td>
                                        <span class="badge badge-outline">
                                            @if($record['type'] === 'ocr_upload')
                                                @php
                                                    $paperTypeLabel = match($record['paper_type']) {
                                                        'unit_test' => '单元测试',
                                                        'midterm' => '期中考试',
                                                        'final' => '期末考试',
                                                        'homework' => '家庭作业',
                                                        'quiz' => '随堂测验',
                                                        'other' => '其他',
                                                        default => '未分类',
                                                    };
                                                @endphp
                                                {{ $paperTypeLabel }}
                                            @else
                                                {{ $record['paper_type'] }}
                                            @endif
                                        </span>
                                    </td>
                                    <td>
                                        @php
                                            $statusClass = match($record['status']) {
                                                'pending' => 'badge-ghost',
                                                'processing' => 'badge-info',
                                                'completed' => 'badge-success',
                                                'failed' => 'badge-error',
                                                'draft' => 'badge-warning',
                                                default => 'badge-ghost',
                                            };
                                            $statusText = match($record['status']) {
                                                'pending' => '待处理',
                                                'processing' => '处理中',
                                                'completed' => '已评分',
                                                'failed' => '失败',
                                                'draft' => '草稿',
                                                default => $record['status'],
                                            };
                                        @endphp
                                        <span class="badge {{ $statusClass }}">{{ $statusText }}</span>
                                    </td>
                                    <td>
                                        @if($record['total_questions'] > 0)
                                            @if($record['type'] === 'ocr_upload' && isset($record['processed_questions']))
                                                <progress
                                                    class="progress progress-primary w-20"
                                                    value="{{ $record['processed_questions'] }}"
                                                    max="{{ $record['total_questions'] }}"
                                                ></progress>
                                                <span class="text-xs ml-1">
                                                    {{ $record['processed_questions'] }}/{{ $record['total_questions'] }}
                                                </span>
                                            @else
                                                <span class="badge badge-info">
                                                    {{ $record['total_questions'] }} 题
                                                </span>
                                            @endif
                                        @else
                                            <span class="text-gray-400">-</span>
                                        @endif
                                    </td>
                                    <td class="text-sm">
                                        {{ $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-3v6m5 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
                    </svg>
                    <p>暂无上传记录</p>
                </div>
            @endif
        </div>
    </div>
</div>

<x-math-render />

</x-filament-panels::page>