Mô tả các chức năng chính

6. Điểm: (Bằng chữ: )

3.2.2.1.Mô tả các chức năng chính

3.2.2.1.1. Thanh toán

Bảng 3. 5: Mô tả chức năng thanh toán

Tên Thanh toán

Mã UC10

Mục tiêu Thanh toán các sản phẩm Tác nhân Người dùng, khách

Chương 3: Xác định yêu cầu 23 Dòng xử lý 1. Khi đã chọn được các sản

phẩm cần mua, ở trang chi tiết giỏ hàng sẽ có phần thanh toán

3. Trang thanh toán sẽ hiển thị các trường thông tin cá nhân để khách điền đầy đủ thông tin (riêng người dùng, dữ liệu các trường thông tin sẽ được tải lên sẵn do đã nhập thông tin lúc đăng ký tài khoản), chọn phương thức thanh toán. Có 2 phương thức thanh toán COD (UC10.1) và PayPal (UC10.2) để khách/người dùng chọn lựa.

5. Chuyển sang trang thanh toán thành công và có hóa đơn điện tử của hệ thống gửi về địa chỉ email cá nhân.

2. Người dùng nhấn vào nút “PROCCED TO CHECKOUT” để qua bước thanh toán.

4. Nếu thanh toán bằng phương thức PayPal, nhập tài khoản PayPal để thanh toán.

Nếu thanh toán bình thường thì nhấn nút “Place order” để thanh toán.

Ngoại lệ Nếu thanh toán không thành công sẽ có alert báo lỗi. Vấn đề

3.2.2.1.2. Trò chuyện trực tuyến

Bảng 3. 6: Mô tả chức năng trò chuyện trực tuyến Tên Trò chuyện trực tuyến

Mã UC17

Mục tiêu Trò chuyện trực tuyến với nhân viên cửa hàng về các thắc mắc Tác nhân Người dùng

Chương 3: Xác định yêu cầu 24 Dòng xử lý 1. Ở phía dưới góc phải màn

hình có một nút chứa icon “Messages”.

3. Dưới phần nội dung cuộc hội thoại là phần để để nhập tin nhắn.

5. Tin nhắn của người dùng được gửi đến nhân viên và sẽ được phản hồi.

2. Người dùng nhấn vào nút chứa icon “Messages” thì khung chat hiện lên.

4. Người dùng nhập tin nhắn và nhấn nút gửi bên phải hoặc nhấn Enter trên bàn phím.

6. Nội dụng cuộc hội thoại giữa người dùng và nhân viên sẽ được hiển thị phần chính giữa khung chat.

Ngoại lệ Nếu là khách nhấn vào nút chứa icon “Messages” thì khung chat hiện lên và yêu cầu phải đăng nhập để được trò chuyện với nhân viên tư vấn.

Vấn đề

3.2.2.1.3. Quản lý đơn hàng

Bảng 3. 7: Mô tả chức năng quản lý đơn hàng Tên Quản lý đơn hàng

Mã UC22

Mục tiêu Quản lý thông tin đơn hàng và một số chức năng khác Tác nhân Quản trị viên, nhân viên

Tiền điều kiện Đã đăng nhập vào trang quản trị Dòng xử lý 1. Ở thanh navigation, quản trị viên/nhân viên nhấn vào “Product Management”, sau đó (adsbygoogle = window.adsbygoogle || []).push({});

chọn “Order” 2. Trang quản lý đơn hàng sẽ hiện ra, quản trị viên/nhân viên có thể thực hiện các chức năng UC22.1, UC22.2, UC22.3, UC22.4, UC22.5.

Chương 3: Xác định yêu cầu 25 Vấn đề

3.2.2.1.4. Trình quản lý hội thoại

Bảng 3. 8: Mô tả chức năng trình quản lý hội thoại Tên Trình quản lý cuộc hội thoại

Mã UC26

Mục tiêu Quản lý cuộc hôi thoại và trả lời tin nhắn trực tuyến với các khách hàng

