f

src/pages/register-test/ui/RegisterTestPage.tsx

@@ -0,0 +1,155 @@
+import { useState } from 'react'
+import { FormField, PrimaryButton, Button } from '@shared/ui'
+import logo from '@shared/assets/logo-full-white.png'
+import styles from './RegisterTestPage.module.css'
+
+type AccountType = 'individual' | 'legal'
+type Step = 'info' | 'documents'
+
+const LEGAL_DOCUMENTS = [
+  'Свидетельство о государственной регистрации (ОГРН)',
+  'Свидетельство о постановке на учёт в налоговом органе (ИНН)',
+  'Устав организации (действующая редакция)',
+  'Решение/протокол о назначении руководителя',
+  'Документ, подтверждающий полномочия лица, открывающего счёт',
+  'Карточка с образцами подписей и оттиска печати',
+]
+
+export function RegisterTestPage() {
+  const [email, setEmail] = useState('')
+  const [password, setPassword] = useState('')
+  const [confirmPassword, setConfirmPassword] = useState('')
+  const [verificationCode, setVerificationCode] = useState('')
+
+  const [accountType, setAccountType] = useState<AccountType>('individual')
+  const [step, setStep] = useState<Step>('info')
+  const isLegal = accountType === 'legal'
+
+  // Тестовая страница — без проверок и запросов. «Создать» просто ведёт на шаг 2.
+  const handleInfoSubmit = (e: React.FormEvent) => {
+    e.preventDefault()
+    setStep('documents')
+  }
+
+  const handleDocumentsSubmit = (e: React.FormEvent) => {
+    e.preventDefault()
+    // Тестовая страница — отправки нет.
+  }
+
+  return (
+    <div className={styles.page}>
+      {step === 'info' ? (
+        <form className={styles.card} onSubmit={handleInfoSubmit}>
+          <div className={styles.logo}>
+            <img src={logo} alt="ЭКСА" />
+          </div>
+          <h1 className={styles.title}>Создать кошелёк ЭКСА</h1>
+
+          {/* Выбор типа регистрации — перед всеми полями */}
+          <div className={styles.typeSwitch} role="tablist" aria-label="Тип регистрации">
+            <button
+              type="button"
+              role="tab"
+              aria-selected={!isLegal}
+              className={`${styles.typeOption} ${!isLegal ? styles.typeOptionActive : ''}`}
+              onClick={() => setAccountType('individual')}
+            >
+              Физическое лицо
+            </button>
+            <button
+              type="button"
+              role="tab"
+              aria-selected={isLegal}
+              className={`${styles.typeOption} ${isLegal ? styles.typeOptionActive : ''}`}
+              onClick={() => setAccountType('legal')}
+            >
+              Юридическое лицо
+            </button>
+          </div>
+
+          <div className={styles.twoCol}>
+            <div className={styles.leftCol}>
+              <FormField
+                label={isLegal ? 'Введите корпоративный email' : 'Введите адрес электронной почты'}
+                type="email"
+                value={email}
+                onChange={setEmail}
+                placeholder={isLegal ? 'name@company.ru' : 'example@mail.ru'}
+              />
+              <FormField
+                label="Придумайте пароль"
+                type="password"
+                value={password}
+                onChange={setPassword}
+                placeholder="••••••••"
+              />
+              <FormField
+                label="Повторите пароль"
+                type="password"
+                value={confirmPassword}
+                onChange={setConfirmPassword}
+                placeholder="••••••••"
+              />
+            </div>
+
+            <div className={styles.rightCol}>
+              <Button variant="ghost" type="button">
+                Получить проверочный код
+              </Button>
+              <span className={styles.codeHint}>Код не пришёл</span>
+              <FormField
+                label="Ввести код"
+                type="text"
+                value={verificationCode}
+                onChange={setVerificationCode}
+                placeholder="000 000"
+              />
+            </div>
+          </div>
+
+          <div className={styles.submitWrapper}>
+            <PrimaryButton label="Создать" />
+          </div>
+
+          <p className={styles.legal}>
+            Нажимая «Создать», вы принимаете<br />
+            <a href="#">Пользовательское соглашение</a> и <a href="#">Политику конфиденциальности</a>
+          </p>
+        </form>
+      ) : (
+        /* Шаг 2: прикрепление документов (только юр. лицо) */
+        <form className={styles.card} onSubmit={handleDocumentsSubmit}>
+          <div className={styles.logo}>
+            <img src={logo} alt="ЭКСА" />
+          </div>
+
+          <button type="button" className={styles.backButton} onClick={() => setStep('info')}>
+            ← Назад к данным
+          </button>
+
+          <h1 className={styles.title}>Прикрепите документы</h1>
+          <p className={styles.documentsSubtitle}>
+            Для открытия счёта юридическому лицу прикрепите сканы или фотографии
+            следующих документов:
+          </p>
+
+          <ul className={styles.documentsList}>
+            {LEGAL_DOCUMENTS.map((doc) => (
+              <li key={doc} className={styles.documentItem}>
+                <span className={styles.documentName}>{doc}</span>
+                <label className={styles.attachButton}>
+                  Прикрепить
+                  <input type="file" className={styles.fileInput} multiple />
+                </label>
+              </li>
+            ))}
+          </ul>
+
+          <div className={styles.submitWrapper}>
+            <PrimaryButton label="Создать аккаунт" />
+          </div>
+        </form>
+      )}
+    </div>
+  )
+}