FastCheck - СБП Payment System

FastCheck is an online payment system that allows users to create and manage payment checks with СБП (Faster Payment System).

Features

• ✅ QR Code Authentication
• ✅ Balance Management
• ✅ Create FastCheck with custom amount
• ✅ Accept FastCheck with number and PIN
• ✅ View Active Checks
• ✅ Transaction History
• ⏳ Bank Integration (To be implemented)

Tech Stack

• Framework: Angular 21
• Language: TypeScript
• Styling: SCSS
• HTTP Client: Angular HttpClient
• QR Code: angularx-qrcode
• API: RESTful API (api.fastcheck.store)

Getting Started

Prerequisites

• Node.js (v18 or higher)
• npm (v10 or higher)

Installation

# Install dependencies
npm install

# Start development server
npm start

# The app will run on http://localhost:4200

Build

# Production build
npm run build

# Output will be in dist/ folder

Project Structure

src/
├── app/
│   ├── components/
│   │   ├── login/              # QR login with polling
│   │   ├── dashboard/          # Main dashboard
│   │   ├── active-checks/      # Active FastChecks list
│   │   └── history/            # Transaction history
│   ├── services/
│   │   ├── api.service.ts      # HTTP client wrapper
│   │   ├── auth.service.ts     # Authentication logic
│   │   └── fastcheck.service.ts # FastCheck operations
│   ├── models/                 # TypeScript interfaces
│   ├── guards/                 # Route guards
│   └── app.routes.ts           # Route configuration

API Documentation

Implemented APIs

• ✅ GET /ping - Check server availability
• ✅ GET /websession - Create QR session
• ✅ GET /websession/:id - Check login status (polling)
• ✅ DELETE /websession/:id - Logout
• ✅ POST /fastcheck - Create new FastCheck
• ✅ POST /fastcheck - Accept FastCheck
• ✅ GET /fastcheck - Check FastCheck status

Missing APIs (Mocked in Frontend)

See public/missing-apis.txt for complete specifications:

• ❌ GET /balance - Get user balance
• ❌ GET /fastcheck/active - Get active checks
• ❌ GET /fastcheck/history - Get transaction history

Note: These APIs are currently mocked in the frontend. The backend team needs to implement them.

Features Overview

1. Authentication

• Scan QR code with mobile app
• Auto-polling every 2 seconds
• Session management with sessionStorage

2. Dashboard

• View current balance
• Create new FastCheck
• Accept existing FastCheck
• FastCheck format: xxxx-xxxx-xxxx
• Code format: xxxx

3. Active Checks

• View all unused FastChecks
• Copy number and code to clipboard
• See expiration dates

4. Transaction History

• View used/expired checks
• Filter by created/accepted
• See timestamps

5. Balance Top-Up (To be implemented)

• Bank integration needed
• Will redirect to bank payment page
• Auto-refresh balance after payment

Development Notes

Mock Data

The following services return mock data:

• getBalance() - Returns 150,000 RUB
• getActiveFastChecks() - Returns 2 sample active checks
• getFastCheckHistory() - Returns 2 sample history records

Replace the mocked of() observables with real API calls once backend is ready.

Environment Configuration

Update src/environments/environment.ts for different API URLs:

export const environment = {
  production: false,
  apiUrl: 'https://api.fastcheck.store'
};

Backend Requirements

Backend team needs to implement:

1. Balance API - GET /balance
2. Active Checks API - GET /fastcheck/active
3. History API - GET /fastcheck/history
4. Bank Integration - Payment gateway integration

See public/missing-apis.txt for detailed API specifications.

Security Notes

• SessionId stored in sessionStorage (clears on tab close)
• All authenticated requests include Authorization header
• FastCheck codes are sensitive - handle securely
• Implement HTTPS in production

Browser Support

• Chrome (latest)
• Firefox (latest)
• Safari (latest)
• Edge (latest)

License

Private - 4Pay

Contact

For questions or issues, contact: sdarbinyan@4pay.ru