123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111 |
- import { createNamespace } from '../utils';
- import { RED } from '../utils/constant';
- import { padZero } from '../utils/format/string';
- import Checkbox from '../checkbox';
- var _createNamespace = createNamespace('coupon'),
- createComponent = _createNamespace[0],
- bem = _createNamespace[1],
- t = _createNamespace[2];
- function formatTimeStamp(timeStamp) {
- // compatible when the timestamp is seconds
- if (timeStamp < Math.pow(10, 12)) {
- return timeStamp * 1000;
- }
- return +timeStamp;
- }
- function getDate(timeStamp) {
- var date = new Date(formatTimeStamp(timeStamp));
- return date.getFullYear() + "." + padZero(date.getMonth() + 1) + "." + padZero(date.getDate());
- }
- function formatDiscount(discount) {
- return (discount / 10).toFixed(discount % 10 === 0 ? 0 : 1);
- }
- function formatAmount(amount) {
- return (amount / 100).toFixed(amount % 100 === 0 ? 0 : amount % 10 === 0 ? 1 : 2);
- }
- export default createComponent({
- props: {
- coupon: Object,
- chosen: Boolean,
- disabled: Boolean,
- currency: {
- type: String,
- default: '¥'
- }
- },
- computed: {
- validPeriod: function validPeriod() {
- var _this$coupon = this.coupon,
- startAt = _this$coupon.startAt,
- endAt = _this$coupon.endAt,
- customValidPeriod = _this$coupon.customValidPeriod;
- return customValidPeriod || getDate(startAt) + " - " + getDate(endAt);
- },
- faceAmount: function faceAmount() {
- var coupon = this.coupon;
- if (coupon.valueDesc) {
- return coupon.valueDesc + "<span>" + (coupon.unitDesc || '') + "</span>";
- }
- if (coupon.denominations) {
- var denominations = formatAmount(coupon.denominations);
- return "<span>" + this.currency + "</span> " + denominations;
- }
- if (coupon.discount) {
- return t('discount', formatDiscount(coupon.discount));
- }
- return '';
- },
- conditionMessage: function conditionMessage() {
- var condition = formatAmount(this.coupon.originCondition);
- return condition === '0' ? t('unlimited') : t('condition', condition);
- }
- },
- render: function render() {
- var h = arguments[0];
- var coupon = this.coupon,
- disabled = this.disabled;
- var description = disabled && coupon.reason || coupon.description;
- return h("div", {
- "class": bem({
- disabled: disabled
- })
- }, [h("div", {
- "class": bem('content')
- }, [h("div", {
- "class": bem('head')
- }, [h("h2", {
- "class": bem('amount'),
- "domProps": {
- "innerHTML": this.faceAmount
- }
- }), h("p", {
- "class": bem('condition')
- }, [this.coupon.condition || this.conditionMessage])]), h("div", {
- "class": bem('body')
- }, [h("p", {
- "class": bem('name')
- }, [coupon.name]), h("p", {
- "class": bem('valid')
- }, [this.validPeriod]), !this.disabled && h(Checkbox, {
- "attrs": {
- "size": 18,
- "value": this.chosen,
- "checkedColor": RED
- },
- "class": bem('corner')
- })])]), description && h("p", {
- "class": bem('description')
- }, [description])]);
- }
- });
|