Biểu đồ Basic Flow usecase Đăng kí

Một phần của tài liệu Xây dāng website bán giày trāc tuyàn bàng vuejs và spring boot (Trang 30)

c. Bißu đã VOPC

Hình 10. Biểu đồ VOPC use case <Đăng kí=.

3.1.3.3 Use case <Xem danh sách sÁn phm=a. Mô tÁ chi tiÁt a. Mô tÁ chi tiÁt

Tên use case: Xem danh sách sÁn phẩm

Mô tÁ v¿n t¿t: Use case này cho phép khách hàng xem các sÁn phẩm trong cửa hàng.

25 • Luãng c¢ bÁn:

1. Use case này bắt đầu khi khách hàng bấm vào nút <SÁn phẩm= ã thanh

menu. Há tháng s¿ lấy ra thông tin cÿa sÁn phẩm trong bÁng Product bao

gồm: id, tên sÁn phẩm, Ánh, giá thành sau đó hiển thị lên màn hình.

Use case kÁt thúc.

Luãng r¿ nhánh:

1. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu không

kÁt nái đ°āc vịi c só dữ liáu thì há tháng s¿ hiển thị thơng báo lỗi và use case kÁt thúc.

- Các yêu c¿u đặc biãt: Khơng có.

- TiÃn điÃu kiãn: Khơng có.

- HÁu điÃu kiãn: Khơng có.

- Đißm mã rßng: Khơng có. b. Bißu đã Basic Flow

Hình 11. Biểu đồ Basic Flow use case <Xem danh sách sn phm=.

26

c. Bißu đã VOPC

Hình 12. Biểu đồ VOPC use case <Xem danh sách sn phm=.

3.1.2.4 Use case <Xem chi tiÁt sÁn phm=a. Mô tÁ chi tiÁt a. Mô tÁ chi tiÁt

Tên use case: Xem chi tiÁt sÁn phẩm

Mô tÁ v¿n t¿t: Use case này cho phép khách hàng xem thông tin chi tiÁt cÿa sn phm

ã Luóng c bn:

1. Use case này bắtđầu khi khách hàng bấm vào Ánh hoặc tên sÁn phẩm. Há

tháng s¿ lấy thông tin sÁn phẩm (Ánh, giá, tên sÁn phẩm, gißi thiáu về sÁn phẩm, kích cÿ, sál°āng, màu sắc, đánh giá) từ bÁng Product và hiển thị lên màn hình.

Use case kÁt thúc.

Luãng r¿ nhánh:

1. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu khơng

kÁt nái đ°āc vịi c só dữ liáu thì há tháng s¿ hiển thị thông báo lỗi và

use case kÁt thúc.

27

b. Bißu đã Basic Flow

Hình 13. Biểu đồ Basic Flow use case <Xem chi tiết sn phm=.

c. Bißu đã VOPC

Hình 14. Biểu đồ VOPC use case Xem chi tiết sn phm.

: User

: User : ChiTietSanPhamUI : ChiTietSanPhamUI : ChiTietSanPhamController

: ChiTietSanPhamController

: Product

: Product : ICSDL : ICSDL : CSDL : CSDL

1: click vao anh hoac ten san pham( )

2: lay thong tin san pham( )

3: doc bang Product( )

4: doc bang Product( )

5: get Product by Id( )

6: return ketqua

7: hien thi chi tiet san pham( )

28

3.1.2.5 Use case <Tìm kiÁm sÁn phm=a. Mô tÁ chi tiÁt a. Mô tÁ chi tiÁt

Tên use case: Xem danh sách sÁn phẩm theo danh măc

Mô tÁ v¿n t¿t: Use case này cho phép khách hàng tìm kiÁm sÁn phẩm theo từ khố nhập vào.

ã Luóng c bn:

1. Use case này bắt đầu khi khách hàng nhập tên sÁn phẩm vào ơ tìm kiÁm

ã trên thanh Menu. Há tháng s¿ lấy thông tin các sÁn phẩm bao gồm:

tên sÁn phẩm, giá, thể lo¿i, hình Ánh sÁn phẩm, có tên liên quan đÁn nội

dung mà khách hàng đã nhập để hiển thị lên màn hình

Use case kÁt thúc.

