XÂY DỰNG WEBSITE GIỚI THIỆU VÀ BÁN SẢN PHẨM SƠN TƯỜNG

ĐỀ CƯƠNG1.Tên đề tàiXây dựng website giới thiệu và bán sản phẩm sơn tường2.Lý do chọn đề tàiHiện nay việc quản lý một cửa hàng sơn trên giấy tờ là rất khó khăn:Số lượng hãng sơn, loại sơn và sản phẩm sơn rất nhiều,nếu chỉ có trên giấy tờ thì việc tìm kiếm phân loại rất mất thời gian và công sức.Việc kiểm kê số lượng, thống kê đơn hàng, báo cáo khó khănViệc quản lý tốn công sức, thời gian,chính vì vậy nên nhó chúng em muốn thiết kế 1 website giúp cho công việc quản lý cửa hàng sơn trở nên dễ dàng hơn.3.Mục tiêuXây dựng được một hệ thống website giới thiệu và bán sản phẩm có giao diện thân thiện dễ sử dụng,tin tức cập nhật thường xuyên, quản lý danh mục hãng, loại sơn, sản phẩm, thống kê, báo cáo dễ dàng.

TRƯỜNG ĐẠI HỌC CÔNG NGHIỆP HÀ NỘI

KHOA CÔNG NGHỆ THÔNG TIN

-*** -PHÁT TRIỂN PHẦM MỀM THEO HƯỚNG CẤU PHẦN

ĐỀ TÀI : XÂY DỰNG WEBSITE GIỚI THIỆU VÀ BÁN SẢN

Hà nội(30-10-2015)

1

Mục lục

ĐỀ CƯƠNG 3

1.Tên đề tài 3

2.Lý do chọn đề tài 3

3.Mục tiêu 3

4.Phân công công việc 4

5.Bố cục đề tài 4

Chương 1: Tìm hiểu về mô hình MVC 4

Chương 2: Khảo sát , phân tích hệ thống 4

Chương 4: Tổng kết 5

Chương I.Tìm hiểu về mô hình MVC 6

1.Giới thiệu chung 6

2.Đặc điểm của mô hình MVC 6

3.Tìm hiểu về Controler, Model và View 9

Chương II.Khảo sát,phân tích hệ thống 12

1.Khảo sát 12

2.Phân tích hệ thống 14

Chương III.Thiết kế, lập trình hệ thống 57

1.Thiết kế cơ sở dữ liệu 57

2 Thiết kế giao diện 59

ĐỀ CƯƠNG1.Tên đề tài

Xây dựng website giới thiệu và bán sản phẩm sơn tường

- Việc kiểm kê số lượng, thống kê đơn hàng, báo cáokhó khăn

- Việc quản lý tốn công sức, thời gian,chính vì vậynên nhó chúng em muốn thiết kế 1 website giúpcho công việc quản lý cửa hàng sơn trở nên dễ dànghơn

3.Mục tiêu

Xây dựng được một hệ thống website giới thiệu và bán sản phẩm

có giao diện thân thiện dễ sử dụng,tin tức cập nhật thường xuyên,quản lý danh mục hãng, loại sơn, sản phẩm, thống kê, báo cáo dễdàng

3

4.Phân công công việc

5.Bố cục đề tài

Chương 1: Tìm hiểu về mô hình MVC

- Giới thiệu chung

- Đặc điểm của mô hình MVC

- Thiết kế giao diện trang chủ

- Thiết kế giao diện sản phẩm

- Thiết kế giao diện tin tức

- Thiết kê giao diện admin+ Lập trình

Chương 4: Tổng kết

- Đánh giá, chạy thử website

5

Chương I.Tìm hiểu về mô hình MVC

1.Giới thiệu chung

1.1 Lịch sử ra đời

