Merge branch 'main' of github.com:apache/skywalking-booster-ui into feat/mobile

2025-07-18 14:45:25 +00:00 · 2022-05-05 15:24:49 +08:00 · 2022-05-05 15:24:49 +08:00 · c78eeafeb8
commit c78eeafeb8
parent eac922c8e4 7d1bb43adb
10 changed files with 59 additions and 12 deletions
--- a/src/components/SelectSingle.vue
+++ b/src/components/SelectSingle.vue
@ -45,7 +45,7 @@ import { Option } from "@/types/app";
 const emit = defineEmits(["change"]);
 const props = defineProps({
  options: {
-    type: Array as PropType<(Option & { disabled: boolean })[]>,
+    type: Array as PropType<Option[]>,
    default: () => [],
  },
  value: {
--- a/src/locales/lang/en.ts
+++ b/src/locales/lang/en.ts
@ -242,6 +242,10 @@ const msg = {
  defaultDepth: "Default Depth",
  traceTagsTip: `Only tags defined in the core/default/searchableTracesTags are searchable.
  Check more details on the Configuration Vocabulary page`,
+  logTagsTip: `Only tags defined in the core/default/searchableLogsTags are searchable.
+  Check more details on the Configuration Vocabulary page`,
+  alarmTagsTip: `Only tags defined in the core/default/searchableAlarmTags are searchable.
+  Check more details on the Configuration Vocabulary page`,
  tagsLink: "Configuration Vocabulary page",
  addTag: "Please input a tag",
  log: "Log",
--- a/src/locales/lang/zh.ts
+++ b/src/locales/lang/zh.ts
@ -243,6 +243,10 @@ const msg = {
  defaultDepth: "默认深度",
  traceTagsTip:
    "只有core/default/searchableTracesTags中定义的标记才可搜索。查看配置词汇表页面上的更多详细信息。",
+  logTagsTip:
+    "只有core/default/searchableTracesTags中定义的标记才可搜索。查看配置词汇表页面上的更多详细信息。",
+  alarmTagsTip:
+    "只有core/default/searchableTracesTags中定义的标记才可搜索。查看配置词汇表页面上的更多详细信息。",
  tagsLink: "配置词汇页",
  addTag: "请添加标签",
  logCategory: "日志类别",
--- a/src/store/modules/profile.ts
+++ b/src/store/modules/profile.ts
@ -161,7 +161,13 @@ export const profileStore = defineStore({
        this.analyzeTrees = [];
        return res.data;
      }
-      this.segmentSpans = segment.spans;
+      this.segmentSpans = segment.spans.map((d: SegmentSpan) => {
+        return {
+          ...d,
+          segmentId: this.currentSegment.segmentId,
+          traceId: this.currentSegment.traceIds[0],
+        };
+      });
      if (!(segment.spans && segment.spans.length)) {
        this.analyzeTrees = [];
        return res.data;
--- a/src/store/modules/topology.ts
+++ b/src/store/modules/topology.ts
@ -410,6 +410,9 @@ export const topologyStore = defineStore({
      const idsC = this.calls
        .filter((i: Call) => i.detectPoints.includes("CLIENT"))
        .map((b: Call) => b.id);
+      if (!idsC.length) {
+        return;
+      }
      const param = await useQueryTopologyMetrics(linkClientMetrics, idsC);
      const res = await this.getCallClientMetrics(param);

@ -425,6 +428,9 @@ export const topologyStore = defineStore({
      const idsS = this.calls
        .filter((i: Call) => i.detectPoints.includes("SERVER"))
        .map((b: Call) => b.id);
+      if (!idsS.length) {
+        return;
+      }
      const param = await useQueryTopologyMetrics(linkServerMetrics, idsS);
      const res = await this.getCallServerMetrics(param);

@ -438,6 +444,9 @@ export const topologyStore = defineStore({
        return;
      }
      const ids = this.nodes.map((d: Node) => d.id);
+      if (!ids.length) {
+        return;
+      }
      const param = await useQueryTopologyMetrics(nodeMetrics, ids);
      const res = await this.getNodeMetricValue(param);

--- a/src/views/components/ConditionTags.vue
+++ b/src/views/components/ConditionTags.vue
@ -39,7 +39,17 @@ limitations under the License. -->
        >
          {{ t("tagsLink") }}
        </a>
-        <el-tooltip :content="t('traceTagsTip')">
+        <el-tooltip
+          :content="
+            t(
+              type === 'LOG'
+                ? 'logTagsTip'
+                : type === 'TRACE'
+                ? 'traceTagsTip'
+                : 'alarmTagsTip'
+            )
+          "
+        >
          <span>
            <Icon class="icon-help mr-5" iconName="help" size="middle" />
          </span>
--- a/src/views/dashboard/related/components/LogTable/LogService.vue
+++ b/src/views/dashboard/related/components/LogTable/LogService.vue
@ -22,12 +22,12 @@ limitations under the License. -->
      <span v-else-if="item.label === 'tags'">
        {{ tags }}
      </span>
-      <router-link
+      <!-- <router-link
        v-else-if="item.label === 'traceId' && !noLink"
        :to="{ name: 'trace', query: { traceid: data[item.label] } }"
      >
        <span :class="noLink ? '' : 'blue'">{{ data[item.label] }}</span>
-      </router-link>
+      </router-link> -->
      <span v-else>{{ data[item.label] }}</span>
    </div>
  </div>
--- a/src/views/dashboard/related/profile/components/TaskList.vue
+++ b/src/views/dashboard/related/profile/components/TaskList.vue
@ -124,12 +124,14 @@ limitations under the License. -->
 import { ref } from "vue";
 import dayjs from "dayjs";
 import { useI18n } from "vue-i18n";
+import { useSelectorStore } from "@/store/modules/selectors";
 import { useProfileStore } from "@/store/modules/profile";
 import { TaskLog, TaskListItem } from "@/types/profile";
 import { ElMessage } from "element-plus";

 const { t } = useI18n();
 const profileStore = useProfileStore();
+const selectorStore = useSelectorStore();
 const dateFormat = (date: number, pattern = "YYYY-MM-DD HH:mm:ss") =>
  dayjs(date).format(pattern);
 const viewDetail = ref<boolean>(false);
@ -150,7 +152,7 @@ async function viewTask(e: Event, item: TaskListItem) {
  viewDetail.value = true;
  selectedTask.value = item;
  service.value = (
-    profileStore.services.filter((s: any) => s.id === item.serviceId)[0] || {}
+    selectorStore.services.filter((s: any) => s.id === item.serviceId)[0] || {}
  ).label;
  const res = await profileStore.getTaskLogs({ taskID: item.id });

--- a/src/views/dashboard/related/trace/components/D3Graph/SpanDetail.vue
+++ b/src/views/dashboard/related/trace/components/D3Graph/SpanDetail.vue
@ -40,7 +40,7 @@ limitations under the License. -->
      <span class="g-sm-8 wba">{{ currentSpan.peer || "No Peer" }}</span>
    </div>
    <div class="mb-10 clear item">
-      <span class="g-sm-4 grey">{{ t("error") }}:</span>
+      <span class="g-sm-4 grey">{{ t("isError") }}:</span>
      <span class="g-sm-8 wba">{{ currentSpan.isError }}</span>
    </div>
    <div class="mb-10 clear item" v-for="i in currentSpan.tags" :key="i.key">
--- a/src/views/dashboard/related/trace/components/Table/TableItem.vue
+++ b/src/views/dashboard/related/trace/components/Table/TableItem.vue
@ -105,8 +105,12 @@ limitations under the License. -->
          <span>{{ data.serviceCode }}</span>
        </el-tooltip>
      </div>
-      <div class="application" v-show="headerType === 'profile'">
-        <span @click="viewSpanDetail">{{ t("view") }}</span>
+      <div
+        class="application"
+        v-show="headerType === 'profile'"
+        @click="viewSpan($event)"
+      >
+        <span>{{ t("view") }}</span>
      </div>
    </div>
    <div
@ -185,7 +189,7 @@ export default defineComponent({
    function toggle() {
      displayChildren.value = !displayChildren.value;
    }
-    function showSelectSpan(dom: any) {
+    function showSelectSpan(dom: HTMLSpanElement) {
      if (!dom) {
        return;
      }
@ -207,11 +211,18 @@ export default defineComponent({
      }
      viewSpanDetail(dom);
    }
+    function viewSpan(event: any) {
+      const dom = event.path.find((d: any) =>
+        d.className.includes("trace-item")
+      );
+      emit("select", props.data);
+      viewSpanDetail(dom);
+    }

-    function selectedItem(data: any) {
+    function selectedItem(data: HTMLSpanElement) {
      emit("select", data);
    }
-    function viewSpanDetail(dom: any) {
+    function viewSpanDetail(dom: HTMLSpanElement) {
      showSelectSpan(dom);
      showDetail.value = true;
    }
@ -226,6 +237,7 @@ export default defineComponent({
      showDetail,
      selectSpan,
      selectedItem,
+      viewSpan,
      t,
    };
  },