Luãng r¿ nhánh:

1. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu khơng

kÁt nái đ°āc vịi c sã dữ liáu thì há tháng s¿ hiển thị thơng báo lỗi và use case kÁt thúc.

2. T¿i b°ßc 1 nÁu khơng tìm thấy bÁn ghi nào s¿ đ°a ra thơng báo khơng

tìm thấy cho khách hàng.

- Các yêu c¿u đặc biãt: Khơng có.

- TiÃn điÃu kiãn: Khơng có.

- HÁu điÃu kiãn: Khơng có.

- Đißm mã rßng: Khơng có.

29

b. Bißu đã Basic Flow

Hình 15. Biểu đồ Basic Flow use case Tìm kiếm sn phm.

c. Bißu đã VOPC

Hình 16. Biểu đồ VOPC use case Tìm kiếm sn phm

3.1.2.6 Use case <Thêm vào giß hàng=a. Mơ tÁ chi tiÁt a. Mơ tÁ chi tiÁt

30

Tên use case: Thêm vào giß hàng.

Mơ tÁ v¿n t¿t: Use case này cho phép khách hàng thêm những sÁn phẩm muán mua vào gißhàng để chá thc hiỏn thanh toỏn

ã Luóng c bn:

1. Use case này bắt đầu khi khách hàng click vào nút Thêm Vào Giß Hàng

ã mỗi sÁn phẩm hiển thị. SÁn phẩm s¿ đ°āc thêm vào trong giß hàng và

l°u trữ l¿i. Hiển thị thơng báo thờm vo giò hng thnh cng.

Use case kt thỳc.

ã Luãng r¿ nhánh:

1. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu khơng

kÁt nái đ°āc vịi c só dữ liáu thì há tháng s¿ hiển thị thông báo lỗi và

use case kÁt thúc.

- Các yêu c¿u đặc biãt: Khơng có.

- TiÃn điÃu kiãn: Khách hàng đã đăng nhập vào há tháng.

- HÁu điÃu kiãn: Trong bÁng Cart và CartItem có dữ liáu cÿa sÁn phẩm vừa thêm vào giß hàng

- Đißm mã rßng: Khơng có. b. Bißu đã Basic Flow

31

Hình 17. Biểu đồ basic flow use case Thêm vào gi hàng

c. Bißu đã VOPC

Hình 18. Biểu đồ VOPC use case Thêm vào gi hàng.

32

3.1.2.7 Use case <Xem danh sách sÁn phm trong giß hàng=a. Mơ tÁ chi tiÁt a. Mơ tÁ chi tiÁt

Tên use case: Xem danh sách sÁn phẩm trong giß hàng.

Mơ tÁ v¿n t¿t: Use case này cho phép khách hàng xem những sÁn phẩm

đã thờm vo giòhng tròc ú.

ã Luóng c bn:

1. Use case này bắt đầu khi khách hàng click vào biểu t°āng Giß Hàng trên thanh menu.Há tháng s¿ thông tin cÿa Giß Hàng trong bÁng Cart và CartItem bao gồm: tên sÁn phẩm, giá, sá l°āng, thành tiền và hiển thị

lên màn hình.

Use case kÁt thúc.

Luãng r¿ nhánh:

1. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu khơng

kÁt nái đ°āc vịi c só dữ liáu thì há tháng s¿ hiển thị thông báo lỗi và

use case kÁt thúc.

- Các yêu c¿u đặc biãt: Khơng có.

- TiÃn điÃu kiãn: Khách hàng đã đăng nhập vào há tháng.

- HÁu điÃu kiãn: Khơng có.

- Đißm mã rßng: Khơng có.

33

b. Bißu đã Basic Flow

Hình 19. Biểu đồ basic flow use case Xem danh sách sn phm trong gi hàng.

34

c. Bißu đã VOPC

Hình 20. Biểu đồ VOPC use case Xem danh sách sn phm trong gi hàng.

3.1.2.8 Use case <Xóa sÁn phm trong giß hàng=a. Mơ tÁ chi tiÁt a. Mơ tÁ chi tiÁt

Tên use case: Xóa sÁn phẩm trong giß hàng.

Mơ tÁ v¿n t¿t: Use case cho phép khách hàng xóa đi những sÁn phẩm khơng mn mua ra khòi giò hng