MVC được phát minh tại Xerox Parc vào những năm 70, bởiTrygveReenskaug MVC lần đầu tiên xuất hiện công khai là trongSmalltalk-80 Sau đó trong một thời gian dài hầu như không có thông tinnào về MVC, ngay cả trong tài liệu 80 Smalltalk Các giấy tờ quan trọngđầu tiên đƣợc công bố trên MVC là “A Cookbook for Using the Model-View-Controller User Interface Paradigm in Smalltalk – 80”, bởi GlennKrasner và Stephen Pope, xuất bản trong tháng 8 / tháng 9 năm 1988

1.2 Khái niệm

MVC là viết tắt của Model – View – Controller Là một trong những mẫuthiết kế được vận hành để tách mã lệnh thành 3 phần riêng biệt Ở mỗiphần MVC sẽ có những chức năng đặc thù Để xử lý các tác vụ màrequest gởi tới MVC làm cho mã lệnh trở nên trong sáng, dễ phát triển và

dễ nâng cấp theo thời gian

2.Đặc điểm của mô hình MVC

Trong kiến trúc MVC, một đối tượng đồ họa người dùng bao gồm 3 thànhphần cơ bản: Model, View, và Controller Model có trách nhiệm đối vớitoàn bộ dữ liệu cũng như trạng thái của đối tượng đồ họa View chính làthể hiện trực quan của Model, hay nói cách khác chính là giao diện củađối tượng đồ họa Và Controller điều khiển việc tương tác giữa đối tượng

đồ họa với người sử dụng cũng như những đối tượng khác

Hình 2.1: Các thành phần chính của mô hình MVC

 Model: Là thành phần chịu trách nhiệm xử lý các thao tác trêndatabase Và gởi trả kết quả thông qua view

 View: Là phần hiển thị thông tin trên website, sau khi đi qua controller

và nhận kết quả từ phía model thì view là bước cuối cùng để chuyểnthông tin tới người dùng

 Controller: Là phần điều hướng các request tới những tác vụ tươngứng Controller là một phần không thể thiếu ở bất cứ framework nào Vì

nó có trách nhiệm gởi và nhận request từ hệ thống tới người sử dụng

Khi người sử dụng hoặc những đối tượng khác cần thay đổi trạng thái củađối tượng đồ họa, nó sẽ tương tác thông qua Controller của đối tượng đồhọa Controller sẽ thực hiện việc thay đổi trên Model Khi có bất kỳ sự

7

thay đổi nào xảy ra ở Model, nó sẽ phát thông điệp ( broadcast message)thông báo cho View và Controller biết

Nhận được thông điệp từ Model, View sẽ cập nhật lại thể hiện của mình, đảm bảo rằng nó luôn là thể hiện trực quan chính xác của Model Còn Controller, khi nhận được thông điệp từ Model, sẽ có những tương tác cầnthiết phản hồi lại người sử dụng hoặc các đối tượng khác

Hình 2.2: Mô hình tuần tự của MVC

 Ưu Điểm:

MVC làm cho ứng dụng trở nên trong sáng, giúp lập trình viên phân táchứng dụng thành ba lớp một cách rõ ràng Điều này sẽ rất giúp ích cho việcphát triển những ứng dụng xét về mặt lâu dài cho việc bảo trì và nâng cấp

hệ thống

MVC hiện đang là mô hình lập trình tiên tiến bậc nhất hiện nay, điều mà

Mặc dù, MVC tỏ ra lợi thế hơn nhiều so với cách lập trình thông thường.Nhưng MVC luôn phải nạp, load những thư viện đồ sộ để xử lý dữ liệu.Chính điều này làm cho mô hình trở nên chậm chạp hơn nhiều so với việccode tay thuần túy.

MVC đòi hỏi người tiếp cận phải biết qua OOP, có kinh nghiệm tươngđối cho việc thiết lập và xây dựng một ứng dụng hoàn chỉnh Sẽ rất khókhăn nếu OOP của người sử dụng còn yếu

MVC tận dụng mảng là thành phần chính cho việc truy xuất dữ liệu Nhất

