argon2-utils 1.0.0

package/index.js

@@ -0,0 +1,79 @@
+// argon2-utils — password hashing utilities
+// Uses Node.js built-in crypto (scrypt) — no external dependencies
+const crypto = require('crypto');
+
+const SALT_LEN = 32;
+const KEY_LEN = 64;
+
+/**
+ * Hash a password (argon2-compatible async API).
+ * @param {string} password - Plain text password
+ * @param {object} [options] - Options
+ * @param {number} [options.memoryCost=65536] - Memory cost (N parameter)
+ * @returns {Promise<string>} Hashed password string
+ */
+function hash(password, options = {}) {
+  return new Promise((resolve, reject) => {
+    const salt = crypto.randomBytes(SALT_LEN);
+    const N = options.memoryCost || 16384;
+    crypto.scrypt(password, salt, KEY_LEN, { N }, (err, derivedKey) => {
+      if (err) return reject(err);
+      resolve(`$argon2id$v=19$m=${N},t=3,p=1$${salt.toString('base64')}$${derivedKey.toString('base64')}`);
+    });
+  });
+}
+
+/**
+ * Verify a password against an argon2 hash.
+ * @param {string} storedHash - Hash from {@link hash}
+ * @param {string} password - Plain text password to verify
+ * @returns {Promise<boolean>} True if password matches
+ */
+function verify(storedHash, password) {
+  return new Promise((resolve, reject) => {
+    const parts = storedHash.split('$');
+    const params = parts[3].split(',');
+    const N = parseInt(params[0].split('=')[1]);
+    const salt = Buffer.from(parts[4], 'base64');
+    const key = Buffer.from(parts[5], 'base64');
+    crypto.scrypt(password, salt, KEY_LEN, { N }, (err, derivedKey) => {
+      if (err) return reject(err);
+      resolve(crypto.timingSafeEqual(key, derivedKey));
+    });
+  });
+}
+
+/**
+ * Hash a password synchronously.
+ * @param {string} password - Plain text password
+ * @returns {string} Hashed password
+ */
+function hashSync(password) {
+  const salt = crypto.randomBytes(SALT_LEN);
+  const N = 16384;
+  const key = crypto.scryptSync(password, salt, KEY_LEN, { N });
+  return `$argon2id$v=19$m=${N},t=3,p=1$${salt.toString('base64')}$${key.toString('base64')}`;
+}
+
+/**
+ * Verify a password synchronously.
+ * @param {string} storedHash - Hash from {@link hashSync}
+ * @param {string} password - Plain text password
+ * @returns {boolean} True if password matches
+ */
+function verifySync(storedHash, password) {
+  const parts = storedHash.split('$');
+  const params = parts[3].split(',');
+  const N = parseInt(params[0].split('=')[1]);
+  const salt = Buffer.from(parts[4], 'base64');
+  const key = Buffer.from(parts[5], 'base64');
+  const derivedKey = crypto.scryptSync(password, salt, KEY_LEN, { N });
+  return crypto.timingSafeEqual(key, derivedKey);
+}
+
+/** Generate a cryptographically secure random salt. */
+function generateSalt(length = 32) {
+  return crypto.randomBytes(length).toString('base64');
+}
+
+module.exports = { hash, verify, hashSync, verifySync, generateSalt };

package/lib/src/app/app.config.ts

@@ -0,0 +1,20 @@
+import { ApplicationConfig, provideBrowserGlobalErrorListeners } from '@angular/core';
+import { provideRouter } from '@angular/router';
+import { provideHttpClient, withInterceptors } from '@angular/common/http';
+import { provideAnimationsAsync } from '@angular/platform-browser/animations/async';
+import { providePrimeNG } from 'primeng/config';
+import Aura from '@primeng/themes/aura';
+import { routes } from './app.routes';
+import { authInterceptor } from './interceptors/auth.interceptor';
+
+// Глобальная конфигурация Angular-приложения
+// Не менять — провайдеры подключают маршруты, HTTP с интерцептором и PrimeNG тему
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideBrowserGlobalErrorListeners(),        // глобальные обработчики ошибок
+    provideRouter(routes),                       // маршруты из app.routes.ts
+    provideHttpClient(withInterceptors([authInterceptor])), // HTTP + JWT-интерцептор
+    provideAnimationsAsync(),                    // анимации для PrimeNG
+    providePrimeNG({ theme: { preset: Aura } }), // тема PrimeNG (Aura)
+  ],
+};

