mirror of
https://github.com/Hopiu/vue-material.git
synced 2026-03-16 22:10:27 +00:00
Merge pull request #847 from valdaph/develop-enhancements
Small enhancements
This commit is contained in:
commit
909c879738
4 changed files with 13 additions and 6 deletions
|
|
@ -57,9 +57,5 @@
|
|||
color: #{'BACKGROUND-CONTRAST-0.38'};
|
||||
}
|
||||
}
|
||||
|
||||
.md-icon:not(.md-icon-delete):after {
|
||||
background: #{'BACKGROUND-COLOR'};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -68,7 +68,7 @@
|
|||
initSort() {
|
||||
if (this.hasMatchSort()) {
|
||||
this.sorted = true;
|
||||
this.sortType = this.parentTable.sortType;
|
||||
this.sortType = this.parentTable.sortType || 'asc';
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@
|
|||
id: [String, Number],
|
||||
mdLabel: [String, Number],
|
||||
mdIcon: String,
|
||||
mdIconset: String,
|
||||
mdActive: Boolean,
|
||||
mdDisabled: Boolean,
|
||||
mdOptions: {
|
||||
|
|
@ -47,6 +48,9 @@
|
|||
mdIcon() {
|
||||
this.updateTabData();
|
||||
},
|
||||
mdIconset() {
|
||||
this.updateTabData();
|
||||
},
|
||||
mdOptions: {
|
||||
deep: true,
|
||||
handler() {
|
||||
|
|
@ -80,6 +84,7 @@
|
|||
id: this.tabId,
|
||||
label: this.mdLabel,
|
||||
icon: this.mdIcon,
|
||||
iconset: this.mdIconset,
|
||||
options: this.mdOptions,
|
||||
active: this.mdActive,
|
||||
disabled: this.mdDisabled,
|
||||
|
|
|
|||
|
|
@ -13,9 +13,13 @@
|
|||
@click="setActiveTab(header)"
|
||||
ref="tabHeader">
|
||||
<md-ink-ripple :md-disabled="header.disabled"></md-ink-ripple>
|
||||
|
||||
<div class="md-tab-header-container">
|
||||
<md-icon v-if="header.icon">{{ header.icon }}</md-icon>
|
||||
<md-icon v-else-if="header.iconset" :md-iconset="header.iconset">{{ header.icon }}</md-icon>
|
||||
|
||||
<span v-if="header.label">{{ header.label }}</span>
|
||||
|
||||
<md-tooltip v-if="header.tooltip" :md-direction="header.tooltipDirection" :md-delay="header.tooltipDelay">{{ header.tooltip }}</md-tooltip>
|
||||
</div>
|
||||
</button>
|
||||
|
|
@ -23,9 +27,11 @@
|
|||
<span class="md-tab-indicator" :class="indicatorClasses" ref="indicator"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button v-if="mdNavigation && hasNavigationScroll" @click="navigationScrollLeft" class="md-tab-header-navigation-button md-left" :class="navigationLeftButtonClasses">
|
||||
<md-icon>keyboard_arrow_left</md-icon>
|
||||
</button>
|
||||
|
||||
<button v-if="mdNavigation && hasNavigationScroll" @click="navigationScrollRight" class="md-tab-header-navigation-button md-right" :class="navigationRightButtonClasses">
|
||||
<md-icon>keyboard_arrow_right</md-icon>
|
||||
</button>
|
||||
|
|
@ -251,7 +257,7 @@
|
|||
this.hasNavigationScroll = scrollWidth > clientWidth;
|
||||
},
|
||||
setActiveTab(tabData) {
|
||||
this.hasIcons = !!tabData.icon;
|
||||
this.hasIcons = !!tabData.icon || !!tabData.iconset;
|
||||
this.hasLabel = !!tabData.label;
|
||||
this.activeTab = tabData.id;
|
||||
this.activeTabNumber = this.getTabIndex(this.activeTab);
|
||||
|
|
|
|||
Loading…
Reference in a new issue