fix(TaskDetail): system fields layout and ContractNumberField wrapper

- Increase system field label width w-22 -> w-24, add text-[11px]
- Increase system field row spacing gap-1 -> gap-1.5, py-0.5 -> py-1
- Fix ContractNumberField wrapper to flex items-center gap-1.5
- Fix FieldValueRow flex-wrap -> flex-nowrap, add text-[13px] to label
This commit is contained in:
2026-07-17 18:24:35 +03:00
parent aea0e9c3fe
commit 240dcd2f7e

View File

@@ -1155,7 +1155,7 @@ function FieldValueRow({
if (field.type === 'contract-number') {
const cnConfig = (field.options as any)?.contractNumber;
return (
<div className="w-full max-w-[640px]" onClick={e => e.stopPropagation()}>
<div className="flex items-center gap-1.5" onClick={e => e.stopPropagation()}>
<ContractNumberField
value={editorValue as any}
onChange={(val) => onDraftChange?.(JSON.stringify(val))}
@@ -1295,8 +1295,8 @@ function FieldValueRow({
{/* Контент поля */}
<div className="flex-1 min-w-0">
<div className="flex items-start gap-1 flex-wrap">
<strong className={cn('shrink-0', errorMessage && 'text-destructive')}>
<div className="flex items-start gap-1.5 flex-nowrap">
<strong className={cn('shrink-0 text-[13px]', errorMessage && 'text-destructive')}>
{field.name}:
</strong>
{(() => {
@@ -2000,7 +2000,7 @@ function InlineSystemFields({ task, taskId, formId, getUserName, readOnly, hidde
{!readOnly
? leftSlot(() => { setAssigneeDropdownOpen(v => !v); setAssigneeSearch(''); })
: emptySlot}
<span className="text-muted-foreground w-22 shrink-0">Ответственный</span>
<span className="text-muted-foreground w-24 shrink-0 text-[11px]">Ответственный</span>
<div className="relative flex-1 min-w-0">
{/* Multiple assignees + roles as tags */}
<div className="flex flex-wrap gap-1 items-center min-h-[1.25rem]">
@@ -2165,10 +2165,10 @@ function InlineSystemFields({ task, taskId, formId, getUserName, readOnly, hidde
);
return (
<div
className="group/sysrow flex items-center gap-1 py-0.5 -mx-1 px-1 rounded transition-colors hover:bg-muted/20"
className="group/sysrow flex items-center gap-1.5 py-1 -mx-1 px-1 rounded transition-colors hover:bg-muted/20"
>
{emptySlot}
<span className="text-muted-foreground w-22 shrink-0">Срок</span>
<span className="text-muted-foreground w-24 shrink-0 text-[11px]">Срок</span>
<InlineField
readView={dueDateReadView}
editor={dueDateEditor}
@@ -2186,9 +2186,9 @@ function InlineSystemFields({ task, taskId, formId, getUserName, readOnly, hidde
{/* Created (read-only) */}
{!hidden.has('createdAt') && (
<div className="flex items-center gap-1 py-0.5">
<div className="flex items-center gap-1.5 py-1">
{emptySlot}
<span className="text-muted-foreground w-22 shrink-0">Создана</span>
<span className="text-muted-foreground w-24 shrink-0 text-[11px]">Создана</span>
<span data-testid="text-task-created">
{task.createdAt
? new Date(task.createdAt).toLocaleString('ru-RU', { day: '2-digit', month: '2-digit', year: 'numeric', hour: '2-digit', minute: '2-digit' })
@@ -2199,9 +2199,9 @@ function InlineSystemFields({ task, taskId, formId, getUserName, readOnly, hidde
{/* Completed at (read-only, shown only when task is in final status) */}
{isTaskFinal && !hidden.has('completedAt') && (
<div className="flex items-center gap-1 py-0.5">
<div className="flex items-center gap-1.5 py-1">
{emptySlot}
<span className="text-muted-foreground w-22 shrink-0">Завершена</span>
<span className="text-muted-foreground w-24 shrink-0 text-[11px]">Завершена</span>
<span data-testid="text-task-completed">
{task.completedAt
? new Date(task.completedAt).toLocaleString('ru-RU', { day: '2-digit', month: '2-digit', year: 'numeric', hour: '2-digit', minute: '2-digit' })
@@ -2212,9 +2212,9 @@ function InlineSystemFields({ task, taskId, formId, getUserName, readOnly, hidde
{/* Creator (read-only) */}
{!hidden.has('createdBy') && task.createdBy && (
<div className="flex items-center gap-1 py-0.5">
<div className="flex items-center gap-1.5 py-1">
{emptySlot}
<span className="text-muted-foreground w-22 shrink-0">Автор</span>
<span className="text-muted-foreground w-24 shrink-0 text-[11px]">Автор</span>
<span data-testid="text-task-creator">{getUserName(task.createdBy)}</span>
</div>
)}