contact add to telegram bot

This commit is contained in:
nabijonovdavronbek619@gmail.com
2025-11-08 12:06:17 +05:00
parent 9f047aecb4
commit 7e37d086fd
6 changed files with 374 additions and 40 deletions

View File

@@ -39,12 +39,12 @@ export default function ProductCard({ data }: { data: ProductTypes }) {
{/* Pastki qism - matn */}
<div className="bg-[#fafafa] w-full py-5 rounded-b-lg flex flex-col items-center justify-center space-y-1">
<p className="font-medium text-gray-800 text-lg text-center">
<div className="font-medium text-gray-800 text-lg text-center">
<Text txt={data.truck_name} />
</p>
<p className="text-secondary text-sm text-center">
</div>
<div className="text-secondary text-sm text-center">
<Text txt={data.desc} />
</p>
</div>
</div>
</Link>
</motion.div>

View File

@@ -14,7 +14,7 @@ declare global {
type Props = { lat?: number; lng?: number; zoom?: number };
export default function GoogleMap({
lat = 41.2628056, // rasmda korsatilgan koordinata (41°15'46.1"N 69°13'08.8"E)
lat = 41.2628056,
lng = 69.2191111,
zoom = 17,
}: Props) {
@@ -28,24 +28,24 @@ export default function GoogleMap({
const map = new google.maps.Map(mapRef.current, {
center,
zoom,
mapTypeControl: true, // 🛰 Satellite tugmasi
streetViewControl: true, // Street View tugmasi
fullscreenControl: true, // Fullscreen
zoomControl: true, // Zoom tugmalari
mapTypeControl: true,
streetViewControl: true,
fullscreenControl: true,
zoomControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.DEFAULT,
position: google.maps.ControlPosition.RIGHT_BOTTOM, // Chap pastga Satellite
position: google.maps.ControlPosition.RIGHT_BOTTOM,
},
});
// 📌 Marker
new google.maps.Marker({
position: center,
// ✅ Yangi marker usuli
new google.maps.marker.AdvancedMarkerElement({
map,
position: center,
title: "Bizning manzil",
});
// 🧭 Koordinata oynasini yaratamiz
// 🧭 Qoshimcha koordinata oynasi
const coordDiv = document.createElement("div");
coordDiv.style.background = "#fff";
coordDiv.style.padding = "15px 30px";
@@ -59,19 +59,17 @@ export default function GoogleMap({
`;
map.controls[google.maps.ControlPosition.TOP_LEFT].push(coordDiv);
};
if (window.google && window.google.maps && typeof window.initMap === "function") {
window.initMap();
}
}, [lat, lng, zoom]);
return (
<>
<Script
src={`https://maps.googleapis.com/maps/api/js?key=${process.env.NEXT_PUBLIC_GOOGLE_MAPS_API_KEY}&callback=initMap`}
async
defer
src={`https://maps.googleapis.com/maps/api/js?key=AIzaSyARZe3FPgMT0p-CwDD-iYvpz2Mh8jkUxR0&callback=initMap&libraries=marker`}
strategy="afterInteractive"
/>
<div ref={mapRef} style={{ width: "100%", height: "600px", overflow: "hidden" }} />
<div ref={mapRef} style={{ width: "100%", height: "600px" }} />
</>
);
}

View File

@@ -1,28 +1,83 @@
"use client";
import { useTranslation } from "react-i18next";
import Text from "../lib_components/text";
import axios from "axios";
import { FormEvent } from "react";
export default function Contact() {
return (
<section dir="ltr" className="relative w-full bg-primary py-20 flex justify-center mt-40 px-4">
<div className="mx-auto absolute z-20 -top-25 bg-secondary max-w-[1200px] w-full py-10 flex flex-col items-center clip-trapezoid">
<div id="contactClip" className="w-full flex flex-col items-center justify-center">
<h2 className="text-2xl md:text-3xl font-bold text-primary mb-5 text-center">
<Text txt="contact-h2"/>
</h2>
const { t } = useTranslation();
{/* Input va Button bloki */}
<div className="flex max-sm:flex-col gap-5 w-full max-w-2xl px-4">
<input
type="text"
placeholder="Your phone number"
className="flex-1 py-3 px-5 bg-white text-gray-600 placeholder-gray-400 text-lg clip-input focus:outline-none"
/>
<button className="bg-primary sm:-ml-5 text-white sm:px-6 sm:py-3 p-2 text-lg font-medium clip-button">
<Text txt="call"/>
</button>
</div>
const sendMessage = async (event: FormEvent<HTMLFormElement>) => {
event.preventDefault();
const form = event.currentTarget;
const nameInput = form.elements.namedItem("name") as HTMLInputElement;
const name = nameInput?.value?.trim();
if (!name) {
alert("Iltimos, telefon raqamingizni kiriting!");
return;
}
try {
const token = "7940057045:AAHRFPvgUCo_7pqpXD6uq4li7-_DYx2J96g"; // Use environment variable
const chatId = 6134458285;
if (!token || !chatId) {
throw new Error("Telegram token yoki chat ID topilmadi!");
}
const message = `📞 Yangi kontakt: ${name}`;
await axios.post(`https://api.telegram.org/bot${token}/sendMessage`, {
chat_id: chatId,
text: message,
});
alert("✅ Muvaffaqiyatli yuborildi!");
form.reset();
} catch (error) {
console.error("Yuborishda xatolik:", error);
alert("❌ Yuborishda xatolik yuz berdi!");
}
};
return (
<section
dir="ltr"
className="relative w-full bg-primary py-20 flex justify-center mt-40 px-4"
>
<div className="mx-auto absolute z-20 -top-25 bg-secondary max-w-[1200px] w-full py-10 flex flex-col items-center clip-trapezoid">
<div
id="contactClip"
className="w-full flex flex-col items-center justify-center"
>
<h2 className="text-2xl md:text-3xl font-bold text-primary mb-5 text-center">
<Text txt="contact-h2" />
</h2>
{/* Form */}
<form
className="flex max-sm:flex-col gap-5 w-full max-w-2xl px-4"
onSubmit={sendMessage}
>
<input
type="text"
name="name"
placeholder="Your phone number"
required
className="flex-1 py-3 px-5 bg-white text-gray-600 placeholder-gray-400 text-lg clip-input focus:outline-none"
/>
<button
type="submit"
className="bg-primary sm:-ml-5 text-white sm:px-6 sm:py-3 p-2 text-lg font-medium clip-button"
>
{t("call")}
</button>
</form>
</div>
</div>
{/* <div className="bg-[#d38307] clip-part absolute -top-25 py-[50px] px-18 left-[97px] z-10" ></div> */}
</section>
);
}