Biểu mẫu

Các biểu mẫu liên hệ, báo giá, đặt lịch và đăng ký được xây dựng sẵn. AI chèn một biểu mẫu vào chỉ với một component duy nhất — không cần viết submit handler — và mọi lượt gửi đều xuất hiện trong hộp thư gửi biểu mẫu của ứng dụng.

Biểu mẫu trên Proyecta là một tính năng có sẵn, không phải thứ AI tự viết thủ công. Khi ứng dụng của bạn cần cách để khách truy cập liên hệ với bạn — biểu mẫu liên hệ, yêu cầu báo giá, đặt lịch hẹn, đăng ký sự kiện — Proyecta sẽ cung cấp một định nghĩa biểu mẫu có sẵn và hiển thị nó thông qua một block thuộc sở hữu của template. Việc xác thực dữ liệu, hiển thị trạng thái thành công, lưu trữ lượt gửi và thông báo cho chủ sở hữu đều được xử lý tự động.

Các loại biểu mẫu có sẵn

Mọi biểu mẫu đều bắt đầu từ một trong năm loại có sẵn. Chỉ cần mô tả biểu mẫu bạn muốn và Proyecta sẽ chọn (và điều chỉnh) loại phù hợp — bạn không cần tự xây dựng từng trường.

Loại	form api id	Dùng để làm gì	Kết hợp với
Liên hệ	contactForm	Liên hệ chung: tên, email, điện thoại (tùy chọn), tin nhắn	Thông tin doanh nghiệp
Báo giá	quoteForm	Yêu cầu báo giá: thông tin liên hệ + dịch vụ cần + chi tiết công việc	Dịch vụ
Đặt lịch	bookingForm	Đặt lịch hẹn: dịch vụ, ngày & giờ ưa thích, thông tin liên hệ	Dịch vụ
Đăng ký	registrationForm	Đăng ký sự kiện hoặc khóa học (RSVP): thông tin người tham dự + ghi chú	Sự kiện
Đặt hàng	orderForm	Tiếp nhận đơn hàng: khách muốn gì, thông tin liên hệ, ghi chú	Thực đơn, danh mục

Bạn có thể có nhiều biểu mẫu trong một ứng dụng (ví dụ: biểu mẫu liên hệ và biểu mẫu đặt lịch), và AI có thể thêm, đổi tên hoặc điều chỉnh các trường trong bất kỳ biểu mẫu nào.

Cách AI kết nối biểu mẫu

AI không tự xây dựng biểu mẫu hay viết submit handler. Nó chèn <FormBlock/> thuộc sở hữu của template và trỏ nó đến một biểu mẫu theo id hoặc api id:

import { FormBlock } from '@/components/blocks/FormBlock';

// Ở bất kỳ đâu trên trang public — phần liên hệ, panel "yêu cầu báo giá", v.v.
<FormBlock form="contactForm" />;

<FormBlock/> tự xử lý tất cả mọi thứ:

• Hiển thị các trường theo kiểu dữ liệu — văn bản / email / điện thoại dạng input, văn bản dài dạng textarea, lựa chọn dạng dropdown, xác nhận dạng checkbox, ngày và giờ dạng native picker, và trường tệp dạng nút “đính kèm tệp”.
• Xác thực phía trình duyệt — các trường bắt buộc được kiểm tra trước khi gửi.
• Xác thực phía server — nếu server từ chối một giá trị, lỗi cụ thể sẽ hiển thị ngay cạnh trường đó (không mất dữ liệu, không có lỗi thầm lặng).
• Hiển thị trạng thái thành công — sau khi gửi, biểu mẫu được thay thế bằng thông báo xác nhận thân thiện (thông điệp xác nhận của chính biểu mẫu đó) kèm tùy chọn gửi thêm phản hồi.
• Xử lý lỗi an toàn — nếu biểu mẫu không tồn tại hoặc đã bị vô hiệu hóa, block sẽ không hiển thị gì, đảm bảo không bao giờ làm hỏng trang public.

Vì block thuộc sở hữu của template, nhiệm vụ của AI chỉ là đặt nó vào và tạo kiểu cho phần xung quanh — phần kỹ thuật phía sau đã được cố định và hoạt động chính xác.

Đính kèm tệp

Biểu mẫu có thể nhận tệp tải lên (biên lai, ảnh tham khảo, brief). Các trường tệp hiển thị nút “đính kèm tệp”, tải tệp lên storage và đặt URL công khai của tệp vào lượt gửi. Giới hạn được áp dụng tự động:

• Chỉ chấp nhận ảnh và PDF, tối đa 5 MB (ảnh lớn sẽ được giảm kích thước trên trình duyệt trước).
• Nút gửi bị vô hiệu hóa trong khi tệp đang tải lên, đảm bảo không có lượt gửi nào bị gửi đi khi chưa hoàn tất.

Nơi lưu trữ các lượt gửi

Mọi lượt gửi đều được lưu trữ và hiển thị trong hộp thư gửi biểu mẫu của ứng dụng — thuộc admin panel, được hiển thị bởi <SubmissionsInbox/> của template. Từ đó, bạn (chủ sở hữu) có thể:

• Duyệt các lượt gửi theo tab New / Read / Archived, với huy hiệu chưa đọc trên New.
• Mở bất kỳ lượt gửi nào để xem giá trị của các trường đã gửi, trang nguồn và ngày gửi.
• Đánh dấu lượt gửi là read, chuyển lại thành new, hoặc archive.
• Lọc hộp thư theo một biểu mẫu cụ thể, hoặc xem tất cả lượt gửi của mọi biểu mẫu trong một danh sách.

Hộp thư chỉ dành cho admin — người dùng phải đăng nhập bằng tài khoản admin (được kiểm tra phía server).

Nhận email với mỗi lượt gửi

Biểu mẫu có thể thông báo cho bạn qua email mỗi khi có người gửi — hãy bật thông báo cho chủ sở hữu và đặt địa chỉ email nhận thông báo. Bạn sẽ nhận được khách hàng tiềm năng ngay trong hộp thư mà không cần mở ứng dụng. Email được gửi thông qua tính năng email của Proyecta, nên hoạt động ngay mà không cần cài đặt thêm gì.

Các mẫu câu lệnh thường gặp (để AI xử lý)

• "Add a contact form to the footer with name, email, and message, and email me at hello@mybiz.com whenever someone submits."
• "Put a 'Request a quote' form on each service page that asks which service they need and the job details."
• "Add a booking form so clients can request an appointment with a preferred date and time."
• "Create an event registration form for the workshop page and let attendees attach a PDF."
• "Show me the submissions inbox and only the ones I haven't read yet."

Xem thêm

• Quản lý nội dung — biểu mẫu tồn tại cùng với các collection của bạn trong cùng một mô hình nội dung.
• Admin Panel — nơi xem lại các lượt gửi.
• Emails — cách email thông báo cho chủ sở hữu được gửi đi.