'Static code module
#IgnoreWarnings:12
Sub Process_Globals
'this is the name of the page
Public name As String = "tables11"
Public title As String = "Table Functionality"
Public icon As String = "fa-solid fa-swatchbook"
'this variable holds the page controller
Public page As SDUIPage
'this variable holds reference to the app
'usually for constants and other things
Public app As SDUIApp
'the variable referencing banano lib
Private banano As BANano 'ignore
Private tb4 As SDUITable
Private tblPos As Int
Private tb12 As SDUITable
Private srowcount As String
private summary As Map
End Sub
'sub to show the page
Sub Show(duiapp As SDUIApp) 'ignore
'initialize the page
'this clears the 'pageview'
page.AddPage(Me, name)
page.Root.p(6)
'get the reference to the app
app = duiapp
app.PagePause
banano.Await(app.UsesFormToJSON)
banano.Await(app.UsesTable)
'build the page, via code or loadlayouts
'
BuildPage
app.PageResume
End Sub
Sub getName As String
Return name
End Sub
Sub getIcon As String
Return icon
End Sub
Sub getTitle As String
Return title
End Sub
'start building the page
private Sub BuildPage
'set the page container to be in design mode
'this shows the row/column grid lines
page.Root.DesignMode(False)
'center the page container
page.Root.MXAuto
'add 5 rows, each having 2 columns, each spanning 6
page.Root.AddRows10.AddColumns12
'build the grid
page.Root.BuildGrid
'start adding you components here
Build_Table5
Table5Code
End Sub
Sub Table5Code
' Dim c5 As SDUIMockupCode = page.Cell(2, 1).AddMockUpCode("c5", "vb")
' c5.AddCode($"Sub Build_Table5"$)
' c5.AddCode($"tb4 = page.Cell(1, 1).AddTableListView("tb4")"$)
' c5.AddCode($"tb4.AddColumnAvatarTitleSubTitle("avatar", "Employee", "4rem", "name", "country", app.MASK_HEXAGON)"$)
' c5.AddCode($"tb4.AddColumnToggle("on", "On/Off", "success", False)"$)
' c5.AddCode($"'"$)
' c5.AddCode($"banano.Await(tb4.SetItems(Items)) 'or SetItemsPaginate"$)
' c5.AddCode($"End Sub"$)
' c5.AddCode($"'"$)
' c5.AddCode($"Private Sub tb4_ChangeRow (Row As Int, Value As Object, Column As String, item As Map)"$)
' c5.AddCode($"Log(Row)"$)
' c5.AddCode($"Log(Value)"$)
' c5.AddCode($"Log(Column)"$)
' c5.AddCode($"Log(item)"$)
' c5.AddCode($"End Sub"$)
' c5.AddCode($"'"$)
' c5.AddCode($"Private Sub tb4_RowClick (Row As Int, item As Map)"$)
' c5.AddCode($"Dim sid As String = item.Get("id")"$)
' c5.AddCode($"app.ShowSwal(sid)"$)
' c5.AddCode($"End Sub"$)
' c5.Refresh
End Sub
Sub Build_Table5
tb4 = page.Cell(1, 1).AddTableCard("tb11")
tb4.Title = "Employees"
tb4.Search = True
tb4.SearchSize = app.SIZE_XS
tb4.ItemsPerPage = 10
tb4.ToolbarActions = True
tb4.ButtonsOutlined = False
tb4.ButtonSize = app.SIZE_XS
tb4.BadgesSize = app.SIZE_XS
tb4.BadgesOutlined = False
tb4.HasAddNew = True
tb4.HasDeleteAll = True
tb4.HasRefresh = True
tb4.AddToolbarActionButtonIcon("active", "fa-solid fa-check", app.COLOR_INDIGO)
tb4.Pagination = True
tb4.Compact
'
banano.Await(tb4.LoadJSON("./assets/employees.json"))
'apply background colors
ApplyZebraRows
'
tb12 = page.Cell(3, 1).AddTableCard("tb12")
tb12.Title = "Employees"
tb12.Search = True
tb12.SearchSize = app.SIZE_XS
tb12.ItemsPerPage = 10
tb12.ToolbarActions = True
tb12.ButtonsOutlined = False
tb12.ButtonSize = app.SIZE_XS
tb12.BadgesSize = app.SIZE_XS
tb12.BadgesOutlined = False
tb12.HasAddNew = True
tb12.HasDeleteAll = True
tb12.HasRefresh = True
tb12.Pagination = True
tb12.Compact
'show borders around cells
tb12.GridLines = True
'set the header background color
tb12.SetHeaderBackgroundColor("#E9544E")
'set the header text color
tb12.SetHeaderTextColor("#ffffff")
'set the footer background color
tb12.SetFooterBackgroundColor("#651F3F")
'set the color of the footer
tb12.SetFooterTextColor("#ffffff")
'
banano.Await(tb12.LoadJSON("./assets/employees.json"))
'tb12.BodyFontFamily = "Verdana, Geneva, Tahoma, sans-serif"
tb12.HeaderFontSize = "12px"
tb12.BodyFontSize = "10px"
tb12.FooterFontSize = "12px"
'merge the footer columns to the first column
tb12.SetFooterColumnsMerge(Array("first_name","last_name","email","phone","gender","age","job_title"))
'add totals to table
summary = tb12.SetFooterTotalSumCountColumns(Array("years_of_experience", "salary"))
srowcount = summary.Get("rowcount")
srowcount = SDUIShared.Thousands(srowcount)
ApplyTableStyling
End Sub
Sub ApplyTableStyling
tb12.SetFooterColumn("first_name", $"Total (${srowcount})"$)
tb12.SetFooterColumn("salary", SDUIShared.NiceMoney(summary.Get("salary")))
tb12.SetFooterColumn("years_of_experience", SDUIShared.Thousands(summary.Get("years_of_experience")))
'change the font-size of the first row
tb12.SetRowStyle(0, CreateMap("font-size": "14px"))
tb12.SetRowStyle(1, CreateMap("font-style": "italic"))
tb12.SetRowStyle(2, CreateMap("font-weight": "bold"))
'right align columns
tb12.SetColumnAlign("years_of_experience", "r")
tb12.SetColumnAlign("salary", "r")
tb12.SetColumnAlign("gender", "c")
'decrease cell padding
tb12.SetCellPadding("0px", "", "0px", "")
tb12.SetRowColumnStyle("first_name", 5, CreateMap("font-size": "8px"))
tb12.SetRowColumnStyle("last_name", 6, CreateMap("font-family": "Verdana, Geneva, Tahoma, sans-serif"))
tb12.SetColumnStyle("age", CreateMap("background-color":"green"))
End Sub
Private Sub tb12_PrevPage (e As BANanoEvent)
e.PreventDefault
ApplyTableStyling
End Sub
Private Sub tb12_NextPage (e As BANanoEvent)
e.PreventDefault
ApplyTableStyling
End Sub
Private Sub tb11_RowClick (Row As Int, item As Map)
Dim sid As String = item.Get("id")
app.ShowSwal(sid)
End Sub
Private Sub tb11_PrevPage (e As BANanoEvent)
e.PreventDefault
ApplyZebraRows
End Sub
Private Sub tb11_NextPage (e As BANanoEvent)
e.PreventDefault
ApplyZebraRows
End Sub
Sub ApplyZebraRows
'we have 10 items per page
tb4.SetRowBackgroundColor(0, "#E9544E")
tb4.SetRowTextColor(0, "#ffffff")
tb4.SetRowBackgroundColor(1, "#F09D65")
tb4.SetRowBackgroundColor(2, "#FFD364")
tb4.SetRowBackgroundColor(3, "#2AA876")
tb4.SetRowTextColor(3, "#ffffff")
tb4.SetRowBackgroundColor(4, "#E7E7EA")
tb4.SetRowBackgroundColor(5, "#F7ABB7")
tb4.SetRowBackgroundColor(6, "#025B97")
tb4.SetRowTextColor(6, "#ffffff")
tb4.SetRowBackgroundColor(7, "#6496B0")
tb4.SetRowTextColor(7, "#ffffff")
tb4.SetRowBackgroundColor(8, "#651F3F")
tb4.SetRowTextColor(8, "#ffffff")
tb4.SetRowBackgroundColor(9, "#34A69C")
tb4.SetRowTextColor(9, "#ffffff")
End Sub
www.b4x.com
