Xây dựng website bán hoa cho cửa hàng hoa tươi miền bắc

LỜI CẢM ƠN
Em xin cảm ơn sự hướng của thầy cô giáo trong bộ môn Khoa Học Máy Tính và dưới
sự hướng dẫn trực tiếp, tận tình của cô Nguyễn Hiền Trinh đã cung cấp cho em những thông
tin cần thiết cùng với việc phân tích các yêu cầu thực tế, em đã xây dựng hoàn thành chương
trình “Xây dựng website bán hoa cho cửa hàng Hoa Tươi Miền Bắc”.
Qua một thời gian khảo sát, thiết kế và xây dựng website, đến nay nội dung của
đề tài cơ bản đã hoàn thành. Mặc dù đã có sự cố gắng và được sự giúp đỡ tận tình của
thầy cô, nhưng do thời gian và kinh nghiệm thực tế còn nhiều hạn chế nên em không
tránh khỏi những thiếu sót nên sản phẩm chưa được thiết kế một cách khoa học, chưa
mang tính chuyên nghiệp. Sản phẩm tuy đã đáp ứng được yêu cầu của đề tài tuy nhiên
vẫn cần phải chỉnh nhiều hơn để sản phẩm được hoàn thiện một cách thẩm mỹ nhất. Vì
vậy em rất mong có được sự đóng góp của thầy cô trong Khoa Công Nghệ Thông Tin,
cũng như ý kiến đóng góp của các bạn để chương trình của em được hoàn thiện hơn.
Một lần nữa em xin chân thành cảm ơn sự hướng dẫn tận tình của cô Nguyễn Hiền
Trinh đã giúp đỡ nhiệt tình để em hoàn thành đề tài này.
Em xin chân thành cảm ơn !
Sinh viên

Nguyễn Thị Hạnh

1


LỜI CAM ĐOAN
Em xin cam đoan rằng đây là bài đồ án tốt nghiệp của em, được sự hướng dẫn từ
Giáo viên Th.S Thầy Lê Hoàng Hiệp – Giảng viên trường Đại Học Công Nghệ Thông
Tin Và Truyền Thông Thái Nguyên, Đại Học Thái Nguyên. Các nội dung nghiên cứu
và kết quả trong đề tài này là trung thực và có em cũng có tham khảo từ các báo cáo
thực tập, đồ án khác trước đây. Nếu có bất kỳ sự gian lận nào em xin hoàn toàn chịu
trách nhiệm trước Hội đồng.
Em xin trân thành cảm ơn!

Thái Nguyên, ngày 20 tháng 05 năm 2016
Sinh viên

Lê Thanh Tùng

2


MỤC LỤC
LỜI CẢM ƠN........................................................................................................................ 1
LỜI CAM ĐOAN .................................................................................................................. 2
LỜI MỞ ĐẦU ....................................................................................................................... 7
CHƯƠNG 1. CƠ SỞ LÝ THUYẾT VÀ CÔNG CỤ THỰC HIỆN......................................... 9

1.1. Một số ngôn ngữ và công nghệ được sử dụng trong đề tài................................. 9
1.1.1. Ngôn ngữ HTML..................................................................................................... 9
1.1.2. Ngôn ngữ Javascript ................................................................................................ 9
1.1.3. Ngôn ngữ PHP.....................................................................................................10
1.1.4. Hệ quản trị CSDL MySQL....................................................................................13
1.1.5. Công nghệ Responsive Boostrap ..........................................................................14
1.2. Giới thiệu về PrestaShop................................................................................ 16
1.2.1. Đặc điểm của PrestaShop .....................................................................................17
1.2.2. Cài đặt PrestaShop................................................................................................20
1.2.3. Nâng cấp và gỡ cài đặt...........................................................................................21
CHƯƠNG 2. KHẢO SÁT VÀ PHÂN TÍCH THIẾT KẾ HỆ THỐNG................................. 22

2.1. Khảo sát hiện trạng ........................................................................................ 22
2.1.1. Giới thiệu chung về cửa hàng “Hoa Tươi Miền Bắc”...........................................22
2.1.2. Ưu và nhược điểm của phương pháp quản lý cũ...................................................22

2.1.3. Khảo sát quy trình nghiệp vụ.................................................................................23
2.2. Nhu cầu cấp thiết của công ty cần xây dựng một trang web............................. 23
2.2.1. Thực trạng của công việc giới thiệu sản phẩm và bán hàng của cửa hang............23
2.2.2. Tính cấp thiết cần xây dựng website cho cửa hàng...............................................24
2.3. Yêu cầu hệ thống đối với hệ thống ................................................................. 24
2.3.1. Yêu cầu chi tiết đối với website.............................................................................25
2.3.2. Đối với người truy cập vào website......................................................................25
2.3.3. Đối với người quản trị...........................................................................................25
2.4. Phân tích hệ thống........................................................................................... 25
2.4.1. Quy trình mua hàng của khách hàng .....................................................................25
2.4.2. Quy trình thực hiện quản trị hệ thống của nhân viên quản trị ...............................26
2.4.3. Biểu đồ UseCase....................................................................................................26
3


2.4.4. Biểu đồ trình tự và cộng tác...................................................................................38
2.4.5. Biểu đồ lớp ............................................................................................................52
2.4.6. Thiết kế cơ sở dữ liệu ............................................................................................53
CHƯƠNG 3. XÂY DỰNG WEBSITE BÁN HOA ................................................................ 58

3.1. Đặt vấn đề ........................................................................................................ 58
3.2. Giải pháp và hình thức áp dụng....................................................................... 58
3.3. Giao diện website.............................................................................................. 59
3.4. Một số trang quản lý của admin và sản phẩm ...................................................... 60
KẾT LUẬN ......................................................................................................................... 67
TÀI LIỆU THAM KHẢO.................................................................................................... 68

4

