This commit is contained in:
张成
2026-02-05 23:23:21 +08:00
parent ebb7116c25
commit 969066591c
12 changed files with 137 additions and 26 deletions

View File

@@ -85,6 +85,10 @@
font-size: 13px;
font-weight: 400;
color: #3c3c43;
display: flex;
flex-direction: row;
align-items: center;
gap:4px;
}
.distanceWrap {

View File

@@ -1,9 +1,14 @@
import { useRef, useState, useEffect } from "react";
import { Menu } from "@nutui/nutui-react-taro";
import { Image, View, ScrollView } from "@tarojs/components";
import Taro from "@tarojs/taro";
import img from "@/config/images";
import Bubble from "../Bubble";
import { useListState } from "@/store/listStore";
import { useListState, useListStore } from "@/store/listStore";
import { getCurrentLocation } from "@/utils/locationUtils";
import { updateUserLocation } from "@/services/userService";
import { useGlobalState } from "@/store/global";
import { useUserActions } from "@/store/userStore";
import "./index.scss";
const DistanceQuickFilterV2 = (props) => {
@@ -19,15 +24,19 @@ const DistanceQuickFilterV2 = (props) => {
quickValue,
districtValue, // 新增:行政区选中值
onMenuVisibleChange, // 菜单展开/收起回调
onRelocate, // 重新定位回调
} = props;
const cityRef = useRef(null);
const quickRef = useRef(null);
const [changePosition, setChangePosition] = useState<number[]>([]);
const [isMenuOpen, setIsMenuOpen] = useState(false);
const [keys, setKeys] = useState(0);
const [keys, setKeys] = useState(0);
const [isRelocating, setIsRelocating] = useState(false);
// 从 store 获取当前城市信息
const { area } = useListState();
const currentCity = area?.at(-1) || ""; // 获取省份/城市名称
const { updateState } = useGlobalState() || {};
const { fetchUserInfo, updateCache } = useUserActions();
// 全城筛选显示的标题 - 如果选择了行政区,显示行政区名称
const getCityTitle = () => {
@@ -79,6 +88,64 @@ const DistanceQuickFilterV2 = (props) => {
index === 1 && (quickRef.current as any)?.toggle(false);
};
// 重新获取当前位置,调用接口把位置传递后端
const handleRelocate = async () => {
if (isRelocating) return;
setIsRelocating(true);
(Taro as any).showLoading({ title: '定位中...', mask: true });
try {
// 获取当前位置
const location = await getCurrentLocation();
if (location && location.latitude && location.longitude) {
// 更新 store 中的位置信息
updateState?.({ location });
// 调用接口把位置传递给后端,传递一个值代表强制更新
const response = await updateUserLocation(location.latitude, location.longitude, true);
// 如果接口返回成功,重新调用用户信息接口来更新 USER_SELECTED_CITY
if (response?.code === 0) {
// 删除 缓存
(Taro as any).removeStorageSync("USER_SELECTED_CITY");
// 延时一下
await new Promise(resolve => setTimeout(resolve, 600));
// 先清除缓存和 area确保使用最新的用户信息
await updateCache( ["中国", response.data.last_location_province]);
}
(Taro as any).showToast({
title: '定位成功',
icon: 'success',
duration: 1500,
});
// 通知父组件位置已更新,可以刷新列表
if (onRelocate) {
onRelocate(location);
}
} else {
throw new Error('获取位置信息失败');
}
} catch (error: any) {
console.error('重新定位失败:', error);
(Taro as any).showToast({
title: error?.message || '定位失败,请检查定位权限',
icon: 'none',
duration: 2000,
});
} finally {
setIsRelocating(false);
(Taro as any).hideLoading();
}
};
// 监听菜单状态变化,通知父组件
useEffect(() => {
onMenuVisibleChange?.(isMenuOpen);
@@ -103,8 +170,11 @@ const DistanceQuickFilterV2 = (props) => {
icon={<Image src={img.ICON_MENU_ITEM_SELECTED} />}
>
<div className="positionWrap">
<p className="title"></p>
<p className="cityName">{currentCity}</p>
<p className="title">{currentCity}</p>
<p className="cityName" onClick={handleRelocate}>
<img src={img.ICON_RELOCATE} style={{ width: '12px', height: "12px" }} />
<span></span>
</p>
</div>
<div className="distanceWrap">
<Bubble

View File

@@ -67,7 +67,7 @@ const PublishMenu: React.FC<PublishMenuProps> = (props) => {
};
const handleMenuItemClick = (type: "individual" | "group" | "ai") => {
const [_, address] = area;
if (address !== '上海') {
if (address !== '上海') {
(Taro as any).showModal({
title: '提示',
content: '仅上海地区开放,您可加入社群或切换城市',

View File

@@ -45,7 +45,7 @@ const SearchBarComponent = (props: IProps) => {
</View>
}
className={styles.searchBar}
placeholder="搜索上海的球局和场地"
placeholder="搜索球局和场地"
onChange={handleChange}
value={value}
onInputClick={onInputClick}