feat(SubmitBar): SubmitBar组件样式调整及新增文案对齐方向属性 (#5130)

This commit is contained in:
Lindy
2019-11-28 19:07:50 +08:00
committed by neverland
parent 00f6b5274f
commit a7ae694dbb
9 changed files with 61 additions and 23 deletions
@@ -5,7 +5,7 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-submit-bar">
<div class="van-submit-bar__bar">
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥ 30.50</span></div><button class="van-button van-button--danger van-button--large van-button--square van-submit-bar__button"><span class="van-button__text">提交订单</span></button>
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥<span class="van-submit-bar__price van-submit-bar__price--integer">30</span>.50</span></div><button class="van-button van-button--danger van-button--normal van-button--round van-submit-bar__button van-submit-bar__button--danger"><span class="van-button__text">提交订单</span></button>
</div>
</div>
</div>
@@ -14,14 +14,14 @@ exports[`renders demo correctly 1`] = `
<div class="van-submit-bar__tip"><i class="van-icon van-icon-info-o van-submit-bar__tip-icon">
<!----></i><span class="van-submit-bar__tip-text">你的收货地址不支持同城送, 我们已为你推荐快递</span></div>
<div class="van-submit-bar__bar">
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥ 30.50</span></div><button disabled="disabled" class="van-button van-button--danger van-button--large van-button--disabled van-button--square van-submit-bar__button"><span class="van-button__text">提交订单</span></button>
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥<span class="van-submit-bar__price van-submit-bar__price--integer">30</span>.50</span></div><button disabled="disabled" class="van-button van-button--danger van-button--normal van-button--disabled van-button--round van-submit-bar__button van-submit-bar__button--danger"><span class="van-button__text">提交订单</span></button>
</div>
</div>
</div>
<div>
<div class="van-submit-bar">
<div class="van-submit-bar__bar">
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥ 30.50</span></div><button class="van-button van-button--danger van-button--large van-button--square van-submit-bar__button">
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥<span class="van-submit-bar__price van-submit-bar__price--integer">30</span>.50</span></div><button class="van-button van-button--danger van-button--normal van-button--round van-submit-bar__button van-submit-bar__button--danger">
<div class="van-loading van-loading--circular van-button__loading"><span class="van-loading__spinner van-loading__spinner--circular" style="color: currentColor; width: 20px; height: 20px;"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
</button>
</div>
@@ -39,7 +39,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-checkbox__icon van-checkbox__icon--round van-checkbox__icon--checked"><i class="van-icon van-icon-success">
<!----></i></div><span class="van-checkbox__label">全选</span>
</div>
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥ 30.50</span></div><button class="van-button van-button--danger van-button--large van-button--square van-submit-bar__button"><span class="van-button__text">提交订单</span></button>
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥<span class="van-submit-bar__price van-submit-bar__price--integer">30</span>.50</span></div><button class="van-button van-button--danger van-button--normal van-button--round van-submit-bar__button van-submit-bar__button--danger"><span class="van-button__text">提交订单</span></button>
</div>
</div>
</div>
@@ -3,7 +3,7 @@
exports[`decimal-length prop 1`] = `
<div class="van-submit-bar">
<div class="van-submit-bar__bar">
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥ 1.1</span></div><button class="van-button van-button--danger van-button--large van-button--square van-submit-bar__button"></button>
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥<span class="van-submit-bar__price van-submit-bar__price--integer">1</span>.1</span></div><button class="van-button van-button--danger van-button--normal van-button--round van-submit-bar__button van-submit-bar__button--danger"></button>
</div>
</div>
`;
@@ -11,7 +11,7 @@ exports[`decimal-length prop 1`] = `
exports[`disable submit 1`] = `
<div class="van-submit-bar">
<div class="van-submit-bar__bar">
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥ 0.01</span></div><button disabled="disabled" class="van-button van-button--danger van-button--large van-button--disabled van-button--square van-submit-bar__button"></button>
<div class="van-submit-bar__text"><span>合计:</span><span class="van-submit-bar__price">¥<span class="van-submit-bar__price van-submit-bar__price--integer">0</span>.01</span></div><button disabled="disabled" class="van-button van-button--danger van-button--normal van-button--disabled van-button--round van-submit-bar__button van-submit-bar__button--danger"></button>
</div>
</div>
`;
@@ -19,18 +19,26 @@ exports[`disable submit 1`] = `
exports[`suffix-label prop 1`] = `
<div class="van-submit-bar">
<div class="van-submit-bar__bar">
<div class="van-submit-bar__text"><span>Label</span><span class="van-submit-bar__price">¥ 1.11</span><span class="van-submit-bar__suffix-label">Suffix Label</span></div><button class="van-button van-button--danger van-button--large van-button--square van-submit-bar__button"></button>
<div class="van-submit-bar__text"><span>Label</span><span class="van-submit-bar__price">¥<span class="van-submit-bar__price van-submit-bar__price--integer">1</span>.11</span><span class="van-submit-bar__suffix-label">Suffix Label</span></div><button class="van-button van-button--danger van-button--normal van-button--round van-submit-bar__button van-submit-bar__button--danger"></button>
</div>
</div>
`;
exports[`text-align prop 1`] = `
<div class="van-submit-bar">
<div class="van-submit-bar__bar">
<div class="van-submit-bar__text" style="text-align: left;"><span>合计:</span><span class="van-submit-bar__price">¥<span class="van-submit-bar__price van-submit-bar__price--integer">1</span>.11</span></div><button class="van-button van-button--danger van-button--normal van-button--round van-submit-bar__button van-submit-bar__button--danger"></button>
</div>
</div>
`;
exports[`top slot 1`] = `
<div class="van-submit-bar">top<div class="van-submit-bar__bar"><button class="van-button van-button--danger van-button--large van-button--square van-submit-bar__button"></button></div>
<div class="van-submit-bar">top<div class="van-submit-bar__bar"><button class="van-button van-button--danger van-button--normal van-button--round van-submit-bar__button van-submit-bar__button--danger"></button></div>
</div>
`;
exports[`without price 1`] = `
<div class="van-submit-bar">
<div class="van-submit-bar__bar"><button class="van-button van-button--danger van-button--large van-button--square van-submit-bar__button"></button></div>
<div class="van-submit-bar__bar"><button class="van-button van-button--danger van-button--normal van-button--round van-submit-bar__button van-submit-bar__button--danger"></button></div>
</div>
`;
+12
View File
@@ -85,3 +85,15 @@ test('suffix-label prop', () => {
expect(wrapper).toMatchSnapshot();
});
test('text-align prop', () => {
const wrapper = mount(SubmitBar, {
context: {
props: {
price: 111,
textAlign: 'left'
}
}
});
expect(wrapper).toMatchSnapshot();
});