Bạn sẽ tìm hiểu cách tạo một ứng dụng web từ đầu bằng Frappe Framework. Frappe Framework là một framework dựa trên web đầy đủ và nó bao gồm tất cả các công cụ cần thiết để triển khai một trang web vào sản xuất. được hỗ trợ bởi Python, JavaScript và Redis, cùng với một số công nghệ và hỗ trợ cơ sở dữ liệu MariaDB và PostgreSQL. Jinja được sử dụng làm công cụ tạo khuôn mẫu cho các định dạng Chế độ xem web và In. Redis được sử dụng để lưu vào bộ nhớ đệm, duy trì hàng đợi công việc và cập nhật theo thời gian thực. Tuy nhiên, bạn có thể không cần phải thành thạo tất cả các công cụ này để bắt đầu với nó.
Ví dụ: xây dựng một Hệ thống quản lý thư viện
Chúng tôi sẽ xây dựng một Hệ thống quản lý thư viện đơn giản trong đó Thủ thư Librarian có thể đăng nhập và quản lý Bài viết Articles và Tư cách thành viên Memberships. Chúng ta sẽ xây dựng các mô hình sau:
Bài viết Article : Một cuốn sách hoặc món đồ tương tự có thể được thuê.
Thành viên Thư viện Library Member: Người dùng đã đăng ký làm thành viên.
Giao dịch Thư viện Library Transaction: Phát hành hoặc Trả lại một bài báo.
Tư cách thành viên Thư viện Library Membership: Tài liệu thể hiện tư cách thành viên tích cực của Thành viên Thư viện.
Cài đặt Thư viện Library Settings: Cài đặt xác định các giá trị như Thời gian mượn và số lượng bài viết tối đa có thể được phát hành tại một thời điểm.
Thủ thư sẽ đăng nhập vào một giao diện được gọi là Bàn làm việc , một giao diện quản trị phong phú đi kèm với khung. Bàn cung cấp nhiều chế độ xem tiêu chuẩn như Chế độ xem danh sách, Chế độ xem biểu mẫu, Chế độ xem báo cáo List view, Form view, Report view, v.v. và nhiều tính năng như Quyền dựa trên vai trò. Chúng tôi cũng sẽ tạo Chế độ xem web công khai mà Thành viên Thư viện có thể truy cập nơi họ có thể duyệt các Bài viết có sẵn.
Tạo một ứng dụng.
Trước khi chúng ta bắt đầu, hãy đảm bảo bạn đang ở trong một thư mục frappe-bench. Để xác nhận, hãy chạy bench find
Để tạo ứng dụng Quản lý Thư viện của chúng tôi, hãy chạy: bench new-app library_management
Khai báo cách thông tin như sau:
App Title (default: Library Management):
App Description: Library Management System
App Publisher: Faris Ansari
App Email: faris@example.com
App Icon (default ‘octicon octicon-file-directory’): Để chọn icon hãy xem danh sách đầy đủ tất cả các biểu tượng được hỗ trợ trong thư viện octicons, xem https://primer.style/octicons/
App Color (default ‘grey’):
App License (default ‘MIT’):
Mình sẽ nhận được thư mục trong frappe-bench/apps/library_management. Thư mục gồm những file liệt kê trong frappeframework.com/docs/user/en/tutorial/create-an-app.
- Library_management: Thư mục này sẽ chứa tất cả mã nguồn cho ứng dụng của bạn
- public : Lưu trữ các tệp tĩnh sẽ được cung cấp từ Nginx trong quá trình sản xuất
- mẫu : Mẫu Jinja được sử dụng để hiển thị lượt xem web
- www : Các trang web được phục vụ dựa trên đường dẫn thư mục của chúng
- thư viện_quản lý: Mô-đun mặc định được khởi động bằng ứng dụng
- module.txt: Danh sách các mô-đun được xác định trong ứng dụng
- Patch.txt : Các mục vá để di chuyển cơ sở dữ liệu
- hooks.py : Hook được sử dụng để mở rộng hoặc chặn chức năng tiêu chuẩn do framework cung cấp
- pyproject.toml: Chỉ định cách xây dựng ứng dụng của bạn, bạn có thể tùy ý thêm các phần phụ thuộc Python của bên thứ 3 tại đây, phần phụ thuộc này sẽ được cài đặt khi ứng dụng của bạn được cài đặt.
Nạp ứng dụng vào website
Để cài đặt ứng dụng Quản lý Thư viện trên trang web của chúng tôi, hãy chạy lệnh bench –site site install-app library_management
Để xác nhận xem ứng dụng đã được cài đặt chưa, hãy chạy lệnh bench –site library.test list-apps
Nếu chưa có website có thể xem frappeframework.com/docs/user/en/tutorial/create-a-site
Tạo một loại tài liệu DocTypes
DocType tương tự như Model trong các framework khác. Ngoài việc xác định các thuộc tính, nó còn xác định hành vi của Model. Nó không chỉ xác định tên bảng và cột mà còn cả cách hiển thị trong các chế độ xem khác nhau trong Desk. Trước khi có thể tạo DocTypes, chúng tôi cần bật chế độ nhà phát triển Bench của mình. Điều này sẽ cho phép tạo bản soạn sẵn khi chúng tôi tạo loại tài liệu và chúng tôi có thể theo dõi chúng trong quá trình kiểm soát phiên bản bằng ứng dụng của mình.
Thoát khỏi bench nếu nó đang chạy. Sau đó từ thư mục frappe-bench, chạy lệnh:
bench set-config -g developer_mode true
bench start
Vào trang web, ở trong Desk, hãy điều hướng đến DocType List bằng Thanh tìm kiếm . Danh sách này sẽ bao gồm DocTypes đi kèm với khung, những tài liệu là một phần của ứng dụng Frappe đã cài đặt và các ứng dụng tùy chỉnh mà bạn có thể tạo cụ thể cho từng trang web.
Loại tài liệu đầu tiên chúng ta sẽ tạo là Article . Để tạo nó, hãy nhấp vào Mới.
Nhập tên làm bài viết
Chọn Quản lý thư viện trong module
Thêm các trường sau vào bảng Trường:
Tên bài viết (Dữ liệu, bắt buộc) Article Name (Data, Mandatory)
Hình ảnh (Đính kèm hình ảnh) Image (Attach Image)
Tác giả (Dữ liệu) Author (Data)
Mô tả (Trình chỉnh sửa văn bản) Description (Text Editor)
ISBN (Dữ liệu) ISBN (Data)
Trạng thái (Chọn) Status (Select) – Nhập hai tùy chọn: Đã phát hành và Có sẵn Issued/Available (Nhập Issued, nhấn enter, sau đó nhập Available)
Nhà xuất bản (Dữ liệu) Publisher (Data)
Sau khi thêm các trường, nhấp vào Lưu.
Bạn sẽ thấy nút Chuyển đến Danh sách Bài viết ở phía trên bên phải của biểu mẫu. Bấm vào nó để đi đến Danh sách bài viết. Tại đây bạn sẽ thấy một danh sách trống không có bản ghi nào vì bảng không có bản ghi.
Hãy tạo một số bản ghi. Nhưng trước đó, chúng ta cần xóa bộ đệm của Desk. Nhấp vào menu thả xuống Cài đặt ở bên phải thanh điều hướng và nhấp vào Tải lại .
Bây giờ, bạn sẽ thấy nút Mới . Nhấp vào nó và bạn sẽ thấy chế độ xem Biểu mẫu của loại tài liệu Bài viết. Điền vào biểu mẫu và nhấp vào Lưu. Bạn đã tạo tài liệu Bài viết đầu tiên của mình. Quay lại chế độ xem danh sách và bạn sẽ thấy một bản ghi.
Điều gì đã xảy ra khi bạn tạo Article DocType? Thứ nhất bảng cơ sở dữ liệu: Một bảng cơ sở dữ liệu có tên tabArticle đã được tạo với các trường mà chúng tôi đã chỉ định trong bảng trường. Bạn có thể xác nhận điều này bằng cách kiểm tra nó từ bảng điều khiển MariaDB: bench –site site mariadb
Thứ 2. Chế độ xem bàn: Có một số chế độ xem cũng được tạo cho DocType của chúng tôi. Danh sách bài viết là dạng xem danh sách hiển thị các bản ghi từ bảng cơ sở dữ liệu. Chế độ xem Biểu mẫu là chế độ xem được hiển thị khi bạn muốn tạo một tài liệu mới hoặc xem một tài liệu hiện có.
Thứ 3. Bố cục biểu mẫu: Nếu bạn để ý, bố cục của các trường trong biểu mẫu sẽ theo cách bạn sắp xếp chúng trong bảng Trường. Ví dụ: Tên bài viết là trường đầu tiên theo sau là Hình ảnh, sau đó là Tác giả. Trong các phần sau của hướng dẫn, chúng ta sẽ tìm hiểu cách tùy chỉnh thêm điều này.
Thứ 4. Mã soạn sẵn. bạn sẽ thấy một số tệp đã được tạo. cd apps/library_management
git status -u
Những file đã thay đổi như :Article.json – Tệp JSON xác định thuộc tính loại tài liệu, Article.js – Bộ điều khiển phía máy khách cho chế độ xem Biểu mẫu, Article.py – Bộ điều khiển Python cho bài viết, test_article.py – Bản tóm tắt bài kiểm tra đơn vị Python để viết bài kiểm tra.
Đảm bảo bạn bỏ chọn ‘Tùy chỉnh?’ hộp kiểm trong cấu hình loại tài liệu. Nếu không, các tệp được thảo luận bên dưới sẽ không được tạo.
Features Tính năng của DocType
Ở phần này sẽ có những tính năng khác mà chúng ta có thể tùy chỉnh như:
Naming duy nhất
Nếu bạn đã tạo một tài liệu bằng Biểu mẫu, bạn có thể nhận thấy rằng giá trị nam của tài liệu là hàm băm được tạo ngẫu nhiên. Hãy thực hiện thay đổi để Tên bài viết mà chúng tôi cung cấp trở thành tên namecủa tài liệu.
Để làm điều đó, hãy mở danh sách loại tài liệu từ thanh tìm kiếm và nhấp vào Bài viết. Bây giờ, cuộn xuống phần Đặt tên và trong trường Tên tự động, nhập field:article_name . Bấm vào Lưu. Bây giờ, hãy quay lại Danh sách bài viết và tạo lại bài viết mới. Tên của tài liệu sẽ là Tên bài viết và nó phải là duy nhất trên các Bài viết. Vì vậy bạn không thể tạo thêm bài viết khác có cùng tên.
Form Layout
Chuyển đến loại tài liệu Bài viết, cuộn đến phần Trường và thêm hai trường mới thuộc loại Ngắt cột và Ngắt phần . Chúng tôi cũng sẽ ẩn trường Hình ảnh vì nó không cần thiết phải hiển thị trong biểu mẫu. Kiểm tra GIF để xem nó hoạt động. Chuyển đến loại tài liệu Bài viết và cuộn xuống phần Cài đặt biểu mẫu . Nhập hình ảnh vào Trường Hình ảnh. Điều này sẽ hiển thị hình ảnh ở phía trên bên trái của biểu mẫu. Bạn cũng có thể bật Allow Rename để cho phép đổi tên tài liệu.
Permissions Quyền truy cập
Bạn cũng có thể định cấu hình vai trò nào bạn muốn cho phép và hành động nào bạn muốn hạn chế đối với DocType. Đi tới loại tài liệu Bài viết, cuộn xuống phần Quy tắc cấp phép và thêm vai trò.
Bạn cũng có thể định cấu hình loại hành động được phép cho một vai trò cụ thể. Hãy thêm vai trò Thủ thư có quyền thực hiện mọi hành động và vai trò Thành viên Thư viện có quyền thực hiện hành động Đọc. Bạn có thể kiểm tra điều này bằng cách tạo một Người dùng mới có vai trò Thủ thư và một Người dùng khác có vai trò Thành viên Thư viện . Đăng nhập với từng người dùng và xem những hành động nào được phép.
Controller Methods
Viết phương thức điều khiển cho phép bạn viết logic nghiệp vụ trong suốt vòng đời của tài liệu.
Hãy tạo doctype thứ hai của chúng ta: Library Member . Nó sẽ có các trường sau:
Tên (Dữ liệu, Bắt buộc)First Name (Data, Mandatory)
Họ (Dữ liệu)Last Name (Data)
Tên đầy đủ (Dữ liệu, Chỉ đọc)Full Name (Data, Read Only)
Địa chỉ Email (Dữ liệu)Email Address (Data)
Điện thoại (Dữ liệu)Phone (Data)
Sau khi bạn đã tạo doctype, hãy chuyển tới danh sách Thành viên Thư viện, xóa bộ nhớ đệm Settings > Reload và tạo Thành viên Thư viện mới.
Nếu bạn để ý thì trường Họ và tên không hiển thị trong biểu mẫu. Điều này là do chúng tôi đặt nó ở chế độ Chỉ đọc. Nó sẽ chỉ được hiển thị khi nó có một số giá trị. Ở đây hãy viết mã trong python controller class sao cho Tên đầy đủ được tính toán tự động hiện nội dung từ Tên và Họ.
Mở trình soạn thảo mã của bạn và mở tệp library_member.py và thực hiện các thay đổi theo frappeframework.com/docs/user/en/tutorial/controller-methods
Types of DocType
Hãy tạo một loại tài liệu khác: Tư cách thành viên thư viện Library Membership. Nó sẽ có các trường sau:
Thành viên Thư viện (Liên kết, Bắt buộc)Library Member (Link, Mandatory)
Tên đầy đủ (Dữ liệu, Chỉ đọc)Full Name (Data, Read Only)
Từ Ngày (Ngày)From Date (Date)
Đến Ngày (Ngày)To Date (Date)
Đã thanh toán (Séc)Paid (Check)
Nó sẽ được kích hoạt Is Submittable . Nó sẽ được đặt tên là LMS.##### và bị giới hạn ở vai trò Thủ thư . Ngoài ra, Trường Tiêu đề phải được đặt thành full_nametrong phần Cài đặt Chế độ xem. Trường Liên kết Thành viên Thư viện tương tự như cột Khóa ngoài trong các khung khác. Nó sẽ cho phép bạn liên kết giá trị với một bản ghi trong DocType khác. Trong trường hợp này, nó liên kết tới một bản ghi của Library Member DocType.
Trường Tên đầy đủ là trường Chỉ đọc sẽ được tự động tìm nạp từ trường full_nametrong bản ghi được liên kết Library Member .
Bây giờ, hãy vào danh sách Thành viên Thư viện và tạo một tài liệu mới. Bạn sẽ thấy trường Thành viên Thư viện là một danh sách thả xuống với các bản ghi hiện có được hiển thị dưới dạng tùy chọn. Chọn Thành viên Thư viện và Tên đầy đủ sẽ được tìm nạp tự động. Khá tuyệt phải không?
Loại tài liệu được liên kết
Loại tài liệu được liên kết là Loại tài liệu được liên kết trong các loại tài liệu khác dưới dạng trường Liên kết. Tất cả các loại tài liệu đều có thể liên kết được. Chúng tôi có thể phân loại rộng rãi các loại tài liệu thành Chính và Giao dịch dựa trên loại dữ liệu chúng lưu trữ. Article, Library Member là những ví dụ về Master data vì chúng đại diện cho một thực thể (vật lý hoặc ảo). Tư cách thành viên thư viện là một ví dụ về loại tài liệu lưu trữ dữ liệu giao dịch.
Loại tài liệu có thể gửi
Khi bạn bật Có thể gửi được trong Loại tài liệu sẽ trở thành Loại tài liệu có thể gửi. Loại tài liệu có thể gửi có thể có 3 trạng thái: Bản nháp , Đã gửi và Đã hủy . Tài liệu ở trạng thái Bản nháp có thể được thay đổi giống như bất kỳ tài liệu nào, tuy nhiên khi tài liệu ở trạng thái Đã gửi , giá trị của bất kỳ trường nào trong tài liệu không thể thay đổi. Tài liệu đã gửi có thể bị hủy , điều này làm cho tài liệu không hợp lệ. Nếu bạn để ý, một trường bổ sung đã được thêm vào loại tài liệu Thành viên Thư viện của chúng tôi có tên là Đã sửa đổi Từ. Trường này được sử dụng để theo dõi các sửa đổi trong tài liệu. Sau khi tài liệu bị hủy, nó chỉ có thể được sửa đổi, nghĩa là nó có thể được sao chép và tài liệu bị hủy sẽ được liên kết với tài liệu được sửa đổi mới thông qua trường Đã sửa đổi từ .
Xác thực bộ điều khiển cho tư cách thành viên
Bây giờ, hãy viết mã để đảm bảo bất cứ khi nào Tư cách thành viên Thư viện được tạo thì Thành viên đó sẽ không có tư cách thành viên đang hoạt động.
Nội dung code xem: https://frappeframework.com/docs/user/en/tutorial/types-of-doctype
Chúng tôi đã viết logic của mình theo before_submitphương thức sẽ chạy trước khi chúng tôi gửi tài liệu. Chúng tôi đã sử dụng frappe.db.existsphương pháp này để kiểm tra xem bản ghi Thành viên Thư viện có tồn tại với các bộ lọc được cung cấp của chúng tôi hay không. Nếu nó tồn tại, chúng tôi thường frappe.throwdừng việc thực thi chương trình bằng một thông báo sẽ hiển thị cho người dùng biết lý do.
Bây giờ, hãy thử tạo Tư cách thành viên Thư viện với khoảng thời gian trùng lặp và bạn sẽ thấy lỗi khi gửi tài liệu.
Giao dịch thư viện
Hãy tạo một DocType để ghi lại Vấn đề hoặc Trả lại Bài viết của Thành viên Thư viện có tư cách thành viên tích cực.
Loại tài liệu này sẽ được gọi là Giao dịch thư viện và sẽ có các trường sau:
Bài viết – Liên kết đến bài viết
Thành viên Thư viện – Liên kết đến Thành viên Thư viện
Loại – Chọn với 2 lựa chọn: Phát hành và Trả lại
Ngày – Ngày giao dịch
Loại tài liệu này cũng sẽ là loại tài liệu có thể gửi.
Xác thực giao dịch
Khi một Bài viết được phát hành, chúng tôi nên xác minh xem Thành viên Thư viện có tư cách thành viên tích cực hay không. Chúng ta cũng nên kiểm tra xem Bài viết có sẵn để phát hành hay không. Hãy viết mã cho những xác nhận này.
Mã xem ở trang frappeframework.com/docs/user/en/tutorial/types-of-doctype
Cài đặt thư viện
Hãy tạo loại tài liệu cuối cùng cho ứng dụng của chúng ta: Cài đặt Thư viện . Nó sẽ có các trường sau:
Thời hạn cho vay – Sẽ xác định thời gian cho vay theo số ngày
Số lượng bài viết được phát hành tối đa – Hạn chế số lượng bài viết tối đa có thể được phát hành bởi một thành viên
Vì chúng tôi không cần có nhiều bản ghi cho các cài đặt này nên chúng tôi sẽ bật Là đơn cho loại tài liệu này.
Sau khi tạo loại tài liệu, hãy nhấp vào Chuyển đến Cài đặt thư viện , để chuyển đến biểu mẫu và đặt các giá trị cho Thời hạn mượn và Số lượng bài báo được phát hành tối đa .
Loại tài liệu đơn
Khi Loại tài liệu được bật là Loại tài liệu đơn , nó sẽ trở thành Loại tài liệu đơn. Một loại tài liệu tương tự như các bản ghi đơn trong các khung công tác khác. Nó không tạo ra một bảng cơ sở dữ liệu mới. Thay vào đó, tất cả các giá trị đơn lẻ được lưu trữ trong một bảng duy nhất có tên là tabSingles. Nó thường được sử dụng để lưu trữ các cài đặt chung.
Xác thực cài đặt thư viện
Hãy thực hiện thay đổi về Tư cách thành viên Thư viện sao cho Đến ngày được tính toán tự động dựa trên Thời gian mượn và Ngày bắt đầu.
Chúng tôi đã sử dụng frappe.db.get_single_valuephương pháp để lấy giá trị loan_periodtừ loại tài liệu Cài đặt Thư viện.
Bây giờ, hãy thực hiện thay đổi trong Giao dịch thư viện sao cho khi một Bài viết được phát hành, nó sẽ kiểm tra xem có đạt đến giới hạn tối đa hay không.
Chúng tôi đã thêm một validate_maximum_limitphương thức và sử dụng frappe.db.countđể đếm số lượng giao dịch được thực hiện bởi thành viên.
Tập lệnh biểu mẫu Form Scripts
Tập lệnh biểu mẫu là mã javascript phía máy khách giúp nâng cao trải nghiệm người dùng cho Biểu mẫu của bạn.
Giả sử bạn muốn tạo tư cách thành viên cho một thành viên. Để thực hiện việc này, bạn phải vào danh sách Thành viên Thư viện, tạo biểu mẫu mới, chọn thành viên và các trường khác rồi lưu.
Tương tự, khi bạn muốn tạo giao dịch với thành viên, bạn phải tạo biểu mẫu Giao dịch Thư viện mới. Chúng tôi có thể làm cho quá trình này dễ dàng hơn. Viết đoạn mã theo frappeframework.com/docs/user/en/tutorial/form-scripts vào thư viện_member.js
Bây giờ, hãy làm mới trang của bạn và chuyển đến biểu mẫu Thành viên Thư viện. Bạn sẽ thấy hai nút ở trên cùng bên phải. Bấm vào chúng để thử chúng. Họ sẽ tự động đặt Thành viên Thư viện trong mỗi tài liệu đó để giúp quá trình này trở nên dễ dàng hơn.
Web View Pages
Trang xem web là các trang được máy chủ hiển thị cho khách truy cập trang web của bạn.
Chúng tôi đã làm việc độc quyền với Desk, giao diện quản trị mà Người dùng hệ thống có thể truy cập. Thông thường, bạn sẽ muốn cấp quyền truy cập hạn chế cho khách hàng của mình. Trong trường hợp của chúng tôi, chúng tôi muốn Thành viên Thư viện có thể xem các Bài viết có sẵn mà họ có thể phát hành từ trang web của chúng tôi. Trang xem web có thể giúp chúng tôi đạt được điều đó.
Đi tới Loại tài liệu bài viết và cuộn xuống phần Chế độ xem web.
Bật chế độ xem web và cho phép khách xem
Nhập bài viết vào trường Tuyến đường
Thêm các trường có tên Tuyến đường và Xuất bản trong bảng trường
Bấm vào Lưu
Trường đã xuất bản sẽ giúp lọc ra những tài liệu không được hiển thị trong chế độ xem web, nếu không bạn sẽ gặp lỗi. Hiện chúng tôi đã bật chế độ xem web cho loại tài liệu Bài viết. Điều này có nghĩa là giờ đây bạn có thể xem chi tiết về Bài viết trên trang web của mình mà không cần đăng nhập vào Desk. Hãy kiểm tra điều này bằng cách tạo một Điều khoản mới. Bạn sẽ thấy Xem trên trang web ở phía trên bên trái biểu mẫu của bạn. Nhấp vào nó để xem chế độ xem web của Bài viết.
Tùy chỉnh mẫu xem web
Chế độ xem web mặc định được tạo khá đơn giản và chỉ đóng vai trò là điểm khởi đầu để chúng tôi tùy chỉnh nó. Khi chúng tôi đặt Bài viết ở chế độ xem web, hai tệp HTML đã được tạo là: article.html và article_row.html
Trước tiên hãy chỉnh sửa article.html. Frappe sử dụng Bootstrap 4 theo mặc định cho chế độ xem web. Vì vậy, bạn có thể sử dụng bất kỳ đánh dấu Bootstrap 4 hợp lệ nào để tạo kiểu cho các trang của mình. Thêm mã HTML sau vào bài viết.html như ví dụ frappeframework.com/docs/user/en/tutorial/portal-pages.
Tương tự, chỉnh sửa bài viết_row.html và thêm HTML.
Các kiến thức cần trang bị thêm.
Cần thảo luận thêm xem trang public forum: discuss.erpnext.com
Bài viết liên quan: