Xây dựng website bán trái cây

Tu FA tưởng áp dÊØng công nghệ thông tin vào việc quản IỄÃ, bớt phần gánh nặng về số sách cũng như đầu óc con người, đồ án này hướng đến xây dựng một phan mém quan 1f#A ban hang, ap don

ĐÈ TÀI:

XÂY DỰNG WEBSITE BÁN TRÁI CÂY

GVHD: Th.S Bui Thi Thanh Tú

SVTH: Dương Hỗ Tan Phat

Trần Ngọc Hải

Ngành: Công Nghệ Thông Tin

ĐÈ TÀI:

XÂY DỰNG WEBSITE BÁN TRÁI CÂY

GVHD: Th.S Bui Thi Thanh Tú

SVTH: Dương Hỗ Tan Phat

Trần Ngọc Hải

Ngành: Công Nghệ Thông T

DANH SÁCH BẢNG 2225-2222112222112221112221112111112211112212.111201 re i DANH SACH HINH Lu ceceeccccssssecsssseccsseecessceceseeeceseeeeeseeesseeesineeesinieessteesnetseaneeee ii DANH MỤC TỪ VIẾT TAT ieee csssscssssssssseessseessseessseeesseessseessssesssiessieessessieeeessnetss iii

5m .:ổả.H Microsoft SQL Server la gi?

Hinh 1.5: Đặt tén cho windows form C# 0.0 cece cececeeeseeeeeeeecsecteetsseceesaceaeesececeenes 10

CHƯNG 2' - S122 2212121111112111 111111111111 11111 2111111101111 0 1 HH1 11111 ra 11

CƠ SỞ LÝ LUẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU -:-5c55 : 11

2.1 Tỉnh hình, nhu cầu và xu hướng phát triỂn - - 2 22sccz 222222 2zcze ll

Hinh 2.1: Quy trình thanh toán với khách hàng 5: 2222222222222 2222czxxs2 13

CHƯNG 3: 2252 122122112211211121122112221 2221212121212 12121 14 GIỚI THIỆU TÔNG QUAN VẤN ĐÈ NGHIÊN CỨU - 5 s22 2e 14 3.1 Mô hình ứng đẾ#Øng 22 22212212111 2222.01121 221g 14 Hình 3.1: Mô hình ứng dẴŠŠØng 2 5 S31 2111211111111111111 2110112111112 1n 1 Hrdg 14 3.2 Yêu cầu hệ thống S1 21221112211 1211 2121112112111 11g 14

cm .ääŒ:€ Yêu cầu lưu trữ

Hình 4.2: Sơ đỗ hoạt động quá trình nhập kho - 2-5222 SE E1 5212122221212 2x6 19

42 Mô hình quan hệ ERD - 2: 22 22112212221 251 115115531511 111 1155281218 1s 20

"“ÔÔÔ Bảng Hóa Đơn

G1111111 111111111111 111111111111 11111 1110 1111111111111 1111111 111101111116 11 1110 111101101 710117111 E1 22 Bảng 4.6: CSDL đơn vị sản phâm 2-5 s91 211221211211 11112111 2212211 x He 22

LỘ HH HH HH1 1e Code form đăng nhập

C111111111 1111111111111 11 111111 111111111111 11 11111111111 1111111 1111111011111 11 11111101111 1111 11 11 11100111 6 24

AAA .Ả Giao diện đăng nhập

C111111111 1111111111111 11 111111 111111111111 11 11111111111 1111111 1111111011111 11 11111101111 1111 11 11 11100111 6 24

Hinh 4.7: Giao diện đăng nhập - 2 0201121121111 1122112211211 1811111 1101111 rrờ 24 h Giao diện trang chủ

C111111111 1111111111111 11 111111 111111111111 11 11111111111 1111111 1111111011111 11 11111101111 1111 11 11 11100111 6 25

“" Giao dién form quan 1f#A hoa don (don hang) eeececacsaceceaecsesecseceeescaecaeeeceecaesaeeecsesaesecsecseceeaecaeceecesaeeeesssecaeeecueeseeeeueeeeseeseeeeees 26 Hình 4.10: Giao điện quản lỄỄÄ hóa đơn - - S121 22122211 1221211212 111 xe 26

LÁT chat Giao diện form nhập kho

