[Improvement] component use bem mixin (#921)
This commit is contained in:
@@ -1,17 +1,17 @@
|
||||
<template>
|
||||
<div class="van-coupon-item" :class="{ 'van-coupon-item--disabled': disabled }">
|
||||
<div class="van-coupon-item__head">
|
||||
<div class="van-coupon-item__lines" />
|
||||
<div class="van-coupon-item__gradient">
|
||||
<div :class="b({ disabled })">
|
||||
<div :class="b('head')">
|
||||
<div :class="b('lines')" />
|
||||
<div :class="b('gradient')">
|
||||
<h2 v-html="faceAmount" />
|
||||
<p>{{ conditionMessage }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-coupon-item__body">
|
||||
<div :class="b('body')">
|
||||
<h2>{{ data.name }}</h2>
|
||||
<span>{{ validPeriod }}</span>
|
||||
<p v-if="disabled && data.reason">{{ data.reason }}</p>
|
||||
<div class="van-coupon-item__corner" v-if="chosen">
|
||||
<div v-if="chosen" :class="b('corner')" >
|
||||
<icon name="success" />
|
||||
</div>
|
||||
</div>
|
||||
@@ -34,6 +34,7 @@ export default create({
|
||||
validPeriod() {
|
||||
return `${this.getDate(this.data.start_at)}-${this.getDate(this.data.end_at)}`;
|
||||
},
|
||||
|
||||
faceAmount() {
|
||||
return this.data.denominations !== 0
|
||||
? `<span>¥</span> ${this.formatAmount(this.data.denominations)}`
|
||||
@@ -41,6 +42,7 @@ export default create({
|
||||
? this.formatDiscount(this.data.discount)
|
||||
: '';
|
||||
},
|
||||
|
||||
conditionMessage() {
|
||||
let condition = this.data.origin_condition;
|
||||
condition = condition % 100 === 0 ? Math.round(condition / 100) : (condition / 100).toFixed(2);
|
||||
@@ -53,12 +55,15 @@ export default create({
|
||||
const date = new Date(timeStamp * 1000);
|
||||
return `${date.getFullYear()}.${this.padZero(date.getMonth() + 1)}.${this.padZero(date.getDate())}`;
|
||||
},
|
||||
|
||||
padZero(num) {
|
||||
return (num < 10 ? '0' : '') + num;
|
||||
},
|
||||
|
||||
formatDiscount(discount) {
|
||||
return this.$t('discount', `${(discount / 10).toFixed(discount % 10 === 0 ? 0 : 1)}`);
|
||||
},
|
||||
|
||||
formatAmount(amount) {
|
||||
return (amount / 100).toFixed(amount % 100 === 0 ? 0 : amount % 10 === 0 ? 1 : 2);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user