mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-10-09 10:19:58 +08:00
[build] 0.5.13
This commit is contained in:
parent
59f4b7c970
commit
1111be22c9
2
dist/checkbox/index.wxss
vendored
2
dist/checkbox/index.wxss
vendored
@ -1 +1 @@
|
|||||||
@import '../common/index.wxss';.van-checkbox{overflow:hidden;-webkit-user-select:none;user-select:none}.van-checkbox__icon-wrap,.van-checkbox__label{display:inline-block;line-height:20px;vertical-align:middle}.van-checkbox__icon{display:block;font-size:14px;width:20px;height:20px;color:transparent;text-align:center;box-sizing:border-box;border:1px solid #e5e5e5;transition:.2s}.van-checkbox__icon--round{border-radius:100%}.van-checkbox__icon--checked{color:#fff;border-color:#1989fa;background-color:#1989fa}.van-checkbox__icon--disabled{border-color:#c9c9c9;background-color:#eee}.van-checkbox__icon--disabled.van-checkbox__icon--checked{color:#c9c9c9}.van-checkbox__label{color:#333;margin-left:10px}.van-checkbox__label--left{float:left;margin:0 10px 0 0}.van-checkbox__label--disabled{color:#c9c9c9}.van-checkbox__label:empty{margin:0}
|
@import '../common/index.wxss';.van-checkbox{display:-webkit-flex;display:flex;overflow:hidden;-webkit-user-select:none;user-select:none}.van-checkbox__icon-wrap,.van-checkbox__label{line-height:20px}.van-checkbox__icon-wrap{-webkit-flex:none;flex:none}.van-checkbox__label{word-break:break-all}.van-checkbox__icon{display:block;width:20px;height:20px;font-size:14px;color:transparent;text-align:center;border:1px solid #e5e5e5;box-sizing:border-box;transition:.2s}.van-checkbox__icon--round{border-radius:100%}.van-checkbox__icon--checked{color:#fff;background-color:#1989fa;border-color:#1989fa}.van-checkbox__icon--disabled{background-color:#eee;border-color:#c9c9c9}.van-checkbox__icon--disabled.van-checkbox__icon--checked{color:#c9c9c9}.van-checkbox__label{margin-left:10px;color:#333}.van-checkbox__label--left{float:left;margin:0 10px 0 0}.van-checkbox__label--disabled{color:#c9c9c9}.van-checkbox__label:empty{margin:0}
|
7
dist/mixins/transition.js
vendored
7
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: `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`
|
'leave-to': `van-${name}-leave-to van-${name}-leave-active leave-to-class leave-active-class`
|
||||||
});
|
});
|
||||||
const nextTick = () => new Promise(resolve => setTimeout(resolve, 1000 / 30));
|
const nextTick = () => new Promise(resolve => setTimeout(resolve, 1000 / 20));
|
||||||
export const transition = function (showDefaultValue) {
|
export const transition = function (showDefaultValue) {
|
||||||
return Behavior({
|
return Behavior({
|
||||||
properties: {
|
properties: {
|
||||||
@ -70,16 +70,13 @@ export const transition = function (showDefaultValue) {
|
|||||||
leave() {
|
leave() {
|
||||||
const { classNames, duration } = this.data;
|
const { classNames, duration } = this.data;
|
||||||
const currentDuration = isObj(duration) ? duration.leave : duration;
|
const currentDuration = isObj(duration) ? duration.leave : duration;
|
||||||
if (+currentDuration === 0) {
|
|
||||||
this.onTransitionEnd();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
Promise.resolve()
|
Promise.resolve()
|
||||||
.then(nextTick)
|
.then(nextTick)
|
||||||
.then(() => this.set({
|
.then(() => this.set({
|
||||||
classes: classNames.leave,
|
classes: classNames.leave,
|
||||||
currentDuration
|
currentDuration
|
||||||
}))
|
}))
|
||||||
|
.then(() => setTimeout(() => this.onTransitionEnd(), currentDuration))
|
||||||
.then(nextTick)
|
.then(nextTick)
|
||||||
.then(() => this.set({
|
.then(() => this.set({
|
||||||
classes: classNames['leave-to']
|
classes: classNames['leave-to']
|
||||||
|
15
dist/notice-bar/index.js
vendored
15
dist/notice-bar/index.js
vendored
@ -21,7 +21,7 @@ VantComponent({
|
|||||||
},
|
},
|
||||||
delay: {
|
delay: {
|
||||||
type: Number,
|
type: Number,
|
||||||
value: 0
|
value: 1
|
||||||
},
|
},
|
||||||
speed: {
|
speed: {
|
||||||
type: Number,
|
type: Number,
|
||||||
@ -42,11 +42,11 @@ VantComponent({
|
|||||||
backgroundColor: {
|
backgroundColor: {
|
||||||
type: String,
|
type: String,
|
||||||
value: BG_COLOR
|
value: BG_COLOR
|
||||||
}
|
},
|
||||||
|
wrapable: Boolean
|
||||||
},
|
},
|
||||||
data: {
|
data: {
|
||||||
show: true,
|
show: true
|
||||||
hasRightIcon: false
|
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
text() {
|
text() {
|
||||||
@ -54,11 +54,6 @@ VantComponent({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
if (this.data.mode) {
|
|
||||||
this.set({
|
|
||||||
hasRightIcon: true
|
|
||||||
});
|
|
||||||
}
|
|
||||||
this.resetAnimation = wx.createAnimation({
|
this.resetAnimation = wx.createAnimation({
|
||||||
duration: 0,
|
duration: 0,
|
||||||
timingFunction: 'linear'
|
timingFunction: 'linear'
|
||||||
@ -71,7 +66,7 @@ VantComponent({
|
|||||||
init() {
|
init() {
|
||||||
Promise.all([
|
Promise.all([
|
||||||
this.getRect('.van-notice-bar__content'),
|
this.getRect('.van-notice-bar__content'),
|
||||||
this.getRect('.van-notice-bar__content-wrap')
|
this.getRect('.van-notice-bar__wrap')
|
||||||
]).then((rects) => {
|
]).then((rects) => {
|
||||||
const [contentRect, wrapRect] = rects;
|
const [contentRect, wrapRect] = rects;
|
||||||
if (contentRect == null ||
|
if (contentRect == null ||
|
||||||
|
14
dist/notice-bar/index.wxml
vendored
14
dist/notice-bar/index.wxml
vendored
@ -1,16 +1,20 @@
|
|||||||
|
<wxs src="../wxs/utils.wxs" module="utils" />
|
||||||
|
|
||||||
<view
|
<view
|
||||||
wx:if="{{ show }}"
|
wx:if="{{ show }}"
|
||||||
class="custom-class van-notice-bar {{ hasRightIcon ? 'van-notice-bar--within-icon' : '' }}"
|
class="custom-class {{ utils.bem('notice-bar', { withicon: mode, wrapable }) }}"
|
||||||
style="color: {{ color }}; background-color: {{ backgroundColor }};"
|
style="color: {{ color }}; background-color: {{ backgroundColor }};"
|
||||||
bind:tap="onClick"
|
bind:tap="onClick"
|
||||||
>
|
>
|
||||||
<image
|
<van-icon
|
||||||
wx:if="{{ leftIcon }}"
|
wx:if="{{ leftIcon }}"
|
||||||
src="{{ leftIcon }}"
|
size="16px"
|
||||||
|
name="{{ leftIcon }}"
|
||||||
class="van-notice-bar__left-icon"
|
class="van-notice-bar__left-icon"
|
||||||
/>
|
/>
|
||||||
<view class="van-notice-bar__content-wrap">
|
|
||||||
<view class="van-notice-bar__content {{ scrollable ? '' : 'van-ellipsis' }}" animation="{{ animationData }}">
|
<view class="van-notice-bar__wrap">
|
||||||
|
<view class="van-notice-bar__content {{ !scrollable && !wrapable ? 'van-ellipsis' : '' }}" animation="{{ animationData }}">
|
||||||
{{ text }}
|
{{ text }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
2
dist/notice-bar/index.wxss
vendored
2
dist/notice-bar/index.wxss
vendored
@ -1 +1 @@
|
|||||||
@import '../common/index.wxss';.van-notice-bar{display:-webkit-flex;display:flex;height:40px;padding:0 15px;font-size:14px;line-height:24px;-webkit-align-items:center;align-items:center}.van-notice-bar--within-icon{position:relative;padding-right:40px}.van-notice-bar__left-icon{width:16px;height:16px;margin-right:4px}.van-notice-bar__right-icon{position:absolute;top:10px;right:15px;font-size:16px}.van-notice-bar__content-wrap{position:relative;height:24px;overflow:hidden;-webkit-flex:1;flex:1}.van-notice-bar__content{position:absolute;white-space:nowrap}.van-notice-bar__content.van-ellipsis{max-width:100%}
|
@import '../common/index.wxss';.van-notice-bar{display:-webkit-flex;display:flex;height:40px;padding:0 15px;font-size:14px;line-height:24px;-webkit-align-items:center;align-items:center}.van-notice-bar--withicon{position:relative;padding-right:40px}.van-notice-bar--wrapable{height:auto;padding:8px 15px}.van-notice-bar--wrapable .van-notice-bar__wrap{height:auto}.van-notice-bar--wrapable .van-notice-bar__content{position:relative;white-space:normal}.van-notice-bar__left-icon{display:-webkit-flex;display:flex;margin-right:4px;vertical-align:middle;-webkit-align-items:center;align-items:center}.van-notice-bar__right-icon{position:absolute;top:10px;right:15px;font-size:16px}.van-notice-bar__wrap{position:relative;height:24px;overflow:hidden;-webkit-flex:1;flex:1}.van-notice-bar__content{position:absolute;white-space:nowrap}.van-notice-bar__content.van-ellipsis{max-width:100%}
|
26
dist/rate/index.js
vendored
26
dist/rate/index.js
vendored
@ -3,8 +3,10 @@ VantComponent({
|
|||||||
field: true,
|
field: true,
|
||||||
classes: ['icon-class'],
|
classes: ['icon-class'],
|
||||||
props: {
|
props: {
|
||||||
|
value: Number,
|
||||||
readonly: Boolean,
|
readonly: Boolean,
|
||||||
disabled: Boolean,
|
disabled: Boolean,
|
||||||
|
allowHalf: Boolean,
|
||||||
size: {
|
size: {
|
||||||
type: Number,
|
type: Number,
|
||||||
value: 20
|
value: 20
|
||||||
@ -32,10 +34,6 @@ VantComponent({
|
|||||||
count: {
|
count: {
|
||||||
type: Number,
|
type: Number,
|
||||||
value: 5
|
value: 5
|
||||||
},
|
|
||||||
value: {
|
|
||||||
type: Number,
|
|
||||||
value: 0
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data: {
|
data: {
|
||||||
@ -48,26 +46,22 @@ VantComponent({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
|
||||||
list() {
|
|
||||||
const { count, innerValue } = this.data;
|
|
||||||
return Array.from({ length: count }, (_, index) => index < innerValue);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
methods: {
|
||||||
onSelect(event) {
|
onSelect(event) {
|
||||||
const { data } = this;
|
const { data } = this;
|
||||||
const { index } = event.currentTarget.dataset;
|
const { score } = event.currentTarget.dataset;
|
||||||
if (!data.disabled && !data.readonly) {
|
if (!data.disabled && !data.readonly) {
|
||||||
this.set({ innerValue: index + 1 });
|
this.set({ innerValue: score + 1 });
|
||||||
this.$emit('input', index + 1);
|
this.$emit('input', score + 1);
|
||||||
this.$emit('change', index + 1);
|
this.$emit('change', score + 1);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onTouchMove(event) {
|
onTouchMove(event) {
|
||||||
const { clientX, clientY } = event.touches[0];
|
const { clientX, clientY } = event.touches[0];
|
||||||
this.getRect('.van-rate__item', true).then(list => {
|
this.getRect('.van-rate__icon', true).then((list) => {
|
||||||
const target = list.find(item => clientX >= item.left &&
|
const target = list
|
||||||
|
.sort(item => item.right - item.left)
|
||||||
|
.find(item => clientX >= item.left &&
|
||||||
clientX <= item.right &&
|
clientX <= item.right &&
|
||||||
clientY >= item.top &&
|
clientY >= item.top &&
|
||||||
clientY <= item.bottom);
|
clientY <= item.bottom);
|
||||||
|
36
dist/rate/index.wxml
vendored
36
dist/rate/index.wxml
vendored
@ -1,16 +1,32 @@
|
|||||||
|
<wxs src="../wxs/utils.wxs" module="utils" />
|
||||||
|
|
||||||
<view
|
<view
|
||||||
class="van-rate custom-class"
|
class="van-rate custom-class"
|
||||||
bind:touchmove="onTouchMove"
|
bind:touchmove="onTouchMove"
|
||||||
>
|
>
|
||||||
<van-icon
|
<view
|
||||||
wx:for="{{ list }}"
|
|
||||||
wx:key="index"
|
|
||||||
class="van-rate__item"
|
class="van-rate__item"
|
||||||
custom-class="icon-class"
|
wx:for="{{ count }}"
|
||||||
size="{{ size }}px"
|
wx:key="index"
|
||||||
data-index="{{ index }}"
|
style="font-size: {{ size}}px;"
|
||||||
name="{{ item ? icon : voidIcon }}"
|
>
|
||||||
color="{{ disabled ? disabledColor : item ? color : voidColor }}"
|
<van-icon
|
||||||
bind:click="onSelect"
|
name="{{ index + 1 <= innerValue ? icon : voidIcon }}"
|
||||||
/>
|
class="van-rate__icon"
|
||||||
|
custom-class="icon-class"
|
||||||
|
data-score="{{ index }}"
|
||||||
|
color="{{ disabled ? disabledColor : index + 1 <= innerValue ? color : voidColor }}"
|
||||||
|
bind:click="onSelect"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<van-icon
|
||||||
|
wx:if="{{ allowHalf }}"
|
||||||
|
name="{{ index + 0.5 <= innerValue ? icon : voidIcon }}"
|
||||||
|
class="{{ utils.bem('rate__icon', ['half']) }}"
|
||||||
|
custom-class="icon-class"
|
||||||
|
data-score="{{ index - 0.5 }}"
|
||||||
|
color="{{ disabled ? disabledColor : index + 0.5 <= innerValue ? color : voidColor }}"
|
||||||
|
bind:click="onSelect"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
2
dist/rate/index.wxss
vendored
2
dist/rate/index.wxss
vendored
@ -1 +1 @@
|
|||||||
@import '../common/index.wxss';.van-rate{-webkit-user-select:none;user-select:none}.van-rate__item{width:1em;padding:0 2px;box-sizing:initial}
|
@import '../common/index.wxss';.van-rate{-webkit-user-select:none;user-select:none}.van-rate__item{position:relative;display:inline-block;padding:0 2px}.van-rate__icon{display:block;height:1em}.van-rate__icon--half{position:absolute;top:0;left:2px;width:.5em;overflow:hidden}
|
@ -1 +1 @@
|
|||||||
@import '../common/index.wxss';.van-checkbox{overflow:hidden;-webkit-user-select:none;user-select:none}.van-checkbox__icon-wrap,.van-checkbox__label{display:inline-block;line-height:20px;vertical-align:middle}.van-checkbox__icon{display:block;font-size:14px;width:20px;height:20px;color:transparent;text-align:center;box-sizing:border-box;border:1px solid #e5e5e5;transition:.2s}.van-checkbox__icon--round{border-radius:100%}.van-checkbox__icon--checked{color:#fff;border-color:#1989fa;background-color:#1989fa}.van-checkbox__icon--disabled{border-color:#c9c9c9;background-color:#eee}.van-checkbox__icon--disabled.van-checkbox__icon--checked{color:#c9c9c9}.van-checkbox__label{color:#333;margin-left:10px}.van-checkbox__label--left{float:left;margin:0 10px 0 0}.van-checkbox__label--disabled{color:#c9c9c9}.van-checkbox__label:empty{margin:0}
|
@import '../common/index.wxss';.van-checkbox{display:-webkit-flex;display:flex;overflow:hidden;-webkit-user-select:none;user-select:none}.van-checkbox__icon-wrap,.van-checkbox__label{line-height:20px}.van-checkbox__icon-wrap{-webkit-flex:none;flex:none}.van-checkbox__label{word-break:break-all}.van-checkbox__icon{display:block;width:20px;height:20px;font-size:14px;color:transparent;text-align:center;border:1px solid #e5e5e5;box-sizing:border-box;transition:.2s}.van-checkbox__icon--round{border-radius:100%}.van-checkbox__icon--checked{color:#fff;background-color:#1989fa;border-color:#1989fa}.van-checkbox__icon--disabled{background-color:#eee;border-color:#c9c9c9}.van-checkbox__icon--disabled.van-checkbox__icon--checked{color:#c9c9c9}.van-checkbox__label{margin-left:10px;color:#333}.van-checkbox__label--left{float:left;margin:0 10px 0 0}.van-checkbox__label--disabled{color:#c9c9c9}.van-checkbox__label:empty{margin:0}
|
@ -7,7 +7,7 @@ var getClassNames = function (name) { return ({
|
|||||||
leave: "van-" + name + "-leave van-" + name + "-leave-active leave-class leave-active-class",
|
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"
|
'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 / 30); }); };
|
var nextTick = function () { return new Promise(function (resolve) { return setTimeout(resolve, 1000 / 20); }); };
|
||||||
exports.transition = function (showDefaultValue) {
|
exports.transition = function (showDefaultValue) {
|
||||||
return Behavior({
|
return Behavior({
|
||||||
properties: {
|
properties: {
|
||||||
@ -78,10 +78,6 @@ exports.transition = function (showDefaultValue) {
|
|||||||
var _this = this;
|
var _this = this;
|
||||||
var _a = this.data, classNames = _a.classNames, duration = _a.duration;
|
var _a = this.data, classNames = _a.classNames, duration = _a.duration;
|
||||||
var currentDuration = utils_1.isObj(duration) ? duration.leave : duration;
|
var currentDuration = utils_1.isObj(duration) ? duration.leave : duration;
|
||||||
if (+currentDuration === 0) {
|
|
||||||
this.onTransitionEnd();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
Promise.resolve()
|
Promise.resolve()
|
||||||
.then(nextTick)
|
.then(nextTick)
|
||||||
.then(function () {
|
.then(function () {
|
||||||
@ -90,6 +86,7 @@ exports.transition = function (showDefaultValue) {
|
|||||||
currentDuration: currentDuration
|
currentDuration: currentDuration
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
|
.then(function () { return setTimeout(function () { return _this.onTransitionEnd(); }, currentDuration); })
|
||||||
.then(nextTick)
|
.then(nextTick)
|
||||||
.then(function () {
|
.then(function () {
|
||||||
return _this.set({
|
return _this.set({
|
||||||
|
@ -23,7 +23,7 @@ component_1.VantComponent({
|
|||||||
},
|
},
|
||||||
delay: {
|
delay: {
|
||||||
type: Number,
|
type: Number,
|
||||||
value: 0
|
value: 1
|
||||||
},
|
},
|
||||||
speed: {
|
speed: {
|
||||||
type: Number,
|
type: Number,
|
||||||
@ -44,11 +44,11 @@ component_1.VantComponent({
|
|||||||
backgroundColor: {
|
backgroundColor: {
|
||||||
type: String,
|
type: String,
|
||||||
value: BG_COLOR
|
value: BG_COLOR
|
||||||
}
|
},
|
||||||
|
wrapable: Boolean
|
||||||
},
|
},
|
||||||
data: {
|
data: {
|
||||||
show: true,
|
show: true
|
||||||
hasRightIcon: false
|
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
text: function () {
|
text: function () {
|
||||||
@ -56,11 +56,6 @@ component_1.VantComponent({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
created: function () {
|
created: function () {
|
||||||
if (this.data.mode) {
|
|
||||||
this.set({
|
|
||||||
hasRightIcon: true
|
|
||||||
});
|
|
||||||
}
|
|
||||||
this.resetAnimation = wx.createAnimation({
|
this.resetAnimation = wx.createAnimation({
|
||||||
duration: 0,
|
duration: 0,
|
||||||
timingFunction: 'linear'
|
timingFunction: 'linear'
|
||||||
@ -74,7 +69,7 @@ component_1.VantComponent({
|
|||||||
var _this = this;
|
var _this = this;
|
||||||
Promise.all([
|
Promise.all([
|
||||||
this.getRect('.van-notice-bar__content'),
|
this.getRect('.van-notice-bar__content'),
|
||||||
this.getRect('.van-notice-bar__content-wrap')
|
this.getRect('.van-notice-bar__wrap')
|
||||||
]).then(function (rects) {
|
]).then(function (rects) {
|
||||||
var contentRect = rects[0], wrapRect = rects[1];
|
var contentRect = rects[0], wrapRect = rects[1];
|
||||||
if (contentRect == null ||
|
if (contentRect == null ||
|
||||||
|
@ -1,16 +1,20 @@
|
|||||||
|
<wxs src="../wxs/utils.wxs" module="utils" />
|
||||||
|
|
||||||
<view
|
<view
|
||||||
wx:if="{{ show }}"
|
wx:if="{{ show }}"
|
||||||
class="custom-class van-notice-bar {{ hasRightIcon ? 'van-notice-bar--within-icon' : '' }}"
|
class="custom-class {{ utils.bem('notice-bar', { withicon: mode, wrapable }) }}"
|
||||||
style="color: {{ color }}; background-color: {{ backgroundColor }};"
|
style="color: {{ color }}; background-color: {{ backgroundColor }};"
|
||||||
bind:tap="onClick"
|
bind:tap="onClick"
|
||||||
>
|
>
|
||||||
<image
|
<van-icon
|
||||||
wx:if="{{ leftIcon }}"
|
wx:if="{{ leftIcon }}"
|
||||||
src="{{ leftIcon }}"
|
size="16px"
|
||||||
|
name="{{ leftIcon }}"
|
||||||
class="van-notice-bar__left-icon"
|
class="van-notice-bar__left-icon"
|
||||||
/>
|
/>
|
||||||
<view class="van-notice-bar__content-wrap">
|
|
||||||
<view class="van-notice-bar__content {{ scrollable ? '' : 'van-ellipsis' }}" animation="{{ animationData }}">
|
<view class="van-notice-bar__wrap">
|
||||||
|
<view class="van-notice-bar__content {{ !scrollable && !wrapable ? 'van-ellipsis' : '' }}" animation="{{ animationData }}">
|
||||||
{{ text }}
|
{{ text }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -1 +1 @@
|
|||||||
@import '../common/index.wxss';.van-notice-bar{display:-webkit-flex;display:flex;height:40px;padding:0 15px;font-size:14px;line-height:24px;-webkit-align-items:center;align-items:center}.van-notice-bar--within-icon{position:relative;padding-right:40px}.van-notice-bar__left-icon{width:16px;height:16px;margin-right:4px}.van-notice-bar__right-icon{position:absolute;top:10px;right:15px;font-size:16px}.van-notice-bar__content-wrap{position:relative;height:24px;overflow:hidden;-webkit-flex:1;flex:1}.van-notice-bar__content{position:absolute;white-space:nowrap}.van-notice-bar__content.van-ellipsis{max-width:100%}
|
@import '../common/index.wxss';.van-notice-bar{display:-webkit-flex;display:flex;height:40px;padding:0 15px;font-size:14px;line-height:24px;-webkit-align-items:center;align-items:center}.van-notice-bar--withicon{position:relative;padding-right:40px}.van-notice-bar--wrapable{height:auto;padding:8px 15px}.van-notice-bar--wrapable .van-notice-bar__wrap{height:auto}.van-notice-bar--wrapable .van-notice-bar__content{position:relative;white-space:normal}.van-notice-bar__left-icon{display:-webkit-flex;display:flex;margin-right:4px;vertical-align:middle;-webkit-align-items:center;align-items:center}.van-notice-bar__right-icon{position:absolute;top:10px;right:15px;font-size:16px}.van-notice-bar__wrap{position:relative;height:24px;overflow:hidden;-webkit-flex:1;flex:1}.van-notice-bar__content{position:absolute;white-space:nowrap}.van-notice-bar__content.van-ellipsis{max-width:100%}
|
@ -16,8 +16,10 @@ component_1.VantComponent({
|
|||||||
field: true,
|
field: true,
|
||||||
classes: ['icon-class'],
|
classes: ['icon-class'],
|
||||||
props: {
|
props: {
|
||||||
|
value: Number,
|
||||||
readonly: Boolean,
|
readonly: Boolean,
|
||||||
disabled: Boolean,
|
disabled: Boolean,
|
||||||
|
allowHalf: Boolean,
|
||||||
size: {
|
size: {
|
||||||
type: Number,
|
type: Number,
|
||||||
value: 20
|
value: 20
|
||||||
@ -45,10 +47,6 @@ component_1.VantComponent({
|
|||||||
count: {
|
count: {
|
||||||
type: Number,
|
type: Number,
|
||||||
value: 5
|
value: 5
|
||||||
},
|
|
||||||
value: {
|
|
||||||
type: Number,
|
|
||||||
value: 0
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data: {
|
data: {
|
||||||
@ -61,27 +59,23 @@ component_1.VantComponent({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
|
||||||
list: function () {
|
|
||||||
var _a = this.data, count = _a.count, innerValue = _a.innerValue;
|
|
||||||
return Array.from({ length: count }, function (_, index) { return index < innerValue; });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
methods: {
|
||||||
onSelect: function (event) {
|
onSelect: function (event) {
|
||||||
var data = this.data;
|
var data = this.data;
|
||||||
var index = event.currentTarget.dataset.index;
|
var score = event.currentTarget.dataset.score;
|
||||||
if (!data.disabled && !data.readonly) {
|
if (!data.disabled && !data.readonly) {
|
||||||
this.set({ innerValue: index + 1 });
|
this.set({ innerValue: score + 1 });
|
||||||
this.$emit('input', index + 1);
|
this.$emit('input', score + 1);
|
||||||
this.$emit('change', index + 1);
|
this.$emit('change', score + 1);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onTouchMove: function (event) {
|
onTouchMove: function (event) {
|
||||||
var _this = this;
|
var _this = this;
|
||||||
var _a = event.touches[0], clientX = _a.clientX, clientY = _a.clientY;
|
var _a = event.touches[0], clientX = _a.clientX, clientY = _a.clientY;
|
||||||
this.getRect('.van-rate__item', true).then(function (list) {
|
this.getRect('.van-rate__icon', true).then(function (list) {
|
||||||
var target = list.find(function (item) {
|
var target = list
|
||||||
|
.sort(function (item) { return item.right - item.left; })
|
||||||
|
.find(function (item) {
|
||||||
return clientX >= item.left &&
|
return clientX >= item.left &&
|
||||||
clientX <= item.right &&
|
clientX <= item.right &&
|
||||||
clientY >= item.top &&
|
clientY >= item.top &&
|
||||||
|
@ -1,16 +1,32 @@
|
|||||||
|
<wxs src="../wxs/utils.wxs" module="utils" />
|
||||||
|
|
||||||
<view
|
<view
|
||||||
class="van-rate custom-class"
|
class="van-rate custom-class"
|
||||||
bind:touchmove="onTouchMove"
|
bind:touchmove="onTouchMove"
|
||||||
>
|
>
|
||||||
<van-icon
|
<view
|
||||||
wx:for="{{ list }}"
|
|
||||||
wx:key="index"
|
|
||||||
class="van-rate__item"
|
class="van-rate__item"
|
||||||
custom-class="icon-class"
|
wx:for="{{ count }}"
|
||||||
size="{{ size }}px"
|
wx:key="index"
|
||||||
data-index="{{ index }}"
|
style="font-size: {{ size}}px;"
|
||||||
name="{{ item ? icon : voidIcon }}"
|
>
|
||||||
color="{{ disabled ? disabledColor : item ? color : voidColor }}"
|
<van-icon
|
||||||
bind:click="onSelect"
|
name="{{ index + 1 <= innerValue ? icon : voidIcon }}"
|
||||||
/>
|
class="van-rate__icon"
|
||||||
|
custom-class="icon-class"
|
||||||
|
data-score="{{ index }}"
|
||||||
|
color="{{ disabled ? disabledColor : index + 1 <= innerValue ? color : voidColor }}"
|
||||||
|
bind:click="onSelect"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<van-icon
|
||||||
|
wx:if="{{ allowHalf }}"
|
||||||
|
name="{{ index + 0.5 <= innerValue ? icon : voidIcon }}"
|
||||||
|
class="{{ utils.bem('rate__icon', ['half']) }}"
|
||||||
|
custom-class="icon-class"
|
||||||
|
data-score="{{ index - 0.5 }}"
|
||||||
|
color="{{ disabled ? disabledColor : index + 0.5 <= innerValue ? color : voidColor }}"
|
||||||
|
bind:click="onSelect"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -1 +1 @@
|
|||||||
@import '../common/index.wxss';.van-rate{-webkit-user-select:none;user-select:none}.van-rate__item{width:1em;padding:0 2px;box-sizing:initial}
|
@import '../common/index.wxss';.van-rate{-webkit-user-select:none;user-select:none}.van-rate__item{position:relative;display:inline-block;padding:0 2px}.van-rate__icon{display:block;height:1em}.van-rate__icon--half{position:absolute;top:0;left:2px;width:.5em;overflow:hidden}
|
Loading…
x
Reference in New Issue
Block a user