Báo cáo cuối kỳ môn Kỹ thuật phát triển hệ thống web - Đề tài: Hệ thống vận tải hàng hoá

ĐẠI HỌC QUỐC GIA THÀNH PHỐ HỒ CHÍ MINH

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN

BÁO CÁO CUỐI KỲ

MÔN: KỸ THUẬT PHÁT TRIỂN HỆ THỐNG WEB

ĐỀ TÀI: HỆ THỐNG VẬN TẢI HÀNG HOÁ

FAST DELIVERY

GIẢNG VIÊN HƯỚNG DẪN: ThS. VÕ NGỌC TÂN

ĐẶNG NGỌC LIÊM

18520981

18520501

18520944

18521510

TRƯƠNG QUỐC BẢO

NGUYỄN MINH KHÔI

NGUYỄN LƯƠNG TOÀN

TP.HỒ CHÍ MINH, 2021

IE213.L21 – Kỹ thuật phát triển hệ thống web

BẢNG PHÂN CÔNG CÔNG VIỆC

MSSV

HỌ TÊN

NHIỆM VỤ

HOÀN THÀNH

Xử lý backend, thiết

kế và hiện thực dữ

liệu, làm báo cáo,

slide

18520981

Đặng Ngọc Liêm

100%

Xử lý tạo đơn, hiển

thị đơn hàng,đăng

nhập, đăng kí, làm

báo cáo, slide

18520501

18520944

18521510

Trương Quốc Bảo

100%

Các chức năng phía

Nguyễn Minh Khôi Admin, làm báo cáo,

làm slide

Tra cứu đơn hàng, tra

cứu kho hàng, đăng

Nguyễn Lương Toàn

nhập đăng kí, làm báo

cáo, slide

IE213.L21 – Kỹ thuật phát triển hệ thống web

MỤC LỤC

CHƯƠNG 1 T Ổ NG QUAN V Ề TRANG WE B ................................................................................ 3

Kh ả o sá t th ị trườ ng..................................................................................................3

Cô ng ngh ệ s ử d ụ n g .................................................................................................4

Ki ế n trúc ..................................................................................................................4

D ữ Li ệ u....................................................................................................................4

CHƯƠNG 2 CÁC CH ỨC NĂNG CHÍN H ........................................................................................ 6

2.1 Đă ng nh ập, đăng ký .................................................................................................6

2.1.1 Đăng nhậ p .........................................................................................................6

2.1.2 Đăng kí ..............................................................................................................7

2.2

Tra c ứu đơn hàng....................................................................................................8

Ước tính cướ c phí ...................................................................................................8

T ạo đơn ...................................................................................................................9

Hi ể n th ị đơn hàn g .................................................................................................. 13

C ậ p nh ậ t thông tin ngườ i dùn g .............................................................................. 14

Tra c ứu bưu cụ c .................................................................................................... 15

Cá c ch ức năng phía quả n l ý .................................................................................. 16

2.8.1 Qu ản lý đơn hàng ............................................................................................ 16

2.8.2 Qu ả n lý khá ch hàn g ......................................................................................... 19

2.8.3 Qu ả n lý kho hàn g ............................................................................................. 20

CHƯƠNG 3: KẾT LUẬN .................................................................................................................. 21

3.1 Ưu điể m ................................................................................................................. 21

3.2 Nhược điể m ........................................................................................................... 21

3.3 So sá nh v ớ i Viettel Post ......................................................................................... 21

CHƯƠNG 4: HƯỚ NG PHÁT TRI Ể N .............................................................................................. 23

TÀI LI Ệ U THAM KH Ả O .................................................................................................................. 24

IE213.L21 – Kỹ thuật phát triển hệ thống web

DANH MỤC HÌNH ẢNH

H ꢀ nh 1 : Sơ đồ d ữ li ệ u c ủ a trang web ..........................................................................................5

H ꢀnh 2: Form đăng nhậ p.............................................................................................................6

H ꢀ nh 3: F orm đăng ký .................................................................................................................7

H ꢀ nh 4: Màn hình tra c ứu đơn hàng ............................................................................................8

