redrockjs/ocenka-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(sidebar): add mobile sidebar

Browse Source
This commit is contained in:
Valery Grunenko
2025-12-03 15:30:46 +03:00
parent 18ebfa734a
commit 01de6f6e75
22 changed files with 613 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

167
src/shared/const/menu.ts
View File

@@ -1,267 +1,272 @@
import { TMenu } from '@shared/types/menu';
import { ROUTES } from './route';
export const baseMenu: TMenu = [
export type TMenuItem = {
title: string;
link?: string;
children?: TMenuItem[];
};
export const baseMenu: TMenuItem[] = [
{
name: 'Экспертиза',
title: 'Экспертиза',
link: ROUTES.EXPERTIZA,
children: [
{
name: 'Автотехническая',
title: 'Автотехническая',
link: ROUTES.EXPERTIZA_AUTOTECH,
},
{
name: 'Трасологическая',
title: 'Трасологическая',
link: ROUTES.EXPERTIZA_TRASOLOGIA,
},
{
name: 'Пожарно-техническая',
title: 'Пожарно-техническая',
link: ROUTES.EXPERTIZA_POZHAR,
},
{
name: 'Товароведческая',
title: 'Товароведческая',
link: ROUTES.EXPERTIZA_TOVAR,
},
{
name: 'Рецензирование и проверка экспертизы',
title: 'Рецензирование и проверка экспертизы',
link: ROUTES.EXPERTIZA_RECENZII,
},
{
name: 'Документарная',
title: 'Документарная',
link: ROUTES.EXPERTIZA_DOCUMENT,
},
{
name: 'Бухгалтерская',
title: 'Бухгалтерская',
link: ROUTES.EXPERTIZA_BUHGALTER,
},
{
name: 'Финансово-экономическая',
title: 'Финансово-экономическая',
link: ROUTES.EXPERTIZA_FINANS,
},
{
name: 'Земле-устроительная',
title: 'Земле-устроительная',
link: ROUTES.EXPERTIZA_ZEM_STROY,
},
{
name: 'Кадастровая',
title: 'Кадастровая',
link: ROUTES.EXPERTIZA_KADASTR,
},
{
name: 'Строительно-техническая',
title: 'Строительно-техническая',
link: ROUTES.EXPERTIZA_STROIT,
},
{
name: 'Компьютерно-техническая',
title: 'Компьютерно-техническая',
link: ROUTES.EXPERTIZA_COPMPUTER,
},
{
name: 'Почерковедческая',
title: 'Почерковедческая',
link: ROUTES.EXPERTIZA_POCHERK,
},
{
name: 'Технико-криминалистическая',
title: 'Технико-криминалистическая',
link: ROUTES.EXPERTIZA_TECH_CRIM,
},
],
},
{
name: 'Оценка',
title: 'Оценка',
link: ROUTES.OCENKA,
children: [
{
name: 'По ситуации',
title: 'По ситуации',
children: [
{
name: 'Независимая оценка',
title: 'Независимая оценка',
link: ROUTES.OCENKA_NEZAVISIM,
},
{
name: 'Оценка для опеки',
title: 'Оценка для опеки',
link: ROUTES.OCENKA_OPEKA,
},
{
name: 'Оценка для нотариуса',
title: 'Оценка для нотариуса',
link: ROUTES.OCENKA_NOTARIUS,
},
{
name: 'Оценка для вступления в наследство',
title: 'Оценка для вступления в наследство',
link: ROUTES.OCENKA_NASLEDSTVO,
},
{
name: 'Оценка для страхования',
title: 'Оценка для страхования',
link: ROUTES.OCENKA_STRAHOVANIE,
},
{
name: 'Оценка для определения стоимости ущерба',
title: 'Оценка для определения стоимости ущерба',
link: ROUTES.OCENKA_USCHERB,
},
{
name: 'Оценка имущества при разводе',
title: 'Оценка имущества при разводе',
link: ROUTES.OCENKA_RAZVOD,
},
{
name: 'Оценка недвижимости для суда',
title: 'Оценка недвижимости для суда',
link: ROUTES.OCENKA_SUD,
},
{
name: 'Оценка для внесения в уставный капитал',
title: 'Оценка для внесения в уставный капитал',
link: ROUTES.OCENKA_USTAV_KAPITAL,
},
{
name: 'Оценка для ипотеки',
title: 'Оценка для ипотеки',
link: ROUTES.OCENKA_IPOTEKA,
},
{
name: 'Оценка для банка',
title: 'Оценка для банка',
link: ROUTES.OCENKA_BANK,
},
{
name: 'Оценка имущества для банкротства',
title: 'Оценка имущества для банкротства',
link: ROUTES.OCENKA_BANKROTSTV,
},
],
},
{
name: 'Жилая недвижимость',
title: 'Жилая недвижимость',
children: [
{
name: 'Оценка квартиры',
title: 'Оценка квартиры',
link: ROUTES.OCENKA_KVARTIRA,
},
{
name: 'Оценка жилого дома',
title: 'Оценка жилого дома',
link: ROUTES.OCENKA_DOM,
},
{
name: 'Оценка земельного участка',
title: 'Оценка земельного участка',
link: ROUTES.OCENKA_UCHASTOK,
},
{
name: 'Оценка гаража',
title: 'Оценка гаража',
link: ROUTES.OCENKA_GARAZH,
},
{
name: 'Оценка ущерба недвижимости',
title: 'Оценка ущерба недвижимости',
link: ROUTES.OCENKA_USCHERB_NEDVIGI,
},
{
name: 'Оценка ущерба от залива',
title: 'Оценка ущерба от залива',
link: ROUTES.OCENKA_ZATOPLENIE,
},
{
name: 'Оценка ущерба от пожара',
title: 'Оценка ущерба от пожара',
link: ROUTES.OCENKA_POZHAR,
},
],
},
{
name: 'Коммерческая недвижимость',
title: 'Коммерческая недвижимость',
children: [
{
name: 'Оценка стоимости арендной ставки',
title: 'Оценка стоимости арендной ставки',
link: ROUTES.OCENKA_ARENDA,
},
{
name: 'Оценка здания',
title: 'Оценка здания',
link: ROUTES.OCENKA_ZDANIE,
},
{
name: 'Оценка земель',
title: 'Оценка земель',
link: ROUTES.OCENKA_ZEMLYA,
},
{
name: 'Оценка нежилого помещения',
title: 'Оценка нежилого помещения',
link: ROUTES.OCENKA_POMESCHENIE,
},
{
name: 'Оценка офиса',
title: 'Оценка офиса',
link: ROUTES.OCENKA_OFFICE,
},
{
name: 'Оценка сооружений',
title: 'Оценка сооружений',
link: ROUTES.OCENKA_SOORUZHENIE,
},
{
name: 'Оценка незавершенного строительства',
title: 'Оценка незавершенного строительства',
link: ROUTES.OCENKA_NEZAV_STROIT,
},
],
},
{
name: 'Имущество',
title: 'Имущество',
children: [
{
name: 'Оценка недвижимости',
title: 'Оценка недвижимости',
link: ROUTES.OCENKA_NEDVIGA,
},
{
name: 'Оценка машин и оборудования',
title: 'Оценка машин и оборудования',
link: ROUTES.OCENKA_MASHINES,
},
{
name: 'Оценка спецтехники',
title: 'Оценка спецтехники',
link: ROUTES.OCENKA_SPECTECHNIKA,
},
{
name: 'Оценка нематериальных активов',
title: 'Оценка нематериальных активов',
link: ROUTES.OCENKA_ACTIVES,
},
{
name: 'Оценка стоимости предприятия',
title: 'Оценка стоимости предприятия',
link: ROUTES.OCENKA_BUSINESS,
},
{
name: 'Оценка ценных бумаг',
title: 'Оценка ценных бумаг',
link: ROUTES.OCENKA_CENN_BUMAGI,
},
{
name: 'Экспертиза и рецензирование отчета об оценке',
title: 'Экспертиза и рецензирование отчета об оценке',
link: ROUTES.OCENKA_RECINSIA_OTCHETA,
},
],
},
{
name: 'Ипотека',
title: 'Ипотека',
children: [
{
name: 'Оценка для ипотеки в Сбербанке',
title: 'Оценка для ипотеки в Сбербанке',
link: ROUTES.OCENKA_IPOTEKA_SBER,
},
{
name: 'Оценка для ипотеки в банке ВТБ',
title: 'Оценка для ипотеки в банке ВТБ',
link: ROUTES.OCENKA_IPOTEKA_VTB,
},
],
},
{
name: 'Транспорт',
title: 'Транспорт',
children: [
{
name: 'Оценка ущерба в ДТП',
title: 'Оценка ущерба в ДТП',
link: ROUTES.OCENKA_DTP,
},
{
name: 'Оценка УТС – утраты товарной стоимости',
title: 'Оценка УТС – утраты товарной стоимости',
link: ROUTES.OCENKA_UTS,
},
{
name: 'Оценка рыночной стоимости автомобиля',
title: 'Оценка рыночной стоимости автомобиля',
link: ROUTES.OCENKA_RYNOCHNAYA,
},
{
name: 'Оценка автомобиля для суда',
title: 'Оценка автомобиля для суда',
link: ROUTES.OCENKA_AUTO_SUD,
},
{
name: 'Оценка мотоциклов и мототехники',
title: 'Оценка мотоциклов и мототехники',
link: ROUTES.OCENKA_MOTO,
},
{
name: 'Оценка морских и речных судов',
title: 'Оценка морских и речных судов',
link: ROUTES.OCENKA_PLAVSREDSTV,
},
{
name: 'Оценка воздушных судов и летательных аппаратов',
title: 'Оценка воздушных судов и летательных аппаратов',
link: ROUTES.OCENKA_VOZDUSHNYH_SUDOV,
},
],
@@ -269,66 +274,66 @@ export const baseMenu: TMenu = [
],
},
{
name: 'Юрист',
title: 'Юрист',
link: ROUTES.JURIST,
children: [
{
name: 'Решение споров',
title: 'Решение споров',
children: [
{
name: 'Страховые споры',
title: 'Страховые споры',
link: ROUTES.JURIST_STRAHOVKA,
},
{
name: 'Земельные и имущественные',
title: 'Земельные и имущественные',
link: ROUTES.JURIST_ZEMLYA_IMUSHESTVO,
},
{
name: 'Семейные и наследственные',
title: 'Семейные и наследственные',
link: ROUTES.JURIST_NASLEDSTVO,
},
{
name: 'Трудовые споры',
title: 'Трудовые споры',
link: ROUTES.JURIST_TRUD,
},
{
name: 'Споры по ДТП',
title: 'Споры по ДТП',
link: ROUTES.JURIST_DTP,
},
],
},
{
name: 'Сопровождение сделок',
title: 'Сопровождение сделок',
link: ROUTES.JURIST_SDELKI_DOGOVORA,
},
{
name: 'Представительство в суде',
title: 'Представительство в суде',
link: ROUTES.JURIST_PREDSTAVITELSTVO,
},
{
name: 'Банкротство физических лиц',
title: 'Банкротство физических лиц',
link: ROUTES.JURIST_BANKROTSTVO,
},
{
name: 'Взыскание задолженности',
title: 'Взыскание задолженности',
link: ROUTES.JURIST_DOLGI,
},
{
name: 'Помощь должникам',
title: 'Помощь должникам',
link: ROUTES.JURIST_DOLZHNIKAM,
},
{
name: 'Возврат страховки и комиссии банков',
title: 'Возврат страховки и комиссии банков',
link: ROUTES.JURIST_BANKI,
},
],
},
{
name: 'Эксперты',
title: 'Эксперты',
link: ROUTES.EXPERTS,
},
{
name: 'Контакты',
title: 'Контакты',
link: ROUTES.CONTACTS,
},
];

5
src/shared/types/menu.ts
View File

@@ -1,5 +0,0 @@
export type TMenu = {
name: string;
link?: string;
children?: TMenu;
}[];

1
src/shared/ui/burger/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './ui';

36
src/shared/ui/burger/styles.module.scss Normal file
View File

@@ -0,0 +1,36 @@
.Burger {
position: relative;
width: rem(32px);
height: rem(24px);
display: flex;
flex-direction: column;
justify-content: space-between;
background: none;
border: none;
padding: 0;
cursor: pointer;
z-index: 110;
span {
display: block;
height: rem(4px);
width: 100%;
background: #000000;
border-radius: 2px;
transition: 0.3s ease;
}
&_open {
span:nth-child(1) {
transform: translateY(10px) rotate(45deg);
}
span:nth-child(2) {
opacity: 0;
}
span:nth-child(3) {
transform: translateY(-10px) rotate(-45deg);
}
}
}

23
src/shared/ui/burger/ui.tsx Normal file
View File

@@ -0,0 +1,23 @@
import s from './styles.module.scss';
import clsx from 'clsx';
type BurgerProps = {
isOpen: boolean;
onToggle: (value: boolean) => void;
};
function Burger({ isOpen, onToggle }: BurgerProps) {
return (
<button
className={clsx(s.Burger, isOpen && s.Burger_open)}
onClick={() => onToggle(!isOpen)}
aria-label='Menu'
>
<span />
<span />
<span />
</button>
);
}
export { Burger };

34
src/shared/ui/icon/base.tsx
View File

@@ -310,6 +310,38 @@ const MapOutline = (props: SVGProps<SVGSVGElement>) => (
</svg>
);
//RiContactsBookLine
const MobileContact = (props: SVGProps<SVGSVGElement>) => (
<svg
xmlns='http://www.w3.org/2000/svg'
width={96}
height={96}
viewBox='0 0 24 24'
{...props}
>
<path
fill='currentColor'
d='M3 2h16.005C20.107 2 21 2.898 21 3.99v16.02c0 1.099-.893 1.99-1.995 1.99H3zm4 2H5v16h2zm2 16h10V4H9zm2-4a3 3 0 1 1 6 0zm3-4a2 2 0 1 1 0-4a2 2 0 0 1 0 4m8-6h2v4h-2zm0 6h2v4h-2z'
/>
</svg>
);
//lets-icons:phone-fill
const MobilePhone = (props: SVGProps<SVGSVGElement>) => (
<svg
xmlns='http://www.w3.org/2000/svg'
width={96}
height={96}
viewBox='0 0 24 24'
{...props}
>
<path
fill='currentColor'
d='m6.68 3.32l.613-.613a1 1 0 0 1 1.414 0l2.586 2.586a1 1 0 0 1 0 1.414L9.5 8.5a.98.98 0 0 0-.183 1.133a11.3 11.3 0 0 0 5.05 5.05a.98.98 0 0 0 1.133-.184l1.793-1.792a1 1 0 0 1 1.414 0l2.586 2.586a1 1 0 0 1 0 1.414l-.613.613a6 6 0 0 1-7.843.558l-1.208-.907a23 23 0 0 1-4.6-4.6l-.907-1.208A6 6 0 0 1 6.68 3.32'
/>
</svg>
);
export {
Map,
Envelope,
@@ -328,4 +360,6 @@ export {
MailBulk,
Consultation,
MapOutline,
MobileContact,
MobilePhone,
};

4
src/shared/ui/icon/ui.tsx
View File

@@ -20,6 +20,8 @@ import {
MailBulk,
Consultation,
MapOutline,
MobileContact,
MobilePhone,
} from './base';
import {
@@ -69,6 +71,8 @@ const Icons = Object.assign(
MailBulk,
Consultation,
MapOutline,
MobileContact,
MobilePhone,
},
{
GridBook,

1
src/shared/ui/index.ts
View File

@@ -5,3 +5,4 @@ export * from './modal';
export * from './text-area';
export * from './partners-slider';
export * from './icon';
export * from './burger';