feat: Step2 переделан + улучшен Debug Panel с полными S3 URL

Step2Details (по скриншоту):
 Индикатор ' Полис найден' вверху
 Select с типами событий из erv_ticket:
   - Задержка авиарейса (более 3 часов)
   - Отмена авиарейса
   - Пропуск стыковочного рейса
   - Посадка на запасной аэродром
   - Задержка отправки поезда
   - Отмена поезда
   - Задержка/отмена парома/круизного судна

 Дата наступления страхового случая (DatePicker)
 Номер рейса/поезда/парома
 Загрузка подтверждающих документов:
   - Посадочный талон, билет, справка и т.д.
   - До 10 файлов по 15MB
   - HEIC, PDF, фото

Debug Panel улучшения:
 Полные S3 URL (не обрезанные)
 Кнопка '🔗 Открыть в новой вкладке'
 word-break: break-all для длинных URL
 Показывает все файлы из массива
 Для каждого файла:
   - Filename
   - File ID (UUID)
   - Size (KB)
   - Полный S3 URL (кликабельный)

Теперь в Debug видно КУДА загрузилось:
https://s3.twcstorage.ru/f9825c87-.../policies/20251024_213045_abc123_file.jpg

Можно кликнуть и посмотреть глазами! 👀
This commit is contained in:
AI Assistant
2025-10-25 09:27:56 +03:00
parent 720d4ebdd9
commit d2777aeabf
6 changed files with 219 additions and 95 deletions

View File

@@ -186,34 +186,67 @@ export default function DebugPanel({ events, formData }: Props) {
</Descriptions>
)}
{event.type === 'upload' && (
<Descriptions size="small" column={1} bordered>
<Descriptions.Item
label={<span style={{ color: '#9cdcfe' }}>File ID</span>}
labelStyle={{ background: '#252526' }}
contentStyle={{ background: '#1e1e1e', color: '#569cd6', fontSize: 10 }}
>
{event.data.file_id}
</Descriptions.Item>
<Descriptions.Item
label={<span style={{ color: '#9cdcfe' }}>Size</span>}
labelStyle={{ background: '#252526' }}
contentStyle={{ background: '#1e1e1e', color: '#dcdcaa' }}
>
{(event.data.size / 1024).toFixed(1)} KB
</Descriptions.Item>
{event.data.url && (
<Descriptions.Item
label={<span style={{ color: '#9cdcfe' }}>S3 URL</span>}
labelStyle={{ background: '#252526' }}
contentStyle={{ background: '#1e1e1e', fontSize: 9 }}
>
<a href={event.data.url} target="_blank" rel="noopener noreferrer" style={{ color: '#4ec9b0' }}>
{event.data.url.substring(0, 50)}...
</a>
</Descriptions.Item>
)}
</Descriptions>
{event.type === 'upload' && event.data.files && (
<div>
{event.data.files.map((file: any, idx: number) => (
<Descriptions key={idx} size="small" column={1} bordered style={{ marginBottom: 8 }}>
<Descriptions.Item
label={<span style={{ color: '#9cdcfe' }}>File</span>}
labelStyle={{ background: '#252526' }}
contentStyle={{ background: '#1e1e1e', color: '#ce9178', fontSize: 10 }}
>
{file.filename}
</Descriptions.Item>
<Descriptions.Item
label={<span style={{ color: '#9cdcfe' }}>File ID</span>}
labelStyle={{ background: '#252526' }}
contentStyle={{ background: '#1e1e1e', color: '#569cd6', fontSize: 9, fontFamily: 'monospace' }}
>
{file.file_id}
</Descriptions.Item>
<Descriptions.Item
label={<span style={{ color: '#9cdcfe' }}>Size</span>}
labelStyle={{ background: '#252526' }}
contentStyle={{ background: '#1e1e1e', color: '#dcdcaa' }}
>
{(file.size / 1024).toFixed(1)} KB
</Descriptions.Item>
{file.url && (
<Descriptions.Item
label={<span style={{ color: '#9cdcfe' }}>S3 URL</span>}
labelStyle={{ background: '#252526' }}
contentStyle={{ background: '#1e1e1e', fontSize: 9, wordBreak: 'break-all' }}
>
<a
href={file.url}
target="_blank"
rel="noopener noreferrer"
style={{ color: '#4ec9b0', textDecoration: 'underline' }}
>
{file.url}
</a>
<div style={{ marginTop: 4 }}>
<a
href={file.url}
target="_blank"
rel="noopener noreferrer"
style={{
fontSize: 10,
color: '#569cd6',
background: '#1e1e1e',
padding: '2px 6px',
borderRadius: 3,
border: '1px solid #333'
}}
>
🔗 Открыть в новой вкладке
</a>
</div>
</Descriptions.Item>
)}
</Descriptions>
))}
</div>
)}
</div>
)}
@@ -234,3 +267,4 @@ export default function DebugPanel({ events, formData }: Props) {
);
}