import React, { useState } from "react";
import CommonPopup from "@/components/CommonPopup";
import Picker from "./Picker";
interface PickerOption {
  text: string | number;
  value: string | number;
}

interface PickerProps {
  visible: boolean;
  setvisible: (visible: boolean) => void;
  options?: PickerOption[][] | PickerOption[];
  value?: (string | number)[];
  onChange?: (value: (string | number)[]) => void;
  style?: React.CSSProperties;
}

const PopupPicker = ({
  visible,
  setvisible,
  value = [],
  onChange,
  options = [],
  style,
}: PickerProps) => {
  const [defaultValue, setDefaultValue] = useState<(string | number)[]>(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 PopupPicker;