1. Trang chủ
  2. » Luận Văn - Báo Cáo

đồ án 1 xây dựng ứng dụng nhắc lịch công tác

70 1 0
Tài liệu đã được kiểm tra trùng lặp

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Định dạng
Số trang 70
Dung lượng 2,88 MB

Cấu trúc

  • CHƯƠNG 1: MỞ ĐẦU (0)
    • 1.1. Lí do chọn đề tài (13)
    • 1.2. Mục đích (13)
    • 1.3. Đối tượng nghiên cứu (14)
    • 1.4. Phạm vi nghiên cứu (14)
    • 1.5. Nền tảng, động lực trong việc xây dựng ứng dụng (14)
    • 1.6. Tổng quát về ứng dụng (14)
    • 1.7. Các sản phẩm liên quan, tham khảo (15)
  • CHƯƠNG 2: CƠ SỞ LÝ THUYẾT (0)
    • 2.1. Nhu cầu người dùng (16)
    • 2.2. Các vấn đề có thể gặp phải đối với loại ứng dụng này (17)
    • 2.3. Các kiến thức về việc quản lý thời gian có liên quan (17)
      • 2.3.1. Các khía cạnh khác nhau của quản lý thời gian (17)
      • 2.3.2. Các lý thuyết về quản lý thời gian (18)
    • 2.4. Phương pháp nghiên cứu, xây dựng ứng dụng (18)
    • 2.5. Các công nghệ sử dụng (19)
      • 2.5.1.1. Định nghĩa (19)
      • 2.5.1.2. Tổng quan về công nghệ (19)
      • 2.5.1.3. Ứng dụng của công nghệ vào đồ án (20)
      • 2.5.1.4. Ưu điểm của công nghệ (20)
      • 2.5.1.5. Nhược điểm của công nghệ (20)
      • 2.5.2. Supabase (21)
        • 2.5.2.1. Tổng quan về công nghệ (21)
        • 2.5.2.2. Ứng dụng của công nghệ vào đồ án (21)
        • 2.5.2.3. Ưu điểm của công nghệ (21)
        • 2.5.2.4. Nhược điểm của công nghệ (22)
  • CHƯƠNG 3: PHÂN TÍCH THIẾT KẾ (0)
    • 3.1. Các tính năng của ứng dụng (23)
    • 3.2. Các thuật ngữ liên quan tới ứng dụng (23)
    • 3.3. Các chức năng của ứng dụng (24)
    • 3.4. Các ma trận quy định (26)
    • 3.5. Các sơ đồ thiết kế (27)
      • 3.5.1. Sơ đồ Use Case (Use Case Diagram) (27)
      • 3.5.2. Sơ đồ trạng thái (State Diagram) (34)
      • 3.5.3. Sơ đồ hoạt động (Activity Diagram) (34)
      • 3.5.4. Thiết kế cơ sở dữ liệu (41)
  • CHƯƠNG 4: XÂY DỰNG, TRIỂN KHAI ỨNG DỤNG (0)
    • 4.1. Kiến trúc phần mềm (43)
    • 4.2. Môi trường (43)
      • 4.2.1. Môi trường cài đặt (43)
      • 4.2.2. Môi trường phát triển ứng dụng (44)
      • 4.2.3. Môi trường triển khai ứng dụng (44)
      • 4.2.4. Cách cài đặt và chạy ứng dụng (44)
        • 4.2.4.1. Đối với nhà phát triển ứng dụng (44)
        • 4.2.4.2. Đối với người dùng cuối (47)
    • 4.3. Danh sách màn hình và các thành phần (53)
  • CHƯƠNG 5: KẾT LUẬN (68)
    • 5.1. Đánh giá (68)
      • 5.1.1. Quá trình làm việc (68)
      • 5.1.2. Thuận lợi (68)
      • 5.1.3. Khó khăn (68)
      • 5.1.4. Kết quả đạt được (68)
        • 5.1.4.1. Về lý thuyết (68)
        • 5.1.4.2. Về công nghệ (69)
        • 5.1.4.3. Về ứng dụng (69)
        • 5.1.4.4. Về con người (69)
    • 5.2. Hướng phát triển (69)
  • TÀI LIỆU THAM KHẢO (70)

Nội dung

CƠ SỞ LÝ THUYẾT

