blackteay/vant-weapp
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant-weapp.git synced 2025-04-26 03:26:35 +08:00
Code Issues Projects Releases Wiki Activity

feat(SubmitBar): style update (#2755)

Browse Source 
* feat(SubmitBar): style update

* feat(SubmitBar): code optimize

* feat(SubmitBar): code adjustment

* feat(SubmitBar): code adjustment
This commit is contained in:
Lindy 2020-02-21 16:39:33 +08:00 committed by GitHub
parent 855cfa5d94
commit 4b58899594
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 23 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/common/style/var.less
View File

@ -415,8 +415,8 @@
@submit-bar-background-color: @white; @submit-bar-background-color: @white;
@submit-bar-button-width: 110px; @submit-bar-button-width: 110px;
@submit-bar-price-color: @red; @submit-bar-price-color: @red;
@submit-bar-price-font-size: 18px; @submit-bar-price-font-size: @font-size-sm;
@submit-bar-currency-font-size: 14px; @submit-bar-currency-font-size: @font-size-sm;
@submit-bar-text-color: @text-color; @submit-bar-text-color: @text-color;
@submit-bar-text-font-size: 14px; @submit-bar-text-font-size: 14px;
@submit-bar-tip-padding: 10px; @submit-bar-tip-padding: 10px;
@ -425,6 +425,10 @@
@submit-bar-tip-color: #f56723; @submit-bar-tip-color: #f56723;
@submit-bar-tip-background-color: #fff7cc; @submit-bar-tip-background-color: #fff7cc;
@submit-bar-tip-icon-size: 12px; @submit-bar-tip-icon-size: 12px;
@submit-bar-button-height: 40px;
@submit-bar-padding: 0 @padding-md;
@submit-bar-price-integer-font-size: 20px;
@submit-bar-price-font-family: @price-integer-font-family;
// Tabbar // Tabbar
@tabbar-height: 50px; @tabbar-height: 50px;

12
packages/submit-bar/index.less
View File

@ -40,6 +40,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-end; justify-content: flex-end;
.theme(padding, '@submit-bar-padding');
.theme(height, '@submit-bar-height'); .theme(height, '@submit-bar-height');
.theme(font-size, '@submit-bar-text-font-size'); .theme(font-size, '@submit-bar-text-font-size');
.theme(background-color, '@submit-bar-background-color'); .theme(background-color, '@submit-bar-background-color');
@ -60,7 +61,13 @@
&__price { &__price {
.theme(color, '@submit-bar-price-color'); .theme(color, '@submit-bar-price-color');
.theme(font-weight, '@font-weight-bold');
.theme(font-size, '@submit-bar-price-font-size'); .theme(font-size, '@submit-bar-price-font-size');
&-integer {
font-size: @submit-bar-price-integer-font-size;
font-family: @submit-bar-price-font-family;
}
} }
&__currency { &__currency {
@ -72,6 +79,9 @@
} }
&__button { &__button {
.theme(width, '@submit-bar-button-width'); .theme(width,'@submit-bar-button-width');
.theme(font-weight, '@font-weight-bold');
.theme(--button-default-height, '@submit-bar-button-height') !important;
.theme(--button-line-height, '@submit-bar-button-height') !important;
} }
} }

4
packages/submit-bar/index.ts
View File

@ -46,9 +46,11 @@ VantComponent({
methods: { methods: {
updatePrice() { updatePrice() {
const { price, decimalLength } = this.data; const { price, decimalLength } = this.data;
const priceStrArr = typeof price === 'number' && (price / 100).toFixed(decimalLength).split('.');
this.setData({ this.setData({
hasPrice: typeof price === 'number', hasPrice: typeof price === 'number',
priceStr: (price / 100).toFixed(decimalLength) integerStr: priceStrArr && priceStrArr[0],
decimalStr: decimalLength && priceStrArr ? `.${priceStrArr[1]}` : ''
}); });
}, },

6
packages/submit-bar/index.wxml
View File

@ -22,18 +22,18 @@
<text>{{ label || '合计：' }}</text> <text>{{ label || '合计：' }}</text>
<text class="van-submit-bar__price price-class"> <text class="van-submit-bar__price price-class">
<text class="van-submit-bar__currency">{{ currency }} </text> <text class="van-submit-bar__currency">{{ currency }} </text>
<text>{{ priceStr }}</text> <text class="van-submit-bar__price-integer">{{ integerStr }}</text><text>{{decimalStr}}</text>
</text> </text>
<text class="van-submit-bar__suffix-label">{{ suffixLabel }}</text> <text class="van-submit-bar__suffix-label">{{ suffixLabel }}</text>
</view> </view>
<van-button <van-button
square round
size="large"
type="{{ buttonType }}" type="{{ buttonType }}"
loading="{{ loading }}" loading="{{ loading }}"
disabled="{{ disabled }}" disabled="{{ disabled }}"
class="van-submit-bar__button" class="van-submit-bar__button"
custom-class="button-class" custom-class="button-class"
custom-style="width: 100%;"
bind:click="onSubmit" bind:click="onSubmit"
> >
{{ loading ? '' : buttonText }} {{ loading ? '' : buttonText }}