Mercurial > hg > thermostat-ng > web-client

changeset 155:abae7ebe2fee

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Use accordion for system information in system-info component Review-thread: http://icedtea.classpath.org/pipermail/thermostat/2017-August/024544.html Reviewed-by: aazores
author Jie Kang <jkang@redhat.com>
date Wed, 16 Aug 2017 09:29:14 -0400
parents 6159ca4b057d
children ed60038d7827
files src/app/components/system-info/en.locale.yaml src/app/components/system-info/system-info.html
diffstat 2 files changed, 45 insertions(+), 32 deletions(-) [+]
line wrap: on
line diff
--- a/src/app/components/system-info/en.locale.yaml	Tue Aug 15 09:45:04 2017 -0400
+++ b/src/app/components/system-info/en.locale.yaml	Wed Aug 16 09:29:14 2017 -0400
@@ -5,6 +5,7 @@
   ERR_MESSAGE: Error while retrieving system information.
 
   table:
+    HEADER: System Information
     KEY_COLUMN_LABEL: Key
     VALUE_COLUMN_LABEL: Value
 
--- a/src/app/components/system-info/system-info.html	Tue Aug 15 09:45:04 2017 -0400
+++ b/src/app/components/system-info/system-info.html	Wed Aug 16 09:29:14 2017 -0400
@@ -9,38 +9,50 @@
 
   <div ng-show="!ctrl.showErr">
     <div class="row">
-      <div class="col-xs-12 col-lg-8">
-        <table class="table table-striped table-bordered">
-          <thead>
-            <tr>
-              <th translate>systemInfo.table.KEY_COLUMN_LABEL</th>
-              <th translate>systemInfo.table.VALUE_COLUMN_LABEL</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr>
-              <td translate>systemInfo.table.HOSTNAME</td>
-              <td>{{ctrl.systemInfo.hostname}}</td>
-            </tr>
-            <tr>
-              <td translate>systemInfo.table.OS</td>
-              <td>{{ctrl.systemInfo.osName}}</td>
-            </tr>
-            <tr>
-              <td translate>systemInfo.table.KERNEL</td>
-              <td>{{ctrl.systemInfo.osKernel}}</td>
-            </tr>
-            <tr>
-              <td translate>systemInfo.table.CPU</td>
-              <td translate="systemInfo.table.CPU_MODEL_FMT"
-                  translate-values="{ model: ctrl.systemInfo.cpuModel, coreCount: ctrl.systemInfo.cpuCount }"></td>
-            </tr>
-            <tr>
-              <td translate>systemInfo.table.MEMORY</td>
-              <td>{{ctrl.systemInfo.totalMemory | formatBytes}}</td>
-            </tr>
-          </tbody>
-        </table>
+      <div class="col-xs-12 col-lg-12">
+        <div class="panel-group" id="accordion-markup">
+          <div class="panel panel-default">
+            <div class="panel-heading">
+              <h4 class="panel-title">
+                <a data-toggle="collapse" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne" translate>systemInfo.table.HEADER</a>
+              </h4>
+            </div>
+            <div id="collapseOne" class="panel-collapse collapse in">
+              <ul class="list-group">
+                <table class="table table-fixed table-striped table-bordered">
+                  <thead>
+                    <tr>
+                      <th translate>systemInfo.table.KEY_COLUMN_LABEL</th>
+                      <th translate>systemInfo.table.VALUE_COLUMN_LABEL</th>
+                    </tr>
+                  </thead>
+                  <tbody class="break-word-wrap">
+                    <tr>
+                      <td translate>systemInfo.table.HOSTNAME</td>
+                      <td>{{ctrl.systemInfo.hostname}}</td>
+                    </tr>
+                    <tr>
+                      <td translate>systemInfo.table.OS</td>
+                      <td>{{ctrl.systemInfo.osName}}</td>
+                    </tr>
+                    <tr>
+                      <td translate>systemInfo.table.KERNEL</td>
+                      <td>{{ctrl.systemInfo.osKernel}}</td>
+                    </tr>
+                    <tr>
+                      <td translate>systemInfo.table.CPU</td>
+                      <td translate="systemInfo.table.CPU_MODEL_FMT" translate-values="{ model: ctrl.systemInfo.cpuModel, coreCount: ctrl.systemInfo.cpuCount }"></td>
+                    </tr>
+                    <tr>
+                      <td translate>systemInfo.table.MEMORY</td>
+                      <td>{{ctrl.systemInfo.totalMemory | formatBytes}}</td>
+                    </tr>
+                  </tbody>
+                </table>
+              </ul>
+            </div>
+          </div>
+        </div>
       </div>
     </div>