增加日历

This commit is contained in:
李瑞
2025-09-08 23:23:19 +08:00
parent 4d79c79a97
commit 8a1a2af1e9
5 changed files with 19 additions and 62 deletions

View File

@@ -6,7 +6,6 @@ import styles from "./index.module.scss";
import { Button } from "@nutui/nutui-react-taro"; import { Button } from "@nutui/nutui-react-taro";
import { useListStore } from "src/store/listStore"; import { useListStore } from "src/store/listStore";
import { BubbleOption, FilterPopupProps } from "../../../types/list/types"; import { BubbleOption, FilterPopupProps } from "../../../types/list/types";
import dateRangeUtils from '@/utils/dateRange'
import dayjs from "dayjs"; import dayjs from "dayjs";
import { CalendarUI } from "@/components"; import { CalendarUI } from "@/components";
// 场地 // 场地
@@ -16,13 +15,6 @@ import GamePlayType from "@/components/GamePlayType";
import { useDictionaryActions } from "@/store/dictionaryStore"; import { useDictionaryActions } from "@/store/dictionaryStore";
import { View } from "@tarojs/components"; import { View } from "@tarojs/components";
const dateTrabseformMap = {
'1': dateRangeUtils.getThisWeekend,
'2': dateRangeUtils.getNextWeekRange,
'3': dateRangeUtils.getNextMonthRange
}
const FilterPopup = (props: FilterPopupProps) => { const FilterPopup = (props: FilterPopupProps) => {
const { const {
loading, loading,
@@ -44,12 +36,13 @@ const FilterPopup = (props: FilterPopupProps) => {
* @param dictionaryValue 字典选项 * @param dictionaryValue 字典选项
* @returns 选项列表 * @returns 选项列表
*/ */
const [selectedDates, setSelectedDates] = useState<String[]>([]) // const [selectedDates, setSelectedDates] = useState<String[]>([])
const handleDateChange = (dates: Date[]) => { const handleDateChange = (dates: Date[]) => {
const dateArray = dates.map(date => dayjs(date).format('YYYY-MM-DD')) const dateArray = dates.map(date => dayjs(date).format('YYYY-MM-DD'))
setSelectedDates(dateArray) onChange({
console.log('选中的日期:', dateArray) 'dateRange': dateArray,
})
} }
const handleOptions = (dictionaryValue: []) => { const handleOptions = (dictionaryValue: []) => {
@@ -89,29 +82,6 @@ const FilterPopup = (props: FilterPopupProps) => {
onCancel(); onCancel();
}; };
/**
* @description 日期选择
* @param date 日期
*/
const handleDateRangeChange = (date: Date) => {
onChange({
'dateRange': [date, date],
'dateRangeQuick': '',
})
}
/**
* @description 点击 本周末 一周内 一月内
*/
const handleDateRangeQuickClick = (name, value) => {
const date = dateTrabseformMap?.[value]()
onChange({
'dateRange': [date?.start, date?.end],
[name]: value,
})
}
return ( return (
<> <>
<Popup <Popup
@@ -127,22 +97,10 @@ const FilterPopup = (props: FilterPopupProps) => {
<div className={styles.filterPopupWrapper}> <div className={styles.filterPopupWrapper}>
{/* 日历 */} {/* 日历 */}
<View> <View>
{/* 快捷选日期 */}
<View>
<Bubble
options={dateRangeOptions}
value={filterOptions?.dateRangeQuick}
onChange={handleDateRangeQuickClick}
layout="grid"
size="small"
columns={3}
name="dateRangeQuick"
/>
</View>
<CalendarUI <CalendarUI
type="multiple" type="multiple"
isBorder={true} isBorder={true}
value={selectedDates} value={filterOptions?.dateRange}
onChange={handleDateChange} onChange={handleDateChange}
/> />
</View> </View>
@@ -164,9 +122,10 @@ const FilterPopup = (props: FilterPopupProps) => {
max={5.0} max={5.0}
step={0.5} step={0.5}
className={styles.filterPopupRange} className={styles.filterPopupRange}
onChange={handleFilterChange} onChange={(value) => {
handleFilterChange("ntrp", value)
}}
value={filterOptions?.ntrp} value={filterOptions?.ntrp}
name="ntrp"
/> />
{/* 场次气泡选项 */} {/* 场次气泡选项 */}

View File

@@ -16,7 +16,7 @@ interface RangeProps {
}; };
disabled?: boolean; disabled?: boolean;
className?: string; className?: string;
name: string; name?: string;
showTitle?: boolean; showTitle?: boolean;
} }
@@ -64,7 +64,7 @@ const NtrpRange: React.FC<RangeProps> = ({
if (Number(start) === Number(min) && Number(end) === Number(max)) { if (Number(start) === Number(min) && Number(end) === Number(max)) {
return "不限"; return "不限";
} }
return `${start.toFixed(1)} - ${end.toFixed(1)}之间`; return `${start?.toFixed(1)} - ${end?.toFixed(1)}之间`;
}, [JSON.stringify(currentValue || []), min, max]); }, [JSON.stringify(currentValue || []), min, max]);
return ( return (

View File

@@ -51,11 +51,12 @@ export const useGlobalStore = create<GlobalStore>()((set, get) => ({
// 获取位置信息 // 获取位置信息
getCurrentLocationInfo: () => { getCurrentLocationInfo: () => {
getCurrentLocation().then((res) => { return getCurrentLocation().then((res) => {
set({ set({
getLocationLoading: false, getLocationLoading: false,
location: res || {}, location: res || {},
}); });
return res;
}); });
}, },

View File

@@ -18,9 +18,10 @@ import dateRangeUtils from '@/utils/dateRange'
// 完整的 Store 类型 // 完整的 Store 类型
type TennisStore = ListState & ListActions; type TennisStore = ListState & ListActions;
const toDate = dateRangeUtils?.formatDate(new Date())
const defaultFilterOptions: IFilterOptions = { const defaultFilterOptions: IFilterOptions = {
dateRange: [new Date(), new Date()], // 日期区间 dateRange: [toDate, toDate], // 日期区间
dateRangeQuick: '',
timeSlot: "", // 时间段 timeSlot: "", // 时间段
ntrp: [1, 5], // NTRP 水平区间 ntrp: [1, 5], // NTRP 水平区间
venueType: "", // 场地类型 venueType: "", // 场地类型
@@ -124,7 +125,6 @@ export const useListStore = create<TennisStore>()((set, get) => ({
getSearchParams: () => { getSearchParams: () => {
const state = get(); const state = get();
const filterOptions = state?.filterOptions || {}; const filterOptions = state?.filterOptions || {};
console.log('===1111filterOptions', filterOptions)
const distanceQuickFilter = state?.distanceQuickFilter || {}; const distanceQuickFilter = state?.distanceQuickFilter || {};
const params = { const params = {
pageOption: state.pageOption, pageOption: state.pageOption,
@@ -133,10 +133,7 @@ export const useListStore = create<TennisStore>()((set, get) => ({
title: state.searchValue, title: state.searchValue,
ntrpMin: filterOptions?.ntrp?.[0], ntrpMin: filterOptions?.ntrp?.[0],
ntrpMax: filterOptions?.ntrp?.[1], ntrpMax: filterOptions?.ntrp?.[1],
dateRange: [ dateRange: filterOptions?.dateRange,
dateRangeUtils.formatDate(filterOptions?.dateRange?.[0]),
dateRangeUtils.formatDate(filterOptions?.dateRange?.[1])
],
}, },
order: distanceQuickFilter?.quick, order: distanceQuickFilter?.quick,
lat: state?.location?.latitude, lat: state?.location?.latitude,
@@ -152,7 +149,8 @@ export const useListStore = create<TennisStore>()((set, get) => ({
const { error, data, loading, gamesNum } = payload; const { error, data, loading, gamesNum } = payload;
const saveKey = isSearchResult ? "searchResultData" : "matches"; const saveKey = isSearchResult ? "searchResultData" : "matches";
const saveData = { error, loading, gamesNum, [saveKey]: data }; const saveData = { error, loading, gamesNum, [saveKey]: data };
set(saveData); console.log('===saveData', saveData)
set({...saveData});
}, },
// 获取列表数据(常规搜索) // 获取列表数据(常规搜索)

View File

@@ -13,8 +13,7 @@ export interface TennisMatch {
shinei: string shinei: string
} }
export interface IFilterOptions { export interface IFilterOptions {
dateRange: [Date, Date], // 日期区间 dateRange: [string, string], // 日期区间
dateRangeQuick?: string, // 日期快捷选择
timeSlot?: string, // 时间段 timeSlot?: string, // 时间段
ntrp?: [number, number], // NTRP 水平区间 ntrp?: [number, number], // NTRP 水平区间
venueType?: string, // 场地类型 venueType?: string, // 场地类型