添加行政区选择

src/components/Picker/CityPickerV2.tsx

@@ -0,0 +1,77 @@
+import React, { useState, useEffect } from "react";
+import CommonPopup from "@/components/CommonPopup";
+import Picker from "./Picker";
+
+interface PickerOption {
+  text: string | number;
+  value: string | number;
+}
+
+interface CityPickerV2Props {
+  visible: boolean;
+  setvisible: (visible: boolean) => void;
+  options?: PickerOption[][]; // 两级数据：[国家列表, 省份/城市列表]
+  value?: (string | number)[]; // [国家value, 省份/城市value]
+  onChange?: (value: (string | number)[]) => void;
+  style?: React.CSSProperties;
+}
+
+const CityPickerV2 = ({
+  visible,
+  setvisible,
+  value = [],
+  onChange,
+  options = [],
+  style,
+}: CityPickerV2Props) => {
+  const [defaultValue, setDefaultValue] = useState<(string | number)[]>(value);
+
+  // 当外部 value 变化时同步更新
+  useEffect(() => {
+    if (value && value.length > 0) {
+      setDefaultValue(value);
+    }
+  }, [value]);
+
+  const changePicker = (_options: any[], values: any, _columnIndex: number) => {
+    setDefaultValue(values);
+  };
+
+  const handleConfirm = () => {
+    onChange?.(defaultValue);
+    setvisible(false);
+  };
+
+  const dialogClose = () => {
+    setvisible(false);
+  };
+
+  return (
+    <>
+      <CommonPopup
+        visible={visible}
+        onClose={dialogClose}
+        showHeader={false}
+        title={null}
+        hideFooter={false}
+        cancelText="取消"
+        confirmText="完成"
+        onConfirm={handleConfirm}
+        position="bottom"
+        round
+        zIndex={1000}
+        style={style}
+      >
+        <Picker
+          visible={visible}
+          options={options}
+          defaultValue={defaultValue}
+          onChange={changePicker}
+        />
+      </CommonPopup>
+    </>
+  );
+};
+
+export default CityPickerV2;
+

src/components/Picker/index.ts

@@ -5,5 +5,6 @@ export type { PickerCommonRef } from './PickerCommon'
 export { default as CalendarUI } from './CalendarUI/CalendarUI'
 export { default as DialogCalendarCard } from './CalendarDialog/DialogCalendarCard'
 export { default as CityPicker } from './CityPicker'
+export { default as CityPickerV2 } from './CityPickerV2'
 export { default as  DayDialog } from './DayDialog';
 export { default as  HourDialog } from './HourDialog';