DANH MỤC BẢNG
Hình 1.1 Cấu trúc thư mục của bootstrap ................................................................... 14
Hình 1.2: Ví dụ về Bootstrap ..................................................................................... 15
Hình 1.3: Ví dụ về Bootstrap. .................................................................................... 16
Hình 1.4: Giải thưởng giành cho mã nguồn mở ......................................................... 18
Hình 2.1: Biểu đồ UC cho tác nhân khách hàng......................................................... 28
Hình 2.2: Biểu đồ UC cho chức năng quản lý thông tin cá nhân ................................ 28
Hình 2.3: Biểu đồ UC cho chức năng xem giỏ hàng................................................... 28
Hình 2.4: Biểu đồ UC cho chức năng thanh toán ....................................................... 29
Hình 2.5: Biểu đồ UC cho tác nhân người quản lý ..................................................... 29
Hình 2.6: Biểu đồ UC cho chức năng quản lý khách hàng.......................................... 30
Hình 2.7: Biểu đồ UC cho chức năng quản lý các danh mục sản phẩm. ..................... 30
Hình 2.8: Biểu đồ UC cho chức năng quản lý đơn hàng............................................. 30
Hình 2.9: Biểu đồ trình tự cho UC đăng kí................................................................. 38
Hình 2.10: Biểu đồ cộng tác cho UC đăng kí ............................................................. 38
Hình 2.11: Biểu đồ trình tự cho UC đăng nhập .......................................................... 39
Hình 2.12: Biểu đồ cộng tác cho UC đăng nhập......................................................... 40
Hình 2.13: Biểu đồ trình tự cho UC tìm kiếm ............................................................ 41
Hình 2.14: Biểu đồ cộng tác cho UC tìm kiếm........................................................... 41
Hình 2.15: Biểu đồ trình tự cho UC xem thông tin sản phẩm ..................................... 42
Hình 2.16: Biểu đồ cộng tác cho UC xem thông tin sản phẩm.................................... 42
Hình 2.17: Biểu đồ trình tự cho UC xem giỏ hàng ..................................................... 43
Hình 2.18: Biểu đồ cộng tác cho UC xem giỏ hàng.................................................... 43
Hình 2.19: Biểu đồ trình tự cho UC mua sản phẩm. ................................................... 44
Hình 2.20: Biểu đồ cộng tác cho UC mua sản phẩm. ................................................. 44
Hình 2.21: Biểu đồ trình tự cho UC thanh toán. ......................................................... 45
Hình 2.22: Biểu đồ cộng tác cho UC thanh toán......................................................... 45
Hình 2.23: Biểu đồ trình tự cho UC cập nhật thông tin cá nhân.................................. 46
Hình 2.24: Biểu đồ cộng tác cho UC cập nhật thông tin cá nhân ................................ 46
Hình 2.25: Biểu đồ trình tự cho UC quản lý khách hàng ............................................ 47

Hình 2.26: Biểu đồ cộng tác cho UC quản lý khách hàng........................................... 48
5


Hình 2.27: Biểu đồ trình tự cho UC quản lý các danh mục sản phẩm......................... 48
Hình 2.28: Biểu đồ cộng tác cho UC quản lý danh mục các sản phẩm ....................... 49
Hình 2.29: Biểu đồ trình tự cho UC quản lý hóa đơn hàng......................................... 49
Hình 2.30: Biểu đồ cộng tác cho UC quản lý hóa đơn hàng ....................................... 50
Hình 2.31: Biểu đồ trình tự cho UC quản lý liên hệ ................................................... 50
Hình 2.32: Biểu đồ cộng tác cho UC quản lý liên hệ.................................................. 51
Hình 2.33: Biểu đồ lớp............................................................................................... 52
Hình 2.34: Sơ đồ quan hệ thực thể ............................................................................. 57
Hình 3.1: Giao diện website....................................................................................... 59
Hình 3.2: Trang quản trị admin.................................................................................. 60
Hình 3.3: Danh mục các loại hoa ............................................................................... 61
Hình 3.4:Trang quản lí hóa đơn đặt hàng ................................................................... 62
Hình 3.5: Trang quản lí khách hàng ........................................................................... 63
Hình 3.6: Trang quản lí sản phẩm .............................................................................. 64
Hình 3.7: Trang sửa sản phẩm ................................................................................... 65
Hình 3.8: Chi tiết sản phẩm ....................................................................................... 66

6


LỜI MỞ ĐẦU
Không kể tới những đóng góp to lớn mà ngành công nghệ thông tin đã làm
được cho lĩnh vực nghiên cứu khoa học kỹ thuật, mà chúng ta có thể nhìn thấy luôn
những đóng góp thiết thực mà nó mang lại trong đời sống xã hội của con người. Với
chiếc máy tính cá nhân của mình, chỉ với vài thao tác đơn giản, thậm chí là một cú
click chuột, bạn có thể đọc báo, xem phim, nghe đài, hay mua sắm,…có thể nói cả thế

