Merge branch 'ye/fix-option-image-rendering'

resources/views/components/exam/paper-body.blade.php

@@ -182,6 +182,18 @@
                         );
                         $optionsClass = $layoutMeta['class'];
                         $layoutDesc = $layoutMeta['layout'];
+                        $hasImageOptionInQuestion = false;
+                        foreach ($options as $optRaw) {
+                            if (preg_match('/<(img|image|svg)\\b|data:image\\//i', (string) $optRaw) === 1) {
+                                $hasImageOptionInQuestion = true;
+                                break;
+                            }
+                        }
+                        if ($hasImageOptionInQuestion) {
+                            // 简化规则：图片选项固定四列同一行展示
+                            $optionsClass = 'options-grid-4';
+                            $layoutDesc = '4列布局(图片选项固定)';
+                        }
 
                         \Illuminate\Support\Facades\Log::debug('选择题布局决策', [
                             'question_number' => $questionNumber,
@@ -189,6 +201,7 @@
                             'opt_count' => $layoutMeta['opt_count'],
                             'max_length' => $layoutMeta['max_length'],
                             'has_complex_formula' => $layoutMeta['has_complex_formula'],
+                            'has_image_option' => $hasImageOptionInQuestion,
                             'selected_class' => $optionsClass,
                             'layout' => $layoutDesc
                         ]);
@@ -229,7 +242,8 @@
                                 $rawOptLen = mb_strlen((string) $rawOptText, 'UTF-8');
                                 $isShortOption = $rawOptLen <= 8;
                             @endphp
-                            <div class="option option-compact">
+                            @php $hasImageOption = preg_match('/<(img|image|svg)\\b|data:image\\//i', (string) $renderedOpt) === 1; @endphp
+                            <div class="option option-compact {{ $hasImageOption ? 'option-with-image' : '' }}">
                                 <strong>{{ $label }}.</strong>
                                 <span class="option-value {{ $isShortOption ? 'option-short' : 'option-long' }}">{!! $renderedOpt !!}</span>
                             </div>

resources/views/pdf/partials/paper-body-core-styles.blade.php

@@ -66,7 +66,7 @@
 }
 .options-grid-4 {
     display: grid;
-    grid-template-columns: repeat(4, 1fr);
+    grid-template-columns: repeat(4, minmax(0, 1fr));
     gap: 8px 12px;
     page-break-inside: avoid;
     break-inside: avoid;
@@ -74,7 +74,7 @@
 .options-grid-2 {
     display: grid;
     grid-template-columns: 1fr 1fr;
-    gap: 8px 20px;
+    gap: 8px 12px;
     page-break-inside: avoid;
     break-inside: avoid;
 }
@@ -96,10 +96,33 @@
     page-break-inside: avoid;
     break-inside: avoid;
 }
+.options-grid-4 .option {
+    min-width: 0;
+}
 .option strong { margin-right: 4px; flex: 0 0 auto; line-height: 1.6; }
-.option-value { display: inline; }
+.option-value {
+    display: inline-block;
+    max-width: calc(100% - 24px);
+    min-width: 0;
+}
+.options-grid-4 .option-value {
+    display: block;
+    width: 100%;
+    max-width: 100%;
+}
+.options-grid-4 .option img {
+    max-width: 120px !important;
+    max-height: 28mm !important;
+}
 .option-short { white-space: nowrap; }
 .option-long { white-space: normal; word-break: break-word; }
+.options-grid-4 .option-short { white-space: normal; }
+.option.option-with-image {
+    align-items: flex-start;
+}
+.option.option-with-image .option-value {
+    display: block;
+}
 .option-inline { display: inline-flex; align-items: baseline; margin-right: 20px; }
 .option p, .option div { margin: 0; display: inline; }
 .answer-area {

resources/views/pdf/partials/paper-exam-shared-image-styles.blade.php

@@ -48,9 +48,12 @@
     image-rendering: -webkit-optimize-contrast;
 }
 .option img {
-    max-width: 92%;
+    display: block;
+    max-width: 100%;
     max-height: 42mm;
+    width: auto;
     height: auto;
     object-fit: contain;
-    vertical-align: middle;
+    margin: 2px 0;
+    vertical-align: top;
 }