1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
|
package com.example
import com.lightningkite.kotlin.observable.list.observableListOf
import pl.treksoft.kvision.data.DataComponent
import pl.treksoft.kvision.data.DataContainer
import pl.treksoft.kvision.form.check.CHECKBOXSTYLE
import pl.treksoft.kvision.form.check.CheckBox
import pl.treksoft.kvision.html.BUTTONSTYLE
import pl.treksoft.kvision.html.Button
import pl.treksoft.kvision.panel.FLEXWRAP
import pl.treksoft.kvision.panel.HPanel
import pl.treksoft.kvision.panel.SimplePanel
import pl.treksoft.kvision.panel.VPanel
import pl.treksoft.kvision.utils.px
class DataTab : SimplePanel() {
init {
this.marginTop = 10.px()
this.minHeight = 400.px()
val panel = VPanel(spacing = 5)
class DataModel(checked: Boolean, text: String) : DataComponent() {
var checked: Boolean by obs(checked)
var text: String by obs(text)
}
val list = observableListOf(
DataModel(false, "January"),
DataModel(false, "February"),
DataModel(false, "March"),
DataModel(false, "April"),
DataModel(false, "May"),
DataModel(false, "June"),
DataModel(false, "July"),
DataModel(false, "August"),
DataModel(false, "September"),
DataModel(false, "October"),
DataModel(false, "November")
)
val dataContainer = DataContainer(list, { index ->
CheckBox(
value = list[index].checked,
label = if (list[index].checked) "<b>${list[index].text}</b>" else "${list[index].text}"
).apply {
rich = true
style = CHECKBOXSTYLE.PRIMARY
onClick {
list[index].checked = this.value
}
}
}, child = HPanel(spacing = 10, wrap = FLEXWRAP.WRAP))
panel.add(dataContainer)
val butPanel = HPanel(spacing = 10, wrap = FLEXWRAP.WRAP)
butPanel.add(Button("Add December", style = BUTTONSTYLE.SUCCESS).onClick {
list.add(DataModel(true, "December"))
})
butPanel.add(Button("Check all", style = BUTTONSTYLE.INFO).onClick {
list.forEach { it.checked = true }
})
butPanel.add(Button("Uncheck all", style = BUTTONSTYLE.INFO).onClick {
list.forEach { it.checked = false }
})
butPanel.add(Button("Reverse list", style = BUTTONSTYLE.DANGER).onClick {
list.reverse()
})
butPanel.add(Button("Remove checked", style = BUTTONSTYLE.DANGER).onClick {
list.filter { it.checked }.forEach { list.remove(it) }
})
panel.add(butPanel)
this.add(panel)
}
}
|
