9a0b16a8f1
- 需求模块：完整 CRUD、状态流转（采纳/拒绝/关闭）、详情抽屉、产品→项目级联选择 - 加班记录：产品→项目→版本三级联动、月份筛选（MonthPicker）、CSV 导出 - 成员管理：左右布局（部门树+成员列表）、手机号脱敏、初始密码自动生成及规则设置 - 角色管理：卡片列表、系统角色保护、CRUD - 通用组件：FilterSelect 下拉、MonthPicker 月份选择器、Pagination 分页 - 样式统一：状态标签加 border、日期输入现代化、筛选组件风格一致 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
24 lines
873 B
TypeScript
24 lines
873 B
TypeScript
import { Role, ROLES } from '@/lib/stage';
|
|
|
|
export function MemberChips({ members }: { members: { role: Role; name: string }[] }) {
|
|
if (!members || members.length === 0) return null;
|
|
const grouped = ROLES.reduce<Record<Role, string[]>>((acc, r) => {
|
|
acc[r.key] = members.filter((m) => m.role === r.key).map((m) => m.name);
|
|
return acc;
|
|
}, {} as Record<Role, string[]>);
|
|
return (
|
|
<div className="flex flex-wrap items-center gap-x-3 gap-y-1 text-[11px]">
|
|
{ROLES.map((r) => {
|
|
const names = grouped[r.key];
|
|
if (!names || names.length === 0) return null;
|
|
return (
|
|
<span key={r.key} className="inline-flex items-center gap-1 text-[var(--ink-soft)]">
|
|
<span className="font-medium text-[var(--ink-muted)]">{r.label}</span>
|
|
{names.join('/')}
|
|
</span>
|
|
);
|
|
})}
|
|
</div>
|
|
);
|
|
}
|