fixes #4453 #4480 #4462

src/components/base/notification/notification.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="classes" :style="styles">
+    <div :class="classes" :style="wrapStyles">
         <Notice
             v-for="notice in notices"
             :key="notice.name"
@@ -21,6 +21,8 @@
 <script>
     import Notice from './notice.vue';
 
+    import { transferIndex, transferIncrease } from '../../../utils/transfer-queue';
+
     const prefixCls = 'ivu-notification';
     let seed = 0;
     const now = Date.now();
@@ -54,7 +56,8 @@
         },
         data () {
             return {
-                notices: []
+                notices: [],
+                tIndex: this.handleGetIndex()
             };
         },
         computed: {
@@ -65,6 +68,12 @@
                         [`${this.className}`]: !!this.className
                     }
                 ];
+            },
+            wrapStyles () {
+                let styles = Object.assign({}, this.styles);
+                styles['z-index'] = 1010 + this.tIndex;
+
+                return styles;
             }
         },
         methods: {
@@ -82,6 +91,7 @@
                 }, notice);
 
                 this.notices.push(_notice);
+                this.tIndex = this.handleGetIndex();
             },
             close (name) {
                 const notices = this.notices;
@@ -94,7 +104,11 @@
             },
             closeAll () {
                 this.notices = [];
-            }
+            },
+            handleGetIndex () {
+                transferIncrease();
+                return transferIndex;
+            },
         }
     };
 </script>

src/components/base/popper.js

@@ -60,6 +60,7 @@ export default {
         },
         visible(val) {
             if (val) {
+                this.handleIndexIncrease();  // just use for Poptip
                 this.updatePopper();
                 this.$emit('on-popper-show');
             } else {