diff --git a/src/modules/assets/components/FlowAnalysisModal.tsx b/src/modules/assets/components/FlowAnalysisModal.tsx index 6b9acff..4281de3 100644 --- a/src/modules/assets/components/FlowAnalysisModal.tsx +++ b/src/modules/assets/components/FlowAnalysisModal.tsx @@ -48,7 +48,8 @@ function groupRows(rows: FlowDetailItem[], dimensions: Dimension[]): FlowGroup[] group.rows.push(row); groups.set(key, group); } - return Array.from(groups.values()).sort((a, b) => b.rows.length - a.rows.length || a.key.localeCompare(b.key, 'zh-CN')); + const dateIndex = dimensions.indexOf('date'); + return Array.from(groups.values()).sort((a, b) => (dateIndex >= 0 ? b.values[dateIndex].localeCompare(a.values[dateIndex]) : 0) || b.rows.length - a.rows.length || a.key.localeCompare(b.key, 'zh-CN')); } export function FlowAnalysisModal(props: FlowAnalysisModalProps) { @@ -68,7 +69,8 @@ function FlowAnalysisContent({ selectedFlow, selectedFlowDetails, setSelectedFlo useDialogFocus(true, dialog, close); const rows = useMemo(() => selectedFlowDetails.filter(row => matchesType(row, selectedFlow.type) - && ('date' in selectedFlow ? row.date === selectedFlow.date : row.date >= selectedFlow.start && row.date <= selectedFlow.end)), [selectedFlowDetails, selectedFlow]); + && ('date' in selectedFlow ? row.date === selectedFlow.date : row.date >= selectedFlow.start && row.date <= selectedFlow.end)) + .sort((a, b) => b.date.localeCompare(a.date) || (b.eventTime || '').localeCompare(a.eventTime || '')), [selectedFlowDetails, selectedFlow]); const filterOptions = useMemo(() => Object.fromEntries(DIMENSIONS.map(({ key }) => { const eligible = rows.filter(row => DIMENSIONS.every(({ key: other }) => other === key || !filters[other]?.length || filters[other]!.includes(dimensionValue(row, other)))); const counts = new Map(); @@ -79,7 +81,8 @@ function FlowAnalysisContent({ selectedFlow, selectedFlowDetails, setSelectedFlo const filteredRows = useMemo(() => rows.filter(row => DIMENSIONS.every(({ key }) => !filters[key]?.length || filters[key]!.includes(dimensionValue(row, key)))), [rows, filters]); const groups = useMemo(() => { const flat = groupRows(filteredRows, dimensions); - return mergeActive ? orderDimensionGroups(flat, dimensions.length, group => group.values, group => group.rows.length) : flat; + return mergeActive ? orderDimensionGroups(flat, dimensions.length, group => group.values, group => group.rows.length, dimensions.includes('date') ? 'label' : 'count-desc', + (a, b, index) => dimensions[index] === 'date' ? b.values[index].localeCompare(a.values[index]) : a.values[index].localeCompare(b.values[index], 'zh-CN')) : flat; }, [filteredRows, dimensions, mergeActive]); const detailGroup = useMemo(() => detailKey === null ? null : groups.find(group => group.key === detailKey), [groups, detailKey]); const detailRows = detailGroup?.rows ?? EMPTY_FLOW_ROWS; diff --git a/src/modules/assets/components/overview/FlowStatisticsCard.tsx b/src/modules/assets/components/overview/FlowStatisticsCard.tsx index 181a85b..9f94d5b 100644 --- a/src/modules/assets/components/overview/FlowStatisticsCard.tsx +++ b/src/modules/assets/components/overview/FlowStatisticsCard.tsx @@ -1,4 +1,4 @@ -import { CalendarDays, ChevronDown, Download, Loader2 } from 'lucide-react'; +import { CalendarDays, ChevronDown, Download, ListFilter, Loader2 } from 'lucide-react'; import { AnimatePresence, motion } from 'motion/react'; import type { FlowType } from '../../api'; import { FLOW_META } from '../FlowDetailModal'; @@ -65,18 +65,24 @@ export function FlowStatisticsCard({ {flowDailyExpanded && (