menu add global setting #5592
This commit is contained in:
parent
3679837be4
commit
d082f8ccc9
3 changed files with 53 additions and 5 deletions
|
@ -2,7 +2,7 @@
|
|||
<li :class="classes" @mouseenter="handleMouseenter" @mouseleave="handleMouseleave">
|
||||
<div :class="[prefixCls + '-submenu-title']" ref="reference" @click.stop="handleClick" :style="titleStyle">
|
||||
<slot name="title"></slot>
|
||||
<Icon type="ios-arrow-down" :class="[prefixCls + '-submenu-title-icon']"></Icon>
|
||||
<Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" :class="[prefixCls + '-submenu-title-icon']" />
|
||||
</div>
|
||||
<collapse-transition v-if="mode === 'vertical'">
|
||||
<ul :class="[prefixCls]" v-show="opened"><slot></slot></ul>
|
||||
|
@ -75,6 +75,41 @@
|
|||
return this.hasParentSubmenu && this.mode !== 'horizontal' ? {
|
||||
paddingLeft: 43 + (this.parentSubmenuNum - 1) * 24 + 'px'
|
||||
} : {};
|
||||
},
|
||||
// 3.4.0, global setting customArrow 有值时,arrow 赋值空
|
||||
arrowType () {
|
||||
let type = 'ios-arrow-down';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.menu.customArrow) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.menu.arrow) {
|
||||
type = this.$IVIEW.menu.arrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
customArrowType () {
|
||||
let type = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.menu.customArrow) {
|
||||
type = this.$IVIEW.menu.customArrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
arrowSize () {
|
||||
let size = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.menu.arrowSize) {
|
||||
size = this.$IVIEW.menu.arrowSize;
|
||||
}
|
||||
}
|
||||
return size;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
|
@ -178,6 +178,11 @@ const install = function(Vue, opts = {}) {
|
|||
arrow: opts.cell ? opts.cell.arrow ? opts.cell.arrow : '' : '',
|
||||
customArrow: opts.cell ? opts.cell.customArrow ? opts.cell.customArrow : '' : '',
|
||||
arrowSize: opts.cell ? opts.cell.arrowSize ? opts.cell.arrowSize : '' : ''
|
||||
},
|
||||
menu: {
|
||||
arrow: opts.menu ? opts.menu.arrow ? opts.menu.arrow : '' : '',
|
||||
customArrow: opts.menu ? opts.menu.customArrow ? opts.menu.customArrow : '' : '',
|
||||
arrowSize: opts.menu ? opts.menu.arrowSize ? opts.menu.arrowSize : '' : ''
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
@ -160,16 +160,24 @@
|
|||
}
|
||||
|
||||
&-vertical &-submenu-title-icon{
|
||||
float: right;
|
||||
position: relative;
|
||||
top: 4px;
|
||||
// #5592 支持自定义图标 size 后,换一种位置
|
||||
//float: right;
|
||||
//position: relative;
|
||||
//top: 4px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 24px;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
&-submenu-title-icon {
|
||||
transition: transform @transition-time @ease-in-out;
|
||||
}
|
||||
&-opened > * > &-submenu-title-icon{
|
||||
&-horizontal &-opened > * > &-submenu-title-icon{
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
&-vertical &-opened > * > &-submenu-title-icon{
|
||||
transform: translateY(-50%) rotate(180deg);
|
||||
}
|
||||
|
||||
&-vertical &-submenu{
|
||||
&-nested{
|
||||
|
|
Loading…
Add table
Reference in a new issue