là với việc sử dụng active record để viết ứng dụng Chúng luôn cần ngườiviết phải nắm vứng mô hình mảng đa chiều

3.Tìm hiểu về Controler, Model và View

3.1 Controler

Controller có trách nhiệm chính là điều hướng các yêu cầu của người sử dụng, tất cả các request đều sẽ phải đi tới controller Và tại đây, ứng với các tham số người sử dụng truyền mà đưa đến một tác vụ nào đó trên ứng dụng.Tại các tác vụ này, thông qua lớp model để làm việc và trả kết quả trở về controller Cuối cùng controller sẽ đẩy dữ liệu thao tác tới view View là thành phần cuối cùng mà người sử dụng nhận được khi họ gửi request tới ứng dụng

9

Qua hình vẽ này, ta hiểu rằng Để có thể thao tác với các action (hànhđộng) ta cần phải đi qua file index.php Lúc này file index đóng vai trònhư một controller được dùng để điều hướng các request.

Ứng với các request thì nó sẽ trả về một controller khác để xử lý tác vụmột cách cụ thể Tại controller con, nó sẽ gọi các action riêng biệt

Ở đó, thông qua các action mà nó gọi tới các file xử lý giản đơn

3.2 Model

Model là thành phần chủ yếu được sử dụng để thao tác xử lý dữ liệu.Trong các framework, Model vẫn thường sử dụng theo phương thứcActive Record Một trong những design pattern Chúng có tác dụng rútngắn thời gian viết câu truy vấn cho người sử dụng Biến những câu truyvấn phức tạp trở nên gần gũi và thân thiện với người sử dụng thông qua

Model thường sẽ là các phương thức có trách nhiệm xử lý các tác vụ như:select, insert, update, delete các record trong database Ứng với các lấy dữliệu, model thường sử dụng mảng để gởi trả kết quả về Vì mảng có thểcho phép model lưu trữ nhiều thông tin hơn, nên thường các record khibóc tách chúng sẽ mang các dữ liệu của database một cách chi tiết.Khi sử dụng models, ta cũng cần tuân theo nguyên tắc chính của chúng làkhông xuất giá trị trực tiếp trong model Mà tất cả những dữ liệu ấy, phảiđưa vào mảng và trả về theo phương thức Và tiếp tục ở view ta sẽ sửdụng nó để lấy dữ liệu ra.

Trước đây, để giải quyết tình huống này Người ta thường sử dụngtemplate để phân tách website thành 2 mảng riêng biệt Một là giao diện

và một là core Việc chỉnh sửa giao diện trở nên đơn giản hơn đối với họ

11

so với cách viết thập cẩm kia Tuy nhiên, các thư viện này thực chất sẽlàm cho ứng dụng của chúng ta trở nên chậm chạp hơn bao giờ hết Bởichúng phải phiên dịch nhiều lần các kịch bản.

Chẳng hạn: Để dễ thao tác, smarty sẽ dịch ngược các yêu cầu của bạnsang ngôn ngữ của nó Sau đó chúng sẽ chuyển ngôn ngữ đó sang PHP vàthao tác xử lý trên nó.Việc này sẽ làm ứng dụng chậm chạp, do cứ phảidịch qua, dịch lại một kịch bản Trong khi, với sự kết hợp của PHP thuần,ứng dụng của bạn sẽ nhanh và ổn định hơn nhiều

Và view cũng là một phần trong việc nâng cấp những hạn chế ấy Chúnggiúp giảm thiểu tối đa quá trình biên dịch nhiều lần Và làm cho ứng dụngtrở nên mạnh mẽ và chuyên nghiệp hơn nhiều so với cách lập trình thuần

Chương II.Khảo sát,phân tích hệ thống

1.Khảo sát

Một số hãng sơn nổi bật trên thị trường:

1.Sơn DULUX 14.Sơn DURA 27.Sơn JONSTONE

2.Sơn JOTUN 15.Sơn HAKA 28.Sơn NANO ONE

