WuYongJie/furniture-3d-system-Wu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(product-archive): add select-all to header filter option lists

Browse Source
This commit is contained in:
WuYongJie 2026-09-08 14:43:37 +08:00
parent 0b4311a882
commit c9d2f37ead
2 changed files with 26 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
furniture-3d-system/src/app/supply-chain/database/product-archive/ProductArchiveFilterOptionList.tsx
View File

@ -16,12 +16,14 @@ export function ProductArchiveFilterOptionList({
filters,
selectedValues,
onToggle,
onSelectAll,
}: {
field: ProductArchiveFilterOptionKey
placeholder: string
filters: ProductArchiveFilters
selectedValues: string[]
onToggle: (value: string) => void
onSelectAll: (values: string[]) => void
}) {
const requestIdRef = useRef(0)
const [searchText, setSearchText] = useState('')
@ -86,9 +88,18 @@ export function ProductArchiveFilterOptionList({
</button>
)}
</div>
{selectedValues.length > 0 && (
<div className="archive-header-filter-selected-summary">已选 {selectedValues.length} 项</div>
)}
<div className="archive-header-filter-selected-summary">
<span>{selectedValues.length > 0 ? `已选 ${selectedValues.length} 项` : `共 ${visibleOptions.length} 项`}</span>
{visibleOptions.length > 0 && (
<button
type="button"
className="archive-header-filter-select-all"
onClick={() => onSelectAll(visibleOptions)}
>
全选
</button>
)}
</div>
<div
className="archive-header-filter-options"
onScroll={(event) => {
@ -132,7 +143,15 @@ export function ProductArchiveFilterOptionList({
display: inline-flex; align-items: center; justify-content: center; padding: 0;
border: none; background: transparent; color: #a1a1aa; cursor: pointer;
}
.archive-header-filter-selected-summary { padding: 8px 3px 5px; color: #52525b; font-size: 12px; font-weight: 600; }
.archive-header-filter-selected-summary {
display: flex; align-items: center; justify-content: space-between; gap: 6px;
padding: 8px 3px 5px; color: #52525b; font-size: 12px; font-weight: 600;
}
.archive-header-filter-select-all {
padding: 0; border: none; background: transparent; color: #2563eb;
font-size: 12px; font-weight: 600; cursor: pointer;
}
.archive-header-filter-select-all:hover { text-decoration: underline; }
.archive-header-filter-options {
display: flex; max-height: 254px; flex-direction: column; gap: 2px; margin-top: 8px; overflow-y: auto;
}

3
furniture-3d-system/src/app/supply-chain/database/product-archive/ProductArchiveHeaderFilter.tsx
View File

@ -164,6 +164,9 @@ export function ProductArchiveHeaderFilter({
filters={filters}
selectedValues={selectedValues}
onToggle={toggleOption}
onSelectAll={(values) => {
setSelectedValues((current) => [...new Set([...current, ...values])])
}}
/>
)}