Tác nhân Quản trị viên và nhân viên Tiền điều kiện Đã đăng nhập vào trang quản trị Dòng xử lý 1. Ở thanh navigation, quản trị viên/nhân viên nhấn vào “Utilities”, sau đó chọn “Messages”.

3. Quản trị viên/nhân viên nhấn vào các phần tin nhắn tương ứng với email khách hàng để trả lời tin nhắn

5. Dưới phần nội dung cuộc hội thoại là phần để nhập tin nhắn.

7. Phản hồi của quản trị viên/nhân viên sẽ được gửi đến khách hàng.

2. Nội dung trình quản lý cuộc hội thoại hiện ra. Bên trái là danh sách các khách hàng đã có nhắn tin với nhân viên. Bên phải là nội dung cuộc hội thoại tương ứng.

4. Nội dung cuộc hội thoại hiện lên và bắt đầu phản hồi tin nhắn của khách hàng.

6. Quản trị viên/nhân viên nhập tin nhắn và nhấn nút gửi bên phải hoặc nhấn Enter trên bàn phím.

8. Nội dụng cuộc hội thoại giữa quản trị viên/nhân viên và khách hàng sẽ được hiển thị phần chính giữa khung chat.

Ngoại lệ Vấn đề

Chương 4: Kiến trúc hệ thống 26 Chương 4: THIẾT KẾ HỆ THỐNG 4.1. Kiến trúc hệ thống Hình 4. 1: Kiến trúc hệ thống 4.2. Lược đồ lớp 4.2.1. Database Hình 4. 2: Database

Chương 4: Kiến trúc hệ thống 27

4.2.1.1. Enum

Hình 4. 3: Enum

4.2.1.2. Interface

Chương 4: Kiến trúc hệ thống 28

4.2.1.3. Entity

Chương 4: Kiến trúc hệ thống 29

4.2.2. DB Context

Chương 4: Kiến trúc hệ thống 30

4.2.3. Repository

Chương 4: Kiến trúc hệ thống 31

4.2.4. Services

Hình 4. 8: Services

4.2.4.1. ViewModel (adsbygoogle = window.adsbygoogle || []).push({});

Chương 4: Kiến trúc hệ thống 32

4.2.4.2. Interface

Chương 4: Kiến trúc hệ thống 33

4.2.4.3. Service

Chương 4: Kiến trúc hệ thống 34

4.2.4.4. Cấu hình cho AutoMapper

Hình 4. 12: Cấu hình AutoMapper

4.2.5. Presentation 4.2.5.1. ViewModel 4.2.5.1. ViewModel

Chương 4: Kiến trúc hệ thống 35

4.2.5.2. Web application

Chương 4: Kiến trúc hệ thống 36

4.2.5.3. Web API

Chương 4: Kiến trúc hệ thống 37

4.3. Lược đồ tuần tự

4.3.1. Lược đồ tuần tự chức năng đánh giá sản phẩm

Chương 4: Kiến trúc hệ thống 38

4.3.2. Lược đồ tuần tự chức năng thêm sản phẩm yêu thích

Chương 4: Kiến trúc hệ thống 39

4.3.3. Lược đồ tuần tự chức năng huấn luyện hệ thống gợi ý sản phẩm

Hình 4. 18: Lược đồ tuần tự chức năng huấn luyện hệ thống gợi ý sản phẩm

4.3.4. Lược đồ tuần tự chức năng lấy sản phẩm từ hệ thống gợi ý sản phẩm

Chương 4: Kiến trúc hệ thống 40

4.4. Thiết kế cơ sở dữ liệu

4.4.1. Mô hình quan hệ thực thể (ERD)

Hình 4. 20: Mô hình quan hệ (ERD)

Chú thích:

Các bảng dữ liệu có màu nổi là được tạo ra để xây dựng các tính năng trong kỳ khóa luận lần này.