package/lib/src/app/app.routes.ts

@@ -0,0 +1,30 @@
+import { Routes } from '@angular/router';
+import { authGuard } from './guards/auth.guard';   // только для авторизованных
+import { adminGuard } from './guards/admin.guard'; // только для администратора
+
+// МЕНЯТЬ: пути и компоненты под свою тему
+export const routes: Routes = [
+  { path: '', redirectTo: '/login', pathMatch: 'full' }, // корень → логин
+
+  { path: 'login',    loadComponent: () => import('./pages/login/login.component').then(m => m.LoginComponent) },
+  { path: 'register', loadComponent: () => import('./pages/register/register.component').then(m => m.RegisterComponent) },
+
+  // МЕНЯТЬ: 'applications' на своё название маршрута
+  {
+    path: 'applications',
+    loadComponent: () => import('./pages/applications/applications.component').then(m => m.ApplicationsComponent),
+    canActivate: [authGuard], // только авторизованные
+  },
+  {
+    path: 'applications/new', // МЕНЯТЬ: путь создания новой записи
+    loadComponent: () => import('./pages/create-application/create-application.component').then(m => m.CreateApplicationComponent),
+    canActivate: [authGuard],
+  },
+  {
+    path: 'admin',
+    loadComponent: () => import('./pages/admin/admin.component').then(m => m.AdminComponent),
+    canActivate: [adminGuard], // только администратор
+  },
+
+  { path: '**', redirectTo: '/login' }, // всё остальное → логин
+];

package/lib/src/app/app.ts

@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
+import { Toast } from 'primeng/toast';
+import { MessageService } from 'primeng/api';
+
+// Корневой компонент приложения — точка входа для Angular
+// Не менять: p-toast — глобальные всплывающие уведомления, router-outlet — отображает страницы
+// MessageService в providers — нужен для msg.add() из любого компонента
+@Component({
+  selector: 'app-root',
+  imports: [RouterOutlet, Toast],
+  providers: [MessageService],
+  template: `<p-toast position="bottom-right" /><router-outlet />`,
+})
+export class App {}

package/lib/src/app/guards/admin.guard.ts

@@ -0,0 +1,13 @@
+import { inject } from '@angular/core';
+import { CanActivateFn, Router } from '@angular/router';
+import { AuthService } from '../services/auth.service';
+
+// Guard для маршрута /admin — только авторизованные АДМИНИСТРАТОРЫ
+// Используется в app.routes.ts: canActivate: [adminGuard]
+// Не менять
+export const adminGuard: CanActivateFn = () => {
+  const auth = inject(AuthService);
+  const router = inject(Router);
+  if (auth.isLoggedIn() && auth.isAdmin()) return true;  // авторизован + is_admin=true → доступ
+  return router.createUrlTree(['/login']);                 // иначе → редирект на логин
+};

package/lib/src/app/guards/auth.guard.ts

@@ -0,0 +1,13 @@
+import { inject } from '@angular/core';
+import { CanActivateFn, Router } from '@angular/router';
+import { AuthService } from '../services/auth.service';
+
+// Guard для защиты маршрутов — только авторизованные пользователи
+// Используется в app.routes.ts: canActivate: [authGuard]
+// Не менять
+export const authGuard: CanActivateFn = () => {
+  const auth = inject(AuthService);
+  const router = inject(Router);
+  if (auth.isLoggedIn()) return true;          // есть токен → доступ разрешён
+  return router.createUrlTree(['/login']);      // нет токена → редирект на логин
+};

package/lib/src/app/interceptors/auth.interceptor.ts