Nhu cầu người dùng

 Quản lý thời gian hiệu quá: Người dùng muốn có một công cụ giúp họ quản lý thời gian một cách hiệu quả, xác định nhiệm vụ ưu tiên, và giữ cho lịch trình làm việc của họ có tổ chức.

 Nhắc nhớ và thông báo chính xác: Người dùng mong đợi tính năng nhắc nhở và thông báo chính xác về các sự kiện, cuộc họp, hoặc công việc quan trọng để họ không bỏ lỡ.

 Đồng bộ hóa trên nhiều thiết bị: Đối với người dùng hiện đại, khả năng đồng bộ hóa dữ liệu và lịch trình trên nhiều thiết bị là quan trọng để họ có thể làm việc mọi nơi mà không mất thông tin.

 Tích hợp công cụ và dịch vụ khác: Người dùng muốn có khả năng tích hợp lịch trình của họ với các công cụ khác như email, danh bạ, công cụ quản lý công việc, và các ứng dụng khác để tối ưu hóa quá trình làm việc.

 Giao diện người dùng thân thiện và dễ sử dụng: Giao diện người dùng thân thiện và dễ sử dụng là yếu tố quan trọng Người dùng muốn có trải nghiệm linh hoạt và thoải mái khi sử dụng ứng dụng.

 Chia sẻ lịch trình và tương tác xã hội: Người dùng có thể muốn chia sẻ lịch trình của họ với đồng nghiệp, bạn bè, hoặc gia đình Tính năng này giúp tạo ra tương tác xã hội và giao tiếp hiệu quả.

 Tùy chỉnh cá nhân hóa: Khả năng tùy chỉnh lịch trình và cá nhân hóa thông tin là quan trọng để ứng dụng phản ánh chính xác lối sống và mục tiêu của từng người dùng.

 Độ an toàn và bảo mật: Người dùng đặt yêu cầu cao đối với độ an toàn và bảo mật của thông tin cá nhân và dữ liệu lịch trình của họ.

 Tính năng thông minh và dự đoán: Ứng dụng được mong đợi có khả năng thông minh, có thể dự đoán nhu cầu người dùng, và đưa ra gợi ý hay lời khuyên hữu ích.

 Sự linh hoạt và tích hợp với cuộc sống hằng ngày: Người dùng muốn có một ứng dụng linh hoạt và tích hợp mạnh mẽ với cuộc sống hàng ngày của họ, từ công việc đến hoạt động giải trí.

Các vấn đề có thể gặp phải đối với loại ứng dụng này

 Đồng bộ hóa dữ liệu: Đảm bảo đồng bộ hóa dữ liệu lịch trình một cách chính xác và nhanh chóng trên nhiều thiết bị và nền tảng khác nhau.

 Thời gian thực: Xử lý các sự kiện và nhắc nhở trong thời gian thực mà không gây tải nặng cho hệ thống.

 Phân quyền: Xác định và quản lý quyền truy cập của người dùng, đồng thời cung cấp một hệ thống phân quyền linh hoạt.

 Hiệu suất và tiêu tốn năng lượng: Đối mặt với thách thức của việc tối ưu hiệu suất và giảm tiêu tốn năng lượng để đảm bảo trải nghiệm người dùng tích cực và tốn ít năng lượng.

 Bảo mật và quyền riêng tư: Bảo vệ thông tin cá nhân của người dùng và đảm bảo tính an toàn cho dữ liệu lịch trình.

Các kiến thức về việc quản lý thời gian có liên quan

(Các nội dung trình bày trong phần này được chọn lọc để có liên quan đến đề tài đồ án và xây dựng ứng dụng)

2.3.1 Các khía cạnh khác nhau của quản lý thời gian

 Thiết lập mục tiêu: Thiết lập các mục tiêu rõ ràng và có thể đạt được cung cấp ý thức về phương hướng và mục đích, cho phép các cá nhân ưu tiên nhiệm vụ của họ cho phù hợp.

 Ưu tiên: Xác định các nhiệm vụ dựa trên tầm quan trọng và mức độ khẩn cấp của chúng giúp các cá nhân tập trung vào các hoạt động có mức độ ưu tiên cao,đảm bảo rằng các nhiệm vụ thiết yếu được hoàn thành trước tiên.

 Lập kế hoạch: Tạo một lịch trình có cấu trúc hoặc danh sách việc cần làm cho phép các cá nhân phân bổ các khoảng thời gian cụ thể cho các hoạt động khác nhau, đảm bảo cách tiếp cận có hệ thống để hoàn thành nhiệm vụ.

 Phân công: Giao nhiệm vụ cho người khác khi thích hợp giúp phân phối khối lượng công việc và cho phép các cá nhân tập trung vào các nhiệm vụ đòi hỏi chuyên môn và sự chú ý.

 Theo dõi thời gian: Theo dõi và đánh giá thời gian được sử dụng như thế nào cho phép các cá nhân xác định các lĩnh vực cải thiện và thực hiện các điều chỉnh cần thiết cho lịch trình của họ.

2.3.2 Các lý thuyết về quản lý thời gian

 Lý thuyết pickle jar: nhấn mạnh sự ưu tiên và phân bố thời gian hiệu quả Hãy tưởng tượng một cái lọ đại diện cho thời gian có sẵn và nhiều loại đá, sỏi và cát đại diện cho các nhiệm vụ và hoạt động khác nhau Lý thuyết cho thấy rằng để phù hợp với tất cả các vật phẩm vào bình, trước tiên một cá nhân nên đặt những tảng đá lớn (nhiệm vụ ưu tiên cao) tiếp theo là đá cuội (nhiệm vụ phụ), và sau đó là cát (các hoạt động ít quan trọng hơn).

 Phương pháp Alpen: Phương pháp này nhấn mạnh việc lập kế hoạch kỹ lưỡng và tổ chức các nhiệm vụ Nó liên quan đến việc liệt kê tất cả các nhiệm vụ, ước tính thời gian cần thiết cho mỗi nhiệm vụ, thêm thời gian đệm cho các trường hợp không lường trước được, đưa ra quyết định về mức độ ưu tiên của nhiệm vụ và xem xét các nhiệm vụ đã hoàn thành để phản ánh và cải thiện.

