From 09dec775d97a784779bf20014cfd4525dcbc8cd5 Mon Sep 17 00:00:00 2001 From: Qiuxia Fan Date: Sun, 20 Mar 2022 10:59:23 +0800 Subject: [PATCH 01/13] update topology --- src/store/modules/dashboard.ts | 3 +- src/views/dashboard/Edit.vue | 14 +- src/views/dashboard/List.vue | 1 - .../dashboard/configuration/Topology.vue | 52 ------ .../configuration/topology/StyleOptions.vue | 151 ------------------ src/views/dashboard/controls/Tab.vue | 1 + src/views/dashboard/controls/Topology.vue | 110 ++++--------- src/views/dashboard/panel/Layout.vue | 2 +- .../related/topology/components/Graph.vue | 19 ++- 9 files changed, 44 insertions(+), 309 deletions(-) delete mode 100644 src/views/dashboard/configuration/Topology.vue delete mode 100644 src/views/dashboard/configuration/topology/StyleOptions.vue diff --git a/src/store/modules/dashboard.ts b/src/store/modules/dashboard.ts index 30a465c4..64727a09 100644 --- a/src/store/modules/dashboard.ts +++ b/src/store/modules/dashboard.ts @@ -92,8 +92,7 @@ export const dashboardStore = defineStore({ ]; } if (type === "Topology") { - newItem.w = 4; - newItem.h = 6; + newItem.h = 36; newItem.graph = { fontColor: "white", backgroundColor: "green", diff --git a/src/views/dashboard/Edit.vue b/src/views/dashboard/Edit.vue index 3da6c974..002e8119 100644 --- a/src/views/dashboard/Edit.vue +++ b/src/views/dashboard/Edit.vue @@ -27,17 +27,7 @@ limitations under the License. --> :destroy-on-close="true" @closed="dashboardStore.setConfigPanel(false)" > - - - - - + @@ -48,8 +38,6 @@ import { useRoute } from "vue-router"; import GridLayout from "./panel/Layout.vue"; import Tool from "./panel/Tool.vue"; import Widget from "./configuration/Widget.vue"; -import TopologyConfig from "./configuration/Topology.vue"; -import Topology from "./related/topology/Index.vue"; import { useDashboardStore } from "@/store/modules/dashboard"; import { useAppStoreWithOut } from "@/store/modules/app"; diff --git a/src/views/dashboard/List.vue b/src/views/dashboard/List.vue index 08f03777..02d4edcb 100644 --- a/src/views/dashboard/List.vue +++ b/src/views/dashboard/List.vue @@ -122,7 +122,6 @@ import router from "@/router"; import { DashboardItem } from "@/types/dashboard"; import { saveFile, readFile } from "@/utils/file"; import { EntityType } from "./data"; -import { findLastKey } from "lodash"; /*global Nullable*/ const { t } = useI18n(); diff --git a/src/views/dashboard/configuration/Topology.vue b/src/views/dashboard/configuration/Topology.vue deleted file mode 100644 index cfd87a7a..00000000 --- a/src/views/dashboard/configuration/Topology.vue +++ /dev/null @@ -1,52 +0,0 @@ - - - - diff --git a/src/views/dashboard/configuration/topology/StyleOptions.vue b/src/views/dashboard/configuration/topology/StyleOptions.vue deleted file mode 100644 index 52f73ea9..00000000 --- a/src/views/dashboard/configuration/topology/StyleOptions.vue +++ /dev/null @@ -1,151 +0,0 @@ - - - - diff --git a/src/views/dashboard/controls/Tab.vue b/src/views/dashboard/controls/Tab.vue index 90f35349..bb77acd2 100644 --- a/src/views/dashboard/controls/Tab.vue +++ b/src/views/dashboard/controls/Tab.vue @@ -97,6 +97,7 @@ limitations under the License. --> :key="item.i" @click="clickTabGrid($event, item)" :class="{ active: activeTabWidget === item.i }" + drag-ignore-from="svg.d3-trace-tree, .dragger, .micro-topo-chart" > diff --git a/src/views/dashboard/configuration/Widget.vue b/src/views/dashboard/configuration/Widget.vue index 2f508f23..dd21b366 100644 --- a/src/views/dashboard/configuration/Widget.vue +++ b/src/views/dashboard/configuration/Widget.vue @@ -81,10 +81,10 @@ import { useDashboardStore } from "@/store/modules/dashboard"; import { useAppStoreWithOut } from "@/store/modules/app"; import { Option } from "@/types/app"; import graphs from "../graphs"; -import configs from "./graph-styles"; -import WidgetOptions from "./WidgetOptions.vue"; -import StandardOptions from "./StandardOptions.vue"; -import MetricOptions from "./MetricOptions.vue"; +import configs from "./widget/graph-styles"; +import WidgetOptions from "./widget/WidgetOptions.vue"; +import StandardOptions from "./widget/StandardOptions.vue"; +import MetricOptions from "./widget/MetricOptions.vue"; export default defineComponent({ name: "ConfigEdit", diff --git a/src/views/dashboard/configuration/MetricOptions.vue b/src/views/dashboard/configuration/widget/MetricOptions.vue similarity index 99% rename from src/views/dashboard/configuration/MetricOptions.vue rename to src/views/dashboard/configuration/widget/MetricOptions.vue index edc8a776..8682dae3 100644 --- a/src/views/dashboard/configuration/MetricOptions.vue +++ b/src/views/dashboard/configuration/widget/MetricOptions.vue @@ -96,7 +96,7 @@ import { ChartTypes, PodsChartTypes, ListEntity, -} from "../data"; +} from "../../data"; import { ElMessage } from "element-plus"; import Icon from "@/components/Icon.vue"; import { useQueryProcessor, useSourceProcessor } from "@/hooks/useProcessor"; diff --git a/src/views/dashboard/configuration/StandardOptions.vue b/src/views/dashboard/configuration/widget/StandardOptions.vue similarity index 99% rename from src/views/dashboard/configuration/StandardOptions.vue rename to src/views/dashboard/configuration/widget/StandardOptions.vue index 8b12c7e6..255ad1aa 100644 --- a/src/views/dashboard/configuration/StandardOptions.vue +++ b/src/views/dashboard/configuration/widget/StandardOptions.vue @@ -117,7 +117,7 @@ limitations under the License. --> diff --git a/src/views/dashboard/related/topology/components/Graph.vue b/src/views/dashboard/related/topology/components/Graph.vue index 85e16c92..bc93e020 100644 --- a/src/views/dashboard/related/topology/components/Graph.vue +++ b/src/views/dashboard/related/topology/components/Graph.vue @@ -23,7 +23,7 @@ limitations under the License. -->
- + {{ t("currentDepth") }}
diff --git a/src/locales/lang/en.ts b/src/locales/lang/en.ts index 56a8dc20..47d668cb 100644 --- a/src/locales/lang/en.ts +++ b/src/locales/lang/en.ts @@ -113,6 +113,11 @@ const msg = { noRoot: "Please set a root dashboard for", noWidget: "Please add widgets.", rename: "Rename", + selfObservability: "Self Observability", + satellite: "Satellite", + skyWalkingServer: "SkyWalking Server", + functions: "Functions", + browser: "Browser", hourTip: "Select Hour", minuteTip: "Select Minute", secondTip: "Select Second", diff --git a/src/locales/lang/zh.ts b/src/locales/lang/zh.ts index 3cec3c16..fccf9bdf 100644 --- a/src/locales/lang/zh.ts +++ b/src/locales/lang/zh.ts @@ -113,6 +113,11 @@ const msg = { showGroup: "显示分组", noWidget: "请添加组件", rename: "重命名", + selfObservability: "自观性", + satellite: "Satellite", + skyWalkingServer: "SkyWalking服务", + functions: "Functions", + browser: "浏览器", hourTip: "选择小时", minuteTip: "选择分钟", secondTip: "选择秒数", diff --git a/src/router/browser.ts b/src/router/browser.ts new file mode 100644 index 00000000..35746491 --- /dev/null +++ b/src/router/browser.ts @@ -0,0 +1,43 @@ +/** + * 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 routesBrowser: Array = [ + { + path: "", + name: "Browser", + meta: { + title: "browser", + icon: "epic", + }, + redirect: "/browser", + component: Layout, + children: [ + { + path: "/browser", + name: "Browser", + meta: { + title: "browser", + headPath: "/browser", + exact: true, + }, + component: () => import("@/views/Layer.vue"), + }, + ], + }, +]; diff --git a/src/router/functions.ts b/src/router/functions.ts new file mode 100644 index 00000000..a6b56edd --- /dev/null +++ b/src/router/functions.ts @@ -0,0 +1,43 @@ +/** + * 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 routesFunctions: Array = [ + { + path: "", + name: "Functions", + meta: { + title: "functions", + icon: "epic", + }, + redirect: "/functions", + component: Layout, + children: [ + { + path: "/functions", + name: "Functions", + meta: { + title: "functions", + headPath: "/functions", + exact: true, + }, + component: () => import("@/views/Layer.vue"), + }, + ], + }, +]; diff --git a/src/router/index.ts b/src/router/index.ts index 4d4c2fce..2102c00e 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -23,12 +23,18 @@ import { routesDashboard } from "./dashboard"; import { routesEvent } from "./event"; import { routesSetting } from "./setting"; import { routesAlarm } from "./alarm"; +import { routesSelf } from "./selfObservability"; +import { routesFunctions } from "./functions"; +import { routesBrowser } from "./browser"; const routes: Array = [ ...routesGen, ...routesMesh, - ...routesDatabase, + ...routesFunctions, ...routesInfra, + ...routesBrowser, + ...routesDatabase, + ...routesSelf, ...routesDashboard, ...routesAlarm, ...routesEvent, diff --git a/src/router/infrastructure.ts b/src/router/infrastructure.ts index 6ec33f27..db6304f2 100644 --- a/src/router/infrastructure.ts +++ b/src/router/infrastructure.ts @@ -25,26 +25,36 @@ export const routesInfra: Array = [ title: "infrastructure", icon: "scatter_plot", exact: true, - hasGroup: true, + hasGroup: false, }, + redirect: "/infrastructure", component: Layout, children: [ { - path: "/infrastructure/vm", - name: "VirtualMachine", + path: "/infrastructure", + name: "Linux", meta: { - title: "virtualMachine", + title: "linux", }, - component: () => import("@/views/infrastructure/Infrastructure.vue"), - }, - { - path: "/infrastructure/k8s", - name: "Kubernetes", - meta: { - title: "kubernetes", - }, - component: () => import("@/views/infrastructure/Infrastructure.vue"), + component: () => import("@/views/Layer.vue"), + // component: () => import("@/views/infrastructure/Infrastructure.vue"), }, + // { + // path: "/infrastructure/vm", + // name: "VirtualMachine", + // meta: { + // title: "virtualMachine", + // }, + // component: () => import("@/views/infrastructure/Infrastructure.vue"), + // }, + // { + // path: "/infrastructure/k8s", + // name: "Kubernetes", + // meta: { + // title: "kubernetes", + // }, + // component: () => import("@/views/infrastructure/Infrastructure.vue"), + // }, ], }, ]; diff --git a/src/router/selfObservability.ts b/src/router/selfObservability.ts new file mode 100644 index 00000000..98a8be8a --- /dev/null +++ b/src/router/selfObservability.ts @@ -0,0 +1,52 @@ +/** + * 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 routesSelf: Array = [ + { + path: "", + name: "SelfObservability", + redirect: "/self/skyWalkingServer", + meta: { + title: "selfObservability", + icon: "bar_chart", + hasGroup: true, + }, + component: Layout, + children: [ + { + path: "/self/skyWalkingServer", + name: "SkyWalkingServer", + meta: { + title: "skyWalkingServer", + headPath: "/mesh/services", + }, + component: () => import("@/views/Layer.vue"), + }, + { + path: "/self/satellite", + name: "Satellite", + meta: { + title: "satellite", + headPath: "/mesh/controlPanel", + }, + component: () => import("@/views/Layer.vue"), + }, + ], + }, +]; diff --git a/src/views/Layer.vue b/src/views/Layer.vue index 7e43f14b..ed1f418e 100644 --- a/src/views/Layer.vue +++ b/src/views/Layer.vue @@ -34,6 +34,11 @@ const routeNames = [ "MeshServices", "ControlPanel", "DataPanel", + "Linux", + "SkyWalkingServer", + "Satellite", + "Functions", + "Browser", ]; const layer = ref("GENERAL"); getDashboard(); @@ -69,6 +74,21 @@ function setLayer(n: string) { case routeNames[4]: layer.value = "MESH_DP"; break; + case routeNames[5]: + layer.value = "OS_LINUX"; + break; + case routeNames[6]: + layer.value = "SO11Y_OAP"; + break; + case routeNames[7]: + layer.value = "SO11Y_SATELLITE"; + break; + case routeNames[8]: + layer.value = "FAAS"; + break; + case routeNames[9]: + layer.value = "BROWSER"; + break; default: layer.value = "GENERAL"; break; diff --git a/src/views/dashboard/configuration/widget/MetricOptions.vue b/src/views/dashboard/configuration/widget/MetricOptions.vue index 89c4664e..e542dd40 100644 --- a/src/views/dashboard/configuration/widget/MetricOptions.vue +++ b/src/views/dashboard/configuration/widget/MetricOptions.vue @@ -150,16 +150,11 @@ async function setMetricType(catalog?: string) { states.metricList = (json.data.metrics || []).filter( (d: { catalog: string; type: string }) => { if (states.isList || graph.type === "Table") { - if ( - d.type === MetricsType.REGULAR_VALUE && - catalog === (MetricCatalog as any)[d.catalog] - ) { + if (d.type === MetricsType.REGULAR_VALUE) { return d; } } else { - if (catalog === (MetricCatalog as any)[d.catalog]) { - return d; - } + return d; } } );