fix: 快捷筛选按客户改为客户筛选、删除日期筛选、更新频率文案

- 快捷筛选"按客户"改为真正的客户名称筛选(独立于项目筛选)
- 删除高级筛选中的"日期区间"和"日期"(无后端支持)
- "40MIN更新"改为"每分钟更新"

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
kkfluous
2026-04-01 23:26:34 +08:00
parent 8fffa141f4
commit c73e20bacf

View File

@@ -98,8 +98,7 @@ export default function MonitoringView() {
// New filters from image // New filters from image
const [filterPlate, setFilterPlate] = useState('All'); const [filterPlate, setFilterPlate] = useState('All');
const [filterDateRange, setFilterDateRange] = useState({ start: '', end: '' }); const [filterCustomer, setFilterCustomer] = useState('All');
const [filterDate, setFilterDate] = useState('2026-04-01');
const [filterProject, setFilterProject] = useState('All'); const [filterProject, setFilterProject] = useState('All');
const [filterEntity, setFilterEntity] = useState('All'); const [filterEntity, setFilterEntity] = useState('All');
const [filterRegionCode, setFilterRegionCode] = useState('All'); const [filterRegionCode, setFilterRegionCode] = useState('All');
@@ -131,6 +130,7 @@ export default function MonitoringView() {
page: 1, page: 1,
search: searchTerm || undefined, search: searchTerm || undefined,
dept: filterDept !== 'All' ? filterDept : undefined, dept: filterDept !== 'All' ? filterDept : undefined,
customer: filterCustomer !== 'All' ? filterCustomer : undefined,
project: filterProject !== 'All' ? filterProject : undefined, project: filterProject !== 'All' ? filterProject : undefined,
entity: filterEntity !== 'All' ? filterEntity : undefined, entity: filterEntity !== 'All' ? filterEntity : undefined,
plate: filterPlate !== 'All' ? filterPlate : undefined, plate: filterPlate !== 'All' ? filterPlate : undefined,
@@ -144,7 +144,7 @@ export default function MonitoringView() {
setPage(1); setPage(1);
setHasMore(d.page < d.totalPages); setHasMore(d.page < d.totalPages);
}).catch(() => {}); }).catch(() => {});
}, [sortBy, sortOrder, searchTerm, filterDept, filterProject, filterEntity, filterPlate, appliedMileageRange]); }, [sortBy, sortOrder, searchTerm, filterDept, filterCustomer, filterProject, filterEntity, filterPlate, appliedMileageRange]);
// 加载更多 // 加载更多
const loadMore = useCallback(() => { const loadMore = useCallback(() => {
@@ -158,6 +158,7 @@ export default function MonitoringView() {
page: nextPage, page: nextPage,
search: searchTerm || undefined, search: searchTerm || undefined,
dept: filterDept !== 'All' ? filterDept : undefined, dept: filterDept !== 'All' ? filterDept : undefined,
customer: filterCustomer !== 'All' ? filterCustomer : undefined,
project: filterProject !== 'All' ? filterProject : undefined, project: filterProject !== 'All' ? filterProject : undefined,
entity: filterEntity !== 'All' ? filterEntity : undefined, entity: filterEntity !== 'All' ? filterEntity : undefined,
plate: filterPlate !== 'All' ? filterPlate : undefined, plate: filterPlate !== 'All' ? filterPlate : undefined,
@@ -168,7 +169,7 @@ export default function MonitoringView() {
setPage(nextPage); setPage(nextPage);
setHasMore(nextPage < d.totalPages); setHasMore(nextPage < d.totalPages);
}).catch(() => {}).finally(() => setLoadingMore(false)); }).catch(() => {}).finally(() => setLoadingMore(false));
}, [sortBy, sortOrder, searchTerm, filterDept, filterProject, filterEntity, filterPlate, appliedMileageRange, page, loadingMore, hasMore]); }, [sortBy, sortOrder, searchTerm, filterDept, filterCustomer, filterProject, filterEntity, filterPlate, appliedMileageRange, page, loadingMore, hasMore]);
// 筛选/排序变化时重新加载 // 筛选/排序变化时重新加载
useEffect(() => { useEffect(() => {
@@ -457,7 +458,7 @@ export default function MonitoringView() {
</div> </div>
<div className="flex items-center gap-1.5 mt-1"> <div className="flex items-center gap-1.5 mt-1">
<span className="flex h-1.5 w-1.5 rounded-full bg-blue-500 animate-pulse"></span> <span className="flex h-1.5 w-1.5 rounded-full bg-blue-500 animate-pulse"></span>
<span className="text-[9px] font-bold text-slate-400 uppercase tracking-tight"> 40min更</span> <span className="text-[9px] font-bold text-slate-400 uppercase tracking-tight"> </span>
</div> </div>
</div> </div>
</div> </div>
@@ -497,9 +498,9 @@ export default function MonitoringView() {
placeholder="按部门" placeholder="按部门"
/> />
<SearchableSelect <SearchableSelect
options={projects} options={filterOptions.customers}
value={filterProject} value={filterCustomer}
onChange={setFilterProject} onChange={setFilterCustomer}
placeholder="按客户" placeholder="按客户"
/> />
<SearchableSelect <SearchableSelect
@@ -512,7 +513,7 @@ export default function MonitoringView() {
<button <button
onClick={() => setIsFilterOpen(!isFilterOpen)} onClick={() => setIsFilterOpen(!isFilterOpen)}
className={`p-1.5 rounded-lg transition-all flex-shrink-0 ${isFilterOpen || searchTerm || filterDept !== 'All' || filterPlate !== 'All' || filterProject !== 'All' ? 'bg-blue-50 text-blue-600 border border-blue-100' : 'bg-slate-50 text-slate-400 border border-transparent'}`} className={`p-1.5 rounded-lg transition-all flex-shrink-0 ${isFilterOpen || searchTerm || filterDept !== 'All' || filterCustomer !== 'All' || filterPlate !== 'All' || filterProject !== 'All' ? 'bg-blue-50 text-blue-600 border border-blue-100' : 'bg-slate-50 text-slate-400 border border-transparent'}`}
> >
<Filter size={16} /> <Filter size={16} />
</button> </button>
@@ -560,45 +561,6 @@ export default function MonitoringView() {
</div> </div>
{/* Date Range */}
<div className="space-y-1.5">
<label className="text-[10px] font-bold text-slate-400 uppercase tracking-wider"></label>
<div className="flex items-center gap-2">
<input
type="date"
className="flex-1 bg-slate-50 border-none rounded-xl py-2 px-3 text-xs focus:ring-2 focus:ring-blue-500/20 outline-none"
value={filterDateRange.start}
onChange={(e) => setFilterDateRange(prev => ({ ...prev, start: e.target.value }))}
/>
<span className="text-slate-300">-</span>
<input
type="date"
className="flex-1 bg-slate-50 border-none rounded-xl py-2 px-3 text-xs focus:ring-2 focus:ring-blue-500/20 outline-none"
value={filterDateRange.end}
onChange={(e) => setFilterDateRange(prev => ({ ...prev, end: e.target.value }))}
/>
</div>
</div>
{/* Single Date */}
<div className="space-y-1.5">
<label className="text-[10px] font-bold text-slate-400 uppercase tracking-wider"></label>
<div className="relative">
<input
type="date"
className="w-full bg-slate-50 border-none rounded-xl py-2 px-3 text-xs focus:ring-2 focus:ring-blue-500/20 outline-none"
value={filterDate}
onChange={(e) => setFilterDate(e.target.value)}
/>
<button
onClick={() => setFilterDate('2026-04-01')}
className="absolute right-10 top-1/2 -translate-y-1/2 text-slate-400 hover:text-blue-500"
>
<RotateCcw size={12} />
</button>
</div>
</div>
{/* Project */} {/* Project */}
<div className="space-y-1.5"> <div className="space-y-1.5">
<label className="text-[10px] font-bold text-slate-400 uppercase tracking-wider"></label> <label className="text-[10px] font-bold text-slate-400 uppercase tracking-wider"></label>
@@ -685,8 +647,7 @@ export default function MonitoringView() {
setSearchTerm(''); setSearchTerm('');
setFilterDept('All'); setFilterDept('All');
setFilterPlate('All'); setFilterPlate('All');
setFilterDateRange({ start: '', end: '' }); setFilterCustomer('All');
setFilterDate('2026-04-01');
setFilterProject('All'); setFilterProject('All');
setFilterEntity('All'); setFilterEntity('All');
setFilterRegionCode('All'); setFilterRegionCode('All');
@@ -716,6 +677,7 @@ export default function MonitoringView() {
{(() => { {(() => {
const tags: { label: string; onClear: () => void }[] = []; const tags: { label: string; onClear: () => void }[] = [];
if (filterDept !== 'All') tags.push({ label: `部门: ${filterDept}`, onClear: () => setFilterDept('All') }); if (filterDept !== 'All') tags.push({ label: `部门: ${filterDept}`, onClear: () => setFilterDept('All') });
if (filterCustomer !== 'All') tags.push({ label: `客户: ${filterCustomer}`, onClear: () => setFilterCustomer('All') });
if (filterProject !== 'All') tags.push({ label: `项目: ${filterProject}`, onClear: () => setFilterProject('All') }); if (filterProject !== 'All') tags.push({ label: `项目: ${filterProject}`, onClear: () => setFilterProject('All') });
if (filterEntity !== 'All') tags.push({ label: `主体: ${filterEntity}`, onClear: () => setFilterEntity('All') }); if (filterEntity !== 'All') tags.push({ label: `主体: ${filterEntity}`, onClear: () => setFilterEntity('All') });
if (filterPlate !== 'All') tags.push({ label: `车牌: ${filterPlate}`, onClear: () => setFilterPlate('All') }); if (filterPlate !== 'All') tags.push({ label: `车牌: ${filterPlate}`, onClear: () => setFilterPlate('All') });
@@ -725,7 +687,7 @@ export default function MonitoringView() {
if (filterRegionCode !== 'All') tags.push({ label: `地区: ${filterRegionCode}`, onClear: () => setFilterRegionCode('All') }); if (filterRegionCode !== 'All') tags.push({ label: `地区: ${filterRegionCode}`, onClear: () => setFilterRegionCode('All') });
if (tags.length === 0) return null; if (tags.length === 0) return null;
const clearAll = () => { const clearAll = () => {
setFilterDept('All'); setFilterProject('All'); setFilterEntity('All'); setFilterDept('All'); setFilterCustomer('All'); setFilterProject('All'); setFilterEntity('All');
setFilterPlate('All'); setSearchTerm(''); setFilterRegionCode('All'); setFilterPlate('All'); setSearchTerm(''); setFilterRegionCode('All');
setFilterMileageRange({ min: '', max: '' }); setAppliedMileageRange({ min: '', max: '' }); setFilterMileageRange({ min: '', max: '' }); setAppliedMileageRange({ min: '', max: '' });
}; };