C111111111 1111111111111 11 111111 111111111111 11 11111111111 1111111 1111111011111 11 11111101111 1111 11 11 11100111 6 26 Hình 4.11: Giao diện quản liỄA nhập kho - 5222222121 11212121221212121 212122 xe 26

C111111111 1111111111111 11 111111 111111111111 11 11111111111 1111111 1111111011111 11 11111101111 1111 11 11 11100111 6 27 Hình 4.12: Giao điện quản IỄÃ tồn kho - 5Ì S1 2 11211212111112112122 11 xe 27

C111111111 1111111111111 11 111111 111111111111 11 11111111111 1111111 1111111011111 11 11111101111 1111 11 11 11100111 6 27 Hình 4.13: Giao điện thông kê 22-1 1 1E 11111211111110112112122112 12 2c cry 27 xa Giao diện form quản If#A loai sản phẩm C111111111 1111111111111 11 111111 111111111111 11 11111111111 1111111 1111111011111 11 11111101111 1111 11 11 11100111 6 28 Hình 4.14: Giao điện quản IỆÃ loại sản phẩm 5 1 2E 1122127111212 1g 28

m“.' Giao diện trang quản lỄA cra hàng

C111111111 1111111111111 11 111111 111111111111 11 11111111111 1111111 1111111011111 11 11111101111 1111 11 11 11100111 6 28 Hình 4.15: Giao diện trang quản liỆÃ cra hàng 5 2S 2E 2221555281 1522222 2 28 9:19) 65111 29 KẾT LUẤpN VÀ HƯỚNG PHÁT TRIỂN - 5 SE 1211 1111 1111211 xu 29 5.1 Kếtluâm L2 HH HH tra 29

sẽ 29

ITBIT-)0151:ï:18:3¡7:1;5ããạaIiớốÝỶÝỶÝÁÝỶẢ 31

DANH SÁCH BẢN

Bảng 3.1: Bảng liệt kê các tác nhân 20 22 22212212221 1211 1211511111121 821 8 xay

Y

Bảng 4.1: CSDL hóa đơn

Y

Hinh 1.2: Giao dign Microsoft SQL Server Management Hình 1.3: Giao dién Visual Studio 2019.00

Hinh 1.4: Tao proJect windows ÍorIm Cổ - cà c1 1112 1111111111111 1111 11111 1kg 9

Hinh 1.6: Thiết kế chương trình windows form cổ 2225 2s222232222212 21222 x2 10

Hình 3.1: Mô hình ứng dẴŠŠØng 2 5 S31 2111211111111111111 2110112111112 1n 1 Hrdg

Hình 4.2: Sơ đỗ hoạt động quá trình nhập kho - 2-5222 SE E1 5212122221212 2x6 19

Hinh 4.4: Code form trang, chủ c2 2212111211211 121 112112211811 181 111111811111 23

Hinh 4.7: Giao diện đăng nhập - 2 0201121121111 1122112211211 1811111 1101111 rrờ 24

Hình 4.10: Giao diện quản lỄỄÄ hóa đơn 22 2222222121 12212111221212122 te

Hình 4.11: Giao diện quản liỄA nhập kho - 5222222121 11212121221212121 212122 xe

Hình 4.12: Giao điện quản IRỄ#FÃ tồn kho 255 2S 222 1227121221221127121122122 xe

Hình 4.13: Giao điện thông kê

Hình 4.14: Giao điện quản IỆÃ loại sản phâm

Hình 4.15: Giao diện trang quản liỆÃ cra hàng 5 2S 2E 2221555281 1522222 2

LỜI MỞ ĐẦU

Sự phát triển như vũ bão của ngành công nghệ thông tin kéo theo đó là các dich va mang ngay cang phat triển, mở rộng và hoàn thiện hơn, tuy van ton tai nhiéu khuyét diém song không ít tiện lợi từ công nphệ đem lại cho xã hội loài người

sự nhanh chóng và chính xác Thư điện tr dần thay thế thư tay, các cuộc hội nghị truyền hình với âm thanh hình ảnh trực tiếp giúp linh hoạt hóa công việc của tổ chức, đoàn thể Một trong những lĩnh vực đang được ứng dÃ#2ng tin học hóa rất phổ

biến ở nước ta là lĩnh vực quản IRỄÃ Tin học hóa trong quản IR#Ã đã giúp cho các nhà

quản lỄA điều hành công việc một cách khoa học, chính xác và hiệu quả Tất cả các

