- DeploymentWorkload: 三模式切换(查看/编辑/YAML编辑)+ EditModeContainer Tab 导航系统 - DeploymentEditBasic: 新增基本信息 Tab — replicas/labels/annotations/selector 编辑 - YamlViewer: 升级为 CodeMirror 6(语法高亮+行号+折叠+括号匹配),新增 inline 内联模式 - DeploymentDetailPage: mode 类型扩展为 view|edit|yaml - 路由 :mode 参数自动支持 yaml 值 - M7-M9 Tab 预留占位(容器信息/存储/高级/服务)
48 lines
1.7 KiB
TypeScript
48 lines
1.7 KiB
TypeScript
// DeploymentDetailPage.tsx — 路由包装:解析 cluster/namespace/mode/name
|
||
// 支持 Kuboard 风格三模式路由:
|
||
// view: /kubernetes/:c/namespace/:n/workload/view/Deployment/:name
|
||
// edit: /kubernetes/:c/namespace/:n/workload/edit/Deployment/:name
|
||
// yaml: /kubernetes/:c/namespace/:n/workload/yaml/Deployment/:name
|
||
// 兼容旧路由: /kubernetes/:c/namespace/:n/deployments/:name(默认 view)
|
||
// 作者: Logan <admin@attacker.club>
|
||
import { useParams, useNavigate } from 'react-router-dom';
|
||
import { DeploymentWorkload } from './DeploymentWorkload';
|
||
|
||
export type WorkloadMode = 'view' | 'edit' | 'yaml';
|
||
|
||
export default function DeploymentDetailPage() {
|
||
const params = useParams<{
|
||
clusterCode: string;
|
||
namespace: string;
|
||
name: string;
|
||
mode?: string; // 'view' | 'edit' | 'yaml'(新路由)
|
||
workloadKind?: string; // 'Deployment'(新路由,预留扩展)
|
||
}>();
|
||
|
||
const navigate = useNavigate();
|
||
const clusterCode = params.clusterCode || '';
|
||
const namespace = params.namespace || '';
|
||
const deploymentName = params.name || '';
|
||
const currentMode: WorkloadMode = (params.mode === 'edit' || params.mode === 'yaml') ? params.mode : 'view';
|
||
|
||
// 模式切换:在 view/edit/yaml 路由间跳转
|
||
const handleModeChange = (m: WorkloadMode) => {
|
||
if (m === currentMode) return;
|
||
navigate(
|
||
`/kubernetes/${clusterCode}/namespace/${namespace}/workload/${m}/Deployment/${deploymentName}`,
|
||
{ replace: true }
|
||
);
|
||
};
|
||
|
||
return (
|
||
<DeploymentWorkload
|
||
clusterCode={clusterCode}
|
||
namespace={namespace}
|
||
deploymentName={deploymentName}
|
||
mode={currentMode}
|
||
onBack={() => navigate(-1)}
|
||
onModeChange={handleModeChange}
|
||
/>
|
||
);
|
||
}
|