[skywalking-rocketbot-ui] branch master updated: fix: update table style (#460)

[wu...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

wusheng pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/skywalking-rocketbot-ui.git


The following commit(s) were added to refs/heads/master by this push:
     new 10d6e5e  fix: update table style (#460)
10d6e5e is described below

commit 10d6e5e47363c91eb67d88be688ea365e1ea558f
Author: Qiuxia Fan <fi...@outlook.com>
AuthorDate: Tue Apr 6 14:08:30 2021 +0800

    fix: update table style (#460)
---
 src/views/components/dashboard/charts/chart-table.vue | 9 ++++++++-
 src/views/components/dashboard/dashboard-item.vue     | 2 +-
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/views/components/dashboard/charts/chart-table.vue b/src/views/components/dashboard/charts/chart-table.vue
index 856880b..c03e24c 100644
--- a/src/views/components/dashboard/charts/chart-table.vue
+++ b/src/views/components/dashboard/charts/chart-table.vue
@@ -16,7 +16,7 @@ limitations under the License. -->
 <template>
   <div class="rk-chart-table">
     <div ref="chartTable">
-      <div class="row flex-h" :style="`width: ${nameWidth + initWidth}px`">
+      <div class="row header flex-h" :style="`width: ${nameWidth + initWidth}px`">
         <div class="name" :style="`width: ${nameWidth}px`">
           {{ item.tableHeaderCol1 || $t('name') }}
           <i class="r cp" ref="draggerName"><rk-icon icon="settings_ethernet"/></i>
@@ -91,6 +91,8 @@ limitations under the License. -->
       border-left: 1px solid #ccc;
       height: 20px;
       div {
+        overflow: hidden;
+        text-overflow: ellipsis;
         border-right: 1px solid #ccc;
         text-align: center;
         height: 20px;
@@ -107,8 +109,13 @@ limitations under the License. -->
     .row:first-child {
       div {
         border-top: 1px solid #ccc;
+        background: #eee;
       }
     }
+    .header {
+      color: #000;
+      font-weight: bold;
+    }
     .value-col {
       width: 50%;
     }
diff --git a/src/views/components/dashboard/dashboard-item.vue b/src/views/components/dashboard/dashboard-item.vue
index dabf924..c179f90 100644
--- a/src/views/components/dashboard/dashboard-item.vue
+++ b/src/views/components/dashboard/dashboard-item.vue
@@ -377,7 +377,7 @@ limitations under the License. -->
       const endP = keys.length > 1 ? 0 : 40;
       const eventNum = parseInt(String((body.offsetHeight - startP - endP) / 10), 10);
 
-      return eventNum;
+      return eventNum || 0;
     }
 
     // watch selectors and events