- Bảng Feedback: lưu dữ liệu các đánh giá về trang web của người dùng. - Bảng Visitor: lưu số lượng người ghé thăm trang web.

- Bảng Wishlist: lưu dữ liệu các sản phẩm yêu thích.

- Bảng Message: lưu dữ liệu cuộc hội thoại giữa khách hàng và quản trị viên. - Bảng ViewList: lưu dữ liệu các sản phẩm đã xem. (adsbygoogle = window.adsbygoogle || []).push({});

- Bảng ProductFeedback: lưu dữ liệu nội dun các bài đánh giá về sản phẩm. - Bảng ProductFeedbackImage: lưu dữ liệu các hình ảnh sản phẩm thực tế từ các

Chương 4: Kiến trúc hệ thống 41

4.4.2. Mô hình vật lý

Chương 4: Kiến trúc hệ thống 42

4.5. Thiết kế giao diện

4.5.1. Kiến trúc tổng quan của giao diện

4.5.1.1. Luồng đường đi các màn hình phía khách (chưa đăng nhập)

Chương 4: Kiến trúc hệ thống 43

Bảng 4. 1: Mô tả các màn hình phía Khách

Mã Tên màn hình Mô tả

SCC01 Trang chủ

Màn hình trang chủ của website, hiển thị các hình ảnh, slide, banner quảng cáo về các sản phẩm, giới thiệu các sản phẩm mới nhất, các sản phẩm bán chạy và các thông tin về cửa hàng.

SCC02 Kết quả tìm kiếm

Màn hình tìm kiếm sản phẩm, hiển thị các sản phẩm có chứa các ký tự từ khóa mà người dùng đã nhập vào để tìm kiếm.

SCC03 Sản phẩm theo danh mục Màn hình danh sách các sản phẩm, hiển thị các sản phẩm theo từng danh mục loại sản phầm.

SCC04 Chi tiết sản phẩm

Màn hình chi tiết sản phẩm, hiển thị đầy đủ các thông tin chi tiết của sản phẩm bao gồm cả mô tả chi tiết và đánh giá về sản phẩm của khách hàng.

SCC05 Giỏ hàng Màn hình giỏ hàng, hiển thị các sản phẩm đã được người dùng thêm vào giỏ hàng.

SCC06 Thanh toán

Màn hình thanh toán, hiển thị danh sách các sản phẩm cần thanh toán, khu vực nhập thông tin cá nhân của người dùng và các phương thức thanh toán.

SCC07 Thanh toán thành công

Màn hình thanh toán thành công, hiển thị cho người dùng biết đơn hàng đã được thanh toán thành công.

SCC08 Liên hệ

Màn hình liên lạc, hiển thị các thông tin về cửa hàng như địa chỉ, số điện thoại, email. Ngoài ra còn có Google Map và khu vực để người dùng nhập các ý kiến thắc mắc hoặc góp ý cải thiện chất lượng cửa hàng.

SCC09 Giới thiệu chung

Màn hình giới thiệu, hiển thị các thông tin chi tiết giới thiệu về cửa hàng, giới thiệu về các nhà đồng sáng lập. CEO của cửa hàng.

SCG01 Đăng nhập

Màn hình đăng nhập. Đăng nhập với tài khoản đã đăng ký hoặc đăng nhập bằng tài khoản google, facebook.

SCG02 Đăng ký

Màn hình đăng ký, hiển thị các trường thông tin cá nhân để người dùng nhập hoàn tất việc đăng ký. (adsbygoogle = window.adsbygoogle || []).push({});

Chương 4: Kiến trúc hệ thống 44

SCG03 Xác nhận đăng ký

Màn hình xác nhận email, hiển thị thông báo yêu cầu người dùng kiểm tra email với nội dung xác thực được gửi từ hệ thống.

SCG04 Đăng ký thành công

Màn hình đăng ký thành công, hiển thị cho người dùng biết đã đăng ký thành công ngay khi xác nhận email.

SCG05 Đặt lại mật khẩu

