Cài đặt và sử dụng

Kích hoạt plugin

Plugin @digiforce-nc/plugin-field-advanced thường được bật sẵn. Nếu chưa có, vào Settings → Plugin Manager và bật plugin lên — không cần cấu hình server.

Thêm field Number với pretty format

1. Mở collection cần chỉnh sửa trong Collection Manager.
2. Thêm field mới, chọn loại Number.
3. Trong phần Field interface, chọn inputNumber (mở rộng bởi plugin).
4. Cấu hình thuộc tính:

Thuộc tính	Mô tả	Ví dụ
precision	Số chữ số thập phân	2
step	Bước nhảy khi tăng/giảm	0.01
addonAfter	Đơn vị hiển thị sau số	VND, USD
stringMode	Dùng string để tránh mất precision với số lớn	true

Kết quả: giá trị 1500000 sẽ hiển thị thành 1,500,000 VND trên giao diện.

const priceField = {
  name: 'price',
  type: 'double',
  interface: 'inputNumber',
  uiSchema: {
    'x-component': 'InputNumber',
    'x-component-props': {
      stringMode: true,
      step: '0.01',
      addonAfter: 'VND',
    },
  },
};

Thêm field Percent

1. Thêm field mới → chọn interface percent.
2. Field tự động nhân 100 khi hiển thị và chia 100 khi lưu (giá trị trong DB luôn là số thập phân, ví dụ 0.75 hiển thị là 75%).
3. Tùy chọn hiển thị progress bar hoặc badge trong phần settings.

Tùy chọn	Mô tả
Hiển thị progress bar	Thanh tiến trình trực quan bên cạnh giá trị
Precision	Số chữ số thập phân cho phần trăm
Min / Max	Giới hạn giá trị nhập

Hiển thị field dưới dạng QR Code

1. Thêm field (string hoặc URL) → chọn interface displayAsQR.
2. Khi có giá trị, giao diện tự động render thành hình ảnh QR code.
3. Cấu hình trong settings:

Tùy chọn	Mô tả	Mặc định
QR size	Kích thước hình QR (px)	128
Error correction	Mức sửa lỗi (L/M/Q/H)	M
Foreground color	Màu mã QR	#000000

Ứng dụng: hiển thị URL sản phẩm, mã nhân viên, link thanh toán dưới dạng QR để quét nhanh bằng điện thoại.

Tùy chỉnh Input / Textarea / URL

Plugin cũng mở rộng settings cho các field cơ bản:

Field	Tùy chọn bổ sung
input	Max length, placeholder, prefix/suffix
textarea	Rows, max length, auto resize
url	Validate định dạng URL, mở link trong tab mới

Lưu ý

• Plugin này hoàn toàn client-only — không tạo migration hay thay đổi cấu trúc DB.
• Giá trị trong database vẫn là kiểu số/chuỗi gốc, chỉ khác cách hiển thị trên giao diện.
• Pretty format phụ thuộc locale của trình duyệt (dấu phẩy hoặc dấu chấm ngăn cách hàng nghìn).