InternetBanking-FrontEnd

FrontEnd Internet Banking - Đồ án cuối kì - PTUDWNC 2020 - HCMUS Sinh viên: NGUYỄN NGỌC KHẮC TRIỆU 1612738

Công nghệ sử dụng

• ReactJS kết hợp React-Bootstrap + Ant Design
• React-Redux, Redux Thunk

Các kĩ thuật/thuật toán thêm

• Authentication (nhiều role), Access Token JWT
• Refresh Token
• Mã hoá bất đối xứng RSA/PGP
• Realtime (Các kĩ thuật Short Polling, Long Polling, WebSockets). Trong đồ án này sử dụng Long Polling

Theo dõi công việc

0. Phân quyền

• Tạo navbar cho mỗi quyền
• Tạo route cho mỗi quyền

1. Customer

1.1. Đăng nhập

• Đăng nhập
• Sử dụng captcha

1.2 Liệt kê tài khoản

• Dashboard
  • Hiển thị số dư tài khoản

1.3 Thiết lập danh sách người nhận

• Thông tin danh sách người nhận

  • Show thông tin từ API
  • CRUD
  • Sử dụng tên đăng ký làm savedName khi không nhập

• Xử lý liên ngân hàng

  • 3TBank
  • BAOSON Bank

1.4 Chuyển khoản

• Chuyển khoản

  • Luồng đi giữa các màn hình
  • Điền thông tin người nhận và ngân hàng
  • Nhập OTP
  • Gợi ý lưu vào danh sách người nhận

• Chuyển khoản liên ngân hàng

  • 3TBank
  • BAOSON Bank

1.5 Quản lý nợ

• Tạo nhắc nợ

  • Điền thông tin người nợ
  • Nhập số tiền và nội dung nợ

• Xem danh sách nợ

  • Nợ tạo
  • Nợ do người khác nhắc

• Huỷ nợ

  • Chọn nhắc nợ (id) và nội dung xoá
  • Xoá được nhắc nợ
  • Notify cho người nhắc hoặc người được nhắc

• Thanh toán nợ

  • Chọn nợ (id)
  • Nhập OTP
  • Báo thành công
  • Notification cho người nhắc nợ

1.6 Quản lý giao dịch

• Xem lịch sử giao dịch

  • Nhận tiền
  • Chuyển tiền
  • Thanh toán nợ (nợ tạo + nợ được nhắc)
  • Xem theo thời gian
  • Xem chi tiết giao dịch
  • Filter

1.7 Đổi mật khẩu

• Chỉnh sửa thông tin

  • Thông tin cơ bản (name, phone, email)
  • Đổi mật khẩu

1.8 Quên mật khẩu

• Quên mật khẩu.
  • Luồng đi giữa các màn hình
  • Luồng dữ liệu

2. Employee

2.1 Tạo tài khoản

• Tạo tài khoản cho customer
  • Luồng màn hình
  • Luồng dữ liệu

2.2 Nạp tiền vào tài khoản

• Nạp tiền cho customer
  • Theo số tài khoản
  • Hoặc theo tên đăng nhập
  • Luồng màn hình
  • Luồng dữ liệu

2.3 Xem lịch sử giao dịch một khách hàng

• Như ở 1.6

3. Quản trị viên - Administrator

• Quản lý nhân viên

  • Xem danh sách nhân viên
  • Xem thông tin một nhân viên
  • Vô hiệu hoá tài khoản nhân viên
  • Tạo tài khoản nhân viên

• Xem giao dịch trong tháng với ngân hàng khác

  • Xem trong khoảng thời gian
  • Xem theo từng ngân hàng/tất cả ngân hàng
  • Thống kê số tiền giao dịch (nhận hoặc chuyển)

4. Phát sinh theo đề bài

• Realtime Notification

5. Yêu cầu khác

• Có 8 tài khoản
• API nội bộ đều phải cài đặt access-token và refresh-token
• Kết nối 2 ngân hàng khác
  • PGP
  • RSA
• Up lên Github