From bf4eb7c3e70d18e612b627d9856eb9756df22e8d Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@buaa.edu.cn>
Date: Mon, 20 Aug 2018 21:24:57 +0800
Subject: [PATCH] [Improvement] add overlay component (#442)

---
 packages/overlay/index.js   | 12 +++++++++---
 packages/overlay/index.json |  5 ++++-
 packages/overlay/index.pcss |  7 +++++++
 packages/overlay/index.wxml |  9 +++++----
 packages/toast/index.json   |  1 +
 packages/toast/index.pcss   |  9 ---------
 packages/toast/index.wxml   |  6 +++---
 7 files changed, 29 insertions(+), 20 deletions(-)

diff --git a/packages/overlay/index.js b/packages/overlay/index.js
index e2a08dc3..67f32cfc 100644
--- a/packages/overlay/index.js
+++ b/packages/overlay/index.js
@@ -1,11 +1,17 @@
 Component({
   properties: {
-    show: Boolean
+    show: Boolean,
+    mask: Boolean,
+    customStyle: String,
+    zIndex: {
+      type: Number,
+      value: 1
+    }
   },
 
   methods: {
-    onClickOverlay() {
-
+    onClick() {
+      this.triggerEvent('click');
     }
   }
 });
diff --git a/packages/overlay/index.json b/packages/overlay/index.json
index 467ce294..c14a65f6 100644
--- a/packages/overlay/index.json
+++ b/packages/overlay/index.json
@@ -1,3 +1,6 @@
 {
-  "component": true
+  "component": true,
+  "usingComponents": {
+    "van-transition": "../transition/index"
+  }
 }
diff --git a/packages/overlay/index.pcss b/packages/overlay/index.pcss
index e69de29b..1802ade9 100644
--- a/packages/overlay/index.pcss
+++ b/packages/overlay/index.pcss
@@ -0,0 +1,7 @@
+.van-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
diff --git a/packages/overlay/index.wxml b/packages/overlay/index.wxml
index bf46ec1c..c1630662 100644
--- a/packages/overlay/index.wxml
+++ b/packages/overlay/index.wxml
@@ -1,5 +1,6 @@
-<view
-  class="overlay-class van-popup__overlay {{ show ? 'van-popup--show' : '' }}"
-  style="{{ overlayStyle }}"
-  bind:tap="onClickOverlay"
+<van-transition
+  show="{{ show }}"
+  custom-class="van-overlay"
+  custom-style="z-index: {{ zIndex }}; {{ mask ? 'background-color: rgba(0, 0, 0, .7);' : '' }}; {{ customStyle }}"
+  bind:tap="onClick"
 />
diff --git a/packages/toast/index.json b/packages/toast/index.json
index d75305d7..9b1b78c4 100644
--- a/packages/toast/index.json
+++ b/packages/toast/index.json
@@ -3,6 +3,7 @@
   "usingComponents": {
     "van-icon": "../icon/index",
     "van-loading": "../loading/index",
+    "van-overlay": "../overlay/index",
     "van-transition": "../transition/index"
   }
 }
diff --git a/packages/toast/index.pcss b/packages/toast/index.pcss
index bce8258e..c6463d4d 100644
--- a/packages/toast/index.pcss
+++ b/packages/toast/index.pcss
@@ -21,15 +21,6 @@
     transform: translate(-50%, -50%);
   }
 
-  &__overlay {
-    z-index: 3000;
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-  }
-
   &--text {
     padding: 12px;
     min-width: 220px;
diff --git a/packages/toast/index.wxml b/packages/toast/index.wxml
index 52be4ff2..2587219b 100644
--- a/packages/toast/index.wxml
+++ b/packages/toast/index.wxml
@@ -1,7 +1,7 @@
-<van-transition
+<van-overlay
   show="{{ show && (mask || forbidClick) }}"
-  custom-class="van-toast__overlay"
-  custom-style="{{ mask ? 'background-color: rgba(0, 0, 0, .7);' : '' }}"
+  mask="{{ mask }}"
+  z-index="3000"
 />
 <van-transition
   show="{{ show }}"