GIỚI THIỆU ĐỀ TÀI
Đặt vấn đề
Ngày nay, nhiều cửa hàng kinh doanh hoạt động chủ yếu vẫn mang tính thủ công, dựa vào kinh nghiệm của hệ thống nhân viên Do đặc điểm lượng hàng hoá nhập xuất ngày càng lớn nên công tác quản lí, mua bán mất rất nhiều thời gian, công sức mà độ chính xác không cao, điều này nhiều khi gây thiệt hại cho cửa hàng.
Giải Pháp
Nhận thấy tình hình trên, nhóm em đã lên ý tưởng xây dựng một ứng dụng hỗ trợ công tác quản lý và bán hàng “Xây dựng ứng dụng web Plan” ra đời nhằm đáp ứng nhu cầu quản lí hàng hóa, bán hàng và tối ưu hóa quy trình kinh doanh.Đồng thời, nâng cao trải nghiệm của khách hàng.
Mục tiêu đề tài
- Tối ưu hóa quy trình kinh doanh: "PlanB" được phát triển nhằm tối ưu hóa quy trình kinh doanh cho các cửa hàng, chợ đồ cũ hoặc cá nhân bán đồ secondhand. Ứng dụng cung cấp các tính năng quản lý hàng hóa, đặt hàng, ghi chú, và xác định giá trị hàng hóa Nhờ đó, người dùng có thể dễ dàng quản lý hàng tồn kho, tạo ra báo cáo thống kê, và theo dõi lịch sử giao dịch, giúp tăng cường hiệu quả kinh doanh và tiết kiệm thời gian.
- Nâng cao hiệu suất bán hàng: "PlanB" giúp người dùng nâng cao hiệu suất bán hàng thông qua việc theo dõi doanh thu, định giá sản phẩm, và quản lý khách hàng Các tính năng báo cáo và thống kê của ứng dụng giúp người dùng đánh giá hiệu quả kinh doanh, xác định các sản phẩm hot nhất và kế hoạch tiếp thị, từ đó tối ưu hóa doanh thu và tăng cường lợi nhuận.
- Quản lí hàng tồn kho hiệu quả: "PlanB" cung cấp các công cụ quản lí hàng tồn kho giúp người dùng kiểm soát số lượng, thông tin và trạng thái của sản phẩm.Tính năng này giúp người dùng dễ dàng theo dõi số lượng hàng tồn, phân loại sản phẩm, và nhanh chóng tìm kiếm thông tin về sản phẩm cụ thể Điều này giúp người dùng quản lí hàng tồn kho một cách chính xác, tránh thất thoát và lãng phí nguồn lực.
- Tăng cường khả năng tiếp cận khách hàng: "PlanB" hỗ trợ người dùng trong việc xây dựng và quản lí danh sách khách hàng, ghi chú các thông tin quan trọng và theo dõi lịch sử mua hàng của khách hàng Điều này giúp người dùng tạo dựng mối quan hệ khách hàng mạnh mẽ, đáp ứng nhu cầu của khách hàng và tăng cường sự hài lòng của họ.
- Nâng cao trải nghiệm bán hàng: "PlanB" tạo điều kiện thuận lợi cho người dùng trong việc quản lí và bán hàng secondhand Ứng dụng cung cấp giao diện dễ sử dụng, giúp người dùng nhanh chóng đăng tải sản phẩm, cập nhật thông tin, và quản lí các hoạt động kinh doanh hàng ngày Điều này giúp người dùng tạo ra trải nghiệm bán hàng thuận tiện, đáp ứng nhu cầu ngày càng đa dạng của khách hàng và tạo dựng lòng tin.
Đối tượng sử dụng
PlanB hướng đến các chủ cửa hàng, chợ đồ cũ và cá nhân bán đồ secondhand Đối tượng sử dụng bao gồm những người muốn quản lí và bán hàng qua mô hình ký gửi hoặc bán đồ cũ trực tuyến Ứng dụng này phù hợp cho các cửa hàng quần áo, cửa hàng đồ cũ, gian hàng chợ đồ cũ, hay cá nhân có nhu cầu bán hàng secondhand "PlanB" giúp đơn giản hóa quy trình quản lí hàng hóa, tăng cường khả năng tiếp cận khách hàng, và nâng cao trải nghiệm bán hàng.
Công cụ sử dụng
- Công cụ dùng để phân tích, thiết kế: Figma, draw.io, StarUML
- Công cụ phát triển: Visual Studio Code
- Công cụ quản lý dự án: Github, Google Drive, Messenger
- Công cụ soạn thảo văn bản: Microsoft Word
Phạm vi nghiên cứu
- Thiết kế giao diện người dùng: Figma
- Các ngôn ngữ lập trình và công nghệ phát triển website: HTML, CSS, JavaScript.
- Các framework hỗ trợ: ReactJS, NodeJS
- Phần mềm lập trình: Visual Studio Code
Tổng quan về đồ án
Ứng dụng Website PlanB là một hệ thống quản lí cửa hàng ký gửi quần áo cũ, giúp chủ cửa hàng quản lí hàng hóa, bán hàng và tối ưu hóa quy trình kinh doanh Đồng thời, khách hàng cũng có thể tìm kiếm và mua sắm những sản phẩm quần áo chất lượng từ cửa hàng ký gửi thông qua giao diện trực tuyến thuận tiện và dễ sử dụng.
Mô tả quy trình thực hiện các công việc chính
Bước 1: Xác định các yêu cầu:
- Phân tích khả thi quy mô thực hiện.
- Tìm hiểu quy trình nghiệp vụ.
- Tham khảo và trải nghiệm các ứng dụng liên quan.
- Khảo sát người dùng qua mạng.
- Thu thập thông tin yêu cầu.
Bước 2: Thiết kế hệ thống:
- Vẽ sơ đồ Use-case: phân tích nghiệp vụ tổng quan.
Bước 3: Thiết kế dữ liệu
- Thiết kế dữ liệu tương ứng với từng loại yêu cầu của phần mềm để đảm bảo được tính đúng đắn và tính tiến hóa với phần mềm, có hiệu quả về mặt truy xuất và lưu trữ
- Xác định và lập danh sách các bảng dữ liệu cần thiết cho các yêu cầu của phần mềm
- Xây dựng sơ đồ logic cụ thể của phần mềm
Bước 4: Thiết kế giao diện
- Lập ra danh sách các màn hình khi người dùng tương tác với phần mềm
- Mô tả các đối tượng trên từng màn hình
- Xác định những chức năng hiển thị trên từng màn hình
Bước 5: Code và kiểm thử
- Code trình bày theo mô hình 3 lớp và được phân chia theo các nhiệm vụ yêu cầu.
- Testcase rõ ràng để kiểm tra tính hiệu quả của hệ thống.
TÌM HIỂU CƠ SỞ LÝ THUYẾT
Ngôn ngữ lập trình JavaScript
JavaScript là ngôn ngữ lập trình phổ biến nhất trên thế giới trong suốt 20 năm qua Nó cũng là một trong số 3 ngôn ngữ chính của lập trình web:
HTML: Giúp bạn thêm nội dung cho trang web.
CSS: Định dạng thiết kế, bố cục, phong cách, canh lề của trang web.
JavaScript: Cải thiện cách hoạt động của trang web
JavaScript có thể học nhanh và dễ dàng áp dụng cho nhiều mục đích khác nhau, từ việc cải thiện tính năng của website đến việc chạy game và tạo phần mềm nền web Hơn nữa, có hàng ngàn mẫu template JavaScript và ứng dụng ngoài kia,nhờ vào sự cống hiến của cộng đồng, đặc biệt là Github.
Hình 2 2 JavaScript https://s.net.vn/65EF [Truy c p ngày 26 tháng 5, 2023]ập
2.2.1 Lịch sử hình thành JavaScript
JavaScript được tạo trong mười ngày bởi Brandan Eich, một nhân viên của Netscape, vào tháng 9 năm 1995 Được đặt tên đầu tiên là Mocha, tên của nó được đổi thành Mona rồi LiveScript trước khi thật sự trở thành JavaScript nổi tiếng như bây giờ Phiên bản đầu tiên của ngôn ngữ này bị giới hạn độc quyền bởi Netscape và chỉ có các tính năng hạn chế, nhưng nó tiếp tục phát triển theo thời gian, nhờ một phần vào cộng đồng các lập trình viên đã liên tục làm việc với nó.
Trong năm 1996, JavaScript được chính thức đặt tên là ECMAScript. ECMAScript 2 phát hành năm 1998 và ECMAScript 3 tiếp tục ra mắt vào năm
1999 Nó liên tục phát triển thành JavaScript ngày nay, giờ đã hoạt động trên khắp mọi trình duyệt và trên khắp các thiết bị từ di động đến máy tính bàn.
JavaScript liên tục phát triển kể từ đó, có lục đạt đến 92% website đang sử dụng JavaScript vào năm 2016 Chỉ trong 20 năm, nó từ một ngôn ngữ lập trình riêng trở thành công cụ quan trọng nhất trên bộ công cụ của các chuyên viên lập trình web Nếu bạn đang dùng internet, vậy chắc chắn bạn đã từng sử dụngJavaScript rồi.
2.2.2 Ưu nhược điểm của JavaScript Ưu điểm của Javascript:
Javascript giúp thao tác với người dùng ở phía client và tách biệt giữa các client Ví dụ 2 người đang truy cập vào 2 trình duyệt khác nhau thì cả hai đều có những phiên xử lý Javascript khác nhau, không ảnh hưởng lẫn nhau.
Javascript có thể hoạt động trên nhiều nền tảng khác nhau, từ Windows, macOS cho đến các hệ điều hành trên mobile.
Javascript là một ngôn ngữ dễ tiếp cận, bạn sẽ dễ dàng học nó mà không cần phải cài đặt quá nhiều phần mềm.
Vì là một ngôn ngữ rất dễ dàng bị lộ code nên dễ bị khai thác Hacker có thể nhập một đoạn code bất kì vào khung console của trình duyệt, lúc này trình duyệt sẽ hiểu rằng đoạn code đó là chính thống, nên hacker có thể gửi nhửng request lên server một cách dễ dàng.
Javascript Framework là một bộ thư viện được xây dựng dựa vào ngôn ngữ lập trình Javascript Mỗi framework thường được tạo ra để phục vụ cho một lĩnh vực nào đó Ví dụ với Angular và React thì chuyên xử lý frontend, NodeJS thì chuyên xử lý backend, jQuery là một thư viện rất mạnh khi xử lý DOM HTML và CSS
Sức mạnh của Javascript là không thể chối cãi, bằng chứng là hiện nay có rất nhiều libraries và framework được viết bằng Javascript ra đời như:
• Angular: Một thư viện dùng để xây dựng ứng dụng Single Page.
• NodeJS: Một thư viện được phát triển phía Server dùng để xây dựng ứng dụng realtime.
• Sencha Touch: Một Framework dùng để xây dựng ứng dụng Mobile.
• ExtJS: Một Framework dùng xây dựng ứng dụng quản lý (Web
• jQuery: Một thư viện rất mạnh về hiệu ứng.
• ReactJS: Một thư viện viết ứng dụng web.
• Và còn nhiều thư viện khác.
ReactJS
ReactJS là một thư viện JavaScript phổ biến được sử dụng để xây dựng giao diện người dùng (UI) cho các ứng dụng web Nó được phát triển bởi Facebook và đã được cộng đồng phát triển rộng rãi.
Hình 2 3 ReactJS https://s.net.vn/SSWu [Truy cập 25-06-2023]
ReactJS sử dụng một nguyên tắc gọi là "Virtual DOM" để cải thiện hiệu suất và tăng tốc độ render giao diện người dùng Khi một thành phần React được tạo, nó tạo ra một cây Virtual DOM, là một phiên bản ảo của cây DOM thực sự trong trình duyệt React sẽ theo dõi các thay đổi trong trạng thái của thành phần và chỉ cập nhật những phần cần thiết trên cây Virtual DOM Sau đó, React so sánh cây VirtualDOM mới với cây Virtual DOM cũ và chỉ cập nhật các phần khác nhau vào DOM thực sự Điều này giúp giảm thiểu số lượng các thao tác tác động đến DOM, giúp ứng dụng chạy mượt hơn.
Hiệu suất cao: Nhờ sử dụng Virtual DOM và cách quản lý trạng thái thông minh, ReactJS có thể cải thiện hiệu suất ứng dụng web Thay vì cập nhật toàn bộ DOM, React chỉ cập nhật những phần cần thiết, giúp giảm độ phức tạp và tối ưu hóa tốc độ render.
Quản lý trạng thái dễ dàng: React sử dụng khái niệm "state" để quản lý trạng thái của các thành phần Việc quản lý trạng thái dễ dàng giúp phát triển ứng dụng dễ dàng hơn và giúp tái sử dụng thành phần một cách hiệu quả.
Cộng đồng và hệ sinh thái mạnh mẽ: ReactJS có một cộng đồng lớn và đông đảo, với rất nhiều tài liệu, tài nguyên và các thành phần có thể tái sử dụng Điều này giúp cho việc học hỏi và phát triển ứng dụng dễ dàng hơn.
Khả năng học và khởi đầu ban đầu: ReactJS có một học phần ngưỡng cao ban đầu Việc hiểu và áp dụng các khái niệm như JSX, Virtual DOM, props, state, lifecycle methods và Redux có thể đòi hỏi một quá trình học tập khá lâu và công phu.
Quản lý trạng thái phức tạp: Khi ứng dụng React phức tạp và có nhiều thành phần liên quan, quản lý trạng thái có thể trở nên phức tạp hơn Việc đồng bộ hóa và quản lý trạng thái giữa các thành phần có thể đòi hỏi sự quan tâm và kỹ năng để tránh việc gặp phải các vấn đề như rò rỉ bộ nhớ hoặc hiệu suất kém.
Tuy nhiên, nhược điểm của ReactJS có thể được khắc phục và vượt qua thông qua việc nắm vững kiến thức và kỹ năng phù hợp và sử dụng các thư viện hỗ trợ như Redux hoặc MobX để quản lý trạng thái phức tạp hơn.
NodeJS
Node.js là một môi trường chạy mã JavaScript phía máy chủ, được xây dựng trên JavaScript engine của Chrome (V8 engine) Nó cho phép chúng ta thực thi mã JavaScript bên ngoài trình duyệt, điều này đặc biệt hữu ích cho việc phát triển ứng dụng web phía máy chủ.
Hình 2 4 NodeJS https://s.net.vn/ubsR [Truy cập ngày 25 tháng 06, 2023]
Node.js hoạt động theo mô hình non-blocking, single-threaded, event-driven.
Nó sử dụng một cơ chế gọi là "event loop" để xử lý các yêu cầu và sự kiện một cách hiệu quả Khi một yêu cầu đến, Node.js không chờ đợi các hoạt động đồng bộ hoàn thành mà tiếp tục xử lý các yêu cầu khác Khi các hoạt động đồng bộ hoàn thành hoặc có sự kiện nào đó xảy ra, Node.js sẽ thông báo thông qua callback hoặc sự kiện tương ứng Điều này cho phép Node.js xử lý đồng thời nhiều yêu cầu mà không gây block đối với các yêu cầu khác.
Hiệu suất cao: Với mô hình non-blocking và event-driven, Node.js có khả năng xử lý hàng ngàn kết nối đồng thời mà không gây block Điều này giúp cải thiện hiệu suất của ứng dụng và đáp ứng tốt với tải cao.
Phát triển dễ dàng: Node.js sử dụng JavaScript, ngôn ngữ phổ biến và quen thuộc, cho phép lập trình viên sử dụng cùng một ngôn ngữ cả phía máy chủ và phía khách hàng Điều này giúp giảm độ phức tạp và đơn giản hóa quá trình phát triển ứng dụng.
Cộng đồng lớn: Node.js có một cộng đồng lớn và đông đảo, với rất nhiều thư viện và công cụ hữu ích Cộng đồng phát triển sôi nổi này cung cấp sự hỗ trợ, tài liệu và giải pháp cho các vấn đề phát triển.
Đơn luồng: Mặc dù Node.js có khả năng xử lý đồng thời, nhưng do chạy trên một luồng duy nhất, nếu một yêu cầu tốn nhiều thời gian xử lý, nó có thể làm giảm hiệu suất của toàn bộ ứng dụng Vì vậy, Node.js không phù hợp cho các tác vụ đòi hỏi xử lý trên nhiều luồng đồng thời.
Quản lý trạng thái phức tạp: Vì Node.js không có một framework hoàn chỉnh, việc quản lý trạng thái phức tạp có thể trở nên khó khăn Lập trình viên phải dựa vào các thư viện bên thứ ba hoặc tự xây dựng các cơ chế để quản lý trạng thái hiệu quả.
Phần mềm lập trình VSCode
Visual Studio Code (VS Code hay VSC) là một trong những trình soạn thảo mã nguồn phổ biến nhất được sử dụng bởi các lập trình viên Nhanh, nhẹ, hỗ trợ đa nền tảng, nhiều tính năng và là mã nguồn mở chính là những ưu điểm vượt trội khiến VS Code ngày càng được ứng dụng rộng rãi.
Hình 2 5 Visual Studio Code https://s.net.vn/Wqfi [Truy c p ngày 26 tháng 5, 2023]ập
Hỗ trợ nhiều ngôn ngữ lập trình
Visual Studio Code hỗ trợ nhiều ngôn ngữ lập trình như C/C++, C#, F#, Visual Basic, HTML, CSS, JavaScript, Vì vậy, nó dễ dàng phát hiện và đưa ra thông báo nếu chương chương trình có lỗi.
Hỗ trợ đa nền tảng
Các trình viết code thông thường chỉ được sử dụng hoặc cho Windows hoặc Linux hoặc Mac Systems Nhưng Visual Studio Code có thể hoạt động tốt trên cả ba nền tảng trên.
Cung cấp kho tiện ích mở rộng
Trong trường hợp lập trình viên muốn sử dụng một ngôn ngữ lập trình không nằm trong số các ngôn ngữ Visual Studio hỗ trợ, họ có thể tải xuống tiện ích mở rộng Điều này vẫn sẽ không làm giảm hiệu năng của phần mềm, bởi vì phần mở rộng này hoạt động như một chương trình độc lập.
Kho lưu trữ an toàn Đi kèm với sự phát triển của lập trình là nhu cầu về lưu trữ an toàn. Với Visual Studio Code, người dùng có thể hoàn toàn yên tâm vì nó dễ dàng kết nối với Git hoặc bất kỳ kho lưu trữ hiện có nào.
Visual Studio Code hỗ trợ nhiều ứng dụng web Ngoài ra, nó cũng có một trình soạn thảo và thiết kế website.
Lưu trữ dữ liệu dạng phân cấp
Phần lớn tệp lưu trữ đoạn mã đều được đặt trong các thư mục tương tự nhau Ngoài ra, Visual Studio Code còn cung cấp các thư mục cho một số tệp đặc biệt quan trọng.
Một số đoạn code có thể thay đổi chút ít để thuận tiện cho người dùng Visual Studio Code sẽ đề xuất cho lập trình viên các tùy chọn thay thế nếu có.
Hỗ trợ thiết bị đầu cuối
Visual Studio Code có tích hợp thiết bị đầu cuối, giúp người dùng khỏi phải chuyển đổi giữa hai màn hình hoặc trở về thư mục gốc khi thực hiện các thao tác.
Người dùng Visual Studio Code có thể mở cùng lúc nhiều tệp tin và thư mục, mặc dù chúng không hề liên quan với nhau.
Hầu hết các trình viết mã đều có tính năng nhắc mã Intellisense, nhưng ít chương trình nào chuyên nghiệp bằng Visual Studio Code Nó có thể phát hiện nếu bất kỳ đoạn mã nào không đầy đủ Thậm chí, khi lập trình viên quên không khai báo biến, Intellisense sẽ tự động giúp họ bổ sung các cú pháp còn thiếu.
Visual Studio Code hỗ trợ kéo hoặc sao chép mã trực tiếp từ GitHub.
Mã này sau đó có thể được thay đổi và lưu lại trên phần mềm.
Tiêu tốn tài nguyên: VS Code có khả năng tiêu tốn một lượng tài nguyên khá lớn, đặc biệt khi bạn làm việc trên các dự án lớn hoặc mở nhiều tab cùng một lúc Điều này có thể ảnh hưởng đến hiệu suất của máy tính, đặc biệt là trên các máy tính có cấu hình thấp.
Đôi khi chậm khi mở các tệp lớn: Khi mở các tệp tin lớn, VS Code có thể trở nên chậm và có thể mất thời gian để phản hồi Điều này đặc biệt đáng chú ý khi bạn làm việc trên các dự án có nhiều tệp tin hoặc tệp tin có kích thước lớn.
Tích hợp đa công cụ phụ thuộc vào các tiện ích bên thứ ba: Mặc dù VS
Code đi kèm với một số tính năng mạnh mẽ và tiện ích tích hợp sẵn, để sử dụng các tính năng đặc biệt hoặc mở rộng khả năng của trình soạn thảo, bạn phải cài đặt các tiện ích bên thứ ba Điều này có thể yêu cầu thời gian và công sức để tìm hiểu và tích hợp các tiện ích này.
Dịch vụ Github
Hình 2 6 Github https://s.net.vn/f2Q2 [Truy c p ngày 26 tháng 5, 2023]ập
GitHub là một dịch vụ cung cấp kho lưu trữ mã nguồn Git dựa trên nền tảng web cho các dự án phát triển phần mềm GitHub cung cấp cả phiên bản trả tiền lẫn miễn phí cho các tài khoản.
Các dự án mã nguồn mở sẽ được cung cấp kho lưu trữ miễn phí Tính đến tháng 4 năm 2016, GitHub có hơn 14 triệu người sử dụng với hơn 35 triệu kho mã nguồn, làm cho nó trở thành máy chủ chứa mã nguồn lớn trên thế giới.
Github đã trở thành một yếu tố có sức ảnh hưởng trong cộng đồng phát triển mã nguồn mở.
Thậm chí nhiều nhà phát triển đã bắt đầu xem nó là một sự thay thế cho sơ yếu lý lịch và một số nhà tuyển dụng yêu cầu các ứng viên cung cấp một liên kết đến tài khoản Github để đánh giá ứng viên.
Dự án trên Github có thể được truy cập và thao tác sử dụng một giao diện dòng lệnh và làm việc với tất cả các lệnh Git tiêu chuẩn Github cũng cho phép người dùng đăng ký và không đăng ký để duyệt kho công cộng trên trang web.Github cũng tạo ra nhiều client và plugin cho máy tính để bàn.
PHÂN TÍCH THIẾT KẾ HỆ THỐNG
ĐẶC TẢ USE CASE
Hình 3 1 Sơ đồ Use case
Bảng 3.1 Danh sách Use Case
Role Đăng nhập Cho phép đăng nhập để sử dụng hệ thống Đăng xuất Cho phép thoát ra khỏi hệ thống
Quản lý Ký gửi Thêm sản phẩm, xác nhận tạo hóa đơn, hủy ký gửi Quản lý Thanh toán Tìm kiếm sản phẩm, xác nhận tạo hóa đơn Quản lý Hóa đơn Tìm kiếm, xóa, in hóa đơn, thanh toán hóa đơn ký gửiQuản ký Khách hàng Tìm kiếm, thêm, xóa khách hàngQuản lý Sản phẩm Tìm kiếm, xóa, in barcode sản phẩm
Biểu đồ Lọc thống kê theo ngày/tháng/năm Quản lý Nhân viên Tìm kiếm, thêm, xóa nhân viên Quản lý Chấm công Chọn thời gian, chấm công, lưu bảng Quản lý Báo cáo Xuất báo cáo
Quản lý Tài khoản Tìm kiếm, xóa tài khoản
Bảng 3.2 Use case Đăng nhập
Tên Use case Đăng nhập
Mô tả Cho phép đăng nhập sử dụng hệ thống
Người thực hiện (Actor) Nhân viên
Sự kiện kích hoạt (Trigger) Bấm chọn đăng nhập Điều kiện tiên quyết
Nhập tài khoản đã được đăng ký trước đó Điều kiện kết quả
(Post-Conditions) Đăng nhập thành công và vào màn hình chính
1 Hệ thống hiển thị màn hình đăng nhập
2 Nhân viên nhập tài khoản, mật khẩu và nhấn nút đăng nhập.
3 Hệ thống xác nhận tài khoản và mật khẩu đúng theo yêu cầu.
4 Hệ thống xác nhận dữ liệu nhập vào trùng với dữ liệu trong Database.
5 Xác nhận thành công, hệ thống chuyển tới trang chủ.
3a Hệ thống xác nhận tài khoản và mật khẩu không đúng theo yêu cầu Use case trở về với bước 2.
4a Hệ thống xác nhận dữ liệu nhập không trùng khớp với dữ liệu trong Database Use case trở về với bước 2.
Bảng 3.3 Use case Đăng xuất
Tên Use case Đăng xuất
Mô tả Cho phép thực hiện chức năng đăng xuất khỏi phiên làm việc của tài khoản hiện tại Người thực hiện (Actor) Nhân viên
Sự kiện kích hoạt (Trigger) Bấm chọn Đăng xuất Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập thành công vào hệ thống Điều kiện kết quả
Tài khoản được Đăng xuất khỏi hệ thống
2 Hệ thống thoát khỏi tài khoản đang Đăng nhập
3 Hệ thống trở về màn hình Đăng nhập Kịch bản thay thế
Bảng 3.4 Use case Quản lý Ký gửi
Tên Use case Quản lý Ký gửi
Mô tả Thêm sản phẩm, xác nhận tạo hóa đơn, hoặc hủy ký gửi Người thực hiện (Actor) Nhân viên
Sự kiện kích hoạt (Trigger) Bấm vào các button như Thêm sản phẩm, xác nhận tạo hóa đơn hoặc hủy ký gửi Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập thành công vào hệ thống Điều kiện kết quả
Thực hiện các thao tác như thêm sản phẩm, xác nhận tạo hóa đơn hoặc hủy ký gửi thành công
Kịch bản chính 1 Hệ thống hiển thị trang Quản lý Ký gửi
(Basic Flow) 2 Nhân viên chọn 1 chức năng (Thêm sản phẩm, xác nhận tạo hóa đơn, hủy ký gửi)
3 Nhập thông tin sản phẩm
4 Xác nhận thêm sản phẩm
- Xác nhận tạo hóa đơn:
5 Sau khi thêm sản phẩm thành công
6 Nhấn nút xác nhận tạo hóa đơn
7 Thông báo tạo hóa đơn thành công
8 Sau khi thêm sản phẩm thành công
9 Nhấn nút hủy hóa đơn
10 Thông báo hủy hóa đơn thành công Kịch bản thay thế
- Xác nhận thêm hóa đơn trước thêm sản phẩm Trở về use case 2 để thêm sản phẩm
- Hủy hóa đơn trước khi thêm sản phẩm Trở về use case 2 để thêm sản phẩm
Bảng 3.5 Use case Quản lý Thanh toán
Tên Use case Quản lý Thanh toán
Mô tả Tìm kiếm mã sản phẩm, Xác nhận tạo hóa đơn
Người thực hiện (Actor) Nhân viên
Sự kiện kích hoạt (Trigger) Nhập mã sản phẩm, Nhấn nút xác nhận tạo hóa đơn Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập Thành công vào hệ thống Điều kiện kết quả
Hiển thị thông tin theo mã sản phẩm, xác nhận tạo hóa đơn thành công Kịch bản chính
- Tìm kiếm mã sản phẩm
3 Hệ thống lọc theo mã nhân viên đã nhập để hiện những sản phẩm theo mã
4 Hiện những sản phẩm theo mã đã nhập
- Xác nhận tạo hóa đơn
5 Nhấn xác nhận tạo hóa đơn
6 Hệ thống thông báo xác nhận thành công Kịch bản thay thế
3a Mã sản phẩm không tồn tại nên hệ thống hiện thị danh sách rỗng Use case trở về bước 2
Bảng 3.6 Use case Quản lý Hóa đơn
Tên Use case Quản lý Hóa đơn
Mô tả Tìm kiếm hóa đơn, thanh toán hóa đơn ký gửi, in hóa đơn, xóa hóa đơn Người thực hiện (Actor) Nhân viên
Sự kiện kích hoạt (Trigger) Điền vào thanh tìm kiếm, Ấn vô hóa đơn để thực hiện thanh toán hóa đơn ký gửi và in hóa đơn, ấn vô biểu tượng thùng rác để xóa hóa đơn Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập vào hệ thống và đã có hóa đơn Điều kiện kết quả
Tìm kiếm thành công hóa đơn, thanh toán hóa đơn ký gửi, in hóa đơn và xóa hóa đơn thành công Kịch bản chính
1 Hệ thống hiển thị trang quản lý hóa đơn
2 Nhập khách hàng hoặc mã hóa đơn cần tìm
3 Hệ thống xác thực để hiển thị thông tin hợp lệ
- Thanh toán hóa đơn ký gửi
5 Kiểm tra thông tin rùi xác nhận thanh toán hóa đơn
6 Thông báo xác nhận thành công
7 Ấn in hóa đơn để đưa cho khách hàng
8 Xác nhận xóa hóa đơn
9 Hệ thống thông báo xóa thành công Kịch bản thay thế
2a Nhập thông tin không hợp lệ hệ thống không gửi về thông tin Trở lại use case 1
Bảng 3.7 Use case Quản lý Khách hàng
Tên Use case Quản lý Khách hàng
Mô tả Tìm kiếm, thêm và xóa khách hàng
Người thực hiện (Actor) Nhân viên
Sự kiện kích hoạt (Trigger) Nhập vào khung tìm kiếm, nhấn vô nút thêm hoặc nhấn vô thùng rác để xóa khách hàng Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập vào hệ thống thành công Điều kiện kết quả
Tìm kiếm hiện ra kết quả mong muốn, thêm và xóa khách hàng thành công Kịch bản chính
1 Hiển thị trang quản lý khách hàng
2 Nhập số điện thoại hoặc tên khách hàng
3 Hệ thống sẽ xác thực dữ liệu nhập vào để hiện thông tin khách hàng chính xác
4 Hiện thị thông tin khách hàng theo như mong muốn
5 Nhấn vào nút thêm khách hàng
6 Nhập thông tin khách hàng
7 Hệ thống xác thực thông tin rùi lưu về Database
8 Thông báo thêm khách hàng thành công
9 Chọn một khách hàng rùi click vô thùng rác để xóa thông tin khách hàng
10 Xác nhận xóa khách hàng
11 Hệ thống thông báo xóa khách hàng thành công Kịch bản thay thế
2a Nhập thông tin không hợp lệ hệ thống không gửi về thông tin Trở lại use case 1 7a Nhập thông tin không hợp lệ Hệ thống báo lỗi. Trở về use case 6 nhập lại thông tin khách hàng
Bảng 3.8 Use case Quản lý Sản phẩm
Tên Use case Quản lý Sản phẩm
Mô tả Tìm kiếm, in Barcode và xóa sản phẩm
Người thực hiện (Actor) Nhân viên
Sự kiện kích hoạt (Trigger) Nhập vào khung tìm kiếm, ấn vô sản phẩm để in
Barcode, ấn vô biểu tượng thùng rác để xóa sản phẩm Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập thành công và hiện thị danh sách các sản phẩm Điều kiện kết quả
Tìm kiếm thông tin sản phẩm theo mong muốn, in mã
Barcode hoặc xóa sản phẩm thành công Kịch bản chính
1 Hiển thị thông tin trang sản phẩm
2 Nhập thông tin sản phẩm cần tìm
3 Hệ thống xác thực dữ liệu rùi hiện thị kết quả như mong muốn
5 Thực hiện thao tác in mã Barcode
6 Hệ thống xuất mã Barcode
7 Di chuột vô sản phẩm để hiển thị biểu tượng thùng rác
8 Thực hiện thao tác xóa sản phẩm
9 Hệ thống phản hồi rồi thông báo xóa thành công Kịch bản thay thế
2a Nhập thông tin không hợp lệ hệ thống không gửi về thông tin Trở lại use case 1
Bảng 3.9 Use case Biểu đồ
Tên Use case Biểu đồ
Mô tả Lọc thống kê theo ngày/ tháng/ năm
Người thực hiện (Actor) Admin
Sự kiện kích hoạt (Trigger) Thao tác với các thanh lọc Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập thành công Điều kiện kết quả
Hiển thị thống kê theo thanh lọc
1 Hiện thị trang biểu đồ
2 Thao tác với các thanh lọc
3 Hệ thống sẽ lấy từ Database để hiện thị dữ liệu tương thích theo các thanh lọc Kịch bản thay thế
Bảng 3.10 Use case Quản lý Nhân viên
Tên Use case Quản lý Nhân viên
Mô tả Tìm kiếm, thêm và xóa nhân viên
Người thực hiện (Actor) Admin
Sự kiện kích hoạt (Trigger) Điền vô khung tìm kiếm, thao tác với các nút thêm xóa Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập thành công và hiển thị danh sách nhân viên Điều kiện kết quả
Hiển thị thông tin nhân viên sau khi tìm kiếm, thêm và xóa nhân viên thành công Kịch bản chính
1 Hiển thị trang quản lý nhân viên
2 Nhập thông tin nhân viên
3 Hệ thống sẽ xác thực dữ liệu nhập vào để hiện thông tin nhân viên chính xác
4 Hiện thị thông tin nhân viên theo như mong muốn
5 Nhấn vào nút thêm nhân viên
6 Nhập thông tin nhân viên
7 Hệ thống xác thực thông tin rùi lưu về Database
8 Thông báo thêm nhân viên thành công
9 Chọn một nhân viên rùi click vô biểu tượng thùng rác để xóa thông tin nhân viên
10 Xác nhận xóa nhân viên
11 Hệ thống thông báo xóa khách hàng thành công Kịch bản thay thế
2a Nhập thông tin không hợp lệ hệ thống không gửi về thông tin Trở lại use case 1 7a Nhập thông tin không hợp lệ Hệ thống báo lỗi. Trở về use case 6 nhập lại thông tin khách hàng0
Bảng 3.11 Use case Quản lý Chấm công
Tên Use case Quản lý Chấm công
Mô tả Chọn thời gian, chấm công, lưu bảng
Người thực hiện (Actor) Admin
Sự kiện kích hoạt (Trigger) Thao tác với thanh lọc, điền thông tin chấm công, ấn nút lưu bảng Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập thành công và hiện thị danh sách nhân viên Điều kiện kết quả
Lọc theo thời gian, điền chấm công, và lưu bảng thành công Kịch bản chính
1 Hiển thị trang chấm công
2 Lọc thông tin theo thời gian
3 Hệ thống kiếm tra Database để trả về thông tin được lọc
5 Hệ thống xác thực thông tin rồi lưu về Database
7 Hệ thống báo về lưu bảng thành công Kịch bản thay thế
Bảng 3.12 Use case Báo cáo
Tên Use case Báo cáo
Mô tả Xuất file báo cáo
Người thực hiện (Actor) Admin
Sự kiện kích hoạt (Trigger) Ấn vào nút xuất file Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập thành công hiển thị Doanh thu sản phẩm,
Bảng lương và Sản phẩm quá hạn Điều kiện kết quả
1 Hiện thị trang quản lý báo cáo
2 Ấn xuất file báo cáo
Bảng 3.13 Use case Quản lý Tài khoản
Tên Use case Quản lý Tài khoản
Mô tả Tìm kiếm, xóa tài khoản
Người thực hiện (Actor) Admin
Sự kiện kích hoạt (Trigger) Điền vào thanh tìm kiếm, di chuột vô tài khoản để xóa Điều kiện tiên quyết
(Pre-Conditions) Đăng nhập thành công và hiển thị thông tin tài khoản Điều kiện kết quả
Hiện thị thông tin sau khi tìm kiếm, xóa tài khoản thành công Kịch bản chính
1 Hiển thị trang tài khoản
2 Nhập tên tài khoản hoặc nhân viên cần tìm
3 Hệ thống xác thực thông tin để hiển thị thông tin
4 Di chuột vô tài khoản để hiển thị biểu tượng xóa tài khoản
5 Xóa tài khoản thành công Kịch bản thay thế
2a Nhập thông tin không hợp lệ hệ thống không gửi về thông tin Trở lại use case 1
PHÂN TÍCH HỆ THỐNG
MVC (Model-View-Controller): là một kiến trúc phát triển phần mềm phổ biến trong lĩnh vực phát triển ứng dụng web Nó tách biệt thành ba thành phần chính: Model, View và Controller, với mục tiêu chia nhỏ và tổ chức rõ ràng các phần khác nhau của hệ thống.
Hình 3.2 Mô hình MVC https://s.net.vn/HYkF [Truy cập ngày 25 tháng 6, 2023]
Là thành phần đại diện cho dữ liệu và luật logic xử lý dữ liệu.
Quản lý truy xuất, cập nhật và xử lý dữ liệu.
Thông báo cho Controller về các thay đổi trong dữ liệu.
Hiển thị dữ liệu và tương tác với người dùng.
Nhận thông tin từ Controller và hiển thị nội dung tương ứng.
Không chịu trách nhiệm xử lý dữ liệu.
Xử lý yêu cầu từ người dùng và điều chỉnh dữ liệu và tương tác giữa Model và View.
Nhận thông tin từ View và cập nhật Model tương ứng.
Điều hướng luồng dữ liệu và logic xử lý. Ưu điểm của kiến trúc MVC:
Tách biệt rõ ràng giữa dữ liệu, giao diện và logic xử lý.
Dễ dàng quản lý, bảo trì và mở rộng ứng dụng.
Cho phép phân chia công việc giữa các thành viên trong nhóm phát triển.
Tích hợp tốt với các công nghệ và framework khác.
Nhược điểm của kiến trúc MVC:
Đòi hỏi sự hiểu biết về kiến trúc và cấu trúc dự án.
Mức độ phức tạp cao hơn so với các kiến trúc đơn giản hơn.
Cần sự chính xác trong việc phân chia và quản lý các thành phần.
Tổng quan, kiến trúc MVC giúp tách biệt rõ ràng các thành phần của hệ thống, làm cho ứng dụng dễ bảo trì, mở rộng và phát triển Nó được sử dụng rộng rãi trong phát triển ứng dụng web để tăng tính linh hoạt và hiệu quả của quá trình phát triển.
THIẾT KẾ DỮ LIỆU
Hình 3.3 Sơ đồ Cơ sở dữ liệu
3.3.2 Mô tả chi tiết các kiểu dữ liệu
Bảng 3.14 Bảng thuộc tính Khách hàng
STT Tên thuộc tính Kiểu Ghi chú
1 Customer_ID int Khóa chính
2 Name varchar Tên khách hàng
3 Phone varchar SĐT của khách hàng
4 email varchar Email của khách hàng
Bảng 3.15 Bảng thuộc tính Nhân viên
STT Tên thuộc tính Kiểu Ghi chú
1 Employee_ID int Khóa chính
2 Name varchar Tên nhân viên
3 Phone varchar SĐT của nhân viên
4 email varchar Email của nhân viên
Bảng 3.16 Bảng thuộc tính Sản phẩm
STT Tên thuộc tính Kiểu Ghi chú
1 Item_ID int Khóa chính
2 Item_name varchar Tên sản phẩm
3 Category varchar Loại sản phẩm
4 Description varchar Mô tả sản phẩm
5 Price int Giá sản phẩm
6 Barcode varchar Mã vạch của sản phẩm
7 Status varchar Tình trạng của sản phẩm
Bảng 3.17 Bảng thuộc tính Ký gửi
STT Tên thuộc tính Kiểu Ghi chú
1 Consignment_ID int Khóa chính, mã đơn hàng ký gửi
2 Customer_ID int Mã khách hàng
3 Date date Ngày nhận đơn hàng ký gửi
4 Total_amount int Tổng giá trị của đơn hàng ký gửi
5 Status varchar Trạng thái của đơn hàng ký gửi
6 Employee_ID int Mã nhân viên
Bảng 3.18 Bảng thuộc tính Hóa đơn Ký gửi chi tiết
STT Tên thuộc tính Kiểu Ghi chú
D int Khóa chính, ID chi tiết hóa đơn
2 Consignment_ID int Id hóa đơn ký gửi
3 Item_ID int Id sản phẩm
Bảng 3.19 Bảng thuộc tính Sản phẩm đã bán
STT Tên thuộc tính Kiểu Ghi chú
1 Sold_item_ID int Khóa chính, mã sản phẩm đã bán
D int Mã chi tiết đơn hàng ký gửi
3 Sold_date date Ngày bán sản phẩm
4 Price int Giá bán của sản phẩm
Bảng 3.20 Bảng thuộc tính Lương
STT Tên thuộc tính Kiểu Ghi chú
1 Salary_ID int Khóa chính, mã lương
2 Employee_ID int Mã nhân viên
3 Hourly_rate int Tỷ lệ giờ làm
4 Hours_worked int Số giờ làm việc
5 Total_salary int Tổng lương của nhân viên
Bảng 3.21 Bảng thuộc tính Sản phẩm trả lại
STT Tên thuộc tính Kiểu Ghi chú
1 Return_ID int Khóa chính, mã sản phẩm được trả lại
D int Mã chi tiết đơn hàng ký gửi
3 Return_date date Ngày sản phẩm được trả lại
Bảng 3.22 Bảng thuộc tính doanh thu
STT Tên thuộc tính Kiểu Ghi chú
1 Revenue_ID int Khóa chính, mã doanh thu
2 Consignment_detail_ID int Mã chi tiết đơn hàng ký gửi
3 Revenue_date date Ngày doanh thu được tính
4 Amout int Số tiền doanh thu
XÂY DỰNG ỨNG DỤNG
THIẾT KẾ GIAO DIỆN
4.1.1 Danh sách các màn hình
Bảng 4.1 Danh sách các màn hình
Hình 4.1 Màn hình Đăng nhập
4.1.2.1.2 Mô tả cách sử dụng và xử lý
Bảng 4.2 Mô tả cách sử dụng màn hình Đăng nhập
STT Biến cố Xử lý
1 Tài khoản/ Mật khẩu Nhập thông tin tài khoản, mật khẩu
2 Đăng nhập Đăng nhập vào hệ thống
Hình 4.2 Màn hình Trang chủ
4.1.2.2.2 Mô tả cách sử dụng và xử lý
Bảng 4.3 Mô tả cách sử dụng màn hình Trang chủ
STT Biến cố Xử lý
1 06-2023 Lọc thông kê theo tháng
Hình 4.3 Màn hình Ký gửi
4.1.2.3.2 Mô tả cách sử dụng và xử lý
Bảng 4.4 Mô tả cách sử dụng màn hình Ký gửi
STT Biến cố Xử lý
Lọc tìm kiếm theo điền thông tin khách hàng hoặc chọn từ danh sách có sẵn
2 Thêm sản phẩm Mở modal thêm sản phẩm
3 Xác nhận tạo hóa đơn Xác nhận tạo hóa đơn cho khách hàng
4 Hủy Xác nhận hủy Ký gửi
4.1.2.4 Màn hình Thêm sản phẩm
Hình 4.4 Thông tin sản phẩm
4.1.2.4.2 Mô tả cách sử dụng và xử lý
Bảng 4.5 Mô tả cách sử dụng màn hình Thông tin sản phẩm
STT Biến cố Xử lý
1 Nhập tên sản phẩm/ nhập giá sản phẩm Điền thông tin sản phẩm
2 Loại sản phẩm Chọn loại sản phẩm từ danh sách loại sản phẩm
3 Thêm hình ảnh Lựa chọn hình ảnh cho sản phẩm
4 Xác nhận Xác nhận thêm sản phẩm
5 Hủy bỏ Hủy bỏ thêm sản phẩm
Hình 4.5 Màn hình Thanh toán
4.1.2.5.2 Mô tả cách sử dụng và xử lý
Bảng 4.6 Mô tả cách sử dụng màn hình Thanh toán
STT Biến cố Xử lý
1 Nhập mã sản phẩm Điền mã sản phẩm để tìm kiếm sản phẩm
2 Khách hàng Tìm kiếm khách hàng hoặc chọn từ list khách hàng có sẵn
3 Xác nhận tạo hóa đơn Xác nhận tạo hóa đơn
4.1.2.6 Màn hình Quản lý Hóa đơn
Hình 4.6 Màn hình Quản lý Hóa đơn
4.1.2.6.2 Mô tả cách sử dụng và xử lý
Bảng 4.7 Mô tả cách sử dụng màn hình Quản lý Hóa đơn
STT Biến cố Xử lý
1 Nhập khách hàng hoặc mã hóa đơn cần tìm Tìm kiếm theo khách hàng hoặc mã hóa đơn
2 Hóa đơn của khách hàng Xem chi tiết hóa đơn ký gửi của khách hàng
4.1.2.7 Chi tiết hóa đơn Ký gửi
Hình 4.7 Chi tiết Hóa đơn Ký gửi
4.1.2.7.2 Mô tả cách sử dụng và xử lý
Bảng 4.8 Mô tả cách sử dụng màn hình Chi tiết Hóa đơn Ký gửi
STT Biến cố Xử lý
1 Thanh toán cho khách Xác nhận thanh toán hóa đơn cho khách
2 In hóa đơn In thông tin hóa đơn ra
3 Hủy bỏ Thoát ra khỏi xem chi tiết hóa đơn ký gửi
4.2.8 Màn hình Quản lý Khách hàng
Hình 4.8 Màn hình Quản lý Khách hàng
4.1.2.8.2 Mô tả cách sử dụng và xử lý
Bảng 4.9 Mô tả cách sử dụng màn hình Quản lý Khách hàng
STT Biến cố Xử lý
1 Nhập số điện thoại hoặc tên khách hàng cần tìm Tìm kiếm khách hàng
2 Thêm khách hàng Mở modal thêm khách hàng
4.1.2.9 Màn hình Thêm khách hàng
Hình 4.9 Thông tin Khách hàng
4.1.2.9.2 Mô tả cách sử dụng và xử lý
Bảng 4.10 Mô tả cách sử dụng màn hình Thông tin Khách hàng
STT Biến cố Xử lý
1 Nhập tên/SĐT/Email khách hàng Điền thông tin khách hàng
2 Xác nhận Xác nhận thông tin khách hàng
3 Hủy bỏ Hủy bỏ thêm khách hàng
4.1.2.10 Màn hình Quản lý Sản phẩm
Hình 4.10 Màn hình Quản lý Sản phẩm
4.1.2.10.2 Mô tả cách sử dụng và xử lý
Bảng 4.11 Mô tả cách sử dụng màn hình Quảng lý Sản phẩm
STT Biến cố Xử lý
1 Nhập thông tin Sản phẩm Tìm kiếm sản phẩm
2 Sản phẩm Xem thông tin chi tiết hoặc chỉnh sửa sản phẩm
4.1.2.11 Màn hình Chỉnh sửa sản phẩm
Hình 4.11 Chỉnh sửa Sản phẩm
4.1.2.11.2 Mô tả cách sử dụng và xử lý
Bảng 4.12 Mô tả cách sử dụng màn hình Chỉnh sửa Sản phẩm
STT Biến cố Xử lý
1 Sửa tên sản phẩm/ nhập giá sản phẩm Điền thông tin sản phẩm
2 Sửa loại sản phẩm Chọn loại sản phẩm từ danh sách loại sản phẩm
3 Sửa hình ảnh Lựa chọn hình ảnh cho sản phẩm
4 Xác nhận Xác nhận thêm sản phẩm
5 Hủy bỏ Hủy bỏ thêm sản phẩm
Hình 4.12 Màn hình Biểu đồ
4.1.2.12.2 Mô tả cách sử dụng và xử lý
Bảng 4.13 Mô tả cách sử dụng màn hình Biểu đồ
STT Biến cố Xử lý
1 Thanh lọc theo ngày/tháng/năm Hiển thị thống kê theo thanh lọc
4.1.2.13 Màn hình Quản lý Nhân viên
Hình 4.13 Màn hình Quản lý Nhân viên
4.1.2.13.2 Mô tả cách sử dụng và xử lý
Bảng 4.14 Mô tả cách sử dụng màn hình Quản lý Nhân viên
STT Biến cố Xử lý
1 Nhập thông tin nhân viên cần tìm Tìm kiếm nhân viên
2 Thêm nhân viên Mở màn hình thêm nhân viên
3 Nhân viên Xem thông tin nhân viên
4.1.2.14 Màn hình Thêm nhân viên
4.1.2.14.2 Mô tả cách sử dụng và xử lý
Bảng 4.15 Mô tả cách sử dụng màn hình Thông tin Nhân viên
STT Biến cố Xử lý
1 Thông tin nhân viên Điền thông tin cơ bản của nhân viên
2 Xác nhận Xác nhận thông tin và thêm vào danh sách nhân viên
3 Hủy bỏ Hủy bỏ thao tác thêm nhân viên
4.1.2.15 Màn hình Thông tin Nhân viên
Hình 4.15 Thông tin Nhân viên
4.1.2.15.2 Mô tả cách sử dụng và xử lý
Bảng 4.16 Mô tả cách sử dụng màn hình Thông tin Nhân viên
STT Biến cố Xử lý
1 Thông tin nhân viên Xem hoặc chỉnh sửa thông tin nhân viên
2 Xác nhận Xác nhận thông tin
3 Xóa nhân viên Xác nhận xóa nhân viên
4 Hủy bỏ Hủy bỏ thao tác xem hoặc sửa thông tin nhân viên
4.1.2.16 Màn hình Lịch làm việc
Hình 4.16 Màn hình Lịch làm việc
4.1.2.16.2 Mô tả cách sử dụng và xử lý
Bảng 4.17 Mô tả cách sử dụng màn hình Lịch làm việc
STT Biến cố Xử lý
1 Chọn thời gian Thanh lọc theo tháng
2 Giờ làm việc Điền giờ làm việc của nhân viên theo ngày
3 Lưu bảng Xác nhận lưu bảng
Hình 4.17 Màn hình Báo cáo
4.1.2.17.2 Mô tả cách sử dụng và xử lý
Bảng 4.18 Mô tả cách sử dụng màn hình Báo cáo
STT Biến cố Xử lý
1 Chọn tháng Lọc báo cáo theo tháng
2 Xuất báo cáo Xuất file báo cáo theo dạng Excel
4.1.2.18 Màn hình Quản lý Tài khoản
Hình 4.18 Màn hình Quản lý Tài khoản
4.1.2.18.2 Mô tả cách sử dụng và xử lý
Bảng 4.19 Mô tả cách sử dụng màn hình Quản lý Tài khoản
STT Biến cố Xử lý
1 Nhập tên tài khoản hoặc nhân viên cần tìm Tìm kiếm thông tin tài khoản
2 Tài khoản Xem thông tin tài khoản
4.1.2.19 Màn hình Thông tin tài khoản
Hình 4.19 Màn hình Thông tin Tài khoản
4.1.2.19.2 Mô tả cách sử dụng và xử lý
Bảng 4.20 Mô tả cách sử dụng màn hình thông tin Tài khoản
STT Biến cố Xử lý
1 Thông tin tài khoản Xem hoặc chỉnh sửa thông tin tài khoản
2 Xác nhận Xác nhận thông tin tài khoản
3 Hủy bỏ Hủy bỏ thao tác
CÀI ĐẶT VÀ THỬ NGHIỆM
Sau khi thiết kế đầy đủ mô hình kiến trúc, các bảng cơ sở dữ liệu và giao diện ứng với từng chức năng, nhóm tiến hành cài đặt phần mềm theo quy mô hệ thống gồm 1 phần mềm để phát triển hệ thống (Visual Studio Code) và 1 phần mềm quản lý Source Code (Github).
Môi trường cài đặt
Môi trường cài đặt và thử nghiệm
- Github và Visual Studio Code.
- Sau khi hoàn thành việc phát triển và thử nghiệm website để đảm bảo rằng nó hoạt động đúng và không có lỗi Chúng em có thực hiện kiểm thử chức năng,kiểm thử tích hợp và kiểm thử hiệu năng để đảm bảo rằng website hoạt động một cách ổn định, tính ổn định, tốc độ tải trang, độ phản hồi, giao diện người dùng, tính bảo mật và đáp ứng được yêu cầu.
NHẬN XÉT VÀ KẾT LUẬN
Kết quả đạt được
Không chỉ hiểu và nắm vững các kiến thức về phát triển web, tôi còn có khả năng áp dụng chúng vào các dự án thực tế, từ việc xác định yêu cầu, thiết kế giao diện, phát triển, kiểm thử và triển khai.
Tôi có kinh nghiệm rộng rãi trong việc sử dụng Figma để tạo ra các giao diện người dùng đẹp mắt và tối ưu hóa trải nghiệm người dùng Tôi có khả năng tương tác tốt với nhóm thiết kế và đảm bảo rằng các thiết kế được chuyển đổi thành các sản phẩm chất lượng cao.
Với Visual Studio Code, tôi không chỉ biết sử dụng các tính năng cơ bản mà còn nắm vững các phím tắt và tiện ích mở rộng để tăng hiệu suất lập trình và tạo ra mã nguồn sạch và dễ bảo trì.
Kiến thức chắc chắn về HTML, CSS, JavaScript và framework như ReactJS cho phép tôi tạo ra giao diện website tương tác, linh hoạt và tối ưu hóa trải nghiệm người dùng Tôi đã thực hiện thành công nhiều dự án đa dạng sử dụng những công nghệ này, từ các trang web tĩnh đến các ứng dụng phức tạp.
Đối với phát triển phía Back-end, tôi nắm vững NodeJS và có kinh nghiệm xây dựng các ứng dụng mạnh mẽ và đáng tin cậy Tôi không chỉ biết sử dụng các framework phổ biến như ExpressJS, mà còn có kiến thức về cơ sở dữ liệu và các công nghệ khác như MongoDB, MySQL, RESTful API, vàJWT để xây dựng hệ thống ổn định và bảo mật.
Hạn chế
Tuy hệ thống đã được thiết kế để có khả năng mở rộng, tuy nhiên, nếu số lượng cửa hàng, chợ đồ cũ hoặc cá nhân bán đồ secondhand tăng lên đáng kể, hệ thống vẫn có thể gặp hạn chế trong việc xử lý lượng dữ liệu lớn và đáp ứng đồng thời cho nhiều người dùng Việc tăng cường khả năng xử lý dữ liệu và định hướng lại cấu trúc hệ thống để tối ưu hóa hiệu suất sẽ là một thách thức đối với quy mô mở rộng lớn Điều này có thể yêu cầu việc sử dụng công nghệ khác như các cơ sở dữ liệu phân tán, việc tối ưu hóa thuật toán xử lý dữ liệu hoặc việc triển khai hệ thống đám mây để đáp ứng được tải lớn.
Bảo mật và bảo vệ thông tin cá nhân là một yêu cầu quan trọng trong quá trình xử lí thông tin khách hàng Tuy nhiên, việc phát triển các biện pháp bảo mật và quản lý dữ liệu hiệu quả là một thách thức liên tục Với sự phát triển của các kỹ thuật tấn công mới và quy định bảo mật thay đổi liên tục, việc duy trì một hệ thống bảo mật đáng tin cậy đòi hỏi sự tập trung và nâng cao liên tục Hơn nữa, việc đảm bảo tuân thủ quy định bảo mật như GDPR hoặc CCPA cũng là một thách thức, đòi hỏi sự hiểu biết sâu rộng về các quy tắc và nguyên tắc liên quan Để vượt qua những hạn chế này, tôi luôn nắm bắt các tiến bộ mới nhất trong lĩnh vực bảo mật và đảm bảo áp dụng các biện pháp bảo mật tiên tiến và quy trình quản lý dữ liệu tốt nhất để đảm bảo an toàn và bảo vệ thông tin cá nhân của khách hàng.
Hướng phát triển
Để nâng cao trải nghiệm người dùng và tạo sự tương tác, có thể bổ sung các tính năng mới như đánh giá và nhận xét sản phẩm Người dùng có thể chia sẻ ý kiến và trải nghiệm của mình về sản phẩm, giúp người khác có thông tin chi tiết và đánh giá chất lượng Bên cạnh đó, việc chia sẻ thông tin sản phẩm lên mạng xã hội cũng tạo cơ hội để tăng khả năng tiếp cận và quảng bá sản phẩm đến đông đảo người dùng.
Một phát triển quan trọng là xây dựng phiên bản ứng dụng di động của
"PlanB" Việc này sẽ tăng khả năng tiếp cận và thuận tiện cho người dùng trên các thiết bị di động, mở ra cơ hội mới để tương tác với ứng dụng và mua bán sản phẩm từ bất kỳ đâu và bất kỳ lúc nào Tận dụng sức mạnh và tính di động của thiết bị di động sẽ cung cấp trải nghiệm người dùng tốt hơn và mở rộng phạm vi đối tượng người dùng.
Trong việc tăng cường bảo mật, cần đẩy mạnh công tác bảo vệ thông tin cá nhân của người dùng và ngăn chặn các hình thức tấn công Điều này có thể bao gồm việc triển khai các biện pháp bảo mật mạnh hơn như mã hóa dữ liệu, xác thực hai yếu tố, và giám sát liên tục để phát hiện các hành vi đáng ngờ Đồng thời, cần xây dựng và duy trì chính sách bảo mật rõ ràng, đảm bảo rằng thông tin cá nhân của người dùng được bảo vệ và tuân thủ các quy định bảo mật hiện hành Đào tạo nhân viên và nhận thức về an ninh thông tin cũng là yếu tố quan trọng để đảm bảo tính bảo mật và tin cậy của hệ thống.