Phương pháp nghiên cứu, xây dựng ứng dụng

 Đọc tài liệu về nền tàng, công nghệ để triển khai ứng dụng.

 Nghiên cứu và phân tích yêu cầu cho ứng dụng.

 Lập danh sách các chức năng cho ứng dụng dựa trên nghiên cứu, khảo sát thực nghiệm (tham khảo các chức năng hữu ích trong các ứng dụng tương đương đã có sẵn trên thị trường).

 Lập biểu đồ cơ sở dữ liệu phụ thuộc vào danh sách các chức năng.

 Thiết kế giao diện người dùng.

 Thiết lập cơ sở dữ liệu, xây dựng prototype cho ứng dụng.

 Kiểm thử và gỡ lỗi trên prototype.

 Hoàn thiện prototype thành sản phẩm chính thức, phát triển và tối ưu hóa sản phẩm.

Các công nghệ sử dụng

2.5.1 .Net MAUI Blazor App (Blazor Hybrid)

.NET MAUI Blazor là sự kết hợp giữa NET Multi-platform App UI (.NET MAUI) và Blazor WebAssembly (Blazor WASM).

Hình 2.3: Logo NET MAUI Hình 2.4: Logo Blazor

2.5.1.2 Tổng quan về công nghệ

 NET MAUI: Là một nền tảng phát triển ứng dụng có giao diện đồ họa hoạt động đa nền tảng được NET Foundation (Microsoft) giới thiệu vào năm 2022. Đây là một phần của hệ sinh thái NET và được thiết kế để giúp nhà phát triển xây dựng ứng dụng desktop hoặc mobile chạy trên nhiều hệ điều hành khác nhau, bao gồm Android, iOS, Windows và macOS.

 Blazor WASM: Là một công nghệ web phát triển bởi NET Foundation(Microsoft), giới thiệu lần đầu vào năm 2018, cho phép viết ứng dụng, giao diện web (SPA – single page application) sử dụng mã nguồn C# và NET chạy trực tiếp trong trình duyệt của người dùng Điểm độc đáo của Blazor WASM là khả năng chạy mã C# trên máy phía client và tận dụng kho thư viện đồ sộ của NET thay vì phải dựa vào mã JavaScript như các framework và thư viện web truyền thống.

 Blazor Hybrid: Là sự kết hợp giữa NET MAUI và Blazor wasm để cho phép phát triển ứng dụng đa nền tảng sử dụng cả mã nguồn C# và NET cũng như mã nguồn Blazor (các component được viết theo cú pháp giống HTML), mang đến một trải nghiệm của công nghệ web hoạt động như ứng dụng native.

2.5.1.3 Ứng dụng của công nghệ vào đồ án

Công nghệ được sử dụng để phát triển ứng dụng có giao diện đồ họa phía client trong đồ án.

2.5.1.4 Ưu điểm của công nghệ

 Mang đến cho developer trải nghiệm phát triển ứng dụng quen thuộc như khi phát triển ứng dụng web (Với những developer đã quen với HTML, CSS).

 Sử dụng được cùng một lúc ưu điểm của công nghệ web (linh hoạt, dễ tiếp cận, v.v.) và công nghệ native (hiệu suất cao, truy cập đầy đủ tính năng của hệ thống/ hệ điều hành, mang lại trải nghiệm người dùng tốt nhất, v.v.).

 Tận dụng được cả hai kho thư viện đồ sộ của NET và công nghệ web.

 Tận dụng được khả năng sở hữu một bộ mã nguồn, nhưng phát triển được ứng dụng hoạt động được trên nhiều nền tảng khác nhau, tiết kiệm chi phí, công sức và thời gian.

2.5.1.5 Nhược điểm của công nghệ

Công nghệ còn mới, tài liệu tham khảo và kho thư viện, plugin đặc thù cho công nghệ chưa nhiều dẫn đến phát sinh một số khó khăn nhỏ khi phát triển ứng dụng.

2.5.2.1 Tổng quan về công nghệ

Là một BaaS mã nguồn mở thay thế Firebase, được giới thiệu lần đầu vào năm 2020 và phát triển bởi đội ngũ của YCombinator (BaaS hay Backend-as-a-Service là một mô hình dịch vụ trong đó các nhà phát triển thuê mướn các thành phần xử lí business logic của một số bên thứ ba trong việc phát triển ứng dụng web hoặc native để họ có thể tập trung vào việc xây dựng và duy trì giao diện người dùng trên cơ sở plug-and-play, giúp thoát khỏi gánh nặng của việc tự tay viết mã và triển khai backend phía server) Ở đây, Supabase hoạt động như một “No-code remote backend server using PostgreSQL”, hỗ trợ các tác vụ phía server như xác thực, quản trị cơ sở dữ liệu, cập nhật dữ liệu theo thời gian thực, quản lý kho lưu trữ (các file phương tiện, đính kèm, v.v.) và v.v.

2.5.2.2 Ứng dụng của công nghệ vào đồ án

Công nghệ được sử dụng để có được một server được cài đặt sẵn với khả năng tùy chỉnh, cung cấp dữ liệu cho phía client.

