修复切换城市挡住的问题
This commit is contained in:
@@ -49,20 +49,22 @@
|
||||
- `src/game_pages/list/index.tsx`(主逻辑)
|
||||
- `src/components/DistanceQuickFilter/index.tsx`(筛选菜单回调)
|
||||
- `src/components/PublishMenu/PublishMenu.tsx`(发布菜单回调)
|
||||
- `src/container/listCustomNavbar/index.tsx`(城市选择器回调)
|
||||
- `src/components/GuideBar/index.tsx`(接收回调)
|
||||
|
||||
**监听的状态**:
|
||||
1. **`isPublishMenuVisible`** - 发布菜单展开状态
|
||||
2. **`isShowFilterPopup`** - 综合筛选弹窗展开状态
|
||||
3. **`isDistanceFilterVisible`** - 距离/排序筛选下拉菜单展开状态
|
||||
4. **`isCityPickerVisible`** - 城市选择器展开状态
|
||||
|
||||
**动态逻辑**:
|
||||
```tsx
|
||||
if (isPublishMenuVisible) {
|
||||
// 发布菜单展开 → z-index: 900 (high)
|
||||
setGuideBarZIndex('high');
|
||||
} else if (isShowFilterPopup || isDistanceFilterVisible) {
|
||||
// 任何筛选组件展开 → z-index: 80 (low)
|
||||
} else if (isShowFilterPopup || isDistanceFilterVisible || isCityPickerVisible) {
|
||||
// 任何筛选组件或选择器展开 → z-index: 80 (low)
|
||||
setGuideBarZIndex('low');
|
||||
} else {
|
||||
// 都关闭 → z-index: 900 (high)
|
||||
|
||||
@@ -18,6 +18,7 @@ interface IProps {
|
||||
iconPath?: string;
|
||||
leftIconClick?: () => void;
|
||||
};
|
||||
onCityPickerVisibleChange?: (visible: boolean) => void; // 城市选择器显示/隐藏回调
|
||||
}
|
||||
|
||||
function CityPicker(props) {
|
||||
@@ -49,7 +50,7 @@ function CityPicker(props) {
|
||||
}
|
||||
|
||||
const ListHeader = (props: IProps) => {
|
||||
const { config } = props;
|
||||
const { config, onCityPickerVisibleChange } = props;
|
||||
const { showInput = false, inputLeftIcon, leftIconClick } = config || {};
|
||||
const { getLocationLoading, statusNavbarHeightInfo } = useGlobalState();
|
||||
const { gamesNum, searchValue, cities, area, updateArea, getMatchesData, fetchGetGamesCount, refreshBothLists } = useListState();
|
||||
@@ -57,6 +58,11 @@ const ListHeader = (props: IProps) => {
|
||||
|
||||
const [cityPopupVisible, setCityPopupVisible] = useState(false);
|
||||
|
||||
// 监听城市选择器状态变化,通知父组件
|
||||
useEffect(() => {
|
||||
onCityPickerVisibleChange?.(cityPopupVisible);
|
||||
}, [cityPopupVisible, onCityPickerVisibleChange]);
|
||||
|
||||
const userInfo = useUserInfo();
|
||||
const province = (userInfo as any)?.province || "";
|
||||
const city = (userInfo as any)?.city || "";
|
||||
|
||||
@@ -75,6 +75,7 @@ const ListPage = () => {
|
||||
const [guideBarZIndex, setGuideBarZIndex] = useState<'low' | 'high'>('high');
|
||||
const [isPublishMenuVisible, setIsPublishMenuVisible] = useState(false);
|
||||
const [isDistanceFilterVisible, setIsDistanceFilterVisible] = useState(false);
|
||||
const [isCityPickerVisible, setIsCityPickerVisible] = useState(false);
|
||||
|
||||
// 处理 PublishMenu 显示/隐藏
|
||||
const handlePublishMenuVisibleChange = useCallback((visible: boolean) => {
|
||||
@@ -86,19 +87,24 @@ const ListPage = () => {
|
||||
setIsDistanceFilterVisible(visible);
|
||||
}, []);
|
||||
|
||||
// 监听筛选相关组件和发布菜单的状态,动态调整 GuideBar 的 z-index
|
||||
// 处理 CityPicker 显示/隐藏
|
||||
const handleCityPickerVisibleChange = useCallback((visible: boolean) => {
|
||||
setIsCityPickerVisible(visible);
|
||||
}, []);
|
||||
|
||||
// 监听所有弹窗和菜单的状态,动态调整 GuideBar 的 z-index
|
||||
useEffect(() => {
|
||||
if (isPublishMenuVisible) {
|
||||
// PublishMenu 展开时,GuideBar 保持高层级
|
||||
setGuideBarZIndex('high');
|
||||
} else if (isShowFilterPopup || isDistanceFilterVisible) {
|
||||
// 任何筛选组件展开时,GuideBar 降低层级
|
||||
} else if (isShowFilterPopup || isDistanceFilterVisible || isCityPickerVisible) {
|
||||
// 任何筛选组件或选择器展开时,GuideBar 降低层级
|
||||
setGuideBarZIndex('low');
|
||||
} else {
|
||||
// 都关闭时,GuideBar 保持高层级
|
||||
setGuideBarZIndex('high');
|
||||
}
|
||||
}, [isShowFilterPopup, isPublishMenuVisible, isDistanceFilterVisible]);
|
||||
}, [isShowFilterPopup, isPublishMenuVisible, isDistanceFilterVisible, isCityPickerVisible]);
|
||||
|
||||
// ScrollView 滚动处理函数
|
||||
const handleScrollViewScroll = useCallback(
|
||||
@@ -425,6 +431,7 @@ const ListPage = () => {
|
||||
config={{
|
||||
showInput: isShowInputCustomerNavBar,
|
||||
}}
|
||||
onCityPickerVisibleChange={handleCityPickerVisibleChange}
|
||||
/>
|
||||
{area_city !== "上海" ? (
|
||||
renderCityQrcode()
|
||||
|
||||
Reference in New Issue
Block a user