修复单双打 ,多选功能
This commit is contained in:
@@ -8,10 +8,10 @@ import styles from './index.module.scss'
|
||||
interface IProps {
|
||||
name: string;
|
||||
options: BubbleOption[];
|
||||
value: string;
|
||||
onChange: (name: string, value: string) => void;
|
||||
value: string | string[];
|
||||
onChange: (name: string, value: string | string[] | number | (string | number)[]) => void;
|
||||
}
|
||||
const GamePlayType = (props: IProps) => {
|
||||
const CourtType = (props: IProps) => {
|
||||
const { name, onChange , options, value} = props;
|
||||
return (
|
||||
<View className={styles.courtTypeWrapper}>
|
||||
@@ -24,8 +24,9 @@ const GamePlayType = (props: IProps) => {
|
||||
size="small"
|
||||
columns={3}
|
||||
name={name}
|
||||
multiple={true}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
export default GamePlayType;
|
||||
export default CourtType;
|
||||
|
||||
@@ -87,10 +87,12 @@ const FilterPopup = (props: FilterPopupProps) => {
|
||||
/**
|
||||
* @description 筛选选项改变
|
||||
* @param name 选项名称
|
||||
* @param value 选项值
|
||||
* @param value 选项值(单选时为字符串,多选时为数组)
|
||||
*/
|
||||
const handleFilterChange = (name, value) => {
|
||||
onChange({ [name]: value });
|
||||
const handleFilterChange = (name: string, value: string | string[] | number | (string | number)[]) => {
|
||||
// 多选时,如果数组为空,传空数组;单选时保持原值
|
||||
const finalValue = Array.isArray(value) && value.length === 0 ? [] : value;
|
||||
onChange({ [name]: finalValue });
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -147,12 +149,13 @@ const FilterPopup = (props: FilterPopupProps) => {
|
||||
|
||||
<Bubble
|
||||
options={timeBubbleData}
|
||||
value={filterOptions?.timeSlot}
|
||||
value={Array.isArray(filterOptions?.timeSlot) ? filterOptions.timeSlot : (filterOptions?.timeSlot ? [filterOptions.timeSlot] : [])}
|
||||
onChange={handleFilterChange}
|
||||
layout="grid"
|
||||
size="small"
|
||||
columns={3}
|
||||
name="timeSlot"
|
||||
multiple={true}
|
||||
/>
|
||||
|
||||
{/* 范围选择 */}
|
||||
@@ -188,14 +191,14 @@ const FilterPopup = (props: FilterPopupProps) => {
|
||||
onChange={handleFilterChange}
|
||||
name="venueType"
|
||||
options={locationOptions}
|
||||
value={filterOptions?.venueType}
|
||||
value={Array.isArray(filterOptions?.venueType) ? filterOptions.venueType : (filterOptions?.venueType ? [filterOptions.venueType] : [])}
|
||||
/>
|
||||
{/* 玩法 */}
|
||||
<GamePlayType
|
||||
onChange={handleFilterChange}
|
||||
name="playType"
|
||||
options={gamePlayOptions}
|
||||
value={filterOptions?.playType}
|
||||
value={Array.isArray(filterOptions?.playType) ? filterOptions.playType : (filterOptions?.playType ? [filterOptions.playType] : [])}
|
||||
/>
|
||||
</ScrollView>
|
||||
|
||||
|
||||
@@ -7,9 +7,9 @@ import styles from "./index.module.scss";
|
||||
import { BubbleOption } from "types/list/types";
|
||||
interface IProps {
|
||||
name: string;
|
||||
value: string;
|
||||
value: string | string[];
|
||||
options: BubbleOption[];
|
||||
onChange: (name: string, value: string) => void;
|
||||
onChange: (name: string, value: string | string[] | number | (string | number)[]) => void;
|
||||
}
|
||||
const GamePlayType = (props: IProps) => {
|
||||
const { name, onChange, value, options } = props;
|
||||
@@ -24,6 +24,7 @@ const GamePlayType = (props: IProps) => {
|
||||
size="small"
|
||||
columns={3}
|
||||
name={name}
|
||||
multiple={true}
|
||||
/>
|
||||
{/* <PopupGameplay
|
||||
onClose={() => {
|
||||
|
||||
@@ -51,10 +51,10 @@ const defaultDateRange: [string, string] = [dayjs().format('YYYY-MM-DD'), dayjs(
|
||||
|
||||
const defaultFilterOptions: IFilterOptions = {
|
||||
dateRange: defaultDateRange, // 日期区间
|
||||
timeSlot: "", // 时间段
|
||||
timeSlot: [], // 时间段(多选,默认为空数组)
|
||||
ntrp: [1, 5], // NTRP 水平区间
|
||||
venueType: "", // 场地类型
|
||||
playType: "", // 玩法
|
||||
venueType: [], // 场地类型(多选,默认为空数组)
|
||||
playType: [], // 玩法(多选,默认为空数组)
|
||||
};
|
||||
|
||||
// const defaultDistance = "all"; // 默认距离
|
||||
@@ -502,7 +502,20 @@ export const useListStore = create<TennisStore>()((set, get) => ({
|
||||
const state = get();
|
||||
const { currentPageState } = state.getCurrentPageState();
|
||||
const filterOptions = { ...currentPageState?.filterOptions, ...payload };
|
||||
const filterCount = Object.values(filterOptions).filter(Boolean).length;
|
||||
|
||||
// 计算筛选数量:排除 dateRange、ntrp 默认值,以及空数组和空字符串
|
||||
const filterCount = Object.entries(filterOptions).filter(([key, value]) => {
|
||||
if (key === 'dateRange') return false; // 日期区间不算筛选
|
||||
if (key === 'ntrp') {
|
||||
// NTRP 只有不是默认值 [1, 5] 时才算筛选
|
||||
const ntrp = value as [number, number];
|
||||
return ntrp && (ntrp[0] !== 1 || ntrp[1] !== 5);
|
||||
}
|
||||
// 数组为空数组或字符串为空字符串时不算筛选
|
||||
if (Array.isArray(value)) return value.length > 0;
|
||||
if (typeof value === 'string') return value !== '';
|
||||
return Boolean(value);
|
||||
}).length;
|
||||
|
||||
// 先更新状态
|
||||
state.updateCurrentPageState({
|
||||
|
||||
@@ -15,10 +15,10 @@ export interface TennisMatch {
|
||||
}
|
||||
export interface IFilterOptions {
|
||||
dateRange: [string, string]; // 日期区间
|
||||
timeSlot?: string; // 时间段
|
||||
timeSlot?: string | string[]; // 时间段(支持多选)
|
||||
ntrp?: [number, number]; // NTRP 水平区间
|
||||
venueType?: string; // 场地类型
|
||||
playType?: string; // 玩法
|
||||
venueType?: string | string[]; // 场地类型(支持多选)
|
||||
playType?: string | string[]; // 玩法(支持多选)
|
||||
distanceFilter?: string;
|
||||
}
|
||||
// 页面状态接口
|
||||
|
||||
Reference in New Issue
Block a user