From 30941d6a9d8e922e82d63e86c6a7e041aec8a192 Mon Sep 17 00:00:00 2001 From: Qiuxia Fan Date: Thu, 10 Mar 2022 23:22:06 +0800 Subject: [PATCH] add templates --- src/constants/templates.ts | 298 +++++++++++++++++++++++++++++ src/graphql/fragments/app.ts | 9 + src/graphql/fragments/dashboard.ts | 9 - src/graphql/query/app.ts | 4 +- src/graphql/query/dashboard.ts | 8 +- src/layout/components/AppMain.vue | 11 ++ src/layout/components/NavBar.vue | 11 +- src/store/modules/app.ts | 21 +- src/views/Settings.vue | 1 - 9 files changed, 336 insertions(+), 36 deletions(-) create mode 100644 src/constants/templates.ts diff --git a/src/constants/templates.ts b/src/constants/templates.ts new file mode 100644 index 00000000..c3f97573 --- /dev/null +++ b/src/constants/templates.ts @@ -0,0 +1,298 @@ +/** + * 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. + */ +export const All = { + id: "0", + configuration: { + name: "Global", + isRoot: true, + children: [ + { + w: 8, + h: 12, + i: "0", + metrics: ["all_heatmap"], + metricTypes: ["readHeatMap"], + type: "Widget", + widget: { + title: "all_heatmap", + tips: "Tooltip", + }, + graph: { + type: "HeatMap", + }, + standard: { + unit: "ms", + }, + }, + { + w: 8, + h: 12, + i: "1", + metrics: ["all_percentile"], + metricTypes: ["readLabeledMetricsValues"], + type: "Widget", + metricLabels: "P50, P75, P90, P95, P99", + labelsIndex: "0, 1, 2, 3, 4", + widget: { + title: "Global Response Latency", + tips: "Tooltip", + }, + graph: { + type: "Line", + }, + standard: { + unit: "percentile in ms", + }, + }, + { + w: 8, + h: 12, + i: "3", + metrics: ["service_cpm"], + metricTypes: ["readMetricsValues"], + type: "Widget", + widget: { + title: "Service List", + tips: "Tooltip", + }, + graph: { + type: "ServiceList", + dashboardName: "123", + fontSize: 12, + }, + standard: { + unit: "percentile in ms", + }, + }, + ], + }, +}; + +export const Service = { + id: "1", + configuration: { + name: "Service", + isRoot: true, + children: [ + { + w: 8, + h: 12, + i: "0", + metrics: ["service_apdex"], + metricTypes: ["readMetricsValue"], + type: "Widget", + widget: { + title: "Service Apdex", + tips: "Tooltip", + }, + graph: { + type: "Card", + }, + standard: { + aggregation: "/", + aggregationNum: "10000", + }, + }, + { + w: 8, + h: 12, + i: "1", + metrics: ["service_sla"], + metricTypes: ["readMetricsValue"], + type: "Widget", + widget: { + title: "Successful Rate", + tips: "Tooltip", + }, + graph: { + type: "Card", + }, + standard: { + unit: "%", + aggregation: "/", + aggregationNum: "100", + }, + }, + { + w: 8, + h: 12, + i: "2", + metrics: ["service_cpm"], + metricTypes: ["readMetricsValue"], + type: "Widget", + widget: { + title: "Service Load", + tips: "For HTTP 1/2, gRPC, RPC services, this means Calls Per Minute (CPM), for TCP services, this means Packets Per Minute (PPM)", + }, + graph: { + type: "Card", + }, + standard: { + unit: "CPM / PPM", + aggregation: "/", + aggregationNum: "100", + }, + }, + { + w: 8, + h: 12, + i: "3", + metrics: ["service_cpm"], + metricTypes: ["readMetricsValues"], + type: "Widget", + widget: { + title: "Service cpm", + tips: "For HTTP 1/2, gRPC, RPC services, this means Calls Per Minute (CPM), for TCP services, this means Packets Per Minute (PPM)", + }, + graph: { + type: "Card", + }, + standard: { + unit: "CPM / PPM", + aggregation: "/", + aggregationNum: "100", + }, + }, + { + w: 8, + h: 12, + i: "4", + metrics: ["service_resp_time"], + metricTypes: ["readMetricsValues"], + type: "Widget", + widget: { + title: "Service Avg Response Time", + }, + graph: { + type: "Line", + }, + standard: { + unit: "ms", + }, + }, + { + w: 8, + h: 12, + i: "5", + metrics: ["service_apdex"], + metricTypes: ["readMetricsValues"], + type: "Widget", + widget: { + title: "Service Apdex", + }, + graph: { + type: "Line", + }, + standard: { + aggregation: "/", + aggregationNum: "10000", + }, + }, + { + w: 8, + h: 12, + i: "6", + metrics: ["service_percentile"], + metricTypes: ["readLabeledMetricsValues"], + type: "Widget", + metricLabels: "P50, P75, P90, P95, P99", + labelsIndex: "0, 1, 2, 3, 4", + widget: { + title: "Service Response Time Percentile", + }, + graph: { + type: "Line", + }, + standard: { + unit: "ms", + }, + }, + { + w: 8, + h: 12, + i: "7", + metrics: ["service_sla"], + metricTypes: ["readMetricsValues"], + type: "Widget", + widget: { + title: "Successful Rate", + }, + graph: { + type: "Line", + }, + standard: { + unit: "%", + aggregation: "/", + aggregationNum: "100", + }, + }, + { + w: 8, + h: 12, + i: "8", + metrics: ["service_throughput_received", "service_throughput_sent"], + metricTypes: ["readMetricsValues", "readMetricsValues"], + type: "Widget", + widget: { + title: "Service Throughput", + }, + graph: { + type: "Line", + }, + standard: { + unit: "Bytes", + tips: "This metrics is only avaible for TCP services", + }, + }, + { + w: 8, + h: 12, + i: "9", + metrics: ["service_mq_consume_count"], + metricTypes: ["readMetricsValues"], + type: "Widget", + widget: { + title: "Message Queue Consuming Count", + }, + graph: { + type: "Line", + }, + standard: { + tips: "The number of consumed messages.", + }, + }, + { + w: 8, + h: 12, + i: "10", + metrics: ["service_mq_consume_latency"], + metricTypes: ["readMetricsValues"], + type: "Widget", + widget: { + title: "Message Queue Consuming Count", + }, + graph: { + type: "Line", + }, + standard: { + unit: "ms", + tips: "The avg latency of message consuming. Latency = timestamp(received) - timestamp(producing)", + }, + }, + ], + }, +}; diff --git a/src/graphql/fragments/app.ts b/src/graphql/fragments/app.ts index 120b270a..f4b1374c 100644 --- a/src/graphql/fragments/app.ts +++ b/src/graphql/fragments/app.ts @@ -26,3 +26,12 @@ export const OAPTimeInfo = { export const OAPVersion = { query: `version { version }`, }; + +export const getAllTemplates = { + query: ` + getAllTemplates { + id, + configuration, + } + `, +}; diff --git a/src/graphql/fragments/dashboard.ts b/src/graphql/fragments/dashboard.ts index d16fa504..8631039b 100644 --- a/src/graphql/fragments/dashboard.ts +++ b/src/graphql/fragments/dashboard.ts @@ -30,12 +30,3 @@ export const listMetrics = { } `, }; - -export const getAllTemplates = { - query: ` - getAllTemplates { - id, - configuration, - } - `, -}; diff --git a/src/graphql/query/app.ts b/src/graphql/query/app.ts index d538c417..afd7747b 100644 --- a/src/graphql/query/app.ts +++ b/src/graphql/query/app.ts @@ -14,8 +14,10 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { OAPTimeInfo, OAPVersion } from "../fragments/app"; +import { OAPTimeInfo, OAPVersion, getAllTemplates } from "../fragments/app"; export const queryOAPTimeInfo = `query queryOAPTimeInfo {${OAPTimeInfo.query}}`; export const queryOAPVersion = `query ${OAPVersion.query}`; + +export const getTemplates = `query queryTemplates {${getAllTemplates.query}}`; diff --git a/src/graphql/query/dashboard.ts b/src/graphql/query/dashboard.ts index abcee17d..5ff9e092 100644 --- a/src/graphql/query/dashboard.ts +++ b/src/graphql/query/dashboard.ts @@ -14,14 +14,8 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { - TypeOfMetrics, - listMetrics, - getAllTemplates, -} from "../fragments/dashboard"; +import { TypeOfMetrics, listMetrics } from "../fragments/dashboard"; export const queryTypeOfMetrics = `query typeOfMetrics(${TypeOfMetrics.variable}) {${TypeOfMetrics.query}}`; export const queryMetrics = `query queryData(${listMetrics.variable}) {${listMetrics.query}}`; - -export const getTemplates = `query queryOAPTimeInfo {${getAllTemplates.query}}`; diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue index 9c965f5f..0b4f6042 100644 --- a/src/layout/components/AppMain.vue +++ b/src/layout/components/AppMain.vue @@ -22,11 +22,22 @@ limitations under the License. -->