3.Sơn NIPPON 16.Sơn THẾ KỶ 29.Sơn NERO

4.Sơn TOA 17.Sơn ĐỒNG TÂM 30.Sơn SUNDAY

5.Sơn KOVAs 18.Sơn DRAGON 31.Sơn TOKYO

6.Sơn MYKOLOR 19.Sơn JAIVA 32.Sơn PaintPro 1

7.SơnEXPO 20.Sơn GALATEX 33.Sơn ZIKON

8.SơnSPEC 21.Sơn DONASA 34.SơnLUCKY HOUSE 9.Sơn MAXILITE 22.Sơn GALAXY 35.Sơn KASA

10.Sơn ALEX 23.Sơn ROMA 36.Sơn NANOMAXs

11.SơnLUXURY 24.Sơn CADIN 37.Sơn SPRING

12.Sơn ANTA 25.SơnJAPAN PAINT

13.Sơn BEHR 26.Sơn MD

Một số loại sơn nổi bật:

1 Sơn nước nội thất 9 Sơn chống thấm xi măng

2 Sơn nước ngoại thất 10 Sơn giả đá Sơn giả ngọc

3 Sơn dầu 11 Sơn cách âm,sơn sần,sơn gai

4 Sơn lót 12 Sơn phủ bóng CLEAR

5 Sơn chống thấm 13 Sơn trang trí đặc biệt

1

13

6 Sơn công nghiệp 14 Sơn bột

7 Sơn phủ mầu nội thất 15 Sơn chịu nhiệt cho tường

8 Sơn phủ mầu ngoại thất

2.Phân tích hệ thống theo hướng đối tượng

2.1 Biểu đồ USE CASE

2.1.1 Biểu đồ Use case dành cho Quản trị viên

2.1.2 Biểu đồ Use case dành cho Khách hàng

15

2.1.3 Biểu đồ Use case dành cho Nhân viên

2.2 Phân tích các ca sử dụng của bài toán

2.2.1 Ca sử dụng Đăng nhập

Đặc tả:

Khi người dùng muốn sử dụng một chức năng nào đó yêu cầu quyền thì cần phải đăng nhập

- Người dùng: Truy cập vào trang chủ, Chọn Đăng nhập.

- Hệ thống: Hiển thị ra form đăng nhập

- Người dùng: Điền thông tin đang ký và chọn Đăng nhập.

- Hệ thống: sẽ kiểm tra thông tin.Nếu thông tin sai sẽ báo lỗi,ngược lại sẽ đăng nhập thành công

Biểu đồ hoạt động Đăng nhập

17

Biểu đồ lớp tham gia ca sử dụng Đăng nhập

Biểu đồ trình tự Đăng nhập

19

2.2.2 Ca sử dụng Đăng ký

Đặc tả:

Khi người dùng muốn làm thành viên của website thì

- Người dùng: Truy cập vào trang chủ, Chọn Đăng ký.

- Hệ thống: Hiển thị ra form đăng ký

- Người dùng: Điền thông tin đang ký và chọn Đăng ký.

- Hệ thống: sẽ kiểm tra thông tin.Nếu thông tin sai sẽ báo lỗi,ngược lại sẽ đăng ký thành công

Biểu đồ hoạt động đăng ký

Biểu đồ lớp tham gia ca sử dụng Đăng ký

Biểu đồ trình tự Đăng ký

21

2.2.3 Ca sử dụng Thêm sản phẩm vào giỏ hàng

Đặc tả

Khi muốn mua một sản phẩm nào đó, trước tiên người dùng cần phải thêm sản phẩm vào giỏ hàng trên trang chủ.

- Người dùng: Chọn sản phẩm cần mua

- Hệ thống: Hiển thị ra chi tiết sản phẩm

- Người dùng: Chọn Thêm hàng vào giỏ

- Hệ thống: Hiển thị ra giỏ hàng

Biểu đồ lớp tham gia ca sử dụng Thêm sản phẩm vào gỏ hàng

23

