Bảng

Bảng đơn giản

Rộng hơn phòng

Bảng có hành động

Hàng kẻ sọc, phát sáng dưới con trỏ

Các hàng có thể được đánh dấu

Một ô ở đầu mỗi hàng, một ở tiêu đề cho tất cả, và các hành động ở trên: chúng gửi các hàng đã được đánh dấu đến địa chỉ riêng của chúng, và không thể chạm tới khi không có gì được đánh dấu.

Tệp, tổng số, một hành động trên mỗi hàng

Đường dẫn được đọc theo tên của chúng, các thư mục trước đó bị cắt từ đầu. Thanh kết thúc ở số hàng có, và một hành động được đánh dấu là `all` hoạt động với không có gì được đánh dấu — nó lấy mọi hàng, và dẫn thanh khi đó là thứ mong đợi.

Bộ lọc

Một thanh bộ lọc ở đầu bảng, một menu kín đáo cho mỗi, cho biết điều gì sẽ được thu hẹp một khi nó thực hiện. Trên máy chủ, chúng sống trong truy vấn của trang — mỗi lựa chọn là một liên kết — và bộ điều khiển thu hẹp các hàng từ đó; trong vue, chúng là một giá trị được đưa cho trang cho api của nó, hoặc được áp dụng bởi bảng cho các hàng mà nó đã có. Mỗi lựa chọn là một hộp — tròn cho một lựa chọn duy nhất — có màu sắc theo tông của nó khi nó có một, một trạng thái hoặc một danh mục.

Sắp xếp

Một tiêu đề sắp xếp là một liên kết trên máy chủ và một nút trong vue: tăng dần, giảm dần, sau đó quay lại thứ tự mà trang đã khai báo, mà danh sách mở ra và mũi tên của nó cho thấy từ đầu. Ngày trống được xếp sau cùng cả hai chiều, và tên được so sánh theo cách mà ngôn ngữ sắp xếp chúng. Ở đây bảng sắp xếp các hàng mà nó được cung cấp; một bộ điều khiển phân trang danh sách của nó đọc cùng một truy vấn thay thế.

Sắp xếp trong trình duyệt, từ twig

`vue: true` truyền cùng các cột và hàng đến bản sao vue: nó sắp xếp và tìm kiếm toàn bộ danh sách trong trình duyệt, không có tải trang. Đối với một danh sách mà trang giữ nguyên — một danh sách ngắn, hoặc một danh sách mà không có api phục vụ.

Hành động trong một lựa chọn

Cùng thanh đó khi có đủ hành động để chen chúc: một được chọn, sau đó được áp dụng.

Ô liên kết và biểu tượng

Trạng thái đang tải

Trạng thái trống

Căn chỉnh cột

Mã, số và tổng

`cell: 'code'` đặt một định danh trong kiểu chữ đơn; `cell: 'number'`, hoặc một `unit`, viết một con số theo ngôn ngữ địa phương của trang. `negative: true` vẽ một con số dưới không trong tông màu lỗi, dấu trừ của nó cũng báo hiệu điều đó. `totals` là một hàng mà trang chuyển giao, được vẽ dưới các hàng khác — bảng không cộng dồn gì, giữ một trang hoặc một danh sách đã lọc. Được vẽ bởi máy chủ, sau đó bởi vue.

Từ markdown

Một bảng viết bằng markdown và được truyền qua `markdown_ds`: các cột, căn chỉnh của chúng và đánh dấu của mỗi ô được đọc từ tài liệu, và bảng được vẽ ở đây giống như bất kỳ bảng nào khác. `markdown` giữ nguyên `<table>`, cho bất kỳ thứ gì không phải là trang — một email, một nguồn cấp.

Nhóm hàng

Một hàng chỉ mang một nhóm không phải là một hàng: nó là đường giữa hai nhóm, được cho một từ. Nó trải dài qua bảng và đặt tên cho những gì theo sau — cùng cách đọc như một bộ phân cách menu.

Ô trạng thái

Một trạng thái là một vòng tròn, không bao giờ là một màu sắc do ai đó chọn: ô nhận một tên loại, hoặc một loại với số lượng và tiêu đề, và vẽ biểu tượng trạng thái mà phần còn lại của hệ thống vẽ. Không có gì để định dạng trong trang.

Tiêu đề dính

Một bảng dài được đọc theo cột cũng như theo hàng. Với `sticky`, tiêu đề giữ nguyên trong tầm nhìn trong khi các hàng cuộn bên dưới; một trang có thứ gì đó được ghim ở trên cùng cho biết cách xuống trong `--table-sticky-top`.

Một bảng trong khu vực riêng của nó

Một khu vực `zone--table` được dành cho toàn bộ bảng: những gì điều khiển nó ở trên, các trang của nó ở dưới, ra khỏi những gì cuộn, và giữa chúng là mặt đất của bảng xuống đáy khu vực, ngay cả với ba hàng. Bất kỳ bảng nào cũng có thể đặt vào đó, được viết bởi máy chủ hoặc bởi một vue. Với `natural`, như cái ở bên trái, bảng giữ chiều rộng của các cột, không kéo dài cũng không bị nén.

Bảng thực thể Vue

Bảng Vue có lựa chọn

Cùng hợp đồng trên phía khách hàng: các khóa đã được đánh dấu quay trở lại qua v-model:selected, mỗi hành động được phát ra như một hành động hàng loạt, và một với địa chỉ được gửi như bảng máy chủ gửi nó. Những cái này không có, vì vậy dòng bên dưới cho biết điều gì sẽ được thực hiện. Ba hàng một trang, tổng số ở cuối thanh, và Lưu trữ tất cả không cần gì được đánh dấu.

Phân trang không có tổng số

Khi API không trả về tổng số, bộ phân trang quay lại trước/sau.

Phân trang, được tạo bởi máy chủ

`pagination(page, pages_count)` vẽ các trang của danh sách dưới dạng liên kết: mỗi liên kết giữ nguyên đường dẫn và truy vấn của trang mà nó đang nằm — một tìm kiếm, một sắp xếp — và chỉ thay đổi `page`, được tính từ 1. Các số hiển thị là của trình phân trang vue: trang đầu, trang cuối, trang hiện tại và các trang lân cận. `compact` giữ trang trước và sau quanh số trang; `route` và `params` chuyển qua một địa chỉ khác.

Bộ định dạng ngày Vue