ã Luóng c bn:

1. Use case này bắt đầu khi khách hàng click vào nút Xóa ã mỗi sÁn phẩm hiển thị trong giß hàng.Hiển thị thơng báo xác nhận xóa sÁn phẩm ra khßi giß hàng.

2. Khách hàng bấm nút Xác Nhận và sÁn phẩm s¿ bị xóa khßi giß hàng. Hiển thị xóa sÁn phẩm ra khßi giß hàng thành cơng.

Use case kÁt thúc.

Luãng r¿ nhánh:

1. T¿i b°ßc 2, nÁu ng°ái dùng chọn nút <TiÁp tăc= thay vì nút Xác nhận,

quay trã l¿i màn hình danh sách sÁn phẩm trong giß hàng.

35

2. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu khơng

kÁt nái đ°āc vịi c só dữ liáu thì há tháng s¿ hiển thị thơng báo lỗi và

use case kÁt thúc.

- Các yêu c¿u đặc biãt: Khơng có.

- TiÃn điÃu kiãn: Khách hàng đã đăng nhập vào há tháng.

- HÁu điÃu kiãn: Giß hàng khơng tồn t¿i sÁn phẩm mà khách hàng vừa xóa. - Đißm mã rßng: Khơng có.

b. Bißu đã Basic Flow

Hình 21. Biểu đồ Basic Flow usecase Xóa sn phm trong gi hàng.

36

c. Bißu đã VOPC

Hình 22. Biểu đồ VOPC use case Xóa sn phm trong gi hàng

3.1.2.9 Use case <Xem lßch sÿ mua hàng= a. Mô tÁ chi tiÁt

Tên use case: Xem danh sách dißn viên.

Mơ tÁ v¿n t¿t: Use case này cho phép khách hàng xem l¿i những đ¢n hàng

ó t

ã Luóng c bn:

1. Use case này bắt đầu khi khách hàng click vào nút Lịch sử mua hàng trên thanh menu.Há tháng s¿ lấy thơng tin hố đ¢n từ bÁng Orders và

OrdersDetail nh°: tên sÁn phẩm, giá tiền, thành tiền, ngày đặt mua, tình

tr¿ng đ¢n hàng, địa chỉ nhận hàng

Use case kÁt thúc.

37 • Luãng r¿ nhánh:

1. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu khơng

kÁt nái đ°āc vịi c só dữ liáu thì há tháng s¿ hiển thị thông báo lỗi và

use case kÁt thúc

- Các yêu c¿u đặc biãt: Khơng có.

- TiÃn điÃu kiãn: Khách hàng đã đăng nhập vào há tháng.

- HÁu điÃu kiãn: Khơng có.

- Đißm mã rßng: Khơng có. b. Bißu đã Basic Flow

Hình 23. Biểu đồ basic flow use case Xem lch s mua hàng.

38

c. Bißu đã VOPC

Hình 24. Biểu đồ VOPC use case Xem lch s mua hàng

3.1.2.10 Use case <Huđ¢n hàng=a. Mô tÁ chi tiÁt a. Mô tÁ chi tiÁt

Tên use case: Huỷđ¢n hàng

Mơ tÁ v¿n t¿t: Use case này cho phép khách hàng huỷ một đ¢n hàng khi

Ân hng cha c duyỏt.

ã Luóng c bn:

1. Use case này bắt đầu khi khách hàng vào nút <Huỷ đ¢n= trên mỗi đ¢n

hàng ã tr¿ng thái chá duyát ã phần lịch sử đặt hàng. Há tháng s¿

Use case kÁt thúc.

Luãng r¿ nhánh:

1. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu khơng

kÁt nái đ°āc vòi c só d liỏu thỡ hỏ thỏng s hin thị thông báo lỗi và use case kÁt thúc

- Các yêu c¿u đặc biãt: Khơng có.

- TiÃn điÃu kiãn: Khách hàng đã đăng nhập vào há tháng.

39 - HÁu điÃu kiãn: Khơng có.

- Đißm mã rßng: Khơng có. b. Bißu đã Basic Flow

Hình 25. Biểu đồ Basic Flow usecase Huđơn hàng.

40

c. Bißu đã VOPC

