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

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

app/components/pages/support/DocumentFilter.vue

@@ -0,0 +1,113 @@
+<template>
+  <div class="document-category">
+    <el-row :gutter="12">
+      <el-col :span="12" :xs="12">
+        <span class="select-label">{{
+          $t('product-filter.product-type')
+        }}</span>
+        <el-select
+          v-model="model.selectedProductType"
+          :placeholder="$t('product-filter.select-product-type')"
+          clearable
+        >
+          <el-option
+            v-for="type in productTypeOptions"
+            :key="type.id"
+            :label="type.name"
+            :value="type.id"
+          />
+        </el-select>
+      </el-col>
+
+      <el-col :span="12" :xs="12">
+        <span class="select-label">{{
+          $t('product-filter.product-model')
+        }}</span>
+        <el-select
+          v-model="model.selectedProduct"
+          :placeholder="$t('product-filter.select-product-model')"
+          clearable
+        >
+          <el-option
+            v-for="product in productOptions"
+            :key="product.id"
+            :label="product.name"
+            :value="product.id"
+          />
+        </el-select>
+      </el-col>
+
+      <el-col :span="12" :xs="24">
+        <span class="select-label">
+          {{ $t('product-filter.document-type') }}
+        </span>
+        <el-select
+          v-model="model.selectedDocumentType"
+          :placeholder="$t('product-filter.select-document-type')"
+          clearable
+        >
+          <el-option
+            v-for="questionType in documentTypeOptions"
+            :key="questionType.id"
+            :label="questionType.name"
+            :value="questionType.id"
+          />
+        </el-select>
+      </el-col>
+
+      <el-col :span="12" :xs="24">
+        <span class="select-label">{{ $t('product-filter.keyword') }}</span>
+        <el-input
+          v-model="model.keyword"
+          :placeholder="$t('product-filter.enter-keyword')"
+          clearable
+          :prefix-icon="Search"
+        />
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup lang="ts">
+  import { Search } from '@element-plus/icons-vue';
+
+  defineProps({
+    productTypeOptions: {
+      type: Array as () => Array<DocumentListProductType>,
+      default: () => [],
+    },
+    productOptions: {
+      type: Array as () => Array<DocumentListProduct>,
+      default: () => [],
+    },
+    documentTypeOptions: {
+      type: Array as () => Array<DocumentTypeView>,
+      default: () => [],
+    },
+  });
+
+  const model = defineModel<{
+    selectedProduct: string | null;
+    selectedProductType: string | null;
+    selectedDocumentType: string | null;
+    keyword: string;
+  }>();
+</script>
+
+<style scoped>
+  .document-category {
+    margin-bottom: 1rem;
+    padding: 0 0;
+  }
+
+  .select-label {
+    color: var(--el-text-color-secondary);
+    font-size: 0.9rem;
+  }
+
+  :deep(.el-select__wrapper),
+  :deep(.el-input__wrapper) {
+    height: 40px;
+    font-size: 0.9rem;
+  }
+</style>