diff --git a/frontend/src/components/pure/ms-table/base-table.vue b/frontend/src/components/pure/ms-table/base-table.vue
index ecaa5c1e28..a9e45d6563 100644
--- a/frontend/src/components/pure/ms-table/base-table.vue
+++ b/frontend/src/components/pure/ms-table/base-table.vue
@@ -67,10 +67,7 @@
:filterable="item.filterable"
:cell-class="item.cellClass"
:header-cell-class="`${
- item.headerCellClass ||
- (item.filterConfig && isHighlightFilterBackground && activeDataIndex === item.dataIndex)
- ? 'header-cell-filter'
- : ''
+ item.headerCellClass || (item.filterConfig && hasSelectedFilter(item)) ? 'header-cell-filter' : ''
}`"
:body-cell-class="item.bodyCellClass"
:summary-cell-class="item.summaryCellClass"
@@ -109,9 +106,8 @@
:options="item.filterConfig.options"
:data-index="item.dataIndex"
v-bind="item.filterConfig"
+ :filter="filter"
@handle-confirm="(v) => handleFilterConfirm(v, item.dataIndex as string, item.isCustomParam || false)"
- @show="showFilter(true, item.dataIndex)"
- @hide="showFilter(false, item.dataIndex)"
>
@@ -304,6 +300,7 @@
BatchActionQueryParams,
MsPaginationI,
MsTableColumn,
+ MsTableColumnData,
MsTableDataItem,
MsTableProps,
} from './type';
@@ -640,11 +637,13 @@
columnSelectorVisible.value = true;
};
+ const filter = ref>({});
const handleFilterConfirm = (
value: string[] | (string | number)[] | undefined,
dataIndex: string,
isCustomParam: boolean
) => {
+ filter.value[dataIndex] = value;
emit('filterChange', dataIndex, value, isCustomParam);
};
@@ -653,11 +652,11 @@
batchLeft.value = getBatchLeft();
});
- const isHighlightFilterBackground = ref(false);
- const activeDataIndex = ref('');
- function showFilter(visible: boolean, dataIndex: string | undefined) {
- activeDataIndex.value = dataIndex;
- isHighlightFilterBackground.value = visible;
+ function hasSelectedFilter(item: MsTableColumnData) {
+ if (item.filterConfig && item.dataIndex) {
+ return (filter.value[item.dataIndex] || []).length > 0;
+ }
+ return false;
}
watch(
diff --git a/frontend/src/components/pure/ms-table/comp/defaultFilter.vue b/frontend/src/components/pure/ms-table/comp/defaultFilter.vue
index 6fd43466ec..f07c1bf97e 100644
--- a/frontend/src/components/pure/ms-table/comp/defaultFilter.vue
+++ b/frontend/src/components/pure/ms-table/comp/defaultFilter.vue
@@ -4,7 +4,7 @@
@@ -95,6 +95,8 @@
remoteMethod?: FilterRemoteMethodsEnum; // 加载选项方法
loadOptionParams?: Record; // 请求下拉的参数
placeholderText?: string;
+ dataIndex?: string | undefined;
+ filter: Record;
}>(),
{
mode: 'static',
@@ -150,6 +152,13 @@
loading.value = false;
}
};
+
+ const isHighlight = computed(() => {
+ if (props.filter && props.dataIndex) {
+ return (props.filter[props.dataIndex] || []).length > 0;
+ }
+ return false;
+ });
diff --git a/frontend/src/views/case-management/caseManagementFeature/components/recycleCaseTable.vue b/frontend/src/views/case-management/caseManagementFeature/components/recycleCaseTable.vue
index a78fff985e..af5ad193fb 100644
--- a/frontend/src/views/case-management/caseManagementFeature/components/recycleCaseTable.vue
+++ b/frontend/src/views/case-management/caseManagementFeature/components/recycleCaseTable.vue
@@ -112,7 +112,7 @@
-
+
@@ -200,10 +200,10 @@
import type { BatchActionParams, BatchActionQueryParams, MsTableColumn } from '@/components/pure/ms-table/type';
import useTable from '@/components/pure/ms-table/useTable';
import caseLevel from '@/components/business/ms-case-associate/caseLevel.vue';
+ import ExecuteStatusTag from '@/components/business/ms-case-associate/executeResult.vue';
import type { CaseLevel } from '@/components/business/ms-case-associate/types';
import MsTree from '@/components/business/ms-tree/index.vue';
import type { MsTreeNodeData } from '@/components/business/ms-tree/types';
- import ExecuteStatusTag from './excuteStatusTag.vue';
import {
batchDeleteRecycleCase,