From dac0c6255d28594f69f616ea8fb55b734271bc0e Mon Sep 17 00:00:00 2001
From: puriphatt <puriphat@frappet.com>
Date: Fri, 7 Mar 2025 16:37:18 +0700
Subject: [PATCH] style: update tooltip theme and add scoped styles for
 apexcharts menu

---
 .../chart/ChartQuotationStatus.vue            |  6 +++++
 .../15_dash-board/chart/ChartReceipt.vue      | 24 +++++++------------
 2 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/pages/15_dash-board/chart/ChartQuotationStatus.vue b/src/pages/15_dash-board/chart/ChartQuotationStatus.vue
index 8792c6dd..832a0d37 100644
--- a/src/pages/15_dash-board/chart/ChartQuotationStatus.vue
+++ b/src/pages/15_dash-board/chart/ChartQuotationStatus.vue
@@ -105,3 +105,9 @@ const chartOptions = computed(() => ({
     ></VueApexCharts>
   </div>
 </template>
+
+<style scoped>
+:deep(.apexcharts-menu.apexcharts-menu-open) {
+  background: var(--surface-1);
+}
+</style>
diff --git a/src/pages/15_dash-board/chart/ChartReceipt.vue b/src/pages/15_dash-board/chart/ChartReceipt.vue
index 8b470064..75258162 100644
--- a/src/pages/15_dash-board/chart/ChartReceipt.vue
+++ b/src/pages/15_dash-board/chart/ChartReceipt.vue
@@ -23,21 +23,6 @@ const prop = withDefaults(
   },
 );
 const chartOptions = computed(() => {
-  const thaiMonths = [
-    'ม.ค.',
-    'ก.พ.',
-    'มี.ค.',
-    'เม.ย.',
-    'พ.ค.',
-    'มิ.ย.',
-    'ก.ค.',
-    'ส.ค.',
-    'ก.ย.',
-    'ต.ค.',
-    'พ.ย.',
-    'ธ.ค.',
-  ];
-
   return {
     colors: ['#035aa1', '#ae3ec9', '#ffa94d', '#e64980'],
     chart: {
@@ -47,6 +32,9 @@ const chartOptions = computed(() => {
         enabled: false,
       },
     },
+    tooltip: {
+      theme: 'dark',
+    },
     legend: {
       position: 'right',
     },
@@ -109,3 +97,9 @@ const detail = [
     </div>
   </div>
 </template>
+
+<style scoped>
+:deep(.apexcharts-menu.apexcharts-menu-open) {
+  background: var(--surface-1);
+}
+</style>