Quadro Kanban
Um quadro kanban com arrastar e soltar para gerenciamento de projetos e acompanhamento de tarefas. Suporta múltiplas colunas com cabeçalhos coloridos, cartões arrastáveis com rótulos, responsáveis e datas de vencimento. Inclui arraste entre colunas, limite de WIP, emblemas de contagem de cartões e colunas colapsáveis.
Pré-visualização e Código
_kanban_board.html.erb
███
██████ █████ █████████
█████████
████████ █████ ██ ██████ ██████ ████ █████
█████████
█████████████████ ███████ ███ █████ ███ ██████ ████ █ ██████████
████████████ ███████ ██ ██████ ██████ ███████████████ █████████ ██████
██████ ██████████ ███ ███████
kanban_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ██████████ ███████
██████ ██████ █ █ ███████████████ ██████ █
█████████ █
████████████████ █ ████
█
kanban_board_component.html.erb
████ ██████████ █████████████ ███ ███ ████████████████████ ██████████████ ███
██ ████████████ ██ ████████ ██
██ █████████ █ ███████████████ ██ ███████████████ ██
████ ██████████ █████████████████████████ ███
███████████████████ ███████████ ███
████████████████████████████
███ ██████ ██████ ██
████ ██████████ █████████████████████ ████
████ ███████████ ████████████ ███████
kanban_board_component.rb
█ ██████████████████████ ████
█████ ████████████████████ █ ███████████████████
█████████████ █ █
██████ █████████████████████
█████ ████████████████████
██████ █████████████████████
███████ ██████████████████████
████ ███████████████████
███████ █████████████████████
kanban_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ ██████████ ███████
██████ ██████ █ █ ███████████████ ██████ █
█████████ █
████████████████ █ ████
█
Changelog
- v1.0.0: Initial release
- Cross-column drag and drop via HTML Drag & Drop API
- WIP limit enforcement with visual warning
- Card count badges per column
- Collapsible columns
- Color-coded column headers
- Card labels, assignees, and due dates
- Dispatches kanban:move and kanban:card-click events
Obter Acesso Completo
Desbloqueie o código-fonte deste componente e de todos os outros. Pagamento único para acesso vitalício.
Obter Acesso Agora