1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
| import { createNamespace, isDef } from '../utils';
| import Info from '../info';
|
| var _createNamespace = createNamespace('tab'),
| createComponent = _createNamespace[0],
| bem = _createNamespace[1];
|
| export 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 || isDef(this.info) && this.info !== '') {
| return h("span", {
| "class": bem('text-wrapper')
| }, [Text, h(Info, {
| "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()]);
| }
| });
|
|
