添加选择缓存

修改点击交易所BUG

src/views/depth/index.vue

@@ -63,7 +63,9 @@ let times = ref();
 let myChart = shallowRef();
 
 watch(isUpdate, (value) => {
+  window.sessionStorage.setItem("_4L_K_V_ISUPDATE", JSON.stringify(value));
   if (value) {
+    clearInterval(timer.value);
     timer.value = setInterval(() => {
       getIncrementalDepth();
     }, 1000);
@@ -74,13 +76,18 @@ watch(isUpdate, (value) => {
 
 // 获取交易所
 const getExchange = () => {
+  const ISUPDATE = JSON.parse(window.sessionStorage.getItem("_4L_K_V_ISUPDATE") || "true");
+  isUpdate.value = ISUPDATE;
   pageLoading.value = true;
   get_exchange({}, (data: any) => {
     pageLoading.value = false;
     if (data.code == 200) {
       exchangeList.value = data.data;
-      getSymbol([exchangeList.value[0]]);
-      selectedExchangeList.value = [exchangeList.value[0]];
+      const EXCHANGE_LIST = JSON.parse(window.sessionStorage.getItem("_4L_K_V_S_EXCHANGELIST") || "[]");
+      const SYMBOL = window.sessionStorage.getItem("_4L_K_V_S_SYMBOL") || "";
+      selectedExchangeList.value = EXCHANGE_LIST.length == 0 ? [exchangeList.value[0]] : EXCHANGE_LIST;
+      selectedSymbol.value = SYMBOL;
+      getSymbol(selectedExchangeList.value);
     }
   });
 };
@@ -92,7 +99,10 @@ const getSymbol = (exchange: Array<string>) => {
   get_coin(params, (data: any) => {
     if (data.code == 200) {
       symbolList.value = data.data;
-      handleSelectedSymbol(data.data[0]);
+      if (!data.data.includes(selectedSymbol.value)) {
+        selectedSymbol.value = data.data[0];
+      }
+      handleSelectedSymbol(selectedSymbol.value);
     }
   });
 };
@@ -100,9 +110,9 @@ const getSymbol = (exchange: Array<string>) => {
 // 选择交易所
 const handleExchange = (value: string) => {
   selectedExchangeList.value.includes(value) ? (selectedExchangeList.value = selectedExchangeList.value.filter((item) => item != value)) : selectedExchangeList.value.push(value);
-  if (selectedExchangeList.value.length != 0) {
-    getSymbol(selectedExchangeList.value);
-  } else {
+  window.sessionStorage.setItem("_4L_K_V_S_EXCHANGELIST", JSON.stringify(selectedExchangeList.value || []));
+  getSymbol(selectedExchangeList.value);
+  if (selectedExchangeList.value.length == 0) {
     myChart.value.setOption({
       xAxis: {
         type: "category",
@@ -120,6 +130,7 @@ const handleExchange = (value: string) => {
 // 根据币对查询数据
 const handleSelectedSymbol = (value: any) => {
   if (!selectedSymbol.value || !symbolList.value.includes(selectedSymbol.value)) selectedSymbol.value = value;
+  window.sessionStorage.setItem("_4L_K_V_S_SYMBOL", value);
   getDepthInfo(value);
 };
 
@@ -139,6 +150,7 @@ const getDepthInfo = (symbol: string) => {
 
 // 获取增量数据
 const getIncrementalDepth = () => {
+  // let time = times.value[times.value.length - 1] - 5;
   let time = times.value[times.value.length - 1];
   const params = { exchange: selectedExchangeList.value.join(","), coin: selectedSymbol.value, startTime: time };
   get_incremental_depth(params, (data: any) => {
@@ -153,6 +165,7 @@ const getIncrementalDepth = () => {
           });
           if (oldData) {
             oldData.data = oldData.data.slice(item.data.length);
+            // oldData.data = oldData.data.slice(0, oldData.data.length - 5);
             oldData.data.push(...item.data);
             isUpdate = true;
           }
@@ -160,6 +173,7 @@ const getIncrementalDepth = () => {
         });
         if (isUpdate) {
           times.value = times.value.slice(data.data.time.length);
+          // times.value = times.value.slice(0, times.value.length - 5);
           times.value.push(...data.data.time);
           isUpdate = false;
         }
@@ -230,13 +244,6 @@ const initChart = (data: any) => {
       },
       axisPointer: { type: "cross" },
     },
-    // toolbox: {
-    //   feature: {
-    //     saveAsImage: {
-    //       type: "png",
-    //     },
-    //   },
-    // },
     dataZoom: [
       {
         type: "inside",