diff --git a/src/assets/icons/donut_small.svg b/src/assets/icons/donut_small.svg
new file mode 100644
index 00000000..1c4cad71
--- /dev/null
+++ b/src/assets/icons/donut_small.svg
@@ -0,0 +1,17 @@
+
+
diff --git a/src/locales/lang/en.ts b/src/locales/lang/en.ts
index 26dc9d19..18fefeff 100644
--- a/src/locales/lang/en.ts
+++ b/src/locales/lang/en.ts
@@ -23,7 +23,6 @@ const msg = {
serviceMesh: "Service Mesh",
infrastructure: "Infrastructure",
virtualMachine: "Virtual Machine",
- kubernetes: "Kubernetes",
dashboardNew: "New Dashboard",
dashboardList: "Dashboard List",
logs: "Logs",
@@ -123,6 +122,9 @@ const msg = {
viewWarning: "You are entering view mode",
virtualDatabase: "Virtual Database",
reloadDashboards: "Reload dashboards",
+ kubernetesService: "Kubernetes Service",
+ kubernetesCluster: "Kubernetes Cluster",
+ kubernetes: "Kubernetes",
hourTip: "Select Hour",
minuteTip: "Select Minute",
secondTip: "Select Second",
diff --git a/src/locales/lang/zh.ts b/src/locales/lang/zh.ts
index f8702996..35b0c601 100644
--- a/src/locales/lang/zh.ts
+++ b/src/locales/lang/zh.ts
@@ -22,7 +22,6 @@ const msg = {
serviceMesh: "服务网格",
infrastructure: "基础结构",
virtualMachine: "虚拟机",
- kubernetes: "Kubernetes",
dashboardNew: "新建仪表板",
dashboardHome: "仪表盘首页",
dashboardList: "仪表盘列表",
@@ -123,6 +122,9 @@ const msg = {
viewWarning: "你正在进入预览模式",
virtualDatabase: "虚拟数据库",
reloadDashboards: "重新加载仪表盘",
+ kubernetesService: "Kubernetes服务",
+ kubernetesCluster: "Kubernetes集群",
+ kubernetes: "Kubernetes",
hourTip: "选择小时",
minuteTip: "选择分钟",
secondTip: "选择秒数",
diff --git a/src/router/index.ts b/src/router/index.ts
index 2102c00e..da15693d 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -26,11 +26,13 @@ import { routesAlarm } from "./alarm";
import { routesSelf } from "./selfObservability";
import { routesFunctions } from "./functions";
import { routesBrowser } from "./browser";
+import { routesK8s } from "./k8s";
const routes: Array = [
...routesGen,
...routesMesh,
...routesFunctions,
+ ...routesK8s,
...routesInfra,
...routesBrowser,
...routesDatabase,
diff --git a/src/router/infrastructure.ts b/src/router/infrastructure.ts
index 8a2783c7..c3c11dfe 100644
--- a/src/router/infrastructure.ts
+++ b/src/router/infrastructure.ts
@@ -38,14 +38,6 @@ export const routesInfra: Array = [
},
component: () => import("@/views/Layer.vue"),
},
- {
- path: "/kubernetes",
- name: "Kubernetes",
- meta: {
- title: "kubernetes",
- },
- component: () => import("@/views/Layer.vue"),
- },
// {
// path: "/infrastructure/vm",
// name: "VirtualMachine",
diff --git a/src/router/k8s.ts b/src/router/k8s.ts
new file mode 100644
index 00000000..1e7bf0b8
--- /dev/null
+++ b/src/router/k8s.ts
@@ -0,0 +1,50 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { RouteRecordRaw } from "vue-router";
+import Layout from "@/layout/Index.vue";
+
+export const routesK8s: Array = [
+ {
+ path: "",
+ name: "Kubernetes",
+ meta: {
+ title: "kubernetes",
+ icon: "donut_small",
+ hasGroup: true,
+ },
+ redirect: "/kubernetes/cluster",
+ component: Layout,
+ children: [
+ {
+ path: "/kubernetes/cluster",
+ name: "KubernetesCluster",
+ meta: {
+ title: "kubernetesCluster",
+ },
+ component: () => import("@/views/Layer.vue"),
+ },
+ {
+ path: "/kubernetes/service",
+ name: "KubernetesService",
+ meta: {
+ title: "kubernetesService",
+ },
+ component: () => import("@/views/Layer.vue"),
+ },
+ ],
+ },
+];
diff --git a/src/views/Layer.vue b/src/views/Layer.vue
index 16ef43f3..5e7954c0 100644
--- a/src/views/Layer.vue
+++ b/src/views/Layer.vue
@@ -43,7 +43,8 @@ const routesMap: { [key: string]: string } = {
Satellite: "SO11Y_SATELLITE",
Functions: "FAAS",
Browser: "BROWSER",
- Kubernetes: "K8S",
+ KubernetesCluster: "K8S",
+ KubernetesService: "K8S_SERVICE",
};
const layer = ref("GENERAL");
diff --git a/src/views/dashboard/graphs/EndpointList.vue b/src/views/dashboard/graphs/EndpointList.vue
index 21a4173b..aa4b717e 100644
--- a/src/views/dashboard/graphs/EndpointList.vue
+++ b/src/views/dashboard/graphs/EndpointList.vue
@@ -116,7 +116,6 @@ const selectorStore = useSelectorStore();
const dashboardStore = useDashboardStore();
const chartLoading = ref(false);
const endpoints = ref([]);
-const searchEndpoints = ref([]);
const pageSize = 5;
const total = 10;
const searchText = ref("");
@@ -136,7 +135,6 @@ async function queryEndpoints(limit?: number) {
ElMessage.error(resp.errors);
return;
}
- searchEndpoints.value = selectorStore.pods;
endpoints.value = selectorStore.pods.splice(0, pageSize);
if (props.config.isEdit || !endpoints.value.length) {
return;
@@ -178,7 +176,7 @@ function clickEndpoint(scope: any) {
);
}
function changePage(pageIndex: number) {
- endpoints.value = searchEndpoints.value.splice(
+ endpoints.value = selectorStore.pods.splice(
(pageIndex - 1 || 0) * pageSize,
pageSize * (pageIndex || 1)
);
diff --git a/src/views/dashboard/graphs/ServiceList.vue b/src/views/dashboard/graphs/ServiceList.vue
index 5f531224..0f40ec22 100644
--- a/src/views/dashboard/graphs/ServiceList.vue
+++ b/src/views/dashboard/graphs/ServiceList.vue
@@ -128,9 +128,9 @@ const dashboardStore = useDashboardStore();
const chartLoading = ref(false);
const pageSize = 5;
const services = ref([]);
-const searchServices = ref([]);
const searchText = ref("");
const groups = ref({});
+const sortServices = ref<(Service & { merge: boolean })[]>([]);
queryServices();
@@ -142,7 +142,16 @@ async function queryServices() {
if (resp.errors) {
ElMessage.error(resp.errors);
}
- const map: { [key: string]: any[] } = selectorStore.services.reduce(
+ setServices(selectorStore.services);
+ if (props.config.isEdit) {
+ return;
+ }
+ queryServiceMetrics(services.value);
+}
+
+function setServices(arr: (Service & { merge: boolean })[]) {
+ groups.value = {};
+ const map: { [key: string]: any[] } = arr.reduce(
(result: { [key: string]: any[] }, item: any) => {
item.group = item.group || "";
if (result[item.group]) {
@@ -156,21 +165,24 @@ async function queryServices() {
},
{}
);
- services.value = Object.values(map).flat(1).splice(0, pageSize);
+ sortServices.value = Object.values(map).flat(1);
const obj = {} as any;
- for (const s of services.value) {
+ for (const s of sortServices.value) {
s.group = s.group || "";
if (!obj[s.group]) {
obj[s.group] = 1;
} else {
+ if (obj[s.group] % 5 === 0) {
+ s.merge = false;
+ }
obj[s.group]++;
}
groups.value[s.group] = obj[s.group];
}
- if (props.config.isEdit) {
- return;
- }
- queryServiceMetrics(services.value);
+ services.value = sortServices.value.filter(
+ (d: Service, index: number) => index < pageSize
+ );
+ console.log(services.value);
}
function clickService(scope: any) {
@@ -219,21 +231,25 @@ function objectSpanMethod(param: any): any {
rowspan: 0,
colspan: 0,
};
- } else {
- return { rowspan: groups.value[param.row.group], colspan: 1 };
}
+ console.log(groups.value);
+ return { rowspan: 5, colspan: 1 };
}
function changePage(pageIndex: number) {
- services.value = services.value.splice(
- (pageIndex - 1 || 0) * pageSize,
- pageSize * (pageIndex || 1)
- );
+ services.value = sortServices.value.filter((d: Service, index: number) => {
+ if (
+ index >= (pageIndex - 1 || 0) * pageSize &&
+ index < pageSize * (pageIndex || 1)
+ ) {
+ return d;
+ }
+ });
}
function searchList() {
- searchServices.value = selectorStore.services.filter((d: { label: string }) =>
+ const searchServices = sortServices.value.filter((d: { label: string }) =>
d.label.includes(searchText.value)
);
- services.value = searchServices.value.splice(0, pageSize);
+ services.value = searchServices.splice(0, pageSize);
}
watch(
() => [props.config.metricTypes, props.config.metrics],