2.5.2.3 Ưu điểm của công nghệ

 Hỗ trợ, đáp ứng đầy đủ những dịch vụ cần thiết của một server thông thường mà không phải tự tay xây lại (tiết kiệm chi phí, công sức, thời gian và mang lại sự đảm bảo về mặt hiệu năng).

 Hỗ trợ việc tùy chỉnh server thông qua việc viết các webhook và edge function.

 Tận dụng được những ưu điểm của hệ quản trị cơ sở dữ liệu quan hệ PostgreSQL (có khả năng thực hiện được những truy vấn phức tạp, v.v.).

2.5.2.4 Nhược điểm của công nghệ

 Vì là công nghệ mới nên tài liệu tham khảo chưa nhiều, thường xuyên có các bản vá/cập nhật thay đổi tính năng của Supabase (chưa stable, mã nguồn của ứng dụng dễ hoạt động sai, có khả năng phải viết lại mã nguồn của ứng dụng khi cập nhật Supabase lên các phiên bản mới).

 Một số tính năng và hiệu năng tốt nhất phải trả phí.

PHÂN TÍCH THIẾT KẾ

Các tính năng của ứng dụng

Sau khi tìm hiểu các lý thuyết, khảo sát nhu cầu, tham khảo các ứng dụng khác trên thị trường cũng như cân nhắc về mặt thời gian, nguồn lực, nhóm đã đưa ra danh sách các tính năng (features) như sau:

 Thêm, xóa, sửa lịch, sự kiện công tác của cá nhân hoặc đội nhóm

 Nhắc nhở, thông báo lịch, sự kiện công tác cá nhân hoặc đội nhóm.

 Theo dõi, xem lịch, sự kiện công tác cá nhân hoặc đội nhóm theo giờ, ngày, tuần, tháng, năm.

 Phân công công việc cho thành viên trong đội nhóm.

 Quản lý quyền truy cập (thêm, xóa, sửa, xem) lịch, sự kiện công tác, phân công của thành viên trong đội nhóm.

 Ghi chú, trao đổi (chat) cho công việc trong đội nhóm.

 Tìm kiếm, tra cứu lịch, sự kiện công tác cá nhận hoặc đội nhóm theo nhãn.

 Đăng nhập, đăng xuất, đồng bộ hóa dữ liệu giữa các thiết bị.

 Một số cài đặt nhỏ liên quan đến cá nhân hóa cho người dùng.

Các thuật ngữ liên quan tới ứng dụng

(Có thể còn một số thuật ngữ khác nhưng chỉ liệt kê một số thuật ngữ cần thiết hoặc có thể gây khó hiểu)

 Task: Một công việc, sự kiện.

 Subtask: Nhiệm vụ phụ, 1 thuộc tính của task Danh sách các subtask có thể được dùng như là các bước để hoàn thành task.

 Tag (nhãn): Gắn nhãn vào một task để nhận dạng, phân loại, mức độ ưu tiên hay vì mục đích cung cấp thông tin Mỗi người dùng có một danh sách các tag cho riêng mình Mỗi board có một danh sách tag riêng.

 Tagging (nhãn đang gắn cho 1 task): Một task được gắn 1 hay nhiều tag, hoặc không có tag nào 1 task của một cá nhân sẽ được gắn tag từ danh sách tag của cá nhân đó, 1 task của một board sẽ được gắn tag từ danh sách tag của board đó.

 Reminder: Là một thuộc tính của task, là nơi người dùng có thể tùy chỉnh việc thông báo của 1 task.

 Workspace: Nơi truy cập vào các board để làm việc cùng hội nhóm.

 Board: Nơi làm việc của hội nhóm Bất kì cá nhân nào cũng có thể tạo board và mời người khác vào board của mình để bắt đầu làm việc Ở mục workspace của mỗi tài khoản chỉ hiện lên những board thuộc sở hữu hoặc được người khác mời vào Các task ở board thường được phân loại theo section.

 Section: Là 1 phần của board, mỗi board có 1 hoặc nhiều section Section mục đích chính dùng để phân loại task trong board theo ý muốn của người dùng. Section khác với tag ở chỗ, task sẽ được biểu diễn theo danh sách từng section. Mặt khác, task có thể được phân loại và biểu diễn theo thời gian, hoặc theo người được giao task đó.

 Default view: Những màn hình xem cơ bản sẵn có của mỗi người dùng, ở default view có thể xem công việc của cá nhân, hoặc công việc được giao ở workspace (tức là ở tất cả các board tham gia) Các task ở default view thường được phân loại theo ngày mà task kết thúc.

 Custom view: Màn hình xem không sẵn có, được tạo ra tùy theo mục đích và ý muốn của người dùng Custom view lấy nguồn từ các board mà cá nhân đó tham gia, có thể tùy chọn xem board nào, section nào Các task trong custom view thường được phân loại theo thời gian, theo board/section, hoặc theo những người tham gia các board đó tùy theo lựa chọn người dùng custom view là màn hình chỉ xem (read-only) không thể chỉnh sửa hay thêm task trong custom view.

Các chức năng của ứng dụng

