feat: 订阅分组增加默认未分组, 组合订阅选择订阅分组优化

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sub-store-front-end",
-  "version": "2.14.174",
+  "version": "2.14.175",
   "private": true,
   "scripts": {
     "dev": "vite --host",

src/locales/en.ts

@@ -8,6 +8,7 @@ export default {
     unknownSource: 'Unknown Source',
     unknown: 'Unknown',
     all: 'All',
+    untagged: 'Untagged',
   },
   globalNotify: {
     refresh: {

src/locales/zh.ts

@@ -8,6 +8,7 @@ export default {
     unknownSource: '未知来源',
     unknown: '未知',
     all: '全部',
+    untagged: '未分组',
   },
   globalNotify: {
     refresh: {

src/views/Sub.vue

@@ -121,7 +121,7 @@
           @end="handleDragEnd(subs)"
         >
           <template #item="{ element }">
-            <div :key="element.name" class="draggable-item" v-show="tag === 'all' || element.tag.includes(tag)">
+            <div :key="element.name" class="draggable-item" v-show="shouldShowElement(element)">
               <SubListItem
                 :sub="element"
                 type="sub"
@@ -161,7 +161,7 @@
           @end="handleDragEnd(collections)"
         >
           <template #item="{ element }">
-            <div :key="element.name" class="draggable-item" v-show="tag === 'all' || element.tag.includes(tag)">
+            <div :key="element.name" class="draggable-item" v-show="shouldShowElement(element)">
               <SubListItem
                 :collection="element"
                 type="collection"
@@ -259,7 +259,7 @@ const swipeDisabled = ref(false);
 const touchStartY = ref(null);
 const touchStartX = ref(null);
 const sortFailed = ref(false);
-
+const hasUntagged = ref(false);
 const tags = computed(() => {
   if(!hasSubs.value && !hasCollections.value) return []
   // 从 subs 和 collections 中获取所有的 tag, 去重
@@ -269,28 +269,38 @@ const tags = computed(() => {
       sub.tag.forEach(i => {
         set.add(i)
       });
+    } else {
+      hasUntagged.value = true
     }
   })
   collections.value.forEach(col => {
     if (Array.isArray(col.tag) && col.tag.length > 0) {
       col.tag.forEach(i => {
         set.add(i)
       });
+    } else {
+      hasUntagged.value = true
     }
   })
 
   let tags: any[] = Array.from(set)
   if(tags.length === 0) return []
   tags = tags.map(i => ({ label: i, value: i }));
   
-  return [{ label: t("specificWord.all"), value: "all" }, ...tags]
+  const result = [{ label: t("specificWord.all"), value: "all" }, ...tags]
+  if(hasUntagged.value) result.push({ label: t("specificWord.untagged"), value: "untagged" })
+  return result
 });
 const tag = ref('all');
 const filterdSubsCount = computed(() => {
-  return subs.value.filter(i => tag.value === 'all' || i.tag.includes(tag.value)).length
+  if(tag.value === 'all') return subs.value.length
+  if(tag.value === 'untagged') return subs.value.filter(i => !Array.isArray(i.tag) || i.tag.length === 0).length
+  return subs.value.filter(i => i.tag.includes(tag.value)).length
 });
 const filterdColsCount = computed(() => {
-  return collections.value.filter(i => tag.value === 'all' || i.tag.includes(tag.value)).length
+  if(tag.value === 'all') return collections.value.length
+  if(tag.value === 'untagged') return collections.value.filter(i => !Array.isArray(i.tag) || i.tag.length === 0).length
+  return collections.value.filter(i => i.tag.includes(tag.value)).length
 });
 const onTouchStart = (event: TouchEvent) => {
   touchStartY.value = Math.abs(event.touches[0].clientY);
@@ -403,6 +413,11 @@ const toggleColFold = () => {
 const setTag = (current) => {
   tag.value = current
 };
+const shouldShowElement = (element) => {
+  if(tag.value === 'all') return true
+  if(tag.value === 'untagged') return !Array.isArray(element.tag) || element.tag.length === 0
+  return element.tag.includes(tag.value)
+};
 </script>
 
 <style lang="scss" scoped>

src/views/SubEditor.vue

@@ -206,7 +206,7 @@
 
         <template v-else-if="editType === 'collections'">
           <nut-form-item
-            :label="$t(`editorPage.subConfig.basic.subscriptions.label`)"
+            :label="$t(`editorPage.subConfig.basic.subscriptions.label`)+ selectedSubs"
             prop="subscriptions"
             class="include-subs-wrapper"
           >
@@ -219,7 +219,7 @@
             >
               <nut-checkbox
                 v-for="item in subsSelectList"
-                v-show="tag === 'all' || item[3].includes(tag)"
+                v-show="shouldShowElement(item[3])"
                 :key="item[0]"
                 :label="item[0]"
                 text-position="left"
@@ -353,6 +353,7 @@
       ];
     });
   });
+  const hasUntagged = ref(false);
   const tags = computed(() => {
     if(!subsStore.subs || subsStore.subs.length === 0) return []
     const set = new Set()
@@ -361,17 +362,23 @@
         sub.tag.forEach(i => {
           set.add(i)
         });
+      } else {
+        hasUntagged.value = true
       }
     })
 
     let tags: any[] = Array.from(set)
     if(tags.length === 0) return []
     tags = tags.map(i => ({ label: i, value: i }));
-    
-    return [{ label: t("specificWord.all"), value: "all" }, ...tags]
+    const result = [{ label: t("specificWord.all"), value: "all" }, ...tags]
+    if(hasUntagged.value) result.push({ label: t("specificWord.untagged"), value: "untagged" })
+    return result
   });
   const tag = ref('all');
-
+  const selectedSubs = computed(() => {
+    if(!Array.isArray(form.subscriptions) || form.subscriptions.length === 0) return ''
+    return `: ${form.subscriptions.join(', ')}`
+  });
   const compareTableIsVisible = ref(false);
   usePopupRoute(compareTableIsVisible);
   const compareData = ref();
@@ -710,6 +717,11 @@
   const setTag = (current) => {
     tag.value = current
   };
+  const shouldShowElement = (element) => {
+    if(tag.value === 'all') return true
+    if(tag.value === 'untagged') return !Array.isArray(element) || element.length === 0
+    return element.includes(tag.value)
+  };
 </script>
 
 <style lang="scss" scoped>