Changes for page CHOPlist

Last modified by Marco Weber on 2026/10/05 15:41

From version 18.1
edited by Marco Weber
on 2026/10/01 12:40
Change comment: Update LiveTable
To version 40.1
edited by Marco Weber
on 2026/10/05 15:20
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -1,25 +1,205 @@
1 -{{velocity}}
2 -#set ($columnsProperties = {
3 - 'code': {},
4 - 'text_de': {},
5 - 'text_fr': {},
6 - 'text_it': {},
7 - 'valid_start': {"html":true},
8 - 'valid_end': {"html":true},
9 - 'chop_like': {},
10 - 'treat_cat': {},
11 - 'topo_group': {},
12 - 'chcr_only': {}
13 -})
14 -#set ($options = {
15 - 'className': 'CHOPlist.Code.CHOPlistClass',
16 - 'translationPrefix': 'choplist.livetable.',
17 - 'tagCloud': true,
18 - 'rowCount': 15,
19 - 'maxPages': 10,
20 - 'selectedColumn': 'code',
21 - 'defaultOrder': 'asc'
22 -})
23 -#set ($columns = ['code', 'text_de', 'text_fr', 'text_it', 'valid_start', 'valid_end', 'chop_like', 'treat_cat', 'topo_group', 'chcr_only'])
24 -#livetable('choplist' $columns $columnsProperties $options)
25 -{{/velocity}}
1 +{{html clean="false"}}
2 +<style>
3 +
4 +/* =========================================================
5 + CHOP LiveData – Tabellenformatierung
6 + ========================================================= */
7 +
8 +/* Gesamte Tabelle */
9 +table.layout-table-root.responsive-table {
10 + width: 100%;
11 + border-collapse: collapse;
12 + table-layout: fixed;
13 +}
14 +
15 +/* =========================================================
16 + Kopfzeile
17 + ========================================================= */
18 +
19 +table.layout-table-root.responsive-table thead th {
20 + font-weight: bold;
21 + font-size: 1.0em;
22 + background-color: #00BFFF;
23 + border: 1px solid #999;
24 + padding: 7px 6px;
25 + vertical-align: middle;
26 +}
27 +
28 +/* Eigentliche Spaltenbezeichnung */
29 +table.layout-table-root.responsive-table thead .property-name {
30 + font-weight: bold;
31 +}
32 +
33 +/* Sortier-Button nicht unnötig hervorheben */
34 +table.layout-table-root.responsive-table thead .handle {
35 + font-weight: bold;
36 +}
37 +
38 +/* =========================================================
39 + Filterzeile
40 + ========================================================= */
41 +
42 +table.layout-table-root.responsive-table thead tr.column-filters th {
43 + background-color: #fafafa;
44 + border: 1px solid #bbb;
45 + padding: 4px 5px;
46 +}
47 +
48 +/* Filter-Eingabefelder */
49 +table.layout-table-root.responsive-table .livedata-filter {
50 + width: 100%;
51 + box-sizing: border-box;
52 +}
53 +
54 +table.layout-table-root.responsive-table .filter-text,
55 +table.layout-table-root.responsive-table .filter-date {
56 + width: 100%;
57 + box-sizing: border-box;
58 + min-height: 28px;
59 +}
60 +
61 +/* Selectize-Filter */
62 +table.layout-table-root.responsive-table .selectize-control {
63 + width: 100%;
64 +}
65 +
66 +table.layout-table-root.responsive-table .selectize-input {
67 + min-height: 28px;
68 + padding: 4px 6px;
69 + box-sizing: border-box;
70 +}
71 +
72 +/* =========================================================
73 + Datenzellen
74 + ========================================================= */
75 +
76 +table.layout-table-root.responsive-table tbody td {
77 + border: 1px solid #bbb;
78 + padding: 6px 6px;
79 + vertical-align: top;
80 + overflow-wrap: break-word;
81 + word-wrap: break-word;
82 +}
83 +
84 +/* =========================================================
85 + Spaltenbreiten
86 + ========================================================= */
87 +```text
88 +/* =========================================================
89 + Spaltenbreiten
90 + Reihenfolge:
91 + 1 code
92 + 2 text_de
93 + 3 text_fr
94 + 4 text_it
95 + 5 valid_start
96 + 6 valid_end
97 + 7 chop_like
98 + 8 treat_cat
99 + 9 topo_group
100 + 10 chcr_only
101 + ========================================================= */
102 +
103 +table.layout-table-root.responsive-table th:nth-child(1),
104 +table.layout-table-root.responsive-table td:nth-child(1) {
105 + width: 5%;
106 +}
107 +
108 +table.layout-table-root.responsive-table th:nth-child(2),
109 +table.layout-table-root.responsive-table td:nth-child(2) {
110 + width: 19%;
111 +}
112 +
113 +table.layout-table-root.responsive-table th:nth-child(3),
114 +table.layout-table-root.responsive-table td:nth-child(3) {
115 + width: 19%;
116 +}
117 +
118 +table.layout-table-root.responsive-table th:nth-child(4),
119 +table.layout-table-root.responsive-table td:nth-child(4) {
120 + width: 19%;
121 +}
122 +
123 +table.layout-table-root.responsive-table th:nth-child(5),
124 +table.layout-table-root.responsive-table td:nth-child(5) {
125 + width: 5%;
126 +}
127 +
128 +table.layout-table-root.responsive-table th:nth-child(6),
129 +table.layout-table-root.responsive-table td:nth-child(6) {
130 + width: 5%;
131 +}
132 +
133 +table.layout-table-root.responsive-table th:nth-child(7),
134 +table.layout-table-root.responsive-table td:nth-child(7) {
135 + width: 7%;
136 +}
137 +
138 +table.layout-table-root.responsive-table th:nth-child(8),
139 +table.layout-table-root.responsive-table td:nth-child(8) {
140 + width: 7%;
141 +}
142 +
143 +table.layout-table-root.responsive-table th:nth-child(9),
144 +table.layout-table-root.responsive-table td:nth-child(9) {
145 + width: 7%;
146 +}
147 +
148 +table.layout-table-root.responsive-table th:nth-child(10),
149 +table.layout-table-root.responsive-table td:nth-child(10) {
150 + width: 7%;
151 +}
152 +
153 +/* =========================================================
154 + Ausrichtung
155 + ========================================================= */
156 +
157 +/* Code */
158 +table.layout-table-root.responsive-table td[data-title="code"] {
159 + text-align: center;
160 +}
161 +
162 +/* Datumsfelder */
163 +table.layout-table-root.responsive-table td[data-title="valid_start"],
164 +table.layout-table-root.responsive-table td[data-title="valid_end"] {
165 + text-align: center;
166 + white-space: nowrap;
167 +}
168 +
169 +/* Kleine Klassifikationsfelder */
170 +table.layout-table-root.responsive-table td[data-title="chop_like"],
171 +table.layout-table-root.responsive-table td[data-title="treat_cat"],
172 +table.layout-table-root.responsive-table td[data-title="topo_group"],
173 +table.layout-table-root.responsive-table td[data-title="chcr_only"] {
174 + text-align: center;
175 +}
176 +
177 +/* =========================================================
178 + Header-Ausrichtung
179 + ========================================================= */
180 +
181 +table.layout-table-root.responsive-table th[data-title="code"],
182 +table.layout-table-root.responsive-table th[data-title="valid_start"],
183 +table.layout-table-root.responsive-table th[data-title="valid_end"],
184 +table.layout-table-root.responsive-table th[data-title="chop_like"],
185 +table.layout-table-root.responsive-table th[data-title="treat_cat"],
186 +table.layout-table-root.responsive-table th[data-title="topo_group"],
187 +table.layout-table-root.responsive-table th[data-title="chcr_only"] {
188 + text-align: center;
189 +}
190 +
191 +</style>
192 +{{/html}}
193 +
194 +{{liveData
195 + id="choplist"
196 + properties="code,text_de,text_fr,text_it,valid_start,valid_end,chop_like,treat_cat,topo_group,chcr_only"
197 + source="liveTable"
198 + sourceParameters="className=CHOPlist.Code.CHOPlistClass&translationPrefix=choplist.livetable."
199 + sort="code:asc"
200 + limit="15"
201 + layouts="table"
202 + showPageSizeDropdown="true"
203 + pageSizes="15,25,50,100"
204 +}}
205 +