Các chức năng (functions) của ứng được phát triển từ các tính năng ở mục 3.1:

 Xác minh người dùng: o Tạo tài khoản bằng email. o Đăng nhập bằng tài khoản đã tạo. o Đăng nhập bằng tài khoản Facebook. o Đăng nhập bằng khoản Google. o Quên mật khẩu.

 Thao tác với task: o Thêm task. o Xóa task. o Chỉnh sửa reminder của task. o Chỉnh sửa tagging của task. o Chỉnh sửa ghi chú của task. o Chỉnh sửa danh sách subtask. o Chỉnh sửa danh sách các tệp đính kèm. o Chỉnh sửa section mà task thuộc về (task ở board).

 Theo dõi task theo chế độ: o Kanban. o Table. o Calendar.

 Thông báo về ngày kết thúc của task.

 Thao tác với board: o Tạo board. o Xóa board. o Thêm section vào board. o Chỉnh sửa tên section. o Xóa section khỏi board.

 Thao tác với custom view: o Tạo custom view. o Xóa custom view. o Chỉnh sửa custom view.

 Thao tác với tag: o Thêm tag. o Xóa tag. o Chỉnh sửa tag.

 Quản lý quyền truy cập board: o Thêm người vào board. o Xóa thành viên khỏi board. o Chỉnh sửa quyền của thành viên trong board. o Rời board.

 Cài đặt cá nhân: o Đổi mật khẩu. o Xóa tài khoản. o Đổi màu nền. o Đổi ảnh nền. o Đổi ảnh đại diện. o Đồng bộ giữa các thiết bị.

Các ma trận quy định

(Các role (vai trò) trong board sẽ được ghi bằng tiếng anh để sát nghĩa nhất)

Bảng 3.1: Quyền hạn trong board

Quản lý quyền truy cập

Thao tác với tag trong board

Phân công, được phân công

Bảng 3.2: Quyền xem đối với các loại view

Các sơ đồ thiết kế

3.5.1 Sơ đồ Use Case (Use Case Diagram)

Hình 3.6: Sơ đồ use case tổng quát

Hình 3.7: Sơ đồ use case cho chức năng xem task

Hình 3.8: Sơ đồ use case cho chức năng xác thực người dùng

Hình 3.9: Sơ đồ use case cho chứ năng chat trong board

Hình 3.10: Sơ đồ use case cho chức năng thao tác với task

Hình 3.11: Sơ đồ use case cho chức năng thông báo

Hình 3.12: Sơ đồ use case cho chứ năng thao tác với board

Hình 3.13: Sơ đồ use case cho chức năng tìm và lọc task

Hình 3.14: Sơ đồ use case cho chức năng thao tác với tag

Hình 3.15: Sơ đồ use case cho chức năng phân công công việc

Hình 3.16: Sơ đồ use case cho chắc năng quản lý quyền truy cập trong board

Hình 3.17: Sơ đồ use case cho chức năng cài đặt người dùng

Hình 3.18: Sờ đồ use case cho chắc năng thao tác với custom view

3.5.2 Sơ đồ trạng thái (State Diagram)

Hình 3.19: Sơ đồ trạng thái

3.5.3 Sơ đồ hoạt động (Activity Diagram)

(Sơ đồ hoạt động có rất nhiều ảnh nên phần này chỉ để một số ảnh đặc trưng cho từng nhóm chức năng lớn)

Hình 3.20: Sơ đồ hoạt động cho chức năng đăng ký tài khoản

Hình 3.21: Sờ đồ hoạt động cho chức năng tạo task mới

Hình 3.22: Sơ đồ hoạt động cho chức năng xem task

Hình 3.23: Sơ đồ hoạt động cho chức năng tìm kiếm task

Hình 3.24: Sơ đồ hoạt động cho chức năng tạo custom view

Hình 3.25: Sơ đồ hoạt động cho chức năng tạo board

Hình 3.26: Sơ đồ hoạt động cho chức năng tạo tag

Hình 3.27: Sơ đồ hoạt động cho chức năng quản lý thành viên trong board

Hình 3.28: Sơ đồ hoạt động cho chức năng phân công công việc

Hình 3.29: Sơ đồ hoạt động cho chức năng thông báo

Hình 3.30: Sơ đồ hoạt động cho chức năng đổi mật khẩu

Hình 3.31: Sơ đồ hoạt động cho chức năng chat

3.5.4 Thiết kế cơ sở dữ liệu

Hình 3.32: Lược đồ cơ sở dữ liệu quan hệ của ứng dụng (chỉ thể hiện khóa)

Hình 3.33:Lược đồ cơ sở dữ liệu quan hệ của ứng dụng (chỉ thể hiện tên quan hệ)

XÂY DỰNG, TRIỂN KHAI ỨNG DỤNG

Kiến trúc phần mềm

Hình 4.34: Kiến trúc phần mềm

Kiến trúc phần mềm bao gồm một application server được host chung với database server, có thể monitor được thông qua Supabase dashboard và kết nối với desktop client.

Môi trường

 Phía server o Supabase: No-code Remote Backend Server sử dụng PostgreSQL làm cơ sở dữ liệu.

 Phía client o NET MAUI: Framework được sử dụng để phát triển ứng dụng có giao diện đồ họa người dùng trên desktop hoặc mobile, native hoặc cross-platform bằng ngôn ngữ lập trình C# và hệ sinh thái NET (.NET Core).

4.2.2 Môi trường phát triển ứng dụng

 Công cụ quản lý cơ sở dữ liệu và no-code remote backend server: Supabase.

 Công cụ vẽ sơ đồ phân tích thiết kế: draw.io.

 Công cụ phát triển mã nguồn ứng dụng: Visual Studio IDE

 Công cụ quản lý mã nguồn ứng dụng: Github.

4.2.3 Môi trường triển khai ứng dụng

 Hệ điều hành: Windows 10 hoặc Windows 11.

 Yêu cầu đã cài đặt sẵn: Microsoft Edge WebView2 Runtime

4.2.4 Cách cài đặt và chạy ứng dụng

4.2.4.1 Đối với nhà phát triển ứng dụng

Bước 1: Tải và cài đặt Visual Studio IDE.

Link tải: https://visualstudio.microsoft.com/downloads/

Hình 4.35: Logo Visual Studio IDE

Bước 2: Cài đặt NET MAUI workload.

Hình 4.36: Cài đặt NET MAUI workload ở Visual Studio Installer

Chọn và cài đặt NET MAUI workload ở Visual Studio Installer để có được bộ SDK phát triển ứng dụng.

Bước 3: Clone repository trên Github bằng đường dẫn sau: https://github.com/DickyDicky7/SE121.O11

Bước 4: Chọn project “WorkScheduleReminder.MAUIBlazor” làm startup project và chọn framework để chạy ứng dụng là net7.0-windows10.0.19041.0.

Hình 4.37: Chọn framework để chạy ứng dụng

Chọn framework windows 10 để chạy ứng dụng do mục tiêu nền tảng của ứng dụng là hệ điều hành Windows 10 (từ phiên bản 10.0.19041.0) trở lên.

Các bước bên trên chạy ứng dụng ở dạng unpackaged, để chạy và deploy ứng dụng ở dạng MSIX package, ta làm thêm các bước sau:

Bước 1: Theo đường dẫn /WorkScheduleReminder.MAUIBlazor/Properties/, mở file launchSettings.json và thay giá trị của trường “commandName” từ “Project” thành “MsixPackage”.

Hình 4.38: Thao tác với file launchSettings.json

Bước 2: Theo đường dẫn /WorkScheduleReminder.MAUIBlazor, mở file

WorkScheduleReminder.MAUIBlazor.csproj và comment lại hoặc bỏ đi dòng code

Hình 4.39: Thao tác với file WorkScheduleReminder.MAUIBlazor.csproj

Ngoài ra, từ đây nhà phát triển có thể theo đường dẫn này để đóng gói và publish ứng dụng (Khuyến cáo: nhà phát triển không nên sử dụng Visual Studio để publish ứng dụng do lỗi từ phía nhà phát triển của NET MAUI và Visual Studio, thay vào đó nhà phát triển nên sử dụng build tool bằng dòng lệnh trực tiếp là “dotnet” hoặc

“msbuild” để publish ứng dụng). https://learn.microsoft.com/en-us/dotnet/maui/windows/deployment/publish-visual- studio-folder?view=net-maui-7.0

4.2.4.2 Đối với người dùng cuối

Bước 1: Truy cập đường dẫn sau để cài đặt Microsoft Edge WebView2 Runtime

(nếu trên thiết bị của người dùng cuối chưa cài đặt sẵn, phần lớn các thiết bị cài đặt hệ điều hành Windows 10 đều đã được cài đặt tự động sẵn runtime này). https://developer.microsoft.com/en-us/microsoft-edge/webview2#download

Bước 2: Truy cập vào đường dẫn sau và tải về folder installer

(work_schedule_reminder_installer_windows_10_x64.zip) từ bản release mới nhất.https://github.com/DickyDicky7/SE121.O11/releases

Hình 4.41: Tải file nén zip chứa folder installer bản mới nhất

Tải file nén zip chứa folder installer bản mới nhất từ Github Release trên repository của project.

Bước 3: Giải nén folder installer rồi chọn file cer

(WorkScheduleReminder.MAUIBlazor_x.x.x.x_x64.cer) để chấp nhận giấy phép, sau đó chọn file msix (WorkScheduleReminder.MAUIBlazor_x.x.x.x_x64.msix) để tiến hành cài đặt.

Hình 4.42: File có đuôi msix

Cài đặt bước 1, chọn “Install Certificate…” để tiến hành cài đặt giấy phép.

Cài đặt bước 2, người dùng có thể chọn “Current User” (tương ứng với active user profile hiện tại) hoặc “Local Machine” (tương ứng với toàn bộ user profile có trên máy tính), sau đó chọn “Next”.

Cài đặt bước 3, chọn “Place all certificates in the following store” và điền giá trị là

Cài đặt bước 4, các bước tùy chọn đã xong, chọn “Finish” để hoàn thành cài đặt giấy phép.

Cài đặt bước 5, double click file msix, nhấn “Install” để cài đặt ứng dụng.

Danh sách màn hình và các thành phần

Hình 4.48: Màn hình đăng nhập