Màn hình quên mật khẩu, hiển thị thông báo yêu cầu người dùng kiểm tra email với nội dung đặt lại mật khẩu được gửi tới từ hệ thống.

SCG06 Xác nhận đặt lại mật khẩu

Màn hình xác nhận đặt lại mật khẩu, hiển thị các trường thông tin cần thiết về mật khẩu để người dùng nhập mới mật khẩu thay thế cho mật khẩu đã quên trước đó.

SCG07 Cập nhật mật khẩu mới

Màn hình đặt lại mật khẩu, hiển thị các trường thông tin cần thiết về mật khẩu để người dùng nhập mới mật khẩu thay thế cho mật khẩu đã quên trước đó.

SCG08 Cập nhật mật khẩu thành

công

Màn hình đã cập nhật mật khẩu, hiển thị thông báo mật khẩu mới của tài khoản đã được cập nhật và có thể quay lại đăng nhập với mật khẩu mới.

Chương 4: Kiến trúc hệ thống 45

4.5.1.2. Luồng đường đi màn hình phía người dùng (đã đăng nhập)

Hình 4. 23: Luồng đường đi các màn hình phía người dùng

Bảng 4. 2: Mô tả các màn hình phía người dùng

Mã Tên màn hình Mô tả

SCC01 Trang chủ

SCC02 Kết quả tìm kiếm

Màn hình tìm kiếm sản phẩm, hiển thị các sản phẩm có chứa các ký tự từ khóa mà người dùng đã nhập vào để tìm kiếm.

SCC03 Sản phẩm theo danh mục Màn hình danh sách các sản phẩm, hiển thị các sản phẩm theo từng danh mục loại sản phầm.

Chương 4: Kiến trúc hệ thống 46

SCC04 Chi tiết sản phẩm

Màn hình chi tiết sản phẩm, hiển thị đầy đủ các thông tin chi tiết của sản phẩm bao gồm cả mô tả chi tiết và đánh giá về sản phẩm của khách hàng.

SCC05 Giỏ hàng Màn hình giỏ hàng, hiển thị các sản phẩm đã được người dùng thêm vào giỏ hàng.

SCC06 Thanh toán

Màn hình thanh toán, hiển thị danh sách các sản phẩm cần thanh toán, khu vực nhập thông tin cá nhân của người dùng và các phương thức thanh toán. (adsbygoogle = window.adsbygoogle || []).push({});

SCC07 Thanh toán thành công

Màn hình thanh toán thành công, hiển thị cho người dùng biết đơn hàng đã được thanh toán thành công.

SCC08 Liên hệ

SCC09 Giới thiệu chung

Màn hình giới thiệu, hiển thị các thông tin chi tiết giới thiệu về cửa hàng, giới thiệu về các nhà đồng sáng lập. CEO của cửa hàng.

SCU01 Thông tin tài khoản

Màn hình chỉnh sửa thông tin tài khoản, hiển thị các trường thông tin cá nhân đã đăng ký và người dùng có thể sửa khi cần thiết. Lưu ý trường email bị vô hiệu hóa không thể thay đổi vì đó cũng là tên đăng nhập.

SCU02 Đổi mật khẩu Màn hình thay đổi mật khẩu, hiểnt thị các trường thông tin về mật khẩu (được che bằng ký tự *) để người dùng thay đổi khi cần thiết.

SCU03 Lịch sử đơn hàng

Màn hình lịch sử đơn hàng, hiển thị danh sách các đơn hàng đã đặt kèm theo đó trạng thái các đơn hàng.

SCU04 Chi tiết đơn hàng Màn hình chi tiết đơn hàng, hiển thị chi tiết thông tin các sản phẩm của đơn hàng.

SCU05 Sản phẩm yêu thích

Màn hình danh sách sản phẩm yêu thích, hiển thị các sản phẩm mà người dùng yêu thích. Lưu ý chỉ khi đã đăng nhập vào hệ thống mới thực hiện được chức năng thêm sản phẩm vào danh sách yêu thích và xem được danh sách sản phẩm yêu thích.

