feat: 监控trace datasource插件开发

liangling0628 · liangling0628 · commit 69d0be7dfa8e · 2024-12-02T16:02:02.000+08:00
# Reviewed, transaction id: 25520
diff --git a/src/trace/src/components/QueryEditor.tsx b/src/trace/src/components/QueryEditor.tsx
@@ -1,5 +1,5 @@
 import { css } from '@emotion/css';
-import type { QueryEditorProps, SelectableValue } from '@grafana/data';
+import { type QueryEditorProps, type SelectableValue } from '@grafana/data';
 import {
   FileDropzone,
   HorizontalGroup,
@@ -18,6 +18,7 @@ import type TraceDatasource from '../datasource';
 import type { TraceQuery, JaegerQueryType } from '../types';
 import { SearchForm } from './SearchForm';
 import { t } from 'common/utils/utils';
+import { getTemplateSrv } from '@grafana/runtime';
 
 type Props = QueryEditorProps<TraceDatasource, TraceQuery>;
 
@@ -38,9 +39,12 @@ export function QueryEditor({ datasource, query, onChange, onRunQuery }: Props)
             value: item.app_name,
             label: item.app_name,
           })) || [];
-        // if (query.app_name && getTemplateSrv().containsTemplate(query.app_name)) {
-        //   appList.push(toOption(query.app_name));
-        // }
+        if (query.app_name && getTemplateSrv().containsTemplate(query.app_name)) {
+          appList.push({
+            value: query.app_name,
+            label: query.app_name,
+          });
+        }
         setAppOptions(appList);
         if (data.length && !query.app_name) {
           onChange({
diff --git a/src/trace/src/datasource.ts b/src/trace/src/datasource.ts
@@ -1,5 +1,4 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-
 import {
   type DataQueryRequest,
   type DataQueryResponse,
@@ -54,7 +53,12 @@ export default class TraceDatasource extends DataSourceApi<TraceQuery, QueryOpti
         ? 2
         : window?.grafanaBootData?.user.orgName;
   }
-
+  /**
+   *
+   * @param appName 应用名
+   * @param field 字段名
+   * @description 获取字段选项列表
+   */
   async loadOptions<
     T extends {
       text: string;
@@ -83,7 +87,11 @@ export default class TraceDatasource extends DataSourceApi<TraceQuery, QueryOpti
       ),
     );
   }
-
+  /**
+   *
+   * @param query 查询参数
+   * @description 是否符合查询条件
+   */
   isSearchFormValid(query: TraceQuery): boolean {
     return !!query.app_name;
   }
@@ -102,8 +110,8 @@ export default class TraceDatasource extends DataSourceApi<TraceQuery, QueryOpti
     if (target.queryType !== 'search' && target.query) {
       return this.request(QueryUrl.get_trace_detail, {
         data: {
-          app_name: target.app_name,
-          trace_id: target.query,
+          app_name: getTemplateSrv().replace(target.app_name, options.scopedVars),
+          trace_id: getTemplateSrv().replace(target.query, options.scopedVars),
           ...this.getTimeRange(),
           bk_biz_id: this.bizId,
         },
@@ -134,15 +142,10 @@ export default class TraceDatasource extends DataSourceApi<TraceQuery, QueryOpti
     ]);
     // remove empty properties
     let traceQuery = pickBy(traceInterpolated, identity);
-
-    // if (traceQuery.spans === ALL_OPERATIONS_KEY) {
-    //   traceQuery = omit(traceQuery, 'spans');
-    // }
-
     return this.request(QueryUrl.list_trace, {
       data: {
         ...this.getTimeRange(),
-        app_name: target.app_name,
+        app_name: getTemplateSrv().replace(target.app_name, options.scopedVars),
         bk_biz_id: this.bizId,
         filters: [
           ...convertTagsFilters({
diff --git a/src/trace/src/responseTransform.ts b/src/trace/src/responseTransform.ts
@@ -3,13 +3,9 @@ import {
   type DataSourceInstanceSettings,
   FieldType,
   MutableDataFrame,
-  type TraceLog,
   type TraceSpanRow,
 } from '@grafana/data';
-// import { transformTraceData } from 'grafana/app/features/explore/TraceView/components';
-
-import transformTraceData from './transform-trace-data';
-import type { JaegerResponse, Span, TraceProcess, TraceResponse } from './types';
+import type { JaegerResponse, Span, TraceLog, TraceProcess, TraceResponse } from './types';
 
 export function createTraceFrame(data: TraceResponse): DataFrame {
   const spans = data.spans.map(s => toSpanRow(s, data.processes));
@@ -37,7 +33,7 @@ export function createTraceFrame(data: TraceResponse): DataFrame {
     },
   });
 
-  for (const span of spans) {
+  for (const span of spans || []) {
     frame.add(span);
   }
 
@@ -78,25 +74,26 @@ export function createTableFrame(
         config: {
           unit: 'string',
           displayNameFromDS: 'Trace ID',
-          links: [
-            {
-              title: 'Trace: ${__value.raw}',
-              url: '',
-              internal: {
-                datasourceUid: instanceSettings.uid,
-                datasourceName: instanceSettings.name,
-                query: {
-                  query: '${__value.raw}',
-                  app_name: appName,
-                },
-              },
-            },
-          ],
+          // links: [
+          //   {
+          //     title: 'Trace: ${__value.raw}',
+          //     url: '',
+          //     internal: {
+          //       datasourceUid: instanceSettings.uid,
+          //       datasourceName: instanceSettings.name,
+          //       query: {
+          //         query: '${__value.raw}',
+          //         app_name: appName,
+          //       },
+          //     },
+          //   },
+          // ],
         },
       },
       { name: 'trace_name', type: FieldType.string, config: { displayNameFromDS: 'Trace name' } },
       { name: 'start_time', type: FieldType.time, config: { displayNameFromDS: 'Start time' } },
       { name: 'trace_duration', type: FieldType.number, config: { displayNameFromDS: 'Duration', unit: 'µs' } },
+      { name: 'app_name', type: FieldType.string, config: { displayNameFromDS: 'App Name' } },
     ],
     meta: {
       preferredVisualisationType: 'table',
@@ -108,25 +105,13 @@ export function createTableFrame(
   for (const trace of traceData) {
     frame.add({
       ...trace,
-      start_time: trace.start_time / 1000,
+      start_time: trace.start_time! / 1000,
+      app_name: appName,
     });
   }
-
+  console.info(frame, '==============');
   return frame;
 }
-function transformToTraceData(data: TraceResponse) {
-  const traceData = transformTraceData(data);
-  if (!traceData) {
-    return;
-  }
-
-  return {
-    traceID: traceData.traceID,
-    startTime: traceData.startTime / 1000,
-    duration: traceData.duration,
-    traceName: traceData.traceName,
-  };
-}
 
 export function transformToJaeger(data: MutableDataFrame): JaegerResponse {
   const traceResponse: TraceResponse = {
diff --git a/src/trace/src/transform-trace-data.tsx b/src/trace/src/transform-trace-data.tsx
@@ -1,17 +1,3 @@
-// Copyright (c) 2017 Uber Technologies, Inc.
-//
-// Licensed 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 { isEqual as _isEqual } from 'lodash';
 
 import type { TraceKeyValuePair, TraceSpan, Trace, TraceResponse, TraceProcess } from './types/trace';
diff --git a/src/trace/src/types.ts b/src/trace/src/types.ts
@@ -44,11 +44,14 @@ export type Span = {
 };
 
 export type TraceResponse = {
-  trace_id: string;
-  start_time: number;
-  trace_duration: number;
-  trace_name: string;
+  trace_id?: string;
+  start_time?: number;
+  trace_duration?: number;
+  trace_name?: string;
   warnings?: null | string[];
+  processes: Record<string, TraceProcess>;
+  spans: Span[];
+  traceID: string;
 };
 
 export type TraceQuery = {