giới thông tin gần như hiện ra trước mắt bạn.
Cùng với sự phát triển của nền kinh tế, con người ngày càng bộn bề với trăm
nghìn công việc, chúng ta không có nhiều thời gian cho việc tìm kiếm, chọn lựa mua
sắm những món quà cho mình và Người Thân, đơn giản chỉ là những bó hoa thôi
nhưng cũng làm cho chúng ta cảm thấy cuộc sống nhẹ nhàng vui vẻ, cảm giác thanh
thản, quên đi những mệt mỏi trông công việc hằng ngày. Mỗi con người đã không ít
lần phải suy nghĩ, băn khoăn khi muốn tặng cho ai đó một món quà sao cho độc đáo
mới lạ và quan trọng là phải mang nhiều ý nghĩa, các bạn sẽ nghĩ đến những bó hoa,
đó là những bó hoa được bó khéo léo đẹp mắt, tuy không phải món quà có giá trị cao
nhất nhưng hoa luôn là món quà thể hiện được sự quan tâm, tình cảm yêu quý của
người tặng đến với người nhận .
Hoa là sự tinh tế trang trọng trong các nhà hàng, khách sạn hay cơ quan công
sở, hoa còn là niềm vui đôi lứa trong các lễ cưới, là sự cảm thông chia buồn trong đám
tang, là sự trang trọng lich sự trong các lễ khai trương, các cuộc họp, hội nghị…Xuất
phát từ những suy nghĩ đó, em muốn xây dựng một website chuyên cung cấp các sản
phẩm về hoa phục vụ cho cuộc sông hằng ngày, quà tặng, cung cấp hoa định kỳ cho
nhà hàng, khách sạn hay cơ quan doanh nghiệp. Mong rằng sẽ mang những sắc hoa
tươi thắm nhất, những món quà ý nghĩa nhất đến với người thân yêu của bạn trên khắp
mọi miền, khoảng cách về không gian và thời gian không còn là vấn đề nữa. Hiện nay
đã có rất nhiều các website nổi tiếng, uy tín phục vụ cho người sử dụng, có thể kể đến
như dienhoa.com, hay dienhoaviet.com, hoayeuthuong.com,…Các cá nhân, tổ chức,
công ty,…muốn tiến hành quảng bá hay bán hoa trực tuyến, thì điều đầu tiên họ cần
đến là một website chất lượng, với một hệ thống thông tin được thiết kế tốt, giao diện
đẹp, bắt mắt với khách hàng, cũng như là người xem, dễ sử dụng và an toàn…
7


Với đề tài “Xây dựng website bán hoa cho cửa hàng Hoa Tươi Miền Bắc” em
mong muốn vận dụng những kiến thức mình đã học, xây dựng được một trang web có
tính thực tiễn, đồng thời củng cố và nâng cao kiến thức, kỹ năng, bổ sung kinh nghiệm

thực tế.
Mục tiêu chính của đề tài:
- Củng cố kiến thức.
- Bước đầu xây dựng website bán hoa trực tuyến nhằm quảng bá rộng rãi các
loại hoa tại của hàng Hoa tươi miền Bắc.
- Tiết kiệm thời gian, chi phí một cách đáng kể thông qua những thông tin phù
hợp nhất với nhu cầu bạn đọc và khách hàng.
Với đề tài này, em muốn được những bạn đọc, khách hàng, được biết thêm về
những loại hoa, ý nghĩa của các loại hoa một cách đầy đủ thông tin hơn và thú vị hơn.

8


CHƯƠNG 1
CƠ SỞ LÝ THUYẾT VÀ CÔNG CỤ THỰC HIỆN
1.1. Một số ngôn ngữ và công nghệ được sử dụng trong đề tài
1.1.1. Ngôn ngữ HTML
HTML (viết tắt từ HyperText Markup Language) là một ngôn ngữ đánh dấu
siêu văn bản, được thiết kế ra để xây dựng các trang web. Siêu văn bản (HyperText):
liên kết siêu văn bản là một từ hay một câu trong trang Web dùng để chỉ đến trang
Web khác. Khi nhấn chuột lên một trong các liên kết này, trình duyệt web (như
Netscape Navigator hoặc Internet Explorer) sẽ đưa đến trang Web kia mà không cần
hỏi. Vì những liên kết siêu văn bản này thật sự là tính năng đặc trưng của World Wide
Web, các trang Web thường được biết như là những tài liệu siêu văn bản. Đánh dấu
(Markup): là các chỉ dẫn chi tiết về kiểu dáng được ghi trên bản viết tay để xếp chữ in,
hay đó là các lệnh chi tiết về kiểu dáng được đánh vào tài liệu văn bản để đưa lên
WWW.
Cấu trúc của một tài liệu HTML
Dưới đây là cấu trúc cơ bản của một trang web định dạng HTML:
<HTML>

<HEAD>
<TITLE> tên trang <TITLE>
Các thẻ tiêu đề khác
</HEAD>
<BODY>
Văn bản và các thẻ của trang Web
</BODY>
</HTML>
1.1.2. Ngôn ngữ Javascript
JavaScript là một ngôn ngữ lập trình kịch bản dựa trên đối tượng được phát
triển từ các ý niệm nguyên mẫu.Ngôn ngữ này được dùng rộng rãi cho các trang web,
nhưng cũng được dùng để tạo khả năng viết script sử dụng các đối tượng nằm sẵn

9


trong các ứng dụng. Giống Java, JavaScript có cú pháp tương tự C, nhưng nó gần với
Self hơn Java. .js là phần mở rộng thường được dùng cho tập tin mã nguồn JavaScript.
Javascript là ngôn ngữ dưới dạng script có thể gắn với các file HTML. Nó
không được biên dịch mà được chương trình duyệt diễn dịch.Không giống Java phải
chuyển thành mã để trình duyệt biên dịch, trình duyệt đọc Javascript dưới dạng mã
nguồn. Chính vì vậy, ta có thể dễ dàng học Javascript qua các ví dụ bởi ta có thể thấy
cách sử dụng Javascript trên các trang web.
Javascript có khả năng đáp ứng các sự kiện như tải hay loại bỏ các form.Khả
năng này cho phép Javascript trở thành ngôn ngữ script động.
Giống với HTML và Java, Javascript được thiết kế độc lập với hệ điều hành.Nó
có thể chạy trên bất kì hệ điều hành nào có hỗ trọ Javascript. Ngoài ra, Javascript còn
giống Java ở khía cạnh an ninh là không thể đọc và viết vào file của người dùng.
Cũng giống như C, JavaScript không có bộ xử lý xuất/nhập (input/output)
riêng.Trong khi C sử dụng thư viện xuất/nhập chuẩn, JavaScript dựa vào phần mềm

