feat: add config and create querys to get metric data

This commit is contained in:
Qiuxia Fan
2022-01-06 15:55:25 +08:00
parent e234361853
commit c282655369
15 changed files with 294 additions and 36 deletions

View File

@@ -19,17 +19,24 @@ import { store } from "@/store";
import { LayoutConfig } from "@/types/dashboard";
import graph from "@/graph";
import { AxiosResponse } from "axios";
import { ConfigData } from "./data";
import { useAppStoreWithOut } from "@/store/modules/app";
interface DashboardState {
showConfig: boolean;
layout: LayoutConfig[];
selectedWidget: Nullable<LayoutConfig>;
entity: string;
layerId: string;
}
export const dashboardStore = defineStore({
id: "dashboard",
state: (): DashboardState => ({
layout: [],
layout: [ConfigData],
showConfig: false,
selectedWidget: ConfigData,
entity: "",
layerId: "",
}),
actions: {
setLayout(data: LayoutConfig[]) {
@@ -55,6 +62,15 @@ export const dashboardStore = defineStore({
setConfigPanel(show: boolean) {
this.showConfig = show;
},
selectWidget(widget: Nullable<LayoutConfig>) {
this.selectedWidget = ConfigData || widget;
},
setLayer(id: string) {
this.layerId = id;
},
setEntity(type: string) {
this.entity = type;
},
async fetchMetricType(item: string) {
const res: AxiosResponse = await graph
.query("queryTypeOfMetrics")
@@ -62,6 +78,28 @@ export const dashboardStore = defineStore({
return res.data;
},
async fetchMetricValue(config: LayoutConfig) {
if (!config.queryMetricType) {
return;
}
const appStoreWithOut = useAppStoreWithOut();
const variable = {
condition: {
name: "service_resp_time",
entity: {
normal: true,
scope: "Service",
serviceName: "agentless::app",
},
},
duration: appStoreWithOut.durationTime,
};
const res: AxiosResponse = await graph
.query(config.queryMetricType)
.params(variable);
return res.data;
},
},
});

39
src/store/modules/data.ts Normal file
View File

@@ -0,0 +1,39 @@
/**
* 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 { LayoutConfig } from "@/types/dashboard";
export const ConfigData: LayoutConfig = {
x: 0,
y: 0,
w: 8,
h: 12,
i: "0",
metrics: ["service_resp_time"],
queryMetricType: "readMetricsValues",
visualization: "Line",
widget: {
title: "Title",
tips: "Tooltip",
},
graph: {
showBackground: true,
barWidth: 30,
},
standard: {
sortOrder: "DEC",
unit: "s",
},
};