From 658537f15552c487a88b4b4f3d4f10d666e0e741 Mon Sep 17 00:00:00 2001
From: jiaming743 <743192023@qq.com>
Date: Thu, 4 Jul 2019 17:11:54 +0800
Subject: [PATCH] Enhanced style compatibility.

---
 src/components/charts/src/main.vue      |  6 ++++--
 src/components/scrollBoard/src/main.vue | 21 ++++++++++-----------
 2 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/src/components/charts/src/main.vue b/src/components/charts/src/main.vue
index a8349a8..80e3773 100644
--- a/src/components/charts/src/main.vue
+++ b/src/components/charts/src/main.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="dv-charts-container" :ref="ref">
-    <div class="charts" :ref="chartRef" />
+    <div class="charts-canvas-container" :ref="chartRef" />
   </div>
 </template>
 
@@ -30,6 +30,8 @@ export default {
     option () {
       let { chart, option } = this
 
+      if (!chart) return
+
       if (!option) option = {}
 
       chart.setOption(option)
@@ -67,7 +69,7 @@ export default {
   width: 100%;
   height: 100%;
 
-  .charts {
+  .charts-canvas-container {
     width: 100%;
     height: 100%;
   }
diff --git a/src/components/scrollBoard/src/main.vue b/src/components/scrollBoard/src/main.vue
index be6d0bb..be584c7 100644
--- a/src/components/scrollBoard/src/main.vue
+++ b/src/components/scrollBoard/src/main.vue
@@ -1,12 +1,11 @@
 <template>
   <div class="dv-scroll-board" :ref="ref">
-    <div class="header" v-if="header.length && mergedConfig">
+    <div class="header" v-if="header.length && mergedConfig" :style="`background-color: ${mergedConfig.headerBGC};`">
       <div
         class="header-item"
         v-for="(headerItem, i) in header"
         :key="headerItem + i"
         :style="`
-          background-color: ${mergedConfig.headerBGC};
           height: ${mergedConfig.headerHeight}px;
           line-height: ${mergedConfig.headerHeight}px;
           width: ${widths[i]}px;
@@ -19,7 +18,7 @@
     <div
       v-if="mergedConfig"
       class="rows"
-      :style="`height: calc(100% - ${header.length ? mergedConfig.headerHeight : 0}px);`"
+      :style="`height: ${height - (header.length ? mergedConfig.headerHeight : 0)}px;`"
     >
       <div
         class="row-item"
@@ -357,20 +356,20 @@ export default {
 </script>
 
 <style lang="less">
-.text {
-  padding: 0 10px;
-  box-sizing: border-box;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
 .dv-scroll-board {
   position: relative;
   width: 100%;
   height: 100%;
   color: #fff;
 
+  .text {
+    padding: 0 10px;
+    box-sizing: border-box;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }  
+
   .header {
     display: flex;
     flex-direction: row;