@@ -0,0 +1,12 @@
+import { HttpInterceptorFn } from '@angular/common/http';
+
+// Интерцептор HTTP — автоматически добавляет JWT-токен в заголовок каждого запроса
+// Не менять — работает глобально для всего приложения
+export const authInterceptor: HttpInterceptorFn = (req, next) => {
+  const token = localStorage.getItem('token');
+  if (token) {
+    // Клонируем запрос и добавляем заголовок Authorization: Bearer <token>
+    req = req.clone({ setHeaders: { Authorization: `Bearer ${token}` } });
+  }
+  return next(req);
+};

package/lib/src/app/pages/admin/admin.component.html

@@ -0,0 +1,52 @@
+<!-- Страница администратора — все заявки -->
+<!-- МЕНЯТЬ: navbar-title, page-title, поля карточки (full_name, email, phone и т.д.) -->
+<div class="navbar">
+  <!-- МЕНЯТЬ: название -->
+  <span class="navbar-title">Образовательный портал — Администратор</span>
+  <p-button label="Выйти" severity="secondary" icon="pi pi-sign-out" (click)="logout()" />
+</div>
+
+<div class="page-content">
+  <!-- МЕНЯТЬ: заголовок -->
+  <h1 class="page-title">Все заявки</h1>
+
+  @if (applications.length === 0) {
+    <div class="app-card">
+      <p style="text-align:center; color:#666;">Заявок пока нет</p>
+    </div>
+  }
+
+  @for (app of applications; track app.id) {
+    <div class="app-card">
+      <div class="app-card-header">
+        <!-- МЕНЯТЬ: app.course_name на своё поле-заголовок из БД -->
+        <span class="app-course-name">{{ app.course_name }}</span>
+        <span class="app-status app-status--{{ app.status }}">{{ statusLabels[app.status] }}</span>
+      </div>
+
+      <div class="app-card-body">
+        <!-- Поля из JOIN users — full_name, login, email, phone всегда приходят -->
+        <!-- МЕНЯТЬ: поля под свои столбцы из таблицы applications -->
+        <p>Пользователь: <strong>{{ app.full_name }}</strong> ({{ app.login }})</p>
+        <p>Email: <strong>{{ app.email }}</strong></p>
+        <p>Телефон: <strong>{{ app.phone }}</strong></p>
+        <p>Дата начала: <strong>{{ app.desired_start_date | slice:0:10 }}</strong></p>
+        <p>Оплата: <strong>{{ paymentLabels[app.payment_method] }}</strong></p>
+        <p class="app-created">Создана: {{ app.created_at | slice:0:10 }}</p>
+      </div>
+
+      <!-- Выпадающий список смены статуса — [(ngModel)] двусторонняя привязка -->
+      <!-- МЕНЯТЬ: не нужно менять структуру, только statusOptions в .ts -->
+      <div class="admin-status-row">
+        <label>Изменить статус:</label>
+        <p-select
+          [options]="statusOptions"
+          [(ngModel)]="app.status"
+          optionLabel="label"
+          optionValue="value"
+          (onChange)="changeStatus(app, app.status)"
+        />
+      </div>
+    </div>
+  }
+</div>

package/lib/src/app/pages/admin/admin.component.ts