ngôn ngữ được gắn vào để thực hiện xuất/nhập.
Hiện nay, JavaScript được sử dụng rất nhiều trong việc thiết kế trang web động
và một số hiệu ứng hình ảnh thông qua DOM. Ngoài ra, JavaScript còn được dùng để
thực hiện một số tác vụ không thể thực hiện được với chỉ HTML như kiểm tra thông
tin nhập vào, tự động thay đổi hình ảnh,... Ở Việt Nam, JavaScript còn được ứng dụng
để làm bộ gõ tiếng Việt. Tuy nhiên, mỗi trình duyệt áp dụng JavaScript khác nhau và
không tuân theo chuẩn W3C DOM, do đó trong rất nhiều trường hợp lập trình viên
phải viết nhiều phiên bản của cùng một đoạn mã nguồn để có thể hoạt động trên nhiều
trình duyệt.
1.1.3. Ngôn ngữ PHP
PHP (viết tắt hồi quy "PHP: Hypertext Preprocessor") là một ngôn ngữ lập trình
kịch bản hay một loại mã lệnh chủ yếu được dùng để phát triển các ứng dụng viết cho
máy chủ, mã nguồn mở, dùng cho mục đích tổng quát. Nó rất thích hợp với web và có
thể dễ dàng nhúng vào trang HTML. Do được tối ưu hóa cho các ứng dụng web, tốc độ
nhanh, nhỏ gọn, cú pháp giống C và Java, dễ học và thời gian xây dựng sản phẩm tương
đối ngắn hơn so với các ngôn ngữ khác nên PHP đã nhanh chóng trở thành một ngôn
ngữ lập trình web phổ biến nhất thế giới.
10


Ngày nay, PHP đã được sử dụng rộng rãi và phổ biến nhất để xây dựng các các
trang web động. Chúng ta có thể thấy trên nhiều diễn đàn, các cổng thông tin Portal, các
website cá nhân được thiết kế bằng mã nguồn mở của PHP. Vì thế mà PHP đang có một
chỗ đứng vững chắc trong thế giới các ngôn ngữ lập trình web.
Xuất phát từ thực tế trên, đặc biệt là những ưu thế mà PHP đem lại, em đã quyết
định lựa chọn ngôn ngữ này để thực hiện đề tài mà em đã nghiên cứu trong quá trình
thực tập.
a) Cú pháp căn bản của PHP
Như đã trình bày, PHP dựa trên cú pháp của ngôn ngữ lập trình C nên về cơ bản cú
pháp của nó tương tự như C. Ngoài ra, để lập trình bằng PHP ta cần lưu ý mấy điểm sau:

 Cuối mỗi câu lệnh phải có dấu ;
 Biến trong PHP có tiền tố là $.
 Khai báo biến không có kiểu dữ liệu.
 Khai báo biến có phân biệt chữ hoa và chữ thường.
 Nên có giá trị khởi tạo cho biến khai báo.
 Mỗi phương thức đều được bắt đầu bằng dấu { và kết thúc bằng }.
 Phải có ghi chú cho mỗi feature mới.
 Để giải thích cho mỗi ghi chú ta dùng dấu // hoặc #.
 Sử dụng /* để mở đầu và */ kết thúc cho mỗi đoạn ghi chú.
b) Kiểu dữ liệu
PHP hỗ trợ 8 kiểu dữ liệu chính:
 4 kiểu dữ liệu vô hướng: boolean, integer, float (double), string.
 2 kiểu dữ liệu tổ hợp: array, object.
 2 kiểu dữ liệu đặt biệc: resource, NULL.
c) Biến
Một biến trong PHP được bắt đầu bằng ký tự $ và đi theo ngay sau đó là tên của
biến. Ví dụ: $a: biến có tên là a.
d) Câu lệnh
Do cú pháp của PHP dựa trên ngôn ngữ C nên các câu lệnh điều khiển của nó
cũng hoạt động tương tự như trong C. Các câu lệnh điều khiển trong PHP:
 If (điều kiện) {câu lệnh;}
11


 If (điều kiện) {câu lệnh;} else {câu lệnh;}
 If (điều kiện) {câu lệnh;} elseif {câu lệnh;}
 For (biểu thức 1; biểu thức 2; biểu thức 3) câu lệnh;
 While (điều kiện)
 Do … while (điều kiện)
 Break

 Continue
 Switch (điều kiện)
{
case value1
câu lệnh 1;
break;
…
}
e) Hàm
Hàm do người dùng định nghĩa
Trong lập trình, có một số đoạn mã được dùng nhiều lần ở nhiều nơi khác nhau
trong chương trình. Sẽ rất phiền và khó sửa lỗi nếu như ta phải viết lặp đi lặp lại 1 đoạn
mã đó ở nhiều nơi. PHP cung cấp một giải pháp đó là hàm do người dùng định nghĩa.
Ta có thể đưa đoạn mã đó vào trong 1 hàm, và ở chỗ nào cần dùng đoạn mã đó ta chỉ
cần gọi hàm, khi cần sửa đổi, ta chỉ cần sửa đổi 1 chỗ duy nhất là nội dung của hàm chứ
không cần phải sửa ở nhiều nơi trong chương trình.
Cú pháp để tạo 1 hàm do người dùng định nghĩa như sau:
function tênHàm($tham_số1, $tham_số2, ..., $tham _sốn) {
//thân hàm
echo "Testing";
return $kết_quả_trả_về;
} //end
Khi cần sử dụng hàm ở chỗ nào, ta chỉ cần dùng cú pháp tênHàm(các tham số
cần thiết);
 Tham số của hàm
12


Hàm có thể nhận vào các tham số, ví dụ:

