zhimingge/components/shared/datetime-picker.tsx

"use client";

interface DateTimePickerProps {
  date: string;
  time: string;
  onDateChange: (date: string) => void;
  onTimeChange: (time: string) => void;
  label?: string;
  timeDisabled?: boolean;
}

export function nowDateString() {
  return new Date().toISOString().slice(0, 10);
}

export function nowTimeString() {
  const d = new Date();
  return `${d.getHours().toString().padStart(2, "0")}:${d.getMinutes().toString().padStart(2, "0")}`;
}

export default function DateTimePicker({
  date,
  time,
  onDateChange,
  onTimeChange,
  label = "时间",
  timeDisabled = false,
}: DateTimePickerProps) {
  return (
    <div className="space-y-2">
      <label className="text-sm font-medium">{label}</label>
      <div className="grid gap-2 sm:grid-cols-2">
        <input
          type="date"
          className="rounded-md border bg-background px-3 py-2 text-sm disabled:opacity-50"
          value={date}
          onChange={(e) => onDateChange(e.target.value)}
        />
        <input
          type="time"
          className="rounded-md border bg-background px-3 py-2 text-sm disabled:opacity-50"
          value={time}
          disabled={timeDisabled}
          onChange={(e) => onTimeChange(e.target.value)}
        />
      </div>
    </div>
  );
}