"use client"
import dynamic from "next/dynamic"

interface WaterMapProps {
  facilities?: Array<{
    id: string
    name: string
    type: "water_source" | "plant" | "pump" | "pipeline" | "user"
    position: [number, number]
    status: "normal" | "warning" | "alarm"
    data?: any
  }>
  alarms?: Array<{
    id: string
    position: [number, number]
    level: "high" | "medium" | "low"
    message: string
  }>
}

// 使用动态导入避免SSR问题
const MapComponent = dynamic(() => import("./map-component"), {
  ssr: false,
  loading: () => (
    <div className="h-full w-full rounded-lg overflow-hidden shadow-sm bg-gray-100 flex items-center justify-center">
      <div className="text-gray-500">地图加载中...</div>
    </div>
  ),
})

export default function WaterMap({ facilities = [], alarms = [] }: WaterMapProps) {
  return (
    <div className="h-full w-full rounded-lg overflow-hidden shadow-sm">
      <MapComponent facilities={facilities} alarms={alarms} />
    </div>
  )
}