function testing($a) {
echo "Tham số là $a";
} //end testing
testing(123);
testing("abc");
?>
Ở ví dụ trên, lời gọi hàm testing(123); sẽ in ra dòng Tham số là 123 và lời gọi
hàm testing("abc"); sẽ in ra dòng Tham số là abc.
Khi tham số của hàm không được truyền, nó sẽ nhận giá trị mặc định. Ta có thể
gán giá trị mặc định cho tham số của hàm:
function testing($a="mặc định") {
echo "Tham số là $a";
} //end testing
testing();
?>
1.1.4. Hệ quản trị CSDL MySQL
MySQL là hệ quản trị CSDL mã nguồn mở phổ biến nhất thế giới.Đây là hệ
CSDL dùng cho các ứng dụng web vừa và nhỏ. Tuy không phải là hệ quản trị CSDL
lớn nhưng MySQL cũng có trình giao diện trên Wingdows hay Linux, cho phép người
dùng thao tác các hành động liên quan đến CSDL.
Cũng giống như các CSDL khác, khi làm việc với CSDL MySQL, ta đăng kí
kết nối, tạo CSDL, quản lý người dùng, phân quyền sử dụng, thiết kế đối tượng table
của CSDL và xử lý dữ liệu.
Để thao tác trên CSDL, ta có thể dùng trình quản lý dạng đồ hoạ hay dùng dòng
lệnh (Command line). Tất nhiên, dùng hệ quản trị có hỗ trợ trình giao diện đồ hoạ thì
tiện lợi hơn.Tuy vậy, dù dùng dưới hình thức nào thì mục đích cũng là quản lý và thao
tác trên CSDL.

13

1.1.5. Công nghệ Responsive Boostrap
 Giới thiệu về Twitter Bootstrap
 Twitter Bootstrap bao gồm các mã CSS + HTML cơ bản cho typography,
forms, buttons, tables, grids, navigation, và nhiều thành phần khác của website.
 Twitter Bootstrap cung cấp lưới cố định (fixed) rộng 940px và 12 cột. Tất nhiên
là cũng có giải pháp cho việc dùng layout dạng động (fluid).
 Style của các phần tử HTML trong Twitter Bootstrap khá đơn giản và thanh
lịch. Ví dụ như phần đổ bóng trong input, highlight của bảng biểu, các mã CSS hiển
thị cảnh báo, tabs, phân trang…
 Tại sao lại sử dụng Twitter Bootstrap
Twitter Bootstrap giúp chúng ta giảm thiểu thời gian thiết kết html và css.Twitter
Bootstrap định nghĩa sẳn các class css công việc của chúng ta chỉ là sử dụng các class
đó vào mục đích của mình.Twitter Bootstrap còn hổ trợ Responsive design một cách
làm giao diện đa thiết bị rất được ưu chuộng trong thời gian gần đây.
 Cách sử dụng Twitter Bootstrap
Tải Bootstrap tại đây: />Sau khi tải về, bạn sẽ có một file Zip. Tiến hành giải nén ta có một thư mục có
tên bootstrap, bên trong có 3 thư mục : css, img, js.

Hình 1.1 Cấu trúc thư mục của bootstrap
Bước 1: Chúng ta tạo 1 file html có tên là index.html ở trong thư mục bootstrap
vừa giải nén phía trên.

14


Vậy là xong phần head. Giờ chúng ta viết tiếp phần body với 2 textbox và 2 button
như sau:

Hình 1.2: Ví dụ về Bootstrap

15


Hãy thu nhỏ trình duyệt và bạn sẽ thấy điều kỳ diệu:

Hình 1.3: Ví dụ về Bootstrap.
1.2. Giới thiệu về PrestaShop
PrestaShop – Giải pháp website thương mại điện tử cho cá nhân và doanh
nghiệp với những chức năng đầy đủ và hoàn thiện nhất của một website 2.0 chuyên
nghiệp bán hàng trực tuyến e-Commerce shopping cart.
Được phát triển từ năm 2005, trước đây PrestaShop khá ít tên tuổi, do phát hành
chủ yếu với phiên bản tiếng Pháp. Nhưng thời gian gần đây, với những cải tiến vượt
bậc, PrestaShop đã trở thành mã nguồn mở khá phổ biến.

16


Với ưu thế về mã nguồn phát triển sau, PrestaShop kế thừa được nhiều ý tưởng
của các mã nguồn cùng loại đi trước như OsCommerce. Điểm làm lên khác biệt chủ
yếu là việc Prestashop tích hợp sẵn thư viện trình bày sản phẩm theo màu sắc. Tính
năng này giúp chủ cửa hàng tiếp cận tốt hơn với các khách hàng của họ.
Ngoài ra, việc tích hợp trực tiếp trang quản lý thông tin vào mã nguồn, cũng
giúp PrestaShop trở nên thân thiện hơn với người sử dụng.
1.2.1. Đặc điểm của PrestaShop
 Đầy đủ các chức năng của một website bán hàng trực tuyến: thêm, sửa, xóa,
thống kê sản phẩm, nhà sản xuất, nhà phân phối, khách hàng…
 Theo dõi tình trạng bán hàng, thông báo cho khách hàng bằng tin nhắn SMS,
thu thập thông tin khách hàng….

 Áp dụng được nhiều phương thức thanh toán khác nhau với các đơn vị tiền tệ
lưu hành phổ biến.
 Tốc độ tải và xử lý nhanh. An toàn, bảo mật.
 URL thân thiện, tối ưu máy tìm kiếm SEO, quản lý nội dung CMS…
 Bạn không cần quan tâm tới chi phí mua phần mềm hay vấn đề bản quyền vì
Prestashop là phần mềm nguồn mở và hoàn toàn miễn phí.
 Thường xuyên cập nhật các phiên bản mới hơn để sửa chữa các lỗi bugs và bổ
sung thêm các chức năng và các modules mới.
 Dễ dàng quản trị website với các công cụ tương đối ổn định và bảng điều hướng