Chương 4: Kiến trúc hệ thống 47

SCU06 Sản phẩm đã xem

Màn hình danh sách các sản phẩm đã xem, hiển thị danh sách các sản phẩm mà người dùng đã xem (khi người dùng nhấp vào xem chi tiết sản phẩm thì sản phẩm đó được tính là sản phẩm đã xem). Lưu ý chi khi đã đăng nhập vào hệ thống mới xem được danh sách sản phẩm đã xem.

4.5.1.3. Luồng đường đi màn hình phía quản trị viên/nhân viên

Hình 4. 24: Luồng đường đi các màn hình phía quản trị viên/nhân viên

Bảng 4. 3: Mô tả các màn hình phía quản trị viên/nhân viên

STT Tên màn hình Mô tả

SCA01 Đăng nhập (quản trị) Màn hình đăng nhập của quản trị, hiển thị các trường thông tin tên tài khoản và mật khẩu để đăng nhập vào hệ thống.

SCA02 Dashboard

Màn hình dashboard, hiển thị đồ thị lợi nhuận qua từng tuần, các thông số tổng lợi nhuận, các khoản chi phí, chi tiêu, v..v…

Chương 4: Kiến trúc hệ thống 48

SCA03 Quản lý đơn hàng

Màn hình quản lý danh sách các đơn hàng, hiển thị tất cả thông các đơn hàng đã được khách hàng đặt. Ngoài ra có thể tạo đơn hàng khi khách hàng mua tại cửa hàng.

SCA04 Quản lý danh mục sản

phẩm

Màn hình quản lý danh sách danh mục, loại sản phẩm, hiển thị dưới dạng treeview cho phép kéo thả, lồng vào nhau theo quan hệ cha con. Ngoài ra còn thêm mới hoặc chỉnh sửa các thông tin khi cần thiết. (adsbygoogle = window.adsbygoogle || []).push({});

SCA05 Quản lý sản phẩm

Màn hình quản lý danh sách các sản phẩm, hiển thị tất cả thông tin về sản phẩm. Ngoài ra còn thêm mới hoặc chỉnh sửa thông tin các sản phẩm, quản lý danh sách hình ảnh và danh sách số lượng của sản phẩm.

SCA06 Quản lý Role

Màn hình quản lý danh sách Role, hiển thị tất cả thông tin của các Role hiện có. Ngoài ra còn thêm mới hoặc chỉnh sửa thông tin khi cần thiết, gắn thêm hoặc xóa các quyền cho Role.

SCA07 Quản lý tài khoản người

dùng

Màn hình quản lý danh sách tài khoản người dùng, hiển thị tất cả thông tin (trừ mật khẩu) của các tài khoản người dùng đang hiện hữu. Ngoài ra có thể thêm mới hoặc chỉnh sửa khi cần thiết.

SCA08 Quản lý các đánh giá

Màn hình thông tin đánh giá về website, dịch vụ của cửa hàng, hiển thị các ý kiến đóng góp của khách hàng về cửa hàng và website.

SCA09 Trình quản lý hội thoại

Màn hình tin nhắn, hiển thị các cuộc hội thoại tin nhắn của khách hàng và quản trị viên. Admin trả lời các tin nhắn của khách hàng tại đây.

Chương 4: Kiến trúc hệ thống 49

4.5.2. Đặc tả chi tiết giao diện từng màn hình 4.5.2.1. Màn hình trang chủ 4.5.2.1. Màn hình trang chủ

Chương 4: Kiến trúc hệ thống 50

Hình 4. 26: Giao diện màn hình trang chủ_2

Chương 4: Kiến trúc hệ thống 51

Bảng 4. 4: Đặc tả chi tiết giao diện màn hình trang chủ

STT Tên Bắt buộc Định dạng Chú thích

6. Điểm: (Bằng chữ: )

3.2.2.1.Mô tả các chức năng chính

Mục lục