feat: 问题列表添加问题类型筛选功能
All checks were successful
deploy to server / build-and-deploy (push) Successful in 3m4s

- 功能添加:添加问题筛选功能
- 组件更改:将product-filter改为question-filter
- 文本添加:i18n文本添加
This commit is contained in:
2025-12-03 16:59:11 +08:00
parent 55a35b5498
commit a4dc28fc97
4 changed files with 155 additions and 10 deletions

View File

@ -11,10 +11,11 @@
</div>
<div class="page-content">
<product-filter
<question-filter
v-model="filters"
:product-type-options="productTypeOptions"
:product-options="productOptions"
:question-type-options="questionTypeOptions"
/>
<question-list :questions="paginatedQuestions" />
@ -37,8 +38,9 @@
const route = useRoute();
const filters = reactive({
selectedType: null as string | null,
selectedQuestionType: null as string | null,
selectedProduct: null as string | null,
selectedProductType: null as string | null,
keyword: '',
});
@ -57,6 +59,23 @@
const { data: questions, pending, error } = await useQuestionList();
const questionTypeOptions = computed(() => {
const types: QuestionTypeView[] = [];
questions.value.forEach((q: QuestionListView) => {
if (!types.some((t) => t.id === q.type.id)) {
if (q.type.id === '-1') {
types.push({
id: '-1',
name: $t('product-filter.misc'),
});
} else {
types.push(q.type);
}
}
});
return types;
});
const productTypeOptions = computed(() => {
const types: QuestionListProductType[] = [];
questions.value.forEach((q: QuestionListView) => {
@ -71,12 +90,12 @@
});
const productOptions = computed(() => {
if (!filters.selectedType) return [];
if (!filters.selectedProductType) return [];
const products: QuestionListProduct[] = [];
questions.value.forEach((q: QuestionListView) => {
q.products.forEach((product: QuestionListProduct) => {
if (
product.type.id === filters.selectedType &&
product.type.id === filters.selectedProductType &&
!products.some((p) => p.id === product.id)
) {
products.push(product);
@ -98,14 +117,18 @@
(product: QuestionListProduct) =>
product.id === filters.selectedProduct
)
: filters.selectedType
: filters.selectedProductType
? question.products?.some(
(product: QuestionListProduct) =>
product.type.id === filters.selectedType
product.type.id === filters.selectedProductType
)
: true;
return matchProduct;
const matchQuestionType = filters.selectedQuestionType
? question.type.id === filters.selectedQuestionType
: true;
return matchProduct && matchQuestionType;
});
});
@ -138,7 +161,7 @@
);
watch(
() => filters.selectedType,
() => filters.selectedProductType,
() => {
filters.selectedProduct = null;
}