From 31dd93a9e7c10016e39fb76a024cd8186e173564 Mon Sep 17 00:00:00 2001
From: RedrockJS <smb.sochi@gmail.com>
Date: Tue, 1 Jul 2025 16:06:50 +0300
Subject: [PATCH] feat: add order-schema

---
 public/images/arrow.png                      | Bin 0 -> 756 bytes
 src/entities/index.ts                        |   1 +
 src/entities/order-schema/index.ts           |   1 +
 src/entities/order-schema/styles.module.scss |  29 +++++++++++
 src/entities/order-schema/ui.tsx             |  52 +++++++++++++++++++
 src/views/expertise/autotech/ui.tsx          |   6 ++-
 6 files changed, 87 insertions(+), 2 deletions(-)
 create mode 100644 public/images/arrow.png
 create mode 100644 src/entities/order-schema/index.ts
 create mode 100644 src/entities/order-schema/styles.module.scss
 create mode 100644 src/entities/order-schema/ui.tsx

diff --git a/public/images/arrow.png b/public/images/arrow.png
new file mode 100644
index 0000000000000000000000000000000000000000..9744c1f7a048e548ad069d7c8a84b76a57b0a38f
GIT binary patch
literal 756
zcmV<Q0t@|#P)<h;3K|Lk000e1NJLTq002+`000vR1^@s62i=Nq00009a7bBm000ie
z000ie0hKEb8vp<Trb$FWR9J<zm_ce(K@f(kA4Bj2LBs=uEP@LU;M$do<N$)W$~|0&
zcp6U-Lcj~SNJQKUE?ori|6KT9eD+jzS5L-*;muT6)&Ey@b-!ZF%qIIQlk?j;y7lva
z=(6_p_nmc;Ho!6PsN*};MAr-6r(QSfClwKn?0UW}j1l~h6YxyZ58xAU9NE=Dv|3Q5
zt4XeHTf|x$<HfCcELc%tJm2gIk)xZ;%z%SZ%4B9oX7*t&V%R9Vbd3jm-=jI=pS2m0
ze|#mK1Gka@u7Q(Y{9TgB=rTT|7#W_~jdpeOJ$Me>@<+Z%I`Z&5qE_j=qZlRU`HXZ#
zE4h|^Cf=|BuO%&=_*v2u55W7h)>{Ny{?U5I&f^kcMDc3OUR;wj0q2sIPQ0$}#8mLs
z_e{dIWHut=62*(;KHY0(X22xr)vAbJC7qa=72vevY-VPq6a(&_i<DBjwrd+N{<7}*
zL~&{xk4qgR!X41PG_&Wk?glt3b49lb;*qKoS{G|AQBfnJ(T3C#@r*XAg}sjg12>z9
zbd<=VuZ!p<o7LBw=Gl84=kf6xV6Cs85&w*?l=7_rM<d6~TZ;gDarY%Xej^+@o%aTK
zVP;lJ`DkWmi%s;VZM`u)U3Ql1y&<!2*&c3hB=U0I!jSX;cq@r{oVk>AxU6UAqwL%4
zUUSzTxa<`h*Z}V&{hW(;1w8h^T0?7QZi+gg*ELzY><ri%gFFd+frGht07$x!^su(i
z%z05)jqY^sO6V21Hy4f;GCa1c;{BS7cLi(}&jT3ghMGjH5E<P_M`t#87u^JGB)tcg
z;$1lZ4Y~zvCDJ=~yC%@;E)OfRi*T~{<(;jh(^c^<fkV%(2h!Xn+fKaJW$vtOyiwn5
m9<BgSf$#I3=lv^vC%*yyG1Q^ReKE@b0000<MNUMnLSTY|uWIf9

literal 0
HcmV?d00001

diff --git a/src/entities/index.ts b/src/entities/index.ts
index 30029b8..61fdc79 100644
--- a/src/entities/index.ts
+++ b/src/entities/index.ts
@@ -2,3 +2,4 @@ export * from './top-menu';
 export * from './base-menu';
 export * from './callback-form';
 export * from './connect';
+export * from './order-schema';
diff --git a/src/entities/order-schema/index.ts b/src/entities/order-schema/index.ts
new file mode 100644
index 0000000..5ecdd1f
--- /dev/null
+++ b/src/entities/order-schema/index.ts
@@ -0,0 +1 @@
+export * from './ui';
diff --git a/src/entities/order-schema/styles.module.scss b/src/entities/order-schema/styles.module.scss
new file mode 100644
index 0000000..769585f
--- /dev/null
+++ b/src/entities/order-schema/styles.module.scss
@@ -0,0 +1,29 @@
+.Container {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  background: $color-green;
+  padding: rem(20px);
+  border-radius: rem(16px);
+  margin-bottom: rem(40px);
+
+  .Block{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: rem(4px);
+
+    .Arrow{
+      margin-top: rem(50px);
+    }
+
+    .Text{
+      font-family: $font-roboto;
+      font-weight: 400;
+      font-size: rem(14px);
+      line-height: 150%;
+      color: $color-white;
+      text-align: center;
+      text-transform: uppercase;
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/entities/order-schema/ui.tsx b/src/entities/order-schema/ui.tsx
new file mode 100644
index 0000000..725ffd3
--- /dev/null
+++ b/src/entities/order-schema/ui.tsx
@@ -0,0 +1,52 @@
+import s from './styles.module.scss';
+import Image from 'next/image';
+import stepOne from '@public/images/step1.png';
+import stepTwo from '@public/images/step2.png';
+import stepThree from '@public/images/step3.png';
+import stepFour from '@public/images/step4.png';
+import arrow from '@public/images/arrow.png';
+
+function OrderSchema() {
+  return (
+    <div className={s.Container}>
+      <div className={s.Block}>
+        <Image className={s.Image} src={stepOne} alt={''} height={120} />
+        <p className={s.Text}> Заявка на сайте </p>
+        <p className={s.Text}> или </p>
+        <p className={s.Text}> звонок по телефону </p>
+        <p className={s.Text}> +7 (900) 241-34-34 </p>
+      </div>
+      <div className={s.Block}>
+        <Image className={s.Arrow} src={arrow} alt={''} height={16} />
+      </div>
+      <div className={s.Block}>
+        <Image className={s.Image} src={stepTwo} alt={''} height={120} />
+        <p className={s.Text}>Мы свяжемся </p>
+        <p className={s.Text}> с вами</p>
+        <p className={s.Text}>и уточним</p>
+        <p className={s.Text}>детали</p>
+      </div>
+      <div className={s.Block}>
+        <Image className={s.Arrow} src={arrow} alt={''} height={16} />
+      </div>
+      <div className={s.Block}>
+        <Image className={s.Image} src={stepThree} alt={''} height={120} />
+        <p className={s.Text}>Подписываем договор,</p>
+        <p className={s.Text}>Вы оплачиваете услуги,</p>
+        <p className={s.Text}>предоставляете необходимые </p>
+        <p className={s.Text}>документы</p>
+      </div>
+      <div className={s.Block}>
+        <Image className={s.Arrow} src={arrow} alt={''} height={16} />
+      </div>
+      <div className={s.Block}>
+        <Image className={s.Image} src={stepFour} alt={''} height={120} />
+        <p className={s.Text}>Составляем</p>
+        <p className={s.Text}>Экспертное заключение,</p>
+        <p className={s.Text}>вы получаете результат</p>
+      </div>
+    </div>
+  );
+}
+
+export { OrderSchema };
diff --git a/src/views/expertise/autotech/ui.tsx b/src/views/expertise/autotech/ui.tsx
index 2b29362..115d33c 100644
--- a/src/views/expertise/autotech/ui.tsx
+++ b/src/views/expertise/autotech/ui.tsx
@@ -1,5 +1,5 @@
 import s from './styles.module.scss';
-import { CallbackForm, Connect } from '@/entities';
+import { CallbackForm, Connect, OrderSchema } from '@/entities';
 
 function AutoTech() {
   return (
@@ -64,7 +64,9 @@ function AutoTech() {
             <li className={s.ListItem}>паспортные данные заказчика;</li>
           </ul>
           <h3 className={s.Header}>Заказать экспертизу очень просто:</h3>
-          WIDGET
+
+          <OrderSchema />
+
           <p className={s.Text}>
             Экспертное заключение, полученный от компании «ДИ ТРАСО», будет
             являться официальным документом, подтверждающим результат работы