feat: 全站 PageShell 设计系统与专业 UI 统一

- 新增 PageShell/PageTabs/ContentPanel/PageLoading/PageEmpty 页面骨架
- index.css 设计令牌文档化,布局令牌与纯色主按钮(去除渐变粉彩)
- 全站路由页接入 PageShell,云账单三 Tab 为标杆
- 主题体系:跟随系统 + 主流/开发者分组,新增 Dracula/Tokyo Night,One Dark 暖灰差异化
- 登录页/侧栏/顶栏去渐变光球,企业克制风
- 修复 AIAlertAnalyzer JSX 与构建依赖导入问题
This commit is contained in:
Logan committed 2026-07-01 12:45:38 +08:00
1 parent 1acb0c49af
commit e363ded445
213 files changed
+7148 -6818

No files matched your search

@@ -34,25 +34,25 @@ export function NamespaceResourcePicker({
const orphan = value && !options.includes(value);
return (
<div className="flex items-center gap-2 flex-wrap flex-1 min-w-0">
<span className="text-[10px] text-slate-500 w-20 shrink-0">{label}</span>
<span className="text-[10px] dg-text-muted w-20 shrink-0">{label}</span>
<select
value={value || ''}
onChange={(e) => onChange(e.target.value)}
disabled={loading}
className="h-7 flex-1 min-w-[160px] max-w-xs bg-slate-800 border border-slate-700 rounded text-xs text-slate-300 px-2 font-mono"
className="h-7 flex-1 min-w-[160px] max-w-xs bg-[var(--dg-bg-tertiary)] border border-[var(--dg-border)] rounded text-xs text-[var(--dg-text-secondary)] px-2 font-mono"
>
<option value="" disabled>{options.length === 0 ? '暂无资源' : '请选择'}</option>
{orphan && <option value={value}>{value}(未在集群中找到)</option>}
{options.map((n) => <option key={n} value={n}>{n}</option>)}
</select>
<Button type="button" size="sm" variant="outline" className="h-7 px-2 border-slate-700 text-slate-400 text-xs" onClick={onRefresh} disabled={loading}>
<Button type="button" size="sm" variant="outline" className="h-7 px-2 border-[var(--dg-border)] dg-text-secondary text-xs" onClick={onRefresh} disabled={loading}>
{loading ? <Loader2 className="h-3 w-3 animate-spin" /> : <RefreshCw className="h-3 w-3" />}
</Button>
<Button type="button" size="sm" variant="outline" className="h-7 px-2 border-slate-700 text-blue-400 text-xs" onClick={onCreate}>
<Button type="button" size="sm" variant="outline" className="h-7 px-2 border-[var(--dg-border)] dg-text-blue text-xs" onClick={onCreate}>
<Plus className="h-3 w-3 mr-0.5" />新建
</Button>
{options.length === 0 && !orphan && (
<span className="text-[10px] text-amber-400/90">命名空间内暂无{label},请先新建</span>
<span className="text-[10px] dg-text-yellow/90">命名空间内暂无{label},请先新建</span>
)}
</div>
);
@@ -82,7 +82,7 @@ export function VolumeTypeFields({
onRefresh={onRefreshResources}
onCreate={() => onCreateResource('pvcs')}
/>
<label className="flex items-center gap-1.5 text-xs text-slate-400 cursor-pointer whitespace-nowrap pl-[88px]">
<label className="flex items-center gap-1.5 text-xs dg-text-secondary cursor-pointer whitespace-nowrap pl-[88px]">
<input type="checkbox" checked={!!vol.pvcReadOnly} onChange={(e) => onChange({ pvcReadOnly: e.target.checked })} className="accent-blue-500" />
卷只读
</label>
@@ -92,25 +92,25 @@ export function VolumeTypeFields({
if (vol.type === 'emptyDir') {
return (
<div className="flex items-center gap-2 flex-wrap">
<span className="text-[10px] text-slate-500 w-20 shrink-0">介质</span>
<span className="text-[10px] dg-text-muted w-20 shrink-0">介质</span>
<select value={vol.medium || ''} onChange={(e) => onChange({ medium: e.target.value })}
className="h-7 w-28 bg-slate-800 border border-slate-700 rounded text-xs text-slate-300 px-1.5">
className="h-7 w-28 bg-[var(--dg-bg-tertiary)] border border-[var(--dg-border)] rounded text-xs text-[var(--dg-text-secondary)] px-1.5">
<option value="">默认磁盘</option>
<option value="Memory">Memory</option>
</select>
<Input value={vol.sizeLimit || ''} onChange={(e) => onChange({ sizeLimit: e.target.value })}
placeholder="sizeLimit 如 512Mi" className="h-7 flex-1 min-w-[120px] bg-slate-800 border-slate-700 text-slate-300 text-xs font-mono" />
placeholder="sizeLimit 如 512Mi" className="h-7 flex-1 min-w-[120px] dg-input text-[var(--dg-text-secondary)] text-xs font-mono" />
</div>
);
}
if (vol.type === 'hostPath') {
return (
<div className="flex items-center gap-2 flex-wrap">
<span className="text-[10px] text-slate-500 w-20 shrink-0">主机路径</span>
<span className="text-[10px] dg-text-muted w-20 shrink-0">主机路径</span>
<Input value={vol.path || ''} onChange={(e) => onChange({ path: e.target.value })}
placeholder="/data/app" className="h-7 flex-1 min-w-[160px] bg-slate-800 border-slate-700 text-slate-300 text-xs font-mono" />
placeholder="/data/app" className="h-7 flex-1 min-w-[160px] dg-input text-[var(--dg-text-secondary)] text-xs font-mono" />
<select value={vol.pathType || 'Directory'} onChange={(e) => onChange({ pathType: e.target.value })}
className="h-7 w-28 bg-slate-800 border border-slate-700 rounded text-xs text-slate-300 px-1.5">
className="h-7 w-28 bg-[var(--dg-bg-tertiary)] border border-[var(--dg-border)] rounded text-xs text-[var(--dg-text-secondary)] px-1.5">
<option value="Directory">Directory</option>
<option value="File">File</option>
<option value="">默认</option>
@@ -121,11 +121,11 @@ export function VolumeTypeFields({
if (vol.type === 'nfs') {
return (
<div className="flex items-center gap-2 flex-wrap">
<span className="text-[10px] text-slate-500 w-20 shrink-0">NFS</span>
<span className="text-[10px] dg-text-muted w-20 shrink-0">NFS</span>
<Input value={vol.nfsServer || ''} onChange={(e) => onChange({ nfsServer: e.target.value })}
placeholder="Server IP" className="h-7 w-36 bg-slate-800 border-slate-700 text-slate-300 text-xs font-mono" />
placeholder="Server IP" className="h-7 w-36 dg-input text-[var(--dg-text-secondary)] text-xs font-mono" />
<Input value={vol.nfsPath || ''} onChange={(e) => onChange({ nfsPath: e.target.value })}
placeholder="/export/path" className="h-7 flex-1 min-w-[120px] bg-slate-800 border-slate-700 text-slate-300 text-xs font-mono" />
placeholder="/export/path" className="h-7 flex-1 min-w-[120px] dg-input text-[var(--dg-text-secondary)] text-xs font-mono" />
</div>
);
}
@@ -142,9 +142,9 @@ export function VolumeTypeFields({
onCreate={() => onCreateResource('configmaps')}
/>
<div className="flex items-center gap-2 pl-[88px]">
<span className="text-[10px] text-slate-500 shrink-0">键映射</span>
<span className="text-[10px] dg-text-muted shrink-0">键映射</span>
<Input value={vol.cmItems || ''} onChange={(e) => onChange({ cmItems: e.target.value })}
placeholder="key:path(可选,挂载子项)" className="h-7 flex-1 max-w-md bg-slate-800 border-slate-700 text-slate-300 text-xs font-mono" />
placeholder="key:path(可选,挂载子项)" className="h-7 flex-1 max-w-md dg-input text-[var(--dg-text-secondary)] text-xs font-mono" />
</div>
</div>
);
@@ -162,15 +162,15 @@ export function VolumeTypeFields({
onCreate={() => onCreateResource('secrets')}
/>
<div className="flex items-center gap-2 pl-[88px]">
<span className="text-[10px] text-slate-500 shrink-0">键映射</span>
<span className="text-[10px] dg-text-muted shrink-0">键映射</span>
<Input value={vol.secItems || ''} onChange={(e) => onChange({ secItems: e.target.value })}
placeholder="key:path(可选,挂载子项)" className="h-7 flex-1 max-w-md bg-slate-800 border-slate-700 text-slate-300 text-xs font-mono" />
placeholder="key:path(可选,挂载子项)" className="h-7 flex-1 max-w-md dg-input text-[var(--dg-text-secondary)] text-xs font-mono" />
</div>
</div>
);
}
if (vol.type === 'custom') {
return <p className="text-[11px] text-amber-400/80">未识别卷类型,保存时将保留原始 YAML 结构</p>;
return <p className="text-[11px] dg-text-yellow/80">未识别卷类型,保存时将保留原始 YAML 结构</p>;
}
return null;
}