Chuyển tới nội dung chính

Tùy Biến Giao Diện Không Cần Code (No-Code Form Design)

Sứ Mệnh Của Bài Học

Trong các phần mềm kế toán truyền thống, nếu màn hình Hóa đơn bán hàng không có chỗ để nhập "Biển số xe tải giao hàng", bạn sẽ phải gọi điện cho công ty phần mềm, trả thêm vài chục triệu đồng và đợi họ viết code cập nhật cả tháng trời.

Với ERPNext, "đặc quyền IT" này được giao thẳng vào tay Quản trị viên. Bài học này hướng dẫn bạn kéo thả giao diện (No-Code) chỉ trong 3 phút.

1. Thêm Trường Dữ Liệu Tùy Chỉnh (Customize Form)​

Để thêm chỗ điền "Biển số xe" vào tờ Đơn đặt hàng (Sales Order), bạn chỉ cần làm thao tác cực kỳ đơn giản:

  1. Mở màn hình Đơn đặt hàng, bấm nút Tùy chọn (Menu) và chọn Customize.
  2. Màn hình lưới cấu hình hiện ra. Bấm thêm mới một dòng.
  3. Label: Điền "Biển số xe tải".
  4. Type (Định dạng): Chọn Data (Nếu muốn nhân viên gõ chữ tự do) hoặc Select (Nếu muốn giới hạn danh sách chọn sẵn như: 29A-1234, 51C-5678).
  5. Bấm Update. Vài giây sau, ô "Biển số xe tải" đã chễm chệ xuất hiện trên màn hình Đơn đặt hàng của toàn bộ công ty!

Nếu công ty bạn đã áp dụng Phân hệ Quản trị Đội Xe (Fleet Management - Phase 5), thì việc bắt nhân viên gõ tay "Biển số xe" rất dễ dẫn đến gõ sai chính tả hoặc tự bịa ra xe ảo.

Chúng ta sẽ dùng một kỹ thuật mạnh hơn: Link Field (Trường liên kết cơ sở dữ liệu).

  • Trong lúc thiết lập Custom Field, bạn đổi Type thành Link.
  • Ở ô Options, bạn gõ tên bảng dữ liệu là Vehicle (Tức là danh mục Xe cộ của công ty).

Hiệu ứng xảy ra: Lúc này, ô "Biển số xe tải" không cho gõ tự do nữa. Nó trở thành một thanh tìm kiếm (Search bar). Nhân viên gõ số "29", hệ thống lập tức chui vào kho dữ liệu của phòng Vận tải, lôi ra chiếc xe "29A-123.45" để nhân viên click chọn. Điều này đảm bảo Tính toàn vẹn dữ liệu (Data Integrity) hoàn hảo 100%.

3. Trang Trí Giao Diện Bằng Section & Column Break​

Nếu bạn cứ thêm vài chục Custom Field vào một màn hình, nó sẽ dài ngoằn ngoèo từ trên xuống dưới trông rất khủng khiếp.

ERPNext cung cấp 2 công cụ để "xây nhà" cho giao diện:

  • Section Break (Cắt phần): Dùng để tạo ra một ô khối lớn nằm ngang, có tiêu đề rành mạch. Ví dụ bạn tạo Section Break "THÔNG TIN GIAO HÀNG", rồi mới nhét ô Biển số xe, ô Tên tài xế vào bên dưới nó.
  • Column Break (Cắt cột): Dùng để chia đôi màn hình. Một nửa bên trái ghi Biển số xe, nửa bên phải ghi Tên tài xế. Giúp tận dụng không gian màn hình siêu rộng của máy tính.

Chỉ bằng những cú click chuột kéo thả, bạn có thể biến hóa ERPNext ôm trọn mọi quy trình đặc thù "oái oăm" nhất của doanh nghiệp mà không cần nhờ đến bất kỳ lập trình viên nào.