H ꢀ nh 5 : Màn hꢀnh component ướ c tính chi phí...........................................................................8

H ꢀnh 6: Màn hꢀnh ướ c tính chi phí .............................................................................................9

H ꢀ nh 7: Form t ạo đơn ...............................................................................................................11

H ꢀ nh 8: Chi ti ế t form t ạo đơn ...................................................................................................11

H ꢀ nh 9: Form t ạo đơn với đầy đủ thông ti n ..............................................................................12

H ꢀ nh 10: K ế t qu ả sau khi t ạo đơn thành công ..........................................................................13

H ꢀ nh 11: Chi ti ết đơn hàng đã tạ o.............................................................................................14

H ꢀ nh 12: Ch ỉ nh s ử a form t ạo đơ n .............................................................................................14

H ꢀ nh 13: Màn hình tra c ứu bưu cụ c..........................................................................................15

H ꢀ nh 14: Màn hình tra c ứu bưu cụ c..........................................................................................15

H ꢀ nh 15: Giao di ện đăng nhậ p admin.......................................................................................16

H ꢀ nh 16: Giao di ệ n trang admin ...............................................................................................1 6

H ꢀ nh 17: Trang qu ản lý đơn hàng .............................................................................................17

H ꢀ nh 18: Qu ản lý thông tin đơn hàn g .......................................................................................17

H ꢀ nh 19: Ch ỉ nh s ử a tr ạng thái đơn hàng ...................................................................................18

H ꢀ nh 20: Tr ạng thái đơn hàng sau khi chỉ nh s ử a......................................................................18

H ꢀ nh 21: Qu ả n lý khách hàn g ...................................................................................................19

H ꢀ nh 22: Tìm khách hàng tên Khôi ..........................................................................................19

H ꢀ nh 23: Qu ả n lý kho hàng ......................................................................................................20

IE213.L21 – Kỹ thuật phát triển hệ thống web

LỜI MỞ ĐẦU

Ngày nay, khi mà trên nhu cầu vận chuyển hàng hoá của con người không ngừng

tăng lên, thꢀ cuộc chạy đua giữa những thương hiệu vận chuyển hàng hoá ngày một trở

nên khốc liệt. Những công nghệ mới liên tục được áp dụng, những thuật toán ra đời mỗi

ngày để đẩy nhanh tốc độ trao đổi hàng hoá, nhằm đổi lại sự trung thành của khách hàng.

Tuy vậy ở Việt Nam cuộc cạnh tranh này còn chưa thật sự bùng nổ như mong đợi, lý do

một phần nằm ở việc các công ty vận tải còn chưa đáp ứng đủ số lượng và chất lượng

giao dịch theo các tiêu chuẩn quốc tế. Hạ tầng còn yếu kém, khâu quản lý thiếu chặt chẽ

cùng với đó là hệ thống công nghệ thông tin chưa được hoàn thiện đã khiến khách hàng

chưa tin tưởng tuyệt đối nơi các dịch vụ vận tải. Nắm bắt được lý do đó, nhóm đã triển

khai một hệ thống vận tải hàng hoá – được kì vọng sẽ dẫn đầu, tạo ra bước đi đột phá về

khái niệm vận tải hàng hoá ở Việt Nam, phục vụ niềm tin của khách hàng cả nước.

Đồ án này gồm 4 phần:

Chương 1: Tổng quan về trang web.

Chương 2: Các chức năng chính.

Chương 3: Kết luận.

Chươgn 4: Hướng phát triển

Trong quá trình thực hiện đồ án, do kiến thức chuyên ngành còn hạn chế nên nhóm

chúng em vẫn còn nhiều thiếu sót. Rất mong nhận được sự quan tâm, đóng góp của thầy

để đồ án của chúng em được đầy đủ và hoàn chỉnh hơn.

Cuối cùng xin kính chúc thầy dồi dào sức khỏe và thành công trong sự nghiệp cao

quý.

Thành phố Hồ Chí Minh, tháng 7 năm 2021

Nhóm sinh viên thực hiện

1

IE213.L21 – Kỹ thuật phát triển hệ thống web

NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN

……………………………………………………………………………………………………………

