index.wxs
2.0 KB
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
/* eslint-disable */
var utils = require('../wxs/utils.wxs');
var style = require('../wxs/style.wxs');
function tabClass(active, ellipsis) {
var classes = ['tab-class'];
if (active) {
classes.push('tab-active-class');
}
if (ellipsis) {
classes.push('van-ellipsis');
}
return classes.join(' ');
}
function tabStyle(data) {
var titleColor = data.active
? data.titleActiveColor
: data.titleInactiveColor;
var ellipsis = data.scrollable && data.ellipsis;
// card theme color
if (data.type === 'card') {
return style({
'border-color': data.color,
'background-color': !data.disabled && data.active ? data.color : null,
color: titleColor || (!data.disabled && !data.active ? data.color : null),
'flex-basis': ellipsis ? 88 / data.swipeThreshold + '%' : null,
});
}
return style({
color: titleColor,
'flex-basis': ellipsis ? 88 / data.swipeThreshold + '%' : null,
});
}
function navStyle(color, type) {
return style({
'border-color': type === 'card' && color ? color : null,
});
}
function trackStyle(data) {
if (!data.animated) {
return '';
}
return style({
left: -100 * data.currentIndex + '%',
'transition-duration': data.duration + 's',
'-webkit-transition-duration': data.duration + 's',
});
}
function lineStyle(data) {
return style({
width: utils.addUnit(data.lineWidth),
transform: 'translateX(' + data.lineOffsetLeft + 'px)',
'-webkit-transform': 'translateX(' + data.lineOffsetLeft + 'px)',
'background-color': data.color,
height: data.lineHeight !== -1 ? utils.addUnit(data.lineHeight) : null,
'border-radius':
data.lineHeight !== -1 ? utils.addUnit(data.lineHeight) : null,
'transition-duration': !data.skipTransition ? data.duration + 's' : null,
'-webkit-transition-duration': !data.skipTransition
? data.duration + 's'
: null,
});
}
module.exports = {
tabClass: tabClass,
tabStyle: tabStyle,
trackStyle: trackStyle,
lineStyle: lineStyle,
navStyle: navStyle,
};