Màn hình đăng nhập, bao gồm tính năng đăng nhập bằng email username – password (sau khi điền đầy đủ thông tin, nhấn “Log in” để đăng nhập), đăng nhập bằng OAuth (sử dụng tài khoản Google hoặc Facebook để đăng nhập) và quên mật khẩu (Nhấn “Forgot password?”) cũng như đăng ký tài khoản mới (Nhấn “Sign up”)

Hình 4.49: Màn hình tạo tài khoản

Màn hình đăng ký tài khoản email username – password mới, người dùng cần nhập đẩy đủ các thông tin: địa chỉ email người dùng muốn đăng ký, mật khẩu cho tài khoản và nhập lại lần nữa mật khẩu để xác nhận mật khẩu đó đúng theo mong muốn của người dùng Sau đó người dùng nhấn “Sign up” để gửi yêu cầu đăng ký về hệ thống.

Màn hình MyDay thể hiện danh sách todo người dùng cần làm trong hôm nay, người dùng có thể soạn danh sách todo của mình bằng cách thêm bằng các task ở thanh drawer ở bên phải màn hình hoặc thêm hẳn một task mới bằng cách nhập nội dung ở thanh text field bên dưới màn hình rồi nhấn bàn phím “Enter”.

Hình 4.51: Màn hình Next 7 days

Màn hình Next 7 days thể hiện các task có deadline là trong 7 ngày tiếp theo tính từ ngày hôm nay, người dùng có thể thêm task có deadline theo từng cột bằng cách nhập nội dung ngay text field “Add task” ở mỗi cột rồi nhấn bàn phím “Enter” Khi nhấn vào một task trong một cột bất kỳ, hộp thoại chi tiết task (task detail) sẽ được hiện thị.

Hình 4.52: Màn hình All my tasks

Màn hình All my tasks thể hiện tổng hợp các task có deadline là trong quá khứ cho đến tương lai, người dùng có thể thêm task có deadline theo từng cột bằng cách nhập nội dung ngay text field “Add task” ở mỗi cột rồi nhấn bàn phím “Enter” Khi nhấn vào một task trong một cột bất kỳ, hộp thoại chi tiết task (task detail) sẽ được hiện thị.

Hình 4.53: Màn hình làm việc 1 board ở chế độ kanban

Màn hình làm việc 1 board ở chế độ kanban, để hiển thị nội dung ở chế độ kanban, người dùng nhấn vào mục “View” ở thanh top bar trên màn hình và sau đó chọn

Hình 4.54: Màn hình làm việc 1 board theo chế độ table

Màn hình làm việc 1 board theo chế độ table, để hiển thị nội dung ở chế độ table, người dùng nhấn vào mục “View” ở thanh top bar trên màn hình và sau đó chọn

Hình 4.55: Màn hình làm việc 1 board theo chế độ calendar

Màn hình làm việc 1 board theo chế độ calendar, để hiển thị nội dung ở chế độ calendar, người dùng nhấn vào mục “View” ở thanh top bar trên màn hình và sau đó chọn “Calendar”.

Hình 4.56: Hộp thoại chi tiết task

Hộp thoại chi tiết task, chi tiết của 1 task bao gồm ghi chú (note), các task con(subtask), đính kèm (attachments), cài đặt thông báo trong hộp thoại reminder(deadline/remind me), cài đặt hộp thoại danh sách các nhãn (tag), hộp thoại phân công công việc cho thành viên trong board (assign), hộp thoại di chuyển task hiện tại sang section khác (section) và hộp thoại chat dành riêng cho task (chat) Để thêm một đính kèm mới, người dùng nhấn “Upload Files” sau đó chọn lấy tệp tin mình cần đính kèm Đính kèm cũng có thể tải xuống hoặc xóa đi khỏi task bằng cách lần lượt nhấn icon đám mây tải xuống và thùng rác.

Hình 4.57: Hộp thoại cài đặt thông báo

Hộp thoại cài đặt thông báo, người dùng có thể đặt deadline khác cho task bằng cách thay đổi giá trị ở mục “Due Time” và “Due Date” Để cài đặt thông báo lặp cho task (reminder), người dùng chọn lấy 1 giá trị trong 4 giá trị “Daily”, “Weekly”,

“Monthly”, “Yearly” tương ứng với lặp lại hàng ngày, hàng tuần, hàng tháng, hàng năm “Begin time”, “Begin date” và “Cease time”, “Cease date” lần lượt chỉ định thời gian lặp lịch thông báo bắt đầu có hiệu lực và kết thúc hiệu lực.

Hình 4.58: Hộp thoại thao tác với tag và chọn tag

Hộp thoại thao tác với tag và chọn tag cho phép người dùng gắn tag cho task, thêm tag mới cũng như chỉnh sửa tag cũ Để lưu lại thay đổi, sau khi tùy chỉnh, người dùng nhấn “Save”.

Hình 4.59: Hộp thoại phân công công việc

Hộp thoại phân công công việc cho phép người dùng phân công task cho member trong 1 board, chỉ cần tick vào member người dùng muốn phân công task cho họ.

Hình 4.60: Hộp thoại chọn section cho 1 task trong board

Hộp thoại chọn section cho 1 task trong board cho phép người dùng di chuyển task hiện tại sang một board khác, chỉ cần tick vào section người dùng muốn di chuyển task hiện tại đến.