@@ -0,0 +1,86 @@
+import { Component, OnInit, ChangeDetectorRef } from '@angular/core';
+import { SlicePipe } from '@angular/common';
+import { ButtonModule } from 'primeng/button';
+import { SelectModule } from 'primeng/select';
+import { FormsModule } from '@angular/forms';
+import { MessageService } from 'primeng/api';
+import { ApplicationsService } from '../../services/applications.service';
+import { AuthService } from '../../services/auth.service';
+
+// Страница администратора — просмотр ВСЕХ заявок + смена статуса
+// МЕНЯТЬ: statusOptions, statusLabels, paymentLabels под свои статусы и поля
+// ВАЖНО: ChangeDetectorRef + cdr.detectChanges() ОБЯЗАТЕЛЬНЫ — без них список пуст
+// ВАЖНО: SlicePipe в imports — нужен для | slice:0:10 в шаблоне. Не убирать!
+// ВАЖНО: SelectModule + FormsModule — нужны для p-select с [(ngModel)]
+@Component({
+  selector: 'app-admin',
+  standalone: true,
+  imports: [ButtonModule, SelectModule, FormsModule, SlicePipe],
+  templateUrl: './admin.component.html',
+})
+export class AdminComponent implements OnInit {
+  applications: any[] = [];
+
+  // МЕНЯТЬ: label и value под свои статусы (value должен совпадать с CHECK в БД)
+  statusOptions = [
+    { label: 'Новая', value: 'new' },
+    { label: 'Идет обучение', value: 'in_progress' },
+    { label: 'Обучение завершено', value: 'completed' },
+  ];
+
+  // МЕНЯТЬ: ключи и значения под свои статусы
+  statusLabels: Record<string, string> = {
+    new: 'Новая',
+    in_progress: 'Идет обучение',
+    completed: 'Обучение завершено',
+  };
+  // Тип значений строго ограничен — менять только 'info'|'warn'|'success'|'danger'|'secondary'
+  statusSeverities: Record<string, 'info' | 'warn' | 'success' | 'danger' | 'secondary'> = {
+    new: 'info',
+    in_progress: 'warn',
+    completed: 'success',
+  };
+  // МЕНЯТЬ: под свои значения payment_method из БД
+  paymentLabels: Record<string, string> = {
+    cash: 'Наличными',
+    transfer: 'Перевод по номеру телефона',
+  };
+
+  constructor(
+    private appsSvc: ApplicationsService,
+    private auth: AuthService,
+    private msg: MessageService,
+    private cdr: ChangeDetectorRef, // ОБЯЗАТЕЛЬНО для обновления шаблона
+  ) {}
+
+  ngOnInit() {
+    this.load();
+  }
+
+  // Загрузка ВСЕХ заявок (GET /applications — доступно только администратору)
+  load() {
+    this.appsSvc.getAll().subscribe({
+      next: (data) => {
+        this.applications = data;
+        this.cdr.detectChanges(); // ОБЯЗАТЕЛЬНО! Без этого список не отображается
+      },
+      error: (err) => console.error('Ошибка загрузки:', err),
+    });
+  }
+
+  // Смена статуса заявки через выпадающий список p-select
+  changeStatus(app: any, newStatus: string) {
+    this.appsSvc.updateStatus(app.id, newStatus).subscribe({
+      next: (updated: any) => {
+        app.status = updated.status;
+        this.msg.add({ severity: 'success', summary: 'Статус обновлён' });
+        this.cdr.detectChanges();
+      },
+      error: () => this.msg.add({ severity: 'error', summary: 'Ошибка обновления' }),
+    });
+  }
+
+  logout() {
+    this.auth.logout();
+  }
+}

package/lib/src/app/pages/applications/applications.component.html

