mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-04-05 19:41:45 +08:00
[build] 0.5.15
This commit is contained in:
rex-zsd
parent
01ffc40686
commit
a7ae9ed17f
24
dist/datetime-picker/index.js
vendored
24
dist/datetime-picker/index.js
vendored
@ -66,23 +66,29 @@ VantComponent({
|
||||
columns: []
|
||||
},
|
||||
watch: {
|
||||
value(val) {
|
||||
value: 'updateValue',
|
||||
type: 'updateValue',
|
||||
minDate: 'updateValue',
|
||||
maxDate: 'updateValue',
|
||||
minHour: 'updateValue',
|
||||
maxHour: 'updateValue',
|
||||
minMinute: 'updateValue',
|
||||
maxMinute: 'updateValue'
|
||||
},
|
||||
methods: {
|
||||
updateValue() {
|
||||
const { data } = this;
|
||||
val = this.correctValue(val);
|
||||
const val = this.correctValue(this.data.value);
|
||||
const isEqual = val === data.innerValue;
|
||||
if (!isEqual) {
|
||||
this.updateColumnValue(val).then(() => {
|
||||
this.$emit('input', val);
|
||||
});
|
||||
}
|
||||
else {
|
||||
this.updateColumns();
|
||||
}
|
||||
},
|
||||
type: 'updateColumns',
|
||||
minHour: 'updateColumns',
|
||||
maxHour: 'updateColumns',
|
||||
minMinute: 'updateColumns',
|
||||
maxMinute: 'updateColumns'
|
||||
},
|
||||
methods: {
|
||||
getPicker() {
|
||||
if (this.picker == null) {
|
||||
const picker = (this.picker = this.selectComponent('.van-datetime-picker'));
|
||||
|
||||
2
dist/icon/index.wxss
vendored
2
dist/icon/index.wxss
vendored
File diff suppressed because one or more lines are too long
61
dist/mixins/transition.js
vendored
61
dist/mixins/transition.js
vendored
@ -5,7 +5,7 @@ const getClassNames = (name) => ({
|
||||
leave: `van-${name}-leave van-${name}-leave-active leave-class leave-active-class`,
|
||||
'leave-to': `van-${name}-leave-to van-${name}-leave-active leave-to-class leave-active-class`
|
||||
});
|
||||
const nextTick = () => new Promise(resolve => setTimeout(resolve, 1000 / 20));
|
||||
const nextTick = () => new Promise(resolve => setTimeout(resolve, 1000 / 30));
|
||||
export const transition = function (showDefaultValue) {
|
||||
return Behavior({
|
||||
properties: {
|
||||
@ -34,13 +34,13 @@ export const transition = function (showDefaultValue) {
|
||||
},
|
||||
attached() {
|
||||
if (this.data.show) {
|
||||
this.show();
|
||||
this.enter();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
observeShow(value) {
|
||||
if (value) {
|
||||
this.show();
|
||||
this.enter();
|
||||
}
|
||||
else {
|
||||
this.leave();
|
||||
@ -51,36 +51,57 @@ export const transition = function (showDefaultValue) {
|
||||
classNames: getClassNames(name)
|
||||
});
|
||||
},
|
||||
show() {
|
||||
enter() {
|
||||
const { classNames, duration } = this.data;
|
||||
const currentDuration = isObj(duration) ? duration.leave : duration;
|
||||
this.status = 'enter';
|
||||
Promise.resolve()
|
||||
.then(nextTick)
|
||||
.then(() => this.set({
|
||||
inited: true,
|
||||
display: true,
|
||||
classes: classNames.enter,
|
||||
currentDuration
|
||||
}))
|
||||
.then(() => {
|
||||
this.checkStatus('enter');
|
||||
this.set({
|
||||
inited: true,
|
||||
display: true,
|
||||
classes: classNames.enter,
|
||||
currentDuration
|
||||
});
|
||||
})
|
||||
.then(nextTick)
|
||||
.then(() => this.set({
|
||||
classes: classNames['enter-to']
|
||||
}));
|
||||
.then(() => {
|
||||
this.checkStatus('enter');
|
||||
this.set({
|
||||
classes: classNames['enter-to']
|
||||
});
|
||||
})
|
||||
.catch(() => { });
|
||||
},
|
||||
leave() {
|
||||
const { classNames, duration } = this.data;
|
||||
const currentDuration = isObj(duration) ? duration.leave : duration;
|
||||
this.status = 'leave';
|
||||
Promise.resolve()
|
||||
.then(nextTick)
|
||||
.then(() => this.set({
|
||||
classes: classNames.leave,
|
||||
currentDuration
|
||||
}))
|
||||
.then(() => {
|
||||
this.checkStatus('leave');
|
||||
this.set({
|
||||
classes: classNames.leave,
|
||||
currentDuration
|
||||
});
|
||||
})
|
||||
.then(() => setTimeout(() => this.onTransitionEnd(), currentDuration))
|
||||
.then(nextTick)
|
||||
.then(() => this.set({
|
||||
classes: classNames['leave-to']
|
||||
}));
|
||||
.then(() => {
|
||||
this.checkStatus('leave');
|
||||
this.set({
|
||||
classes: classNames['leave-to']
|
||||
});
|
||||
})
|
||||
.catch(() => { });
|
||||
},
|
||||
checkStatus(status) {
|
||||
if (status !== this.status) {
|
||||
throw new Error(`incongruent status: ${status}`);
|
||||
}
|
||||
},
|
||||
onTransitionEnd() {
|
||||
if (!this.data.show) {
|
||||
|
||||
2
dist/popup/index.wxml
vendored
2
dist/popup/index.wxml
vendored
@ -1,7 +1,7 @@
|
||||
<wxs src="../wxs/utils.wxs" module="utils" />
|
||||
|
||||
<van-overlay
|
||||
wx:if="{{ inited && overlay }}"
|
||||
wx:if="{{ overlay }}"
|
||||
mask
|
||||
show="{{ show }}"
|
||||
z-index="{{ zIndex }}"
|
||||
|
||||
43
dist/progress/index.js
vendored
43
dist/progress/index.js
vendored
@ -18,48 +18,5 @@ VantComponent({
|
||||
type: String,
|
||||
value: '#fff'
|
||||
}
|
||||
},
|
||||
data: {
|
||||
pivotWidth: 0,
|
||||
progressWidth: 0
|
||||
},
|
||||
watch: {
|
||||
pivotText: 'getWidth',
|
||||
showPivot: 'getWidth'
|
||||
},
|
||||
computed: {
|
||||
portionStyle() {
|
||||
const width = (this.data.progressWidth - this.data.pivotWidth) * this.data.percentage / 100 + 'px';
|
||||
const background = this.getCurrentColor();
|
||||
return `width: ${width}; background: ${background}; `;
|
||||
},
|
||||
pivotStyle() {
|
||||
const color = this.data.textColor;
|
||||
const background = this.data.pivotColor || this.getCurrentColor();
|
||||
return `color: ${color}; background: ${background}`;
|
||||
},
|
||||
text() {
|
||||
return this.data.pivotText || this.data.percentage + '%';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getWidth();
|
||||
},
|
||||
methods: {
|
||||
getCurrentColor() {
|
||||
return this.data.inactive ? '#cacaca' : this.data.color;
|
||||
},
|
||||
getWidth() {
|
||||
this.getRect('.van-progress').then(rect => {
|
||||
this.set({
|
||||
progressWidth: rect.width
|
||||
});
|
||||
});
|
||||
this.getRect('.van-progress__pivot').then(rect => {
|
||||
this.set({
|
||||
pivotWidth: rect.width || 0
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
12
dist/progress/index.wxml
vendored
12
dist/progress/index.wxml
vendored
@ -1,14 +1,16 @@
|
||||
<wxs src="./index.wxs" module="getters" />
|
||||
|
||||
<view class="van-progress custom-class">
|
||||
<view
|
||||
class="van-progress__portion {{ showPivot && text ? 'van-progress__portion--with-pivot' : '' }}"
|
||||
style="{{ portionStyle }}"
|
||||
class="van-progress__portion"
|
||||
style="width: {{ percentage }}%; background: {{ inactive ? '#cacaca' : color }}"
|
||||
>
|
||||
<view
|
||||
wx:if="{{ showPivot && text }}"
|
||||
style="{{ pivotStyle }}"
|
||||
wx:if="{{ showPivot && getters.text(pivotText, percentage) }}"
|
||||
style="color: {{ textColor }}; background: {{ pivotColor ? pivotColor : inactive ? '#cacaca' : color }}"
|
||||
class="van-progress__pivot"
|
||||
>
|
||||
{{ text }}
|
||||
{{ getters.text(pivotText, percentage) }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
5
dist/progress/index.wxs
vendored
Normal file
5
dist/progress/index.wxs
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
module.exports = {
|
||||
text: function(pivotText, percentage) {
|
||||
return pivotText || percentage + '%';
|
||||
}
|
||||
};
|
||||
2
dist/progress/index.wxss
vendored
2
dist/progress/index.wxss
vendored
@ -1 +1 @@
|
||||
@import '../common/index.wxss';.van-progress{height:4px;position:relative;border-radius:4px;background:#e5e5e5}.van-progress__portion{left:0;height:100%;position:absolute;border-radius:inherit}.van-progress__portion--with-pivot{border-top-right-radius:0;border-bottom-right-radius:0}.van-progress__pivot{top:50%;right:0;min-width:2em;padding:0 5px;font-size:10px;position:absolute;line-height:1.6;text-align:center;border-radius:1em;word-break:keep-all;box-sizing:border-box;background-color:#e5e5e5;-webkit-transform:translate(100%,-50%);transform:translate(100%,-50%)}
|
||||
@import '../common/index.wxss';.van-progress{position:relative;height:4px;background:#e5e5e5;border-radius:4px}.van-progress__portion{position:absolute;left:0;height:100%;border-radius:inherit}.van-progress__pivot{position:absolute;top:50%;right:0;min-width:2em;padding:0 5px;font-size:10px;line-height:1.6;text-align:center;word-break:keep-all;background-color:#e5e5e5;border-radius:1em;-webkit-transform:translateY(-50%);transform:translateY(-50%);box-sizing:border-box}
|
||||
2
dist/radio/index.wxml
vendored
2
dist/radio/index.wxml
vendored
@ -7,7 +7,7 @@
|
||||
wx:else
|
||||
name="success"
|
||||
class="{{ utils.bem('radio__icon', [shape, { disabled, checked: value === name }]) }}"
|
||||
style="{{ checkedColor && value && !disabled ? 'border-color:' + checkedColor + '; background-color:' + checkedColor : '' }}"
|
||||
style="{{ checkedColor && !disabled && value === name ? 'border-color:' + checkedColor + '; background-color:' + checkedColor : '' }}"
|
||||
custom-class="icon-class"
|
||||
custom-style="line-height: 20px;"
|
||||
/>
|
||||
|
||||
36
dist/submit-bar/index.js
vendored
36
dist/submit-bar/index.js
vendored
@ -8,10 +8,16 @@ VantComponent({
|
||||
'button-class'
|
||||
],
|
||||
props: {
|
||||
tip: null,
|
||||
tip: {
|
||||
type: null,
|
||||
observer: 'updateTip'
|
||||
},
|
||||
tipIcon: String,
|
||||
type: Number,
|
||||
price: null,
|
||||
price: {
|
||||
type: null,
|
||||
observer: 'updatePrice'
|
||||
},
|
||||
label: String,
|
||||
loading: Boolean,
|
||||
disabled: Boolean,
|
||||
@ -26,22 +32,22 @@ VantComponent({
|
||||
},
|
||||
decimalLength: {
|
||||
type: Number,
|
||||
value: 2
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
hasPrice() {
|
||||
return typeof this.data.price === 'number';
|
||||
value: 2,
|
||||
observer: 'updatePrice'
|
||||
},
|
||||
priceStr() {
|
||||
return (this.data.price / 100).toFixed(this.data.decimalLength);
|
||||
},
|
||||
tipStr() {
|
||||
const { tip } = this.data;
|
||||
return typeof tip === 'string' ? tip : '';
|
||||
}
|
||||
suffixLabel: String
|
||||
},
|
||||
methods: {
|
||||
updatePrice() {
|
||||
const { price, decimalLength } = this.data;
|
||||
this.set({
|
||||
hasPrice: typeof price === 'number',
|
||||
priceStr: (price / 100).toFixed(decimalLength)
|
||||
});
|
||||
},
|
||||
updateTip() {
|
||||
this.set({ hasTip: typeof this.data.tip === 'string' });
|
||||
},
|
||||
onSubmit(event) {
|
||||
this.$emit('submit', event.detail);
|
||||
}
|
||||
|
||||
20
dist/submit-bar/index.wxml
vendored
20
dist/submit-bar/index.wxml
vendored
@ -3,28 +3,28 @@
|
||||
<view class="van-submit-bar custom-class">
|
||||
<slot name="top" />
|
||||
|
||||
<view wx:if="{{ tip }}" class="van-submit-bar__tip">
|
||||
<view class="van-submit-bar__tip">
|
||||
<van-icon
|
||||
wx:if="{{ tipIcon }}"
|
||||
size="12px"
|
||||
name="{{ tipIcon }}"
|
||||
custom-class="van-submit-bar__tip-icon"
|
||||
/>
|
||||
<view wx:if="{{ tipStr }}" class="van-submit-bar__tip-text">
|
||||
{{ tipStr }}
|
||||
<view wx:if="{{ hasTip }}" class="van-submit-bar__tip-text">
|
||||
{{ tip }}
|
||||
</view>
|
||||
<slot name="tip" />
|
||||
</view>
|
||||
|
||||
<view class="bar-class {{ utils.bem('submit-bar__bar', { safe: safeAreaInsetBottom && isIPhoneX }) }}">
|
||||
<slot />
|
||||
<view class="van-submit-bar__text">
|
||||
<block wx:if="{{ hasPrice }}">
|
||||
<text>{{ label || '合计：' }}</text>
|
||||
<text class="van-submit-bar__price price-class">
|
||||
<text class="van-submit-bar__currency">{{ currency }}</text> {{ priceStr }}
|
||||
</text>
|
||||
</block>
|
||||
<view wx:if="{{ hasPrice }}" class="van-submit-bar__text">
|
||||
<text>{{ label || '合计：' }}</text>
|
||||
<text class="van-submit-bar__price price-class">
|
||||
<text class="van-submit-bar__currency">{{ currency }} </text>
|
||||
<text>{{ priceStr }}</text>
|
||||
</text>
|
||||
<text class="van-submit-bar__suffix-label">{{ suffixLabel }}</text>
|
||||
</view>
|
||||
<van-button
|
||||
square
|
||||
|
||||
2
dist/submit-bar/index.wxss
vendored
2
dist/submit-bar/index.wxss
vendored
@ -1 +1 @@
|
||||
@import '../common/index.wxss';.van-submit-bar{z-index:100;position:fixed;bottom:0;left:0;width:100%;-webkit-user-select:none;user-select:none}.van-submit-bar__tip{padding:10px;color:#f56723;font-size:12px;line-height:18px;background-color:#fff7cc}.van-submit-bar__tip-icon{width:12px;height:12px;margin-right:4px;vertical-align:middle}.van-submit-bar__tip-text{display:inline;vertical-align:middle}.van-submit-bar__bar{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;height:50px;background-color:#fff;font-size:14px}.van-submit-bar__bar--safe{padding-bottom:34px}.van-submit-bar__text{-webkit-flex:1;flex:1;color:#333;font-weight:500;text-align:right}.van-submit-bar__price{color:#f44;font-size:18px;padding-right:12px}.van-submit-bar__currency{font-size:14px}.van-submit-bar__button{width:110px}
|
||||
@import '../common/index.wxss';.van-submit-bar{position:fixed;bottom:0;left:0;z-index:100;width:100%;-webkit-user-select:none;user-select:none}.van-submit-bar__tip{padding:10px;font-size:12px;line-height:1.5;color:#f56723;background-color:#fff7cc}.van-submit-bar__tip:empty{display:none}.van-submit-bar__tip-icon{width:12px;height:12px;margin-right:4px;vertical-align:middle}.van-submit-bar__tip-text{display:inline;vertical-align:middle}.van-submit-bar__bar{display:-webkit-flex;display:flex;height:50px;font-size:14px;background-color:#fff;-webkit-align-items:center;align-items:center;-webkit-justify-content:flex-end;justify-content:flex-end}.van-submit-bar__bar--safe{padding-bottom:34px}.van-submit-bar__text{padding-right:12px;font-weight:500;color:#333;-webkit-flex:1;flex:1;text-align:right}.van-submit-bar__price{font-size:18px;color:#f44}.van-submit-bar__currency{font-size:14px}.van-submit-bar__suffix-label{margin-left:5px}.van-submit-bar__button{width:110px}
|
||||
35
dist/tabbar-item/index.js
vendored
35
dist/tabbar-item/index.js
vendored
@ -3,14 +3,14 @@ VantComponent({
|
||||
props: {
|
||||
info: null,
|
||||
icon: String,
|
||||
dot: Boolean
|
||||
dot: Boolean,
|
||||
name: {
|
||||
type: [String, Number]
|
||||
}
|
||||
},
|
||||
relation: {
|
||||
name: 'tabbar',
|
||||
type: 'ancestor',
|
||||
linked(target) {
|
||||
this.parent = target;
|
||||
}
|
||||
type: 'ancestor'
|
||||
},
|
||||
data: {
|
||||
active: false
|
||||
@ -22,11 +22,28 @@ VantComponent({
|
||||
}
|
||||
this.$emit('click');
|
||||
},
|
||||
setActive({ active, color }) {
|
||||
if (this.data.active !== active) {
|
||||
return this.set({ active, color });
|
||||
updateFromParent() {
|
||||
const { parent } = this;
|
||||
if (!parent) {
|
||||
return;
|
||||
}
|
||||
return Promise.resolve();
|
||||
const index = parent.children.indexOf(this);
|
||||
const parentData = parent.data;
|
||||
const { data } = this;
|
||||
const active = (data.name || index) === parentData.active;
|
||||
const patch = {};
|
||||
if (active !== data.active) {
|
||||
patch.active = active;
|
||||
}
|
||||
if (parentData.activeColor !== data.activeColor) {
|
||||
patch.activeColor = parentData.activeColor;
|
||||
}
|
||||
if (parentData.inactiveColor !== data.inactiveColor) {
|
||||
patch.inactiveColor = parentData.inactiveColor;
|
||||
}
|
||||
return Object.keys(patch).length > 0
|
||||
? this.set(patch)
|
||||
: Promise.resolve();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
2
dist/tabbar-item/index.wxml
vendored
2
dist/tabbar-item/index.wxml
vendored
@ -2,7 +2,7 @@
|
||||
|
||||
<view
|
||||
class="{{ utils.bem('tabbar-item', { active }) }} custom-class"
|
||||
style="{{ active && color ? 'color: ' + color : '' }}"
|
||||
style="color: {{ active ? activeColor : inactiveColor }}"
|
||||
bind:tap="onClick"
|
||||
>
|
||||
<view class="{{ utils.bem('tabbar-item__icon', { dot }) }}">
|
||||
|
||||
53
dist/tabbar/index.js
vendored
53
dist/tabbar/index.js
vendored
@ -6,19 +6,28 @@ VantComponent({
|
||||
name: 'tabbar-item',
|
||||
type: 'descendant',
|
||||
linked(target) {
|
||||
this.children = this.children || [];
|
||||
this.children.push(target);
|
||||
this.setActiveItem();
|
||||
target.parent = this;
|
||||
target.updateFromParent();
|
||||
},
|
||||
unlinked(target) {
|
||||
this.children = this.children || [];
|
||||
this.children = this.children.filter(item => item !== target);
|
||||
this.setActiveItem();
|
||||
this.children = this.children.filter((item) => item !== target);
|
||||
this.updateChildren();
|
||||
}
|
||||
},
|
||||
props: {
|
||||
active: Number,
|
||||
activeColor: String,
|
||||
active: {
|
||||
type: [Number, String],
|
||||
observer: 'updateChildren'
|
||||
},
|
||||
activeColor: {
|
||||
type: String,
|
||||
observer: 'updateChildren'
|
||||
},
|
||||
inactiveColor: {
|
||||
type: String,
|
||||
observer: 'updateChildren'
|
||||
},
|
||||
fixed: {
|
||||
type: Boolean,
|
||||
value: true
|
||||
@ -32,32 +41,22 @@ VantComponent({
|
||||
value: 1
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
active(active) {
|
||||
this.currentActive = active;
|
||||
this.setActiveItem();
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.currentActive = this.data.active;
|
||||
beforeCreate() {
|
||||
this.children = [];
|
||||
},
|
||||
methods: {
|
||||
setActiveItem() {
|
||||
if (!Array.isArray(this.children) || !this.children.length) {
|
||||
updateChildren() {
|
||||
const { children } = this;
|
||||
if (!Array.isArray(children) || !children.length) {
|
||||
return Promise.resolve();
|
||||
}
|
||||
return Promise.all(this.children.map((item, index) => item.setActive({
|
||||
active: index === this.currentActive,
|
||||
color: this.data.activeColor
|
||||
})));
|
||||
return Promise.all(children.map((child) => child.updateFromParent()));
|
||||
},
|
||||
onChange(child) {
|
||||
const active = (this.children || []).indexOf(child);
|
||||
if (active !== this.currentActive && active !== -1) {
|
||||
this.currentActive = active;
|
||||
this.setActiveItem().then(() => {
|
||||
this.$emit('change', active);
|
||||
});
|
||||
const index = this.children.indexOf(child);
|
||||
const active = child.data.name || index;
|
||||
if (active !== this.data.active) {
|
||||
this.$emit('change', active);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -10,8 +10,8 @@ function mapKeys(source, target, map) {
|
||||
});
|
||||
}
|
||||
function VantComponent(vantOptions) {
|
||||
if (vantOptions === void 0) { vantOptions = {}; }
|
||||
var _a;
|
||||
if (vantOptions === void 0) { vantOptions = {}; }
|
||||
var options = {};
|
||||
mapKeys(vantOptions, options, {
|
||||
data: 'data',
|
||||
|
||||
@ -79,24 +79,30 @@ component_1.VantComponent({
|
||||
columns: []
|
||||
},
|
||||
watch: {
|
||||
value: function (val) {
|
||||
value: 'updateValue',
|
||||
type: 'updateValue',
|
||||
minDate: 'updateValue',
|
||||
maxDate: 'updateValue',
|
||||
minHour: 'updateValue',
|
||||
maxHour: 'updateValue',
|
||||
minMinute: 'updateValue',
|
||||
maxMinute: 'updateValue'
|
||||
},
|
||||
methods: {
|
||||
updateValue: function () {
|
||||
var _this = this;
|
||||
var data = this.data;
|
||||
val = this.correctValue(val);
|
||||
var val = this.correctValue(this.data.value);
|
||||
var isEqual = val === data.innerValue;
|
||||
if (!isEqual) {
|
||||
this.updateColumnValue(val).then(function () {
|
||||
_this.$emit('input', val);
|
||||
});
|
||||
}
|
||||
else {
|
||||
this.updateColumns();
|
||||
}
|
||||
},
|
||||
type: 'updateColumns',
|
||||
minHour: 'updateColumns',
|
||||
maxHour: 'updateColumns',
|
||||
minMinute: 'updateColumns',
|
||||
maxMinute: 'updateColumns'
|
||||
},
|
||||
methods: {
|
||||
getPicker: function () {
|
||||
if (this.picker == null) {
|
||||
var picker_1 = (this.picker = this.selectComponent('.van-datetime-picker'));
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -7,7 +7,7 @@ var getClassNames = function (name) { return ({
|
||||
leave: "van-" + name + "-leave van-" + name + "-leave-active leave-class leave-active-class",
|
||||
'leave-to': "van-" + name + "-leave-to van-" + name + "-leave-active leave-to-class leave-active-class"
|
||||
}); };
|
||||
var nextTick = function () { return new Promise(function (resolve) { return setTimeout(resolve, 1000 / 20); }); };
|
||||
var nextTick = function () { return new Promise(function (resolve) { return setTimeout(resolve, 1000 / 30); }); };
|
||||
exports.transition = function (showDefaultValue) {
|
||||
return Behavior({
|
||||
properties: {
|
||||
@ -36,13 +36,13 @@ exports.transition = function (showDefaultValue) {
|
||||
},
|
||||
attached: function () {
|
||||
if (this.data.show) {
|
||||
this.show();
|
||||
this.enter();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
observeShow: function (value) {
|
||||
if (value) {
|
||||
this.show();
|
||||
this.enter();
|
||||
}
|
||||
else {
|
||||
this.leave();
|
||||
@ -53,14 +53,16 @@ exports.transition = function (showDefaultValue) {
|
||||
classNames: getClassNames(name)
|
||||
});
|
||||
},
|
||||
show: function () {
|
||||
enter: function () {
|
||||
var _this = this;
|
||||
var _a = this.data, classNames = _a.classNames, duration = _a.duration;
|
||||
var currentDuration = utils_1.isObj(duration) ? duration.leave : duration;
|
||||
this.status = 'enter';
|
||||
Promise.resolve()
|
||||
.then(nextTick)
|
||||
.then(function () {
|
||||
return _this.set({
|
||||
_this.checkStatus('enter');
|
||||
_this.set({
|
||||
inited: true,
|
||||
display: true,
|
||||
classes: classNames.enter,
|
||||
@ -69,19 +71,23 @@ exports.transition = function (showDefaultValue) {
|
||||
})
|
||||
.then(nextTick)
|
||||
.then(function () {
|
||||
return _this.set({
|
||||
_this.checkStatus('enter');
|
||||
_this.set({
|
||||
classes: classNames['enter-to']
|
||||
});
|
||||
});
|
||||
})
|
||||
.catch(function () { });
|
||||
},
|
||||
leave: function () {
|
||||
var _this = this;
|
||||
var _a = this.data, classNames = _a.classNames, duration = _a.duration;
|
||||
var currentDuration = utils_1.isObj(duration) ? duration.leave : duration;
|
||||
this.status = 'leave';
|
||||
Promise.resolve()
|
||||
.then(nextTick)
|
||||
.then(function () {
|
||||
return _this.set({
|
||||
_this.checkStatus('leave');
|
||||
_this.set({
|
||||
classes: classNames.leave,
|
||||
currentDuration: currentDuration
|
||||
});
|
||||
@ -89,10 +95,17 @@ exports.transition = function (showDefaultValue) {
|
||||
.then(function () { return setTimeout(function () { return _this.onTransitionEnd(); }, currentDuration); })
|
||||
.then(nextTick)
|
||||
.then(function () {
|
||||
return _this.set({
|
||||
_this.checkStatus('leave');
|
||||
_this.set({
|
||||
classes: classNames['leave-to']
|
||||
});
|
||||
});
|
||||
})
|
||||
.catch(function () { });
|
||||
},
|
||||
checkStatus: function (status) {
|
||||
if (status !== this.status) {
|
||||
throw new Error("incongruent status: " + status);
|
||||
}
|
||||
},
|
||||
onTransitionEnd: function () {
|
||||
if (!this.data.show) {
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<wxs src="../wxs/utils.wxs" module="utils" />
|
||||
|
||||
<van-overlay
|
||||
wx:if="{{ inited && overlay }}"
|
||||
wx:if="{{ overlay }}"
|
||||
mask
|
||||
show="{{ show }}"
|
||||
z-index="{{ zIndex }}"
|
||||
|
||||
@ -20,49 +20,5 @@ component_1.VantComponent({
|
||||
type: String,
|
||||
value: '#fff'
|
||||
}
|
||||
},
|
||||
data: {
|
||||
pivotWidth: 0,
|
||||
progressWidth: 0
|
||||
},
|
||||
watch: {
|
||||
pivotText: 'getWidth',
|
||||
showPivot: 'getWidth'
|
||||
},
|
||||
computed: {
|
||||
portionStyle: function () {
|
||||
var width = (this.data.progressWidth - this.data.pivotWidth) * this.data.percentage / 100 + 'px';
|
||||
var background = this.getCurrentColor();
|
||||
return "width: " + width + "; background: " + background + "; ";
|
||||
},
|
||||
pivotStyle: function () {
|
||||
var color = this.data.textColor;
|
||||
var background = this.data.pivotColor || this.getCurrentColor();
|
||||
return "color: " + color + "; background: " + background;
|
||||
},
|
||||
text: function () {
|
||||
return this.data.pivotText || this.data.percentage + '%';
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
this.getWidth();
|
||||
},
|
||||
methods: {
|
||||
getCurrentColor: function () {
|
||||
return this.data.inactive ? '#cacaca' : this.data.color;
|
||||
},
|
||||
getWidth: function () {
|
||||
var _this = this;
|
||||
this.getRect('.van-progress').then(function (rect) {
|
||||
_this.set({
|
||||
progressWidth: rect.width
|
||||
});
|
||||
});
|
||||
this.getRect('.van-progress__pivot').then(function (rect) {
|
||||
_this.set({
|
||||
pivotWidth: rect.width || 0
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -1,14 +1,16 @@
|
||||
<wxs src="./index.wxs" module="getters" />
|
||||
|
||||
<view class="van-progress custom-class">
|
||||
<view
|
||||
class="van-progress__portion {{ showPivot && text ? 'van-progress__portion--with-pivot' : '' }}"
|
||||
style="{{ portionStyle }}"
|
||||
class="van-progress__portion"
|
||||
style="width: {{ percentage }}%; background: {{ inactive ? '#cacaca' : color }}"
|
||||
>
|
||||
<view
|
||||
wx:if="{{ showPivot && text }}"
|
||||
style="{{ pivotStyle }}"
|
||||
wx:if="{{ showPivot && getters.text(pivotText, percentage) }}"
|
||||
style="color: {{ textColor }}; background: {{ pivotColor ? pivotColor : inactive ? '#cacaca' : color }}"
|
||||
class="van-progress__pivot"
|
||||
>
|
||||
{{ text }}
|
||||
{{ getters.text(pivotText, percentage) }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
5
lib/progress/index.wxs
Normal file
5
lib/progress/index.wxs
Normal file
@ -0,0 +1,5 @@
|
||||
module.exports = {
|
||||
text: function(pivotText, percentage) {
|
||||
return pivotText || percentage + '%';
|
||||
}
|
||||
};
|
||||
@ -1 +1 @@
|
||||
@import '../common/index.wxss';.van-progress{height:4px;position:relative;border-radius:4px;background:#e5e5e5}.van-progress__portion{left:0;height:100%;position:absolute;border-radius:inherit}.van-progress__portion--with-pivot{border-top-right-radius:0;border-bottom-right-radius:0}.van-progress__pivot{top:50%;right:0;min-width:2em;padding:0 5px;font-size:10px;position:absolute;line-height:1.6;text-align:center;border-radius:1em;word-break:keep-all;box-sizing:border-box;background-color:#e5e5e5;-webkit-transform:translate(100%,-50%);transform:translate(100%,-50%)}
|
||||
@import '../common/index.wxss';.van-progress{position:relative;height:4px;background:#e5e5e5;border-radius:4px}.van-progress__portion{position:absolute;left:0;height:100%;border-radius:inherit}.van-progress__pivot{position:absolute;top:50%;right:0;min-width:2em;padding:0 5px;font-size:10px;line-height:1.6;text-align:center;word-break:keep-all;background-color:#e5e5e5;border-radius:1em;-webkit-transform:translateY(-50%);transform:translateY(-50%);box-sizing:border-box}
|
||||
@ -7,7 +7,7 @@
|
||||
wx:else
|
||||
name="success"
|
||||
class="{{ utils.bem('radio__icon', [shape, { disabled, checked: value === name }]) }}"
|
||||
style="{{ checkedColor && value && !disabled ? 'border-color:' + checkedColor + '; background-color:' + checkedColor : '' }}"
|
||||
style="{{ checkedColor && !disabled && value === name ? 'border-color:' + checkedColor + '; background-color:' + checkedColor : '' }}"
|
||||
custom-class="icon-class"
|
||||
custom-style="line-height: 20px;"
|
||||
/>
|
||||
|
||||
@ -10,10 +10,16 @@ component_1.VantComponent({
|
||||
'button-class'
|
||||
],
|
||||
props: {
|
||||
tip: null,
|
||||
tip: {
|
||||
type: null,
|
||||
observer: 'updateTip'
|
||||
},
|
||||
tipIcon: String,
|
||||
type: Number,
|
||||
price: null,
|
||||
price: {
|
||||
type: null,
|
||||
observer: 'updatePrice'
|
||||
},
|
||||
label: String,
|
||||
loading: Boolean,
|
||||
disabled: Boolean,
|
||||
@ -28,22 +34,22 @@ component_1.VantComponent({
|
||||
},
|
||||
decimalLength: {
|
||||
type: Number,
|
||||
value: 2
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
hasPrice: function () {
|
||||
return typeof this.data.price === 'number';
|
||||
value: 2,
|
||||
observer: 'updatePrice'
|
||||
},
|
||||
priceStr: function () {
|
||||
return (this.data.price / 100).toFixed(this.data.decimalLength);
|
||||
},
|
||||
tipStr: function () {
|
||||
var tip = this.data.tip;
|
||||
return typeof tip === 'string' ? tip : '';
|
||||
}
|
||||
suffixLabel: String
|
||||
},
|
||||
methods: {
|
||||
updatePrice: function () {
|
||||
var _a = this.data, price = _a.price, decimalLength = _a.decimalLength;
|
||||
this.set({
|
||||
hasPrice: typeof price === 'number',
|
||||
priceStr: (price / 100).toFixed(decimalLength)
|
||||
});
|
||||
},
|
||||
updateTip: function () {
|
||||
this.set({ hasTip: typeof this.data.tip === 'string' });
|
||||
},
|
||||
onSubmit: function (event) {
|
||||
this.$emit('submit', event.detail);
|
||||
}
|
||||
|
||||
@ -3,28 +3,28 @@
|
||||
<view class="van-submit-bar custom-class">
|
||||
<slot name="top" />
|
||||
|
||||
<view wx:if="{{ tip }}" class="van-submit-bar__tip">
|
||||
<view class="van-submit-bar__tip">
|
||||
<van-icon
|
||||
wx:if="{{ tipIcon }}"
|
||||
size="12px"
|
||||
name="{{ tipIcon }}"
|
||||
custom-class="van-submit-bar__tip-icon"
|
||||
/>
|
||||
<view wx:if="{{ tipStr }}" class="van-submit-bar__tip-text">
|
||||
{{ tipStr }}
|
||||
<view wx:if="{{ hasTip }}" class="van-submit-bar__tip-text">
|
||||
{{ tip }}
|
||||
</view>
|
||||
<slot name="tip" />
|
||||
</view>
|
||||
|
||||
<view class="bar-class {{ utils.bem('submit-bar__bar', { safe: safeAreaInsetBottom && isIPhoneX }) }}">
|
||||
<slot />
|
||||
<view class="van-submit-bar__text">
|
||||
<block wx:if="{{ hasPrice }}">
|
||||
<text>{{ label || '合计：' }}</text>
|
||||
<text class="van-submit-bar__price price-class">
|
||||
<text class="van-submit-bar__currency">{{ currency }}</text> {{ priceStr }}
|
||||
</text>
|
||||
</block>
|
||||
<view wx:if="{{ hasPrice }}" class="van-submit-bar__text">
|
||||
<text>{{ label || '合计：' }}</text>
|
||||
<text class="van-submit-bar__price price-class">
|
||||
<text class="van-submit-bar__currency">{{ currency }} </text>
|
||||
<text>{{ priceStr }}</text>
|
||||
</text>
|
||||
<text class="van-submit-bar__suffix-label">{{ suffixLabel }}</text>
|
||||
</view>
|
||||
<van-button
|
||||
square
|
||||
|
||||
@ -1 +1 @@
|
||||
@import '../common/index.wxss';.van-submit-bar{z-index:100;position:fixed;bottom:0;left:0;width:100%;-webkit-user-select:none;user-select:none}.van-submit-bar__tip{padding:10px;color:#f56723;font-size:12px;line-height:18px;background-color:#fff7cc}.van-submit-bar__tip-icon{width:12px;height:12px;margin-right:4px;vertical-align:middle}.van-submit-bar__tip-text{display:inline;vertical-align:middle}.van-submit-bar__bar{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;height:50px;background-color:#fff;font-size:14px}.van-submit-bar__bar--safe{padding-bottom:34px}.van-submit-bar__text{-webkit-flex:1;flex:1;color:#333;font-weight:500;text-align:right}.van-submit-bar__price{color:#f44;font-size:18px;padding-right:12px}.van-submit-bar__currency{font-size:14px}.van-submit-bar__button{width:110px}
|
||||
@import '../common/index.wxss';.van-submit-bar{position:fixed;bottom:0;left:0;z-index:100;width:100%;-webkit-user-select:none;user-select:none}.van-submit-bar__tip{padding:10px;font-size:12px;line-height:1.5;color:#f56723;background-color:#fff7cc}.van-submit-bar__tip:empty{display:none}.van-submit-bar__tip-icon{width:12px;height:12px;margin-right:4px;vertical-align:middle}.van-submit-bar__tip-text{display:inline;vertical-align:middle}.van-submit-bar__bar{display:-webkit-flex;display:flex;height:50px;font-size:14px;background-color:#fff;-webkit-align-items:center;align-items:center;-webkit-justify-content:flex-end;justify-content:flex-end}.van-submit-bar__bar--safe{padding-bottom:34px}.van-submit-bar__text{padding-right:12px;font-weight:500;color:#333;-webkit-flex:1;flex:1;text-align:right}.van-submit-bar__price{font-size:18px;color:#f44}.van-submit-bar__currency{font-size:14px}.van-submit-bar__suffix-label{margin-left:5px}.van-submit-bar__button{width:110px}
|
||||
@ -5,14 +5,14 @@ component_1.VantComponent({
|
||||
props: {
|
||||
info: null,
|
||||
icon: String,
|
||||
dot: Boolean
|
||||
dot: Boolean,
|
||||
name: {
|
||||
type: [String, Number]
|
||||
}
|
||||
},
|
||||
relation: {
|
||||
name: 'tabbar',
|
||||
type: 'ancestor',
|
||||
linked: function (target) {
|
||||
this.parent = target;
|
||||
}
|
||||
type: 'ancestor'
|
||||
},
|
||||
data: {
|
||||
active: false
|
||||
@ -24,12 +24,28 @@ component_1.VantComponent({
|
||||
}
|
||||
this.$emit('click');
|
||||
},
|
||||
setActive: function (_a) {
|
||||
var active = _a.active, color = _a.color;
|
||||
if (this.data.active !== active) {
|
||||
return this.set({ active: active, color: color });
|
||||
updateFromParent: function () {
|
||||
var parent = this.parent;
|
||||
if (!parent) {
|
||||
return;
|
||||
}
|
||||
return Promise.resolve();
|
||||
var index = parent.children.indexOf(this);
|
||||
var parentData = parent.data;
|
||||
var data = this.data;
|
||||
var active = (data.name || index) === parentData.active;
|
||||
var patch = {};
|
||||
if (active !== data.active) {
|
||||
patch.active = active;
|
||||
}
|
||||
if (parentData.activeColor !== data.activeColor) {
|
||||
patch.activeColor = parentData.activeColor;
|
||||
}
|
||||
if (parentData.inactiveColor !== data.inactiveColor) {
|
||||
patch.inactiveColor = parentData.inactiveColor;
|
||||
}
|
||||
return Object.keys(patch).length > 0
|
||||
? this.set(patch)
|
||||
: Promise.resolve();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
|
||||
<view
|
||||
class="{{ utils.bem('tabbar-item', { active }) }} custom-class"
|
||||
style="{{ active && color ? 'color: ' + color : '' }}"
|
||||
style="color: {{ active ? activeColor : inactiveColor }}"
|
||||
bind:tap="onClick"
|
||||
>
|
||||
<view class="{{ utils.bem('tabbar-item__icon', { dot }) }}">
|
||||
|
||||
@ -8,19 +8,28 @@ component_1.VantComponent({
|
||||
name: 'tabbar-item',
|
||||
type: 'descendant',
|
||||
linked: function (target) {
|
||||
this.children = this.children || [];
|
||||
this.children.push(target);
|
||||
this.setActiveItem();
|
||||
target.parent = this;
|
||||
target.updateFromParent();
|
||||
},
|
||||
unlinked: function (target) {
|
||||
this.children = this.children || [];
|
||||
this.children = this.children.filter(function (item) { return item !== target; });
|
||||
this.setActiveItem();
|
||||
this.updateChildren();
|
||||
}
|
||||
},
|
||||
props: {
|
||||
active: Number,
|
||||
activeColor: String,
|
||||
active: {
|
||||
type: [Number, String],
|
||||
observer: 'updateChildren'
|
||||
},
|
||||
activeColor: {
|
||||
type: String,
|
||||
observer: 'updateChildren'
|
||||
},
|
||||
inactiveColor: {
|
||||
type: String,
|
||||
observer: 'updateChildren'
|
||||
},
|
||||
fixed: {
|
||||
type: Boolean,
|
||||
value: true
|
||||
@ -34,36 +43,22 @@ component_1.VantComponent({
|
||||
value: 1
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
active: function (active) {
|
||||
this.currentActive = active;
|
||||
this.setActiveItem();
|
||||
}
|
||||
},
|
||||
created: function () {
|
||||
this.currentActive = this.data.active;
|
||||
beforeCreate: function () {
|
||||
this.children = [];
|
||||
},
|
||||
methods: {
|
||||
setActiveItem: function () {
|
||||
var _this = this;
|
||||
if (!Array.isArray(this.children) || !this.children.length) {
|
||||
updateChildren: function () {
|
||||
var children = this.children;
|
||||
if (!Array.isArray(children) || !children.length) {
|
||||
return Promise.resolve();
|
||||
}
|
||||
return Promise.all(this.children.map(function (item, index) {
|
||||
return item.setActive({
|
||||
active: index === _this.currentActive,
|
||||
color: _this.data.activeColor
|
||||
});
|
||||
}));
|
||||
return Promise.all(children.map(function (child) { return child.updateFromParent(); }));
|
||||
},
|
||||
onChange: function (child) {
|
||||
var _this = this;
|
||||
var active = (this.children || []).indexOf(child);
|
||||
if (active !== this.currentActive && active !== -1) {
|
||||
this.currentActive = active;
|
||||
this.setActiveItem().then(function () {
|
||||
_this.$emit('change', active);
|
||||
});
|
||||
var index = this.children.indexOf(child);
|
||||
var active = child.data.name || index;
|
||||
if (active !== this.data.active) {
|
||||
this.$emit('change', active);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user