From 19c536a4f2f434851084ed1eed91bc5ec730a16d Mon Sep 17 00:00:00 2001
From: chiayin <chiayin.kuo@dsp.im>
Date: Tue, 31 Oct 2023 16:06:00 +0800
Subject: [PATCH] Map Timeframe: fix not mask.style error.

---
 src/components/Discover/Map/Filter/Timeframes.vue | 14 +++++---------
 src/components/Discover/Map/SidebarFilter.vue     |  2 +-
 2 files changed, 6 insertions(+), 10 deletions(-)

diff --git a/src/components/Discover/Map/Filter/Timeframes.vue b/src/components/Discover/Map/Filter/Timeframes.vue
index b96a4ab..b296850 100644
--- a/src/components/Discover/Map/Filter/Timeframes.vue
+++ b/src/components/Discover/Map/Filter/Timeframes.vue
@@ -38,6 +38,7 @@ import 'chartjs-adapter-date-fns';
 import getMoment from 'moment';
 
 export default{
+  props:['selectValue'],
   setup() {
     const allMapDataStore = AllMapDataStore();
     const { filterTimeframe, selectTimeFrame } = storeToRefs(allMapDataStore);
@@ -142,8 +143,10 @@ export default{
     resizeMask(chart) {
       let from = (this.selectArea[0] * 0.01) / (this.selectRange * 0.01);
       let to = (this.selectArea[1] * 0.01) / (this.selectRange * 0.01);
-      this.resizeLeftMask(chart, from);
-      this.resizeRightMask(chart, to);
+      if(this.selectValue[0] === 'Timeframes') {
+        this.resizeLeftMask(chart, from);
+        this.resizeRightMask(chart, to);
+      }
     },
     resizeLeftMask(chart, from) {
       const canvas = document.getElementById("chartCanvasId");
@@ -306,12 +309,5 @@ export default{
     this.endTime = this.startMaxDate;
     this.timeFrameStartEnd;
   },
-  beforeUnmount() {
-    this.selectArea = [0, this.selectRange];
-    this.resizeMask(this.chart);
-    this.startTime = new Date(getMoment(this.filterTimeframe.x_axis.min).format());
-    this.endTime = new Date(getMoment(this.filterTimeframe.x_axis.max).format());
-    this.timeFrameStartEnd;
-  }
 }
 </script>
diff --git a/src/components/Discover/Map/SidebarFilter.vue b/src/components/Discover/Map/SidebarFilter.vue
index 8842c36..e335953 100644
--- a/src/components/Discover/Map/SidebarFilter.vue
+++ b/src/components/Discover/Map/SidebarFilter.vue
@@ -89,7 +89,7 @@
           <!-- title: Trace -->
           <Trace v-if="selectValue[0] === 'Trace'" ref="filterTraceView"></Trace>
           <!-- title: Timeframes -->
-          <Timeframes v-if="selectValue[0] === 'Timeframes'"></Timeframes>
+          <Timeframes v-if="selectValue[0] === 'Timeframes'" :selectValue="selectValue"></Timeframes>
         </div>
 
         <!-- Button -->