Compare commits
No commits in common. "62e544d1200ff2762147a69d53df71cb2023af6e" and "00257ce07bd83f685cde161ff7e8919f7c043ba1" have entirely different histories.
62e544d120
...
00257ce07b
@ -1,17 +1,5 @@
|
||||
import AboutPage from '@/pages-templates/about';
|
||||
import AboutPage from "@/pages-templates/about";
|
||||
|
||||
import { mainPageApi } from '@/features/pages/api/pages.api';
|
||||
|
||||
import { makeStore } from '@/shared/store';
|
||||
|
||||
export default async function About() {
|
||||
const store = makeStore();
|
||||
|
||||
const { data, isLoading } = await store.dispatch(
|
||||
mainPageApi.endpoints.fetchAboutUsPageContent.initiate(),
|
||||
);
|
||||
|
||||
if (isLoading || !data) return null;
|
||||
|
||||
return <AboutPage content={data} />;
|
||||
export default function About(){
|
||||
return <AboutPage/>
|
||||
}
|
||||
|
||||
@ -1,8 +0,0 @@
|
||||
import { HistoryItems, Reviews, Stations, TeamMembers } from '.';
|
||||
|
||||
export type AboutUsPageData = {
|
||||
team: TeamMembers;
|
||||
history: HistoryItems;
|
||||
stations: Stations;
|
||||
reviews: Reviews;
|
||||
};
|
||||
@ -1,13 +1,3 @@
|
||||
import {
|
||||
presentDiscounts,
|
||||
presentHistoryItems,
|
||||
presentJobs,
|
||||
presentPartners,
|
||||
presentReviews,
|
||||
presentStations,
|
||||
presentTeamMembers,
|
||||
} from '../presenters';
|
||||
|
||||
export type Root<T> = { records: T[] };
|
||||
|
||||
export interface Image {
|
||||
@ -75,18 +65,3 @@ export type History = Root<{
|
||||
_god: string;
|
||||
_opisanie: string;
|
||||
}>;
|
||||
|
||||
export type Review = Root<{
|
||||
id: number;
|
||||
_name: string;
|
||||
_otzyv: string;
|
||||
_rejting: number;
|
||||
}>;
|
||||
|
||||
export type TeamMembers = ReturnType<typeof presentTeamMembers>;
|
||||
export type HistoryItems = ReturnType<typeof presentHistoryItems>;
|
||||
export type Stations = ReturnType<typeof presentStations>;
|
||||
export type Partners = ReturnType<typeof presentPartners>;
|
||||
export type Jobs = ReturnType<typeof presentJobs>;
|
||||
export type Discounts = ReturnType<typeof presentDiscounts>;
|
||||
export type Reviews = ReturnType<typeof presentReviews>;
|
||||
|
||||
@ -1,4 +1,14 @@
|
||||
import { Discounts, Jobs, Partners, Stations } from '.';
|
||||
import {
|
||||
presentDiscounts,
|
||||
presentJobs,
|
||||
presentPartners,
|
||||
presentStations,
|
||||
} from '../presenters';
|
||||
|
||||
export type Partners = ReturnType<typeof presentPartners>;
|
||||
export type Jobs = ReturnType<typeof presentJobs>;
|
||||
export type Discounts = ReturnType<typeof presentDiscounts>;
|
||||
export type Stations = ReturnType<typeof presentStations>;
|
||||
|
||||
export type MainPageData = {
|
||||
discounts: Discounts;
|
||||
|
||||
@ -6,7 +6,6 @@ import {
|
||||
Image,
|
||||
Job,
|
||||
Partner,
|
||||
Review,
|
||||
Select,
|
||||
Station,
|
||||
Team,
|
||||
@ -84,11 +83,3 @@ export const presentTexts = (texts: TextResponse) =>
|
||||
key: item._name,
|
||||
value: item._znachenie,
|
||||
}));
|
||||
|
||||
export const presentReviews = (reviews: Review) =>
|
||||
reviews.records.map((review) => ({
|
||||
id: review.id,
|
||||
fullname: review._name,
|
||||
review: review._otzyv,
|
||||
rating: review._rejting,
|
||||
}));
|
||||
|
||||
@ -1,13 +1,6 @@
|
||||
import {
|
||||
historyRequest,
|
||||
reviewsRequest,
|
||||
stationsWithImageRequest,
|
||||
teamRequest,
|
||||
} from './common';
|
||||
import { historyRequest, teamRequest } from './common';
|
||||
|
||||
export const aboutUsPageRequest = {
|
||||
...teamRequest,
|
||||
...historyRequest,
|
||||
...stationsWithImageRequest,
|
||||
...reviewsRequest,
|
||||
};
|
||||
|
||||
@ -1,5 +1,3 @@
|
||||
import { EnumType } from 'json-to-graphql-query';
|
||||
|
||||
export const stationsRequest = {
|
||||
_azs: {
|
||||
records: {
|
||||
@ -29,48 +27,6 @@ export const stationsRequest = {
|
||||
},
|
||||
};
|
||||
|
||||
export const stationsWithImageRequest = {
|
||||
_azs: {
|
||||
__args: {
|
||||
filtersSet: {
|
||||
conjunction: new EnumType('and'),
|
||||
filtersSet: [
|
||||
{
|
||||
field: new EnumType('_foto'),
|
||||
operator: 'isNotEmpty',
|
||||
value: [],
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
|
||||
records: {
|
||||
_name: true,
|
||||
_opisanie: true,
|
||||
_adress: true,
|
||||
_chasyRaboty: {
|
||||
name: true,
|
||||
},
|
||||
_lat: true,
|
||||
_long: true,
|
||||
_avtomojka: true,
|
||||
_dtCopy: true, // ai92
|
||||
_ai92Copy: true, // ai95
|
||||
_ai95Copy: true, // z100
|
||||
_z100Copy: true, // propan
|
||||
_propanCopy: true, // electricCharge
|
||||
_zaryadnayaStanci: true, // miniMarket
|
||||
_miniMarketCop: true, // toilet
|
||||
_region: {
|
||||
name: true,
|
||||
},
|
||||
_foto: {
|
||||
url: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export const partnersRequest = {
|
||||
_partners: {
|
||||
records: {
|
||||
@ -142,14 +98,3 @@ export const historyRequest = {
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export const reviewsRequest = {
|
||||
_otzyvy: {
|
||||
records: {
|
||||
id: true,
|
||||
_name: true,
|
||||
_otzyv: true,
|
||||
_rejting: true,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
@ -1,7 +1,5 @@
|
||||
import {
|
||||
presentHistoryItems,
|
||||
presentReviews,
|
||||
presentStations,
|
||||
presentTeamMembers,
|
||||
} from '@/app/api-utlities/presenters';
|
||||
import { aboutUsPageRequest } from '@/app/api-utlities/requests/about-us-page.request';
|
||||
@ -16,8 +14,6 @@ const routeHandler = async () => {
|
||||
JSON.stringify({
|
||||
team: presentTeamMembers(response.data._komanda),
|
||||
history: presentHistoryItems(response.data._istoriya),
|
||||
stations: presentStations(response.data._azs),
|
||||
reviews: presentReviews(response.data._otzyvy),
|
||||
}),
|
||||
{
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
|
||||
@ -1,7 +1,3 @@
|
||||
import { mainPageApi } from '@/features/pages/api/pages.api';
|
||||
|
||||
import { makeStore } from '@/shared/store';
|
||||
|
||||
import { AboutSection } from '@/widgets/about-section';
|
||||
import { CharitySection } from '@/widgets/charity-section';
|
||||
import { CtaSection } from '@/widgets/cta-section';
|
||||
@ -12,24 +8,23 @@ import { PromotionsSection } from '@/widgets/promotions-section';
|
||||
import { StatsSection } from '@/widgets/stats-section';
|
||||
import { VacanciesSection } from '@/widgets/vacancies-section';
|
||||
|
||||
import { MainPageData } from './api-utlities/@types/main';
|
||||
|
||||
export default async function Home() {
|
||||
const store = makeStore();
|
||||
|
||||
const { data, isLoading } = await store.dispatch(
|
||||
mainPageApi.endpoints.fetchMainPageContent.initiate(),
|
||||
);
|
||||
|
||||
if (isLoading || !data) return null;
|
||||
const mainPageData = (await fetch(
|
||||
`${process.env.NEXT_PUBLIC_BASE_URL}/api/pages/main`,
|
||||
{ method: 'GET' },
|
||||
).then((res) => res.json())) as MainPageData;
|
||||
|
||||
return (
|
||||
<main>
|
||||
<HeroSection />
|
||||
<StatsSection />
|
||||
<MapSection stations={data.stations} />
|
||||
<MapSection stations={mainPageData.stations} />
|
||||
<AboutSection />
|
||||
<PromotionsSection discounts={data.discounts} />
|
||||
<VacanciesSection jobs={data.jobs} />
|
||||
<PartnersSection partners={data.partners} />
|
||||
<PromotionsSection discounts={mainPageData.discounts} />
|
||||
<VacanciesSection jobs={mainPageData.jobs} />
|
||||
<PartnersSection partners={mainPageData.partners} />
|
||||
<CharitySection />
|
||||
<CtaSection />
|
||||
</main>
|
||||
|
||||
@ -1,19 +0,0 @@
|
||||
import { AboutUsPageData } from '@/app/api-utlities/@types/about-us';
|
||||
import { MainPageData } from '@/app/api-utlities/@types/main';
|
||||
|
||||
import { baseAPI } from '@/shared/api/base-api';
|
||||
|
||||
export const mainPageApi = baseAPI.injectEndpoints({
|
||||
endpoints: (builder) => ({
|
||||
fetchMainPageContent: builder.query<MainPageData, void>({
|
||||
query: () => '/pages/main',
|
||||
}),
|
||||
|
||||
fetchAboutUsPageContent: builder.query<AboutUsPageData, void>({
|
||||
query: () => '/pages/about-us',
|
||||
}),
|
||||
}),
|
||||
});
|
||||
|
||||
export const { useFetchMainPageContentQuery, useFetchAboutUsPageContentQuery } =
|
||||
mainPageApi;
|
||||
@ -100,7 +100,7 @@ export function CorporateDashboard() {
|
||||
<div className='flex min-h-screen flex-col px-2.5'>
|
||||
<main className='flex-1 py-10'>
|
||||
<div className='container mx-auto max-w-6xl'>
|
||||
<div className='mb-4 flex flex-col gap-4 items-start sm:justify-between sm:items-center sm:mb-8 sm:flex-row'>
|
||||
<div className='mb-8 flex items-center justify-between'>
|
||||
<h1 className='text-3xl font-bold'>{t('corporate.pageTitle')}</h1>
|
||||
<Button variant='outline' className='gap-2'>
|
||||
<LogOut className='h-4 w-4' />
|
||||
@ -110,7 +110,7 @@ export function CorporateDashboard() {
|
||||
|
||||
<div className='mb-10 grid gap-3 md:grid-cols-3 md:gap-6'>
|
||||
{/* Company Card */}
|
||||
<Card data-aos='zoom-in' data-aos-mirror="true" className='md:col-span-2 order-2 md:order-1'>
|
||||
<Card data-aos='zoom-in' data-aos-mirror="true" className='md:col-span-2'>
|
||||
<CardHeader className='pb-2'>
|
||||
<CardTitle className='flex items-center gap-2'>
|
||||
<Building2 className='h-5 w-5 text-red-600' />
|
||||
@ -166,7 +166,7 @@ export function CorporateDashboard() {
|
||||
</Card>
|
||||
|
||||
{/* Fund Card */}
|
||||
<Card data-aos='zoom-in' data-aos-mirror="true" className='bg-gradient-to-br from-red-600 to-red-800 text-white order-1 md:order-2'>
|
||||
<Card data-aos='zoom-in' data-aos-mirror="true" className='bg-gradient-to-br from-red-600 to-red-800 text-white'>
|
||||
<CardHeader>
|
||||
<CardTitle className='flex items-center gap-2'>
|
||||
<Wallet className='h-5 w-5' />
|
||||
|
||||
@ -15,7 +15,6 @@ import {
|
||||
} from '@/shared/shadcn-ui/card';
|
||||
|
||||
import { TransactionsTable } from '@/widgets/transactions-table';
|
||||
import Loader from '@/shared/shadcn-ui/loader';
|
||||
|
||||
export function CustomerDashboard() {
|
||||
const { t } = useTextController();
|
||||
@ -37,7 +36,8 @@ export function CustomerDashboard() {
|
||||
<div className='mb-10 grid gap-3 md:grid-cols-3 md:gap-6'>
|
||||
<Card data-aos="zoom-in" data-aos-mirror="true" className='bg-gradient-to-br from-red-600 to-red-800 text-white'>
|
||||
{!data || isLoading ? (
|
||||
<Loader/>
|
||||
// TODO: Bunyod please add loader here
|
||||
<>Loader here</>
|
||||
) : (
|
||||
<>
|
||||
<CardHeader>
|
||||
@ -82,7 +82,8 @@ export function CustomerDashboard() {
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
{!data || isLoading ? (
|
||||
<Loader/>
|
||||
// TODO: Bunyod please add loader here
|
||||
<>Loader here</>
|
||||
) : (
|
||||
<div className='grid gap-6 md:grid-cols-2'>
|
||||
<div>
|
||||
|
||||
@ -3,28 +3,24 @@
|
||||
import { Fuel, History, MapPin, Star, Target, Users } from 'lucide-react';
|
||||
import Image from 'next/image';
|
||||
|
||||
import { AboutUsPageData } from '@/app/api-utlities/@types/about-us';
|
||||
// import { useTranslation } from 'next-i18next';
|
||||
|
||||
import AnimatedCounter from '@/shared/components/animated-counter';
|
||||
import { useTextController } from '@/shared/language/hooks/use-text-controller';
|
||||
import { Button } from '@/shared/shadcn-ui/button';
|
||||
import { Card, CardContent } from '@/shared/shadcn-ui/card';
|
||||
import Container from '@/shared/shadcn-ui/conteiner';
|
||||
|
||||
import { CompanyTimeline } from '@/widgets/about-page/company-timeline';
|
||||
import { StationGallery } from '@/widgets/about-page/station-gallery';
|
||||
import { CtaSection } from '@/widgets/cta-section';
|
||||
import Container from '@/shared/shadcn-ui/conteiner';
|
||||
|
||||
export const metadata = {
|
||||
title: 'about.metadata.title',
|
||||
description: 'about.metadata.description',
|
||||
};
|
||||
|
||||
export interface AboutPageProps {
|
||||
content: AboutUsPageData;
|
||||
}
|
||||
|
||||
export default function AboutPage({ content }: AboutPageProps) {
|
||||
export default function AboutPage() {
|
||||
const { t } = useTextController();
|
||||
|
||||
return (
|
||||
@ -42,11 +38,7 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
priority
|
||||
/>
|
||||
<div className='absolute inset-0 flex items-center bg-gradient-to-r from-black/70 to-black/30 px-2'>
|
||||
<div
|
||||
data-aos='fade-down'
|
||||
data-aos-duration='1000'
|
||||
className='container mx-auto'
|
||||
>
|
||||
<div data-aos='fade-down' data-aos-duration="1000" className='container mx-auto'>
|
||||
<div className='max-w-2xl space-y-4 text-white'>
|
||||
<h1 className='text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl'>
|
||||
{t('about.hero.title')}
|
||||
@ -61,7 +53,7 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
</section>
|
||||
|
||||
{/* Company Overview */}
|
||||
<Container>
|
||||
<Container>
|
||||
<section className='py-16'>
|
||||
<div className='container mx-auto'>
|
||||
<div className='grid items-center gap-12 md:grid-cols-2'>
|
||||
@ -82,7 +74,7 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
{t('about.overview.description3')}
|
||||
</p>
|
||||
|
||||
<div className='mb-6 grid grid-cols-1 gap-4 md:grid-cols-2'>
|
||||
<div className='mb-6 grid md:grid-cols-2 gap-4 grid-cols-1'>
|
||||
{[0, 1, 2, 3].map((index) => (
|
||||
<div key={index} className='flex items-start'>
|
||||
<div className='mt-1 flex h-6 w-6 flex-shrink-0 items-center justify-center rounded-full bg-red-600'>
|
||||
@ -100,10 +92,7 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
data-aos='zoom-out-right'
|
||||
className='relative h-[500px] overflow-hidden rounded-xl shadow-xl'
|
||||
>
|
||||
<div data-aos="zoom-out-right" className='relative h-[500px] overflow-hidden rounded-xl shadow-xl'>
|
||||
<Image
|
||||
src='/placeholder.svg?height=500&width=600&text=Главный+офис'
|
||||
alt={t('about.overview.imageAlt')}
|
||||
@ -127,7 +116,7 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
{t('about.stats.subtitle')}
|
||||
</p>
|
||||
</div>
|
||||
<div className='grid grid-cols-1 gap-8 text-center sm:grid-cols-2 md:grid-cols-4'>
|
||||
<div className='grid grid-cols-1 sm:grid-cols-2 gap-8 text-center md:grid-cols-4'>
|
||||
{[0, 1, 2, 3].map((index) => (
|
||||
<div key={index} className='space-y-2'>
|
||||
<h3 className='text-4xl font-bold'>
|
||||
@ -168,8 +157,9 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
</Container>
|
||||
|
||||
<Container>
|
||||
<CompanyTimeline timeline={content.history} />
|
||||
<CompanyTimeline />
|
||||
</Container>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@ -189,7 +179,7 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<StationGallery stations={content.stations} />
|
||||
<StationGallery />
|
||||
|
||||
<div className='mt-12 text-center'>
|
||||
<p className='mx-auto mb-6 max-w-2xl text-gray-600'>
|
||||
@ -220,11 +210,7 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div
|
||||
data-aos='flip-up'
|
||||
data-aos-duration='600'
|
||||
className='grid gap-8 md:grid-cols-3'
|
||||
>
|
||||
<div data-aos='flip-up' data-aos-duration='600' className='grid gap-8 md:grid-cols-3'>
|
||||
{[0, 1, 2].map((index) => (
|
||||
<Card
|
||||
key={index}
|
||||
@ -251,7 +237,7 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
{/* Our Team */}
|
||||
<Container>
|
||||
<section className='bg-gray-50 py-16'>
|
||||
<div className='container mx-auto px-2'>
|
||||
<div className='container mx-auto'>
|
||||
<div className='mb-12 flex flex-col items-center justify-center text-center'>
|
||||
<div className='mb-4 inline-flex items-center justify-center rounded-full bg-red-100 p-2'>
|
||||
<Users className='h-6 w-6 text-red-600' />
|
||||
@ -264,29 +250,27 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div
|
||||
data-aos='flip-down'
|
||||
data-aos-duration='600'
|
||||
className='grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-4'
|
||||
>
|
||||
{content.team.map((member, index) => (
|
||||
<div data-aos='flip-down' data-aos-duration='600' className='grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-4'>
|
||||
{[0, 1, 2, 3].map((index) => (
|
||||
<div
|
||||
key={index}
|
||||
className='overflow-hidden rounded-lg bg-white shadow-md transition-transform hover:scale-105'
|
||||
>
|
||||
<div className='relative h-64 w-full'>
|
||||
{member.photo && (
|
||||
<Image
|
||||
src={member.photo}
|
||||
alt={t(`about.team.members.${index}.name`)}
|
||||
fill
|
||||
className='object-cover'
|
||||
/>
|
||||
)}
|
||||
<Image
|
||||
src={`/placeholder.svg?height=300&width=300&text=${t(`about.team.members.${index}.name`)}`}
|
||||
alt={t(`about.team.members.${index}.name`)}
|
||||
fill
|
||||
className='object-cover'
|
||||
/>
|
||||
</div>
|
||||
<div className='p-4 text-center'>
|
||||
<h3 className='text-lg font-bold'>{member.name}</h3>
|
||||
<p className='text-gray-600'>{member.profession}</p>
|
||||
<h3 className='text-lg font-bold'>
|
||||
{t(`about.team.members.${index}.name`)}
|
||||
</h3>
|
||||
<p className='text-gray-600'>
|
||||
{t(`about.team.members.${index}.position`)}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
@ -297,6 +281,7 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
|
||||
{/* Testimonials */}
|
||||
<Container>
|
||||
|
||||
<section className='py-16'>
|
||||
<div className='container mx-auto'>
|
||||
<div className='mb-12 flex flex-col items-center justify-center text-center'>
|
||||
@ -311,11 +296,8 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div
|
||||
data-aos='zoom-out-right'
|
||||
className='grid gap-8 md:grid-cols-3'
|
||||
>
|
||||
{content.reviews.map((review, index) => (
|
||||
<div data-aos="zoom-out-right" className='grid gap-8 md:grid-cols-3'>
|
||||
{[0, 1, 2].map((index) => (
|
||||
<Card
|
||||
key={index}
|
||||
className='overflow-hidden transition-all hover:shadow-lg'
|
||||
@ -327,14 +309,16 @@ export default function AboutPage({ content }: AboutPageProps) {
|
||||
.map((_, i) => (
|
||||
<Star
|
||||
key={i}
|
||||
className={`h-5 w-5 ${i < Number(review.rating) ? 'fill-yellow-400 text-yellow-400' : 'text-gray-300'}`}
|
||||
className={`h-5 w-5 ${i < Number(t(`about.testimonials.items.${index}.rating`)) ? 'fill-yellow-400 text-yellow-400' : 'text-gray-300'}`}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<p className='mb-4 text-gray-600 italic'>
|
||||
"{review.review}"
|
||||
"{t(`about.testimonials.items.${index}.text`)}"
|
||||
</p>
|
||||
<p className='font-semibold'>
|
||||
{t(`about.testimonials.items.${index}.name`)}
|
||||
</p>
|
||||
<p className='font-semibold'>{review.fullname}</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
))}
|
||||
|
||||
@ -10,19 +10,7 @@ interface AosInitProps {
|
||||
|
||||
export const AosProvider = ({ children }: AosInitProps) => {
|
||||
useEffect(() => {
|
||||
const timer = setTimeout(() => {
|
||||
AOS.init({
|
||||
once: false,
|
||||
offset: 100,
|
||||
duration: 600,
|
||||
easing: 'ease-out-quart',
|
||||
});
|
||||
}, 500);
|
||||
|
||||
return () => {
|
||||
clearTimeout(timer);
|
||||
AOS.refreshHard();
|
||||
};
|
||||
AOS.init({ once: false, mirror: false, });
|
||||
}, []);
|
||||
|
||||
return <>{children}</>;
|
||||
|
||||
@ -1,9 +0,0 @@
|
||||
'use client'
|
||||
|
||||
export default function Loader() {
|
||||
return (
|
||||
<div className="flex justify-center items-center p-8">
|
||||
<div className="animate-spin rounded-full h-14 w-14 border-4 border-black border-t-transparent"></div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@ -3,19 +3,64 @@
|
||||
import { Calendar, ChevronDown, ChevronUp } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
|
||||
import { HistoryItems } from '@/app/api-utlities/@types/about-us';
|
||||
|
||||
import { useTextController } from '@/shared/language/hooks/use-text-controller';
|
||||
import { Button } from '@/shared/shadcn-ui/button';
|
||||
import { Card, CardContent } from '@/shared/shadcn-ui/card';
|
||||
|
||||
export interface CompanyTimelineProps {
|
||||
timeline: HistoryItems;
|
||||
}
|
||||
const timelineEvents = [
|
||||
{
|
||||
year: '2008',
|
||||
title: 'Основание компании',
|
||||
description:
|
||||
'GasNetwork была основана с открытием первых трех заправочных станций в Душанбе. С самого начала компания поставила перед собой цель предоставлять качественное топливо и отличный сервис.',
|
||||
},
|
||||
{
|
||||
year: '2010',
|
||||
title: 'Расширение сети',
|
||||
description:
|
||||
'Открытие еще пяти заправочных станций в различных регионах Таджикистана. Начало формирования единого стандарта обслуживания на всех станциях сети.',
|
||||
},
|
||||
{
|
||||
year: '2012',
|
||||
title: 'Внедрение программы лояльности',
|
||||
description:
|
||||
'Запуск первой в Таджикистане программы лояльности для клиентов сети заправок. Введение карт постоянного клиента с накопительной системой бонусов.',
|
||||
},
|
||||
{
|
||||
year: '2014',
|
||||
title: 'Модернизация оборудования',
|
||||
description:
|
||||
'Масштабная программа по обновлению оборудования на всех заправочных станциях сети. Внедрение современных технологий для повышения качества обслуживания.',
|
||||
},
|
||||
{
|
||||
year: '2016',
|
||||
title: 'Открытие 15-й заправки',
|
||||
description:
|
||||
'Значительное расширение сети с открытием юбилейной 15-й заправочной станции. GasNetwork становится одной из крупнейших сетей заправок в Таджикистане.',
|
||||
},
|
||||
{
|
||||
year: '2018',
|
||||
title: 'Запуск мобильного приложения',
|
||||
description:
|
||||
'Разработка и запуск мобильного приложения для клиентов сети. Возможность отслеживать бонусы, находить ближайшие заправки и получать специальные предложения.',
|
||||
},
|
||||
{
|
||||
year: '2020',
|
||||
title: 'Создание благотворительного фонда',
|
||||
description:
|
||||
'Основание благотворительного фонда GasNetwork для поддержки социальных проектов в Таджикистане. Начало активной социальной деятельности компании.',
|
||||
},
|
||||
{
|
||||
year: '2023',
|
||||
title: 'Современное развитие',
|
||||
description:
|
||||
'Сегодня GasNetwork - это 25+ современных заправочных станций по всему Таджикистану, более 150 сотрудников и тысячи довольных клиентов ежедневно.',
|
||||
},
|
||||
];
|
||||
|
||||
export function CompanyTimeline({ timeline }: CompanyTimelineProps) {
|
||||
export function CompanyTimeline() {
|
||||
const [expanded, setExpanded] = useState(false);
|
||||
const displayEvents = expanded ? timeline : timeline.slice(0, 4);
|
||||
const displayEvents = expanded ? timelineEvents : timelineEvents.slice(0, 4);
|
||||
|
||||
const { t } = useTextController();
|
||||
|
||||
@ -35,7 +80,7 @@ export function CompanyTimeline({ timeline }: CompanyTimelineProps) {
|
||||
<Calendar className='size-5 text-red-600' />
|
||||
</div>
|
||||
<h3 className='text-xl font-bold'>{event.year}</h3>
|
||||
<h4 className='mb-2 text-lg font-semibold'>{event.name}</h4>
|
||||
<h4 className='mb-2 text-lg font-semibold'>{event.title}</h4>
|
||||
</div>
|
||||
|
||||
<div
|
||||
@ -63,7 +108,7 @@ export function CompanyTimeline({ timeline }: CompanyTimelineProps) {
|
||||
))}
|
||||
</div>
|
||||
|
||||
{timeline.length > 4 && (
|
||||
{timelineEvents.length > 4 && (
|
||||
<div className='mt-8 text-center'>
|
||||
<Button
|
||||
variant='outline'
|
||||
|
||||
@ -4,8 +4,6 @@ import { ChevronLeft, ChevronRight, Maximize } from 'lucide-react';
|
||||
import Image from 'next/image';
|
||||
import { useState } from 'react';
|
||||
|
||||
import { Stations } from '@/app/api-utlities/@types';
|
||||
|
||||
import { useTextController } from '@/shared/language/hooks/use-text-controller';
|
||||
import { Button } from '@/shared/shadcn-ui/button';
|
||||
import {
|
||||
@ -17,15 +15,55 @@ import {
|
||||
DialogTrigger,
|
||||
} from '@/shared/shadcn-ui/dialog';
|
||||
|
||||
export interface StationGalleryProps {
|
||||
stations: Stations;
|
||||
interface Station {
|
||||
id: number;
|
||||
name: string;
|
||||
image: string;
|
||||
location: string;
|
||||
}
|
||||
|
||||
export function StationGallery({ stations }: StationGalleryProps) {
|
||||
const stations: Array<Station> = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'АЗС Душанбе-Центр',
|
||||
image: '/placeholder.svg?height=400&width=600&text=АЗС+Душанбе-Центр',
|
||||
location: 'ул. Рудаки 150, Душанбе',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'АЗС Худжанд',
|
||||
image: '/placeholder.svg?height=400&width=600&text=АЗС+Худжанд',
|
||||
location: 'ул. Ленина 45, Худжанд',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'АЗС Куляб',
|
||||
image: '/placeholder.svg?height=400&width=600&text=АЗС+Куляб',
|
||||
location: 'ул. Сомони 78, Куляб',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'АЗС Бохтар',
|
||||
image: '/placeholder.svg?height=400&width=600&text=АЗС+Бохтар',
|
||||
location: 'ул. Айни 23, Бохтар',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'АЗС Хорог',
|
||||
image: '/placeholder.svg?height=400&width=600&text=АЗС+Хорог',
|
||||
location: 'ул. Горная 12, Хорог',
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
name: 'АЗС Истаравшан',
|
||||
image: '/placeholder.svg?height=400&width=600&text=АЗС+Истаравшан',
|
||||
location: 'ул. Исмоили Сомони 34, Истаравшан',
|
||||
},
|
||||
];
|
||||
|
||||
export function StationGallery() {
|
||||
const [currentImage, setCurrentImage] = useState(0);
|
||||
const [selectedStation, setSelectedStation] = useState<Stations[0] | null>(
|
||||
null,
|
||||
);
|
||||
const [selectedStation, setSelectedStation] = useState<Station | null>(null);
|
||||
|
||||
const nextImage = () => {
|
||||
setCurrentImage((prev) => (prev === stations.length - 1 ? 0 : prev + 1));
|
||||
@ -48,7 +86,7 @@ export function StationGallery({ stations }: StationGalleryProps) {
|
||||
/>
|
||||
<div className='absolute inset-0 flex flex-col justify-end bg-gradient-to-t from-black/70 to-transparent p-6 text-white'>
|
||||
<h3 className='text-2xl font-bold'>{stations[currentImage].name}</h3>
|
||||
<p className='text-white/80'>{stations[currentImage].address}</p>
|
||||
<p className='text-white/80'>{stations[currentImage].location}</p>
|
||||
</div>
|
||||
|
||||
<Button
|
||||
@ -87,7 +125,7 @@ export function StationGallery({ stations }: StationGalleryProps) {
|
||||
<DialogHeader>
|
||||
<DialogTitle>{stations[currentImage].name}</DialogTitle>
|
||||
<DialogDescription>
|
||||
{stations[currentImage].address}
|
||||
{stations[currentImage].location}
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<div className='relative h-[60vh] w-full'>
|
||||
|
||||
@ -12,7 +12,7 @@ export const HeroSection = () => {
|
||||
|
||||
return (
|
||||
<section className='relative'>
|
||||
<div className='relative h-[400px] w-full overflow-hidden sm:h-[500px] xl:h-[700px]'>
|
||||
<div className='relative h-[300px] w-full overflow-hidden md:h-[500px] xl:h-[700px]'>
|
||||
<Image
|
||||
src='/oriyo_bg.jpeg'
|
||||
alt='Gas Station Network'
|
||||
@ -24,14 +24,14 @@ export const HeroSection = () => {
|
||||
<div className='container mx-auto'>
|
||||
<div className='max-w-lg space-y-4 text-white'>
|
||||
<div className='animate-fade animate-duration-[3000ms] animate-ease-in-out'>
|
||||
<h1 className='font-bold tracking-tight text-4xl md:text-6xl'>
|
||||
<h1 className='text-2xl font-bold tracking-tight sm:text-4xl md:text-6xl'>
|
||||
{t('home.hero.title')}
|
||||
</h1>
|
||||
</div>
|
||||
<p className='text-gray-200 sm:text-lg'>
|
||||
{t('home.hero.description')}
|
||||
</p>
|
||||
<div className='flex flex-col mt-6 gap-2 sm:flex-row sm:gap-4'>
|
||||
<div className='flex flex-col gap-2 sm:flex-row sm:gap-4'>
|
||||
<Link href='#'>
|
||||
<Button className='bg-red-600 hover:bg-red-700'>
|
||||
{t('common.buttons.findStation')}{' '}
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
|
||||
import { Gift } from 'lucide-react';
|
||||
|
||||
import { Discounts } from '@/app/api-utlities/@types/index';
|
||||
import { Discounts } from '@/app/api-utlities/@types/main';
|
||||
|
||||
import PromotionSlider from '@/shared/components/promotion-slider';
|
||||
import { useTextController } from '@/shared/language/hooks/use-text-controller';
|
||||
|
||||
@ -110,7 +110,7 @@ export const TransactionsTable = () => {
|
||||
</h2>
|
||||
|
||||
<div className='flex w-full flex-col gap-4 md:w-auto md:flex-row'>
|
||||
<div className='grid sm:grid-cols-2 gap-2'>
|
||||
<div className='grid grid-cols-2 gap-2'>
|
||||
<div className='flex items-center gap-2'>
|
||||
<Label htmlFor='start-date'>
|
||||
{t('corporate.transactions.dateFrom')}
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
|
||||
import { Briefcase } from 'lucide-react';
|
||||
|
||||
import { Jobs } from '@/app/api-utlities/@types/index';
|
||||
import { Jobs } from '@/app/api-utlities/@types/main';
|
||||
|
||||
import { useTextController } from '@/shared/language/hooks/use-text-controller';
|
||||
import { cn } from '@/shared/lib/utils';
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user