diff --git a/src/app/actions/auth.ts b/src/app/actions/auth.ts index 6d9c697..6d22583 100644 --- a/src/app/actions/auth.ts +++ b/src/app/actions/auth.ts @@ -135,7 +135,7 @@ export type FormState = { password: string; confirm_password: string; phone: string; - companyName: string; + companyName?: string; agree: string; }, mailConfirm?: boolean, @@ -146,6 +146,8 @@ export async function registration( state: FormState | undefined, formData: FormData, ): Promise { + const accountType = formData.get('accountType') as 'b2b' | 'b2c'; + const fullName = formData.get('fullName') as string || ''; const email = formData.get('email') as string || ''; const password = formData.get('password') as string || ''; @@ -154,7 +156,7 @@ export async function registration( const companyName = formData.get('companyName') as string || ''; const agree = formData.get('agree') as string || ''; - const SignupFormSchema = await getSignupFormSchema(); + const SignupFormSchema = await getSignupFormSchema(accountType); const dataToValidate = { fullName, @@ -163,7 +165,7 @@ export async function registration( password, confirm_password, agree, - companyName + ...(accountType === 'b2b' && { companyName }) }; const validatedFields = SignupFormSchema.safeParse(dataToValidate); @@ -188,8 +190,8 @@ export async function registration( password, confirm_password, phone, - companyName, - agree + agree, + ...(accountType === 'b2b' && { companyName }) }, error: errors }; @@ -207,7 +209,8 @@ export async function registration( email, phone: phone, password, - companyName: companyName, + accountType, + ...(accountType === 'b2b' && { companyName: companyName }) } }), headers: { @@ -222,7 +225,7 @@ export async function registration( message_body: { token: string }, message_code: string }; - console.log(parsed); + if (parsed.message_desc === 'Operation successful') { await createSession(parsed.message_body.token, email as string); } else { diff --git a/src/app/actions/definitions.ts b/src/app/actions/definitions.ts index c06b06a..6488098 100644 --- a/src/app/actions/definitions.ts +++ b/src/app/actions/definitions.ts @@ -38,27 +38,28 @@ const defaultConfig = validationConfig as ValidationConfig; let cachedSignupSchema: any = null; let schemaPromise: Promise | null = null; -async function loadConfigFromBackend(): Promise { +async function loadConfigFromBackend(accountType: 'b2b' | 'b2c'): Promise { try { const response = await fetch('/api/validation-config'); if (!response.ok) throw new Error('Failed to load config'); return await response.json(); } catch (error) { + //сейчас выполняем это пока бека нету console.error('Using default validation config:', error); return defaultConfig; } } -export async function getSignupFormSchema() { - console.log('get scheme'); +export async function getSignupFormSchema(accountType: 'b2b' | 'b2c') { if (cachedSignupSchema) { return cachedSignupSchema; } if (!schemaPromise) { schemaPromise = (async () => { - const config = await loadConfigFromBackend(); - cachedSignupSchema = createValidationSchema(config); + const config = await loadConfigFromBackend(accountType); + cachedSignupSchema = createValidationSchema(config, accountType); + return cachedSignupSchema; })(); } @@ -66,6 +67,7 @@ export async function getSignupFormSchema() { return await schemaPromise; } +// для валидации в реально времени на клиентской странице export const SignupFormSchema = createValidationSchema(defaultConfig); diff --git a/src/app/lib/validation-config-parser.ts b/src/app/lib/validation-config-parser.ts index 0051173..e6bcf97 100644 --- a/src/app/lib/validation-config-parser.ts +++ b/src/app/lib/validation-config-parser.ts @@ -19,7 +19,7 @@ interface ValidationConfig { /* const EMAIL_REGEX = /^([a-z0-9.\-_]+|[а-яё0-9.\-_]+)@(([a-z0-9.\-]+)\.([a-z]{2,})|([a-z0-9.\-]+)\.([а-яё]{2,})|([а-яё0-9.\-]+)\.([a-z]{2,})|([а-яё0-9.\-]+)\.([а-яё]{2,}))$/i; */ -export function createValidationSchema(config: ValidationConfig) { +export function createValidationSchema(config: ValidationConfig, accountType?: 'b2b' | 'b2c') { const schema: Record = {}; // fullName @@ -38,6 +38,22 @@ export function createValidationSchema(config: ValidationConfig) { .trim(); } + // fullName + if (config.companyName && accountType !== 'b2c') { + schema.companyName = z + .string() + .trim() + .min(config.companyName.minSize?.value || 1, { + error: config.companyName.minSize?.message || 'register-error-company-name-min' + }) + .max(config.companyName.maxSize?.value || 100, { + error: config.companyName.maxSize?.message || 'register-error-company-name-max' + }) + .regex(new RegExp(config.companyName.allowedSymbols?.value || '.*'), { + message: config.companyName.allowedSymbols?.message || 'register-error-company-name-not-allowed-symbols' + }); + } + // email if (config.email) { let emailSchema = z @@ -147,8 +163,8 @@ export function createValidationSchema(config: ValidationConfig) { schema.password = passwordSchema; } - // companyName (опциональное поле) - if (config.companyName) { + // companyName (опциональное поле), надо будет удалить потом + /* if (config.companyName) { let companySchema = z.string(); // Если поле опциональное, добавляем .optional().nullable() @@ -214,7 +230,7 @@ export function createValidationSchema(config: ValidationConfig) { companySchema = companySchema.transform((val) => val?.trim() || '') as unknown as z.ZodString; schema.companyName = companySchema; - } + } */ // Дополнительные поля для формы регистрации schema.confirm_password = z.string(); diff --git a/src/app/lib/validation-config.json b/src/app/lib/validation-config.json index b4620de..816625b 100644 --- a/src/app/lib/validation-config.json +++ b/src/app/lib/validation-config.json @@ -70,7 +70,7 @@ "message": "register-error-company-name-min" }, "allowedSymbols": { - "value": "^[a-zA-Zа-яА-ЯёЁ0-9\\s\\-&.,'\"()]+$", + "value": "^[a-zA-Zа-яА-ЯёЁ0-9\\s\\-&.,'\"()]*$", "message": "register-error-company-name-not-allowed-symbols" } }, diff --git a/src/app/styles/module/login.module.scss b/src/app/styles/module/login.module.scss index 0f62492..5b70ea0 100644 --- a/src/app/styles/module/login.module.scss +++ b/src/app/styles/module/login.module.scss @@ -41,8 +41,35 @@ .form-group { margin-bottom: 18px; +} - &-confrim-window { +.form-switcher { + display: flex; + justify-content: center; + gap: 10px; + margin-bottom: 10px; + + &-button { + padding: 5px 15px; + background: linear-gradient(135deg, #6366f1, #8b5cf6); + color: white; + border: none; + border-radius: 10px; + transition: all 0.3s; + opacity: 0.6; + cursor: pointer; + + &.active { + opacity: 1; + } + + &:disabled { + opacity: 0.5; + } + + &:hover:not(:disabled) { + transform: translateY(-2px); + } } } @@ -74,6 +101,10 @@ transition: all 0.3s; background: #f9fafb; + &-hidden { + display: none; + } + &[type="password"]::-ms-reveal { display: none; } @@ -140,6 +171,14 @@ transition: all 0.3s; margin-bottom: 18px; margin: 20px 0 0 0; + + &:disabled { + opacity: 0.5; + } + + &:hover:not(:disabled) { + transform: translateY(-2px); + } } .form-group-confrim-window { diff --git a/src/app/ui/forms/register-form.tsx b/src/app/ui/forms/register-form.tsx index ca9c6ce..b818b42 100644 --- a/src/app/ui/forms/register-form.tsx +++ b/src/app/ui/forms/register-form.tsx @@ -27,6 +27,7 @@ export default function RegisterForm() { const [formState, setFormState] = useState(undefined); const [showMailConfirmWindow, setShowMailConfirmWindow] = useState(false); const passwordRef = useRef(null); + const [accountType, setAccountType] = useState<'b2c' | 'b2b'>('b2c'); useEffect(() => { setFormState(state); @@ -83,6 +84,9 @@ export default function RegisterForm() { if (fieldName === 'phone') { return schema.safeParse(value.replace(/[-\(\)\s]/g, '')); } + if (fieldName === 'companyName' && accountType === 'b2c') { + return { success: true, data: value }; + } return schema.safeParse(value); default: @@ -113,6 +117,24 @@ export default function RegisterForm() { } } + function switchRegistrationTypeHandler(e: React.MouseEvent, type: 'b2c' | 'b2b') { + e.preventDefault(); + setAccountType(type); + if (formState && type === 'b2c') { + setFormState({ + ...formState, + previousState: { + ...formState.previousState, + companyName: '' + }, + error: { + ...formState.error, + companyName: '' + } + }); + } + } + return ( <> {showMailConfirmWindow && ( @@ -163,6 +185,32 @@ export default function RegisterForm() {
{ formAction(e); }}> +
+ + + +
+