From dd7e8e226195bbf092d715ecdc676d8f0b042a3c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=9B=AE=E6=A3=83?= <BT-Muli@outlook.com>
Date: Mon, 13 Jan 2025 15:07:36 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=B8=20=E5=93=8D=E5=BA=94=E4=B8=BB?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/userGacha/gro-echarts.vue | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/userGacha/gro-echarts.vue b/src/components/userGacha/gro-echarts.vue
index f8fc86b0..41e63b09 100644
--- a/src/components/userGacha/gro-echarts.vue
+++ b/src/components/userGacha/gro-echarts.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="gro-echart">
-    <v-chart :option="getPoolData()" autoresize />
+    <v-chart :option="getPoolData()" autoresize :theme="echartsTheme" />
   </div>
 </template>
 <script lang="ts" setup>
@@ -20,8 +20,11 @@ import { LabelLayout } from "echarts/features.js";
 // @ts-expect-error no-exported-member
 import { CanvasRenderer } from "echarts/renderers.js";
 import type { EChartsOption } from "echarts/types/dist/shared.js";
-import { provide } from "vue";
-import VChart, { THEME_KEY } from "vue-echarts";
+import { storeToRefs } from "pinia";
+import { computed } from "vue";
+import VChart from "vue-echarts";
+
+import { useAppStore } from "@/store/modules/app.js";
 
 // echarts
 use([
@@ -33,14 +36,14 @@ use([
   CanvasRenderer,
   LabelLayout,
 ]);
-// 获取当前主题
-provide(THEME_KEY, "dark");
 
 interface GachaOverviewEchartsProps {
   modelValue: TGApp.Sqlite.GachaRecords.SingleTable[];
 }
 
 const props = defineProps<GachaOverviewEchartsProps>();
+const { theme } = storeToRefs(useAppStore());
+const echartsTheme = computed<"dark" | "light">(() => (theme.value === "dark" ? "dark" : "light"));
 
 // data
 const defaultOptions = <EChartsOption>{