app/demo/components/tables.pom
require_relative '../helpers/indented_grid'
Voom::Presenters.define(:tables) do
helpers Demo::Helpers::IndentedGrid
attach :top_nav
attach :component_drawer
page_title 'Tables'
helpers do
def items
[
OpenStruct.new(id: 1, material: 'Acrylic (Transparent)', quantity: 50, price: '$2.90'),
OpenStruct.new(id: 2, material: 'Plywood (Birch)', quantity: 10, price: '$1.25'),
OpenStruct.new(id: 3, material: 'Laminate (Gold on Blue)', quantity: 50, price: '$2.35')
]
end
def drivers
[
OpenStruct.new(name: 'Kimi Räikkönen', team: 'Scuderia Ferrari', country: 'Finland'),
OpenStruct.new(name: 'Daniel Ricciardo', team: 'Red Bull', country: 'Australia'),
OpenStruct.new(name: 'Lewis Hamilton', team: 'Mercedes', country: 'Great Britain'),
OpenStruct.new(name: 'Fernando Alonso', team: 'Mclaren', country: 'Spain'),
OpenStruct.new(name: 'Charles LeClerc', team: 'Sauber', country: 'Monaco')
]
end
end
indented_grid do
content padding: :bottom3 do
title 'Non-Selectable'
table do
header do
column 'Name'
column 'Team'
column 'Country'
end
drivers.each do |driver|
row do
column driver.name
column driver.team
column driver.country
end
end
pagination page_size: 5,
total: drivers.count,
current_page: context.fetch(:page) { 1 },
replace_id: 'drivers',
replace_presenter: 'drivers_presenter'
end
end
content padding: [:top3, :bottom3] do
title 'Headerless Table'
table do
drivers.each do |driver|
row do
column driver.name
column driver.team
column driver.country
end
end
end
end
grid padding: :top3 do
column 6 do
form do
title 'Selectable (with form)'
content padding: :bottom2 do
table selectable: true do
header do
column 'Material'
column 'Quantity'
column 'Unit price'
end
items.each do |item|
row name: :id, value: item.id do
column item.material
column item.quantity
column item.price
end
end
end
end
button 'SUBMIT', type: :raised do
event :click do
replaces :context_list, :context_list
end
end
end
end
column 6 do
attach :context_list
end
end
grid wide: true do
column 12 do
title 'Wide (scrollable)', id: :scrollable
table do
header do
(1..18).each do |idx|
column "Column #{idx}"
end
end
items.each do |item|
row do
(1..6).each do
column item.material
column item.quantity
column item.price
end
end
end
end
end
end
attach :code, file: __FILE__
end
end