1f5bed0c79
核心变更: - DevTask 字段重构：startDate/dueDate/estimateHours/actualHours 替换为 expectedStartAt/expectedEndAt/actualStartAt/actualEndAt（含时分），预计/实际工时按工作时段（9:00-12:00 + 13:00-18:00）派生计算 - 状态机自动化：到点自动切开发中、未到可手动开干、超期需填延后原因 - 新建 lib/work-hours.ts：calcWorkHours（工作时段过滤）、formatWorkHours（X h（Y 天））、calcTwoMetrics（日历/人力双口径） - 新建 lib/dev-task-transitions.ts：状态切换守卫 - 三个 Tab 顶部统计：开发任务（预/日历/人力）、测试用例 / Bug（日历 / 人力）；版本概览总人天投入改双行（日历总耗时 / 人力总投入） - 三个 Tab 加搜索框：300ms debounce + 标题/编号模糊匹配 - 性能优化：requirementIds/categories/requirements/testCases 转 Map/Set 索引、Row 组件 React.memo - 全局耗时显示统一带天数换算：8h（1天）、11h（1.4天） 新增文件: SearchInput.tsx, useDebouncedValue.ts, work-hours.ts, dev-task-transitions.ts, 设计文档 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
74 lines
3.2 KiB
TypeScript
74 lines
3.2 KiB
TypeScript
'use client';
|
|
|
|
import { AlertTriangle } from 'lucide-react';
|
|
import { StatusBadge } from './StatusBadge';
|
|
import { CategoryChip } from './CategoryChip';
|
|
import { getEstimateHours, getActualHours } from '@/lib/dev-task';
|
|
import { formatShortTime, formatWorkHours } from '@/lib/work-hours';
|
|
import type { DevTask } from '@/lib/dev-task';
|
|
import type { TaskCategory } from '@/lib/task-category';
|
|
|
|
interface Props {
|
|
task: DevTask;
|
|
category?: TaskCategory;
|
|
onClick?: () => void;
|
|
}
|
|
|
|
const PRIORITY_DOT: Record<string, string> = {
|
|
P0: 'bg-red-500',
|
|
P1: 'bg-orange-400',
|
|
P2: 'bg-blue-400',
|
|
P3: 'bg-zinc-300',
|
|
};
|
|
|
|
function timeRangeText(task: DevTask): { text: string; tone: string } {
|
|
if (task.status === 'submitted' && task.actualStartAt && task.actualEndAt) {
|
|
return { text: `实际 ${formatShortTime(task.actualStartAt)} → ${formatShortTime(task.actualEndAt)}`, tone: 'text-[var(--ink-muted)]' };
|
|
}
|
|
if (task.actualStartAt) {
|
|
return { text: `实际 ${formatShortTime(task.actualStartAt)} → 进行中`, tone: 'text-emerald-600' };
|
|
}
|
|
if (task.expectedStartAt && task.expectedEndAt) {
|
|
return { text: `预计 ${formatShortTime(task.expectedStartAt)} → ${formatShortTime(task.expectedEndAt)}`, tone: 'text-blue-600' };
|
|
}
|
|
return { text: '', tone: 'text-[var(--ink-muted)]' };
|
|
}
|
|
|
|
function hoursText(estimate: number, actual: number): { text: string; tone: string } {
|
|
if (actual <= 0) return { text: `预 ${formatWorkHours(estimate)}`, tone: 'text-[var(--ink-muted)]' };
|
|
let tone = 'text-[var(--ink-soft)]';
|
|
if (actual > estimate) tone = 'text-red-600';
|
|
else if (actual < estimate) tone = 'text-emerald-600';
|
|
return { text: `${formatWorkHours(actual)} / ${formatWorkHours(estimate)}`, tone };
|
|
}
|
|
|
|
export function DevTaskRow({ task, category, onClick }: Props) {
|
|
const estimate = getEstimateHours(task);
|
|
const actual = getActualHours(task);
|
|
const range = timeRangeText(task);
|
|
const hours = hoursText(estimate, actual);
|
|
|
|
return (
|
|
<div
|
|
onClick={onClick}
|
|
className="flex items-center gap-3 px-4 py-2.5 border-b border-[var(--line)] hover:bg-[var(--bg-subtle)] cursor-pointer transition-colors last:border-b-0"
|
|
>
|
|
<span className={`h-2 w-2 rounded-full shrink-0 ${PRIORITY_DOT[task.priority] || 'bg-zinc-300'}`} title={task.priority} />
|
|
<span className="text-[11px] font-mono text-[var(--ink-muted)] w-16 shrink-0">{task.taskNo}</span>
|
|
<div className="flex-1 min-w-0 flex items-center gap-1.5">
|
|
<span className="text-[13px] text-[var(--ink)] truncate">{task.title}</span>
|
|
{task.isBlocked && (
|
|
<span className="flex items-center gap-0.5 text-[10px] text-red-500 bg-red-50 px-1.5 py-0.5 rounded shrink-0" title={task.blockReason}>
|
|
<AlertTriangle className="h-2.5 w-2.5" />阻塞
|
|
</span>
|
|
)}
|
|
</div>
|
|
<CategoryChip category={category} />
|
|
<StatusBadge status={task.status} />
|
|
<span className={`text-[11px] tabular-nums shrink-0 ${range.tone}`} title={range.text}>{range.text}</span>
|
|
<span className={`text-[11px] tabular-nums w-40 text-right shrink-0 whitespace-nowrap ${hours.tone}`}>{hours.text}</span>
|
|
<span className="text-[11px] text-[var(--ink-soft)] w-14 text-right truncate shrink-0">{task.assigneeId}</span>
|
|
</div>
|
|
);
|
|
}
|