Hình 26. Biểu đồ VOPC use case Huđơn hàng.

3.1.2.11 Use case <Đặt hàng= a. Mô tÁ chi tiÁt

Tên use case: Đặt hàng.

Mô tÁ v¿n t¿t: Use case cho phép ng°ái dùng có thể thực hián đặt mua

nhng sn phm ó thờm vo trong giòhng tròc ú.

ã Luãng c¢ bÁn:

1. Use case này bắt đầu khi khách hàng click vào nút Thanh Toán ã giao dián Giß Hàng.Há tháng s¿ hiển thị giao dián để khách hàng nhập thông tin bao gồm nh°: họ tên, sáđián tho¿i, địa chỉ, email, ghi chú.

2. Khách hàng điền đầy đÿ thông tin vào chọn ph°¢ng thāc thanh tốn. Khách hàng click nút Xác nhận đ¢n hàng, há tháng s¿ t¿o bÁn ghi trong bÁng Orders gồm: thơng tin khách hàng, tổng giá trị đ¢n hàng và bÁn

ghi trong bÁng OrdersDetail gồm các thông tin: tên sÁn phẩm, giá sÁn phẩm, sál°āng, thành tiền.Há tháng thông báo đặt mua hàng thành công

Use case kÁt thúc.

41 • Luãng r¿ nhánh:

1. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu khơng

kÁt nái đ°āc vịi c só dữ liáu thì há tháng s¿ hiển thị thơng báo lỗi và

use case kÁt thúc.

- Các yêu c¿u đặc biãt: Khơng có.

- TiÃn điÃu kiãn: Khách hàng đã đăng nhập vào há tháng.

- HÁu điÃu kiãn: Khơng có.

- Đißm mã rßng: Khơng có. b. Bißu đã Basic Flow

Hình 27. Biểu đồ Basic Flow use case Đặt hàng

42

c. Bißu đã VOPC

Hình 28. Biểu đồVOPC use case Đặt hàng.

3.1.2.12 Use case <Đăng nhÁp hã tháng quÁn lý= a. Mô tÁ chi tiÁt

Tên use case: Đăng nhập há tháng quÁn lý

Mô tÁ v¿n t¿t: Use case này cho phép quÁn trịviên đăng nhp vo hỏ thỏng qun lý.

ã Luóng c bÁn:

1. Use case này case này bắt đầu khi ng°ái dùng vào giao dián đăng nhập vào há tháng quÁn lý. Há tháng yêu cầu ng°ái dùng nhập tên đăng nhập và mật khẩu.

2. Ng°ái dùng nhập thơng tin u cầu và kích nút <Đăng nhập=. Há tháng

s¿ tìm kiÁm bÁn ghi có tên đăng nhập và mật khẩu trùng vßi thơng tin

ng°ái dùng nhập trong bÁng User. NÁu tìm thấy bÁn ghi s¿ chuyển sang

trang cÿa quÁn trị viên

Use case kÁt thúc.

43 • Luãng r¿ nhánh:

1. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu khơng

kÁt nái đ°āc vịi c só dữ liáu thì há tháng s¿ hiển thị một thơng báo lỗi

và use case kÁt thúc.

2. T¿i b°ßc 2 trong luồng c¢ bÁn khi nhập thơng tin khơng chính xác. Há

tháng s¿ hiển thị thơng báo lỗi và yêu cầu nhập l¿i. Ng°ái dùng có thể

nhập l¿i để tiÁp tăc thao tác.

- Các yêu c¿u đặc biãt: Ng°ái dùng cần nhập đúng các thông tin yêu cầu để

đăng nhập thành công.

- TiÃn điÃu kiãn: Không có.

- HÁu điÃu kiãn: Đăng nhập thành cơng ng°ái dựng c thc hiỏn cỏc chc

nng tÂng ng vòi quyền h¿n cÿa tài khoÁn đăng nhập.

- Đißm mã rßng: Khơng có.

44

b. Bißu đã Basic Flow

Hình 29. Biểu đồ basic flow use case Đăng nhập h thng qun tr.

c. Bißu đã VOPC

Hình 30. Biểu đồVOPC use case Đăng nhập h thng qun lý.

45

