diff --git a/dbm-ui/frontend/src/components/cluster-details/common/graphData.ts b/dbm-ui/frontend/src/components/cluster-details/common/graphData.ts
index f64ad8b203..72c7855e1c 100644
--- a/dbm-ui/frontend/src/components/cluster-details/common/graphData.ts
+++ b/dbm-ui/frontend/src/components/cluster-details/common/graphData.ts
@@ -15,6 +15,8 @@ import _ from 'lodash';
import type { ResourceTopo } from '@services/types';
+import { ClusterTypes } from '@common/const';
+
const defaultNodeConfig = {
width: 296,
itemHeight: 28,
@@ -139,9 +141,9 @@ export class GraphData {
this.calcNodeLocations(firstRoot, groups, groupLines);
// es hdfs 集群特殊逻辑
- if (['es', 'hdfs'].includes(this.clusterType)) {
+ if (([ClusterTypes.ES, ClusterTypes.HDFS] as string[]).includes(this.clusterType)) {
this.calcHorizontalAlignLocations(groups);
- } else if (this.clusterType === 'spider') {
+ } else if (this.clusterType === ClusterTypes.TENDBCLUSTER) {
this.calcSpiderNodeLocations(rootGroups, groups);
}
diff --git a/dbm-ui/frontend/src/components/render-instances/RenderInstances.vue b/dbm-ui/frontend/src/components/render-instances/RenderInstances.vue
index 1dd3ffbb2f..5f25dba481 100644
--- a/dbm-ui/frontend/src/components/render-instances/RenderInstances.vue
+++ b/dbm-ui/frontend/src/components/render-instances/RenderInstances.vue
@@ -23,10 +23,10 @@
:style="{ color: highlightIps.includes(inst.ip) ? 'rgb(234 177 93)' : '#63656e' }">
{{ inst.ip }}:{{ inst.port }}
-
-
+ v-bk-tooltips="'Primary ctl'"
+ class="primary-ctl-box">P
@@ -276,6 +276,23 @@
.cluster-instances {
padding: 8px 0;
+ .primary-ctl-box {
+ width: 16px;
+ height: 16px;
+ padding: 0 4px;
+ font-size: 12px;
+ font-weight: 700;
+ color: #3A84FF;
+ cursor: pointer;
+ background: #F0F5FF;
+ border-radius: 2px;
+
+ &:hover {
+ color: #1768EF;
+ background: #E1ECFF;
+ }
+ }
+
.db-icon-copy {
display: none;
margin-top: 1px;