statistic：Optimize the code logic and adjust the style

ElemeFE · Dec 6, 2022 · e512f8b · e512f8b
1 parent d9322b6
commit e512f8b
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 32 deletions.
diff --git a/packages/statistic/src/main.vue b/packages/statistic/src/main.vue
@@ -47,7 +47,7 @@ export default {
     },
     precision: {
       type: Number,
-      default: 0
+      default: null
     },
     value: {
       type: [String, Number],
@@ -139,7 +139,6 @@ export default {
           clearInterval(this.timeTask);
           this.timeTask = null;
         }
-
       } else {
         this.branch();
       }

diff --git a/packages/theme-chalk/src/statistic.scss b/packages/theme-chalk/src/statistic.scss
@@ -2,36 +2,37 @@
 @import "common/var";
 
 @include b(statistic) {
-    width: 100%;
-    box-sizing: border-box;
-    margin: 0;
-    padding: 0;
-    color: $--color-black;
-    font-size: 14px;
-    font-variant: tabular-nums;
-    line-height: 1.5715;
-    list-style: none;
-    font-feature-settings: "tnum";
- text-align: center;
-    .head {
-        margin-bottom: 4px;
-        color: #00000073;
-        font-size: 14px;
+  $statistic-justify: center;
+  $statistic-align: center;
+  width: 100%;
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: $--color-black;
+  font-variant: tabular-nums;
+  list-style: none;
+  font-feature-settings: "tnum";
+  text-align: center;
+  .head {
+    margin-bottom: 4px;
+    color: $--color-text-regular;
+    font-size: $--font-size-small;
+  }
 
+  .con {
+    font-family: Sans-serif;
+    display: flex;
+    justify-content: $statistic-justify;
+    align-items: $statistic-align;
+    color: $--color-text-primary;
+    .number {
+      font-size: $--font-size-extra-large;
+      padding: 0 4px;
     }
-
-    .con{
-        font-family: Sans-serif;
-        display: flex;
-        justify-content :center;
-        align-items: center  ;
-        .number{
-            font-size: 20px;
-            padding: 0 4px;
-        }
-        span{  display: inline-block;
-              margin: 0;
-            line-height: 100%;
-        }
+    span {
+      display: inline-block;
+      margin: 0;
+      line-height: 100%;
     }
-}
+  }
+}