connected backend to service page and detail

components/priceContact.tsx

@@ -12,7 +12,7 @@ import { toast } from "react-toastify";
 interface FormType {
   name: string;
   product: number;
-  phone: number; // ✅ String bo'lishi kerak
+  number: number; // ✅ String bo'lishi kerak
 }
 
 export function PriceModal() {
@@ -21,12 +21,12 @@ export function PriceModal() {
 
   const [formData, setFormData] = useState({
     name: "",
-    phone: "+998 ",
+    number: "+998 ",
   });
 
   const [errors, setErrors] = useState({
     name: "",
-    phone: "",
+    number: "",
   });
 
   const formRequest = useMutation({
@@ -35,7 +35,7 @@ export function PriceModal() {
     onSuccess: () => {
       setFormData({
         name: "",
-        phone: "+998 ",
+        number: "+998 ",
       });
       toast.success(t("success") || "Muvaffaqiyatli yuborildi!");
       closeModal();
@@ -51,11 +51,11 @@ export function PriceModal() {
     if (!isOpen) {
       setFormData({
         name: "",
-        phone: "+998 ",
+        number: "+998 ",
       });
       setErrors({
         name: "",
-        phone: "",
+        number: '',
       });
     }
   }, [isOpen]);
@@ -90,9 +90,9 @@ export function PriceModal() {
 
   const handlePhoneChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     const formatted = formatPhoneNumber(e.target.value);
-    setFormData({ ...formData, phone: formatted });
-    if (errors.phone) {
-      setErrors({ ...errors, phone: "" });
+    setFormData({ ...formData, number: formatted });
+    if (errors.number) {
+      setErrors({ ...errors, number: "" });
     }
   };
 
@@ -107,7 +107,7 @@ export function PriceModal() {
   const validateForm = () => {
     const newErrors = {
       name: "",
-      phone: "",
+      number: "",
     };
 
     // Name validation
@@ -116,17 +116,17 @@ export function PriceModal() {
     }
 
     // Phone validation
-    const phoneNumbers = formData.phone.replace(/\D/g, "");
+    const phoneNumbers = formData.number.replace(/\D/g, "");
     if (phoneNumbers.length !== 12) {
-      newErrors.phone =
+      newErrors.number =
         t("validation.phoneRequired") || "To'liq telefon raqam kiriting";
     } else if (!phoneNumbers.startsWith("998")) {
-      newErrors.phone =
+      newErrors.number =
         t("validation.phoneInvalid") || "Noto'g'ri telefon raqam";
     }
 
     setErrors(newErrors);
-    return !newErrors.name && !newErrors.phone;
+    return !newErrors.name && !newErrors.number;
   };
 
   const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
@@ -137,11 +137,11 @@ export function PriceModal() {
     }
 
     // Telefon raqamni tozalash (faqat raqamlar)
-    const cleanPhone = formData.phone.replace(/\D/g, "");
+    const cleanPhone = formData.number.replace(/\D/g, "");
 
     const sendedData: FormType = {
       name: formData.name,
-      phone: Number(cleanPhone), // ✅ String sifatida yuborish
+      number: Number(cleanPhone.slice(3)), // ✅ String sifatida yuborish
       product: product?.id || 0,
     };
 
@@ -236,16 +236,16 @@ export function PriceModal() {
                 type="tel"
                 id="phone"
                 name="phone"
-                value={formData.phone}
+                value={formData.number}
                 onChange={handlePhoneChange}
                 className={`w-full px-4 py-3 bg-[#1e1e1e] border ${
-                  errors.phone ? "border-red-500" : "border-gray-700"
+                  errors.number ? "border-red-500" : "border-gray-700"
                 } rounded-lg text-white placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-red-700 transition`}
                 placeholder="+998 90 123 45 67"
                 maxLength={17}
               />
-              {errors.phone && (
-                <p className="mt-1 text-sm text-red-500">{errors.phone}</p>
+              {errors.number && (
+                <p className="mt-1 text-sm text-red-500">{errors.number}</p>
               )}
             </div>