import * as React from "react";
import { useState } from "react";

export function ContactForm() {
  const [formData, setFormData] = useState({
    scL_FRM_Schoolname: "",
    scL_FRM_Pincode: "",
    scL_FRM_Email: "",
    scL_FRM_Phonenumber: "",
    scL_FRM_Message: "",
    scL_FRM_Createddate: new Date().toISOString()
  });

  const handleChange = (e) => {
    const { name, value } = e.target;
    setFormData(prev => ({ ...prev, [name]: value }));
  };

  const handleSubmit = async (e) => {
    e.preventDefault();

    try {
      const response = await fetch("http://62.96.225.47/UnectAPI/api/SchoolEnquiryForm", {
        method: "POST",
        headers: {
          "Content-Type": "application/json"
        },
        body: JSON.stringify(formData)
      });

      if (response.ok) {
        alert("✅ Form submitted successfully!");
      } else {
        const errorText = await response.text();
        alert("❌ Submission failed: " + errorText);
      }
    } catch (error) {
      console.error("Error:", error);
      alert("⚠️ Network or server error.");
    }
  };

  return (
    <form onSubmit={handleSubmit} style={{ display: "flex", flexDirection: "column", gap: "10px" }}>
      <input name="scL_FRM_Schoolname" placeholder="School Name" onChange={handleChange} required />
      <input name="scL_FRM_Pincode" placeholder="Pincode" type="number" onChange={handleChange} required />
      <input name="scL_FRM_Email" placeholder="Email" type="email" onChange={handleChange} required />
      <input name="scL_FRM_Phonenumber" placeholder="Phone Number" type="tel" onChange={handleChange} required />
      <textarea name="scL_FRM_Message" placeholder="Message" onChange={handleChange} required />
      <button type="submit">Submit</button>
    </form>
  );
}