GUI -- Empty table now has a "no items found" row, and table width set to track window width.
Change-Id: I32d3403926fe3c3686fc0219b4880dcb15888e61
Showing
5 changed files
with
50 additions
and
23 deletions
... | @@ -30,6 +30,11 @@ table.summary-list tbody { | ... | @@ -30,6 +30,11 @@ table.summary-list tbody { |
30 | border-radius: 0 0 8px 8px; | 30 | border-radius: 0 0 8px 8px; |
31 | } | 31 | } |
32 | 32 | ||
33 | +table.summary-list td.nodata { | ||
34 | + text-align: center; | ||
35 | + font-style: italic; | ||
36 | +} | ||
37 | + | ||
33 | .light table.summary-list tr:nth-child(even) { | 38 | .light table.summary-list tr:nth-child(even) { |
34 | background-color: #ddd; | 39 | background-color: #ddd; |
35 | } | 40 | } | ... | ... |
... | @@ -167,9 +167,13 @@ | ... | @@ -167,9 +167,13 @@ |
167 | w: window.innerWidth | 167 | w: window.innerWidth |
168 | }; | 168 | }; |
169 | }, function (newVal) { | 169 | }, function (newVal) { |
170 | + var wsz = fs.windowSize(0, 30); | ||
170 | scope.windowHeight = newVal.h; | 171 | scope.windowHeight = newVal.h; |
171 | scope.windowWidth = newVal.w; | 172 | scope.windowWidth = newVal.w; |
172 | 173 | ||
174 | + // default table size in case no data elements | ||
175 | + table.style('width', wsz.width + 'px'); | ||
176 | + | ||
173 | scope.$on('LastElement', function () { | 177 | scope.$on('LastElement', function () { |
174 | // only adjust the table once it's completely loaded | 178 | // only adjust the table once it's completely loaded |
175 | fixTable(table, thead, tbody); | 179 | fixTable(table, thead, tbody); | ... | ... |
... | @@ -21,6 +21,12 @@ | ... | @@ -21,6 +21,12 @@ |
21 | </thead> | 21 | </thead> |
22 | 22 | ||
23 | <tbody> | 23 | <tbody> |
24 | + <tr ng-hide="ctrl.tableData.length"> | ||
25 | + <td class="nodata" colspan="10"> | ||
26 | + No Devices found | ||
27 | + </td> | ||
28 | + </tr> | ||
29 | + | ||
24 | <tr ng-repeat="dev in ctrl.tableData" | 30 | <tr ng-repeat="dev in ctrl.tableData" |
25 | ng-repeat-done> | 31 | ng-repeat-done> |
26 | <td class="table-icon"> | 32 | <td class="table-icon"> | ... | ... |
... | @@ -17,17 +17,23 @@ | ... | @@ -17,17 +17,23 @@ |
17 | </thead> | 17 | </thead> |
18 | 18 | ||
19 | <tbody> | 19 | <tbody> |
20 | - <tr ng-repeat="host in ctrl.tableData" | 20 | + <tr ng-hide="ctrl.tableData.length"> |
21 | - ng-repeat-done> | 21 | + <td class="nodata" colspan="6"> |
22 | - <td class="table-icon"> | 22 | + No Hosts found |
23 | - <div icon icon-id="{{host._iconid_type}}"></div> | 23 | + </td> |
24 | - </td> | 24 | + </tr> |
25 | - <td>{{host.id}}</td> | 25 | + |
26 | - <td>{{host.mac}}</td> | 26 | + <tr ng-repeat="host in ctrl.tableData" |
27 | - <td>{{host.vlan}}</td> | 27 | + ng-repeat-done> |
28 | - <td>{{host.ips}}</td> | 28 | + <td class="table-icon"> |
29 | - <td>{{host.location}}</td> | 29 | + <div icon icon-id="{{host._iconid_type}}"></div> |
30 | - </tr> | 30 | + </td> |
31 | + <td>{{host.id}}</td> | ||
32 | + <td>{{host.mac}}</td> | ||
33 | + <td>{{host.vlan}}</td> | ||
34 | + <td>{{host.ips}}</td> | ||
35 | + <td>{{host.location}}</td> | ||
36 | + </tr> | ||
31 | </tbody> | 37 | </tbody> |
32 | </table> | 38 | </table> |
33 | 39 | ... | ... |
... | @@ -31,18 +31,24 @@ | ... | @@ -31,18 +31,24 @@ |
31 | </thead> | 31 | </thead> |
32 | 32 | ||
33 | <tbody> | 33 | <tbody> |
34 | - <tr ng-repeat-start="intent in ctrl.tableData"> | 34 | + <tr ng-hide="ctrl.tableData.length"> |
35 | - <td>{{intent.appId}}</td> | 35 | + <td class="nodata" colspan="4"> |
36 | - <td>{{intent.key}}</td> | 36 | + No Intents found |
37 | - <td>{{intent.type}}</td> | 37 | + </td> |
38 | - <td>{{intent.priority}}</td> | 38 | + </tr> |
39 | - </tr> | 39 | + |
40 | - <tr> | 40 | + <tr ng-repeat-start="intent in ctrl.tableData"> |
41 | - <td class="resources" colspan="4">{{intent.resources}}</td> | 41 | + <td>{{intent.appId}}</td> |
42 | - </tr> | 42 | + <td>{{intent.key}}</td> |
43 | - <tr ng-repeat-end ng-repeat-done> | 43 | + <td>{{intent.type}}</td> |
44 | - <td class="details" colspan="4">{{intent.details}}</td> | 44 | + <td>{{intent.priority}}</td> |
45 | - </tr> | 45 | + </tr> |
46 | + <tr> | ||
47 | + <td class="resources" colspan="4">{{intent.resources}}</td> | ||
48 | + </tr> | ||
49 | + <tr ng-repeat-end ng-repeat-done> | ||
50 | + <td class="details" colspan="4">{{intent.details}}</td> | ||
51 | + </tr> | ||
46 | </tbody> | 52 | </tbody> |
47 | </table> | 53 | </table> |
48 | 54 | ... | ... |
-
Please register or login to post a comment