Merge branch 'dev' into next
This commit is contained in:
chenjiahan
@@ -254,7 +254,6 @@ export default createComponent({
|
||||
() => props.realRowHeight,
|
||||
() => {
|
||||
height.value = useRect(monthRef).height;
|
||||
console.log('height.value', height.value);
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
+14
-13
@@ -1,5 +1,6 @@
|
||||
// Utils
|
||||
import { pick } from '../utils';
|
||||
import { raf } from '../utils/dom/raf';
|
||||
import { isDate } from '../utils/validate/date';
|
||||
import { getScrollTop } from '../utils/dom/scroll';
|
||||
import {
|
||||
@@ -191,13 +192,13 @@ export default createComponent({
|
||||
this.$refs.body.getBoundingClientRect().height
|
||||
);
|
||||
this.onScroll();
|
||||
this.scrollIntoView();
|
||||
});
|
||||
this.scrollIntoView();
|
||||
},
|
||||
|
||||
// scroll to current month
|
||||
scrollIntoView() {
|
||||
this.$nextTick(() => {
|
||||
raf(() => {
|
||||
const { currentDate } = this;
|
||||
|
||||
if (!currentDate) {
|
||||
@@ -258,31 +259,27 @@ export default createComponent({
|
||||
const { body } = this.$refs;
|
||||
const { months, monthRefs } = this;
|
||||
const top = getScrollTop(body);
|
||||
const bottom = top + this.bodyHeight;
|
||||
|
||||
const heights = months.map(
|
||||
(item, index) => monthRefs[index].height.value
|
||||
);
|
||||
const heightSum = heights.reduce((a, b) => a + b, 0);
|
||||
|
||||
// iOS scroll bounce may exceed the range
|
||||
let bottom = top + this.bodyHeight;
|
||||
if (bottom > heightSum && top > 0) {
|
||||
bottom = heightSum;
|
||||
return;
|
||||
}
|
||||
|
||||
let height = 0;
|
||||
let currentMonth;
|
||||
|
||||
// add offset to avoid rem accuracy issues
|
||||
// see: https://github.com/youzan/vant/issues/6929
|
||||
const viewportOffset = 50;
|
||||
const viewportTop = top - viewportOffset;
|
||||
const viewportBottom = bottom + viewportOffset;
|
||||
let visibleIndex;
|
||||
|
||||
for (let i = 0; i < months.length; i++) {
|
||||
const visible =
|
||||
height <= viewportBottom && height + heights[i] >= viewportTop;
|
||||
const visible = height <= bottom && height + heights[i] >= top;
|
||||
|
||||
if (visible && !currentMonth) {
|
||||
visibleIndex = i;
|
||||
currentMonth = monthRefs[i];
|
||||
}
|
||||
|
||||
@@ -293,10 +290,14 @@ export default createComponent({
|
||||
});
|
||||
}
|
||||
|
||||
monthRefs[i].setVisible(visible);
|
||||
height += heights[i];
|
||||
}
|
||||
|
||||
months.forEach((month, index) => {
|
||||
const visible = index >= visibleIndex - 1 && index <= visibleIndex + 1;
|
||||
monthRefs[index].setVisible(visible);
|
||||
});
|
||||
|
||||
/* istanbul ignore else */
|
||||
if (currentMonth) {
|
||||
this.subtitle = currentMonth.getTitle();
|
||||
|
||||
@@ -139,40 +139,7 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
<div class="van-calendar__month" style="padding-bottom: 0px;">
|
||||
<div class="van-calendar__month-title">2012年3月</div>
|
||||
<div role="grid" class="van-calendar__days">
|
||||
<div class="van-calendar__month-mark">3</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day" style="margin-left: 57.142857142857146%;">1</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">2</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">3</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">4</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">5</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">6</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">7</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">8</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">9</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">10</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">11</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">12</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">13</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">14</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">15</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">16</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">17</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">18</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">19</div>
|
||||
<div role="gridcell" tabindex="-1" class="van-calendar__day">20</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">21</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">22</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">23</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">24</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">25</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">26</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">27</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">28</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">29</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">30</div>
|
||||
<div role="gridcell" class="van-calendar__day van-calendar__day--disabled">31</div>
|
||||
</div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-calendar__footer"></div>
|
||||
|
||||
@@ -97,7 +97,7 @@ app.use(CellGroup);
|
||||
<van-cell title="单元格" icon="shop-o">
|
||||
<!-- 使用 right-icon 插槽来自定义右侧图标 -->
|
||||
<template #right-icon>
|
||||
<van-icon name="search" class="search=icon" />
|
||||
<van-icon name="search" class="search-icon" />
|
||||
</template>
|
||||
</van-cell>
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { createNamespace } from '../utils';
|
||||
import { isDef, createNamespace } from '../utils';
|
||||
import Cell from '../cell';
|
||||
|
||||
const [createComponent, bem, t] = createNamespace('coupon-cell');
|
||||
@@ -8,7 +8,14 @@ function formatValue(props) {
|
||||
const coupon = coupons[+chosenCoupon];
|
||||
|
||||
if (coupon) {
|
||||
const value = coupon.value || coupon.denominations || 0;
|
||||
let value = 0;
|
||||
|
||||
if (isDef(coupon.value)) {
|
||||
({ value } = coupon);
|
||||
} else if (isDef(coupon.denominations)) {
|
||||
value = coupon.denominations;
|
||||
}
|
||||
|
||||
return `-${currency} ${(value / 100).toFixed(2)}`;
|
||||
}
|
||||
|
||||
|
||||
@@ -54,6 +54,15 @@ exports[`render coupon cell with coupon 1`] = `
|
||||
</div>
|
||||
`;
|
||||
|
||||
|
||||
exports[`render coupon cell with zero discount 1`] = `
|
||||
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-coupon-cell">
|
||||
<div class="van-cell__title"><span>优惠券</span></div>
|
||||
<div class="van-cell__value van-coupon-cell__value van-coupon-cell__value--selected"><span>-¥ 0.00</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
|
||||
<!----></i>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`render coupon list 1`] = `
|
||||
<div class="van-coupon-list">
|
||||
<div class="van-coupon-list__exchange-bar">
|
||||
|
||||
@@ -26,6 +26,12 @@ const coupon3 = {
|
||||
denominations: 123,
|
||||
};
|
||||
|
||||
const coupon4 = {
|
||||
...coupon,
|
||||
startAt: 1600327871,
|
||||
endAt: 1700327871,
|
||||
};
|
||||
|
||||
const emptyCoupon = {
|
||||
id: 0,
|
||||
discount: 0,
|
||||
@@ -162,3 +168,13 @@ test('render coupon cell with coupon', () => {
|
||||
});
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('render coupon cell with zero discount', () => {
|
||||
const wrapper = mount(CouponCell, {
|
||||
propsData: {
|
||||
coupons: [{ ...coupon4, value: 0, denominations: 150 }],
|
||||
chosenCoupon: 0,
|
||||
},
|
||||
});
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
@@ -55,10 +55,10 @@
|
||||
|
||||
&:disabled {
|
||||
color: @field-input-disabled-text-color;
|
||||
background-color: transparent;
|
||||
cursor: not-allowed;
|
||||
opacity: 1;
|
||||
-webkit-text-fill-color: currentColor; // fix disabled color in iOS
|
||||
// fix disabled color in mobile safari
|
||||
-webkit-text-fill-color: @field-input-disabled-text-color;
|
||||
}
|
||||
|
||||
&:read-only {
|
||||
|
||||
+2
-2
@@ -243,8 +243,8 @@ export default createComponent({
|
||||
state.rect = rect;
|
||||
state.swiping = true;
|
||||
state.active = active;
|
||||
state.width = Math.round(+props.width || rect.width);
|
||||
state.height = Math.round(+props.height || rect.height);
|
||||
state.width = Math.floor(+props.width || rect.width);
|
||||
state.height = Math.floor(+props.height || rect.height);
|
||||
state.offset = getTargetOffset(active);
|
||||
children.forEach((swipe) => {
|
||||
swipe.setOffset(0);
|
||||
|
||||
@@ -41,7 +41,8 @@
|
||||
background-color: @swipe-indicator-inactive-background-color;
|
||||
border-radius: 100%;
|
||||
opacity: @swipe-indicator-inactive-opacity;
|
||||
transition: opacity 0.2s;
|
||||
transition: opacity @animation-duration-fast,
|
||||
background-color @animation-duration-fast;
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: @swipe-indicator-size;
|
||||
|
||||
Reference in New Issue
Block a user