Biểu đồ trình tự Thêm sản phẩm vào giỏ hàng

2.2.4 Ca sử dụng Đặt hàng

Đặc tả

Khi muốn đặt hàn một sản phẩm nào đó:

- Người dùng: Sau khi thêm những sản phẩm muốn mua vào giỏ hàng.Người dùng chọn Tiếp tục mua hàng

- Hệ thống: Hiển thị ra form điền thông tin

- Người dùng: Điền những thông tin cần thiết và nhấn Đặt hàng

- Hệ thống: Kiểm tra thông tin và thông báo

Biểu đồ hoạt động Đặt hàng

25

Biểu đồ lớp tham gia ca sử dụng Đặt hàng

Biểu đồ trình tự Đặt hàng

2.2.5 Ca sử dụng Xem chi tiết sản phẩm

Đặc tả

Khi Người dùng muốn xem chi tiết sản phẩm

- Người dùng: Chọn sản phẩm muốn xem

- Hệ thống: Hiển thị ra thông tin chi tiết sản phẩm

Biểu đồ hoạt động Xem chi tiết sản phẩm

27

Biểu đồ lớp tham gia ca sử dụng Xem chi tiết sản phẩm

Biểu đồ trình tự Xem chi tiết sản phẩm

2.2.6 Ca sử dụng Xem chi tiết tin tức

Đặc tả

Khi Người dùng muốn xem chi tiết tin tức

- Người dùng: Chọn tin tức muốn xem

- Hệ thống: Hiển thị ra nội dung chi tin tức

Biểu đồ hoạt động Xem chi tiết tin tức

29

Biểu đồ lớp tham gia ca sử dung Xem chi tiết tin tức

2.2.7 Thêm Người dùng

Đặc tả

Khi quản trị viên muốn thêm người dùng mới

- Quản trị viên: Đăng nhập với quyền quản trị viên

- Hệ thống: Hiển thị ra giao diện quản trị viên

- Quản trị viên:Chọn Thêm Người dùng mới

- Hệ thống : Hiển thị ra form nhập thông tin

- Quản trị viên : Điền thông tin của người dùng và chọn Thêm mới

- Hệ thống: Kiểm tra thông tin và lưu vào CSDL.Hiển thị ra danh sách người dùng

Biểu đồ hoạt động Thêm Người dùng mới

31

Biểu đồ lớp tham gia ca sử dụng Thêm Người dùng mới

Biểu đồ trình tự Thêm Người dùng mới

2.2.8 Ca sử dụng Sửa Người dùng

Đặc tả

Khi Quản trị viên muốn sửa 1 Người dùng

- Quản trị viên: Đăng nhập với quyền quản trị viên

- Hệ thống: Hiển thị ra giao diện quản trị viên

- Quản trị viên:Chọn Sửa người dùng

- Hệ thống : Hiển thị ra form hiển thị thông tin Người dùng

- Quản trị viên : Điền thông tin của người dùng và chọn Cập nhật

- Hệ thống: Kiểm tra thông tin và lưu vào CSDL.Hiển thị ra danh sách người dùng

Biểu đồ hoạt động Sửa Người dùng

33

Biểu đồ lớp tham gia ca sử dụng Sửa Người dùng

2.2.9 Ca sử dụng Xóa Người dùng

Đặc tả

Khi quản trị viên muốn xóa 1 Người dùng

- Quản trị viên: Đăng nhập với quyền quản trị viên

- Hệ thống: Hiển thị ra giao diện quản trị viên

- Quản trị viên:Chọn Xóa 1 Người dùng

Biểu đồ lớp tham gia ca sử dụng Xóa Người dùng

Biểu đồ trình tự Xóa Người dùng

2.2.10 Ca sử dụng Thêm Loại sản phẩm

Đặc tả

Khi Nhân viên muốn Thêm loại sản phẩm

- Nhân viên: Đăng nhập vào với quyền nhân viên

- Hệ thống: Hiển thị ra giao diện quyền nhân viên

