feat: 文档库页面添加文档类型筛选功能

- 功能添加：添加按照文档类型筛选文档的功能
- 组件更改：将筛选器由product-filter改为document-filter

app/pages/support/documents.vue

@@ -10,13 +10,15 @@
         <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
       </div>
       <div class="page-content">
-        <product-filter
+        <document-filter
           v-model="filters"
           :product-type-options="productTypeOptions"
           :product-options="productOptions"
+          :document-type-options="documentTypeOptions"
         />
-        <!-- <document-list :documents="filteredDocuments" /> -->
+
         <document-list :documents="paginatedDocuments" />
+
         <el-pagination
           v-model:current-page="page"
           class="justify-center pagination-container"
@@ -39,7 +41,8 @@
   ];
 
   const filters = reactive({
-    selectedType: null as string | null,
+    selectedDocumentType: null as string | null,
+    selectedProductType: null as string | null,
     selectedProduct: null as string | null,
     keyword: '',
   });
@@ -49,6 +52,24 @@
 
   const { data: documents, pending, error } = await useDocumentList();
 
+  const documentTypeOptions = computed(() => {
+    const types: DocumentTypeView[] = [];
+    documents.value.forEach((doc: DocumentListView) => {
+      if (!types.some((item) => item.id === doc.type.id)) {
+        if (doc.type.id === '-1') {
+          types.push({
+            id: '-1',
+            name: $t('product-filter.misc'),
+          });
+        } else {
+          types.push(doc.type);
+        }
+      }
+    });
+
+    return types;
+  });
+
   const productTypeOptions = computed(() => {
     const types: DocumentListProductType[] = [];
     documents.value.forEach((doc: DocumentListView) => {
@@ -64,13 +85,13 @@
   });
 
   const productOptions = computed(() => {
-    if (!filters.selectedType) return [];
+    if (!filters.selectedProductType) return [];
     const products: DocumentListProduct[] = [];
 
     documents.value.forEach((doc: DocumentListView) => {
       doc.products?.forEach((product: DocumentListProduct) => {
         if (
-          product.type.id === filters.selectedType &&
+          product.type.id === filters.selectedProductType &&
           !products.some((item) => item.id === product.id)
         ) {
           products.push(product);
@@ -93,14 +114,18 @@
             (product: DocumentListProduct) =>
               product.id === filters.selectedProduct
           )
-        : filters.selectedType
+        : filters.selectedProductType
           ? doc.products?.some(
               (product: DocumentListProduct) =>
-                product.type?.id === filters.selectedType
+                product.type?.id === filters.selectedProductType
             )
           : true;
 
-      return matchProduct;
+      const matchDocumentType = filters.selectedDocumentType
+        ? doc.type.id === filters.selectedDocumentType
+        : true;
+
+      return matchProduct && matchDocumentType;
     });
   });
 
@@ -112,7 +137,7 @@
   });
 
   watch(
-    () => filters.selectedType,
+    () => filters.selectedProductType,
     () => {
       filters.selectedProduct = null;
     }
@@ -152,12 +177,6 @@
     margin-left: auto;
   }
 
-  .document-category {
-    padding: 0rem 2rem;
-    gap: 4px;
-    margin-bottom: 0.5rem;
-  }
-
   .page-content {
     padding: 1rem 2rem 2rem;
   }