You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
102 lines
2.2 KiB
102 lines
2.2 KiB
"use strict";
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
|
|
exports.__esModule = true;
|
|
exports.default = void 0;
|
|
|
|
var _utils = require("../utils");
|
|
|
|
var _info = _interopRequireDefault(require("../info"));
|
|
|
|
var _createNamespace = (0, _utils.createNamespace)('tab'),
|
|
createComponent = _createNamespace[0],
|
|
bem = _createNamespace[1];
|
|
|
|
var _default = createComponent({
|
|
props: {
|
|
dot: Boolean,
|
|
type: String,
|
|
info: [Number, String],
|
|
color: String,
|
|
title: String,
|
|
isActive: Boolean,
|
|
disabled: Boolean,
|
|
scrollable: Boolean,
|
|
activeColor: String,
|
|
inactiveColor: String
|
|
},
|
|
computed: {
|
|
style: function style() {
|
|
var style = {};
|
|
var color = this.color,
|
|
isActive = this.isActive;
|
|
var isCard = this.type === 'card'; // card theme color
|
|
|
|
if (color && isCard) {
|
|
style.borderColor = color;
|
|
|
|
if (!this.disabled) {
|
|
if (isActive) {
|
|
style.backgroundColor = color;
|
|
} else {
|
|
style.color = color;
|
|
}
|
|
}
|
|
}
|
|
|
|
var titleColor = isActive ? this.activeColor : this.inactiveColor;
|
|
|
|
if (titleColor) {
|
|
style.color = titleColor;
|
|
}
|
|
|
|
return style;
|
|
}
|
|
},
|
|
methods: {
|
|
onClick: function onClick() {
|
|
this.$emit('click');
|
|
},
|
|
genText: function genText() {
|
|
var h = this.$createElement;
|
|
var Text = h("span", {
|
|
"class": bem('text', {
|
|
ellipsis: !this.scrollable
|
|
})
|
|
}, [this.slots() || this.title]);
|
|
|
|
if (this.dot || (0, _utils.isDef)(this.info) && this.info !== '') {
|
|
return h("span", {
|
|
"class": bem('text-wrapper')
|
|
}, [Text, h(_info.default, {
|
|
"attrs": {
|
|
"dot": this.dot,
|
|
"info": this.info
|
|
}
|
|
})]);
|
|
}
|
|
|
|
return Text;
|
|
}
|
|
},
|
|
render: function render() {
|
|
var h = arguments[0];
|
|
return h("div", {
|
|
"attrs": {
|
|
"role": "tab",
|
|
"aria-selected": this.isActive
|
|
},
|
|
"class": [bem({
|
|
active: this.isActive,
|
|
disabled: this.disabled
|
|
})],
|
|
"style": this.style,
|
|
"on": {
|
|
"click": this.onClick
|
|
}
|
|
}, [this.genText()]);
|
|
}
|
|
});
|
|
|
|
exports.default = _default; |