2

IE213.L21 – Kỹ thuật phát triển hệ thống web

CHƯƠNG 1 TỔNG QUAN VỀ TRANG WEB

1.1 Khảo sát thị trường

Hiện nay, thị trường vận chuyển hàng hóa đang cực kꢀ sôi động, trong bối cảnh

Việt Nam đang dần tiến vào con đường hội nhập với các cường quốc trên thế giới. Bên

cạnh đó, tꢀnh hꢀnh kinh tế và đời sống của nhân dân Việt Nam đang dần được nâng cao.

Với nhu cầu ngày mua hàng trực tuyến và giao hàng tận nhà ngày càng tăng, dẫn đến

thị trường vận tải hàng hóa không còn gói gọn trong các thành phố lớn, mà dần mở rộng

khắp các tỉnh thành trên toàn quốc.

Trên thị trường Việt Nam hiện nay có khá nhiều các công ty cung cấp hệ thống

vận tải hàng hóa khắp trên các tỉnh thành. Trong đó, quen thuộc nhất là các công ty như

Viettel Post, Giao Hàng Nhanh, Giao Hàng Tiết Kiệm, Chuyển Phát Nhanh… Các công

ty này thường cung cấp cho các khách hàng – thường là các đại lý hoặc các sàn thương

mại điện tử, các chức năng cơ bản của một hệ thống vận tải, như:

Viettel Post

Giao hàng nhanh Giao hàng tiết kiệm

Giao hàng nhanh,

giao hàng tiết kiệm,

giao hàng hoả tốc

Giao hàng nhanh, Giao hàng tiết kiệm,

Giao hàng

giao hàng tiết kiệm

giao hàng hoả tốc

App

Có

Thu hộ

Tra cứu hành trình

Có

đơn hàng

Tra cứu kho hàng

Thống kế tài chính

Có

Không

Bꢀng 1: Khꢀo sát 3 loại hình dịch vụ: Viettel Post, GHN và GHTK

3

IE213.L21 – Kỹ thuật phát triển hệ thống web

Dựa trên những chức năng này, nhóm chúng em đã triển khai một trang web với

các chức năng cơ bản như: Đăng nhập, đăng kí, tạo đơn hàng, quản lí, tra cứu đơn hàng,

tra cứu kho lưu trữ.

1.2 Công nghệ sử dụng

Ứng dụng được phát triển sử dụng ReactJS và Redux để thiết kế giao diện, khi

mà cả hai đang nổi lên là những framework có tính linh hoạt cao, dễ dàng tiếp cận và

xử lý.

Trong khi đó, nhóm chọn MySQL làm cơ sở dữ liệu để phù hợp với quy mô của

đồ án môn học. Ngoài ra, NodeJS cũng được nhóm sử dụng để thao tác với dữ liệu từ

back-end nhằm tải dữ liệu lên giao diện của trang web.

1.3 Kiến trúc

Ứng dụng được tổ chức theo kiến trúc Model – View – Controller (MVC) trong

ứng dụng Android. Khi View được tác động từ người sử dụng, một Event sẽ được trigger

đến Controller. Controller chịu trách nhiệm tính toán, nếu cần thiết sẽ truy xuất dữ liệu

trên Model. Model chịu trách nhiệm tương tác với dữ liệu trả về, ở đây là dữ liệu từ API

trả về, sau đó chuyển dữ liệu đó cho Controller. Controller sau khi xử lí dữ liệu sẽ kết

xuất dữ liệu chuyển đến View.

1.4 Dữ Liệu

Dữ liệu của hệ thống được lưu vào MySQL – một hệ quản trị cơ sở dữ liệu mã

nguồn mở, bao gồm một số bản chính như:

Khachhang(makh,tenkh,sdt, diachi): Lưu thông tin của khách hàng

User(madn, username, password, makh, refeshtoken): Lưu thông tin đăng nhập của user

đăng ký thường

Userbygoogle(logincode,username,makh,refeshtoken):Lưu thông tin đăng nhập của

user đăng nhập bằng Google

Order(madonhang, makh,phi,trangthai,nguoinhan,diachinhan,image,diachidi): Lưu