Hộp thoại chat cho phép người dùng trao đổi thông tin trực tiếp trong ứng dụng với các member khác trong board, nội dung chat ở mỗi task được phạm vi hóa trong chính task đó Để cung cấp một đoạn tin nhắn mới, người dùng thêm nội dung tin nhắn mới vào ô “Enter message” sau đó nhấn bàn phím “Enter” hoặc nhấn icon gửi.

Hình 4.62: Hộp thoại thông tin và quản lý thành viên trong board

Ngày đăng: 15/05/2024, 09:30

HÌNH ẢNH LIÊN QUAN

Hình 3.7: Sơ đồ use case cho chức năng xem task - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.7 Sơ đồ use case cho chức năng xem task (Trang 28)
Hình 3.9: Sơ đồ use case cho chứ năng chat trong board - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.9 Sơ đồ use case cho chứ năng chat trong board (Trang 29)
Hình 3.10: Sơ đồ use case cho chức năng thao tác với task - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.10 Sơ đồ use case cho chức năng thao tác với task (Trang 30)
Hình 3.12: Sơ đồ use case cho chứ năng thao tác với board - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.12 Sơ đồ use case cho chứ năng thao tác với board (Trang 31)
Hình 3.14: Sơ đồ use case cho chức năng thao tác với tag - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.14 Sơ đồ use case cho chức năng thao tác với tag (Trang 32)
Hình 3.16: Sơ đồ use case cho chắc năng quản lý quyền truy cập trong board - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.16 Sơ đồ use case cho chắc năng quản lý quyền truy cập trong board (Trang 33)
Hình 3.20: Sơ đồ hoạt động cho chức năng đăng ký tài khoản - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.20 Sơ đồ hoạt động cho chức năng đăng ký tài khoản (Trang 35)
Hình 3.23: Sơ đồ hoạt động cho chức năng tìm kiếm task - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.23 Sơ đồ hoạt động cho chức năng tìm kiếm task (Trang 36)
Hình 3.24: Sơ đồ hoạt động cho chức năng tạo custom view - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.24 Sơ đồ hoạt động cho chức năng tạo custom view (Trang 37)
Hình 3.26: Sơ đồ hoạt động cho chức năng tạo tag - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.26 Sơ đồ hoạt động cho chức năng tạo tag (Trang 38)
Hình 3.28: Sơ đồ hoạt động cho chức năng phân công công việc - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.28 Sơ đồ hoạt động cho chức năng phân công công việc (Trang 39)
Hình 3.32: Lược đồ cơ sở dữ liệu quan hệ của ứng dụng (chỉ thể hiện khóa) - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.32 Lược đồ cơ sở dữ liệu quan hệ của ứng dụng (chỉ thể hiện khóa) (Trang 41)
Hình 3.33:Lược đồ cơ sở dữ liệu quan hệ của ứng dụng (chỉ thể hiện tên quan hệ) - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 3.33 Lược đồ cơ sở dữ liệu quan hệ của ứng dụng (chỉ thể hiện tên quan hệ) (Trang 42)
Hình 4.34: Kiến trúc phần mềm - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.34 Kiến trúc phần mềm (Trang 43)
Hình 4.36: Cài đặt .NET MAUI workload ở Visual Studio Installer - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.36 Cài đặt .NET MAUI workload ở Visual Studio Installer (Trang 45)
Hình 4.41: Tải file nén .zip chứa folder installer bản mới nhất - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.41 Tải file nén .zip chứa folder installer bản mới nhất (Trang 48)
Hình 4.43: Cài đặt bước 1 - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.43 Cài đặt bước 1 (Trang 49)
Hình 4.44: Cài đặt bước 2 - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.44 Cài đặt bước 2 (Trang 50)
Hình 4.45: Cài đặt bước 3 - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.45 Cài đặt bước 3 (Trang 51)
Hình 4.46: Cài đặt bước 4 - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.46 Cài đặt bước 4 (Trang 52)
Hình 4.52: Màn hình All my tasks - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.52 Màn hình All my tasks (Trang 56)
Hình 4.53: Màn hình làm việc 1 board ở chế độ kanban - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.53 Màn hình làm việc 1 board ở chế độ kanban (Trang 57)
Hình 4.57: Hộp thoại cài đặt thông báo - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.57 Hộp thoại cài đặt thông báo (Trang 60)
Hình 4.58: Hộp thoại thao tác với tag và chọn tag - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.58 Hộp thoại thao tác với tag và chọn tag (Trang 61)
Hình 4.59: Hộp thoại phân công công việc - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.59 Hộp thoại phân công công việc (Trang 61)
Hình 4.60: Hộp thoại chọn section cho 1 task trong board - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.60 Hộp thoại chọn section cho 1 task trong board (Trang 62)
Hình 4.61: Hộp thoại chat - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.61 Hộp thoại chat (Trang 63)
Hình 4.64: Hộp thoại lọc task theo người được phân công - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.64 Hộp thoại lọc task theo người được phân công (Trang 65)
Hình 4.66: Hộp thoại tạo board - đồ án 1 xây dựng ứng dụng nhắc lịch công tác
Hình 4.66 Hộp thoại tạo board (Trang 67)
w