fix: textarea раскрывается по высоте текста, файлы горизонтально
- textarea overlay max-height увеличен до min(85vh, 700px) - убрана правая кнопка 'Добавить файл' (дубль левой иконки) - файлы идут горизонтально, длинные имена обрезаются ellipsis, список занимает доступную ширину
This commit is contained in:
@@ -542,23 +542,23 @@ function FileFieldRow({
|
||||
<span className="text-muted-foreground text-sm">Загрузка...</span>
|
||||
) : files.length > 0 ? (
|
||||
<>
|
||||
<div className="inline-flex flex-wrap items-center gap-x-2 gap-y-0.5">
|
||||
<div className="flex flex-1 min-w-0 flex-wrap items-center gap-x-2 gap-y-0.5">
|
||||
{files.map((fileInfo, idx) => {
|
||||
const vType = detectViewerType(fileInfo.url, fileInfo.name);
|
||||
const canPreview = vType === 'pdf' || vType === 'word' || vType === 'excel' || vType === 'powerpoint' || vType === 'video' || vType === 'audio' || vType === 'image';
|
||||
return (
|
||||
<span key={idx} className="inline-flex items-center gap-1 group/file bg-muted/40 hover:bg-muted/60 rounded px-1.5 py-0.5">
|
||||
<span key={idx} className="inline-flex items-center gap-1 group/file bg-muted/40 hover:bg-muted/60 rounded px-1.5 py-0.5 min-w-0 max-w-full">
|
||||
{canPreview ? (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setViewerFile({ url: fileInfo.url, name: fileInfo.name })}
|
||||
className="inline-flex items-center gap-1 text-sm text-primary hover:underline"
|
||||
className="inline-flex items-center gap-1 text-sm text-primary hover:underline min-w-0"
|
||||
data-testid={`file-link-${field.code}-${idx}`}
|
||||
>
|
||||
<FileText className="w-3 h-3" />
|
||||
{fileInfo.name}
|
||||
<FileText className="w-3 h-3 shrink-0" />
|
||||
<span className="truncate max-w-[200px]">{fileInfo.name}</span>
|
||||
{fileInfo.size !== undefined && (
|
||||
<span className="text-muted-foreground text-xs">({formatFileSize(fileInfo.size)})</span>
|
||||
<span className="text-muted-foreground text-xs shrink-0">({formatFileSize(fileInfo.size)})</span>
|
||||
)}
|
||||
</button>
|
||||
) : (
|
||||
@@ -567,15 +567,15 @@ function FileFieldRow({
|
||||
onClick={(e) => { e.preventDefault(); openFilePresigned(fileInfo.url); }}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-1 text-sm text-primary hover:underline"
|
||||
className="inline-flex items-center gap-1 text-sm text-primary hover:underline min-w-0"
|
||||
data-testid={`file-link-${field.code}-${idx}`}
|
||||
>
|
||||
<FileText className="w-3 h-3" />
|
||||
{fileInfo.name}
|
||||
<FileText className="w-3 h-3 shrink-0" />
|
||||
<span className="truncate max-w-[200px]">{fileInfo.name}</span>
|
||||
{fileInfo.size !== undefined && (
|
||||
<span className="text-muted-foreground text-xs">({formatFileSize(fileInfo.size)})</span>
|
||||
<span className="text-muted-foreground text-xs shrink-0">({formatFileSize(fileInfo.size)})</span>
|
||||
)}
|
||||
<Download className="w-3 h-3 text-muted-foreground" />
|
||||
<Download className="w-3 h-3 text-muted-foreground shrink-0" />
|
||||
</a>
|
||||
)}
|
||||
<button
|
||||
@@ -590,16 +590,6 @@ function FileFieldRow({
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
{(field.maxFileCount == null || files.length < field.maxFileCount) && (
|
||||
<button
|
||||
onClick={() => fileInputRef.current?.click()}
|
||||
disabled={isUploading}
|
||||
className="inline-flex items-center gap-1 text-xs text-muted-foreground hover:text-foreground disabled:opacity-30"
|
||||
>
|
||||
<Upload className="w-3 h-3" />
|
||||
Добавить файл
|
||||
</button>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<span className="text-muted-foreground text-sm" data-testid={`file-empty-${field.code}`}>Нет файла</span>
|
||||
@@ -1301,7 +1291,7 @@ function FieldValueRow({
|
||||
onEnterEdit={handleEnterEdit}
|
||||
fitOverlay={field.type !== 'textarea' && field.type !== 'rich-text'}
|
||||
overlayClassName={field.type === 'textarea' || field.type === 'rich-text' ? 'flex flex-col overflow-hidden' : ''}
|
||||
overlayMaxHeight={field.type === 'textarea' || field.type === 'rich-text' ? 'min(70vh, 500px)' : undefined}
|
||||
overlayMaxHeight={field.type === 'textarea' || field.type === 'rich-text' ? 'min(85vh, 700px)' : undefined}
|
||||
overlayMinWidth={field.type === 'textarea' || field.type === 'rich-text' ? '100%' : 180}
|
||||
overlayWidth={field.type === 'textarea' || field.type === 'rich-text' ? '100%' : undefined}
|
||||
className={field.type === 'textarea' || field.type === 'rich-text' ? 'items-start min-h-[24px] w-full' : 'items-center min-h-[28px]'}
|
||||
|
||||
Reference in New Issue
Block a user