@chatui/core
Version:
The React library for Chatbot UI
81 lines • 2.9 kB
JavaScript
import React from 'react';
import clsx from 'clsx';
import { Price } from '../Price';
import { Button } from '../Button';
import { Flex, FlexItem } from '../Flex';
import { Text } from '../Text';
import { StatusBadge } from '../StatusBadge';
import { formatExpireTime } from '../../utils/date';
var statusLabelMap = {
normal: '',
nearExpired: '快失效',
expired: '已过期',
used: '已使用'
};
export var Coupon = function Coupon(props) {
var className = props.className,
value = props.value,
discount = props.discount,
condition = props.condition,
name = props.name,
endAt = props.endAt,
dateDesc = props.dateDesc,
desc = props.desc,
_props$status = props.status,
status = _props$status === void 0 ? 'normal' : _props$status,
_props$inList = props.inList,
inList = _props$inList === void 0 ? false : _props$inList,
_props$btnText = props.btnText,
btnText = _props$btnText === void 0 ? '查看' : _props$btnText,
onClick = props.onClick;
var statusLabel = statusLabelMap[status] || '';
return /*#__PURE__*/React.createElement(Flex, {
className: clsx('Coupon', className),
"data-status": status,
"data-in-list": inList,
onClick: inList ? undefined : onClick
}, /*#__PURE__*/React.createElement(Flex, {
className: "Coupon-object",
center: true,
direction: "column"
}, value ? /*#__PURE__*/React.createElement(Price, {
className: "Coupon-value",
price: value,
currency: "\xA5",
autoFit: true
}) : discount ? /*#__PURE__*/React.createElement("div", {
className: "Coupon-discount Price",
"data-size": "xl"
}, /*#__PURE__*/React.createElement("span", {
className: "Price-integer"
}, discount), /*#__PURE__*/React.createElement("span", {
className: "Coupon-discount-suffix"
}, "\u6298")) : null, /*#__PURE__*/React.createElement(Text, {
className: "Coupon-condition",
truncate: true
}, condition)), /*#__PURE__*/React.createElement("div", {
className: "Coupon-divider"
}), /*#__PURE__*/React.createElement(FlexItem, {
className: "Coupon-main"
}, /*#__PURE__*/React.createElement(Text, {
className: "Coupon-name",
truncate: true
}, name), dateDesc ? /*#__PURE__*/React.createElement(Text, {
className: "Coupon-desc",
truncate: true
}, dateDesc) : endAt ? /*#__PURE__*/React.createElement(Text, {
className: "Coupon-desc",
truncate: true
}, formatExpireTime(endAt)) : null, /*#__PURE__*/React.createElement(Text, {
className: "Coupon-desc",
truncate: true
}, desc)), onClick && /*#__PURE__*/React.createElement(Flex, {
className: "Coupon-actions",
center: true
}, /*#__PURE__*/React.createElement(Button, {
className: "Coupon-btn",
onClick: inList ? onClick : undefined
}, btnText)), statusLabel && /*#__PURE__*/React.createElement(StatusBadge, {
text: statusLabel
}));
};