- Nhân viên chọn Thêm Loại sản phẩm

- Hệ thống : Hiển thị ra form điền thông tin loại sản phẩm

- Nhân viên: Điền thông tin loại sản phẩm và chọn Thêm mới

- Hệ thống: Kiểm tra thông tin và lưu vào CSDL

Biểu đồ hoạt động Thêm Loại sản phẩm

37

Biểu đồ lớp tham gia ca sử dụng Thêm mới loại sản phẩm

2.2.11 Ca sử dụng Sửa loại sản phẩm

Đặc tả

Khi Nhân viên muốn sửa loại sản phẩm

- Nhân viên: Đăng nhập vào với quyền nhân viên

- Hệ thống: Hiển thị ra giao diện quyền nhân viên

- Nhân viên chọn Sửa 1 loại sản phẩm

- Hệ thống : Hiển thị ra form thông tin loại sản phẩm

- Nhân viên: Điền thông tin loại sản phẩm cẩn sửa và chọn Cập nhật

- Hệ thống: Kiểm tra thông tin và lưu vào CSDL

Biểu đồ hoạt động Sửa loại sản phẩm

39

Biểu đồ lớp tham gia ca sử dụng Sửa loại sản phẩm

2.2.12 Ca sử dụng Xóa loại sản phẩm

Đặc tả

Khi Nhân viên muốn xóa loại sản phẩm

- Nhân viên: Đăng nhập vào với quyền nhân viên

- Hệ thống: Hiển thị ra giao diện quyền nhân viên

- Nhân viên chọn Xóa 1 loại sản phẩm

- Hệ thống : Yêu cầu xác nhận

- Nhân viên: Chọn Đồng ý hoặc Không đồng ý

- Hệ thống: Xóa loại sản phẩm và thông báo.

Biểu đồ hoạt động Xóa loại sản phẩm

41

Biểu đồ lớp tham gia ca sử dụng Xóa loại sản phẩm

Biểu đồ trình tự Xóa loại sản phẩm

Khi Nhân viên muốn Thêm Sản phẩm

- Nhân viên: Đăng nhập vào với quyền nhân viên

- Hệ thống: Hiển thị ra giao diện quyền nhân viên

- Nhân viên chọn Thêm sản phẩm

- Hệ thống : Hiển thị form Thêm Sản phẩm

- Nhân viên: Điền thông tin sản phẩm và chọn Thêm mới

- Hệ thống: Kiểm tra thông tin và lưu vào CSDL.

Biểu đồ hoạt động Thêm sản phẩm

43

Biểu đồ lớp tham gia ca sử dụng Thêm sản phẩm

2.2.14 Ca sử dụng Sửa sản phẩm

Đặc tả

Khi Nhân viên muốn Sửa Sản phẩm

- Nhân viên: Đăng nhập vào với quyền nhân viên

- Hệ thống: Hiển thị ra giao diện quyền nhân viên

- Nhân viên chọn Sửa 1 sản phẩm

- Hệ thống : Hiển thị form thông tin chi tiết sản phẩm

- Nhân viên: Điền thông tin sản phẩm và chọn Cập nhật

- Hệ thống: Kiểm tra thông tin và lưu vào CSDL.

Biểu đồ hoạt động Sửa sản phẩm

45

Biểu đồ lớp tham gia ca sử dụng Sửa sản phẩm

2.2.15 Ca sử dụng Xóa sản phẩm

Đặc tả

Khi Nhân viên muốn Xóa 1 Sản phẩm

- Nhân viên: Đăng nhập vào với quyền nhân viên

- Hệ thống: Hiển thị ra giao diện quyền nhân viên

- Nhân viên chọn Xóa 1 sản phẩm

- Hệ thống : Yêu cầu xác nhận

- Nhân viên: Chọn Đồng ý hoặc Không đồng ý

- Hệ thống: Xóa sản phẩm và thông báo.

Biểu đồ hoạt động Xóa sản phẩm

47