From 8ca64226e69dda409f1580b098e967559107ca33 Mon Sep 17 00:00:00 2001
From: xream <xream@icloud.com>
Date: Tue, 19 Mar 2024 04:10:10 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=AF=8F=E4=B8=AA=E8=AE=A2=E9=98=85?=
 =?UTF-8?q?=E5=88=86=E7=BB=84=E7=9A=84=E5=B1=95=E5=BC=80=E7=8A=B6=E6=80=81?=
 =?UTF-8?q?=E5=8D=95=E7=8B=AC=E4=BF=9D=E5=AD=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json      |  4 +--
 src/views/Sub.vue | 67 +++++++++++++++++++++++++++++++----------------
 2 files changed, 47 insertions(+), 24 deletions(-)

diff --git a/package.json b/package.json
index bb88be795..dc756fb46 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "sub-store-front-end",
-  "version": "2.14.181",
+  "version": "2.14.182",
   "private": true,
   "scripts": {
     "dev": "vite --host",
@@ -11,7 +11,7 @@
   "dependencies": {
     "@codemirror/autocomplete": "^6.12.0",
     "@codemirror/buildhelper": "^1.0.1",
-    "@codemirror/commands": "^6.3.3", 
+    "@codemirror/commands": "^6.3.3",
     "@codemirror/language": "^6.10.1",
     "@codemirror/state": "^6.4.0",
     "@codemirror/view": "^6.23.1",
diff --git a/src/views/Sub.vue b/src/views/Sub.vue
index c2e204c69..b4a83a0c1 100644
--- a/src/views/Sub.vue
+++ b/src/views/Sub.vue
@@ -93,16 +93,16 @@
       </div>
       <div v-if="filterdSubsCount > 0">
         <div class="sticky-title-wrappers">
-          <p class="list-title" @click="toggleSubFold">
+          <p class="list-title" @click="toggleFold('sub')">
             <p>{{ $t(`specificWord.singleSub`) + '('+filterdSubsCount+')' }}</p>
-            <nut-icon v-if="!isSubFold" name="rect-down" size="12px"></nut-icon>
+            <nut-icon v-if="!isFold('sub')" name="rect-down" size="12px"></nut-icon>
             <nut-icon v-else name="rect-right" size="12px"></nut-icon>
           </p>
 
         </div>
 
         <draggable
-          v-if="!isSubFold"
+          v-if="!isFold('sub')"
           v-model="subs"
           item-key="name"
           :scroll-sensitivity="200"
@@ -134,15 +134,15 @@
 
       <div v-if="filterdColsCount > 0">
         <div class="sticky-title-wrappers">
-          <p class="list-title" @click="toggleColFold">
+          <p class="list-title" @click="toggleFold('col')">
             <p>{{ $t(`specificWord.collectionSub`) + '('+filterdColsCount+')'}}</p>
-            <nut-icon v-if="!isColFold" name="rect-down" size="12px"></nut-icon>
+            <nut-icon v-if="!isFold('col')" name="rect-down" size="12px"></nut-icon>
             <nut-icon v-else name="rect-right" size="12px"></nut-icon>
           </p>
         </div>
 
         <draggable
-          v-if="!isColFold"
+          v-if="!isFold('col')"
           v-model="collections"
           item-key="name"
           :scroll-sensitivity="200"
@@ -243,8 +243,8 @@ const subsApi = useSubsApi();
 const { t } = useI18n();
 
 const addSubBtnIsVisible = ref(false);
-const isSubFold = ref(localStorage.getItem('sub-fold') === '1');
-const isColFold = ref(localStorage.getItem('col-fold') === '1');
+// const isSubFold = ref(localStorage.getItem('sub-fold') === '1');
+// const isColFold = ref(localStorage.getItem('col-fold') === '1');
 const subsStore = useSubsStore();
 const globalStore = useGlobalStore();
 const { hasSubs, hasCollections, subs, collections } = storeToRefs(subsStore);
@@ -394,22 +394,45 @@ const handleDragEnd = (dataValue: any) => {
   }
   swipeDisabled.value = false;
 };
-const toggleSubFold = () => {
-  isSubFold.value = !isSubFold.value;
-  if (isSubFold.value) {
-    localStorage.setItem('sub-fold', '1')  
-  } else {
-    localStorage.removeItem('sub-fold')
-  }
-};
-const toggleColFold = () => {
-  isColFold.value = !isColFold.value;
-  if (isColFold.value) {
-    localStorage.setItem('col-fold', '1')  
+function getFoldState() {
+  let states = {}
+  try {
+    let raw = localStorage.getItem('sub-fold')
+    states = raw ? JSON.parse(raw) : {}
+  } catch (e) {}
+  return states;
+}
+const fold = ref(getFoldState());
+const isFold = (type) => {
+  return fold.value?.[type]?.[tag.value];
+}
+const toggleFold = (type) => {
+  if (fold.value?.[type]?.[tag.value]) {
+    delete fold.value[type][tag.value]
   } else {
-    localStorage.removeItem('col-fold')
+    if (!fold.value[type]) {
+      fold.value[type] = {}
+    }
+    fold.value[type][tag.value] = 1
   }
-};
+  localStorage.setItem('sub-fold', JSON.stringify(fold.value));
+}
+// const toggleSubFold = () => {
+//   isSubFold.value = !isSubFold.value;
+//   if (isSubFold.value) {
+//     localStorage.setItem('sub-fold', '1')  
+//   } else {
+//     localStorage.removeItem('sub-fold')
+//   }
+// };
+// const toggleColFold = () => {
+//   isColFold.value = !isColFold.value;
+//   if (isColFold.value) {
+//     localStorage.setItem('col-fold', '1')  
+//   } else {
+//     localStorage.removeItem('col-fold')
+//   }
+// };
 const setTag = (current) => {
   tag.value = current
 };