thông tin cơ bản của một đơn hàng

4

IE213.L21 – Kỹ thuật phát triển hệ thống web

Orderdetail(mact, madonhang, chieucao, cannang, loaidonhang, loaigiaohang, tensp,

soluong):Lưu thông tin chi tiết của các mặt hàng trong đơn hàng

Kho(makho, tenkho, diachi, tinh, vido, kinhdo): Lưu thông tin của một kho

Và còn các bảng phụ dùng để bổ sung thông tin cho các bảng chính.

Sơ đồ giao diện:

Hꢁnh 1: Sơ đồ dữ liệu của trang web

5

IE213.L21 – Kỹ thuật phát triển hệ thống web

CHƯƠNG 2 CÁC CHỨC NĂNG CHÍNH

2.1 Đăng nhập, đăng ký

2.1.1 Đăng nhập

Hꢁnh 2: Form đăng nhập

Người dùng đăng nhập bằng tài khoản đã đăng kí trên Fast Delivery, bao gồm email và

mật khẩu.

6

IE213.L21 – Kỹ thuật phát triển hệ thống web

2.1.2 Đăng kí

Hꢁnh 3: Form đăng ký

Người dùng đăng kí tài khoản Fast Delivery bằng email và mật khẩu, mật khẩu

cần nhập hai lần và trùng khớp với nhau. Mỗi email chỉ đăng kí được một lần duy nhất.

7

IE213.L21 – Kỹ thuật phát triển hệ thống web

2.2 Tra cứu đơn hàng

Hꢁnh 4: Màn hình tra cứu đơn hàng

Khi gửi hàng thành công, người dùng sẽ được cung cấp một mã vận đơn.

Có thể tra cứu thông tin và tình trạng đơn hàng một cách nhanh chóng bằng cách nhập

mã này vào ô “Mã phiếu gửi” và nhấn nút “Tra cứu”.

Thông tin chi tiết về đơn hàng như: Chi phí, người nhận, địa chỉ, trạng thái... sẽ được

hiển thị ngay bên dưới.

2.3 Ước tính cước phí

Hꢁnh 5: Màn hꢁnh component ước tính chi phí

8

IE213.L21 – Kỹ thuật phát triển hệ thống web

Hꢁnh 6: Màn hꢁnh ước tính chi phí

Người dùng có thể ước tính chi phí gửi hàng bằng cách chọn tỉnh thành gửi, tỉnh

thành nhận và trọng lượng hàng hóa vào form ở trang chủ hoặc trong trang ước tính.

Máy tính sẽ tính toán dựa trên khoảng cách giữa hai tỉnh thành và khối lượng của

hàng hóa rồi trả về cho người dùng chi phí và thời gian ước tính của cả hai dịch vụ

(chuyển phát nhanh và chuyển phát thường).

2.4 Tạo đơn

Fast Delivery tổ chức tạo mới các đơn hàng nhằm gửi đi yêu cầu của khách hàng

về các mặt hàng có nhu cầu và mong muốn gửi đến các điểm đến xa xôi, nằm ngoài vị

trí địa lý có thể gửi hàng cho người nhận của khách hàng. Khi khách hàng tạo mới một

đơn hàng, ứng dụng sẽ ngay lập tức ghi nhận toàn bộ thông tin mà khách hàng đã cung

cấp có liên quan đến đơn hàng. Tất cả những thông tin đó đều được bắt buộc phải cung

cấp nhằm đảm bảo tính chính xác tuyệt đối với đơn hàng được khách hàng giao ký gửi,

cũng như đảm bảo thông tin giao dịch giữa khách hàng (người gửi), người tiếp nhận và

đơn vị thứ ba như Fast Delivery được minh bạch và công khai rõ ràng.

Cụ thể, khi tạo mới một đơn hàng bất kì, khách hàng cần cung cấp các thông tin

bắt buộc như sau:

9

IE213.L21 – Kỹ thuật phát triển hệ thống web

STT Thông tin cung cấp

Đơn vị tính

Ghi chú

Bao gồm họ tên người gửi, SĐT

