Davron/spestexnika
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

products

Browse Source
This commit is contained in:
Davron Chetin
2025-10-14 17:16:41 +05:00
parent a3b2d187ae
commit d126d7f8e3
14 changed files with 218 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
app/[carType]/layout.tsx Normal file
View File

@@ -0,0 +1,11 @@
import CarType_Header from "@/components/carPageParts/carType_head";
import React, { ReactNode } from "react";
export default function Layout({ children }: { children: ReactNode }) {
return (
<div>
<CarType_Header />
{children}
</div>
);
}

14
app/[carType]/page.tsx
View File

@@ -1,13 +1,13 @@
"use client" "use client";
import CarType_Header from "@/components/carPageParts/carType_head"; import Title from "@/components/title";
import { useParams } from "next/navigation" import { useParams } from "next/navigation";
export default function CartType() { export default function CartType() {
const router = useParams(); const router = useParams();
return ( return (
<div> <div dir="ltr" className="my-20" >
<CarType_Header/> <Title text="tex-rent" />
</div> </div>
) );
} }

4
app/layout.tsx
View File

@@ -33,8 +33,8 @@ export default function RootLayout({
return ( return (
<html lang={params.lang} dir={dir(params.lang)}> <html lang={params.lang} dir={dir(params.lang)}>
<body> <body>
<Header/> <Header />
<Navbar/> <Navbar />
{children} {children}
<section id="contact" className=""> <section id="contact" className="">
<Contact /> <Contact />

18
app/page.tsx
View File

@@ -4,18 +4,20 @@ import Offer from "@/components/pageParts/offer";
import Faq from "@/components/pageParts/faq"; import Faq from "@/components/pageParts/faq";
import Partners from "@/components/pageParts/partners"; import Partners from "@/components/pageParts/partners";
import Map from "@/components/pageParts/map"; import Map from "@/components/pageParts/map";
import CustomSlider from "@/components/pageParts/newsSlider";
export default function Home() { export default function Home() {
return ( return (
<div > <div>
<section id="products" className="mt-50 mb-10"> <section id="products" className="mt-50 mb-10">
<Products/> <Products />
</section> </section>
<Texnika/> <Texnika />
<Offer/> <Offer />
<Faq/> <CustomSlider/>
<Partners/> <Faq />
<Map/> <Partners />
<Map />
</div> </div>
); );
} }

8
assets/index.ts
View File

@@ -179,5 +179,9 @@ export {default as ToshCity } from './partners/tashkentcity.png';
// offer ekskavator image // offer ekskavator image
export {default as Ekskavator_offer} from './excavator.png'; export {default as Ekskavator_offer} from './excavator.png';
//footer icon image // footer icon image
export {default as Ekxkavator_vektor} from './excavator-vector.jpg'; export {default as Ekxkavator_vektor} from './excavator-vector.jpg';
// opacity back image
export {default as backOne} from './changeImg/jcb.avif';
export {default as backTwo} from './changeImg/4.jpg';

57
components/carPageParts/carType_head.tsx
View File

@@ -1,10 +1,57 @@
"use client" "use client";
import { useParams } from "next/navigation" import { backOne } from "@/assets";
import Image from "next/image";
import { useParams } from "next/navigation";
import Text from "../text";
import Link from "next/link";
export default function CarType_Header() { export default function CarType_Header() {
const router = useParams(); const params = useParams();
console.log(params);
return ( return (
<div>Header</div> <div
) dir="ltr"
className="w-full h-[300px] relative flex items-center justify-center "
>
{/* back image */}
<Image
alt="CarTypeImage"
src={backOne}
className="w-full h-full object-center object-cover absolute top-0 left-0 -z-20"
/>
{/* opacity */}
<div className="absolute top-0 left-0 w-full h-full -z-10 bg-black opacity-70"></div>
{/* title */}
<div
id="title-Part"
className="flex flex-col items-center justify-center gap-4"
>
<div
id="title"
className="text-white font-bold text-[50px] tracking-[2px]"
>
<Text txt={`${params.carType}`} />
</div>
<div
id="under-title"
className="text-white flex items-center justify-center gap-3"
>
<Link
href={"/"}
className="hover:cursor-pointer hover:text-secondary "
>
<Text txt="home" />
</Link>
/
<div className="text-secondary" >
<Text txt={`${params.carType}`} />
</div>
</div>
</div>
</div>
);
} }

4
components/carPageParts/productCard.tsx → components/cards/productCard.tsx
View File

@@ -6,14 +6,14 @@ import Link from "next/link";
export default function ProductCard({data}:{data: ProductTypes}) { export default function ProductCard({data}:{data: ProductTypes}) {
return ( return (
<Link href={`/${data.path}`} className="flex flex-col items-center justify-between rounded-sm hover:scale-105 hover:cursor-pointer hover:shadow-[0px_0px_5px_10px_#ebebeb]"> <Link href={`/${data.path}`} className="h-[400px] flex flex-col items-center justify-between rounded-sm hover:scale-105 hover:cursor-pointer hover:shadow-[0px_0px_5px_10px_#ebebeb]">
<div className="rounded-t-lg bg-white py-15 px-2" > <div className="rounded-t-lg bg-white py-15 px-2" >
<Image <Image
src={data.image} src={data.image}
alt={data.truck_name} alt={data.truck_name}
width={200} width={200}
height={200} height={200}
className="object-contain h-auto" className="object-contain max-h-[200px] h-full"
/> />
</div> </div>
<div className="bg-[#fafafa] w-full py-5 rounded-b-lg flex flex-col items-center justify-center "> <div className="bg-[#fafafa] w-full py-5 rounded-b-lg flex flex-col items-center justify-center ">

22
components/cards/sliderCard.tsx Normal file
View File

@@ -0,0 +1,22 @@
import Image, { StaticImageData } from "next/image";
import Link from "next/link";
interface typePropData{
id:number;
image:StaticImageData | string;
text:string;
title:string;
path:string;
}
export default function SliderCard({data}:{data:typePropData}) {
return (
<Link href={data.path} id="news_slider_card" className="group" >
<Image src={data.image} alt="slider image" width={1} height={1} />
<div className="relative border flex flex-col items-start justify-start">
<div>{data.title}</div>
<div>{data.text}</div>
</div>
</Link>
)
}

16
components/nav_foot/footer.tsx
View File

@@ -23,9 +23,9 @@ export default function Footer() {
<Image src={logoImg} alt="logo image" width={100} height={100} /> <Image src={logoImg} alt="logo image" width={100} height={100} />
<p className="text-white text-2xl font-bold">SPES-TEXNIKA</p> <p className="text-white text-2xl font-bold">SPES-TEXNIKA</p>
</div> </div>
<p className="leading-[28px] text-white text-xl max-w-[430px] w-full mt-8"> <div className="leading-[28px] text-white text-xl max-w-[430px] w-full mt-8">
<Text txt="footer-p" /> <Text txt="footer-p" />
</p> </div>
<div className="flex flex-col items-start gap-4 mt-10 "> <div className="flex flex-col items-start gap-4 mt-10 ">
<div className="text-white text-xl font-semibold"> <div className="text-white text-xl font-semibold">
<Text txt="subscribe" /> <Text txt="subscribe" />
@@ -63,18 +63,18 @@ export default function Footer() {
<div className="text-white text-2xl font-bold"> <div className="text-white text-2xl font-bold">
<Text txt="links" /> <Text txt="links" />
</div> </div>
<p className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer "> <div className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer ">
<span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span> <span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span>
<Text txt="products" /> <Text txt="products" />
</p> </div>
<p className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer "> <div className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer ">
<span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span> <span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span>
<Text txt="news" /> <Text txt="news" />
</p> </div>
<p className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer "> <div className="flex items-center gap-2 text-white hover:text-secondary hover:cursor-pointer ">
<span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span> <span className="w-[10px] h-[10px] bg-secondary rounded-[50%] "></span>
<Text txt="contact" /> <Text txt="contact" />
</p> </div>
</div> </div>
<div className="flex flex-col justify-start"> <div className="flex flex-col justify-start">

2
components/nav_foot/navbar.tsx
View File

@@ -33,7 +33,7 @@ export default function Navbar() {
return ( return (
<div <div
className={`w-[100%] bg-white border-gray shadow-lg shadow-gray-200 z-[1000] top-0`} className={`w-[100%] bg-white border-gray shadow-md shadow-gray-500 z-[1000] top-0`}
> >
<div className="container max-w-[1500px] w-full px-[10px] mx-auto items-center justify-between "> <div className="container max-w-[1500px] w-full px-[10px] mx-auto items-center justify-between ">
<div <div

86
components/pageParts/newsSlider.tsx Normal file
View File

@@ -0,0 +1,86 @@
"use client";
import { Swiper, SwiperSlide } from "swiper/react";
import { Navigation } from "swiper/modules";
import "swiper/css";
import "swiper/css/navigation";
import Image from "next/image";
import Title from "../title";
import SliderCard from "../cards/sliderCard";
// The custom CSS selectors for navigation
const navigationPrevEl = ".custom-swiper-prev";
const navigationNextEl = ".custom-swiper-next";
const data = [
{
id: 1,
image: "/images/yuklagich.jpg",
title: "Old Yuklagich",
text: "Yangi yuklagich siz uchun eng yaxshi texnika!",
path: "",
},
{
id: 2,
image: "/images/kompressor.jpg",
title: "Kompressor",
text: "Yangi kompressorlar to'plami aynan siz uchun",
path: "",
},
{
id: 3,
image: "/images/avtokran.jpg",
title: "Avtokran",
text: "Bizning kuchli kranlarimiz bilan ishingiz yanada osonlashadi.",
path: "",
},
];
export default function CustomSlider() {
return (
<div dir="ltr" className="w-full relative">
{/* Title */}
<div className="my-10 mb-20 flex items-center justify-between">
<Title text="news-h2" />
</div>
{/* Swiper */}
<Swiper
modules={[Navigation]}
slidesPerView={3}
spaceBetween={30}
loop={true}
navigation={{
// Pass the class selectors here
prevEl: navigationPrevEl,
nextEl: navigationNextEl,
}}
breakpoints={{
0: { slidesPerView: 1 },
768: { slidesPerView: 2 },
1024: { slidesPerView: 3 },
}}
>
{data.map((item, index) => (
<SwiperSlide key={index}>
<SliderCard data={item} />
</SwiperSlide>
))}
</Swiper>
{/* Custom buttons */}
<div className="absolute top-1/2 right-4 flex gap-2 -translate-y-1/2">
<button
className={`${navigationPrevEl.replace('.', '')} w-10 h-10 bg-blue-900 text-white flex items-center justify-center rounded hover:bg-blue-700 transition`}
>
‹
</button>
<button
className={`${navigationNextEl.replace('.', '')} w-10 h-10 bg-blue-900 text-white flex items-center justify-center rounded hover:bg-blue-700 transition`}
>
›
</button>
</div>
</div>
);
}

12
components/pageParts/products.tsx
View File

@@ -5,9 +5,9 @@ import Title from "../title";
import Text from "../text"; import Text from "../text";
import { Asphalt, Ekskavator, Forklift, Kran, Truck } from "@/assets"; import { Asphalt, Ekskavator, Forklift, Kran, Truck } from "@/assets";
import Image from "next/image"; import Image from "next/image";
import type {productFilterTypes, ProductTypes} from "@/types"; import type { productFilterTypes, ProductTypes } from "@/types";
import { allProducts } from "@/data"; import { allProducts } from "@/data";
import ProductCard from "../carPageParts/productCard"; import ProductCard from "../cards/productCard";
const productFilterTypes: productFilterTypes[] = [ const productFilterTypes: productFilterTypes[] = [
{ name: "trucks", image: Truck }, { name: "trucks", image: Truck },
@@ -58,9 +58,11 @@ export default function Products() {
</div> </div>
{/* products */} {/* products */}
<div className="grid gap-5 grid-cols-1 min-sm:grid-cols-2 min-lg:grid-cols-4 min-[1210px]:grid-cols-4" > <div className="grid gap-5 grid-cols-1 min-sm:grid-cols-2 min-lg:grid-cols-4 min-[1210px]:grid-cols-4">
{allProducts.map((item:ProductTypes)=>( {allProducts.map((item: ProductTypes, index: number) => (
<ProductCard data={item} /> <div key={index} >
<ProductCard data={item} />
</div>
))} ))}
</div> </div>
</div> </div>

3
public/locales/ru/common.json
View File

@@ -167,5 +167,6 @@
"news-title1": "Лучший прокат оборудования для твой следующий проект", "news-title1": "Лучший прокат оборудования для твой следующий проект",
"news-title2": "Новый погрузчик - это именно то, что вам нужно!", "news-title2": "Новый погрузчик - это именно то, что вам нужно!",
"news-title3": "Новый комплект компрессоров специально для вас", "news-title3": "Новый комплект компрессоров специально для вас",
"news-title4": "С нашими мощными кранами ваша работа станет проще" "news-title4": "С нашими мощными кранами ваша работа станет проще",
"tex-rent":"Аренда оборудования"
} }

3
public/locales/uz/common.json
View File

@@ -169,5 +169,6 @@
"news-title1": "Keyingi loyihangiz uchun eng yaxshi texnikalar ijarasi", "news-title1": "Keyingi loyihangiz uchun eng yaxshi texnikalar ijarasi",
"news-title2": "Yangi yuklagich siz uchun eng yaxshi texnika!", "news-title2": "Yangi yuklagich siz uchun eng yaxshi texnika!",
"news-title3": "Yangi kompressorlar to'plami aynan siz uchun", "news-title3": "Yangi kompressorlar to'plami aynan siz uchun",
"news-title4": "Bizning kuchli kranlarimiz bilan ishingiz yanada osonlashadi." "news-title4": "Bizning kuchli kranlarimiz bilan ishingiz yanada osonlashadi.",
"tex-rent":"Texnikalar ijarasi"
} }