frontdev/no-copy-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

NCFRONT-81 #5

Merged
frontdev merged 4 commits from NCFRONT-81 into main 2026-01-29 22:34:35 +08:00
Conversation 0 Commits 4 Files Changed 8
+163 -51
8 changed files with 163 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/actions/auth.ts
+10 -7
View File
@@ -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<FormState> {
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 {
src/app/actions/definitions.ts
+7 -5
View File
@@ -38,27 +38,28 @@ const defaultConfig = validationConfig as ValidationConfig;
let cachedSignupSchema: any = null;
let schemaPromise: Promise<any> | null = null;
async function loadConfigFromBackend(): Promise<any> {
async function loadConfigFromBackend(accountType: 'b2b' | 'b2c'): Promise<any> {
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);
src/app/lib/validation-config-parser.ts
+20 -4
View File
@@ -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<string, any> = {};
// 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();
src/app/lib/validation-config.json
+1 -1
View File
@@ -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"
}
},
src/app/styles/module/login.module.scss
+40 -1
View File
@@ -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 {
src/app/ui/forms/register-form.tsx
+81 -31
View File
@@ -27,6 +27,7 @@ export default function RegisterForm() {
const [formState, setFormState] = useState<FormState | undefined>(undefined);
const [showMailConfirmWindow, setShowMailConfirmWindow] = useState(false);
const passwordRef = useRef<HTMLInputElement>(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<HTMLButtonElement>, 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() {
<form action={(e) => {
formAction(e);
}}>
<div className={`${styles['form-switcher']}`}>
<button
className={`${styles['form-switcher-button']} ${accountType === 'b2c' ? styles['active'] : ''}`}
onClick={(e) => {
switchRegistrationTypeHandler(e, 'b2c');
}}
>
{t('personal')}
</button>
<button
className={`${styles['form-switcher-button']} ${accountType === 'b2b' ? styles['active'] : ''}`}
onClick={(e) => {
switchRegistrationTypeHandler(e, 'b2b');
}}
>
{t('company')}
</button>
<input
type="hiden"
id="accountType"
name="accountType"
className={`${styles['form-input-hidden']}`}
defaultValue={accountType}
/>
</div>
<div className={`${styles['form-group']}`}>
<label
className={`${styles['form-label']} ${styles['required']}`}
@@ -194,6 +242,39 @@ export default function RegisterForm() {
)}
</div>
{accountType === 'b2b' && (
<div className={`${styles['form-group']}`}>
<label
className={`${styles['form-label']} ${styles['required']}`}
>
{t('company')}
</label>
<input
type="text"
id="companyName"
name="companyName"
className={`${styles['form-input']}`}
placeholder={t('company-placeholder')}
defaultValue={formState?.previousState?.companyName ? formState?.previousState?.companyName : ''}
onChange={onChangeHandler}
/>
{formState?.error?.companyName && (
<p className="text-sm text-red-500">
{
formState?.error?.companyName.split('&').map((e, index) => {
return (
<span key={index}>
{t(e)}
<br />
</span>
)
})
}
</p>
)}
</div>
)}
<div className={`${styles['form-group']}`}>
<label className={`${styles['form-label']} ${styles['required']}`}>
{t('email-adress')}
@@ -246,37 +327,6 @@ export default function RegisterForm() {
)}
</div>
<div className={`${styles['form-group']}`}>
<label
className={`${styles['form-label']}`}
>
{t('company')}
</label>
<input
type="text"
id="companyName"
name="companyName"
className={`${styles['form-input']}`}
placeholder={t('company-placeholder')}
defaultValue={formState?.previousState?.companyName ? formState?.previousState?.companyName : ''}
onChange={onChangeHandler}
/>
{formState?.error?.companyName && (
<p className="text-sm text-red-500">
{
formState?.error?.companyName.split('&').map((e, index) => {
return (
<span key={index}>
{t(e)}
<br />
</span>
)
})
}
</p>
)}
</div>
<div className={`${styles['form-group']}`}>
<label className={`${styles['form-label']} ${styles['required']}`}>
{t('password')}
src/i18n/messages/en.json
+2 -1
View File
@@ -271,6 +271,7 @@
"register-error-phone-not-allowed-symbols": "",
"register-error-password-not-allowed-symbols": "Password contains invalid characters.",
"confirmation-code": "Confirmation code",
"enter-confirmation-code": "Enter the confirmation code"
"enter-confirmation-code": "Enter the confirmation code",
"personal": "Personal"
}
}
src/i18n/messages/ru.json
+2 -1
View File
@@ -271,6 +271,7 @@
"register-error-phone-not-allowed-symbols": "",
"register-error-password-not-allowed-symbols": "Пароль содержит недопустимые символы.",
"confirmation-code": "Код подтверждения",
"enter-confirmation-code": "Введите код подтверждения"
"enter-confirmation-code": "Введите код подтверждения",
"personal": "Личный"
}
}