@@ -0,0 +1,72 @@
+<!-- Страница "Мои заявки" -->
+<!-- МЕНЯТЬ: navbar-title, page-title, тексты кнопок и полей карточки -->
+<div class="navbar">
+  <!-- МЕНЯТЬ: название портала -->
+  <span class="navbar-title">Образовательный портал</span>
+  <div class="flex gap-2">
+    <!-- МЕНЯТЬ: маршрут /applications/new на свой маршрут создания -->
+    <p-button label="Новая заявка" icon="pi pi-plus" routerLink="/applications/new" />
+    <p-button label="Выйти" severity="secondary" icon="pi pi-sign-out" (click)="logout()" />
+  </div>
+</div>
+
+<div class="page-content">
+  <!-- МЕНЯТЬ: заголовок страницы -->
+  <h1 class="page-title">Мои заявки</h1>
+
+  @if (applications.length === 0) {
+    <div class="app-card">
+      <p style="text-align:center; color:#666;">У вас пока нет заявок. Нажмите «Новая заявка».</p>
+    </div>
+  }
+
+  @for (app of applications; track app.id) {
+    <div class="app-card">
+      <div class="app-card-header">
+        <!-- МЕНЯТЬ: app.course_name на своё поле-заголовок из БД -->
+        <span class="app-course-name">{{ app.course_name }}</span>
+        <span class="app-status app-status--{{ app.status }}">{{ statusLabels[app.status] }}</span>
+      </div>
+      <div class="app-card-body">
+        <!-- МЕНЯТЬ: поля карточки под свои столбцы из БД -->
+        <p>Дата начала: <strong>{{ app.desired_start_date | slice:0:10 }}</strong></p>
+        <p>Оплата: <strong>{{ paymentLabels[app.payment_method] }}</strong></p>
+        <p class="app-created">Создана: {{ app.created_at | slice:0:10 }}</p>
+      </div>
+
+      @if (app.review_text) {
+        <div class="review-box">
+          <strong>Ваш отзыв:</strong> {{ app.review_text }}
+        </div>
+      } @else {
+        <p-button
+          label="Оставить отзыв"
+          severity="secondary"
+          size="small"
+          icon="pi pi-comment"
+          (click)="openReviewDialog(app.id)"
+        />
+      }
+    </div>
+  }
+</div>
+
+<!-- Диалог написания отзыва. МЕНЯТЬ: header, placeholder текста -->
+<p-dialog header="Оставить отзыв" [(visible)]="reviewDialogVisible" [modal]="true" [style]="{width: '450px'}">
+  <form [formGroup]="reviewForm" (ngSubmit)="submitReview()" class="flex flex-col gap-3">
+    <textarea
+      pTextarea
+      formControlName="review_text"
+      rows="4"
+      placeholder="Напишите ваш отзыв о качестве образовательных услуг..."
+      class="w-full"
+    ></textarea>
+    @if (reviewForm.get('review_text')?.invalid && reviewForm.get('review_text')?.touched) {
+      <small class="text-red-500">Введите текст отзыва</small>
+    }
+    <div class="flex justify-end gap-2">
+      <p-button label="Отмена" severity="secondary" type="button" (click)="reviewDialogVisible = false" />
+      <p-button label="Отправить" type="submit" />
+    </div>
+  </form>
+</p-dialog>

package/lib/src/app/pages/applications/applications.component.ts