thuận tiện.
 Dễ dang tích hợp và mở rộng phát triển các modules độc lập.
 Giao diện thân thiện, dễ sử dụng, có thể thiết kế giao diện độc lập.
 Hỗ trợ trên 40 ngôn ngữ phổ biến bao gồm cả Tiếng Việt. Người sử dụng có thể
xây dựng gói ngôn ngữ riêng phù hợp với nhu cầu của mình.
 PrestaShop e-Commerce sử dụng công nghệ Web 2.0 với sức mạnh của AJAX,
JQuery library. PrestaShop cũng sử dụng cộng nghệ Smarty framework để giúp các
nhà thiết kế web có thể tạo ra giao diện một cách dễ dàng mà không cần am hiểu nhiều
về ngôn ngữ lập trình PHP.
 Mặc dù được tích hợp rất nhiều chức năng như vậy nhưng PrestaShop rất nhẹ và
nhanh. Tuy vậy PrestaShop vẫn còn tồn tại khá nhiều khuyết điểm, nổi bật như:
17


 Khả năng quản lý Url-rewirte khá yếu, không có khả năng mở rộng tùy biến.
Làm giảm đáng kể khả năng SEO của website.
 Thuật toán tìm kiếm của PrestaShop được đánh giá là khá yếu so với các Open
Source khác.
 Kiến trúc Extensions hỗ trợ cho bên thứ ba tự phát triển khá yếu.
PrestaShop giành giải Open Source Business Applications Award của Packt
Publishing:

Open Source Award của Packt Publishing là một trong những giải thưởng uy
tín và danh giá bậc nhất dành cho các mã nguồn mở. Giải do nhà xuất bản sách Packt
trao thưởng hàng năm, dựa trên bình chọn của người sử dụng, lập trình viên, và các
chuyên gia uy tín trong lĩnh vực mã nguồn mở bình chọn.

Hình 1.4: Giải thưởng giành cho mã nguồn mở
Trong hạng mục mã nguồn mở ứng dụng cho kinh doanh, mã nguồn mở
PrestaShop đã có những bước tiến vượt bậc khi vươn lên giành giải thưởng quan trọng
này.Vượt qua những tên tuổi nổi tiếng khác như OsCommerce,Zencart, hay OpenCart,
PrestaShop bất ngờ dành chiến thắng giải thưởng danh giá này.
Các phiên bản PrestaShop
Hiện PrestaShop có các dòng phiên bản chính: PrestaShop 1.0, PrestaShop 1.1.x,
PrestaShop 1.2.x, PrestaShop 1.3.x, PrestaShop 1.4.x, PrestaShop 1.5.x, PrestaShop
1.6.x
 Dòng phiên bản PrestaShop 1.0
- Phiên bản này được phát hành vào 31/07/2008
- Là phiên bản phát hành ổn định.
- Được sử dụng rộng rãi, có nhiều thành phần mở rộng (component, module,…)
 Dòng phiên bản PrestaShop 1.1.x
- Phiên bản này được phát hành vào 19/12/2008
- Là phiên bản cải tiến từ PrestaShop 1.0

18


- CMS được thêm vào PrestaShop 1.1. Nó dễ dàng tạo thêm trang tin tức trong
PrestaShop bằng công cụ rich editor.
 Dòng phiên bản PrestaShop 1.2.x
- Phiên bản này được phát hành ngày 29/07/2009.
- Là phiên bản cải tiến từ PrestaShop 1.1

- Phiên bản này có thêm nhiều tính năng mới và sửa nhiều bug quan trọng.
 Dòng phiên bản PrestaShop 1.3.x
- Phiên bản này phát hành ngày 29/12/2010
- Là phiên bản cải tiến từ PrestaShop 1.2
- Là phiên bản hoàn thiện với đầy đủ các tính năng của website bán hàng.
- Thêm nhiều tính năng mới như: Moneybookers, Product Tooltip, Catalog
Evaluation…
 Dòng phiên bản PrestaShop 1.4.x
- Phiên bản này phát hành ngày 18/03/2011
- Là phiên bản cải tiến từ PrestaShop 1.3
- Có hơn 65 tính năng mới cho các doanh nghiệp và nhà phát triển.
- Thêm một đơn vị tiền tệ mới trong phiên bản này.
- PrestaShop 1.4 bổ sung Memcached để làm tăng thời gian đáp ứng của
WebPages. Memcached hỗ trợ MYSQL database và lưu lại kết quả truy vấn SQL, điều
này giúp server ít đầy và hoạt động hiệu suất hơn.
- PrestaShop 1.4.1: Phát hành ngày 21/04/2011
- PrestaShop 1.4.2: Phát hành ngày 30/05/2011
- PrestaShop 1.4.3: Phát hành ngày 16/06/2011
- PrestaShop 1.4.4: Phát hành ngày 28/07/2011
- PrestaShop 1.4.5: Phát hành ngày 13/10/2011
- PrestaShop 1.4.7: Phát hành ngày 08/02/2012
- PrestaShop 1.4.8 : Phát hành ngày27/04/2012
- PrestaShop 1.4.9 : Phát hành ngày23/08/2012
- PrestaShop 1.4.9 : Phát hành ngày 23/08/2012
 Dòng phiên bản PrestaShop 1.5.x
- Phiên bản này phát hành ngày 13/9/2012
19


- Thêm tính năng multi-shop trong PrestaShop. Với tính năng Bạn có thể quản lý

