si/iistwin
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

fix: textarea раскрывается по высоте текста, файлы горизонтально

Browse Source 
- textarea overlay max-height увеличен до min(85vh, 700px)
- убрана правая кнопка 'Добавить файл' (дубль левой иконки)
- файлы идут горизонтально, длинные имена обрезаются ellipsis, список занимает доступную ширину
This commit is contained in:
Ильяс Султанов
2026-07-14 19:50:32 +03:00
parent 800d7f0b57
commit d35d0cd1ef
1 changed files with 12 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
client/src/pages/TaskDetail.tsx
View File

@@ -542,23 +542,23 @@ function FileFieldRow({
<span className="text-muted-foreground text-sm">Загрузка...</span> <span className="text-muted-foreground text-sm">Загрузка...</span>
) : files.length > 0 ? ( ) : 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) => { {files.map((fileInfo, idx) => {
const vType = detectViewerType(fileInfo.url, fileInfo.name); const vType = detectViewerType(fileInfo.url, fileInfo.name);
const canPreview = vType === 'pdf' || vType === 'word' || vType === 'excel' || vType === 'powerpoint' || vType === 'video' || vType === 'audio' || vType === 'image'; const canPreview = vType === 'pdf' || vType === 'word' || vType === 'excel' || vType === 'powerpoint' || vType === 'video' || vType === 'audio' || vType === 'image';
return ( 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 ? ( {canPreview ? (
<button <button
type="button" type="button"
onClick={() => setViewerFile({ url: fileInfo.url, name: fileInfo.name })} 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}`} data-testid={`file-link-${field.code}-${idx}`}
> >
<FileText className="w-3 h-3" /> <FileText className="w-3 h-3 shrink-0" />
{fileInfo.name} <span className="truncate max-w-[200px]">{fileInfo.name}</span>
{fileInfo.size !== undefined && ( {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> </button>
) : ( ) : (
@@ -567,15 +567,15 @@ function FileFieldRow({
onClick={(e) => { e.preventDefault(); openFilePresigned(fileInfo.url); }} onClick={(e) => { e.preventDefault(); openFilePresigned(fileInfo.url); }}
target="_blank" target="_blank"
rel="noopener noreferrer" 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}`} data-testid={`file-link-${field.code}-${idx}`}
> >
<FileText className="w-3 h-3" /> <FileText className="w-3 h-3 shrink-0" />
{fileInfo.name} <span className="truncate max-w-[200px]">{fileInfo.name}</span>
{fileInfo.size !== undefined && ( {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> </a>
)} )}
<button <button
@@ -590,16 +590,6 @@ function FileFieldRow({
); );
})} })}
</div> </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> <span className="text-muted-foreground text-sm" data-testid={`file-empty-${field.code}`}>Нет файла</span>
@@ -1301,7 +1291,7 @@ function FieldValueRow({
onEnterEdit={handleEnterEdit} onEnterEdit={handleEnterEdit}
fitOverlay={field.type !== 'textarea' && field.type !== 'rich-text'} fitOverlay={field.type !== 'textarea' && field.type !== 'rich-text'}
overlayClassName={field.type === 'textarea' || field.type === 'rich-text' ? 'flex flex-col overflow-hidden' : ''} 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} overlayMinWidth={field.type === 'textarea' || field.type === 'rich-text' ? '100%' : 180}
overlayWidth={field.type === 'textarea' || field.type === 'rich-text' ? '100%' : undefined} 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]'} className={field.type === 'textarea' || field.type === 'rich-text' ? 'items-start min-h-[24px] w-full' : 'items-center min-h-[28px]'}