diff --git a/client/Map2.svg b/client/Map2.svg deleted file mode 100644 index 1c71715..0000000 --- a/client/Map2.svg +++ /dev/null @@ -1,161 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/client/public/VRAnim_47.glb b/client/public/VRAnim_47.glb new file mode 100644 index 0000000..06ef449 Binary files /dev/null and b/client/public/VRAnim_47.glb differ diff --git a/client/src/App.tsx b/client/src/App.tsx index 2653e13..8a11e26 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -10,6 +10,8 @@ import api from "./utils/api"; import FeatureCard from "./components/FeatureCard"; import RelevantExpCard from "./components/RelevantExpCard"; import Title from "./components/Title"; +import FeatureCardMobile from "./components/FeatureCardMobile"; +import { EffectComposer, Bloom } from "@react-three/postprocessing"; function App() { const parallaxRef = useRef(null); @@ -19,8 +21,8 @@ function App() { const [company, setCompany] = useState(""); const [phone, setPhone] = useState(""); - const [mapPosition, setMapPosition] = useState("29% 100%"); - const [mapCity, setMapCity] = useState("Тюмень"); + // const [mapPosition, setMapPosition] = useState("29% 100%"); + // const [mapCity, setMapCity] = useState("Тюмень"); const [isShowRelevantExpCards, setIsShowRelevantExpCards] = useState(false); @@ -31,10 +33,14 @@ function App() { const featureImagesContainer = useRef(null); const featureImages = [ - "https://images.unsplash.com/photo-1682595950157-8d1cc0ef388f?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&auto=format&fit=crop&w=500&q=60", - "https://images.unsplash.com/photo-1682402178953-f2cb484d4024?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHw1fHx8ZW58MHx8fHw%3D&auto=format&fit=crop&w=500&q=60", - "https://plus.unsplash.com/premium_photo-1676648534973-dd205cb63d99?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwxMnx8fGVufDB8fHx8&auto=format&fit=crop&w=500&q=60", - "https://images.unsplash.com/photo-1682353213492-8433d437855a?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwxM3x8fGVufDB8fHx8&auto=format&fit=crop&w=500&q=60", + "/images/cards/1.jpg", + "/images/cards/2.jpg", + "/images/cards/3.jpg", + "/images/cards/4.jpg", + "/images/cards/5.jpg", + "/images/cards/6.jpg", + "/images/cards/7.jpg", + "/images/cards/8.jpg", ]; const [selectedFeatureImageIndex, setSelectedFeatureImageIndex] = useState(0); @@ -88,21 +94,21 @@ function App() { alert("Заявка отправлена!"); } - function handleClickComplexCard(city: string) { - if (city === "Тюмень") { - setMapPosition("29% 100%"); - } else if (city === "Екатеринбург") { - setMapPosition("22% 93%"); - } else if (city === "Брянск") { - setMapPosition("1.5% 48%"); - } else if (city === "Санкт-Петербург") { - setMapPosition("6% 16%"); - } else if (city === "Нижний Тагил") { - setMapPosition("19% 77%"); - } + // function handleClickComplexCard(city: string) { + // if (city === "Тюмень") { + // setMapPosition("29% 100%"); + // } else if (city === "Екатеринбург") { + // setMapPosition("22% 93%"); + // } else if (city === "Брянск") { + // setMapPosition("1.5% 48%"); + // } else if (city === "Санкт-Петербург") { + // setMapPosition("6% 16%"); + // } else if (city === "Нижний Тагил") { + // setMapPosition("19% 77%"); + // } - setMapCity(city); - } + // setMapCity(city); + // } useEffect(() => { window.addEventListener("scroll", handleScroll); @@ -116,7 +122,7 @@ function App() {
@@ -154,12 +160,12 @@ function App() { {/*
*/}
-
+
-
+
-
+
- {/*
*/} - {/* */} -
+
setSelectedFeatureImageIndex(0)} />
@@ -301,54 +305,70 @@ function App() { /> setSelectedFeatureImageIndex(2)} + handleMouseEnter={() => setSelectedFeatureImageIndex(4)} /> setSelectedFeatureImageIndex(1)} + handleMouseEnter={() => setSelectedFeatureImageIndex(5)} /> setSelectedFeatureImageIndex(0)} + handleMouseEnter={() => setSelectedFeatureImageIndex(6)} /> setSelectedFeatureImageIndex(3)} + handleMouseEnter={() => setSelectedFeatureImageIndex(7)} + /> +
+
+ + + + + + + +
-
+
-
- {helmetInView && ( - - - - - - - {/* */} - - - - )} -
Экскурсия в виртуальной реальности @@ -362,6 +382,45 @@ function App() { Записаться в шоу-рум + +
+ {helmetInView && ( + + + + + + + {/* */} + + {/* */} + {/* */} + {/* + */} + + + + + )} +
@@ -371,7 +430,11 @@ function App() {
-
+ Анализируем поведение пользователей

@@ -384,11 +447,15 @@ function App() { комплекса еще эффективнее.

-
+
-
+

Конверсия менеджеров в брони

@@ -398,7 +465,11 @@ function App() { К. Н. Федоров
-
+
45%
@@ -408,7 +479,11 @@ function App() { И. Ф. Яковлева
-
+
30%
@@ -418,14 +493,22 @@ function App() { А. М. Ташева
-
+
20%
-
+ -
+

Популярные типы квартир, %

@@ -469,27 +552,41 @@ function App() {
-
+ -
+

Воронка продаж

-
+ Сеансы -
+
- 100% + + 100% +
-
+ В избранное -
+
93,47% @@ -498,9 +595,13 @@ function App() {
-
+ Брони -
+
45,68% @@ -509,20 +610,28 @@ function App() {
-
+ Продажи -
+
29,13%
-
+
-
-
+
+

12

минут

@@ -530,9 +639,13 @@ function App() {

Среднее время сеанса

-
+
-
+

856

{/*

минут

*/} @@ -540,9 +653,13 @@ function App() {

Коммерческих предложений сформировано

-
+
-
+

12,41%

{/*

минут

*/} @@ -550,9 +667,13 @@ function App() {

Конверсия из сеанса в бронь

-
+
-
+

132,1

млн. р.

@@ -560,7 +681,7 @@ function App() {

Получено через Graff.estate

-
+
@@ -829,12 +950,12 @@ function App() {
diff --git a/client/src/components/Calc.tsx b/client/src/components/Calc.tsx index df00a39..4d8a9d8 100644 --- a/client/src/components/Calc.tsx +++ b/client/src/components/Calc.tsx @@ -2,6 +2,7 @@ import React, { ChangeEvent, useEffect, useState } from "react"; import SearchableSelect from "./SearchableSelect"; import api from "../utils/api"; import { motion } from "framer-motion"; +import RangeSlider from "./RangeSlider"; function Calc() { const [regions, setRegions] = useState([]); @@ -225,13 +226,23 @@ function Calc() {

Очных консультаций в месяц

- +
+
+ setConsultsPerMonth(value)} + /> +
+ +
@@ -294,8 +305,8 @@ function Calc() { Результаты расчета

-
-
+
+

Срок реализации

@@ -310,7 +321,7 @@ function Calc() {

{implementationTimeCase}

{isEnabled && ( -

+

На{" "} {diffImplementationTime} {diffImplementationTimeCase} @@ -336,7 +347,7 @@ function Calc() {

млн. р.

{isEnabled && ( -

+

На{" "} {diffProfitPerMonth} млн. р. @@ -351,7 +362,7 @@ function Calc() {

- - ) : ( - <> - - - - )} -

- ( - setValue(+e.target.value), - setEditableValue(Math.round(+e.target.value)) - )} - /> -
- {min.toLocaleString()} - - {max.toLocaleString()} -
-
+ ( + handleChange(+e.target.value), setValue(+e.target.value) + )} + /> ); } diff --git a/client/src/components/VRHemlet.tsx b/client/src/components/VRHemlet.tsx index 90a74cc..8c06873 100644 --- a/client/src/components/VRHemlet.tsx +++ b/client/src/components/VRHemlet.tsx @@ -8,7 +8,7 @@ import { useGLTF, useAnimations } from "@react-three/drei"; export function Model(props: any) { const group = useRef(null); - const { nodes, materials, animations }: any = useGLTF("/VRAnim_46.glb"); + const { nodes, materials, animations }: any = useGLTF("/VRAnim_47.glb"); const { actions }: any = useAnimations(animations, group); useEffect(() => { @@ -22,7 +22,7 @@ export function Model(props: any) {