nhiều shop (sites) từ một trang quản trị back office chạy cùng một host.
- Thêm tính năng dispatchernó làm tăng độ bảo mật của website bằng cách chỉ
cho phép một entry point phục vụ tất cả các hành động được yêu cầu từ shop’s front
office.
- PrestaShop 1.5.1 : Phát hành ngày : 04/10/2012
- PrestaShop 1.5.2 : Phát hành ngày : 23/10/2012
- PrestaShop 1.5.3 : Phát hành ngày : 28/12/2012
- Prestashop 1.5.4 : Phát hành ngày : 25/04/2013
- Prestashop 1.5.5 : Phát hành ngày : 27/08/2013
- Prestashop 1.5.6 : Phát hành ngày : 20/01/2014
- Prestashop 1.6 beta 1 : Phát hành ngày : 03/02/2014
1.2.2. Cài đặt PrestaShop
Hướng dẫn cài Prestashop trên localhost
Hướng dẫn này dựa trên phiên bản Prestashop 1.6, Các phiên bản khác có thể có
đôi chút khác biệt.
Chuẩn bị cho việc cài đặt Prestashop
- Tải Prestashop từ website: www.prestashop.com
- Cài đặt một trong các phần mềm web server như Vertrigo, AppServ (Windows)
hoặc Xampp (Windows, Linux/Ubuntu), Wamp.
 Cài đặt Prestashop
- Download gói cài đặt tại địa chỉ www.prestashop.com
- Giải nén bộ cài Prestashop vào thư mục xampp/htdocs trên localhost sao cho
thư mục prestashop nằm trong thư mục xampp/htdocs (trên hosting thì nó là thư
mục public_html)
- Tiến hành cài đặt bằng việc mở trình duyệt (FireFox, Chrome, Internet
Explorer, Opera..) của bạn lên và truy cập địa chỉ http://localhost/prestashop/install
Quá trình cài đặt mới 1 website sử dụng Prestashop sẽ qua các bước như sau:

20

1.2.3. Nâng cấp và gỡ cài đặt
a) Nâng cấp
1. Sao lưu mã nguồn.
2. Sao lưu cơ sở dữ liệu bằng 2 cách Back Office >> Tools >>Backup hoặc
phpmyadmin/export.
3. Đổi tên thư mục PrestaShop trên hosting server của bạn.
4. Download phiên bản PrestaShop mới nhất.
5. Giải nén file PrestaShop Zip vừa tải về.
6. Upload lên hosting bằng FTP client .
7. Copy nội dung thư mục/ mails ở phiên bản PS trước sang thư mục/ mails ở
phiên bản bạn nâng cấp.
8. Copy nội dung thu mục ảnh/img ở phiên bản PS trước sang thư mục ảnh/img ở
phiên bản bạn nâng cấp.
9. Copy các modules của bạn hoặc các modules đã có sự thay đổi.
10. Kết hợp nội dung của file .htaccess ở thư mục root.
11. Copy theme của bạn sang thư mục /theme. Chú ý vấn đề tương thích của theme
với phiên bản PrestaShop hiện tại.
12. Copy file /config/settings.inc.php.
13. Bắt đầu cài đặt /install bằng cách nhập địa chỉ URL tới thư mục cài đặt
Prestashop.Chọn Update .
Chú ý: Thường xuyên sao lưu cơ sở dữ liệu.
b) Gỡ cài đặt PrestaShop
Xóa thư mục “PrestaShop”.
Xóa cơ sở dữ liệu PrestaShop.

21


CHƯƠNG 2

KHẢO SÁT VÀ PHÂN TÍCH THIẾT KẾ HỆ THỐNG
2.1. Khảo sát hiện trạng
2.1.1. Giới thiệu chung về cửa hàng “Hoa Tươi Miền Bắc”
 Tên, địa chỉ doanh nghiệp
Tên của hàng: Hoa Tươi Miền Bắc
Địa chỉ: 145 Xã Đàn,Ô chợ Dừa, Đống Đa Hà Nội
Điện thoại : 04 667 11115

Biểu tượng chiếc lá màu xanh nằm trên quả cầu mầu xanh, ý muốn hướng đến
một đại lý cung cấp hoa lớn mạnh.
Đại diện của hàng : Bà Bùi Thị Phượng
 Qui mô, phạm vi.
Do quy mô của cửa hàng chưa lớn và việc quản lý cửa hàng vẫn còn tiến hành
một cách thủ công; thủ công trong việc quản lý nhập hàng từ nơi khác về, xuất bán
hàng cho khách, thủ công trong việc lưu hóa đơn bán hàng, hóa đơn nhập hàng, và thủ
công trong việc tính thu nhập lợi nhuận của cửa hàng.
2.1.2. Ưu và nhược điểm của phương pháp quản lý cũ
 Ưu điểm
Cửa hàng hoạt động nhanh tích cực trong các hoạt động nhập, xuất hàng hóa.
Các yếu tố được kiểm tra trong các yếu tố nhập, xuất, khách hàng, hay theo dõi hàng
khá đầy đủ.

22


 Nhược điểm
Nhập hàng: Các thông tin về sản phẩm nhập vào thường thay đổi và sẽ phải ghi
thay đổi vào sổ theo dõi do đó việc lưu trữ bằng sổ theo dõi sẽ không có một chuẩn
chung nào, gây khó khăn trong việc tìm kiếm thông tin.
Bán hàng:

