Initial commit
This commit is contained in:
650
pages/AboutPage.tsx
Normal file
650
pages/AboutPage.tsx
Normal file
@@ -0,0 +1,650 @@
|
||||
import React, { useRef, useEffect, useState } from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { CheckCircle2, Award, Users, Building2, Briefcase, Phone, Mail, Globe, FileText, ExternalLink, Star } from 'lucide-react';
|
||||
|
||||
const AboutPage: React.FC = () => {
|
||||
const scrollContainerRef = useRef<HTMLDivElement>(null);
|
||||
const [isDragging, setIsDragging] = useState(false);
|
||||
const [startX, setStartX] = useState(0);
|
||||
const [scrollLeft, setScrollLeft] = useState(0);
|
||||
const [isHoveringCarousel, setIsHoveringCarousel] = useState(false);
|
||||
|
||||
const clients = [
|
||||
{ name: 'ООО «ТЕКСТРОЙПРОЕКТ»', color: 'from-blue-500 to-blue-600' },
|
||||
{ name: 'ООО НПРП «Легаз»', color: 'from-green-500 to-green-600' },
|
||||
{ name: 'ООО «Газпром трансгаз Уфа»', color: 'from-blue-600 to-blue-700' },
|
||||
{ name: 'ОАО «ВИФКнефть»', color: 'from-indigo-500 to-indigo-600' },
|
||||
{ name: 'ООО «Славнефть»', color: 'from-red-500 to-red-600' },
|
||||
{ name: 'ПАО АНК «Башнефть»', color: 'from-emerald-500 to-emerald-600' },
|
||||
{ name: 'ООО «ЛУКОЙЛ Уралнефтепродукт»', color: 'from-red-600 to-red-700' },
|
||||
{ name: 'ООО «СИБУР ХОЛДИНГ»', color: 'from-purple-500 to-purple-600' },
|
||||
{ name: 'ООО «Башкирская генерирующая компания»', color: 'from-amber-500 to-amber-600' },
|
||||
{ name: 'ООО «ОБ-СЕТЭМ»', color: 'from-pink-500 to-pink-600' },
|
||||
{ name: 'ООО «ОКЕМ Менеджмент»', color: 'from-teal-500 to-teal-600' },
|
||||
{ name: 'ООО «УралСпецБурГаз»', color: 'from-orange-500 to-orange-600' },
|
||||
{ name: 'ООО «Нефть Прикамья»', color: 'from-cyan-500 to-cyan-600' },
|
||||
{ name: 'ООО «Кемаколор Проект Групп»', color: 'from-lime-500 to-lime-600' },
|
||||
{ name: 'ООО «ВЕСТЕРОС»', color: 'from-rose-500 to-rose-600' },
|
||||
{ name: 'АО «ВД «ГОРОД»', color: 'from-sky-500 to-sky-600' },
|
||||
{ name: 'АО «Клининвестпром»', color: 'from-green-600 to-green-700' },
|
||||
{ name: 'АО «Башавтодор»', color: 'from-violet-500 to-violet-600' },
|
||||
{ name: 'ГУП РБ «УЖХ»', color: 'from-fuchsia-500 to-fuchsia-600' },
|
||||
{ name: 'ООО «ПОСТРОЙМАГРУПП»', color: 'from-yellow-500 to-yellow-600' },
|
||||
{ name: 'ООО «Парола Принедель»', color: 'from-teal-600 to-teal-700' },
|
||||
{ name: 'ПАО «Газпром теплоэнергетика Уфа»', color: 'from-blue-700 to-blue-800' },
|
||||
{ name: 'Администратор торговой системы оптового рынка электроэнергии', color: 'from-red-700 to-red-800' },
|
||||
{ name: 'ООО «Башкирская нефть»', color: 'from-cyan-600 to-cyan-700' },
|
||||
{ name: 'ООО ГК «Сибирия Менеджмент»', color: 'from-pink-600 to-pink-700' },
|
||||
{ name: 'АО «ВЭСКО»', color: 'from-orange-600 to-orange-700' },
|
||||
{ name: 'Муниципальное центр «ТЕХРЕСУРС»', color: 'from-slate-500 to-slate-600' },
|
||||
{ name: 'АО «СОВЕТСТРОЙМАЖ»', color: 'from-lime-600 to-lime-700' },
|
||||
{ name: 'ПАО «Саратовэнерго»', color: 'from-rose-600 to-rose-700' },
|
||||
{ name: 'ООО БашНИИстрой', color: 'from-sky-600 to-sky-700' },
|
||||
{ name: 'Проектное бюро АРТЭП', color: 'from-emerald-600 to-emerald-700' },
|
||||
{ name: 'ООО «СовМ-МедиаСтрой»', color: 'from-violet-600 to-violet-700' },
|
||||
{ name: 'ООО «УралспецБурГаз»', color: 'from-purple-600 to-purple-700' },
|
||||
{ name: 'Компания «АльфаИнжиниринг»', color: 'from-amber-600 to-amber-700' },
|
||||
{ name: 'Управляющая компания «DAMATE»', color: 'from-teal-700 to-teal-800' },
|
||||
{ name: 'ЗАО «Strabag»', color: 'from-blue-800 to-blue-900' },
|
||||
{ name: 'ПАО «Газпром Газэнергосети Салават»', color: 'from-red-800 to-red-900' },
|
||||
{ name: 'ООО «АНТЭ+Стройсервис»', color: 'from-cyan-700 to-cyan-800' },
|
||||
{ name: 'ООО ПКБ «Уралспектопромстандарт «Прокс»', color: 'from-pink-700 to-pink-800' }
|
||||
];
|
||||
|
||||
// Дублируем клиентов для бесшовной прокрутки
|
||||
const duplicatedClients = [...clients, ...clients];
|
||||
|
||||
useEffect(() => {
|
||||
const container = scrollContainerRef.current;
|
||||
if (!container) return;
|
||||
|
||||
let animationFrame: number;
|
||||
let scrollSpeed = 0.5;
|
||||
|
||||
const animate = () => {
|
||||
if (!isDragging && container) {
|
||||
container.scrollLeft += scrollSpeed;
|
||||
|
||||
// Бесшовная прокрутка: возврат к началу
|
||||
if (container.scrollLeft >= container.scrollWidth / 2) {
|
||||
container.scrollLeft = 0;
|
||||
}
|
||||
}
|
||||
animationFrame = requestAnimationFrame(animate);
|
||||
};
|
||||
|
||||
animate();
|
||||
|
||||
return () => cancelAnimationFrame(animationFrame);
|
||||
}, [isDragging]);
|
||||
|
||||
// Обработчики для перетаскивания мышью
|
||||
const handleMouseDown = (e: React.MouseEvent) => {
|
||||
setIsDragging(true);
|
||||
setStartX(e.pageX - (scrollContainerRef.current?.offsetLeft || 0));
|
||||
setScrollLeft(scrollContainerRef.current?.scrollLeft || 0);
|
||||
};
|
||||
|
||||
const handleMouseUp = () => {
|
||||
setIsDragging(false);
|
||||
};
|
||||
|
||||
const handleMouseMove = (e: React.MouseEvent) => {
|
||||
if (!isDragging) return;
|
||||
e.preventDefault();
|
||||
const x = e.pageX - (scrollContainerRef.current?.offsetLeft || 0);
|
||||
const walk = (x - startX) * 2;
|
||||
if (scrollContainerRef.current) {
|
||||
scrollContainerRef.current.scrollLeft = scrollLeft - walk;
|
||||
}
|
||||
};
|
||||
|
||||
const handleScrollContainerMouseLeave = () => {
|
||||
setIsDragging(false);
|
||||
};
|
||||
|
||||
// Обработчик для прокрутки колесом
|
||||
const handleWheel = (e: React.WheelEvent) => {
|
||||
// Не используем preventDefault для пассивных слушателей
|
||||
if (scrollContainerRef.current) {
|
||||
scrollContainerRef.current.scrollLeft += e.deltaY;
|
||||
}
|
||||
};
|
||||
|
||||
// Блокировка прокрутки страницы при наведении на карусель
|
||||
const handleCarouselMouseEnter = () => {
|
||||
setIsHoveringCarousel(true);
|
||||
document.body.style.overflow = 'hidden';
|
||||
};
|
||||
|
||||
const handleCarouselMouseLeave = () => {
|
||||
setIsHoveringCarousel(false);
|
||||
document.body.style.overflow = 'auto';
|
||||
};
|
||||
|
||||
// Очистка при размонтировании компонента
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
document.body.style.overflow = 'auto';
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="О компании"
|
||||
description="ООО «ГеоВектор» — лидер в области инженерных изысканий и проектирования в Республике Башкортостан."
|
||||
image="/media/images/headers/header-about.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
<div className="flex flex-col lg:flex-row gap-16 items-center">
|
||||
<div className="lg:w-1/2">
|
||||
<img
|
||||
src="/media/images/about/office.png"
|
||||
alt="Наш офис"
|
||||
className="rounded-3xl shadow-2xl w-full"
|
||||
/>
|
||||
</div>
|
||||
<div className="lg:w-1/2">
|
||||
<h2 className="text-3xl font-bold mb-6">История и Миссия</h2>
|
||||
<p className="text-gray-600 mb-6 leading-relaxed">
|
||||
Компания «ГеоВектор» была основана в 2010 году группой инженеров-энтузиастов. За годы работы мы выросли из небольшого бюро в крупную строительно-проектную организацию. Наша миссия — создавать надежную основу для инфраструктуры будущего, используя передовые технологии и многолетний опыт.
|
||||
</p>
|
||||
<p className="text-gray-600 mb-8 leading-relaxed">
|
||||
Мы гордимся тем, что наши проекты служат людям. Будь то жилые комплексы, промышленные объекты или энергетическая инфраструктура — мы всегда гарантируем качество и соблюдение сроков.
|
||||
</p>
|
||||
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="w-12 h-12 rounded-full bg-brand-light flex items-center justify-center text-brand-orange">
|
||||
<CheckCircle2 />
|
||||
</div>
|
||||
<div>
|
||||
<h4 className="font-bold">Лицензии и СРО</h4>
|
||||
<p className="text-sm text-gray-500">Полный пакет разрешительной документации</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="w-12 h-12 rounded-full bg-brand-light flex items-center justify-center text-brand-orange">
|
||||
<Award />
|
||||
</div>
|
||||
<div>
|
||||
<h4 className="font-bold">Гарантия качества</h4>
|
||||
<p className="text-sm text-gray-500">Многоуровневый контроль на всех этапах</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="w-12 h-12 rounded-full bg-brand-light flex items-center justify-center text-brand-orange">
|
||||
<Users />
|
||||
</div>
|
||||
<div>
|
||||
<h4 className="font-bold">Штат экспертов</h4>
|
||||
<p className="text-sm text-gray-500">Более 50 квалифицированных инженеров</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Секция вакансий */}
|
||||
<div className="bg-gray-50 py-20">
|
||||
<div className="container mx-auto px-6">
|
||||
<div className="max-w-6xl mx-auto">
|
||||
{/* Заголовок */}
|
||||
<div className="text-center mb-12">
|
||||
<h2 className="text-4xl md:text-5xl font-bold text-gray-900 mb-4">
|
||||
ГеоВектор приглашает к сотрудничеству!
|
||||
</h2>
|
||||
<p className="text-xl text-gray-700 flex items-center justify-center gap-2">
|
||||
<svg className="w-6 h-6 text-brand-orange" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
|
||||
</svg>
|
||||
г. Уфа, Комсомольская 19/1
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid lg:grid-cols-2 gap-8 mb-12">
|
||||
{/* Левая колонка - Вакансии */}
|
||||
<div className="bg-white rounded-2xl shadow-xl overflow-hidden">
|
||||
<div className="p-8">
|
||||
<div className="flex items-center gap-3 mb-8">
|
||||
<div className="w-14 h-14 bg-brand-orange/10 rounded-xl flex items-center justify-center">
|
||||
<Briefcase className="text-brand-orange" size={28} />
|
||||
</div>
|
||||
<h3 className="text-2xl font-bold text-gray-900">Наши вакансии:</h3>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
<div className="group p-5 bg-gradient-to-r from-gray-50 to-gray-100 rounded-xl hover:from-brand-orange/10 hover:to-brand-orange/20 transition-all border-l-4 border-brand-orange">
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="w-4 h-4 bg-brand-orange rounded-full flex-shrink-0"></div>
|
||||
<span className="text-lg font-bold text-gray-900">Инженер-геолог</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="group p-5 bg-gradient-to-r from-gray-50 to-gray-100 rounded-xl hover:from-brand-orange/10 hover:to-brand-orange/20 transition-all border-l-4 border-brand-orange">
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="w-4 h-4 bg-brand-orange rounded-full flex-shrink-0"></div>
|
||||
<span className="text-lg font-bold text-gray-900">Бухгалтер</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="relative h-64 overflow-hidden">
|
||||
<img
|
||||
src="/media/images/about/team-work.png"
|
||||
alt="Работа в ГеоВектор"
|
||||
className="w-full h-full object-cover"
|
||||
/>
|
||||
<div className="absolute inset-0 bg-gradient-to-t from-black/30 to-transparent"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Правая колонка - Условия и требования */}
|
||||
<div className="space-y-6">
|
||||
{/* Условия */}
|
||||
<div className="bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-2xl p-8 shadow-xl">
|
||||
<h3 className="text-2xl font-bold mb-6 flex items-center gap-2">
|
||||
<CheckCircle2 size={28} />
|
||||
Условия:
|
||||
</h3>
|
||||
<ul className="space-y-4">
|
||||
<li className="flex items-start gap-3">
|
||||
<div className="w-2 h-2 bg-white rounded-full mt-2 flex-shrink-0"></div>
|
||||
<span className="leading-relaxed">
|
||||
Стабильная заработная плата (выплаты 2 раза в месяц)
|
||||
</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-3">
|
||||
<div className="w-2 h-2 bg-white rounded-full mt-2 flex-shrink-0"></div>
|
||||
<span className="leading-relaxed">
|
||||
Оформление по ТК РФ, самозанятые или договор гражданско-правового характера
|
||||
</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-3">
|
||||
<div className="w-2 h-2 bg-white rounded-full mt-2 flex-shrink-0"></div>
|
||||
<span className="leading-relaxed">
|
||||
Режим работы 5/2 с 09:00-18:00
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Требования */}
|
||||
<div className="bg-white rounded-2xl p-8 shadow-xl border-2 border-gray-200">
|
||||
<h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-2">
|
||||
<Award className="text-brand-orange" size={28} />
|
||||
Требования:
|
||||
</h3>
|
||||
<ul className="space-y-4">
|
||||
<li className="flex items-start gap-3 text-gray-700">
|
||||
<div className="w-2 h-2 bg-brand-orange rounded-full mt-2 flex-shrink-0"></div>
|
||||
<span className="leading-relaxed">
|
||||
Опыт работы не менее 1 года
|
||||
</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-3 text-gray-700">
|
||||
<div className="w-2 h-2 bg-brand-orange rounded-full mt-2 flex-shrink-0"></div>
|
||||
<span className="leading-relaxed">
|
||||
Среднее или высшее профессиональное образование
|
||||
</span>
|
||||
</li>
|
||||
<li className="flex items-start gap-3 text-gray-700">
|
||||
<div className="w-2 h-2 bg-brand-orange rounded-full mt-2 flex-shrink-0"></div>
|
||||
<span className="leading-relaxed">
|
||||
Умение работать в коллективе, желание развиваться и совершенствовать свои навыки
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Контактная информация */}
|
||||
<div className="bg-gradient-to-br from-gray-900 to-gray-800 text-white rounded-2xl p-8 md:p-12 shadow-2xl">
|
||||
<h3 className="text-2xl md:text-3xl font-bold mb-8 text-center">
|
||||
Все вопросы по телефону:
|
||||
</h3>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-6 mb-8">
|
||||
<a
|
||||
href="tel:+79371560577"
|
||||
className="flex flex-col items-center gap-3 p-6 bg-white/10 rounded-xl hover:bg-white/20 transition-all hover:scale-105"
|
||||
>
|
||||
<div className="w-14 h-14 bg-brand-orange/20 rounded-full flex items-center justify-center">
|
||||
<Phone className="text-brand-orange" size={28} />
|
||||
</div>
|
||||
<div className="text-center">
|
||||
<div className="text-sm text-gray-400 mb-1">Телефон</div>
|
||||
<div className="font-bold text-lg">+7 (937) 156-05-77</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div className="flex flex-col items-center gap-3 p-6 bg-white/10 rounded-xl">
|
||||
<div className="w-14 h-14 bg-brand-orange/20 rounded-full flex items-center justify-center">
|
||||
<Users className="text-brand-orange" size={28} />
|
||||
</div>
|
||||
<div className="text-center">
|
||||
<div className="text-sm text-gray-400 mb-1">Контактное лицо</div>
|
||||
<div className="font-bold text-lg">Елизавета Валерьевна</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a
|
||||
href="mailto:kovaleva@geowektor.ru"
|
||||
className="flex flex-col items-center gap-3 p-6 bg-white/10 rounded-xl hover:bg-white/20 transition-all hover:scale-105"
|
||||
>
|
||||
<div className="w-14 h-14 bg-brand-orange/20 rounded-full flex items-center justify-center">
|
||||
<Mail className="text-brand-orange" size={28} />
|
||||
</div>
|
||||
<div className="text-center">
|
||||
<div className="text-sm text-gray-400 mb-1">Email</div>
|
||||
<div className="font-bold">kovaleva@geowektor.ru</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div className="text-center pt-6 border-t border-white/20">
|
||||
<a
|
||||
href="https://geowektor.ru"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 text-brand-orange hover:text-orange-400 transition-colors text-lg font-semibold"
|
||||
>
|
||||
<Globe size={24} />
|
||||
geowektor.ru
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Секция с клиентами */}
|
||||
<div className="bg-gray-50 py-20 overflow-hidden">
|
||||
<div className="container mx-auto px-6 mb-12">
|
||||
<div className="text-center">
|
||||
<div className="inline-flex items-center justify-center w-16 h-16 bg-brand-orange/10 rounded-full mb-6">
|
||||
<Building2 className="text-brand-orange" size={32} />
|
||||
</div>
|
||||
<h2 className="text-4xl font-bold text-gray-900 mb-4">Наши клиенты</h2>
|
||||
<p className="text-gray-600 text-lg max-w-2xl mx-auto">
|
||||
Более 200 компаний доверили нам свои проекты. Среди них крупнейшие предприятия нефтегазовой отрасли,
|
||||
строительные холдинги и государственные организации.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
className="relative"
|
||||
onMouseEnter={handleCarouselMouseEnter}
|
||||
onMouseLeave={handleCarouselMouseLeave}
|
||||
>
|
||||
<div
|
||||
ref={scrollContainerRef}
|
||||
onMouseDown={handleMouseDown}
|
||||
onMouseUp={handleMouseUp}
|
||||
onMouseMove={handleMouseMove}
|
||||
onMouseLeave={handleScrollContainerMouseLeave}
|
||||
onWheel={handleWheel}
|
||||
className={`flex gap-6 overflow-x-scroll scrollbar-hide ${isDragging ? 'cursor-grabbing' : 'cursor-grab'}`}
|
||||
style={{
|
||||
scrollbarWidth: 'none',
|
||||
msOverflowStyle: 'none',
|
||||
WebkitOverflowScrolling: 'touch'
|
||||
}}
|
||||
>
|
||||
{duplicatedClients.map((client, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="flex-shrink-0 w-72 group"
|
||||
draggable={false}
|
||||
>
|
||||
<div className={`relative bg-gradient-to-br ${client.color} rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-all duration-300 hover:scale-105 overflow-hidden`}>
|
||||
{/* Декоративные элементы */}
|
||||
<div className="absolute top-0 right-0 w-32 h-32 bg-white/10 rounded-full -mr-16 -mt-16"></div>
|
||||
<div className="absolute bottom-0 left-0 w-24 h-24 bg-white/10 rounded-full -ml-12 -mb-12"></div>
|
||||
|
||||
{/* Иконка здания */}
|
||||
<div className="relative flex items-center justify-center mb-6">
|
||||
<div className="w-16 h-16 bg-white/20 backdrop-blur-sm rounded-xl flex items-center justify-center">
|
||||
<Building2 className="text-white" size={32} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Название компании */}
|
||||
<div className="relative">
|
||||
<p className="text-center text-white font-bold text-lg leading-tight min-h-[60px] flex items-center justify-center">
|
||||
{client.name}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Нижний декоративный элемент */}
|
||||
<div className="mt-6 h-1 bg-white/30 rounded-full"></div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Градиенты по краям */}
|
||||
<div className="absolute left-0 top-0 bottom-0 w-32 bg-gradient-to-r from-gray-50 to-transparent pointer-events-none"></div>
|
||||
<div className="absolute right-0 top-0 bottom-0 w-32 bg-gradient-to-l from-gray-50 to-transparent pointer-events-none"></div>
|
||||
</div>
|
||||
|
||||
<div className="text-center mt-8">
|
||||
<p className="text-sm text-gray-500 italic">
|
||||
💡 Используйте мышь или колесо прокрутки для навигации
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Секция отзывов */}
|
||||
<div className="bg-white py-20">
|
||||
<div className="container mx-auto px-6">
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<div className="text-center mb-12">
|
||||
<div className="inline-flex items-center justify-center w-16 h-16 bg-brand-orange/10 rounded-full mb-6">
|
||||
<Star className="text-brand-orange" size={32} />
|
||||
</div>
|
||||
<h2 className="text-4xl font-bold text-gray-900 mb-4">Отзывы</h2>
|
||||
<p className="text-gray-600 text-lg max-w-2xl mx-auto">
|
||||
Благодарственные письма от наших партнеров и клиентов
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-6">
|
||||
{/* Отзыв 1 */}
|
||||
<div className="bg-gray-50 rounded-xl overflow-hidden hover:shadow-lg transition-shadow">
|
||||
<div className="bg-brand-orange p-6">
|
||||
<h3 className="text-xl font-bold text-white uppercase">
|
||||
ОТЗЫВ ДАЛЬТЕХПРОМ - ВЫПОЛНЕНИЕ ОБСЛЕДОВАТЕЛЬНЫХ РАБОТ
|
||||
</h3>
|
||||
</div>
|
||||
<div className="p-6">
|
||||
<a
|
||||
href="/media/feedback/1.pdf"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 text-brand-orange hover:text-orange-600 transition-colors group"
|
||||
>
|
||||
<div className="w-10 h-10 bg-red-100 rounded flex items-center justify-center group-hover:bg-red-200 transition-colors">
|
||||
<FileText className="text-red-600" size={20} />
|
||||
</div>
|
||||
<span className="font-semibold">Открыть документ (pdf)</span>
|
||||
<ExternalLink size={18} className="group-hover:translate-x-1 transition-transform" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Отзыв 2 */}
|
||||
<div className="bg-gray-50 rounded-xl overflow-hidden hover:shadow-lg transition-shadow">
|
||||
<div className="bg-brand-orange p-6">
|
||||
<h3 className="text-xl font-bold text-white uppercase">
|
||||
ОТЗЫВ ПЕГАЗ - КОМПЛЕКС ИНЖЕНЕРНЫХ ИЗЫСКАНИЙ
|
||||
</h3>
|
||||
</div>
|
||||
<div className="p-6">
|
||||
<a
|
||||
href="/media/feedback/2.pdf"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 text-brand-orange hover:text-orange-600 transition-colors group"
|
||||
>
|
||||
<div className="w-10 h-10 bg-red-100 rounded flex items-center justify-center group-hover:bg-red-200 transition-colors">
|
||||
<FileText className="text-red-600" size={20} />
|
||||
</div>
|
||||
<span className="font-semibold">Открыть документ (pdf)</span>
|
||||
<ExternalLink size={18} className="group-hover:translate-x-1 transition-transform" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Отзыв 3 */}
|
||||
<div className="bg-gray-50 rounded-xl overflow-hidden hover:shadow-lg transition-shadow">
|
||||
<div className="bg-brand-orange p-6">
|
||||
<h3 className="text-xl font-bold text-white uppercase">
|
||||
ОТЗЫВ БАШКИРЭНЕРГО - МОНТАЖ КТСО, ЭН
|
||||
</h3>
|
||||
</div>
|
||||
<div className="p-6">
|
||||
<a
|
||||
href="/media/feedback/3.pdf"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 text-brand-orange hover:text-orange-600 transition-colors group"
|
||||
>
|
||||
<div className="w-10 h-10 bg-red-100 rounded flex items-center justify-center group-hover:bg-red-200 transition-colors">
|
||||
<FileText className="text-red-600" size={20} />
|
||||
</div>
|
||||
<span className="font-semibold">Открыть документ (pdf)</span>
|
||||
<ExternalLink size={18} className="group-hover:translate-x-1 transition-transform" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Отзыв 4 */}
|
||||
<div className="bg-gray-50 rounded-xl overflow-hidden hover:shadow-lg transition-shadow">
|
||||
<div className="bg-brand-orange p-6">
|
||||
<h3 className="text-xl font-bold text-white uppercase">
|
||||
ОТЗЫВ БАШКИРЭНЕРГО - РЕКОНСТРУКЦИЯ ОБЪЕКТА "ТЕХУКРЕПЛЕННОСТЬ БАЗЫ ПО СЭС"
|
||||
</h3>
|
||||
</div>
|
||||
<div className="p-6">
|
||||
<a
|
||||
href="/media/feedback/4.pdf"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 text-brand-orange hover:text-orange-600 transition-colors group"
|
||||
>
|
||||
<div className="w-10 h-10 bg-red-100 rounded flex items-center justify-center group-hover:bg-red-200 transition-colors">
|
||||
<FileText className="text-red-600" size={20} />
|
||||
</div>
|
||||
<span className="font-semibold">Открыть документ (pdf)</span>
|
||||
<ExternalLink size={18} className="group-hover:translate-x-1 transition-transform" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Отзыв 5 */}
|
||||
<div className="bg-gray-50 rounded-xl overflow-hidden hover:shadow-lg transition-shadow">
|
||||
<div className="bg-brand-orange p-6">
|
||||
<h3 className="text-xl font-bold text-white uppercase">
|
||||
ОТЗЫВ ПБ ОНГМ - ЗЕМЛЕУСТРОИТЕЛЬНЫЕ И КАДАСТРОВЫЕ РАБОТЫ
|
||||
</h3>
|
||||
</div>
|
||||
<div className="p-6">
|
||||
<a
|
||||
href="/media/feedback/5.pdf"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 text-brand-orange hover:text-orange-600 transition-colors group"
|
||||
>
|
||||
<div className="w-10 h-10 bg-red-100 rounded flex items-center justify-center group-hover:bg-red-200 transition-colors">
|
||||
<FileText className="text-red-600" size={20} />
|
||||
</div>
|
||||
<span className="font-semibold">Открыть документ (pdf)</span>
|
||||
<ExternalLink size={18} className="group-hover:translate-x-1 transition-transform" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Отзыв 6 */}
|
||||
<div className="bg-gray-50 rounded-xl overflow-hidden hover:shadow-lg transition-shadow">
|
||||
<div className="bg-brand-orange p-6">
|
||||
<h3 className="text-xl font-bold text-white uppercase">
|
||||
ОТЗЫВ ПБ ОНГМ - СТРОИТЕЛЬСТВО АВТОМОБИЛЬНОЙ ДОРОГИ
|
||||
</h3>
|
||||
</div>
|
||||
<div className="p-6">
|
||||
<a
|
||||
href="/media/feedback/6.pdf"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 text-brand-orange hover:text-orange-600 transition-colors group"
|
||||
>
|
||||
<div className="w-10 h-10 bg-red-100 rounded flex items-center justify-center group-hover:bg-red-200 transition-colors">
|
||||
<FileText className="text-red-600" size={20} />
|
||||
</div>
|
||||
<span className="font-semibold">Открыть документ (pdf)</span>
|
||||
<ExternalLink size={18} className="group-hover:translate-x-1 transition-transform" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Отзыв 7 */}
|
||||
<div className="bg-gray-50 rounded-xl overflow-hidden hover:shadow-lg transition-shadow">
|
||||
<div className="bg-brand-orange p-6">
|
||||
<h3 className="text-xl font-bold text-white uppercase">
|
||||
ОТЗЫВ ЛУКОЙЛ-УРАЛНЕФТЕПРОДУКТ
|
||||
</h3>
|
||||
</div>
|
||||
<div className="p-6">
|
||||
<a
|
||||
href="/media/feedback/7.pdf"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 text-brand-orange hover:text-orange-600 transition-colors group"
|
||||
>
|
||||
<div className="w-10 h-10 bg-red-100 rounded flex items-center justify-center group-hover:bg-red-200 transition-colors">
|
||||
<FileText className="text-red-600" size={20} />
|
||||
</div>
|
||||
<span className="font-semibold">Открыть документ (pdf)</span>
|
||||
<ExternalLink size={18} className="group-hover:translate-x-1 transition-transform" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Отзыв 8 */}
|
||||
<div className="bg-gray-50 rounded-xl overflow-hidden hover:shadow-lg transition-shadow">
|
||||
<div className="bg-brand-orange p-6">
|
||||
<h3 className="text-xl font-bold text-white uppercase">
|
||||
ОТЗЫВ ЭЛЛАДА - КОМПЛЕКС ИНЖЕНЕРНЫХ ИЗЫСКАНИЙ
|
||||
</h3>
|
||||
</div>
|
||||
<div className="p-6">
|
||||
<a
|
||||
href="/media/feedback/8.pdf"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 text-brand-orange hover:text-orange-600 transition-colors group"
|
||||
>
|
||||
<div className="w-10 h-10 bg-red-100 rounded flex items-center justify-center group-hover:bg-red-200 transition-colors">
|
||||
<FileText className="text-red-600" size={20} />
|
||||
</div>
|
||||
<span className="font-semibold">Открыть документ (pdf)</span>
|
||||
<ExternalLink size={18} className="group-hover:translate-x-1 transition-transform" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default AboutPage;
|
||||
241
pages/BuildingSurveyPage.tsx
Normal file
241
pages/BuildingSurveyPage.tsx
Normal file
@@ -0,0 +1,241 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { Building2, ClipboardCheck, Wrench, CheckCircle2, Shield, FileSearch, Award } from 'lucide-react';
|
||||
|
||||
const BuildingSurveyPage: React.FC = () => {
|
||||
const equipment = [
|
||||
{ name: 'Дальномер лазерный', model: 'Leica DISTO D2', manufacturer: 'UL Japan', year: '06.2007', serial: '-/200049511' },
|
||||
{ name: 'Измеритель прочности ударно-импульсный (бетон)', model: 'ОНИКС-2,5', manufacturer: 'НПП «Интерприбор», г. Челябинск', year: '09.2016', serial: '538/2000205' },
|
||||
{ name: 'Ультразвуковой толщиномер (сталь)', model: 'ТУ-1', manufacturer: 'НПП «Интерприбор», г. Челябинск', year: '09.2016', serial: '273/' },
|
||||
{ name: 'Ультразвуковой толщиномер (сталь)', model: 'ТЭМП-4', manufacturer: 'ООО НПП «Технотест», г. Москва', year: '02.2016', serial: '2000206' },
|
||||
{ name: 'Прибор обнаружения стержней арматуры и измерения защитного слоя бетона (наведенным э/магнитным полем)', model: 'PROFOSCOPE', manufacturer: 'Proceq SA, Шверценбах, Швейцария', year: '2018', serial: '400757/' },
|
||||
{ name: 'Измеритель времени и скорости распространения ультразвука для определения дефектов, прочности, плотности, модуля деформации бетона', model: 'Пульсар-2М', manufacturer: 'НПП «Интерприбор», г. Челябинск', year: '05.2018', serial: 'зав. 738/-' },
|
||||
{ name: 'Измеритель прочности бетона ударно-импульсный', model: 'ИПС-МГ4', manufacturer: 'ООО СКБ Стройприбор', year: '07.2017', serial: '12548/20004989' },
|
||||
{ name: 'Токовые клещи. Измерение переменного тока, напряжения, сопротивления, проверки изоляции', model: 'TEK DT-266', manufacturer: '—', year: '—', serial: '—' },
|
||||
{ name: 'Дефектоскоп ультразвуковой УД2В-П, предназначен для контроля продукции на наличие дефектов типа нарушение сплошности и однородности материалов, полуфабрикатов, готовых изделий и сварных соединений', model: 'УД2В-П', manufacturer: '—', year: '—', serial: '—' },
|
||||
{ name: 'Насос опрессовочный ручной для трубопроводов систем водо, теплоснабжения', model: 'МЕГЕОН 98025', manufacturer: '—', year: '—', serial: '—' }
|
||||
];
|
||||
|
||||
const services = [
|
||||
{
|
||||
icon: Building2,
|
||||
title: 'Обследование конструкций',
|
||||
description: 'Детальная оценка технического состояния несущих и ограждающих конструкций зданий и сооружений'
|
||||
},
|
||||
{
|
||||
icon: FileSearch,
|
||||
title: 'Выявление дефектов',
|
||||
description: 'Обнаружение скрытых дефектов, трещин, деформаций и других повреждений конструктивных элементов'
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: 'Оценка безопасности',
|
||||
description: 'Определение несущей способности конструкций и оценка возможности дальнейшей эксплуатации здания'
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: 'Разработка рекомендаций',
|
||||
description: 'Подготовка технического заключения с рекомендациями по усилению или ремонту конструкций'
|
||||
}
|
||||
];
|
||||
|
||||
const advantages = [
|
||||
'Инженерные изыскания для строящихся и реконструируемых объектов',
|
||||
'Разработка проектной документации любой сложности',
|
||||
'Проведение капитального ремонта и перепланировки',
|
||||
'Разработка генеральных планов',
|
||||
'Выполнение строительных и электромонтажных работ',
|
||||
'Проектирование инженерных сетей'
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Обследование технического состояния здания"
|
||||
description="Профессиональная диагностика и оценка состояния строительных конструкций"
|
||||
image="/media/images/headers/header-observing-buildings.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
{/* Вступление */}
|
||||
<div className="max-w-5xl mx-auto mb-20">
|
||||
<div className="bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-2xl p-8 md:p-12">
|
||||
<p className="text-lg leading-relaxed">
|
||||
Проектно-изыскательская строительная компания <strong>ООО «ГеоВектор»</strong> оказывает комплексные
|
||||
услуги по подготовке, разработке и реализации строительных проектов. Мы осуществляем инженерные
|
||||
изыскания и разрабатываем проектную документацию для строящихся или реконструируемых объектов,
|
||||
проведения капитального ремонта и перепланировки, разрабатываем генеральные планы, выполняем любые
|
||||
строительные, электромонтажные работы и проектируем инженерные сети.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Услуги обследования */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-4 text-center">
|
||||
Виды обследований
|
||||
</h2>
|
||||
<p className="text-center text-gray-600 mb-12 max-w-3xl mx-auto">
|
||||
Комплексный подход к оценке технического состояния зданий и сооружений
|
||||
</p>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
{services.map((service, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-white border-2 border-gray-200 rounded-2xl p-8 hover:border-brand-orange transition-all duration-300 hover:shadow-xl"
|
||||
>
|
||||
<div className="flex items-start gap-4 mb-4">
|
||||
<div className="flex-shrink-0 w-14 h-14 bg-brand-orange text-white rounded-xl flex items-center justify-center">
|
||||
<service.icon size={28} />
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900 leading-tight pt-2">
|
||||
{service.title}
|
||||
</h3>
|
||||
</div>
|
||||
<p className="text-gray-600 leading-relaxed">
|
||||
{service.description}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Комплексный подход */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Комплексные услуги
|
||||
</h2>
|
||||
|
||||
<div className="bg-gray-50 rounded-2xl p-8 md:p-10">
|
||||
<div className="grid md:grid-cols-2 gap-4">
|
||||
{advantages.map((advantage, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="flex items-start gap-3 bg-white rounded-lg p-5 hover:shadow-md transition-shadow"
|
||||
>
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-0.5" size={20} />
|
||||
<span className="text-gray-700 leading-relaxed">{advantage}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Оборудование */}
|
||||
<div className="max-w-7xl mx-auto mb-20">
|
||||
<div className="text-center mb-12">
|
||||
<div className="inline-flex items-center gap-3 bg-brand-orange text-white px-8 py-4 rounded-full mb-4">
|
||||
<Wrench size={32} />
|
||||
<span className="text-xl font-bold">ОБОРУДОВАНИЕ ДЛЯ ОБСЛЕДОВАНИЯ</span>
|
||||
</div>
|
||||
<p className="text-gray-600 max-w-3xl mx-auto">
|
||||
Современное высокоточное оборудование ведущих мировых производителей
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="overflow-x-auto shadow-lg rounded-2xl">
|
||||
<table className="w-full bg-white">
|
||||
<thead>
|
||||
<tr className="bg-brand-orange text-white">
|
||||
<th className="px-6 py-4 text-left font-bold">Назначение прибора</th>
|
||||
<th className="px-6 py-4 text-left font-bold">Марка прибора</th>
|
||||
<th className="px-6 py-4 text-left font-bold">Изготовитель</th>
|
||||
<th className="px-6 py-4 text-center font-bold">Год изгот.</th>
|
||||
<th className="px-6 py-4 text-center font-bold">Зав. / инв. номер</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{equipment.map((item, index) => (
|
||||
<tr
|
||||
key={index}
|
||||
className={`border-b border-gray-200 hover:bg-gray-50 transition-colors ${
|
||||
index % 2 === 0 ? 'bg-white' : 'bg-gray-50'
|
||||
}`}
|
||||
>
|
||||
<td className="px-6 py-4 text-gray-700 leading-relaxed">
|
||||
{item.name}
|
||||
</td>
|
||||
<td className="px-6 py-4 font-semibold text-gray-900">
|
||||
{item.model}
|
||||
</td>
|
||||
<td className="px-6 py-4 text-gray-700 text-sm">
|
||||
{item.manufacturer}
|
||||
</td>
|
||||
<td className="px-6 py-4 text-center text-gray-700">
|
||||
{item.year}
|
||||
</td>
|
||||
<td className="px-6 py-4 text-center text-gray-700 text-sm">
|
||||
{item.serial}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Преимущества */}
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<div className="bg-gradient-to-br from-gray-900 to-gray-800 text-white rounded-2xl p-8 md:p-12 mb-12">
|
||||
<h2 className="text-3xl font-bold mb-8 text-center">
|
||||
Почему выбирают нас
|
||||
</h2>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-8">
|
||||
<div className="text-center">
|
||||
<div className="inline-flex w-16 h-16 bg-brand-orange rounded-xl items-center justify-center mb-4">
|
||||
<ClipboardCheck size={32} />
|
||||
</div>
|
||||
<h3 className="font-bold text-lg mb-3">Современное оборудование</h3>
|
||||
<p className="text-gray-300 text-sm leading-relaxed">
|
||||
Используем сертифицированные приборы от ведущих производителей
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<div className="inline-flex w-16 h-16 bg-brand-orange rounded-xl items-center justify-center mb-4">
|
||||
<Award size={32} />
|
||||
</div>
|
||||
<h3 className="font-bold text-lg mb-3">Опытные специалисты</h3>
|
||||
<p className="text-gray-300 text-sm leading-relaxed">
|
||||
Квалифицированные инженеры с многолетним опытом обследований
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<div className="inline-flex w-16 h-16 bg-brand-orange rounded-xl items-center justify-center mb-4">
|
||||
<Shield size={32} />
|
||||
</div>
|
||||
<h3 className="font-bold text-lg mb-3">Надежные результаты</h3>
|
||||
<p className="text-gray-300 text-sm leading-relaxed">
|
||||
Точные данные и обоснованные рекомендации по результатам обследования
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Призыв к действию */}
|
||||
<div className="text-center">
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<p className="text-gray-700 mb-6 text-lg">
|
||||
Необходимо обследование здания или сооружения?
|
||||
</p>
|
||||
<a
|
||||
href="#/contacts"
|
||||
className="inline-block px-10 py-4 bg-brand-orange text-white font-bold rounded-lg hover:bg-orange-600 transition-colors text-lg shadow-lg hover:shadow-xl"
|
||||
>
|
||||
Заказать обследование
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default BuildingSurveyPage;
|
||||
|
||||
|
||||
|
||||
284
pages/CertificatesPage.tsx
Normal file
284
pages/CertificatesPage.tsx
Normal file
@@ -0,0 +1,284 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { FileText, X, ChevronLeft, ChevronRight } from 'lucide-react';
|
||||
|
||||
interface Certificate {
|
||||
id: number;
|
||||
image: string;
|
||||
title: string;
|
||||
}
|
||||
|
||||
interface CertificateSection {
|
||||
title: string;
|
||||
certificates: Certificate[];
|
||||
}
|
||||
|
||||
const CertificatesPage: React.FC = () => {
|
||||
const [selectedImageIndex, setSelectedImageIndex] = useState<number | null>(null);
|
||||
|
||||
const sections: CertificateSection[] = [
|
||||
{
|
||||
title: 'ПРОГРАММНЫЕ ПРОДУКТЫ КРЕДО',
|
||||
certificates: [
|
||||
{ id: 1, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Сертификат' }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'ВЫПИСКА ИЗ СРО ПО СТРОИТЕЛЬСТВУ',
|
||||
certificates: [
|
||||
{ id: 2, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 1' },
|
||||
{ id: 3, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 2' },
|
||||
{ id: 4, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 3' },
|
||||
{ id: 5, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 4' }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'ВЫПИСКА ИЗ СРО ПО ПРОЕКТИРОВАНИЮ',
|
||||
certificates: [
|
||||
{ id: 6, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 1' },
|
||||
{ id: 7, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 2' }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'ВЫПИСКА ИЗ СРО ПО ИЗЫСКАНИЯМ',
|
||||
certificates: [
|
||||
{ id: 8, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 1' },
|
||||
{ id: 9, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 2' }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'ВЫПИСКА ИЗ РЕЕСТРА ЧЛЕНОВ САМОРЕГУЛИРУЕМОЙ ОРГАНИЗАЦИИ, ОСНОВАННОЙ НА ЧЛЕНСТВЕ ЛИЦ, ОСУЩЕСТВЛЯЮЩИХ СТРОИТЕЛЬСТВО',
|
||||
certificates: [
|
||||
{ id: 10, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 1' },
|
||||
{ id: 11, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 2' },
|
||||
{ id: 12, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 3' }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'ВЫПИСКА ИЗ РЕЕСТРА ЧЛЕНОВ САМОРЕГУЛИРУЕМОЙ ОРГАНИЗАЦИИ, ОСНОВАННОЙ НА ЧЛЕНСТВЕ ЛИЦ, ОСУЩЕСТВЛЯЮЩИХ ИНЖЕНЕРНЫЕ ИЗЫСКАНИЯ',
|
||||
certificates: [
|
||||
{ id: 13, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 1' },
|
||||
{ id: 14, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 2' }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'ВЫПИСКА ИЗ РЕЕСТРА ЧЛЕНОВ САМОРЕГУЛИРУЕМОЙ ОРГАНИЗАЦИИ, ОСНОВАННОЙ НА ЧЛЕНСТВЕ ЛИЦ, ОСУЩЕСТВЛЯЮЩИХ ПРОЕКТНЫЕ РАБОТЫ',
|
||||
certificates: [
|
||||
{ id: 15, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 1' },
|
||||
{ id: 16, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 2' }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'СВЕДЕНИЕ НА ОСУЩЕСТВЛЕНИЕ ГЕОДЕЗИЧЕСКОЙ И КАРТОГРАФИЧЕСКОЙ ДЕЯТЕЛЬНОСТИ ФЕДЕРАЛЬНАЯ СЛУЖБА ГОСУДАРСТВА',
|
||||
certificates: [
|
||||
{ id: 17, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 1' },
|
||||
{ id: 18, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 2' }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'СВИДЕТЕЛЬСТВО О ПРОХОЖДЕНИИ ИСПЫТАНИЙ И КОНТРОЛЯ ПО ISO 9001',
|
||||
certificates: [
|
||||
{ id: 19, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 1' },
|
||||
{ id: 20, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 2' },
|
||||
{ id: 21, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 3' },
|
||||
{ id: 22, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 4' },
|
||||
{ id: 23, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 5' },
|
||||
{ id: 24, image: 'https://placehold.co/400x600/94a3b8/white', title: 'Документ 6' }
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
// Создаем плоский массив всех изображений для навигации
|
||||
const allImages = sections.flatMap(section => section.certificates.map(cert => cert.image));
|
||||
|
||||
const openModal = (image: string) => {
|
||||
const index = allImages.indexOf(image);
|
||||
setSelectedImageIndex(index);
|
||||
document.body.style.overflow = 'hidden';
|
||||
};
|
||||
|
||||
const closeModal = () => {
|
||||
setSelectedImageIndex(null);
|
||||
document.body.style.overflow = 'auto';
|
||||
};
|
||||
|
||||
const nextImage = () => {
|
||||
if (selectedImageIndex !== null) {
|
||||
setSelectedImageIndex((selectedImageIndex + 1) % allImages.length);
|
||||
}
|
||||
};
|
||||
|
||||
const prevImage = () => {
|
||||
if (selectedImageIndex !== null) {
|
||||
setSelectedImageIndex((selectedImageIndex - 1 + allImages.length) % allImages.length);
|
||||
}
|
||||
};
|
||||
|
||||
// Обработка клавиатуры
|
||||
useEffect(() => {
|
||||
const handleKeyDown = (e: KeyboardEvent) => {
|
||||
if (selectedImageIndex === null) return;
|
||||
|
||||
if (e.key === 'Escape') {
|
||||
closeModal();
|
||||
} else if (e.key === 'ArrowRight') {
|
||||
nextImage();
|
||||
} else if (e.key === 'ArrowLeft') {
|
||||
prevImage();
|
||||
}
|
||||
};
|
||||
|
||||
window.addEventListener('keydown', handleKeyDown);
|
||||
return () => window.removeEventListener('keydown', handleKeyDown);
|
||||
}, [selectedImageIndex]);
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Сертификаты"
|
||||
description="Документы, подтверждающие нашу квалификацию и соответствие стандартам качества"
|
||||
image="/media/images/headers/header-certificates.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-12 text-center">
|
||||
СВИДЕТЕЛЬСТВА
|
||||
</h2>
|
||||
|
||||
{/* Секции с сертификатами */}
|
||||
<div className="space-y-16">
|
||||
{sections.map((section, sectionIndex) => (
|
||||
<div key={sectionIndex} className="space-y-6">
|
||||
{/* Заголовок секции */}
|
||||
<div className="flex items-center gap-3 mb-8">
|
||||
<FileText className="text-brand-orange" size={28} />
|
||||
<h3 className="text-lg font-bold text-gray-900 uppercase leading-tight">
|
||||
{section.title}
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
{/* Сетка документов */}
|
||||
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-6">
|
||||
{section.certificates.map((cert) => (
|
||||
<div
|
||||
key={cert.id}
|
||||
onClick={() => openModal(cert.image)}
|
||||
className="group cursor-pointer"
|
||||
>
|
||||
<div className="relative aspect-[3/4] rounded-lg overflow-hidden shadow-md hover:shadow-xl transition-all duration-300 bg-gray-100">
|
||||
<img
|
||||
src={cert.image}
|
||||
alt={cert.title}
|
||||
className="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"
|
||||
/>
|
||||
<div className="absolute inset-0 bg-black/0 group-hover:bg-black/10 transition-colors" />
|
||||
|
||||
{/* Overlay при наведении */}
|
||||
<div className="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity">
|
||||
<div className="bg-brand-orange text-white px-4 py-2 rounded-lg font-semibold text-sm">
|
||||
Увеличить
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Информационный блок */}
|
||||
<div className="mt-20 bg-gray-50 rounded-2xl p-8 md:p-12">
|
||||
<div className="max-w-3xl mx-auto text-center">
|
||||
<h3 className="text-2xl font-bold text-gray-900 mb-4">
|
||||
Гарантия качества
|
||||
</h3>
|
||||
<p className="text-gray-600 leading-relaxed mb-6">
|
||||
ООО «ГЕОВЕКТОР» имеет все необходимые лицензии и сертификаты для осуществления
|
||||
деятельности в области проектирования, строительства и инженерных изысканий.
|
||||
Наша компания является членом саморегулируемых организаций и соответствует
|
||||
международным стандартам качества ISO 9001.
|
||||
</p>
|
||||
<div className="flex flex-wrap justify-center gap-4 mt-8">
|
||||
<div className="bg-white px-6 py-3 rounded-lg shadow-sm">
|
||||
<div className="text-2xl font-bold text-brand-orange mb-1">СРО</div>
|
||||
<div className="text-sm text-gray-600">Член организации</div>
|
||||
</div>
|
||||
<div className="bg-white px-6 py-3 rounded-lg shadow-sm">
|
||||
<div className="text-2xl font-bold text-brand-orange mb-1">ISO 9001</div>
|
||||
<div className="text-sm text-gray-600">Сертифицирован</div>
|
||||
</div>
|
||||
<div className="bg-white px-6 py-3 rounded-lg shadow-sm">
|
||||
<div className="text-2xl font-bold text-brand-orange mb-1">10+ лет</div>
|
||||
<div className="text-sm text-gray-600">На рынке</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Модальное окно для просмотра изображения */}
|
||||
{selectedImageIndex !== null && (
|
||||
<div
|
||||
className="fixed inset-0 z-50 flex items-center justify-center bg-black/95 p-4"
|
||||
onClick={closeModal}
|
||||
>
|
||||
{/* Кнопка закрытия */}
|
||||
<button
|
||||
onClick={closeModal}
|
||||
className="absolute top-4 right-4 bg-white/10 hover:bg-white/20 text-white p-3 rounded-full transition-colors z-10"
|
||||
aria-label="Закрыть"
|
||||
>
|
||||
<X size={28} />
|
||||
</button>
|
||||
|
||||
{/* Кнопка "Назад" */}
|
||||
<button
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
prevImage();
|
||||
}}
|
||||
className="absolute left-4 top-1/2 -translate-y-1/2 bg-white/10 hover:bg-white/20 text-white p-3 rounded-full transition-colors z-10"
|
||||
aria-label="Предыдущее изображение"
|
||||
>
|
||||
<ChevronLeft size={32} />
|
||||
</button>
|
||||
|
||||
{/* Кнопка "Вперед" */}
|
||||
<button
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
nextImage();
|
||||
}}
|
||||
className="absolute right-4 top-1/2 -translate-y-1/2 bg-white/10 hover:bg-white/20 text-white p-3 rounded-full transition-colors z-10"
|
||||
aria-label="Следующее изображение"
|
||||
>
|
||||
<ChevronRight size={32} />
|
||||
</button>
|
||||
|
||||
{/* Индикатор */}
|
||||
<div className="absolute bottom-4 left-1/2 -translate-x-1/2 bg-black/50 text-white px-4 py-2 rounded-full text-sm font-semibold z-10">
|
||||
{selectedImageIndex + 1} / {allImages.length}
|
||||
</div>
|
||||
|
||||
{/* Изображение */}
|
||||
<div
|
||||
className="relative w-full h-full flex items-center justify-center"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
<img
|
||||
src={allImages[selectedImageIndex]}
|
||||
alt={`Документ ${selectedImageIndex + 1}`}
|
||||
className="max-w-full max-h-[90vh] object-contain rounded-lg shadow-2xl"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default CertificatesPage;
|
||||
|
||||
301
pages/ConstructionPage.tsx
Normal file
301
pages/ConstructionPage.tsx
Normal file
@@ -0,0 +1,301 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { CheckCircle2, Building, Factory, ShoppingCart, Network, Wrench, Target, Award, Users, TrendingUp } from 'lucide-react';
|
||||
|
||||
const ConstructionPage: React.FC = () => {
|
||||
const capabilities = [
|
||||
{ icon: Building, title: 'Строительство административных, жилых и офисных зданий' },
|
||||
{ icon: Factory, title: 'Строительство промышленных комплексов' },
|
||||
{ icon: ShoppingCart, title: 'Строительство торговых и складских комплексов' },
|
||||
{ icon: Network, title: 'Строительство систем коммуникаций' },
|
||||
{ icon: Wrench, title: 'Капитальный ремонт и реконструкция строительных объектов' }
|
||||
];
|
||||
|
||||
const factors = [
|
||||
{
|
||||
icon: Target,
|
||||
title: 'Современные материалы',
|
||||
description: 'Применение современных отделочных и строительных материалов для обеспечения высоких эксплуатационных характеристик объекта'
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: 'Нормы безопасности',
|
||||
description: 'Тщательное следование нормам безопасности, установленным для определенного типа сооружения, обязательный учет требований градостроительных организаций'
|
||||
},
|
||||
{
|
||||
icon: TrendingUp,
|
||||
title: 'Инженерные системы',
|
||||
description: 'Создание современных и эффективных инженерных систем для надежного и удобного управления зданием'
|
||||
}
|
||||
];
|
||||
|
||||
const projectSections = [
|
||||
'АСУ ТП объектов добычи, подготовки, переработки нефти и газа',
|
||||
'Системы измерения количества и показателей качества нефти, нефтепродуктов и газа',
|
||||
'Системы обнаружения утечек',
|
||||
'Системы электрохимзащиты',
|
||||
'Электроснабжение (внешнее и внутреннее)',
|
||||
'Пожарная автоматика',
|
||||
'Системы охранной и пожарной сигнализации, видеонаблюдение',
|
||||
'Водоснабжение и канализация (внешняя и внутренняя)',
|
||||
'Молниезащита и заземление',
|
||||
'Линии и системы связи'
|
||||
];
|
||||
|
||||
const specialSections = [
|
||||
'Мероприятия по гражданской обороне и чрезвычайным ситуациям',
|
||||
'Мероприятия по охране окружающей среды (ООС и ОВОС)',
|
||||
'Мероприятия по обеспечению пожарной безопасности'
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Строительство"
|
||||
description="Полный комплекс строительных и монтажных работ любой сложности"
|
||||
image="/media/images/headers/header-building.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
{/* Вступление */}
|
||||
<div className="max-w-5xl mx-auto mb-20">
|
||||
<div className="bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-2xl p-8 md:p-12 mb-12">
|
||||
<p className="text-xl leading-relaxed mb-4 font-semibold">
|
||||
Строительство зданий и сооружений – одно из приоритетных направлений работы ООО «ГеоВектор».
|
||||
</p>
|
||||
<p className="text-lg leading-relaxed">
|
||||
Наши услуги включают выполнение полного комплекса строительных и монтажных работ.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Возможности компании */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-4 text-center">
|
||||
Возможности нашей компании
|
||||
</h2>
|
||||
<p className="text-center text-gray-600 mb-12 max-w-3xl mx-auto">
|
||||
Мы предлагаем не только типовые строительные решения, но также индивидуальные разработки
|
||||
</p>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{capabilities.map((capability, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-white border-2 border-gray-200 rounded-xl p-6 hover:border-brand-orange hover:shadow-lg transition-all duration-300 group"
|
||||
>
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-brand-orange text-white rounded-lg flex items-center justify-center group-hover:scale-110 transition-transform">
|
||||
<capability.icon size={24} />
|
||||
</div>
|
||||
<p className="text-gray-700 leading-relaxed font-medium pt-2">
|
||||
{capability.title}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Преимущества комплексного подхода */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<div className="bg-gray-50 rounded-2xl p-8 md:p-12">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-6 text-center">
|
||||
Преимущества комплексного подхода к строительству
|
||||
</h2>
|
||||
|
||||
<div className="space-y-6">
|
||||
<p className="text-lg text-gray-700 leading-relaxed">
|
||||
Применение современных технических средств на всех этапах строительства, высокий профессионализм
|
||||
архитекторов, инженеров-строителей и дизайнеров выступают гарантией своевременного и качественного
|
||||
выполнения любого заказа.
|
||||
</p>
|
||||
|
||||
<div className="bg-white rounded-xl p-6 border-l-4 border-brand-orange">
|
||||
<p className="text-gray-700 leading-relaxed">
|
||||
За время деятельности компания реализовала значительное число проектов, включая возведение
|
||||
и реконструкцию объектов, находящихся в Республике Башкортостан и других регионах страны.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Факторы, учитываемые при строительстве */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-4 text-center">
|
||||
Важнейшие факторы при выполнении строительства
|
||||
</h2>
|
||||
<p className="text-center text-gray-600 mb-12 max-w-3xl mx-auto">
|
||||
В процессе выполнения строительства мы учитываем все важнейшие факторы,
|
||||
влияющие на эффективность будущего использования здания
|
||||
</p>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||
{factors.map((factor, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-white rounded-2xl p-8 shadow-lg hover:shadow-xl transition-all duration-300 border-t-4 border-brand-orange"
|
||||
>
|
||||
<div className="flex justify-center mb-6">
|
||||
<div className="w-16 h-16 bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-2xl flex items-center justify-center">
|
||||
<factor.icon size={32} />
|
||||
</div>
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900 mb-4 text-center">
|
||||
{factor.title}
|
||||
</h3>
|
||||
<p className="text-gray-600 leading-relaxed text-sm text-center">
|
||||
{factor.description}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Комплексный подход */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<div className="bg-gradient-to-br from-gray-900 to-gray-800 text-white rounded-2xl p-8 md:p-12">
|
||||
<div className="flex items-start gap-6">
|
||||
<div className="flex-shrink-0">
|
||||
<Users size={48} className="text-brand-orange" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-2xl font-bold mb-4">Проектирование и строительство – единый процесс</h3>
|
||||
<p className="text-gray-300 leading-relaxed">
|
||||
Проектирование и строительство объектов – взаимосвязанные процессы, каждый из которых требует
|
||||
тщательного контроля. Наша компания может предложить заказчикам не только непосредственное
|
||||
проведение строительных работ, но и профессиональные услуги на всех стадиях выполнения заказа –
|
||||
от проектирования до отделочных работ и ввода готового объекта в эксплуатацию.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Разделы комплексных проектов */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Выполнение разделов комплексных проектов
|
||||
</h2>
|
||||
|
||||
<div className="bg-gray-50 rounded-2xl p-8 md:p-10">
|
||||
<div className="grid md:grid-cols-2 gap-4">
|
||||
{projectSections.map((section, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="flex items-start gap-3 bg-white rounded-lg p-4 hover:shadow-md transition-shadow"
|
||||
>
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-0.5" size={20} />
|
||||
<span className="text-gray-700 leading-relaxed">{section}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Специальные разделы */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Разработка специальных разделов
|
||||
</h2>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-6">
|
||||
{specialSections.map((section, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-2xl p-8 hover:shadow-xl transition-all hover:scale-105"
|
||||
>
|
||||
<div className="flex items-center justify-center w-14 h-14 bg-white/20 rounded-xl mb-4 mx-auto">
|
||||
<CheckCircle2 size={28} />
|
||||
</div>
|
||||
<p className="text-center font-semibold leading-relaxed">
|
||||
{section}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Преимущества работы с нами */}
|
||||
<div className="max-w-5xl mx-auto">
|
||||
<div className="bg-gray-50 rounded-2xl p-8 md:p-12">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Почему выбирают нас
|
||||
</h2>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-6 mb-8">
|
||||
<div className="flex gap-4 bg-white rounded-xl p-6 shadow-sm">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-brand-orange text-white rounded-lg flex items-center justify-center font-bold text-xl">
|
||||
1
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-bold text-lg mb-2 text-gray-900">Комплексный подход</h3>
|
||||
<p className="text-gray-600 text-sm leading-relaxed">
|
||||
От проектирования до ввода объекта в эксплуатацию
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-4 bg-white rounded-xl p-6 shadow-sm">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-brand-orange text-white rounded-lg flex items-center justify-center font-bold text-xl">
|
||||
2
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-bold text-lg mb-2 text-gray-900">Современные технологии</h3>
|
||||
<p className="text-gray-600 text-sm leading-relaxed">
|
||||
Применение передовых технических средств на всех этапах
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-4 bg-white rounded-xl p-6 shadow-sm">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-brand-orange text-white rounded-lg flex items-center justify-center font-bold text-xl">
|
||||
3
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-bold text-lg mb-2 text-gray-900">Профессиональная команда</h3>
|
||||
<p className="text-gray-600 text-sm leading-relaxed">
|
||||
Высокий профессионализм архитекторов, инженеров и дизайнеров
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-4 bg-white rounded-xl p-6 shadow-sm">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-brand-orange text-white rounded-lg flex items-center justify-center font-bold text-xl">
|
||||
4
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-bold text-lg mb-2 text-gray-900">Индивидуальный подход</h3>
|
||||
<p className="text-gray-600 text-sm leading-relaxed">
|
||||
Типовые и индивидуальные строительные решения
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Призыв к действию */}
|
||||
<div className="mt-12 text-center">
|
||||
<div className="bg-white rounded-2xl p-8 shadow-lg">
|
||||
<p className="text-gray-700 mb-6 text-lg">
|
||||
Готовы начать строительство вашего объекта?
|
||||
</p>
|
||||
<a
|
||||
href="#/contacts"
|
||||
className="inline-block px-10 py-4 bg-brand-orange text-white font-bold rounded-lg hover:bg-orange-600 transition-colors text-lg shadow-lg hover:shadow-xl"
|
||||
>
|
||||
Обсудить проект
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ConstructionPage;
|
||||
|
||||
|
||||
|
||||
93
pages/ContactsPage.tsx
Normal file
93
pages/ContactsPage.tsx
Normal file
@@ -0,0 +1,93 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { Phone, Mail, MapPin, Clock, Send } from 'lucide-react';
|
||||
|
||||
const ContactsPage: React.FC = () => {
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Контакты"
|
||||
description="Мы всегда на связи и готовы ответить на любые ваши вопросы."
|
||||
image="/media/images/headers/header-kontakri.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 mb-20">
|
||||
<div className="bg-brand-light p-8 rounded-2xl">
|
||||
<Phone className="text-brand-orange w-8 h-8 mb-4" />
|
||||
<h3 className="font-bold text-lg mb-2">Телефон</h3>
|
||||
<a href="tel:83472927370" className="text-gray-600 hover:text-brand-orange transition-colors">8 (347) 292 73 70</a>
|
||||
</div>
|
||||
<div className="bg-brand-light p-8 rounded-2xl">
|
||||
<Mail className="text-brand-orange w-8 h-8 mb-4" />
|
||||
<h3 className="font-bold text-lg mb-2">Email</h3>
|
||||
<a href="mailto:gw@geowektor.ru" className="text-gray-600 hover:text-brand-orange transition-colors">gw@geowektor.ru</a>
|
||||
</div>
|
||||
<div className="bg-brand-light p-8 rounded-2xl">
|
||||
<MapPin className="text-brand-orange w-8 h-8 mb-4" />
|
||||
<h3 className="font-bold text-lg mb-2">Офис</h3>
|
||||
<p className="text-gray-600">450001, РБ, г. Уфа,</p>
|
||||
<p className="text-gray-600">ул. Комсомольская 19/1</p>
|
||||
</div>
|
||||
<div className="bg-brand-light p-8 rounded-2xl">
|
||||
<Clock className="text-brand-orange w-8 h-8 mb-4" />
|
||||
<h3 className="font-bold text-lg mb-2">Режим работы</h3>
|
||||
<p className="text-gray-600">Пн-Пт: 09:00 - 18:00</p>
|
||||
<p className="text-gray-600">Сб-Вс: Выходной</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Telegram QR-код */}
|
||||
<div className="mb-20 bg-gradient-to-br from-brand-orange/10 to-brand-orange/5 rounded-3xl p-12">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-12 items-center max-w-5xl mx-auto">
|
||||
<div>
|
||||
<div className="flex items-center gap-3 mb-6">
|
||||
<Send className="w-10 h-10 text-brand-orange" />
|
||||
<h2 className="text-3xl font-bold text-brand-dark">Мы в Telegram</h2>
|
||||
</div>
|
||||
<p className="text-gray-600 text-lg mb-6 leading-relaxed">
|
||||
Подписывайтесь на наш Telegram-канал, чтобы быть в курсе новостей компании, актуальных проектов и специальных предложений.
|
||||
</p>
|
||||
<div className="space-y-3">
|
||||
<p className="text-gray-700">
|
||||
📱 Отсканируйте QR-код камерой телефона
|
||||
</p>
|
||||
<p className="text-gray-700">
|
||||
💬 Или перейдите по ссылке: <a href="https://t.me/ooo_geo_wektor" target="_blank" rel="noopener noreferrer" className="text-brand-orange hover:underline font-semibold">@ooo_geo_wektor</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-center">
|
||||
<div className="bg-white p-8 rounded-3xl shadow-xl border-4 border-brand-orange/20 hover:border-brand-orange/40 transition-all duration-300 hover:scale-105">
|
||||
<img
|
||||
src="/media/qr-code.png"
|
||||
alt="QR-код для перехода в Telegram канал ГеоВектор"
|
||||
className="w-64 h-64 object-contain"
|
||||
/>
|
||||
<p className="text-center mt-4 text-sm text-gray-600 font-medium">
|
||||
Наведите камеру на QR-код
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Яндекс карта */}
|
||||
<div className="w-full h-[400px] bg-gray-200 rounded-3xl overflow-hidden relative">
|
||||
<iframe
|
||||
src="https://yandex.ru/map-widget/v1/?text=ГеоВектор%20Уфа%20Комсомольская%2019%2F1&z=17&l=map"
|
||||
width="100%"
|
||||
height="100%"
|
||||
frameBorder="0"
|
||||
allowFullScreen={true}
|
||||
style={{ position: 'relative', border: 0 }}
|
||||
title="Яндекс карта - ГеоВектор, ул. Комсомольская 19/1, Уфа"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ContactsPage;
|
||||
275
pages/DesignPage.tsx
Normal file
275
pages/DesignPage.tsx
Normal file
@@ -0,0 +1,275 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { CheckCircle2, Building2, Factory, Construction, Shield, Lightbulb, FileCheck } from 'lucide-react';
|
||||
|
||||
const DesignPage: React.FC = () => {
|
||||
const objectTypes = [
|
||||
{
|
||||
icon: Building2,
|
||||
title: 'Проектирование наземных объектов',
|
||||
description: 'Жилые, общественные и административные здания с полным комплексом инженерных систем'
|
||||
},
|
||||
{
|
||||
icon: Factory,
|
||||
title: 'Проектирование предприятий топливно-энергетического комплекса',
|
||||
description: 'Объекты нефтегазовой отрасли, энергетические комплексы и промышленные сооружения'
|
||||
},
|
||||
{
|
||||
icon: Construction,
|
||||
title: 'Проектирование объектов транспортных и защитных сооружений',
|
||||
description: 'Дороги, мосты, тоннели и специальные защитные конструкции'
|
||||
}
|
||||
];
|
||||
|
||||
const projectSections = [
|
||||
'АСУ ТП объектов добычи, подготовки, переработки нефти и газа',
|
||||
'Системы измерения количества и показателей качества нефти, нефтепродуктов и газа',
|
||||
'Системы обнаружения утечек',
|
||||
'Системы электрохимзащиты',
|
||||
'Электроснабжение (внешнее и внутреннее)',
|
||||
'Пожарная автоматика',
|
||||
'Системы охранной и пожарной сигнализации, видеонаблюдение',
|
||||
'Водоснабжение и канализация (внешняя и внутренняя)',
|
||||
'Молниезащита и заземление',
|
||||
'Линии и системы связи'
|
||||
];
|
||||
|
||||
const specialSections = [
|
||||
'Мероприятия по гражданской обороне и чрезвычайным ситуациям',
|
||||
'Мероприятия по охране окружающей среды (ООС и ОВОС)',
|
||||
'Мероприятия по обеспечению пожарной безопасности'
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Проектирование"
|
||||
description="Комплексные проектные решения для объектов любой сложности"
|
||||
image="/media/images/headers/header-projectirovanie.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
{/* Вступительный блок */}
|
||||
<div className="max-w-5xl mx-auto mb-20">
|
||||
<div className="bg-gray-50 rounded-2xl p-8 md:p-12 mb-12">
|
||||
<p className="text-lg text-gray-700 leading-relaxed mb-6">
|
||||
Специалисты нашей организации обладают значительным опытом в сфере проектирования объектов
|
||||
в Республике Башкортостан и других регионах РФ.
|
||||
</p>
|
||||
<p className="text-gray-600 leading-relaxed mb-6">
|
||||
<strong>Проектирование строительных объектов</strong> – ответственный и сложный процесс,
|
||||
влияющий на проведение строительства объекта и его успешное введение в эксплуатацию.
|
||||
</p>
|
||||
<p className="text-gray-600 leading-relaxed">
|
||||
На всех стадиях проектирования мы используем современные проектные и технические решения,
|
||||
что позволяет нам получать отличные результаты работ независимо от сложности объекта.
|
||||
Наши специалисты работают с актуальной законодательной базой в сфере проектирования
|
||||
и способны находить оптимальные решения с учетом нормативных требований и пожеланий заказчика.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-brand-orange text-white rounded-2xl p-8 md:p-12">
|
||||
<p className="text-lg leading-relaxed mb-4">
|
||||
Необходимость проведения определенных видов изысканий, их объем и состав определяются после
|
||||
анализа технического задания и зависят от вида, уровня ответственности, назначения сооружений,
|
||||
стадии проектирования, условий участка и степени их изученности.
|
||||
</p>
|
||||
<p className="leading-relaxed">
|
||||
Проведение инженерных изысканий подразумевает анализ данных, оценку возможных последствий
|
||||
реализации проекта, получение санитарно-эпидемиологических заключений и составление технических
|
||||
отчетов, состав которых определяется действующими нормативными документами. Наши специалисты
|
||||
профессионально выполняют изыскания для строящихся или реконструируемых объектов любых типов.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Типы объектов */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-4 text-center">
|
||||
Предоставление комплексных услуг по проектированию
|
||||
</h2>
|
||||
<p className="text-center text-gray-600 mb-12 max-w-3xl mx-auto">
|
||||
ООО «ГеоВектор» осуществляет проектирование следующих объектов
|
||||
</p>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 mb-12">
|
||||
{objectTypes.map((type, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-white border-2 border-gray-200 rounded-2xl p-8 hover:border-brand-orange transition-all duration-300 hover:shadow-xl text-center"
|
||||
>
|
||||
<div className="inline-flex w-20 h-20 bg-brand-orange text-white rounded-2xl items-center justify-center mb-6">
|
||||
<type.icon size={40} />
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900 mb-4 leading-tight">
|
||||
{type.title}
|
||||
</h3>
|
||||
<p className="text-gray-600 leading-relaxed text-sm">
|
||||
{type.description}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Дополнительная информация */}
|
||||
<div className="grid md:grid-cols-2 gap-6">
|
||||
<div className="bg-gray-50 rounded-xl p-6">
|
||||
<div className="flex items-start gap-3">
|
||||
<Shield className="text-brand-orange flex-shrink-0 mt-1" size={24} />
|
||||
<p className="text-gray-700 leading-relaxed text-sm">
|
||||
В каждом случае учитываются требования к архитектурно-планировочным решениям объекта
|
||||
и соответствующие нормы пожарной безопасности. Значительное внимание уделяется также
|
||||
проектированию надежных систем внутренних и наружных инженерных коммуникаций.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-gray-50 rounded-xl p-6">
|
||||
<div className="flex items-start gap-3">
|
||||
<Lightbulb className="text-brand-orange flex-shrink-0 mt-1" size={24} />
|
||||
<p className="text-gray-700 leading-relaxed text-sm">
|
||||
Перед выполнением работ по проектированию совместно с заказчиком определяются основные
|
||||
требования к проекту, в том числе состав помещений и наполнение зданий инженерным
|
||||
оборудованием. Проектировочные работы выполняются с учетом требований, предъявляемых
|
||||
к определенному объекту, особенностей и условий его эксплуатации.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-6 bg-blue-50 border-l-4 border-blue-500 rounded-r-xl p-6">
|
||||
<div className="flex items-start gap-3">
|
||||
<FileCheck className="text-blue-600 flex-shrink-0 mt-1" size={24} />
|
||||
<p className="text-gray-700 leading-relaxed text-sm">
|
||||
<strong>Наша компания предоставляет услуги</strong> по предпроектной подготовке, необходимой
|
||||
для оформления земельных участков, а также созданию проектно-сметных документов и согласованию
|
||||
документации в контролирующих службах.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Разделы комплексных проектов */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Выполнение разделов комплексных проектов
|
||||
</h2>
|
||||
|
||||
<div className="bg-gray-50 rounded-2xl p-8 md:p-10">
|
||||
<div className="grid md:grid-cols-2 gap-4">
|
||||
{projectSections.map((section, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="flex items-start gap-3 bg-white rounded-lg p-4 hover:shadow-md transition-shadow"
|
||||
>
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-0.5" size={20} />
|
||||
<span className="text-gray-700 leading-relaxed">{section}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Специальные разделы */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Разработка специальных разделов
|
||||
</h2>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-6">
|
||||
{specialSections.map((section, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-2xl p-8 hover:shadow-xl transition-all hover:scale-105"
|
||||
>
|
||||
<div className="flex items-center justify-center w-14 h-14 bg-white/20 rounded-xl mb-4 mx-auto">
|
||||
<CheckCircle2 size={28} />
|
||||
</div>
|
||||
<p className="text-center font-semibold leading-relaxed">
|
||||
{section}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Преимущества */}
|
||||
<div className="max-w-5xl mx-auto">
|
||||
<div className="bg-gradient-to-br from-gray-900 to-gray-800 text-white rounded-2xl p-8 md:p-12">
|
||||
<h2 className="text-3xl font-bold mb-8 text-center">
|
||||
Почему выбирают нас
|
||||
</h2>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-8">
|
||||
<div className="flex gap-4">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-brand-orange rounded-lg flex items-center justify-center font-bold text-xl">
|
||||
1
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-bold text-lg mb-2">Современные решения</h3>
|
||||
<p className="text-gray-300 text-sm leading-relaxed">
|
||||
Используем передовые проектные и технические решения на всех стадиях работы
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-4">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-brand-orange rounded-lg flex items-center justify-center font-bold text-xl">
|
||||
2
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-bold text-lg mb-2">Актуальная база</h3>
|
||||
<p className="text-gray-300 text-sm leading-relaxed">
|
||||
Работаем с актуальной законодательной базой в сфере проектирования
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-4">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-brand-orange rounded-lg flex items-center justify-center font-bold text-xl">
|
||||
3
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-bold text-lg mb-2">Опыт в регионе</h3>
|
||||
<p className="text-gray-300 text-sm leading-relaxed">
|
||||
Значительный опыт проектирования в Республике Башкортостан и других регионах РФ
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-4">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-brand-orange rounded-lg flex items-center justify-center font-bold text-xl">
|
||||
4
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-bold text-lg mb-2">Индивидуальный подход</h3>
|
||||
<p className="text-gray-300 text-sm leading-relaxed">
|
||||
Находим оптимальные решения с учетом нормативов и пожеланий заказчика
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Призыв к действию */}
|
||||
<div className="mt-12 text-center">
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<p className="text-gray-700 mb-6 text-lg">
|
||||
Готовы обсудить ваш проект?
|
||||
</p>
|
||||
<a
|
||||
href="#/contacts"
|
||||
className="inline-block px-10 py-4 bg-brand-orange text-white font-bold rounded-lg hover:bg-orange-600 transition-colors text-lg shadow-lg hover:shadow-xl"
|
||||
>
|
||||
Получить консультацию
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default DesignPage;
|
||||
|
||||
200
pages/FleetPage.tsx
Normal file
200
pages/FleetPage.tsx
Normal file
@@ -0,0 +1,200 @@
|
||||
import React, { useState } from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { ChevronLeft, ChevronRight } from 'lucide-react';
|
||||
|
||||
const FleetPage: React.FC = () => {
|
||||
const [currentImageIndex, setCurrentImageIndex] = useState(0);
|
||||
|
||||
// Список всех фотографий из папки cars
|
||||
const carImages = [
|
||||
'/media/cars/33725959_1920_q70.webp',
|
||||
'/media/cars/33725960_1920_q70.webp',
|
||||
'/media/cars/33725961_1920_q70.webp',
|
||||
'/media/cars/33725962_1920_q70.webp',
|
||||
'/media/cars/33725963_1920_q70.webp',
|
||||
'/media/cars/33725964_1920_q70.webp',
|
||||
'/media/cars/33725965_1920_q70.webp',
|
||||
'/media/cars/33725966_1920_q70.webp',
|
||||
'/media/cars/33725967_1920_q70.webp',
|
||||
'/media/cars/33725968_1920_q70.webp',
|
||||
'/media/cars/33725969_1920_q70.webp',
|
||||
'/media/cars/33725970_1920_q70.webp',
|
||||
'/media/cars/33725971_1920_q70.webp',
|
||||
'/media/cars/33725972_1920_q70.webp',
|
||||
'/media/cars/33725973_1920_q70.webp',
|
||||
'/media/cars/33725974_1920_q70.webp',
|
||||
'/media/cars/33725975_1920_q70.webp',
|
||||
'/media/cars/33725976_1920_q70.webp',
|
||||
'/media/cars/33725977_1920_q70.webp',
|
||||
'/media/cars/33725978_1920_q70.webp',
|
||||
'/media/cars/33725979_1920_q70.webp',
|
||||
'/media/cars/33725980_1920_q70.webp',
|
||||
'/media/cars/33725981_1920_q70.webp',
|
||||
'/media/cars/33725982_1920_q70.webp',
|
||||
'/media/cars/33725983_1920_q70.webp',
|
||||
'/media/cars/33725984_1920_q70.webp',
|
||||
'/media/cars/33725985_1920_q70.webp',
|
||||
'/media/cars/33725986_1920_q70.webp',
|
||||
];
|
||||
|
||||
// Список транспортных средств
|
||||
const vehicles = [
|
||||
{ type: 'Установка разведочного бурения', brand: 'КАМАЗ 5350-42 УРБ-2А-2' },
|
||||
{ type: 'Установка разведочного бурения', brand: 'КАМАЗ 43118 013-10 УРБ-2А-2' },
|
||||
{ type: 'Установка разведочного бурения', brand: 'КАМАЗ 5350-42 УРБ-2А-2' },
|
||||
{ type: 'Специальное пассажирское ТС', brand: 'УАЗ-29892' },
|
||||
{ type: 'Грузовой бортовой', brand: 'ГАЗ 33081' },
|
||||
{ type: 'УБШМ 1.20', brand: 'ГАЗ 33081' },
|
||||
{ type: 'УБШМ 1.20', brand: 'ГАЗ 33081' },
|
||||
{ type: 'Специальное пассажирское ТС', brand: 'УАЗ-220695-04' },
|
||||
{ type: 'Грузовое ТС, Фермер грузопассажирский УБШМ 1-13', brand: 'УАЗ-390945' },
|
||||
{ type: 'Грузовой фургон', brand: 'УАЗ-390995-04' },
|
||||
{ type: 'Установка разведочного бурения УРБ-2Д3', brand: 'МТЛБу (Снегоболотоход гусеничный ТГМ 21-04)' },
|
||||
{ type: 'Седельный тягач', brand: 'УРАЛ 44202-0311-41' },
|
||||
{ type: 'Полуприцеп низкорамный трал', brand: '993920' },
|
||||
{ type: 'Снегоход', brand: 'YAMAHA VK540E' },
|
||||
{ type: 'Прицеп для перевозки водной техники, грузов', brand: 'МЗСА, 81771С' },
|
||||
{ type: 'Специальная установка каротажной станции СК 1-74-II', brand: 'ЗИЛ-131' },
|
||||
{ type: 'Фермер грузопассажирский УБШМ 1-13', brand: 'УАЗ 390945' },
|
||||
{ type: 'Болотовездеход', brand: 'Caiman' },
|
||||
];
|
||||
|
||||
const nextImage = () => {
|
||||
setCurrentImageIndex((prev) => (prev + 1) % carImages.length);
|
||||
};
|
||||
|
||||
const prevImage = () => {
|
||||
setCurrentImageIndex((prev) => (prev - 1 + carImages.length) % carImages.length);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Автопарк"
|
||||
description="Современная техника для выполнения работ любой сложности"
|
||||
image="/media/images/headers/header-fleet.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
{/* Карусель фотографий */}
|
||||
<div className="mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Галерея техники
|
||||
</h2>
|
||||
|
||||
<div className="relative max-w-5xl mx-auto">
|
||||
{/* Главное изображение */}
|
||||
<div className="relative aspect-[16/9] rounded-2xl overflow-hidden bg-gray-100">
|
||||
<img
|
||||
src={carImages[currentImageIndex]}
|
||||
alt={`Транспортное средство ${currentImageIndex + 1}`}
|
||||
className="w-full h-full object-cover"
|
||||
/>
|
||||
|
||||
{/* Кнопки навигации */}
|
||||
<button
|
||||
onClick={prevImage}
|
||||
className="absolute left-4 top-1/2 -translate-y-1/2 bg-white/90 hover:bg-white p-3 rounded-full shadow-lg transition-all duration-300 group"
|
||||
aria-label="Предыдущее фото"
|
||||
>
|
||||
<ChevronLeft size={24} className="text-brand-orange" />
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={nextImage}
|
||||
className="absolute right-4 top-1/2 -translate-y-1/2 bg-white/90 hover:bg-white p-3 rounded-full shadow-lg transition-all duration-300 group"
|
||||
aria-label="Следующее фото"
|
||||
>
|
||||
<ChevronRight size={24} className="text-brand-orange" />
|
||||
</button>
|
||||
|
||||
{/* Индикатор */}
|
||||
<div className="absolute bottom-4 left-1/2 -translate-x-1/2 bg-black/50 text-white px-4 py-2 rounded-full text-sm">
|
||||
{currentImageIndex + 1} / {carImages.length}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Миниатюры */}
|
||||
<div className="mt-6 flex gap-3 overflow-x-auto pb-4">
|
||||
{carImages.map((image, index) => (
|
||||
<button
|
||||
key={index}
|
||||
onClick={() => setCurrentImageIndex(index)}
|
||||
className={`flex-shrink-0 w-24 h-16 rounded-lg overflow-hidden transition-all duration-300 ${
|
||||
index === currentImageIndex
|
||||
? 'ring-4 ring-brand-orange scale-105'
|
||||
: 'opacity-60 hover:opacity-100'
|
||||
}`}
|
||||
>
|
||||
<img
|
||||
src={image}
|
||||
alt={`Миниатюра ${index + 1}`}
|
||||
className="w-full h-full object-cover"
|
||||
/>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Список транспортных средств */}
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Список транспортных средств ООО «ГЕОВЕКТОР»
|
||||
</h2>
|
||||
|
||||
<div className="overflow-x-auto shadow-lg rounded-2xl">
|
||||
<table className="w-full bg-white">
|
||||
<thead>
|
||||
<tr className="bg-brand-orange text-white">
|
||||
<th className="px-6 py-4 text-left font-bold w-20">№</th>
|
||||
<th className="px-6 py-4 text-left font-bold">Тип авто</th>
|
||||
<th className="px-6 py-4 text-left font-bold">Марка машины</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{vehicles.map((vehicle, index) => (
|
||||
<tr
|
||||
key={index}
|
||||
className={`border-b border-gray-200 hover:bg-gray-50 transition-colors ${
|
||||
index % 2 === 0 ? 'bg-white' : 'bg-gray-50'
|
||||
}`}
|
||||
>
|
||||
<td className="px-6 py-4 font-semibold text-brand-orange text-center">
|
||||
{index + 1}
|
||||
</td>
|
||||
<td className="px-6 py-4 text-gray-700">
|
||||
{vehicle.type || ''}
|
||||
</td>
|
||||
<td className="px-6 py-4 font-semibold text-gray-900">
|
||||
{vehicle.brand}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
{/* Статистика */}
|
||||
<div className="mt-12 grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||
<div className="bg-brand-orange text-white rounded-2xl p-6 text-center">
|
||||
<div className="text-4xl font-bold mb-2">{vehicles.length}</div>
|
||||
<div className="text-lg">Единиц техники</div>
|
||||
</div>
|
||||
<div className="bg-gray-900 text-white rounded-2xl p-6 text-center">
|
||||
<div className="text-4xl font-bold mb-2">{carImages.length}</div>
|
||||
<div className="text-lg">Фотографий</div>
|
||||
</div>
|
||||
<div className="bg-brand-orange text-white rounded-2xl p-6 text-center">
|
||||
<div className="text-4xl font-bold mb-2">24/7</div>
|
||||
<div className="text-lg">Готовность к работе</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FleetPage;
|
||||
|
||||
22
pages/Home.tsx
Normal file
22
pages/Home.tsx
Normal file
@@ -0,0 +1,22 @@
|
||||
import React from 'react';
|
||||
import Hero from '../components/Hero';
|
||||
import Benefits from '../components/Benefits';
|
||||
import Services from '../components/Services';
|
||||
import Projects from '../components/Projects';
|
||||
import Laboratories from '../components/Laboratories';
|
||||
import Process from '../components/Process';
|
||||
|
||||
const Home: React.FC = () => {
|
||||
return (
|
||||
<>
|
||||
<Hero />
|
||||
<Benefits />
|
||||
<Services />
|
||||
<Projects />
|
||||
<Laboratories />
|
||||
<Process />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default Home;
|
||||
255
pages/LandSurveyPage.tsx
Normal file
255
pages/LandSurveyPage.tsx
Normal file
@@ -0,0 +1,255 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { CheckCircle2, Map, FileText, MapPin, Landmark, ClipboardList, Navigation } from 'lucide-react';
|
||||
|
||||
const LandSurveyPage: React.FC = () => {
|
||||
const services = [
|
||||
{
|
||||
icon: Landmark,
|
||||
title: 'Рекультивация нарушенных земель',
|
||||
description: 'Восстановление земель после промышленной деятельности и приведение их в состояние, пригодное для дальнейшего использования'
|
||||
},
|
||||
{
|
||||
icon: FileText,
|
||||
title: 'Подготовка материалов к актам выбора земельного участка лесного фонда',
|
||||
description: 'Комплексная подготовка документации и согласование с надзорными инстанциями для выбора участков лесного фонда'
|
||||
},
|
||||
{
|
||||
icon: Map,
|
||||
title: 'Градостроительный план земельного участка',
|
||||
description: 'Разработка градостроительного плана с указанием всех необходимых параметров и ограничений использования территории'
|
||||
},
|
||||
{
|
||||
icon: ClipboardList,
|
||||
title: 'Проект планировки и проект межевания территории',
|
||||
description: 'Разработка проектов планировки и межевания для комплексного освоения территорий и организации рационального землепользования'
|
||||
},
|
||||
{
|
||||
icon: Navigation,
|
||||
title: 'Получение технических условий',
|
||||
description: 'Получение технических условий на подключение к инженерным сетям и дальнейшее согласование в соответствующих организациях'
|
||||
}
|
||||
];
|
||||
|
||||
const cadastralWorks = [
|
||||
{
|
||||
title: 'Согласование границ земельных участков',
|
||||
description: 'Проведение работ по установлению и согласованию границ земельных участков с заинтересованными лицами и смежными землепользователями'
|
||||
},
|
||||
{
|
||||
title: 'Определение координат и границ межевых знаков',
|
||||
description: 'Геодезические измерения и закрепление межевых знаков на местности с использованием современного оборудования'
|
||||
},
|
||||
{
|
||||
title: 'Определение площади земельного участка',
|
||||
description: 'Точный расчет площади земельного участка по полученным координатам межевых знаков с применением современных методик'
|
||||
},
|
||||
{
|
||||
title: 'Формирование пакета документов',
|
||||
description: 'Подготовка полного пакета документов и последующая сдача землеустроительного дела (межевой план) в соответствующие государственные органы'
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Землеустроительные и кадастровые работы"
|
||||
description="Комплекс услуг по межеванию, кадастровому учету и землеустройству"
|
||||
image="/media/images/headers/header-zemlestroit-kadastr-jobs.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
{/* Основные услуги */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-4 text-center">
|
||||
Основные виды работ
|
||||
</h2>
|
||||
<p className="text-center text-gray-600 mb-12 max-w-3xl mx-auto">
|
||||
Профессиональное выполнение землеустроительных и кадастровых работ любой сложности
|
||||
</p>
|
||||
|
||||
<div className="space-y-6">
|
||||
{services.map((service, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-white border-2 border-gray-200 rounded-2xl p-8 hover:border-brand-orange transition-all duration-300 hover:shadow-xl"
|
||||
>
|
||||
<div className="flex items-start gap-6">
|
||||
<div className="flex-shrink-0 w-16 h-16 bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-xl flex items-center justify-center">
|
||||
<service.icon size={32} />
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<h3 className="text-xl font-bold text-gray-900 mb-3">
|
||||
{service.title}
|
||||
</h3>
|
||||
<p className="text-gray-600 leading-relaxed">
|
||||
{service.description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Кадастровые работы */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<div className="text-center mb-12">
|
||||
<div className="inline-flex items-center gap-3 bg-brand-orange text-white px-8 py-4 rounded-full mb-4">
|
||||
<MapPin size={32} />
|
||||
<span className="text-xl font-bold">КАДАСТРОВЫЕ РАБОТЫ</span>
|
||||
</div>
|
||||
<p className="text-gray-600 max-w-3xl mx-auto">
|
||||
Комплексное выполнение работ по межеванию земельных участков и подготовке документации для государственного кадастрового учета
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-8">
|
||||
{cadastralWorks.map((work, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-gray-50 rounded-2xl p-8 hover:shadow-lg transition-all"
|
||||
>
|
||||
<div className="flex items-start gap-4 mb-4">
|
||||
<div className="flex-shrink-0 w-10 h-10 bg-brand-orange text-white rounded-lg flex items-center justify-center font-bold text-lg">
|
||||
{index + 1}
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900 pt-1">
|
||||
{work.title}
|
||||
</h3>
|
||||
</div>
|
||||
<p className="text-gray-600 leading-relaxed pl-14">
|
||||
{work.description}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Этапы работы */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-12 text-center">
|
||||
Этапы выполнения работ
|
||||
</h2>
|
||||
|
||||
<div className="relative">
|
||||
<div className="absolute left-8 top-0 bottom-0 w-1 bg-brand-orange hidden md:block"></div>
|
||||
|
||||
<div className="space-y-8">
|
||||
<div className="flex gap-6 relative">
|
||||
<div className="flex-shrink-0 w-16 h-16 bg-brand-orange text-white rounded-full flex items-center justify-center font-bold text-2xl z-10">
|
||||
1
|
||||
</div>
|
||||
<div className="flex-1 bg-white rounded-xl p-6 shadow-md">
|
||||
<h3 className="text-lg font-bold text-gray-900 mb-2">Получение заявки и выезд на объект</h3>
|
||||
<p className="text-gray-600 text-sm">Первичное обследование территории и определение объема работ</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-6 relative">
|
||||
<div className="flex-shrink-0 w-16 h-16 bg-brand-orange text-white rounded-full flex items-center justify-center font-bold text-2xl z-10">
|
||||
2
|
||||
</div>
|
||||
<div className="flex-1 bg-white rounded-xl p-6 shadow-md">
|
||||
<h3 className="text-lg font-bold text-gray-900 mb-2">Геодезические измерения</h3>
|
||||
<p className="text-gray-600 text-sm">Проведение измерений и закрепление границ межевыми знаками</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-6 relative">
|
||||
<div className="flex-shrink-0 w-16 h-16 bg-brand-orange text-white rounded-full flex items-center justify-center font-bold text-2xl z-10">
|
||||
3
|
||||
</div>
|
||||
<div className="flex-1 bg-white rounded-xl p-6 shadow-md">
|
||||
<h3 className="text-lg font-bold text-gray-900 mb-2">Согласование границ</h3>
|
||||
<p className="text-gray-600 text-sm">Согласование установленных границ со смежными землепользователями</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-6 relative">
|
||||
<div className="flex-shrink-0 w-16 h-16 bg-brand-orange text-white rounded-full flex items-center justify-center font-bold text-2xl z-10">
|
||||
4
|
||||
</div>
|
||||
<div className="flex-1 bg-white rounded-xl p-6 shadow-md">
|
||||
<h3 className="text-lg font-bold text-gray-900 mb-2">Подготовка документации</h3>
|
||||
<p className="text-gray-600 text-sm">Формирование межевого плана и полного пакета документов</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-6 relative">
|
||||
<div className="flex-shrink-0 w-16 h-16 bg-brand-orange text-white rounded-full flex items-center justify-center font-bold text-2xl z-10">
|
||||
5
|
||||
</div>
|
||||
<div className="flex-1 bg-white rounded-xl p-6 shadow-md">
|
||||
<h3 className="text-lg font-bold text-gray-900 mb-2">Сдача в государственные органы</h3>
|
||||
<p className="text-gray-600 text-sm">Передача документов в Росреестр для постановки на кадастровый учет</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Преимущества */}
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<div className="bg-gradient-to-br from-gray-900 to-gray-800 text-white rounded-2xl p-8 md:p-12 mb-12">
|
||||
<h2 className="text-3xl font-bold mb-8 text-center">
|
||||
Наши преимущества
|
||||
</h2>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-8">
|
||||
<div className="text-center">
|
||||
<div className="inline-flex w-16 h-16 bg-brand-orange rounded-xl items-center justify-center mb-4">
|
||||
<CheckCircle2 size={32} />
|
||||
</div>
|
||||
<h3 className="font-bold text-lg mb-3">Полное сопровождение</h3>
|
||||
<p className="text-gray-300 text-sm leading-relaxed">
|
||||
От измерений на местности до получения свидетельства о регистрации
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<div className="inline-flex w-16 h-16 bg-brand-orange rounded-xl items-center justify-center mb-4">
|
||||
<Navigation size={32} />
|
||||
</div>
|
||||
<h3 className="font-bold text-lg mb-3">Точность измерений</h3>
|
||||
<p className="text-gray-300 text-sm leading-relaxed">
|
||||
Использование современного геодезического оборудования высокой точности
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<div className="inline-flex w-16 h-16 bg-brand-orange rounded-xl items-center justify-center mb-4">
|
||||
<FileText size={32} />
|
||||
</div>
|
||||
<h3 className="font-bold text-lg mb-3">Юридическая чистота</h3>
|
||||
<p className="text-gray-300 text-sm leading-relaxed">
|
||||
Грамотное оформление всех документов в соответствии с законодательством
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Призыв к действию */}
|
||||
<div className="text-center">
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<p className="text-gray-700 mb-6 text-lg">
|
||||
Нужны землеустроительные или кадастровые работы?
|
||||
</p>
|
||||
<a
|
||||
href="#/contacts"
|
||||
className="inline-block px-10 py-4 bg-brand-orange text-white font-bold rounded-lg hover:bg-orange-600 transition-colors text-lg shadow-lg hover:shadow-xl"
|
||||
>
|
||||
Заказать услугу
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default LandSurveyPage;
|
||||
|
||||
|
||||
|
||||
172
pages/PrivacyPolicyPage.tsx
Normal file
172
pages/PrivacyPolicyPage.tsx
Normal file
@@ -0,0 +1,172 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { Shield, FileText, AlertCircle, Lock } from 'lucide-react';
|
||||
|
||||
const PrivacyPolicyPage: React.FC = () => {
|
||||
return (
|
||||
<div>
|
||||
<PageHeader
|
||||
title="Политика конфиденциальности"
|
||||
subtitle="Защита ваших персональных данных — наш приоритет"
|
||||
/>
|
||||
|
||||
<section className="py-20 px-6">
|
||||
<div className="container mx-auto max-w-4xl">
|
||||
|
||||
<div className="bg-brand-orange/10 border border-brand-orange/20 rounded-2xl p-8 mb-12">
|
||||
<div className="flex items-start gap-4">
|
||||
<Shield className="w-8 h-8 text-brand-orange flex-shrink-0 mt-1" />
|
||||
<div>
|
||||
<h3 className="text-xl font-bold text-brand-dark mb-2">
|
||||
Конфиденциальность ваших данных
|
||||
</h3>
|
||||
<p className="text-gray-600 leading-relaxed">
|
||||
ООО «ГеоВектор» заботится о безопасности вашей информации и с ответственностью подходит к личным данным покупателей, которые были использованы на сайте. Персональные данные Пользователя/Покупателя обрабатываются в соответствии с ФЗ «О персональных данных» №152-ФЗ и Политикой конфиденциальности Продавца / Владельца сайта.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-10">
|
||||
|
||||
{/* Использование персональных данных */}
|
||||
<div className="bg-white rounded-xl shadow-sm border border-gray-100 p-8">
|
||||
<div className="flex items-center gap-3 mb-4">
|
||||
<FileText className="w-6 h-6 text-brand-orange" />
|
||||
<h2 className="text-2xl font-bold text-brand-dark">
|
||||
Использование персональных данных
|
||||
</h2>
|
||||
</div>
|
||||
<div className="space-y-4 text-gray-600 leading-relaxed">
|
||||
<p>
|
||||
<strong>1.1.</strong> Настоящая Политика конфиденциальности устанавливает обязательства Администрации сайта по неразглашению и обеспечению режима защиты конфиденциальности персональных данных, которые Пользователь предоставляет по запросу Администрации сайта при оформлении заявки на услуги.
|
||||
</p>
|
||||
<p>
|
||||
<strong>1.2.</strong> Персональные данные, разрешённые к обработке в рамках настоящей Политики конфиденциальности, предоставляются Пользователем путём заполнения формы заявки на Сайте.
|
||||
</p>
|
||||
<p>
|
||||
<strong>1.3.</strong> Своей волей и в своем интересе вы даете согласие на обработку, в т.ч. на сбор, систематизацию, накопление, хранение, (уточнение, обновление, изменение), использование, передачу Администрации сайта, обезличивание, блокирование, уничтожение персональных данных, которые в зависимости от формы заявки включают следующие персональные данные:
|
||||
</p>
|
||||
<ul className="list-disc list-inside ml-4 space-y-2">
|
||||
<li>фамилия, имя, отчество Пользователя;</li>
|
||||
<li>контактный телефон Пользователя;</li>
|
||||
<li>e-mail Пользователя.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Обязательства сторон */}
|
||||
<div className="bg-white rounded-xl shadow-sm border border-gray-100 p-8">
|
||||
<div className="flex items-center gap-3 mb-4">
|
||||
<Lock className="w-6 h-6 text-brand-orange" />
|
||||
<h2 className="text-2xl font-bold text-brand-dark">
|
||||
Обязательства сторон
|
||||
</h2>
|
||||
</div>
|
||||
<div className="space-y-6 text-gray-600 leading-relaxed">
|
||||
|
||||
<div>
|
||||
<h3 className="font-bold text-brand-dark mb-2">2.1. Пользователь обязан:</h3>
|
||||
<p className="mb-2">
|
||||
<strong>2.1.1.</strong> Предоставить информацию о персональных данных, необходимую для пользования Сайтом.
|
||||
</p>
|
||||
<p>
|
||||
<strong>2.1.2.</strong> Обновить, дополнить предоставленную информацию о персональных данных в случае изменения данной информации.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 className="font-bold text-brand-dark mb-2">2.2. Администрация сайта обязана:</h3>
|
||||
<p className="mb-2">
|
||||
<strong>2.2.1.</strong> Использовать полученную информацию исключительно для целей, указанных в п. 4 настоящей Политики конфиденциальности.
|
||||
</p>
|
||||
<p className="mb-2">
|
||||
<strong>2.2.2.</strong> Обеспечить хранение конфиденциальной информации в тайне, не разглашать без предварительного письменного разрешения Пользователя, а также не осуществлять продажу, обмен, опубликование, либо разглашение иными возможными способами переданных персональных данных Пользователя, за исключением п.п. 5.2. настоящей Политики Конфиденциальности.
|
||||
</p>
|
||||
<p className="mb-2">
|
||||
<strong>2.2.3.</strong> Принимать меры предосторожности для защиты конфиденциальности персональных данных Пользователя.
|
||||
</p>
|
||||
<p>
|
||||
<strong>2.2.4.</strong> Осуществить блокирование персональных данных, относящихся к соответствующему Пользователю, с момента обращения или запроса Пользователя, или его законного представителя либо уполномоченного органа по защите прав субъектов персональных данных на период проверки, в случае выявления недостоверных персональных данных или неправомерных действий.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Жалобы (претензии) */}
|
||||
<div className="bg-white rounded-xl shadow-sm border border-gray-100 p-8">
|
||||
<div className="flex items-center gap-3 mb-4">
|
||||
<AlertCircle className="w-6 h-6 text-brand-orange" />
|
||||
<h2 className="text-2xl font-bold text-brand-dark">
|
||||
Жалобы (претензии)
|
||||
</h2>
|
||||
</div>
|
||||
<div className="space-y-4 text-gray-600 leading-relaxed">
|
||||
<p>
|
||||
<strong>3.1.1.</strong> Процедура урегулирования жалоб (претензий), поступивших от Заказчиков и других заинтересованных сторон к деятельности ИЛ - документированный процесс для получения, рассмотрения жалоб и претензий (далее - жалоб) и принятия решений по жалобам (претензиям), предназначена для удовлетворения потребностей Заказчиков и повышения результативности СМК ИЛ. Все претензии, поступившие в ИЛ, в том числе и в форме устного обращения регистрируются в Журнале регистрации жалоб (претензий). ИЛ несет ответственность, за принятие решений на всех стадиях процесса рассмотрения жалобы. Описание процесса управления жалобами выложено на сайт ООО «ГЕОВЕКТОР».
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.2.</strong> Жалоба не подлежит дальнейшему рассмотрению, если она не относится к лабораторной деятельности, Начальник ИЛ готовит обоснованный ответ и направляет его заявителю жалобы в срок, не превышающий 5 рабочих дней.
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.3.</strong> В качестве заявителя жалобы могут выступать: Заказчики; органы, осуществляющие государственный контроль и надзор, контролирующие органы (например, Росаккредитация, Роспотребнадзор).
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.4.</strong> Начальник ИЛ рассматривает жалобы (Если жалоба касалась работ, которые выполнял Начальник ИЛ, то руководитель ООО «ГЕОВЕКТОР» назначает другого ответственного за рассмотрение). Начальник ИЛ рассматривает зарегистрированную жалобу (претензию) с привлечением необходимых специалистов ИЛ в течение десяти рабочих дней. ИЛ направляет уведомление заявителю жалобы о получении жалобы по электронной почте или иным способом, в срок не превышающий один рабочий день с даты регистрации жалобы (претензии).
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.5.</strong> При рассмотрении устанавливаются причины возникновения жалоб, разрабатываются корректирующие действия и при необходимости – улучшения в работе ИЛ.
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.6.</strong> При рассмотрении жалобы осуществляются следующие действия: проводится тщательный анализ жалобы; проверяется правильность оформления документации, протоколов и других документов, в связи с которыми поступила жалоба; определяется выполнение требований методик испытаний (если применимо); устанавливаются причины, вызвавшие жалобу; определяется степень вины конкретных сотрудников ИЛ.
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.7.</strong> Рассмотрение жалобы оформляется записью в Журнале учета жалоб (претензий).
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.8.</strong> Ответ на жалобу сообщается подателю претензии (жалобы) в письменном виде за подписью сотрудника ООО «ГЕОВЕКТОР», не принимавшим участия в деятельности лаборатории, по поводу которой поступила жалоба. В данный ответ включается информация о результатах рассмотрения жалобы. По заявлению подателя жалобы ему может быть направлена информация о ходе рассмотрения жалобы.
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.9.</strong> Срок рассмотрения жалобы и выдачи решения не может превышать десять рабочих дней со дня поступления жалобы (претензии) в ИЛ.
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.10.</strong> Жалобы регистрируется в «Журнале учета жалоб (претензий)». Документация и записи, относящиеся к процедуре рассмотрения жалоб хранится в отдельной папке в течение календарного года, а затем передается в архив ИЛ. Если в течение календарного года жалоб (претензий) к ИЛ не поступило, то в «Журнал учета жалоб (претензий)» Начальник ИЛ/менеджер по качеству вносит запись об отсутствии жалоб за прошедший год.
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.11.</strong> Жалобы, поступившие от других сотрудников организации, рассматриваются в порядке, установленном настоящим пунктом РК.
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.12.</strong> Персонал ООО «ГЕОВЕКТОР», участвующий в процедуре рассмотрения жалоб (претензий), обязан выполнять требования конфиденциальности и не передавать какую-либо информацию и ни в каком виде третьим лицам.
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.13.</strong> Жалобы, независимо от результатов рассмотрения, являются входными данными для анализа со стороны руководства (пункт 8.9 РК).
|
||||
</p>
|
||||
<p>
|
||||
<strong>3.1.14.</strong> Сотрудник ИЛ, ответственный за рассмотрение жалобы, несет ответственность за сбор и проверку всей необходимой информации с целью подтверждения обоснованности жалобы. Результат рассмотрения жалобы, подготавливается, проверяется и утверждается сотрудниками ООО «ГЕОВЕКТОР», не принимавшим участия в деятельности лаборатории, по поводу которой поступила жалоба.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{/* Контакты для связи */}
|
||||
<div className="mt-12 bg-brand-orange text-white rounded-2xl p-8">
|
||||
<h3 className="text-2xl font-bold mb-4">Остались вопросы?</h3>
|
||||
<p className="mb-6">
|
||||
Если у вас возникли вопросы по политике конфиденциальности или обработке персональных данных, свяжитесь с нами:
|
||||
</p>
|
||||
<div className="space-y-2">
|
||||
<p>📞 Телефон: <a href="tel:83472927370" className="underline hover:no-underline">8 (347) 292 73 70</a></p>
|
||||
<p>📧 Email: <a href="mailto:gw@geowektor.ru" className="underline hover:no-underline">gw@geowektor.ru</a></p>
|
||||
<p>📍 Адрес: 450001, РБ, г. Уфа, ул. Комсомольская 19/1</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default PrivacyPolicyPage;
|
||||
|
||||
88
pages/ProjectsPage.tsx
Normal file
88
pages/ProjectsPage.tsx
Normal file
@@ -0,0 +1,88 @@
|
||||
import React, { useState } from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { groupProjectsByCategory } from '../constants';
|
||||
import { MapPin, ChevronDown } from 'lucide-react';
|
||||
|
||||
const ProjectsPage: React.FC = () => {
|
||||
const categories = groupProjectsByCategory();
|
||||
const [openCategories, setOpenCategories] = useState<{ [key: string]: boolean }>({});
|
||||
|
||||
const toggleCategory = (categoryName: string) => {
|
||||
setOpenCategories(prev => ({
|
||||
...prev,
|
||||
[categoryName]: !prev[categoryName]
|
||||
}));
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Наши проекты"
|
||||
description="Галерея реализованных объектов, которыми мы гордимся. Более 10 лет успешной работы на рынке."
|
||||
image="/media/images/headers/header-projects.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
<div className="space-y-4">
|
||||
{categories.map((category) => (
|
||||
<div key={category.name} className="border border-gray-200 rounded-xl overflow-hidden">
|
||||
{/* Заголовок категории */}
|
||||
<button
|
||||
onClick={() => toggleCategory(category.name)}
|
||||
className="w-full flex items-center justify-between p-6 bg-gray-50 hover:bg-gray-100 transition-colors"
|
||||
>
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-brand-orange text-white rounded-lg flex items-center justify-center font-bold text-lg">
|
||||
{category.projects.length}
|
||||
</div>
|
||||
<h2 className="text-xl font-bold text-gray-900">{category.name}</h2>
|
||||
</div>
|
||||
<ChevronDown
|
||||
size={24}
|
||||
className={`text-brand-orange transition-transform duration-300 ${
|
||||
openCategories[category.name] ? 'rotate-180' : ''
|
||||
}`}
|
||||
/>
|
||||
</button>
|
||||
|
||||
{/* Список проектов */}
|
||||
<div
|
||||
className={`transition-all duration-300 ${
|
||||
openCategories[category.name]
|
||||
? 'max-h-[10000px] opacity-100'
|
||||
: 'max-h-0 opacity-0 overflow-hidden'
|
||||
}`}
|
||||
>
|
||||
<div className="p-4 space-y-3 bg-white">
|
||||
{category.projects.map((project, index) => (
|
||||
<div
|
||||
key={project.id}
|
||||
className="group cursor-pointer bg-gray-50 hover:bg-gray-100 rounded-lg p-5 transition-all duration-300 border border-gray-200 hover:border-brand-orange"
|
||||
>
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="flex-shrink-0 w-10 h-10 bg-white border-2 border-brand-orange text-brand-orange rounded-lg flex items-center justify-center font-bold text-sm">
|
||||
{index + 1}
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<h3 className="text-base font-bold text-gray-900 mb-2 group-hover:text-brand-orange transition-colors">
|
||||
{project.title}
|
||||
</h3>
|
||||
<div className="flex items-start gap-2 text-gray-600 text-sm">
|
||||
<MapPin size={14} className="mt-1 flex-shrink-0 text-brand-orange" />
|
||||
<span className="leading-relaxed">{project.description}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ProjectsPage;
|
||||
168
pages/RadiationLabPage.tsx
Normal file
168
pages/RadiationLabPage.tsx
Normal file
@@ -0,0 +1,168 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { AlertTriangle, Activity, Shield, CheckCircle2 } from 'lucide-react';
|
||||
|
||||
const RadiationLabPage: React.FC = () => {
|
||||
const equipment = [
|
||||
'КАМЕРА-01 для измерения уровня радона',
|
||||
'Дозиметр гамма-излучения ДКГ-02У «АРБИТР»',
|
||||
'Дозиметр-радиометр ДРБП-03'
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Радиационная лаборатория"
|
||||
description="Профессиональные исследования радиационной безопасности объектов"
|
||||
image="/media/images/headers/radio-lab-header.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
{/* Вступление */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<div className="bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-2xl p-8 md:p-12 mb-12">
|
||||
<h2 className="text-3xl font-bold mb-6">
|
||||
РАДИАЦИОННАЯ ЛАБОРАТОРИЯ
|
||||
</h2>
|
||||
<p className="text-lg leading-relaxed mb-4">
|
||||
Испытательная лаборатория ООО «ГеоВектор» аккредитованная Федеральной службой по аккредитации на техническую
|
||||
компетентность и независимость при проведении работ в соответствии с утвержденной областью.
|
||||
</p>
|
||||
<p className="text-lg leading-relaxed">
|
||||
ИЛ ООО «ГеоВектор» оснащена высокочувствительным оборудованием и позволяющая нашим специалистам быстро и качественно
|
||||
выполнять задачи, связанные с обнаружением и локализацией мест повышенного радиационного фона.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="prose max-w-none space-y-6">
|
||||
<p className="text-gray-700 leading-relaxed">
|
||||
Радиационный контроль – одно из наиболее значимых и востребованных сегодня исследований. Невидимая угроза подстерегает
|
||||
людей в самых неожиданных местах. Вредоносное излучение может серьезно подорвать здоровье даже физически крепкого
|
||||
человека. Своевременное привлечение специалистов позволит исключить губительное воздействие на организм и обеспечить
|
||||
полную безопасность.
|
||||
</p>
|
||||
|
||||
<p className="text-gray-700 leading-relaxed">
|
||||
Источником радиации могут служить различные техногенные ситуации, которые возникли в результате человеческой ошибки и
|
||||
неправомерных действий. Также источником может стать естественная природная среда. Наша лаборатория специализируется на
|
||||
работе с радиационными аномалиями, а наши сотрудники полностью подготовлены для работы с самыми сложными ситуациями.
|
||||
Мы используем сверхчувствительное измерительное оборудование, благодаря чему можем обеспечить 100% гарантию
|
||||
предоставленных услуг.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Оборудование */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<div className="bg-gray-900 text-white rounded-2xl p-8 mb-8">
|
||||
<h2 className="text-2xl font-bold text-center flex items-center justify-center gap-3">
|
||||
<Activity size={32} />
|
||||
Испытательная лаборатория использует следующее оборудование:
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-6">
|
||||
{equipment.map((item, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-white border-2 border-gray-200 rounded-xl p-6 hover:border-brand-orange transition-all"
|
||||
>
|
||||
<div className="flex items-center justify-center w-14 h-14 bg-brand-orange/10 rounded-lg mb-4 mx-auto">
|
||||
<Activity className="text-brand-orange" size={28} />
|
||||
</div>
|
||||
<p className="text-center text-gray-700 font-semibold">{item}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Виды работ */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-2xl font-bold text-gray-900 mb-8">
|
||||
Замеры радиации в помещениях, зданиях, сооружениях
|
||||
</h2>
|
||||
|
||||
<div className="bg-gray-50 rounded-2xl p-8 mb-8">
|
||||
<p className="text-gray-700 leading-relaxed">
|
||||
Специалисты лаборатории проводят исследование уровня радиационного излучения в промышленных цехах, на производственных
|
||||
площадках и в прочих помещениях.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<h2 className="text-2xl font-bold text-gray-900 mb-8">
|
||||
Исследование радиационного фона земель, грунта
|
||||
</h2>
|
||||
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<p className="text-gray-700 leading-relaxed">
|
||||
Измерения проводятся на участках, выделенных для строительства жилых и прочих строений, а также почв, грунта,
|
||||
предназначенного для благоустройства территории.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Контроль качества */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<div className="bg-gradient-to-br from-gray-900 to-gray-800 text-white rounded-2xl p-8 md:p-12">
|
||||
<p className="text-lg leading-relaxed">
|
||||
В своей деятельности Испытательная лаборатория руководствуется положением об Испытательной Лаборатории. Контроль качества
|
||||
измерений и испытаний, проводимых в Испытательной лаборатории, осуществляется согласно руководству по качеству.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Преимущества */}
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-12 text-center">
|
||||
Почему важен радиационный контроль
|
||||
</h2>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-8 mb-12">
|
||||
<div className="text-center">
|
||||
<div className="inline-flex w-20 h-20 bg-brand-orange/10 rounded-full items-center justify-center mb-6">
|
||||
<AlertTriangle className="text-brand-orange" size={40} />
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900 mb-4">Защита здоровья</h3>
|
||||
<p className="text-gray-600 leading-relaxed">
|
||||
Своевременное выявление источников радиации защищает здоровье людей от вредного воздействия
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<div className="inline-flex w-20 h-20 bg-brand-orange/10 rounded-full items-center justify-center mb-6">
|
||||
<Shield className="text-brand-orange" size={40} />
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900 mb-4">Безопасность объектов</h3>
|
||||
<p className="text-gray-600 leading-relaxed">
|
||||
Гарантия безопасности помещений, зданий и земельных участков для проживания и работы
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<div className="inline-flex w-20 h-20 bg-brand-orange/10 rounded-full items-center justify-center mb-6">
|
||||
<CheckCircle2 className="text-brand-orange" size={40} />
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900 mb-4">Профессиональный подход</h3>
|
||||
<p className="text-gray-600 leading-relaxed">
|
||||
Современное оборудование и опытные специалисты обеспечивают 100% точность измерений
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<a
|
||||
href="#/contacts"
|
||||
className="inline-block px-10 py-4 bg-brand-orange text-white font-bold rounded-lg hover:bg-orange-600 transition-colors text-lg shadow-lg"
|
||||
>
|
||||
Заказать измерения
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default RadiationLabPage;
|
||||
|
||||
|
||||
141
pages/ServicesPage.tsx
Normal file
141
pages/ServicesPage.tsx
Normal file
@@ -0,0 +1,141 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { SERVICES } from '../constants';
|
||||
import { ArrowRight } from 'lucide-react';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
const ServicesPage: React.FC = () => {
|
||||
// Отфильтровываем технические задания из основных услуг
|
||||
const mainServices = SERVICES.filter(service => service.title !== 'Технические задания');
|
||||
const technicalTasksService = SERVICES.find(service => service.title === 'Технические задания');
|
||||
|
||||
return (
|
||||
<div className="bg-gray-50 pb-20">
|
||||
<PageHeader
|
||||
title="Наши услуги"
|
||||
description="Полный спектр инженерных и строительных работ любой сложности. От изысканий до сдачи объекта под ключ."
|
||||
image="/media/images/headers/header-services.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
{/* Блок с техническими заданиями */}
|
||||
{technicalTasksService && (
|
||||
<div className="mb-16 max-w-4xl mx-auto">
|
||||
<div className="bg-white rounded-2xl shadow-lg overflow-hidden border-2 border-gray-200">
|
||||
<div className="p-8 md:p-10">
|
||||
<div className="flex items-start gap-6">
|
||||
<div className="flex-shrink-0">
|
||||
<div className="w-16 h-16 bg-brand-orange/10 rounded-xl flex items-center justify-center">
|
||||
<svg className="w-8 h-8 text-brand-orange" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex-1">
|
||||
<h3 className="text-2xl font-bold text-gray-900 mb-3">
|
||||
Образцы технических заданий
|
||||
</h3>
|
||||
<p className="text-gray-600 leading-relaxed mb-6">
|
||||
Готовые шаблоны и примеры технических заданий для различных видов инженерных работ.
|
||||
Документы доступны для скачивания и могут быть адаптированы под ваш проект.
|
||||
</p>
|
||||
|
||||
<Link
|
||||
to="/services/technical-tasks"
|
||||
className="inline-flex items-center gap-2 px-6 py-3 bg-brand-orange text-white font-bold rounded-lg hover:bg-orange-600 transition-colors"
|
||||
>
|
||||
Посмотреть образцы <ArrowRight size={20} />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
{mainServices.map((service, idx) => (
|
||||
<div
|
||||
key={idx}
|
||||
className="bg-white rounded-2xl overflow-hidden shadow-lg hover:shadow-xl transition-shadow duration-300 flex flex-col h-full"
|
||||
>
|
||||
<div className="h-64 overflow-hidden">
|
||||
<img
|
||||
src={service.image}
|
||||
alt={service.title}
|
||||
className="w-full h-full object-cover transition-transform duration-700 hover:scale-110"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="p-8 flex-grow flex flex-col">
|
||||
<h3 className="text-2xl font-bold text-gray-900 mb-4">{service.title}</h3>
|
||||
<p className="text-gray-600 text-sm mb-6 flex-grow leading-relaxed">
|
||||
{service.description}
|
||||
</p>
|
||||
<div className="flex flex-col gap-3 mt-auto">
|
||||
{service.title === 'Инженерные изыскания' && (
|
||||
<Link
|
||||
to="/services/surveying"
|
||||
className="flex items-center justify-center gap-2 bg-brand-orange text-white font-bold px-6 py-3 rounded-lg hover:bg-orange-600 transition-colors"
|
||||
>
|
||||
Подробнее <ArrowRight size={18} />
|
||||
</Link>
|
||||
)}
|
||||
{service.title === 'Проектирование' && (
|
||||
<Link
|
||||
to="/services/design"
|
||||
className="flex items-center justify-center gap-2 bg-brand-orange text-white font-bold px-6 py-3 rounded-lg hover:bg-orange-600 transition-colors"
|
||||
>
|
||||
Подробнее <ArrowRight size={18} />
|
||||
</Link>
|
||||
)}
|
||||
{service.title === 'Строительство' && (
|
||||
<Link
|
||||
to="/services/construction"
|
||||
className="flex items-center justify-center gap-2 bg-brand-orange text-white font-bold px-6 py-3 rounded-lg hover:bg-orange-600 transition-colors"
|
||||
>
|
||||
Подробнее <ArrowRight size={18} />
|
||||
</Link>
|
||||
)}
|
||||
{service.title === 'Обследование грунтов' && (
|
||||
<Link
|
||||
to="/services/soil-survey"
|
||||
className="flex items-center justify-center gap-2 bg-brand-orange text-white font-bold px-6 py-3 rounded-lg hover:bg-orange-600 transition-colors"
|
||||
>
|
||||
Подробнее <ArrowRight size={18} />
|
||||
</Link>
|
||||
)}
|
||||
{service.title === 'Обследование здания' && (
|
||||
<Link
|
||||
to="/services/building-survey"
|
||||
className="flex items-center justify-center gap-2 bg-brand-orange text-white font-bold px-6 py-3 rounded-lg hover:bg-orange-600 transition-colors"
|
||||
>
|
||||
Подробнее <ArrowRight size={18} />
|
||||
</Link>
|
||||
)}
|
||||
{service.title === 'Землестроительный и Кадастровые работы' && (
|
||||
<Link
|
||||
to="/services/land-survey"
|
||||
className="flex items-center justify-center gap-2 bg-brand-orange text-white font-bold px-6 py-3 rounded-lg hover:bg-orange-600 transition-colors"
|
||||
>
|
||||
Подробнее <ArrowRight size={18} />
|
||||
</Link>
|
||||
)}
|
||||
<Link
|
||||
to="/contacts"
|
||||
className={`flex items-center ${(service.title === 'Инженерные изыскания' || service.title === 'Проектирование' || service.title === 'Строительство' || service.title === 'Обследование грунтов' || service.title === 'Обследование здания' || service.title === 'Землестроительный и Кадастровые работы') ? 'justify-center' : 'gap-2'} text-brand-orange font-medium hover:gap-4 transition-all`}
|
||||
>
|
||||
Заказать услугу <ArrowRight size={16} />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ServicesPage;
|
||||
198
pages/SoilLabPage.tsx
Normal file
198
pages/SoilLabPage.tsx
Normal file
@@ -0,0 +1,198 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { CheckCircle2, Microscope, FileCheck, Award } from 'lucide-react';
|
||||
|
||||
const SoilLabPage: React.FC = () => {
|
||||
const physicalProperties = [
|
||||
'Влажность грунта по ГОСТ 5180-84',
|
||||
'Плотность методом режущего кольца или методом гидростатического взвешивания с парафинированием ГОСТ 5180-84',
|
||||
'Плотность частиц грунта пикнометрическим методом по ГОСТ 5180-84',
|
||||
'Зерновой (гранулометрический) состав ГОСТ 12536-79',
|
||||
'Определение границ текучести и раскатывания, числа пластичности, консистенции для глинистых грунтов по ГОСТ 5180-84',
|
||||
'Плотность, коэффициент пористости, плотность скелета грунта по ГОСТ 5180-84',
|
||||
'Наименование грунтов с указанием их дополнительных характеристик ГОСТ 25100-95, ГОСТ 12248-96',
|
||||
'Относительное содержание органического вещества методом прокаливания по ГОСТ 23740-91',
|
||||
'Удельное электрическое сопротивление (ЕС) ГОСТ 9.602-2016',
|
||||
'Относительная деформация водонасыщения. Степень пучинистости. ГОСТ 28622-2012'
|
||||
];
|
||||
|
||||
const mechanicalProperties = [
|
||||
'Определение прочностных характеристик (угла внутреннего трения и удельного сцепления) грунтов методом одноплоскостного среза с предварительным уплотнением и без него по ГОСТ 12248-2010',
|
||||
'Определение характеристик деформируемости (коэффициента сжимаемости, модуля деформации) грунта методом компрессионного сжатия по ГОСТ 12248-2010',
|
||||
'Определение модуля деформации в полевых условиях (методом статического нагружения) и приборах лабораторных условий по ГОСТ 20276-2012, ГОСТ 23161-78 и ГОСТ 24143-81',
|
||||
'Относительная просадочность по ГОСТ 12248-2010',
|
||||
'Определение характеристик набухания и усадки по ГОСТ 24143',
|
||||
'Степень разложения торфов ГОСТ 91'
|
||||
];
|
||||
|
||||
const chemicalAnalysis = [
|
||||
'Степень агрессивности грунтов к бетону, цветным и черным металлам',
|
||||
'Химический анализ воды'
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Грунтовая лаборатория"
|
||||
description="Комплексные исследования физических, механических и химических свойств грунтов"
|
||||
image="/media/images/headers/soil-lab-header.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
{/* Основное описание */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<div className="bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-2xl p-8 md:p-12 mb-12">
|
||||
<h2 className="text-3xl font-bold mb-6">
|
||||
ГРУНТОВАЯ ЛАБОРАТОРИЯ ООО «ГЕОВЕКТОР»
|
||||
</h2>
|
||||
<p className="text-lg leading-relaxed">
|
||||
Лабораторные исследования грунтов являются неотъемлемой частью инженерно-геологических изысканий для строительства.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="prose max-w-none mb-12">
|
||||
<p className="text-gray-700 leading-relaxed mb-6">
|
||||
По результатам комплексного изучения грунтов в лабораториях и полевых условиях определяются физико-механические свойства
|
||||
грунтов, их агрессивность к конструкциям, оценивается уровень грунтовых вод, от того данные являются технологическим
|
||||
решением, применяемым при проектировании, при фундамента, несущая способность грунтов, стоимость строительства, надежность
|
||||
зданий и сооружений.
|
||||
</p>
|
||||
|
||||
<p className="text-gray-700 leading-relaxed mb-6">
|
||||
Все лабораторные испытания проводятся в соответствии с Государственными стандартами и строительными нормами и правилами.
|
||||
Грунтовая лаборатория ООО «ГеоВектор» обладает всем необходимым измерительным и испытательным оборудованием (поверенство об одним
|
||||
из ведущих центров стандартизации метрологии и сертификации; Госстандарт России), имеет лицензии на право проведения
|
||||
испытаний и ведения калибровочных работ в соответствии с областью деятельности, все оборудование сертифицировано и подвергается систематическим поверкам, опытный
|
||||
персонал обеспечивает и гарантирует точность проводимых исследований и правильность интерпретации полученных результатов.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-gray-900 text-white rounded-2xl p-8 md:p-10">
|
||||
<h3 className="text-2xl font-bold mb-4 text-center">
|
||||
ГРУНТОВАЯ ЛАБОРАТОРИЯ ООО «ГЕОВЕКТОР» ПРЕДЛАГАЕТ СЛЕДУЮЩИЕ ВИДЫ ИССЛЕДОВАНИЙ:
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Определение показателей физических свойств */}
|
||||
<div className="max-w-6xl mx-auto mb-16">
|
||||
<h2 className="text-2xl font-bold text-gray-900 mb-8 flex items-center gap-3">
|
||||
<Microscope className="text-brand-orange" size={32} />
|
||||
ОПРЕДЕЛЕНИЕ ПОКАЗАТЕЛЕЙ ФИЗИЧЕСКИХ СВОЙСТВ ГРУНТОВ:
|
||||
</h2>
|
||||
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<ul className="space-y-3">
|
||||
{physicalProperties.map((item, index) => (
|
||||
<li key={index} className="flex items-start gap-3">
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
|
||||
<span className="text-gray-700 leading-relaxed">{item}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Определение механических свойств */}
|
||||
<div className="max-w-6xl mx-auto mb-16">
|
||||
<h2 className="text-2xl font-bold text-gray-900 mb-8">
|
||||
ОПРЕДЕЛЕНИЕ МЕХАНИЧЕСКИХ СВОЙСТВ ГРУНТОВ:
|
||||
</h2>
|
||||
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<ul className="space-y-3">
|
||||
{mechanicalProperties.map((item, index) => (
|
||||
<li key={index} className="flex items-start gap-3">
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
|
||||
<span className="text-gray-700 leading-relaxed">{item}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Химические свойства */}
|
||||
<div className="max-w-6xl mx-auto mb-16">
|
||||
<h2 className="text-2xl font-bold text-gray-900 mb-8">
|
||||
ИССЛЕДОВАНИЯ ПО ОПРЕДЕЛЕНИЮ ХИМИЧЕСКИХ СВОЙСТВ ГРУНТОВ И ПРОБ ВОДЫ:
|
||||
</h2>
|
||||
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<ul className="space-y-3">
|
||||
{chemicalAnalysis.map((item, index) => (
|
||||
<li key={index} className="flex items-start gap-3">
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
|
||||
<span className="text-gray-700 leading-relaxed">{item}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Цены */}
|
||||
<div className="max-w-6xl mx-auto mb-16">
|
||||
<div className="bg-brand-orange text-white rounded-2xl p-8 text-center">
|
||||
<h2 className="text-2xl font-bold mb-4">
|
||||
ЦЕНЫ НА ЛАБОРАТОРНЫЕ ИССЛЕДОВАНИЯ
|
||||
</h2>
|
||||
<p className="leading-relaxed">
|
||||
Цены на лабораторные исследования определяются соответствующими расценками действующего Справочника базовых цен на
|
||||
инженерно-геологические изыскания, вносимых в Федеральный реестр сметных нормативов и рекомендаций Министерством
|
||||
регионального развития Российской Федерации ПРИКАЗ от 26 марта 2008 г. № 29
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Оборудование */}
|
||||
<div className="max-w-6xl mx-auto mb-16">
|
||||
<div className="bg-gray-900 text-white rounded-2xl p-8 md:p-10 mb-8">
|
||||
<h2 className="text-2xl font-bold text-center">
|
||||
ГРУНТОВАЯ ЛАБОРАТОРИЯ ООО «ГЕОВЕКТОР» ОСНАЩЕНА СОВРЕМЕННЫМ ВЫСОКОТОЧНЫМ ОБОРУДОВАНИЕМ
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<p className="text-gray-700 leading-relaxed mb-8">
|
||||
Примеры лабораторного оборудования НПО «Грунт» применяемого специалистами лаборатории испытательного оборудования используются УПГ «Грунт» -
|
||||
позволяющим автоматизировать испытания для определения физико-механических свойств грунтов. Все электронные приборы
|
||||
управляются специализированным программным обеспечением, все средства имеют программный ежегодник метрологической
|
||||
поверки.
|
||||
</p>
|
||||
|
||||
{/* Здесь можно добавить галерею изображений оборудования */}
|
||||
<div className="bg-gray-50 rounded-2xl p-8 text-center">
|
||||
<p className="text-gray-600 italic">Фото оборудования лаборатории</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Свидетельства */}
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<h2 className="text-2xl font-bold text-gray-900 mb-8 text-center">
|
||||
СВИДЕТЕЛЬСТВО ГРУНТОВОЙ ЛАБОРАТОРИИ
|
||||
</h2>
|
||||
|
||||
<div className="grid grid-cols-2 md:grid-cols-3 gap-6">
|
||||
{[1, 2, 3, 4, 5].map((num) => (
|
||||
<div key={num} className="bg-gray-100 rounded-lg aspect-[3/4] flex items-center justify-center">
|
||||
<FileCheck className="text-gray-400" size={48} />
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="mt-12 text-center">
|
||||
<a
|
||||
href="#/contacts"
|
||||
className="inline-block px-10 py-4 bg-brand-orange text-white font-bold rounded-lg hover:bg-orange-600 transition-colors text-lg shadow-lg"
|
||||
>
|
||||
Заказать исследование
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default SoilLabPage;
|
||||
|
||||
|
||||
|
||||
260
pages/SoilSurveyPage.tsx
Normal file
260
pages/SoilSurveyPage.tsx
Normal file
@@ -0,0 +1,260 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { CheckCircle2, AlertTriangle, Target, ClipboardCheck, Search, TrendingDown, Activity } from 'lucide-react';
|
||||
|
||||
const SoilSurveyPage: React.FC = () => {
|
||||
const workTypes = [
|
||||
{
|
||||
icon: AlertTriangle,
|
||||
title: 'Проходка котлованов и траншей',
|
||||
description: 'Прокладка подземных коммуникаций, пешеходных и транспортных тоннелей ниже глубины заложения существующих фундаментов, особенно с применением водопонижения'
|
||||
},
|
||||
{
|
||||
icon: TrendingDown,
|
||||
title: 'Строительство новых зданий',
|
||||
description: 'Возведение объектов, вызывающих дополнительные напряжения, перераспределение напряжений и перемещения грунта в активной зоне фундаментов существующих зданий'
|
||||
},
|
||||
{
|
||||
icon: Activity,
|
||||
title: 'Устройство стен в грунте',
|
||||
description: 'Забивка шпунта или свай вблизи существующих зданий с передачей на их основание динамических нагрузок'
|
||||
},
|
||||
{
|
||||
icon: Target,
|
||||
title: 'Динамические воздействия',
|
||||
description: 'От авто- и железнодорожного транспорта, линий метрополитена, оборудования, устанавливаемого в сооружениях и промышленных установках'
|
||||
}
|
||||
];
|
||||
|
||||
const mainTasks = [
|
||||
'Возможности надстройки, реконструкции зданий и сооружений с увеличением временных и постоянных нагрузок на фундаменты',
|
||||
'Установления причин деформаций и разработки мер для предотвращения их дальнейшего развития, а также восстановления условий нормальной эксплуатации зданий и сооружений',
|
||||
'Определения состояния грунтов основания, возможности и условий достройки зданий и сооружений после длительной консервации их строительства',
|
||||
'Определения состояния мест примыкания зданий-пристроек к существующим и разработки мер по обеспечению их устойчивости',
|
||||
'Выяснения причин затапливания и подтапливания подвалов и других подземных сооружений'
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Обследование грунтов"
|
||||
description="Оценка состояния грунтов оснований зданий и сооружений"
|
||||
image="/media/images/headers/header-obsledovanie-gruntov.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
{/* Основное описание */}
|
||||
<div className="max-w-5xl mx-auto mb-20">
|
||||
<div className="bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-2xl p-8 md:p-12 mb-12">
|
||||
<h2 className="text-3xl font-bold mb-6">
|
||||
Обследование состояния грунтов основания зданий и сооружений
|
||||
</h2>
|
||||
<p className="text-lg leading-relaxed">
|
||||
Обследование состояния грунтов оснований зданий и сооружений выполняются для оценки возможных
|
||||
негативных последствий от реконструкции существующего здания, а также от воздействия на него нового
|
||||
строительства (реконструкции, расширения) на прилегающих территориях и, при необходимости, получение
|
||||
данных для разработки мероприятий по обеспечению эксплуатационной надежности существующей застройки.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-gray-50 rounded-2xl p-8 md:p-12">
|
||||
<div className="flex items-start gap-4 mb-6">
|
||||
<Search className="text-brand-orange flex-shrink-0" size={32} />
|
||||
<h3 className="text-2xl font-bold text-gray-900">
|
||||
Когда необходимо обследование
|
||||
</h3>
|
||||
</div>
|
||||
<p className="text-gray-700 leading-relaxed mb-6">
|
||||
Обследование грунтов оснований существующих зданий необходимо производить, когда в прилегающей
|
||||
к ним зоне производятся следующие виды работ (или возможны какие-то негативные воздействия):
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Виды работ */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-12 text-center">
|
||||
Виды работ, требующие обследования грунтов
|
||||
</h2>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
{workTypes.map((work, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-white border-2 border-gray-200 rounded-2xl p-8 hover:border-brand-orange transition-all duration-300 hover:shadow-xl"
|
||||
>
|
||||
<div className="flex items-start gap-4 mb-4">
|
||||
<div className="flex-shrink-0 w-14 h-14 bg-brand-orange/10 text-brand-orange rounded-xl flex items-center justify-center">
|
||||
<work.icon size={28} />
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900 leading-tight pt-2">
|
||||
{work.title}
|
||||
</h3>
|
||||
</div>
|
||||
<p className="text-gray-600 leading-relaxed text-sm">
|
||||
{work.description}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Основные задачи */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<div className="text-center mb-12">
|
||||
<div className="inline-flex items-center gap-3 bg-brand-orange text-white px-8 py-4 rounded-full mb-6">
|
||||
<ClipboardCheck size={32} />
|
||||
<span className="text-xl font-bold">ОСНОВНЫЕ ЗАДАЧИ ОБСЛЕДОВАНИЯ</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-gray-50 rounded-2xl p-8 md:p-10 mb-8">
|
||||
<p className="text-gray-700 leading-relaxed mb-8">
|
||||
При обследовании необходимо определять изменения инженерно-геологических условий за период
|
||||
строительства и эксплуатации предприятий, зданий и сооружений, включая изменения рельефа,
|
||||
геологического строения, гидрогеологических условий, состава, состояния и свойств грунтов,
|
||||
активности инженерно-геологических процессов, с целью получения данных для решения основных задач:
|
||||
</p>
|
||||
|
||||
<div className="space-y-4">
|
||||
{mainTasks.map((task, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="flex items-start gap-3 bg-white rounded-lg p-5 hover:shadow-md transition-shadow"
|
||||
>
|
||||
<div className="flex-shrink-0 w-8 h-8 bg-brand-orange text-white rounded-lg flex items-center justify-center font-bold text-sm">
|
||||
{index + 1}
|
||||
</div>
|
||||
<p className="text-gray-700 leading-relaxed pt-0.5">{task}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Методология */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Методология обследования
|
||||
</h2>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-8">
|
||||
<div className="bg-white rounded-2xl p-8 shadow-lg border-t-4 border-brand-orange">
|
||||
<div className="flex items-center gap-3 mb-6">
|
||||
<div className="w-12 h-12 bg-brand-orange text-white rounded-lg flex items-center justify-center">
|
||||
<Search size={24} />
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900">
|
||||
Использование материалов изысканий
|
||||
</h3>
|
||||
</div>
|
||||
<p className="text-gray-600 leading-relaxed text-sm">
|
||||
При наличии материалов изысканий прошлых лет их использование возможно с учетом п. 5.2 СП 11-105-97,
|
||||
часть I. В случаях, когда материалы отсутствуют или при анализе оцениваются как недостаточные,
|
||||
сомнительные, устаревшие, обследование следует выполнять в составе и в объемах, обоснованных
|
||||
в программе изысканий.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-white rounded-2xl p-8 shadow-lg border-t-4 border-brand-orange">
|
||||
<div className="flex items-center gap-3 mb-6">
|
||||
<div className="w-12 h-12 bg-brand-orange text-white rounded-lg flex items-center justify-center">
|
||||
<Activity size={24} />
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900">
|
||||
Стационарные наблюдения
|
||||
</h3>
|
||||
</div>
|
||||
<p className="text-gray-600 leading-relaxed text-sm">
|
||||
Обследование осуществляется на основе стационарных наблюдений за геофизическими параметрами среды
|
||||
(скоростью упругих волн, электрическим сопротивлением, температурой и др.), изменение которых позволяет
|
||||
судить об осадке оснований, фильтрации и других процессах. Выполняются повторные систематические
|
||||
наблюдения на одной и той же базе.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Дополнительные услуги */}
|
||||
<div className="max-w-5xl mx-auto mb-20">
|
||||
<div className="bg-gradient-to-br from-gray-900 to-gray-800 text-white rounded-2xl p-8 md:p-12">
|
||||
<div className="flex items-start gap-6">
|
||||
<div className="flex-shrink-0">
|
||||
<CheckCircle2 size={48} className="text-brand-orange" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-2xl font-bold mb-4">Дополнительные исследования</h3>
|
||||
<p className="text-gray-300 leading-relaxed">
|
||||
При обследовании оснований зданий и сооружений может выполняться определение глубины заложения
|
||||
фундаментов и оценки их состояния. Это позволяет получить полную картину состояния объекта
|
||||
и разработать комплекс мероприятий по обеспечению его безопасной эксплуатации.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Преимущества */}
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<div className="bg-gray-50 rounded-2xl p-8 md:p-12">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Почему важно обследование грунтов
|
||||
</h2>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-6">
|
||||
<div className="bg-white rounded-xl p-6 text-center">
|
||||
<div className="inline-flex w-16 h-16 bg-brand-orange/10 text-brand-orange rounded-full items-center justify-center mb-4">
|
||||
<AlertTriangle size={32} />
|
||||
</div>
|
||||
<h3 className="font-bold text-lg mb-3 text-gray-900">Предотвращение аварий</h3>
|
||||
<p className="text-gray-600 text-sm leading-relaxed">
|
||||
Своевременное выявление проблем позволяет избежать деформаций и разрушений зданий
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-white rounded-xl p-6 text-center">
|
||||
<div className="inline-flex w-16 h-16 bg-brand-orange/10 text-brand-orange rounded-full items-center justify-center mb-4">
|
||||
<Target size={32} />
|
||||
</div>
|
||||
<h3 className="font-bold text-lg mb-3 text-gray-900">Точная диагностика</h3>
|
||||
<p className="text-gray-600 text-sm leading-relaxed">
|
||||
Определение причин деформаций и разработка эффективных мер по их устранению
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-white rounded-xl p-6 text-center">
|
||||
<div className="inline-flex w-16 h-16 bg-brand-orange/10 text-brand-orange rounded-full items-center justify-center mb-4">
|
||||
<CheckCircle2 size={32} />
|
||||
</div>
|
||||
<h3 className="font-bold text-lg mb-3 text-gray-900">Безопасность</h3>
|
||||
<p className="text-gray-600 text-sm leading-relaxed">
|
||||
Обеспечение эксплуатационной надежности существующей и новой застройки
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Призыв к действию */}
|
||||
<div className="mt-12 text-center">
|
||||
<div className="bg-white rounded-2xl p-8 shadow-lg">
|
||||
<p className="text-gray-700 mb-6 text-lg">
|
||||
Нужна консультация по обследованию грунтов?
|
||||
</p>
|
||||
<a
|
||||
href="#/contacts"
|
||||
className="inline-block px-10 py-4 bg-brand-orange text-white font-bold rounded-lg hover:bg-orange-600 transition-colors text-lg shadow-lg hover:shadow-xl"
|
||||
>
|
||||
Связаться с нами
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default SoilSurveyPage;
|
||||
|
||||
|
||||
|
||||
307
pages/SurveyingPage.tsx
Normal file
307
pages/SurveyingPage.tsx
Normal file
@@ -0,0 +1,307 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { CheckCircle2, MapPin, Mountain, Leaf, Cloud, Wrench, Award } from 'lucide-react';
|
||||
|
||||
const SurveyingPage: React.FC = () => {
|
||||
const surveyTypes = [
|
||||
{
|
||||
icon: MapPin,
|
||||
title: 'Инженерно-геодезические изыскания',
|
||||
description: 'Работы включают выполнение топографической съемки различных масштабов, обмерные и разбивочные работы, обеспечение корректных геометрических размеров и форм элементов сооружения.'
|
||||
},
|
||||
{
|
||||
icon: Mountain,
|
||||
title: 'Инженерно-геологические изыскания',
|
||||
description: 'Оценка состояния грунтов, бурение разведочных скважин, испытания грунтов зондированием и штампами, лабораторный анализ их состава и физико-механических характеристик.'
|
||||
},
|
||||
{
|
||||
icon: Leaf,
|
||||
title: 'Инженерно-экологические изыскания',
|
||||
description: 'Радиационные исследования, определение содержания нефтепродуктов, тяжелых металлов, бактерий в почвах и грунтах, воздухе, подземных и поверхностных водах.'
|
||||
},
|
||||
{
|
||||
icon: Cloud,
|
||||
title: 'Инженерно-гидрологические и инженерно-метеорологические изыскания',
|
||||
description: 'Комплексное исследование гидрометеорологических условий территории и оценка влияния гидрометеорологических факторов на площадку строительства.'
|
||||
}
|
||||
];
|
||||
|
||||
const geodesicWorks = [
|
||||
'Создание опорных геодезических сетей',
|
||||
'Геодезические наблюдения за деформациями и осадками зданий и сооружений, движениями земной поверхности и опасными природными процессами',
|
||||
'Создание и обновление инженерно-топографических планов в масштабах 1:200 - 1:5000, в том числе в цифровой форме, съемка подземных коммуникаций и сооружений',
|
||||
'Трассирование линейных объектов',
|
||||
'Инженерно-гидрографические работы',
|
||||
'Специальные геодезические и топографические работы при строительстве и реконструкции зданий и сооружений'
|
||||
];
|
||||
|
||||
const geologicalWorks = [
|
||||
'Инженерно-геологическая съемка в масштабах 1:500 - 1:25000',
|
||||
'Проходка горных выработок с их опробованием, лабораторные исследования физико-механических свойств грунтов и химических свойств проб подземных вод',
|
||||
'Изучение опасных геологических и инженерно-геологических процессов с разработкой рекомендаций по инженерной защите территории',
|
||||
'Гидрогеологические исследования',
|
||||
'Инженерно-геофизические исследования',
|
||||
'Инженерно-геокриологические исследования',
|
||||
'Сейсмологические и сейсмотектонические исследования территории, сейсмическое микрорайонирование'
|
||||
];
|
||||
|
||||
const ecologicalWorks = [
|
||||
'Инженерно-экологическая съемка территории',
|
||||
'Исследования химического загрязнения почвогрунтов, поверхностных и подземных вод, атмосферного воздуха, источников загрязнения',
|
||||
'Лабораторные химико-аналитические и газохимические исследования образцов и проб почвогрунтов и воды',
|
||||
'Исследования и оценка физических воздействий и радиационной обстановки на территории',
|
||||
'Изучение растительности, животного мира, санитарно-эпидемиологические и медико-биологические исследования территории'
|
||||
];
|
||||
|
||||
const hydrometeorologicalWorks = [
|
||||
'Метеорологические наблюдения и изучение гидрологического режима водных объектов',
|
||||
'Изучение опасных гидрометеорологических процессов и явлений с расчетами их характеристик',
|
||||
'Изучение русловых процессов водных объектов, деформаций и переработки берегов',
|
||||
'Исследования ледового режима водных объектов'
|
||||
];
|
||||
|
||||
const geotechnicalWorks = [
|
||||
'Проходка горных выработок с их опробованием и лабораторные исследования механических свойств грунтов с определением характеристик для конкретных схем расчета оснований фундаментов',
|
||||
'Полевые испытания грунтов с определением их стандартных прочностных и деформационных характеристик (штамповые, сдвиговые, прессиометрические, срезные). Испытания эталонных и натурных свай',
|
||||
'Определение стандартных механических характеристик грунтов методами статического, динамического и бурового зондирования',
|
||||
'Физическое и математическое моделирование взаимодействия зданий и сооружений с геологической средой',
|
||||
'Специальные исследования характеристик грунтов по отдельным программам для нестандартных, в том числе нелинейных методов расчета оснований фундаментов и конструкции зданий и сооружений',
|
||||
'Геотехнический контроль строительства зданий, сооружений и прилегающих территорий'
|
||||
];
|
||||
|
||||
const pricing = [
|
||||
{ service: 'Инженерные изыскания под коттедж (геология+геодезия)', price: 'от 25000 ₽' },
|
||||
{ service: 'Инженерно-геологические изыскания для строительства', price: 'от 500 ₽ / м.' },
|
||||
{ service: 'Инженерно-геологические изыскания с экспертизой', price: 'от 500 ₽ / м.' },
|
||||
{ service: 'Геологические изыскания (особо крупные объекты)', price: 'от 300 ₽ / м.' },
|
||||
{ service: 'Геологические изыскания под коттедж', price: 'от 15000 ₽' },
|
||||
{ service: 'Инженерно-геодезические изыскания для строительства', price: 'от 5000 ₽' },
|
||||
{ service: 'Геоподоснова (топоплан с коммуникациями)', price: 'от 10000 ₽' },
|
||||
{ service: 'Геодезические изыскания под коттедж (топосъемка)', price: 'от 5000 ₽' },
|
||||
{ service: 'Определение границ, координатная привязка', price: 'от 2000 ₽' },
|
||||
{ service: 'Разбивка осей, реперы, сопровождение строительства', price: 'от 2000 ₽' },
|
||||
{ service: 'Инженерно-экологические изыскания', price: 'от 8000 ₽' },
|
||||
{ service: 'Инженерные изыскания (комплекс работ)', price: '10% скидка', highlight: true }
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Инженерные изыскания"
|
||||
description="Комплекс мероприятий для сбора и анализа детальной информации о территории строительства"
|
||||
image="/media/images/headers/header-injinernie-iziskania.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
{/* Основное описание */}
|
||||
<div className="max-w-5xl mx-auto mb-20">
|
||||
<div className="bg-gray-50 rounded-2xl p-8 md:p-12 mb-12">
|
||||
<p className="text-lg text-gray-700 leading-relaxed mb-6">
|
||||
<strong>Инженерные изыскания для выполнения строительства</strong> – комплекс мероприятий,
|
||||
направленных на сбор и анализ детальной информации о техногенных и природных условиях территории
|
||||
для будущего строительства. Полученные данные входят в состав обязательной документации для
|
||||
разработки проекта и проведения строительных работ.
|
||||
</p>
|
||||
<p className="text-gray-600 leading-relaxed">
|
||||
Необходимость проведения определенных видов изысканий, их объем и состав определяются после анализа
|
||||
технического задания и зависят от вида, уровня ответственности, назначения сооружений, стадии
|
||||
проектирования, условий участка и степени их изученности.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="bg-brand-orange text-white rounded-2xl p-8 md:p-12">
|
||||
<p className="text-lg leading-relaxed">
|
||||
Проведение инженерных изысканий подразумевает анализ данных, оценку возможных последствий реализации
|
||||
проекта, получение санитарно-эпидемиологических заключений и составление технических отчетов, состав
|
||||
которых определяется действующими нормативными документами. Наши специалисты профессионально выполняют
|
||||
изыскания для строящихся или реконструируемых объектов любых типов.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Типы изысканий */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-12 text-center">
|
||||
Мы выполняем следующие типы инженерных изысканий
|
||||
</h2>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
{surveyTypes.map((type, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="bg-white border-2 border-gray-200 rounded-2xl p-8 hover:border-brand-orange transition-all duration-300 hover:shadow-xl"
|
||||
>
|
||||
<div className="flex items-start gap-4 mb-4">
|
||||
<div className="flex-shrink-0 w-14 h-14 bg-brand-orange text-white rounded-xl flex items-center justify-center">
|
||||
<type.icon size={28} />
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900 leading-tight pt-2">
|
||||
{type.title}
|
||||
</h3>
|
||||
</div>
|
||||
<p className="text-gray-600 leading-relaxed">
|
||||
{type.description}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Допуски к работам */}
|
||||
<div className="max-w-6xl mx-auto mb-20">
|
||||
<div className="text-center mb-12">
|
||||
<div className="inline-flex items-center gap-3 bg-brand-orange text-white px-8 py-4 rounded-full mb-6">
|
||||
<Award size={32} />
|
||||
<span className="text-xl font-bold">ООО ГЕОВЕКТОР ИМЕЕТ ДОПУСК К СЛЕДУЮЩИМ ВИДАМ РАБОТ</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-12">
|
||||
{/* Инженерно-геодезические */}
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-3">
|
||||
<div className="w-2 h-8 bg-brand-orange rounded"></div>
|
||||
Инженерно-геодезические изыскания
|
||||
</h3>
|
||||
<ul className="space-y-3">
|
||||
{geodesicWorks.map((work, index) => (
|
||||
<li key={index} className="flex items-start gap-3">
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
|
||||
<span className="text-gray-700">{work}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Инженерно-геологические */}
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-3">
|
||||
<div className="w-2 h-8 bg-brand-orange rounded"></div>
|
||||
Инженерно-геологические изыскания
|
||||
</h3>
|
||||
<ul className="space-y-3">
|
||||
{geologicalWorks.map((work, index) => (
|
||||
<li key={index} className="flex items-start gap-3">
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
|
||||
<span className="text-gray-700">{work}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Инженерно-экологические */}
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-3">
|
||||
<div className="w-2 h-8 bg-brand-orange rounded"></div>
|
||||
Инженерно-экологические изыскания
|
||||
</h3>
|
||||
<ul className="space-y-3">
|
||||
{ecologicalWorks.map((work, index) => (
|
||||
<li key={index} className="flex items-start gap-3">
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
|
||||
<span className="text-gray-700">{work}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Инженерно-гидрометеорологические */}
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-3">
|
||||
<div className="w-2 h-8 bg-brand-orange rounded"></div>
|
||||
Инженерно-гидрометеорологические изыскания
|
||||
</h3>
|
||||
<ul className="space-y-3">
|
||||
{hydrometeorologicalWorks.map((work, index) => (
|
||||
<li key={index} className="flex items-start gap-3">
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
|
||||
<span className="text-gray-700">{work}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Инженерно-геотехнические */}
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<h3 className="text-2xl font-bold text-gray-900 mb-6 flex items-center gap-3">
|
||||
<div className="w-2 h-8 bg-brand-orange rounded"></div>
|
||||
Инженерно-геотехнические изыскания
|
||||
</h3>
|
||||
<p className="text-sm text-gray-600 italic mb-6">
|
||||
(Выполняются в составе инженерно-геологических изысканий или отдельно на изученной
|
||||
в инженерно-геологическом отношении территории под отдельные здания и сооружения).
|
||||
</p>
|
||||
<ul className="space-y-3">
|
||||
{geotechnicalWorks.map((work, index) => (
|
||||
<li key={index} className="flex items-start gap-3">
|
||||
<CheckCircle2 className="flex-shrink-0 text-brand-orange mt-1" size={20} />
|
||||
<span className="text-gray-700">{work}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Прайс-лист */}
|
||||
<div className="max-w-5xl mx-auto">
|
||||
<h2 className="text-3xl font-bold text-gray-900 mb-8 text-center">
|
||||
Цены на основные виды работ по инженерным изысканиям
|
||||
</h2>
|
||||
|
||||
<div className="overflow-x-auto shadow-lg rounded-2xl">
|
||||
<table className="w-full bg-white">
|
||||
<thead>
|
||||
<tr className="bg-brand-orange text-white">
|
||||
<th className="px-6 py-4 text-left font-bold">Наименование услуги</th>
|
||||
<th className="px-6 py-4 text-right font-bold w-48">Стоимость</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{pricing.map((item, index) => (
|
||||
<tr
|
||||
key={index}
|
||||
className={`border-b border-gray-200 transition-colors ${
|
||||
item.highlight
|
||||
? 'bg-brand-orange/10 hover:bg-brand-orange/20'
|
||||
: index % 2 === 0
|
||||
? 'bg-white hover:bg-gray-50'
|
||||
: 'bg-gray-50 hover:bg-gray-100'
|
||||
}`}
|
||||
>
|
||||
<td className={`px-6 py-4 ${item.highlight ? 'font-bold text-gray-900' : 'text-gray-700'}`}>
|
||||
{item.service}
|
||||
</td>
|
||||
<td className={`px-6 py-4 text-right ${item.highlight ? 'text-brand-orange font-bold text-lg' : 'font-semibold text-gray-900'}`}>
|
||||
{item.price}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
{/* Призыв к действию */}
|
||||
<div className="mt-12 text-center">
|
||||
<div className="bg-gray-50 rounded-2xl p-8">
|
||||
<p className="text-gray-700 mb-6">
|
||||
Точную стоимость работ можно узнать после анализа технического задания и условий объекта
|
||||
</p>
|
||||
<a
|
||||
href="#/contacts"
|
||||
className="inline-block px-8 py-4 bg-brand-orange text-white font-bold rounded-lg hover:bg-orange-600 transition-colors text-lg"
|
||||
>
|
||||
Получить консультацию
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default SurveyingPage;
|
||||
|
||||
|
||||
|
||||
163
pages/TechnicalTasksPage.tsx
Normal file
163
pages/TechnicalTasksPage.tsx
Normal file
@@ -0,0 +1,163 @@
|
||||
import React from 'react';
|
||||
import PageHeader from '../components/PageHeader';
|
||||
import { FileText, Download, ExternalLink } from 'lucide-react';
|
||||
|
||||
const TechnicalTasksPage: React.FC = () => {
|
||||
const technicalTasks = [
|
||||
{
|
||||
id: 1,
|
||||
title: 'ТЕХНИЧЕСКОЕ ЗАДАНИЕ НА ПРОИЗВОДСТВО ИНЖЕНЕРНЫХ ИЗЫСКАНИЙ',
|
||||
pdfUrl: '/media/tz/tekhnicheskoe_zadanie_na_proizvodstvo_inzhenernyh_izyskaniy.pdf',
|
||||
wordUrl: '/media/tz/tekhnicheskoe_zadanie_na_proizvodstvo_inzhenernyh_izyskaniy.doc'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: 'ТЕХНИЧЕСКОЕ ЗАДАНИЕ НА ПРОИЗВОДСТВО ОБСЛЕДОВАНИЯ ЗДАНИЙ И СООРУЖЕНИЙ',
|
||||
pdfUrl: '/media/tz/tekhnicheskoe_zadanie_na_proizvodstvo_obsledovaniya_zdanij_i_sooruzheniy.pdf',
|
||||
wordUrl: '/media/tz/tekhnicheskoe_zadanie_na_proizvodstvo_obsledovaniya_zdanij_i_sooruzheniy.doc'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: 'ТЕХНИЧЕСКОЕ ЗАДАНИЕ НА ПРОИЗВОДСТВО ИНЖЕНЕРНО-ЭКОЛОГИЧЕСКИХ ИЗЫСКАНИЙ',
|
||||
pdfUrl: '/media/tz/tehnicheskoe_zadanie_na_proizvodstvo_inzhenerno_ekologicheskih_iziskaniy.pdf',
|
||||
wordUrl: '/media/tz/tehnicheskoe_zadanie_na_proizvodstvo_inzhenerno_ekologicheskih_iziskaniy.doc'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: 'ТЕХНИЧЕСКОЕ ЗАДАНИЕ НА ПРОИЗВОДСТВО ИНЖЕНЕРНО-ГИДРОЛОГИЧЕСКИХ ИЗЫСКАНИЙ',
|
||||
pdfUrl: '/media/tz/tehnicheskoe_zadanie_na_proizvodstvo_inzhenerno_gidrologicheskih_iziskaniy.pdf',
|
||||
wordUrl: '/media/tz/tehnicheskoe_zadanie_na_proizvodstvo_inzhenerno_gidrologicheskih_iziskaniy.doc'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: 'ТЕХНИЧЕСКОЕ ЗАДАНИЕ НА ПРОИЗВОДСТВО ИНЖЕНЕРНО-ГЕОЛОГИЧЕСКИХ ИЗЫСКАНИЙ',
|
||||
pdfUrl: '/media/tz/tehnicheskoe_zadanie_na_proizvodstvo_inzhenerno_geologicheskih_iziskaniy.pdf',
|
||||
wordUrl: '/media/tz/tehnicheskoe_zadanie_na_proizvodstvo_inzhenerno_geologicheskih_iziskaniy.doc'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
title: 'ТЕХНИЧЕСКОЕ ЗАДАНИЕ НА ПРОИЗВОДСТВО ИНЖЕНЕРНО-ГЕОДЕЗИЧЕСКИХ ИЗЫСКАНИЙ',
|
||||
pdfUrl: '/media/tz/tehnicheskoe_zadanie_na_proizvodstvo_inzhenerno_geodezicheskih_iziskaniy.pdf',
|
||||
wordUrl: '/media/tz/tehnicheskoe_zadanie_na_proizvodstvo_inzhenerno_geodezicheskih_iziskaniy.doc'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
title: 'ТЕХНИЧЕСКОЕ ЗАДАНИЕ НА ВЫПОЛНЕНИЕ ПРОЕКТНЫХ РАБОТ',
|
||||
pdfUrl: '/media/tz/tehnicheskoe_zadanie_na_vipolnenie_proektnih_rabot.pdf',
|
||||
wordUrl: '/media/tz/tehnicheskoe_zadanie_na_vipolnenie_proektnih_rabot.doc'
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="bg-white pb-20">
|
||||
<PageHeader
|
||||
title="Технические задания"
|
||||
description="Примеры технических заданий для различных видов работ"
|
||||
image="/media/images/services/technical-assignments.png"
|
||||
/>
|
||||
|
||||
<div className="container mx-auto px-6 py-20">
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<div className="mb-12 bg-gray-50 rounded-2xl p-8">
|
||||
<p className="text-gray-700 leading-relaxed text-center">
|
||||
На этой странице вы можете ознакомиться с примерами технических заданий для различных видов работ.
|
||||
Документы доступны для просмотра и скачивания в форматах PDF и Word.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-8">
|
||||
{technicalTasks.map((task) => (
|
||||
<div
|
||||
key={task.id}
|
||||
className="border-2 border-gray-200 rounded-2xl overflow-hidden hover:border-brand-orange transition-all duration-300"
|
||||
>
|
||||
{/* Заголовок */}
|
||||
<div className="bg-brand-orange text-white px-8 py-6">
|
||||
<h2 className="text-xl font-bold uppercase">
|
||||
{task.title}
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
{/* Кнопки действий */}
|
||||
<div className="bg-white p-6">
|
||||
<div className="flex flex-col sm:flex-row gap-4">
|
||||
{/* Кнопка PDF */}
|
||||
<a
|
||||
href={task.pdfUrl}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex items-center justify-center gap-3 px-6 py-4 bg-white border-2 border-gray-300 rounded-lg hover:border-brand-orange hover:bg-gray-50 transition-all group flex-1"
|
||||
>
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="w-10 h-10 bg-red-100 rounded flex items-center justify-center group-hover:bg-red-200 transition-colors">
|
||||
<FileText className="text-red-600" size={20} />
|
||||
</div>
|
||||
<div className="text-left">
|
||||
<div className="text-sm font-semibold text-gray-900">Открыть документ</div>
|
||||
<div className="text-xs text-gray-500">(pdf)</div>
|
||||
</div>
|
||||
</div>
|
||||
<ExternalLink className="text-brand-orange ml-auto" size={20} />
|
||||
</a>
|
||||
|
||||
{/* Кнопка Word */}
|
||||
<a
|
||||
href={task.wordUrl}
|
||||
download
|
||||
className="flex items-center justify-center gap-3 px-6 py-4 bg-white border-2 border-gray-300 rounded-lg hover:border-brand-orange hover:bg-gray-50 transition-all group flex-1"
|
||||
>
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="w-10 h-10 bg-blue-100 rounded flex items-center justify-center group-hover:bg-blue-200 transition-colors">
|
||||
<Download className="text-blue-600" size={20} />
|
||||
</div>
|
||||
<div className="text-left">
|
||||
<div className="text-sm font-semibold text-gray-900">Скачать файл</div>
|
||||
<div className="text-xs text-gray-500">(word)</div>
|
||||
</div>
|
||||
</div>
|
||||
<Download className="text-brand-orange ml-auto" size={20} />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Информационный блок */}
|
||||
<div className="mt-12 bg-gradient-to-br from-brand-orange to-orange-600 text-white rounded-2xl p-8 md:p-12">
|
||||
<h3 className="text-2xl font-bold mb-4">Нужна помощь с техническим заданием?</h3>
|
||||
<p className="leading-relaxed mb-6">
|
||||
Наши специалисты помогут вам составить техническое задание с учетом специфики вашего проекта
|
||||
и всех необходимых нормативных требований.
|
||||
</p>
|
||||
<a
|
||||
href="#/contacts"
|
||||
className="inline-block px-8 py-4 bg-white text-brand-orange font-bold rounded-lg hover:bg-gray-100 transition-colors"
|
||||
>
|
||||
Получить консультацию
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{/* Дополнительная информация */}
|
||||
<div className="mt-8 bg-gray-50 rounded-xl p-6">
|
||||
<div className="flex items-start gap-4">
|
||||
<FileText className="text-brand-orange flex-shrink-0 mt-1" size={24} />
|
||||
<div>
|
||||
<h4 className="font-bold text-gray-900 mb-2">Важно знать</h4>
|
||||
<p className="text-sm text-gray-600 leading-relaxed">
|
||||
Представленные технические задания являются примерными образцами. Для вашего проекта
|
||||
техническое задание должно быть адаптировано под конкретные условия и требования объекта.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default TechnicalTasksPage;
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user