Xuất phát từ những nhu cầu thực tế và tầm quan trọng của website đối với con người vì vậy chúng em quyết định xây dựngwebsite bán camera nhằm tạo ra hệ thống quản lý bán hàng có tính thi
Giới thiệu
Đặt vấn đề
Thế kỷ 21 chứng kiến sự bùng nổ của ngành Công Nghệ Thông Tin, với sự phát triển mạnh mẽ của website trên toàn cầu, giúp kết nối tri thức nhân loại Website hiện nay giữ vai trò thiết yếu trong đời sống, từ giải trí đến thương mại và quảng cáo Nhận thấy tầm quan trọng của website, chúng tôi quyết định xây dựng một trang web bán camera, nhằm tạo ra một hệ thống quản lý bán hàng thực tiễn và ứng dụng hiệu quả.
Những khó khăn gặp phải hàng ngày cạnh tranh thị trường,quảng cáo sản phẩm thu hút người tiêu dùng…
Những nhu cầu gặp phải hàng ngày giá cả hợp lý, chất lượng và số lượng sản phẩm ….để có thể thỏa mản người tiêu dùng
Mục tiêu của đề tài
Xây dựng website bán camera
Nghiên cứu công nghệ phát triển website
Giải quyết tối ưu hóa quá trình quản lý bán hàng và bán hàng
Đối tượng và phạm vi nghiên cứu
Đối tượng nghiên cứu Đối tượng nghiên cứu là cửa hàng bán máy ảnh và người có nhu cầu muốn mua máy ảnh web trực tuyến.
Đề tài nghiên cứu và phát triển tập trung vào một cửa hàng bán máy ảnh, nhằm nâng cao hiệu quả kinh doanh và tạo ra nền tảng mua sắm thuận tiện cho khách hàng.
Phương pháp nghiên cứu
Về lý thuyết, sử dụng mô hình kiến trúc Client -Server.
Về lập trình: Front-end sử dụng Php, HTLM, CSS, Bootstrap.
Back-end sử dụng Js.
Nội dung nghiên cứu
- Phân tích yêu cầu: Tiến hành phân tích nhu cầu mua bán máy ảnh online, tìm kiếm các website mua bán máy ảnh đã có để tham khảo.
- Thiết kế: Mô tả tổng quát về hệ thống, các yêu cầu chức năng, cơ sở dữ liệu và thiết kế hệ thống.
Cơ sở lý thuyết
PHP là một ngôn ngữ lập trình phía server, chủ yếu được sử dụng để phát triển các trang web và ứng dụng web động Với khả năng xử lý mạnh mẽ và linh hoạt, PHP giúp tạo ra các giải pháp web hiệu quả và tương tác.
Dễ học và sử dụng cho người mới bắt đầu.
Có khả năng kết nối với nhiều loại cơ sở dữ liệu.
Là mã nguồn mở, cộng đồng phát triển và tài liệu phong phú.
Tương thích tốt với HTML, CSS, và JavaScript.
Phiên bản sử dụng: 8.0 trở lên
Phiên bản mới nhất: PHP 8.3. b) HTML
Công cụ để làm gì: HTML (HyperText Markup Language) là ngôn ngữ đánh dấu chính để xây dựng cấu trúc và nội dung trang web. Ưu điểm:
Dễ học, dễ hiểu, và được sử dụng rộng rãi.
Tương thích với mọi trình duyệt và thiết bị.
Cơ sở cho các ngôn ngữ web khác như CSS và JavaScript.
Phiên bản sử dụng: HTML5 (tiêu chuẩn hiện tại).
Phiên bản mới nhất: HTML5. c) CSS
Công cụ để làm gì: CSS (Cascading Style Sheets) là ngôn ngữ để tạo giao diện và Ưu điểm:
Tách biệt nội dung và phong cách, dễ dàng tùy chỉnh giao diện.
Cung cấp khả năng responsive để tối ưu trên mọi thiết bị.
Có thể tái sử dụng với nhiều trang.
Phiên bản sử dụng: CSS3.
Phiên bản mới nhất: CSS3. d) JavaScript
Công cụ để làm gì: JavaScript là ngôn ngữ lập trình phía client, tạo ra các tính năng động và tương tác trên trang web. Ưu điểm:
Khả năng xử lý phía client, giúp giảm tải cho server.
Tương thích với nhiều trình duyệt và dễ dàng sử dụng cùng với HTML, CSS.
Có nhiều thư viện và framework hỗ trợ (như React, Vue, Angular).
Phiên bản sử dụng: ECMAScript 6 (ES6) trở lên.
Phiên bản mới nhất: ECMAScript 2023. e) Bootstrap
Công cụ để làm gì: Bootstrap là một framework CSS giúp xây dựng giao diện web nhanh chóng và nhất quán. Ưu điểm:
Dễ sử dụng và tăng tốc độ phát triển giao diện.
Hỗ trợ responsive design, hiển thị tốt trên nhiều loại thiết bị.
Cung cấp sẵn nhiều thành phần giao diện.
Phiên bản sử dụng: Bootstrap 5. f) MySQL
Công cụ để làm gì: MySQL là hệ quản trị cơ sở dữ liệu quan hệ, dùng để lưu trữ và quản lý dữ liệu. Ưu điểm:
Hiệu suất cao và ổn định.
Hỗ trợ giao dịch và các quy tắc toàn vẹn dữ liệu.
Mã nguồn mở, có cộng đồng rộng lớn và nhiều tài liệu hỗ trợ.
Phiên bản sử dụng: MySQL 8.0.
Phiên bản mới nhất: MySQL 8.1. g) XAMPP
Công cụ để làm gì: XAMPP là một gói phần mềm phát triển web tích hợp gồm
Apache, MySQL, PHP và Perl, giúp tạo ra môi trường phát triển trên máy tính cá nhân. Ưu điểm:
Cài đặt dễ dàng và sẵn sàng sử dụng ngay lập tức.
Tương thích với nhiều hệ điều hành (Windows, macOS, Linux).
Phù hợp cho việc phát triển và kiểm tra ứng dụng trước khi triển khai lên server thật. Phiên bản sử dụng: XAMPP 8.0 trở lên.
Phiên bản mới nhất: XAMPP 8.2.
Phân tích thiết kế
Tổng quan hệ thống
Trong thời đại công nghiệp hóa - hiện đại hóa, công nghệ thông tin trở thành nguồn tài nguyên quan trọng, phát triển mạnh mẽ cả về chiều rộng và chiều sâu Trước sự bùng nổ thông tin, các tổ chức và doanh nghiệp đang nỗ lực hoàn thiện hệ thống thông tin để tin học hóa các hoạt động nghiệp vụ Điều này dẫn đến sự ra đời của nhiều phần mềm quản lý nhằm đáp ứng nhu cầu ngày càng cao của xã hội.
Các doanh nghiệp bán kem vừa và nhỏ cần phát triển website riêng để tiếp cận đa dạng khách hàng Website thương mại điện tử giúp khách hàng dễ dàng lựa chọn sản phẩm yêu thích, nắm bắt thông tin chi tiết, quản lý giỏ hàng và đặt hàng mọi lúc, mọi nơi Đồng thời, công cụ này cũng hỗ trợ người quản lý trong việc cập nhật sản phẩm, thông tin doanh nghiệp và quản lý nhân viên, từ đó quảng bá thương hiệu hiệu quả hơn.
2.1.2 Đặc điểm người dùng và các chức năng của hệ thống
Khách hàng là những người có nhu cầu mua sắm thiết bị và tìm kiếm các mặt hàng cần thiết từ hệ thống Để đáp ứng nhu cầu này, hệ thống cần có các chức năng hỗ trợ việc đặt mua các sản phẩm một cách dễ dàng và hiệu quả.
Hiển thị danh sách các mặt hàng của cửa hàng.
Tìm kiếm theo sản phẩm
Khách hàng có thể xem giỏ hàng cá nhân
Khách hàng có thể thực hiện đặt hàng
Phần quản trị cho phép Admin kiểm soát toàn bộ hoạt động của hệ thống Admin sẽ được cấp một tên đăng nhập và mật khẩu để truy cập vào hệ thống và thực hiện các chức năng chính của mình.
Chức năng thêm, xóa các loại mặt hàng máy ảnh.
Hiển thị đơn đặt hàng, thực hiện quản lý các đơn hàng.
Quản lý người dùng(khách hàng)
Hình Phân tích thiết kế.1 Sơ đồ quy trình đặt hàng Yêu cầu:
- Thông tin đơn hàng cần được lưu lại
- Đơn hàng sẽ được admin duyệt
Quy trình xem đơn đặt hàng
Hình Phân tích thiết kế.2 Sơ đồ quy trình xem đơn đặt hàng
- Đơn hàng có thể chỉnh sửa được trạng thái
- Danh sách đơn hàng phải được cập nhật nhanh nhất
Thiết kế hệ thống
Sơ đồ Usecase tổng quát
Hình Phân tích thiết kế.3 Sơ đồ use case tổng quát.
Sơ đồ chi tiết usecase
Hình Phân tích thiết kế.4 Sơ đồ use case Đăng nhập
Hình Phân tích thiết kế.5 Sơ đồ use case chi tiết quản lý đơn hàng
Hình Phân tích thiết kế.6 Sơ đồ use case quản lý sản phẩm
Hình Phân tích thiết kế.5 Sơ đồ use case quản lý danh mục
Hình Phân tích thiết kế.6 Sơ đồ use case quản lý đơn hàng cá nhân
Hình Phân tích thiết kế.7 Sơ đồ use case xem chi tiết sản phẩm
Mô tả Use Case Đăng nhập
Tên Use case Đăng nhập
Mô tả Actor khách hàng đăng nhập vào hệ thống
Post-conditions Success: Hiển thị giao diện trang chủ.
Fail: Thông tin tài khoản hoặc mật khẩu sai.
Chọn chức năng đăng nhập.
Hệ thống hiển thị màn hình đăng nhập.
Luồng sự kiện phụ Actor nhấn nút Trở về trang chủ.
Hệ thống quay về trang chủ chưa đăng nhập.
1 Hiển thị giao diện đăng nhập admin.
2 Nhập tài khoản mật khẩu và chọn login
3 Kiểm tra tài khoản mật khẩu
3.1 Tài khoản hoặc mật khẩu trống 4.1 Thông tin tài khoản hoặc mật khẩu sai
1 Nhập tài khoản mật khẩu và chọn login
2 Kiểm tra thông tin tài khoản mật khẩu
2.1 Tài khoản hoặc mật khẩu trống 3.1 Thông tin tài khoản hoặc mật khẩu sai
Mô tả Use Case Đăng ký
Tên Use case Đăng ký
Mô tả Actor khách hàng đăng ký tài khoản mới vào hệ thống
Post-conditions Success: Hiển thị giao diện trang chủ.
Fail: Yêu cầu điền đầy đủ thông tin.
Chọn chức năng Đăng ký.
Hệ thống hiển thị màn hình Đăng ký.
Extend Use Case Đăng ký Luồng sự kiện phụ
Đăng ký
1 Nhập thông tin tài khoản và chọn đăng ký.
2 Kiểm tra tài khoản mật khẩu và các thông tin khác
2.1 Yêu cầu nhập lại đầy đủ thông tin 4.1 Thông tin tài khoản hoặc mật khẩu không hợp lệ
Mô tả Use Case Quản lý sản phẩm
Tên Use case Quản lý Sản phẩm
Diễn viên sẽ đăng nhập vào hệ thống để sử dụng các chức năng quản lý, bao gồm xem sản phẩm, thêm sản phẩm, thay đổi trạng thái và cập nhật giá sản phẩm.
Pre-conditions Đăng nhập tài khoản admin
Post-conditions Success: Hiển thị giao diện Quản lý sản phẩm
Fail: Không thể truy cập
Actor chọn chức năng Đăng Nhập.
Hệ thống hiển thị màn hình Quản lý Sản phẩm.
Extend Use Case Thêm sản phẩm
Extend Use Case Sửa Sản Phẩm.
Extend Use Case Xoá Sản Phẩm.
Luồng sự kiện phụ Actor nhấn nút Đăng xuất
Hệ thống quay về trang Đăng Nhập.
1 Actor nhập thông tin sản phẩm cần thêm.
4 Kiểm tra tính hợp lệ thông tin.
3.1 Thông tin rỗng 3.2 Quay lại bước 1
4.1 Thông tin không hợp lệ.
4.2 Lặp lại bước 1 luồng sự kiện chính.
Sửa sản phẩm
1 Actor chọn sửa và nhập thông tin sản phẩm cần sửa.
4 Kiểm tra tính hợp lệ thông tin.
3.1 Thông tin rỗng 3.2 Quay lại bước 1
4.1 Thông tin không hợp lệ.
4.2 Lặp lại bước 1 luồng sự kiện chính.
1 Actor chọn xem danh sách sản phẩm.
4 Kiểm tra tính hợp lệ thông tin.
3.1 Thông tin rỗng 3.2 Quay lại bước 1
4.1 Thông tin không hợp lệ.
4.2 Lặp lại bước 1 luồng sự kiện chính.
Mô tả Quản lý đơn hàng cá nhân
Tên Use case Quản lý đơn hàng cá nhân
Khách hàng cần đăng nhập vào hệ thống để sử dụng chức năng quản lý đặt hàng, bao gồm các thao tác như xem đơn đặt hàng, tìm kiếm đơn đặt hàng, thêm đơn đặt hàng và hủy đơn đặt hàng.
Post-conditions Success: Hiển thị giao diện Quản lý đặt hàng.
Fail: Không thể truy cập.
Chọn chức năng Quản lý đặt hàng.
Hệ thống hiển thị màn hình Quản lý đặt hàng.
Extend Use Case Xem chi tiết đơn đặt hàng.
Luồng sự kiện phụ Actor nhấn nút Đăng xuất.
Hệ thống quay về trang chủ chưa đăng nhập.
Xem chi tiết đơn đặt hàng
1 Khách hàng chọn vào đơn đặt hàng.
2 Nhấn xem đơn đặt hàng
3.1 Đơn hàng tồn tại 3.2 Xuất ra màn hình
3.1 Không có đơn hàng không tồn tại 3.2 Xuất ra màn hình
Tên Use case Quản lý đơn hàng
Mô tả Actor nhân viên xem thông tin phiếu đặt hàng trong hệ thống và thực hiện các chức năng xóa,sửa Pre-conditions Đăng nhập tài khoản admin
Post-conditions Success:quản lý được trang web(xóa ,sửa ,…phiếu đặt hàng)
Fail:đăng nhập thất bại => không vào được trang web
Actor chọn chức năng Quản lý đơn hàng.
Hệ thống hiển thị màn hình Quản lý đơn hàng.
Luồng sự kiện phụ Actor nhấn nút Thoát
Hệ thống hủy màn hình Quản lý đơn hàng.
1 Actor chọn duyệt đơn hàng trong danh sách đơn hàng
2 Hiển thị giao diện sửa tình trạng đơn hàng.
3 Actor sửa tình trạng và chọn xác nhận.
5 Hiển thị thông tin cập nhật.
6 Về lại trang Quản lý đơn hàng
4.1 Cập nhật cơ sở dữ liệu không thành công
5.1 Hiển thị danh sách đơn hàng mới không thành công.
1 Actor chọn xóa đơn hàng trong danh sách đơn hàng
3 Hiển thị thông tin danh sách đơn hàng mới cập nhật.
Về lại trang Quản lý đơn hàng
2.1 Cập nhật cơ sở dữ liệu không thành công
Rẽ nhánh 2 3.1 Hiển thị danh sách đơn hàng mới không thành công.
Mô tả Use Case Quản lý danh mục
Tên Use case Quản lý danh mục
Diễn viên nhân viên cần đăng nhập vào hệ thống để sử dụng chức năng quản lý đơn đặt hàng, bao gồm việc xem, tìm kiếm, thêm và hủy đơn đặt hàng Điều kiện tiên quyết là phải đăng nhập bằng tài khoản admin.
Post-conditions Success: Hiển thị giao diện Quản lý danh mục.
Fail: Không thể truy cập.
Chọn chức năng Quản lý danh mục.
Hệ thống hiển thị màn hình Quản lý danh mục.
Luồng sự kiện phụ Actor nhấn nút Đăng xuất.
Hệ thống quay về trang chủ chưa đăng nhập.
1 Khách hàng chọn vào thêm danh mục.
2 Nhập tên danh mục sau đó chọn lưu
3.1 Danh mục đã tồn tại
1 Khách hàng chọn vào xoá danh mục.
Hình Phân tích thiết kế.7 Sơ đồ lớp
Sơ đồ lớp và mô tả các bảng dữ liệu
Mô tả: Bảng user chứa danh sách người dùng
Thuộc tính Kiểu K U M Diễn giải id Char(10) x x x Mã khách hàng fullname Char(30) x Tên đầy đủ của khách hàng
Username Char(100) x Tên khách hàng password Char(100) x Mật khẩu
Mô tả: Bảng user chứa danh sách người dùng
Thuộc tính Kiểu K U M Diễn giải
Email Nvarchar(50) x Email khách hàng
Gioitinh Nvarchar(50) x Giới tính khách hàng
Mô tả: Bảng admin chứa danh mục những nhân viên của cửa hàng
Thuộc tính Kiểu K U M Diễn giải
Id Char(10) x x x Mã nhân viên
Username Nvarchar(30) x Tên đăng nhập
Password Nvarchar(50) x Mật khẩu status Char(10) x Trạng thái tài khoản
Mô tả: Bảng odersdetail chứa những chi tiết có trong hóa đơn
Thuộc tính Kiểu K U M Diễn giải
Oderid Char(10) x x x Số thứ tự hóa đơn productid Char(30) x x Mã hóa đơn
Quantity Int x Số lượng sản phẩm price Money x Số tiền trong hóa đơn
Product_name Char(30) x Tên sản phẩm
Mô tả: Bảng product chứa danh sách sản phẩm
Thuộc tính Kiểu K U M Diễn giải
Id int(11) x x x Id sản phẩm
Mô tả: Bảng product chứa danh sách sản phẩm
Thuộc tính Kiểu K U M Diễn giải name Nvarchar(50) x Tên sản phẩm
Image Text Hình ảnh sản phẩm
Content Text x Mô tả sản phẩm
Mô tả: Bảng danhmuc chứa danh mục sản phẩm
Thuộc tính Kiểu K U M Diễn giải
Id int(11) x x x Số thứ tự giao hàng name Char(30) x x Mã hàng hóa
Mô tả: Bảng oders chứa danh sách đơn hàng của khách hàng
Thuộc tính Kiểu K U M Diễn giải
Id int (11) x x x Mã đơn hàng
Userid int (11) x x Mã khách hàng
Name Char(30) x Tên khách hàng
Email Text x Email khách hàng
Phone Char(15) Số điện thoại khách hàng
Address Text Địa chỉ khách hàng
Status Tyniint(4) Trạng thái đơn hàng
Mô tả: Bảng Imagelibrary chứa danh sách các ảnh sản phẩm
Thuộc tính Kiểu K U M Diễn giải id int(11) x x x Id ảnh productid int(11) x x Id sản phẩm path Text x Đường dẫn đến nơi lưu ảnh
Hình Phân tích thiết kế.8 Sơ đồ trình tự đăng nhập
Hình Phân tích thiết kế.9 Sơ đồ trình tự đăng nhập admin
Hình Phân tích thiết kế.10 Sơ đồ trình tự đăng ký
Hình Phân tích thiết kế.11 Sơ đồ trình tự đặt hàng
Hình Phân tích thiết kế.12 Sơ đồ trình tự Quản lý đơn hàng
Hình Phân tích thiết kế.13 Sơ đồ trình tự Thêm sản phẩm
Hình Phân tích thiết kế.14 Sơ đồ trình tự Xem chi tiết đơn hàng
Demo
Các giao diện, chức năng chính của website
Màn hình nhập liệu đăng ký
Hình Demo.7 Giao diện đăng ký
Màn hình nhập liệu đăng nhập
Hình Demo.8 Giao diện đăng nhập
Màn hình nhập liệu xác nhận đơn hàng
Giao diện trang chủ của người dùng
Hình Demo.10 Giao diện trang chủ của người dùng
Xem chi tiết sản phẩm
Hình Demo.11 Giao diện Xem chi tiết sản phẩm
Xem chi tiết đơn hàng
Hình Demo.12 Giao diện xem chi tiết đơn hàng
Hình Demo.13 Giao diện trang chủ admin
Trang quản lý khách hàng
Hình Demo.11 Giao diện trang quản lý khách hàng
Trang quản lý sản phẩm
Hình Demo.12 Giao diện trang quản lý sản phẩm
Trang quản lý đơn hàng
Hình Demo.13 Giao diện trang quản lý đơn hàng
Hướng dẫn sử dụng cơ bản
Hướng dẫn đặt hàng bằng tài khoản người dùng
Giao diện chính để lựa chọn sản phẩm
Khách hàng chọn sản phẩm bất kì, sau đó màn hình sẽ chuyển qua trang chi tiết sản phẩm mà khách hàng vừa chọn.
Sau khi hoàn tất việc chọn mua, sản phẩm sẽ được chuyển vào giỏ hàng, nơi khách hàng có thể kiểm tra số lượng, đơn giá và tổng tiền của các mặt hàng Những sản phẩm đã được thêm vào giỏ hàng trước đó cũng sẽ hiển thị tại đây.
Khách hàng bấm đặt hàng sẽ hiển thị trang xác nhận thông tin
Sau khi xác nhận thông tin, khách hàng sẽ được chuyển đến trang xử lý đơn hàng, nơi họ có thể theo dõi tình trạng đơn hàng và xem chi tiết sản phẩm đã đặt.