Hàng hóa thường được trao đổi trực tiếp không có hóa đơn nên sẽ khó kiểm soát
sản phẩm, gây khó khăn trong việc quản lý.
2.1.3. Khảo sát quy trình nghiệp vụ
Từ quá trình khảo sát hệ thống như trên, website Hoa tươi miền Bắc rất mong
muốn khắc phục các nhược điểm trên đồng thời mở rộng kinh doanh phù hợp với xu
hướng hiện đại. Website đã đặt vấn đề xây dựng web với mục đích:
- Thông qua website, giới thiệu được các sản phẩm của cửa hàng, giúp khách
hàng có thể đặt mua các sản phẩm một cách nhanh chóng, thuận tiện.
- Thông qua website, người quản lý có thể quản lý website, quản lý việc quảng
cáo sản phẩm, tin tức cửa hàng, quản lý bán hàng online, quản lý thống kê mặt hang
một cách thuận tiện.
2.2. Nhu cầu cấp thiết của công ty cần xây dựng một trang web
2.2.1. Thực trạng của công việc giới thiệu sản phẩm và bán hàng của cửa hang
Hiện nay nhu cầu điện hoa rất là phát triển. Điện hoa là một hình thức chuyển
phát hoa tươi theo yêu cầu từ người gửi đến người nhận, vì một lý do gì đó không thể
tự tay tặng được. Điện hoa có thể là 1 bông hoa, bó, lẵng, kệ hoa và dùng để tặng cho
những dịp sinh nhật, biểu lộ tình yêu, phúng viếng - chia buồn....
các cửa hàng bán hoa thì có nhu cầu quảng bá các mẫu hoa mới của cửa hàng và
mong muốn tiếp thị sản phẩm tới khách hàng.
Thị trường là nơi tập hợp nhu cầu của nhiều khách hàng rất khác nhau về tuổi
tác, giới tính, thu nhập ,ý thích ,thói quen tiêu dùng, phong tuc tập quán, tôn giáo…Sự
khác nhau này có ảnh hưởng rất lớn đến việc mua sắm và tiêu dùng hàng hóa nói
chung và mặt hàng hoa tươi nói riêng.
Bởi vậy công việc giới thiệu sản phẩm và cách bán hàng đóng một vai trò rất
quan trọng trong việc cửa hàng đạt được lợi nhuận tối đa và phát triển nhanh chóng.
Cửa hàng có một số chiến lược như:
23


-Phân phối trực tiếp các sản phẩm cho các thị trường Hà nội

-Thực hiện các phương án kinh doanh đã được phê duyệt sao cho các nghiệp vụ
kinh doanh đảm bảo tiết kiệm và hiệu quả cao.
-Xây dựng kế hoạch, triển khai thực hiện và tổng kết tình hình thực hiện kế
hoạch của các chi nhánh nhằm khắc phục sớm các nhược điểm để vươn lên trong hoạt
động kinh doanh.
2.2.2. Tính cấp thiết cần xây dựng website cho cửa hàng
Trước sự phát triển không ngừng của mạng Internet và Thương mại điện tử toàn
cầu hiện nay, xây dựng website cho công ty bạn là một công việc rất quan trọng.
Website đóng vai trò kênh truyền thông và công cụ kinh doanh hàng đầu cho mỗi
doanh nghiệp, nó mang lại những lợi thế không thể phủ nhận. Trừ phi bạn kinh doanh
một mình, tự bán hàng cho mình, nếu không, muốn phát triển dứt khoát bạn phải có
một website.
 Thiết lập sự hiện diện
 Tận dụng hoàn toàn các cơ hội tiếp xúc
 Phục vụ khách hàng hiệu quả
 Thu hút sự quan tâm của dân chúng
 Công bố thông tin vào bất kỳ thời gian nào
 Để bán hàng hóa, sản phẩm, dịch vụ
 Giới thiệu sản phẩm sinh động
 Vươn tới một thị trường dân chúng có thu nhập cao
 Mở rộng ra thị trường quốc tế
 Hình thành dịch vụ 24 giờ
 Cho phép bạn tiếp nhận thông tin phản hồi từ phía khách hàng
 Thử nghiệm dịch vụ và sản phẩm mới trên thị trường
 Phương tiện truyền thông linh hoạt
 Tiếp cận một thị trường có tính chuyên nghiệp
2.3. Yêu cầu hệ thống đối với hệ thống
- Hiện thị danh mục sản phẩm.
- Hiện thị chi tiết về sản phẩm có trong danh mục.
- Hiện thị chi tiết thông tin về công ty và các sản phẩm.

24


- Quản lí được thành viên và sản phẩm
2.3.1. Yêu cầu chi tiết đối với website
- Hiện thị danh mục sản phẩm.
- Hiện thị chi tiết về sản phẩm có trong danh mục.
- Hiện thị chi tiết thông tin về cửa hàng và các sản phẩm.
- Bán hàng và thanh toán trực tuyến
2.3.2. Đối với người truy cập vào website
- Giao diện dễ sử dụng và tính thẩm mỹ cao.
- Cho phép khách hàng đăng ký và đăng nhập thành viên.
- Thông tin sản phẩm phong phú đa dạng.
- Thông tin về một sản phẩm phải chi tiết để khách hàng có thể nắm rõ chi tiết
thông tin về sản phẩm mình lựa chọn.
- Luôn luôn cập nhật, giới thiệu những sản phẩm mới.
- Khách hàng có thể đặt hàng và lựa chọn các phương thức thanh toán
2.3.3. Đối với người quản trị
- Quản trị dễ dàng cập nhật thông sản phẩm.
- Dễ dàng theo dõi các thông tin về hóa đơn đặt hàng của khách để tiến hành
giao hàng cho khách khi khách hàng đã thực hiện thanh toán trực tuyến cho
công ty.
2.4. Phân tích hệ thống
2.4.1. Quy trình mua hàng của khách hàng
1. Khách hàng duyệt ứng dụng trên trình duyệt Web. Trình duyệt sẽ hiển thị các
sản phẩm và dịch vụ mà doanh nghiệp cung ứng. Khách hàng có thể duyệt sản phẩm
theo chủng loại được liệt kê sẵn hoặc có thể sử dụng chức năng tìm kiếm để tìm kiếm
theo tên sản phẩm.
2. Sau khi tìm kiếm, tham khảo các thông tin về sản phẩm, khách hàng có thể đi
đến quyết định là mua sản phẩm nào đó. Để làm điều này khách hành cần đưa sản

phẩm đó vào trong giỏ hàng. Giỏ hàng là nơi chứa thông tin về các sản phẩm mà
khách hàng định đặt mua.

25