feat(web): add template status badges to deck drawer and tab bar

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
WeiCHEN
2026-09-13 02:50:19 +00:00
committed by weichen
co-authored by Cursor
parent 3da2324e7c
commit 9ca74422c9
+36 -3
View File
@@ -92,7 +92,10 @@ export const SlimTabBar: React.FC<SlimTabBarProps> = ({
};
}, []);
const getStatusDot = (state: DocLifecycleState) => {
const getStatusDot = (state: DocLifecycleState, isTemplateOnly?: boolean) => {
if (isTemplateOnly || state === 'template') {
return { color: '#0284c7', label: '初始模板' };
}
switch (state) {
case 'approved':
return { color: 'var(--success)', label: '已生效受控' };
@@ -149,7 +152,7 @@ export const SlimTabBar: React.FC<SlimTabBarProps> = ({
};
const currentCatInfo = categoryConfig[activeCategory] || categoryConfig.workflow;
const docStatus = activeDoc ? getStatusDot(activeDoc.lifecycleState) : null;
const docStatus = activeDoc ? getStatusDot(activeDoc.lifecycleState, activeDoc.isTemplateOnly) : null;
const isCompact = containerWidth < 460;
return (
@@ -326,6 +329,22 @@ export const SlimTabBar: React.FC<SlimTabBarProps> = ({
{activeDoc ? activeDoc.title : '请选择文档'}
</span>
{activeDoc?.isTemplateOnly && (
<span
style={{
fontSize: '9.5px',
color: '#0284c7',
background: '#e0f2fe',
padding: '1px 5px',
borderRadius: '3px',
fontWeight: 500,
flexShrink: 0,
}}
>
模板
</span>
)}
<ChevronDown size={11} style={{ color: 'var(--text-muted)', flexShrink: 0 }} />
</button>
@@ -362,7 +381,7 @@ export const SlimTabBar: React.FC<SlimTabBarProps> = ({
) : (
visibleTabs.map((doc) => {
const isCur = doc.docId === activeDocId;
const st = getStatusDot(doc.lifecycleState);
const st = getStatusDot(doc.lifecycleState, doc.isTemplateOnly);
return (
<button
key={doc.docId}
@@ -398,6 +417,20 @@ export const SlimTabBar: React.FC<SlimTabBarProps> = ({
<span style={{ flex: 1, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
{doc.title}
</span>
{doc.isTemplateOnly && (
<span
style={{
fontSize: '9.5px',
color: '#0284c7',
background: '#e0f2fe',
padding: '1px 4px',
borderRadius: '3px',
flexShrink: 0,
}}
>
模板
</span>
)}
{isCur && <Check size={11} color="var(--brand-500)" style={{ flexShrink: 0 }} />}
</button>
);