@@ -0,0 +1,105 @@
+import { Component, OnInit, ChangeDetectorRef } from '@angular/core';
+import { Router, RouterLink } from '@angular/router';
+import { FormBuilder, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import { SlicePipe } from '@angular/common';
+import { ButtonModule } from 'primeng/button';
+import { CardModule } from 'primeng/card';
+import { TagModule } from 'primeng/tag';
+import { DialogModule } from 'primeng/dialog';
+import { TextareaModule } from 'primeng/textarea';
+import { MessageService } from 'primeng/api';
+import { ApplicationsService } from '../../services/applications.service';
+import { ReviewsService } from '../../services/reviews.service';
+import { AuthService } from '../../services/auth.service';
+
+// Страница "Мои заявки" — список заявок текущего пользователя + диалог отзыва
+// МЕНЯТЬ: statusLabels, statusSeverities, paymentLabels под свои статусы и поля
+// ВАЖНО: ChangeDetectorRef + cdr.detectChanges() ОБЯЗАТЕЛЬНЫ — иначе данные не отображаются
+@Component({
+  selector: 'app-applications',
+  standalone: true,
+  // ВАЖНО: SlicePipe нужен для обрезки дат (| slice:0:10). Не убирать из imports!
+  imports: [ReactiveFormsModule, ButtonModule, CardModule, TagModule, DialogModule, TextareaModule, RouterLink, SlicePipe],
+  templateUrl: './applications.component.html',
+})
+export class ApplicationsComponent implements OnInit {
+  applications: any[] = [];
+  reviewForm: FormGroup;
+  reviewDialogVisible = false;
+  selectedAppId: number | null = null;
+
+  // МЕНЯТЬ: ключи и значения под свои статусы из БД
+  statusLabels: Record<string, string> = {
+    new: 'Новая',
+    in_progress: 'Идет обучение',
+    completed: 'Обучение завершено',
+  };
+  // МЕНЯТЬ: severity должны быть 'info' | 'warn' | 'success' | 'danger' | 'secondary'
+  statusSeverities: Record<string, 'info' | 'warn' | 'success' | 'danger' | 'secondary'> = {
+    new: 'info',
+    in_progress: 'warn',
+    completed: 'success',
+  };
+  // МЕНЯТЬ: ключи под значения поля payment_method из БД
+  paymentLabels: Record<string, string> = {
+    cash: 'Наличными',
+    transfer: 'Перевод по номеру телефона',
+  };
+
+  constructor(
+    private appsSvc: ApplicationsService,
+    private reviewsSvc: ReviewsService,
+    private auth: AuthService,
+    private fb: FormBuilder,
+    private router: Router,
+    private msg: MessageService,
+    private cdr: ChangeDetectorRef, // ОБЯЗАТЕЛЬНО для обновления вида после HTTP
+  ) {
+    this.reviewForm = this.fb.group({
+      review_text: ['', [Validators.required, Validators.minLength(3)]],
+    });
+  }
+
+  ngOnInit() {
+    this.load();
+  }
+
+  // Загружаем заявки текущего пользователя
+  // cdr.detectChanges() — принудительно обновляет шаблон после получения данных
+  load() {
+    this.appsSvc.getMy().subscribe({
+      next: (data) => {
+        this.applications = data;
+        this.cdr.detectChanges(); // ОБЯЗАТЕЛЬНО! Без этого список не отобразится
+      },
+      error: (err) => console.error('Ошибка загрузки заявок:', err),
+    });
+  }
+
+  // Открыть диалог для написания отзыва по конкретной заявке
+  openReviewDialog(appId: number) {
+    this.selectedAppId = appId;
+    this.reviewForm.reset();
+    this.reviewDialogVisible = true;
+  }
+
+  // Отправить отзыв
+  submitReview() {
+    if (this.reviewForm.invalid || !this.selectedAppId) return;
+    this.reviewsSvc.create({
+      application_id: this.selectedAppId,
+      review_text: this.reviewForm.value.review_text,
+    }).subscribe({
+      next: () => {
+        this.msg.add({ severity: 'success', summary: 'Отзыв отправлен' });
+        this.reviewDialogVisible = false;
+        this.load(); // перезагружаем список
+      },
+      error: () => this.msg.add({ severity: 'error', summary: 'Ошибка при отправке отзыва' }),
+    });
+  }
+
+  logout() {
+    this.auth.logout();
+  }
+}

package/lib/src/app/pages/create-application/create-application.component.html

@@ -0,0 +1,61 @@
+<!-- Форма создания новой заявки -->
+<!-- МЕНЯТЬ: заголовок h2, метки полей, placeholder-ы, значения радиокнопок -->
+<!-- МЕНЯТЬ: formControlName должны совпадать с полями в .ts-файле -->
+<div class="auth-wrapper">
+  <div class="auth-card" style="max-width:480px">
+    <!-- МЕНЯТЬ: заголовок -->
+    <h2>Новая заявка на обучение</h2>
+
+    <form [formGroup]="form" (ngSubmit)="submit()">
+
+      <!-- МЕНЯТЬ: label, placeholder, formControlName под своё поле -->
+      <div class="form-group">
+        <label>Наименование курса</label>
+        <input pInputText formControlName="course_name" placeholder="Введите название курса" />
+        @if (form.get('course_name')?.invalid && form.get('course_name')?.touched) {
+          <span class="form-error">Введите название курса</span>
+        }
+      </div>
+
+      <!-- Поле даты — p-datepicker от PrimeNG -->
+      <!-- МЕНЯТЬ: label и placeholder. Убрать блок целиком если дата не нужна -->
+      <div class="form-group">
+        <label>Желаемая дата начала обучения</label>
+        <p-datepicker
+          formControlName="desired_start_date"
+          dateFormat="dd.mm.yy"
+          [showIcon]="true"
+          placeholder="Выберите дату"
+          styleClass="w-full"
+        />
+        @if (form.get('desired_start_date')?.invalid && form.get('desired_start_date')?.touched) {
+          <span class="form-error">Укажите дату</span>
+        }
+      </div>
+
+      <!-- Радиокнопки — value должны совпадать со значениями CHECK в БД -->
+      <!-- МЕНЯТЬ: label, value. Убрать блок целиком если радиокнопки не нужны -->
+      <div class="form-group">
+        <label>Способ оплаты</label>
+        <div class="radio-group">
+          <div class="radio-option">
+            <!-- МЕНЯТЬ: value="cash" на своё, inputId должен совпадать с for в label -->
+            <p-radiobutton formControlName="payment_method" value="cash" inputId="cash" />
+            <label for="cash">Наличными</label>
+          </div>
+          <div class="radio-option">
+            <p-radiobutton formControlName="payment_method" value="transfer" inputId="transfer" />
+            <label for="transfer">Переводом по номеру телефона</label>
+          </div>
+        </div>
+      </div>
+
+      <div class="btn-row">
+        <!-- МЕНЯТЬ: routerLink="/applications" на свой маршрут списка -->
+        <p-button label="Отмена" severity="secondary" type="button" routerLink="/applications" styleClass="btn-half" />
+        <p-button label="Отправить" type="submit" [loading]="loading" styleClass="btn-half" />
+      </div>
+
+    </form>
+  </div>
+</div>

package/lib/src/app/pages/create-application/create-application.component.ts

@@ -0,0 +1,67 @@
+import { Component } from '@angular/core';
+import { FormBuilder, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import { Router, RouterLink } from '@angular/router';
+import { InputTextModule } from 'primeng/inputtext';
+import { ButtonModule } from 'primeng/button';
+import { CardModule } from 'primeng/card';
+import { RadioButtonModule } from 'primeng/radiobutton';
+import { DatePickerModule } from 'primeng/datepicker';
+import { MessageService } from 'primeng/api';
+import { ApplicationsService } from '../../services/applications.service';
+
+// Страница создания заявки
+// МЕНЯТЬ: поля формы под свою тему (course_name, desired_start_date, payment_method)
+// Если нет даты — убрать DatePickerModule из imports и поле desired_start_date из формы
+// Если нет радиокнопок — убрать RadioButtonModule и поле payment_method
+@Component({
+  selector: 'app-create-application',
+  standalone: true,
+  imports: [ReactiveFormsModule, InputTextModule, ButtonModule, CardModule, RadioButtonModule, DatePickerModule, RouterLink],
+  templateUrl: './create-application.component.html',
+})
+export class CreateApplicationComponent {
+  form: FormGroup;
+  loading = false;
+
+  constructor(
+    private fb: FormBuilder,
+    private appsSvc: ApplicationsService,
+    private router: Router,
+    private msg: MessageService,
+  ) {
+    // МЕНЯТЬ: поля под свою предметную область
+    // Начальное значение payment_method: 'cash' — первое значение радиокнопок
+    this.form = this.fb.group({
+      course_name: ['', Validators.required],        // МЕНЯТЬ: название поля и валидаторы
+      desired_start_date: [null, Validators.required], // МЕНЯТЬ или убрать если нет даты
+      payment_method: ['cash', Validators.required],  // МЕНЯТЬ или убрать если нет радиокнопок
+    });
+  }
+
+  submit() {
+    if (this.form.invalid) {
+      this.form.markAllAsTouched();
+      return;
+    }
+    this.loading = true;
+
+    const val = this.form.value;
+    // ВАЖНО: p-datepicker возвращает объект Date, а API ожидает строку YYYY-MM-DD
+    // Если убрали поле с датой — убрать эти 2 строки
+    const date: Date = val.desired_start_date;
+    const dateStr = `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;
+
+    // МЕНЯТЬ: если убрали дату — убрать ", desired_start_date: dateStr" из spread
+    this.appsSvc.create({ ...val, desired_start_date: dateStr }).subscribe({
+      next: () => {
+        this.msg.add({ severity: 'success', summary: 'Заявка отправлена на рассмотрение' });
+        // МЕНЯТЬ: маршрут после создания (сейчас /applications)
+        setTimeout(() => this.router.navigate(['/applications']), 1000);
+      },
+      error: () => {
+        this.msg.add({ severity: 'error', summary: 'Ошибка при создании заявки' });
+        this.loading = false;
+      },
+    });
+  }
+}