cơ quan, công ty, tô chức đều muốn tin học hóa vào các hoạt động cua minh

Dựa trên kiến thức lap trinh Visual Studio Code, sy da dạng của các dịch vo mạng với nhiều tính nang va doi hoi ngay cang cao Tu FA tưởng áp dÊØng công nghệ thông tin vào việc quản IỄÃ, bớt phần gánh nặng về số sách cũng như đầu óc con

người, đồ án này hướng đến xây dựng một phan mém quan 1f#A ban hang, ap dong

cho các công ty hay cra hàng bách hóa, vật tư Giúp các công ty có thế đễ dàng hơn trong công việc quản llỄA hàng hóa của công ty hay cra hàng mình

Trong quá trình xây dựng chương trình không tránh khỏi sai sót kính mong các thầy cô và các bạn đóng gop FEA kiến xây dựng đề chương trình có thế hoàn thiện hơn

CHUONG 1:

GIOI THIEU 1.1 Giới thiệu về Visual Studio Code và Anular

1.1.1 Giới thiệu về Visual Studio Code là gi?

Đối với nhiều lập trình viên, trình soạn thảo code là một công, c2 không thể thiếu trong quá trình xây dựng các ứng dÊØng web Ưu điểm của chúng là dung lượng khá nhẹ, ít tôn RAM và được tích hợp các tính năng gân gidng với IDE Trong đó, Visual Studio Code la cai tén quen thuộc nhất với dân LT hiện nay

Visual Studio Code (V§ Code) là một trình soạn thảo mã nguồn mở gọn nhẹ nhưng

có khả năng vận hành mạnh mẽ trên 3 nên tảng là Windows, Linux và macOS được phát triên bởi Microsoft Nó hồ trợ cho JavaScript, Node.Js và TypeScript, cũng như cung cấp một hệ sinh thái mở rộng vô cùng phong phú cho nhiều ngôn ngữ lập trình

khác

Có thể nói, V§ Code là sự kết hợp giữa một trình soạn thảo mã nguồn với những céng c#€o phat triển manh mé nhu Git, Debug hay Syntax Highlighter

Do tên gọi khá tương đồng nên có nhiều người nhằm lẫn giữa Visual Studio Code

va Visual Code Trên thực tế, chúng hoàn toàn khác nhau

phát triên tích hợp

Windows hoặc Mac (đây là 2 sản phâm khác nhau)

« - Tốc độ của VS Code được đánh giá là nhanh hơn so voi Visual Studio

« - Kích thước tải xuống của V§ Code nhỏ hơn Visual Studio

VS Code được xây dựng dựa trên Electron, kết hợp các công nghệ web như Node.js

và JavaScript với tốc độ và sự linh hoạt của các ứng dong géc Ngoai ra, kiến trúc dich ve céng c#¥e cua VS Code giúp nó tích hợp được với các công nghệ hỗ trợ Visual Studio nh Roslyn cho NET, TypeScript, céng c#@ gỡ lỗi Visual Studio Nhờ những ưu điểm nôi bật của mình, VS Code trở thành một trong những sự lựa chon hang dau cua rât nhiều lập trình viên, øiúp đảm bảo tiên độ và đạt hiệu quả công việc cao Nêu bạn đang tìm kiêm câu trả lời cho thắc mặc Visual Studio Code

là gì và vì sao nên dùng trình soạn thảo mã nguồn nảy thì đây chính là bài viết dành

cho bạn

1.1.2 Angular

1.1.2.1 Tong quan về Angular

Angular là một javascript framework do google phát triển đê xây dựng các Single Page Application (SPA) bang JavaScript, HTML va TypeScript Angular cung cap các tính năng tích hợp cho animation, http service va co cac tinh nang nhvu auto- complete, navigation, toolbar, menus Code duoc viết bằng TypeScript, biên dich thành JavaScript và hiển thị tương tự trong trình đuyệt

Đề học được angular thi ban cần biết các kiến thức cơ bản sau:

® CSS

1.1.2.1.1.1 Những gì bạn có thể tao ra tir Angular

Sau day chung tdi sé hudéng dan ban tao mot tng dong Angular dé quan 1f#A, chinh

sra va xr 1f#A tac ve voi Angular

Điều kiện bắt buộc

Trước khi cài đặt Angular, bạn nên kiêm tra những yếu tố sau đây:

© Node.7s: các phiên bản LTS của Node.js bắt buộc đang hoạt động hoặc được bảo trì tam thoi Dé kiém tra LTS, hay mo tép package.json va xem engines

Dé xem thong tin cai dat Node.js, mo tép nodejs.org Dé kiêm tra phiên ban Node.js có đang hoạt động trên hệ thống hay không, hãy chạy lệnh “node -v”

cho Angular nhiéu tính năng quản IR#Ã cac ing dong, ban can phai cé trinh

quan 1f#A g6i npm Angular Huong dan nay sr dong giao dién dong lénh npm

client Để kiểm tra npm client đã được cài trên máy chủ hay chưa, hãy vào cra số dong lệnh chạy lệnh Node.Js npm -v

s* Làm quen với ứng dong Angular

Trong mỗi ứng dÃ#Øng Angular, CLI sẽ tạo bốn tệp thành phần bao gồm mẫu, kiểu vả

lớp thông qua lệnh: src/app

1 app.module.ts: Chi định các tệp của ứng dSŠZng làm hoạt động chính

2 app.component.(s: Các bộ phận lớp chứa logic trên trang chính của ứng

d#ene

3 app.component.html: Các bộ phận mẫu chứa HTML cho phép theo dõi nội dung của tệp trong trình duyệt “AppComponenf”

các kiêu áp dẤ#Øng cho các thành phần c2 thế của ứng d##Øng “AppComponent Angular CLI cũng sẽ tạo tệp cho phép kiểm tra các thành phần, nếu không cần thiết

có thê bỏ qua băng lệnh app.componenf.spec.(s

Visual Studio 2019 với sự cải thiện toàn diện cả về giao dién thao tac va higu suat Giao dién Start cing tro nén don gian va dé dang hon, thao tac nhanh, man hinh chon template code cũng được cải thiện, vùng soạn thảo code được mở rộng,

không gian hơn, trải nghiệm tìm kiếm mới, trình debug thông minh hơn Hơn thể

nữa, tất cả những tính năng trên đều có thê hoạt động với cả những project đã tồn tại hoadc mét project mdi - tir cac img dong C++ da nén tang, cho toi ing dong NET cho Android va iOS sr d&@ng Xamarin hay nhitng ing dong sr dong nén tang dam mây với dịch vWš2 Azure

Hinh 1.3: Giao dién Visual Studio 2019

Cách tạo Visual C# Winform project:

Bước l1: Mở visual studio 2019 lên và chọn Create a new project, tiếp theo lựa chọn

Windows Form App (.NET Framework)

Create a new project

Recent project templates Allanguages Allplaforms All project types

Pe Ue el Po) ee SS Windows

NETG

Cà ÀÁU hat can run on NET Coreo ñndows, Linux and

lau macOS Test VisualBaic Meb Windcws orms App (.NETFrametvork)

l =:

DI No

r Foundation client application

Windows Bal

Hinh 1.4: Tao project windows form c#

Bước 2 : Đặt tên cho proJect chọn nơi lưu sau đó bam Create

Configure your new project

Windows Forms App (.NET Framework) © — Desktop — windows

Hình 1.5: Đặt tên cho windows form c#

Bước 3: kéo thả các chức năng từ tab toolbox vảo form đê thiết kế giao diện cho

Hình 1.6: Thiết kế chương trình windows form c#

CHƯƠNG 2:

CƠ SỞ LÝ LUẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU

Cùng với sự phát triển của các cra hang tiện lợi, cra hàng dịch vÊ2 hiện nay trên thị trường, nhu cầu cần quản IỄà số lượng lớn thông tin ngày càng cao

Hiện trạng quản I##Ã thu chi thủ công hiện nay có một số hạn chế sau:

nhằm lẫn

© _ Quản lỄA hàng hóa, số lượng, nhập xuất kho số lượng lớn nếu sơ #ỆÃ bị tây xoá

sẽ rất mat thời gian và không chính xác

® Khi cấp trên cân những thông tin về tình hình cũng như hiện của từng hảng hóa sô lượng - tồn, nhân viên phải đi lại khá vất vả

e Phiéu BA kién khach hàng lưu trữ công kénh, nhan vién ngai ghi chép lai, anh

hưởng đến kinh tế của công ty

người quản IỄÃ đều có mong muốn được áp d#iong công nghệ tin học vào trong, công tác quản IÑỄ#Ã Xuất phát từ nhu cầu thực tiễn đó, em đã mạnh dạn xây

dựng phần mềm với chức năng chính là quản IỄ#Ä bán hàng nhằm giúp người

quản IỄÃ cập nhật thông tín hàng hóa một cách nhanh chóng, đề từ đó có thể kinh doanh hiệu quả hơn

2.2 KIÃt quả của phần mềm

cho:

e Đối với nhân viên:

- Dang nhap

- Quan 1##A đơn hàng (hóa đơn)

- Quan 1f#A nhập kho

- Quản 1REA tồn kho

- Thống kê hóa đơn, doanh thu, hàng hóa

- Quản HA hàng hóa, tỉnh trạng số lượng

- Tìm kiếm theo tên hàng hóa, mã hàng

e Đối với admin:

- Sr dong diroc tat ca chire nang cua phan mém

- Quản IỆA thông tin nhân viên

- Quản IỆA thông tin cra hàng

- Quản IỆA thông tin khách hàng

2.3 Đặc ta bài toán

Một cra hàng cần tự động hóa trong quy trình quản IỆÃ Do đó nhu cầu xây dựng

phần mềm quản 1f#$A ban hang là một nhu cau tất yếu

Sau khi tìm hiểu em đã nắm được những thông tin chính cần xây dựng cho phan

mém quan 1f#A ban hang nhu sau:

Ban hang

Nhân viên nhập mã, hoặc tên sản phâm, sô lượng cân ban cho khách hang va bam thanh toán Sô lượng sản phẩm tôn tronp kho cùng sẽ được trừ theo hóa đơn

Quản lý hóa đơn

Tất cả thông tin về các sản phâm bán cho khách hàng, mã hàng, số lượng, tiền đã thanh toán và tên nhân viên thanh toán Có thể tìm kiếm theo mã hóa đơn, tên khách

hàng hoặc xuất hóa đơn

Quản lý nhập kho

Chức năng nay dùng cho việc nhập thông tin về sản phẩm, số lượng mỗi khi có hàng mới đề chuyên vào kho hàng Có thế thêm sra xóa, tìm kiếm hoặc xuất file excel

Quan ly ton kho

Chức năng nảy quản HA thông tin về số lượng hàng hóa còn trong kho hoặc đề điều chỉnh giá bán, khuyến mãi giảm giá nếu có

Quản lý thông tin về công ty, cửa hàng

Chỉ quản trị viên mới có thể truy cập chức năng nảy, phần này cho phép admin có thê

- Quản li thông tin về cra hang in trén hoa don ban hang: tén cra hang, số điện thoại, địa chỉ kê cả logo phần mềm

- Quản IRỄÃ thông tin nhân viên: quản IRỄÃ tài khoản dùng để đăng nhập của nhân viên,

có thê chỉnh sra thông tin và đổi mật khâu nếu cần thiết

- Quan If$A théng tin khách hàng: hiển thị thông tin của những khách hàng đăng ki 1a

thành viên của cra hàng Gồm có tên, địa chỉ, số điện thoại Email của khách hàng

2.4 Quy trình hoạt động chức năng bán hàng

Nhân viên cra hang sr d#@ng tai khoan do admin (chu cra hàng) cung cấp đăng nhap dé sr dong phan mém Trang chu sé la trang chính cho việc bán hàng, tại day

nhân viên sẽ nhập tên sản phâm hoặc mã sản phẩm (nêu khách hàng là thành viên

thì sẽ điền số điện thoại của khách hàng phần mềm sẽ tự động nhận thông tin của

khách hàng đó) Sau khi thêm đủ thông tin sản phẩm cần bán, phần mềm sẽ tự động

tính tiền cần trả (nhân viên có thê điều chỉnh tăng-giảm giá theo tiền hoặc phần

trăm), bước tiếp theo nhập tiền khách đưa và in hóa đơn (nếu tiền khách đưa nhỏ hơn số tiền thanh toán thi sẽ lưu là khách hàng đó nợ bao nhiêu tiền)

Sơ đồ quy trình thủ tục và thanh toán với khách

Hình 2.1: Quy trình thanh toản với khách hàng

* Cách thức tính tiền hóa đơn:

Tổng tiền cần thanh toán = tông của (đơn giá sản phâm * số lượng) + tiền dịch vÃ*ø,

giảm giá (nếu có).