và địa chỉ liên lạc.

1

2

3

4

5

Thông tin người gửi

Thông tin người

nhận

Bao gồm họ tên người nhận, SĐT

và địa chỉ liên lạc.

Mô tả loại/tên cụ thể của hàng hoá

được gửi.

Tên hàng hoá

Trọng lượng hàng

Tổng trọng lượng của hàng hoá

được gửi đi.

kg

hoá

Số lượng hàng hoá của một loại

hàng hoá có trong một đơn hàng.

Dịch vụ chuyển hàng, gồm có:

Giao hàng nhanh, Giao hàng tiết

kiệm và Giao hàng hoả tốc.

Ảnh chụp mô tả về hàng hoá bên

cạnh các thông tin trong mục (3)

Số lượng hàng hoá

Dịch vụ hàng hoá

Ảnh chụp hàng hoá

Chiếc

6

7

Bꢀng 2: Thông tin cần cung cấp khi tạo đơn

10

IE213.L21 – Kỹ thuật phát triển hệ thống web

Dưới đây là hꢀnh ảnh về giao diện của danh mục tạo đơn hàng mới:

Hꢁnh 7: Form tạo đơn

Form thêm mới hàng hóa:

Hꢁnh 8: Chi tiết form tạo đơn

11

IE213.L21 – Kỹ thuật phát triển hệ thống web

Sau khi điền thông tin:

Hꢁnh 9: Form tạo đơn với đầy đủ thông tin

12

IE213.L21 – Kỹ thuật phát triển hệ thống web

2.5 Hiển thị đơn hàng

Sau khi tạo đơn thành công, thông tin các đơn gửi cũng như đơn nhận sẽ được ứng

dụng lưu lại và hiển thị trong màn hꢀnh đơn hàng. Bên đơn gửi, mỗi mục sẽ hiển thị mã

đơn hàng, tên, số điện thoại, địa chỉ người nhận và trạng thái hiện tại của đơn. Tương tự

đối với bên đơn nhận, chỉ thay chỗ hiển thị thông tin người nhận bằng thông tin người

gửi.

Hꢁnh 10: Kết quꢀ sau khi tạo đơn thành công

Khi ấn vào mũi tên mỗi đơn hàng thì chi tiết của đơn hàng đó sẽ xuất hiện bên

dưới. Chi tiết đơn gồm có các thông tin như sau:

STT

Thông tin cung cấp

Thông tin người gửi

Ghi chú

1

Bao gồm họ tên, số điện thoại, địa

chỉ

2

3

Danh sách hàng hóa

Tên hàng hóa, trọng lượng, số lượng

Hình ảnh hàng hóa

Bꢀng 3: Thông tin về một đơn hàng

13

IE213.L21 – Kỹ thuật phát triển hệ thống web

Hꢁnh 11: Chi tiết đơn hàng đã tạo

2.6 Cập nhật thông tin người dùng

Người dùng có thể chỉnh sửa hoặc cập nhật những thông tin cá nhân còn thiếu để

phục vụ cho việc tạo đơn.

Hꢁnh 12: Chỉnh sửa form tạo đơn

14

IE213.L21 – Kỹ thuật phát triển hệ thống web

2.7 Tra cứu bưu cục

Hꢁnh 13: Màn hình tra cứu bưu cục

Tính năng tra cứu bưu cục gợi ý một vài bưu cục tiêu biểu (thanh bên trái hình 2.4)

và bản đồ đường đi.

Hꢁnh 14: Màn hình tra cứu bưu cục

Người dùng có thể nhập tên tỉnh thành muốn tra cứu vào thanh search và nhấn

tꢀm kiếm, danh sách tên bưu cục kèm địa chỉ và số điện thoại của các bưu cục trong

tỉnh thành đó sẽ được hiển thị ở thanh bên trái.

Ngoài ra, người dùng có thể định vị đến vị trí hiện tại bằng cách nhấn vào icon định vị

(mũi tên màu xanh chỉ đến), các bưu cục xung quanh vị trí của người dùng sẽ hiển thị

trên bản đồ và từ đó người dùng có thể xem đường đi đến bưu cục.

15