From 883cec92649d7441f0cde3c2350b87480b9a1230 Mon Sep 17 00:00:00 2001
From: Fine <fanxue0830@gmail.com>
Date: Mon, 10 Mar 2025 17:31:01 +0800
Subject: [PATCH] change theme for dowanload trace

---
 src/views/dashboard/related/trace/components/List.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/views/dashboard/related/trace/components/List.vue b/src/views/dashboard/related/trace/components/List.vue
index 20f072e2..518d1a1f 100644
--- a/src/views/dashboard/related/trace/components/List.vue
+++ b/src/views/dashboard/related/trace/components/List.vue
@@ -31,8 +31,10 @@ limitations under the License. -->
   import type { PropType } from "vue";
   import { useI18n } from "vue-i18n";
   import * as d3 from "d3";
+  import { useAppStoreWithOut } from "@/store/modules/app";
   import type { Span } from "@/types/trace";
   import Graph from "./D3Graph/Index.vue";
+  import { Themes } from "@/constants/data";
 
   /* global defineProps, Recordable*/
   const props = defineProps({
@@ -40,6 +42,7 @@ limitations under the License. -->
     traceId: { type: String, default: "" },
   });
   const { t } = useI18n();
+  const appStore = useAppStoreWithOut();
   const list = computed(() => Array.from(new Set(props.data.map((i: Span) => i.serviceCode))));
 
   function computedScale(i: number) {
@@ -58,7 +61,7 @@ limitations under the License. -->
     const context: any = canvas.getContext("2d");
     canvas.width = (d3.select(".trace-list-dowanload") as Recordable)._groups[0][0].clientWidth;
     canvas.height = (d3.select(".trace-list-dowanload") as Recordable)._groups[0][0].clientHeight;
-    context.fillStyle = "#fff";
+    context.fillStyle = appStore.theme === Themes.Dark ? "#212224" : `#fff`;
     context.fillRect(0, 0, canvas.width, canvas.height);
     const image = new Image();
     image.src = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(source)}`;