添加程序选择

src/components/LocationConfirmDialog/index.tsx

@@ -0,0 +1,57 @@
+import React, { useEffect } from "react";
+import { View, Text } from "@tarojs/components";
+import { useGlobalState } from "@/store/global";
+import "./index.scss";
+
+interface LocationConfirmDialogProps {
+  visible: boolean;
+  currentCity: string; // 缓存的城市
+  detectedCity: string; // 定位的城市
+  onConfirm: () => void;
+  onCancel: () => void;
+}
+
+const LocationConfirmDialog: React.FC<LocationConfirmDialogProps> = ({
+  visible,
+  currentCity,
+  detectedCity,
+  onConfirm,
+  onCancel,
+}) => {
+  const { setShowGuideBar } = useGlobalState();
+
+  // 当弹窗显示/隐藏时，控制 GuideBar
+  useEffect(() => {
+    console.log('[LocationConfirmDialog] visible 变化:', visible);
+    if (visible) {
+      console.log('[LocationConfirmDialog] 弹窗显示，隐藏 GuideBar');
+      setShowGuideBar(false);
+    } else {
+      console.log('[LocationConfirmDialog] 弹窗隐藏，显示 GuideBar');
+      setShowGuideBar(true);
+    }
+  }, [visible, setShowGuideBar]);
+
+  if (!visible) return null;
+
+  return (
+    <View className="locationDialogMask" onClick={onCancel}>
+      <View className="locationDialogContainer" onClick={(e) => e.stopPropagation()}>
+        <View className="locationDialogContent">
+          <Text className="locationDialogTitle">定位显示您在{detectedCity}</Text>
+          <View className="locationDialogButtons">
+            <View className="locationDialogButton primary" onClick={onConfirm}>
+              <Text className="locationDialogButtonText primary">切换到{detectedCity}</Text>
+            </View>
+            <View className="locationDialogButton secondary" onClick={onCancel}>
+              <Text className="locationDialogButtonText secondary">继续浏览{currentCity}</Text>
+            </View>
+          </View>
+        </View>
+      </View>
+    </View>
+  );
+};
+
+export default LocationConfirmDialog;
+