From 5c2055d1134ec7a8bd31ecfeaeb8ab7efe6306c8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=8E=E6=9D=A8?= <1711467488@qq.com>
Date: Sat, 17 Feb 2018 22:30:49 +0800
Subject: [PATCH] no message

Former-commit-id: 34bfc333be64a3f8f774f49a571be0db887098b1
Former-commit-id: 31b3d27fe5719fea3583f80f1498cd19b214b644
Former-commit-id: 1e07d94e6e1a349f538703ea6a5b04b2b65d1ac6
---
 src/components/charts/G2/mixins/G2.js           | 17 ++++++++++-------
 .../chart/index/components/ChartCardHeader.vue  | 14 ++++++++++++++
 src/pages/demo/chart/index/index.vue            | 10 +++-------
 src/utils/sleep.js                              |  7 +++++++
 4 files changed, 34 insertions(+), 14 deletions(-)
 create mode 100644 src/utils/sleep.js

diff --git a/src/components/charts/G2/mixins/G2.js b/src/components/charts/G2/mixins/G2.js
index 9f08dcd7..7ae75418 100644
--- a/src/components/charts/G2/mixins/G2.js
+++ b/src/components/charts/G2/mixins/G2.js
@@ -7,6 +7,9 @@ import propsChart from './props/chart'
 // 扩展属性
 import propsD2 from './props/d2'
 
+// 工具
+import sleep from '@/utils/sleep.js'
+
 // 关闭 G2 的体验改进计划打点请求
 G2.track(false)
 
@@ -27,15 +30,15 @@ export default {
       chart: null
     }
   },
-  mounted () {
+  async mounted () {
     // 如果设置了在 mounted 后自动初始化 就在这里初始化
     if (this.autoInit) {
-      // 可以设置延时初始化 默认时间为 0
-      setTimeout(() => {
-        this.$nextTick(() => {
-          this.init()
-        })
-      }, this.autoInitDelay)
+      // 延时
+      await sleep(this.autoInitDelay)
+      // 初始化
+      this.$nextTick(() => {
+        this.init()
+      })
     }
   },
   watch: {
diff --git a/src/pages/demo/chart/index/components/ChartCardHeader.vue b/src/pages/demo/chart/index/components/ChartCardHeader.vue
index a05c708f..b6f4ada9 100644
--- a/src/pages/demo/chart/index/components/ChartCardHeader.vue
+++ b/src/pages/demo/chart/index/components/ChartCardHeader.vue
@@ -4,6 +4,7 @@
     <span class="dd-fr">
       <Icon
         class="chart-card-header-icon"
+        :class="{active}"
         name="refresh"
         @click.native="handleRefresh">
       </Icon>
@@ -20,8 +21,17 @@ export default {
       default: ''
     }
   },
+  data () {
+    return {
+      active: false
+    }
+  },
   methods: {
     handleRefresh () {
+      this.active = true
+      setTimeout(() => {
+        this.active = false
+      }, 1000)
       this.$emit('refresh')
     }
   }
@@ -32,6 +42,10 @@ export default {
 @import '~@/assets/style/public.scss';
 .chart-card-header-icon {
   color: $color-text-sub;
+  transition: all .3s;
+  &.active {
+    transform: rotate(360deg);
+  }
 }
 </style>
 
diff --git a/src/pages/demo/chart/index/index.vue b/src/pages/demo/chart/index/index.vue
index 3a84892c..d221537f 100644
--- a/src/pages/demo/chart/index/index.vue
+++ b/src/pages/demo/chart/index/index.vue
@@ -68,12 +68,6 @@ export default {
           })
         }))
     },
-    // 更新指定的图表
-    chartResize (name) {
-      this.$nextTick(() => {
-        this.$refs[name].resize()
-      })
-    },
     // 布局组件发生变化
     layoutUpdatedHandler (newLayout) {
       console.group('layoutUpdatedHandler')
@@ -84,7 +78,9 @@ export default {
     },
     // 改变尺寸完成
     handleResized (name) {
-      this.chartResize(name)
+      this.$nextTick(() => {
+        this.$refs[name].resize()
+      })
     },
     // 用户触发了卡片右上角的刷新按钮
     handleRefreshData (index) {
diff --git a/src/utils/sleep.js b/src/utils/sleep.js
new file mode 100644
index 00000000..d1a97d2f
--- /dev/null
+++ b/src/utils/sleep.js
@@ -0,0 +1,7 @@
+export default async (time = 0) => {
+  return new Promise((resolve, reject) => {
+    setTimeout(() => {
+      resolve()
+    }, time)
+  })
+}