Merge pull request #142 from Leopoldthecoder/master

add padding-right when popup shows

examples/docs/message-box.md

@@ -9,15 +9,19 @@
         this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
           type: 'warning'
         }).then(() => {
-          this.$message({
-            message: '删除成功!',
-            type: 'success'
-          });
+          setTimeout(() => {
+            this.$message({
+              message: '删除成功!',
+              type: 'success'
+            });
+          }, 200);
         }).catch(() => {
-          this.$message({
-            message: '已取消删除',
-            type: 'info'
-          });          
+          setTimeout(() => {
+            this.$message({
+              message: '已取消删除',
+              type: 'info'
+            });  
+          }, 200);
         });
       },
 
@@ -26,15 +30,19 @@
           inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
           inputErrorMessage: '邮箱格式不正确'
         }).then(({ value }) => {
-          this.$message({
-            type: 'success',
-            message: '你的邮箱是: ' + value
-          });
+          setTimeout(() => {
+            this.$message({
+              type: 'success',
+              message: '你的邮箱是: ' + value
+            });
+          }, 200);
         }).catch(() => {
-          this.$message({
-            type: 'info',
-            message: '取消输入'
-          });       
+          setTimeout(() => {
+            this.$message({
+              type: 'info',
+              message: '取消输入'
+            });
+          }, 200);
         });
       },
 
@@ -45,10 +53,12 @@
           message: '这是一段内容, 这是一段内容, 这是一段内容, 这是一段内容, 这是一段内容, 这是一段内容, 这是一段内容',
           showCancelButton: true
         }).then(action => {
-          this.$message({
-            type: 'info',
-            message: 'action: ' + action
-          });
+          setTimeout(() => {
+            this.$message({
+              type: 'info',
+              message: 'action: ' + action
+            });
+          }, 200);
         });
       }
 

package.json

@@ -71,7 +71,7 @@
     "vue": "^2.0.0-rc.6",
     "vue-loader": "^9.4.2",
     "vue-markdown-loader": "^0.5.1",
-    "vue-popup": "^0.2.4",
+    "vue-popup": "^0.2.5",
     "vue-router": "^2.0.0-beta.2",
     "webpack": "^1.13.2",
     "webpack-dev-server": "^1.15.1",

packages/dialog/package.json

@@ -12,6 +12,6 @@
   "author": "elemefe",
   "license": "MIT",
   "devDependencies": {
-    "vue-popup": "^0.2.4"
+    "vue-popup": "^0.2.5"
   }
 }

packages/message-box/package.json

@@ -12,6 +12,6 @@
   "author": "elemefe",
   "license": "MIT",
   "dependencies": {
-    "vue-popup": "^0.2.4"
+    "vue-popup": "^0.2.5"
   }
 }

packages/message-box/src/main.js

@@ -7,6 +7,7 @@ var defaults = {
   type: '',
   showInput: false,
   showClose: true,
+  modalFade: true,
   closeOnClickModal: true,
   inputValue: null,
   inputPlaceholder: '',

packages/message-box/src/main.vue

@@ -79,9 +79,14 @@
 
         this.onClose && this.onClose();
 
-        if (this.modal && this.bodyOverflow !== 'hidden') {
-          document.body.style.overflow = this.bodyOverflow;
-        }
+        setTimeout(() => {
+          if (this.modal && this.bodyOverflow !== 'hidden') {
+            document.body.style.overflow = this.bodyOverflow;
+            document.body.style.paddingRight = this.bodyPaddingRight;
+          }
+          this.bodyOverflow = null;
+          this.bodyPaddingRight = null;
+        }, 200);
         this.opened = false;
 
         if (!this.transition) {