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

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 kì vọng sẽ dẫn đầu, tạo ra bước đi đột phá về khái niệmvận tải hàng hoá ở Việt Nam, phục vụ niềm tin của k

Trang 1

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 DELIVERYGIẢNG VIÊN HƯỚNG DẪN: ThS VÕ NGỌC TÂN

Trang 2

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

Xử lý backend, thiết

18520981 Đặng Ngọc Liêm kế và hiện thực dữ 100%

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

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

nhập, đăng kí, làmbáo cáo, slide

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

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

làm slide

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

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

Trang 3

MỤC LỤC

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

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

1.2 Công nghệ sử dụng 4

1.3 Kiến trúc 4

1.4 Dữ Liệu 4

CHƯƠNG 2 CÁC CHỨC NĂNG CHÍNH 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

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

2.4 Tạo đơn 9

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

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

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

2.8 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àng 19

2.8.3 Quản lý kho hàng 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

Trang 4

DANH MỤC HÌNH ẢNH

Hình 1: Sơ đồ dữ liệu của trang web 5

Hình 2: Form đăng nhập 6

Hình 3: Form đăng ký 7

Hình 4: Màn hình tra cứu đơn hàng 8

Hình 5: Màn hình component ước tính chi phí 8

Hình 6: Màn hình ước tính chi phí 9

Hình 7: Form tạo đơn 11

Hình 8: Chi tiết form tạo đơn 11

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

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

Hình 11: Chi tiết đơn hàng đã tạo 14

Hình 12: Chỉnh sửa form tạo đơn 14

Hình 13: Màn hình tra cứu bưu cục 15

Hình 14: Màn hình tra cứu bưu cục 15

Hình 15: Giao diện đăng nhập admin 16

Hình 16: Giao diện trang admin 16

Hình 17: Trang quản lý đơn hàng 17

Hình 18: Quản lý thông tin đơn hàng 17

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

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

Hình 21: Quản lý khách hàng 19

Hình 22: Tìm khách hàng tên Khôi 19

Hình 23: Quản lý kho hàng 20

Trang 5

DANH MỤC BẢNG

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

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

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

Bảng 4: So sánh với Viettel Post 22

Trang 6

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ừngtăng lên, thì 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ỗingà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ý domộ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 giaodị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ùngvớ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ưatin 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 kì vọng sẽ dẫn đầu, tạo ra bước đi đột phá về khái niệmvậ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á trình thực hiện đồ án, do kiến thức chuyên ngành còn hạn chế nênnhó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ópcủ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

Trang 7

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

………

Trang 8

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 kì sôi động, trong bốicả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 đó, tình hình kinh tế và đời sống của nhân dân Việt Nam đang dần đượcnâ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ácsà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

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

Trang 9

Dựa trên những chức năng này, nhóm chúng em đã triển khai một trang webvớ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 đơnhà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à

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ủauser đăng ký thường

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

Order(madonhang, makh,phi,trangthai,nguoinhan,diachinhan,image,diachidi): Lưuthông tin cơ bản của một đơn hàng

Trang 10

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

Trang 12

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ầnnhậ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

Trang 13

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à tình trạng đơn hàng một cách nhanh chóng bằng cách nhập mã nàyvà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ẽ đượchiển thị ngay bên dưới

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

Trang 14

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ỉnhthà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ủahà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 đã cungcấ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 cungcấ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 kì, khách hàng cần cung cấp các thông tinbắt buộc như sau:

Trang 15

STT Thông tin cung cấp Đơn vị tính Ghi chú

hàng hoá có trong một đơn hàng.Dịch vụ chuyển hàng, gồm có:

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

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

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

Trang 17

Dưới đây là hì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

Trang 18

Sau khi điền thông tin:

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

Trang 19

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 hình đơn hàng Bên đơn gửi, mỗi mục sẽ hiểnthị 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ôngtin người gửi

Hình 10: Kết quả sau khi tạo đơn thành công

Khi ấn vào mũi tên mỗi đơn hàng thì chi tiết của đơn hàng đó sẽ xuất hiện bêndưới Chi tiết đơn gồm có các thông tin như sau:

STT Thông tin cung cấp Ghi chú

1 Thông tin người gửi Bao gồm họ tên, số điện thoại, địa

Trang 20

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

Trang 21

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 hì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ấntì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 trongtỉ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ểnthị trên bản đồ và từ đó người dùng có thể xem đường đi đến bưu cục

Trang 22

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

Để sử dụng những chức năng phía quản lý, người dùng cần có tài khoản

được phân quyền quản lý

Hình 15: Giao diện đăng nhập admin

Sau khi đăng nhập thành công, người dùng sẽ được điều hướng đến trang dashboard:

Hình 16: Giao diện trang admin

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

Với chức năng quản lý đơn hàng, người quản lý có thể thể nắm bắt được tình hìnhcác đơn hàng được tạo trên hệ thống, như các trạng thái đơn hàng Người quản lýcũng có thể thay đổi trạng thái đơn hàng, hoặc xóa đơn hàng khỏi hệ thống

Trang 23

Hình 17: Trang quản lý đơn hàng

Hình 18: Quản lý thông tin đơn hàng

Trang 24

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

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

Ngoài ra, khi bấm vào nút Delete, đơn hàng sẽ bị xóa khỏi hệ thống

Trang 26

2.8.3 Quản lý kho hàng

Hình 23: Quản lý kho hàng

Người quản lý có thể quản lý thông tin thêm xóa sửa các kho hàng trong hệ thống

Trang 27

Tuy nhiên, trang web vẫn tồn tại nhiều thiếu sót, có thể kể đến như:

- Tốc độ tải trang còn chậm, load dữ liệu API đôi khi bị nghẽn do server backend miễn phí

- Các tính năng nâng cao chỉ dừng lại ở mức ý tưởng, chưa thể hiện thực hoá

- Tính thẩm mĩ của trang web chưa tối ưu hoá do thời gian hạn chế

- Và còn những thiếu sót nhỏ khác

3.3 So sánh với Viettel Post

Fast Delivery Viettel Post

Trang 28

Tạo đơn hàng online Có Có

Bảng 4: So sánh với Viettel Post

Trang 29

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

Trong khuôn khổ môn học, do kiến thức chuyên ngành còn đôi chút hạn chế nên đồ ánmôn học của nhóm có đơn giản hơn so với thiết kế ban đầu Vì vậy, trong thời gian tới,nhóm sẽ bổ sung thêm các tính năng độc đáo và nâng cao cho trang web Các chứcnăng này bao gồm:

- Thống kê tài chính: Ghi lại số liệu các giao dịch của khách hàng theo tuần, theotháng, quý và năm, từ đó đánh giá mức độ hoạt động và sử dụng của khách hàng

đối với trang web, đồng thời giúp khách hàng nắm bắt các khoản chi của mình

- COD (Thu hộ tiền hàng): Không chỉ đơn thuần là dịch vụ giao hàng, FastDelivery mong muốn tích hợp dịch vụ COD để giúp người gửi hàng có thể thu về giá trịtiền mặt của mặt hàng đã gửi cho người nhận theo cách nhanh chóng và an toàn tuyệt đối

- Vị trí thực của đơn hàng: Giúp khách hàng cũng như người quản trị theo dõi sát sao đơn hàng, để đưa ra các xử lý cần thiết khi cần sự giúp đỡ

- Giao hàng tận nhà: Với mong muốn đáp ứng người dân từ mọi miền đất nước,Fast Delivery đang lên kế hoạch xây dựng mô hình giao hàng tận nơi giống như các dịch

vụ như Grab, BEAMIN, đã thực hiện

Trang 30

TÀI LIỆU THAM KHẢO

[1]. React tutorial, address: https://reactjs.org, last access: 15/7/2021

[2]. Redux toturial, address: https://redux.js.org, last access: 17/07/2021

[3]. Simon Saliba, React and Node.js: Build a Full Stack App From Development

to Production in 5 Minutes, address: https://medium.com/swlh/react-and-node- a-full-stack-app-from-development-to-production-in-5-minutes-a03bc019df6b, lass

js-build-access: 15/07/2021

Định dạng
Số trang	30
Dung lượng	1,35 MB