3.1.2.13 Use case <QuÁn lý sÁn phm= a. Mô tÁ chi tiÁt

Tên use case: QuÁn lý sÁn phẩm

Mô tÁ v¿n t¿t: Use case cho phép ng°ái dùng là quÁn trị viên thêm, sửa,

xóa các sÁn phẩm hiển thị trờn trang web.. ã Luóng c bn:

1. Use case này bắt đầu khi quÁn trị viên kích vào nút <SÁn phẩm= trên

menu quÁn trị. Há tháng s¿ hiển thị danh sách các sÁn phẩm (mã sÁn phẩm, tên sÁn phẩm, hình Ánh, giá tiền) từ bÁng Products lên màn hình.

2. Thêm sÁn phẩm

a. Qn trị viên kích nút <Thêm mßi= trên màn hình quÁn lý sÁn phẩm. Há

tháng s¿ hiển thị các thơng tin cần nhập để thêm mßi nh° tên sÁn phẩm, sá l°āng, hình Ánh, mơ tÁ.

b. Qn trị viên nhập thơng tin rồi kích nút <Thêm=. Há tháng s¿ t¿o một

bÁn ghi mßi trong bÁng Product và chuyển tßi màn hình qn lý sÁn phẩm.

3. Sửa sÁn phẩm

a. QuÁn trị viên kích vào nút <Cập nhật= trên dòng cÿa sÁn phẩm muán chỉnh sửa. Há tháng hiển thị màn hình sửa vßi các thơng tin cũ cÿa sÁn phẩm (tên sÁn phẩm, sá l°āng sÁn phẩm, hình Ánh, mơ tÁ).

b. Qn trị viên sửa các thơng tin mn sửa và kích vào nút <Cập nhật=. Há

tháng s¿ tiÁn hành cập nhật thông tin sÁn phẩm cần sửa trong bÁng Product và chuyển tßi màn hình qn lý sÁn phẩm.

4. Xóa sÁn phẩm

a. Qn trị viên kích vào nút biểu t°āng Xóa trên dịng cÿa sÁn phẩm muán xóa. Há tháng hiển thị màn hình xác nhận xóa.

b. Qn trịviên kích vào nút <Đồng ý=. Há tháng s¿ tiÁn hành xóa sÁn phẩm

cần xóa trong bÁng Product và chuyển tßi màn hình quÁn lý sÁn phẩm

Use case kÁt thúc.

Luãng r¿ nhánh:

1. T¿i bất cā thái điểm nào trong quá trình thực hián use case nÁu khơng

46

kÁt nái đ°āc vịi c só dữ liáu thì há tháng s¿ hiển thị thơng báo lỗi và

use case kÁt thúc.

2. T¿i b°ßc 4b nÁu ng°ái quÁn trịấn nút <Khơng= thì há tháng s¿ khơng

xóa sÁn phẩm đã chọn và chuyển về màn hình qn lý sÁn phẩm.

b. Bißu đã Basic Flow

47

Hình 31. Biểu đồ Basic Flow use case Qun Lý Sn Phm.

48

c. Bißu đã VOPC

Hình 32. Biểu đồ VOPC use case Qun Lý Sn Phm.

3.1.2.14 Use case <QuÁn lý đ¢n hàng=a. Mơ tÁ chi tiÁt a. Mô tÁ chi tiÁt

Tên use case: QuÁn lý đ¢n hàng.

Mơ tÁ v¿n t¿t: Use case này cho phép ng°ái quÁn trị có thể xem và sửa

tr¿ng thỏi Ân hng.

ã Luóng c bn:

1. Use case này bắt đầu khi quÁn trị viên kích vào nút <Đ¢n hàng= trên

menu quÁn trị. Há tháng s¿ hiển thị tất cÁ các đ¢n hàng và bộ lọc đ¢n

hàng theo 3 tr¿ng thái cÿa đ¢n hàng (đ¢n ch°a xử lý, đ¢n đã duyát, đ¢n

đã hÿy).

2. Xử lý đ¢n hàng

Há tháng s¿ hiển thịdanh sách các đ¢n hàng ch°a đ°āc duyát.QuÁn trị

Một phần của tài liệu Xây dāng website bán giày trāc tuyàn bàng vuejs và spring boot (Trang 30)