This commit is contained in:
梁灏 2018-09-10 16:10:35 +08:00
parent 16c2b8d26e
commit 7bafe9d94c
15 changed files with 230 additions and 27 deletions

View file

@ -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>

View file

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

View file

@ -26,6 +26,7 @@
:class="{ [prefixCls + '-transfer']: transfer }"
ref="drop"
:data-transfer="transfer"
:transfer="transfer"
v-transfer-dom>
<div>
<Caspanel

View file

@ -40,6 +40,7 @@
ref="drop"
:placement="placement"
:data-transfer="transfer"
:transfer="transfer"
:class="dropClasses"
>
<transition name="fade">

View file

@ -39,6 +39,7 @@
:placement="placement"
ref="drop"
:data-transfer="transfer"
:transfer="transfer"
v-transfer-dom>
<div>
<component

View file

@ -14,6 +14,7 @@
@mouseenter.native="handleMouseenter"
@mouseleave.native="handleMouseleave"
:data-transfer="transfer"
:transfer="transfer"
v-transfer-dom><slot name="list"></slot></Drop>
</transition>
</div>

View file

@ -40,7 +40,7 @@
import { on, off } from '../../utils/dom';
import { findComponentsDownward } from '../../utils/assist';
import { modalIndex, modalIncrease } from './q';
import { transferIndex as modalIndex, transferIncrease as modalIncrease } from '../../utils/transfer-queue';
const prefixCls = 'ivu-modal';
@ -325,7 +325,9 @@
return modalIndex;
},
handleClickModal () {
this.modalIndex = this.handleGetModalIndex();
if (this.draggable) {
this.modalIndex = this.handleGetModalIndex();
}
}
},
mounted () {

View file

@ -1,7 +0,0 @@
let modalIndex = 0;
function modalIncrease() {
modalIndex++;
}
export {modalIndex, modalIncrease};

View file

@ -52,6 +52,7 @@
import {directive as clickOutside} from 'v-click-outside-x';
import TransferDom from '../../directives/transfer-dom';
import { oneOf } from '../../utils/assist';
import { transferIndex, transferIncrease } from '../../utils/transfer-queue';
import Locale from '../../mixins/locale';
const prefixCls = 'ivu-poptip';
@ -118,6 +119,7 @@
showTitle: true,
isInput: false,
disableCloseUnderTransfer: false, // transfer slot
tIndex: this.handleGetIndex()
};
},
computed: {
@ -144,6 +146,9 @@
if (this.width) {
style.width = `${this.width}px`;
}
if (this.transfer) style['z-index'] = 1060 + this.tIndex;
return style;
},
localeOkText () {
@ -172,7 +177,7 @@
const styles = {};
if (this.padding !== '') styles['padding'] = this.padding;
return styles;
}
},
},
methods: {
handleClick () {
@ -254,6 +259,13 @@
}
return $children;
},
handleGetIndex () {
transferIncrease();
return transferIndex;
},
handleIndexIncrease () {
this.tIndex = this.handleGetIndex();
}
},
mounted () {

View file

@ -7,6 +7,8 @@
import { getStyle } from '../../utils/assist';
const Popper = isServer ? function() {} : require('popper.js/dist/umd/popper.js'); // eslint-disable-line
import { transferIndex, transferIncrease } from '../../utils/transfer-queue';
export default {
name: 'Drop',
props: {
@ -16,19 +18,26 @@
},
className: {
type: String
},
transfer: {
type: Boolean
}
},
data () {
return {
popper: null,
width: '',
popperStatus: false
popperStatus: false,
tIndex: this.handleGetIndex()
};
},
computed: {
styles () {
let style = {};
if (this.width) style.minWidth = `${this.width}px`;
if (this.transfer) style['z-index'] = 1060 + this.tIndex;
return style;
}
},
@ -66,6 +75,7 @@
if (this.$parent.$options.name === 'iSelect') {
this.width = parseInt(getStyle(this.$parent.$el, 'width'));
}
this.tIndex = this.handleGetIndex();
},
destroy () {
if (this.popper) {
@ -89,7 +99,11 @@
if(!leftOrRight){
this.popper.popper.style.transformOrigin = placementStart==='bottom' || ( placementStart !== 'top' && placementEnd === 'start') ? 'center top' : 'center bottom';
}
}
},
handleGetIndex () {
transferIncrease();
return transferIndex;
},
},
created () {
this.$on('on-update-popper', this.update);

View file

@ -54,6 +54,7 @@
:placement="placement"
ref="dropdown"
:data-transfer="transfer"
:transfer="transfer"
v-transfer-dom
>
<ul v-show="showNotFoundLabel" :class="[prefixCls + '-not-found']"><li>{{ localeNotFoundText }}</li></ul>

View file

@ -1,6 +1,15 @@
import Vue from 'vue';
import Spin from './spin.vue';
import { transferIndex, transferIncrease } from '../../utils/transfer-queue';
function handleGetIndex() {
transferIncrease();
return transferIndex;
}
let tIndex = handleGetIndex();
Spin.newInstance = properties => {
const _props = properties || {};
@ -27,7 +36,10 @@ Spin.newInstance = properties => {
});
}
return h('div', {
'class': 'ivu-spin-fullscreen ivu-spin-fullscreen-wrapper'
'class': 'ivu-spin-fullscreen ivu-spin-fullscreen-wrapper',
'style': {
'z-index': 2010 + tIndex
}
}, [vnode]);
}
});
@ -39,6 +51,7 @@ Spin.newInstance = properties => {
return {
show () {
spin.visible = true;
tIndex = handleGetIndex();
},
remove (cb) {
spin.visible = false;

View file

@ -6,6 +6,7 @@
<transition name="fade">
<div
:class="[prefixCls + '-popper', prefixCls + '-' + theme]"
:style="dropStyles"
ref="popper"
v-show="!disabled && (visible || always)"
@mouseenter="handleShowPopper"
@ -24,6 +25,7 @@
import Popper from '../base/popper';
import TransferDom from '../../directives/transfer-dom';
import { oneOf } from '../../utils/assist';
import { transferIndex, transferIncrease } from '../../utils/transfer-queue';
const prefixCls = 'ivu-tooltip';
@ -76,7 +78,8 @@
},
data () {
return {
prefixCls: prefixCls
prefixCls: prefixCls,
tIndex: this.handleGetIndex()
};
},
computed: {
@ -92,6 +95,12 @@
[`${prefixCls}-inner-with-width`]: !!this.maxWidth
}
];
},
dropStyles () {
let styles = {};
if (this.transfer) styles['z-index'] = 1060 + this.tIndex;
return styles;
}
},
watch: {
@ -105,6 +114,7 @@
this.timeout = setTimeout(() => {
this.visible = true;
}, this.delay);
this.tIndex = this.handleGetIndex();
},
handleClosePopper() {
if (this.timeout) {
@ -115,7 +125,11 @@
}, 100);
}
}
}
},
handleGetIndex () {
transferIncrease();
return transferIndex;
},
},
mounted () {
if (this.always) {

View file

@ -0,0 +1,7 @@
let transferIndex = 0;
function transferIncrease() {
transferIndex++;
}
export {transferIndex, transferIncrease};