@chatui/core
Version:
The React library for Chatbot UI
82 lines (81 loc) • 3.37 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Coupon = void 0;
var _react = _interopRequireDefault(require("react"));
var _clsx = _interopRequireDefault(require("clsx"));
var _Price = require("../Price");
var _Button = require("../Button");
var _Flex = require("../Flex");
var _Text = require("../Text");
var _Countdown = require("../Countdown");
var _StatusBadge = require("../StatusBadge");
var _date = require("../../utils/date");
var statusLabelMap = {
normal: '',
nearExpired: '快失效',
expired: '已过期',
used: '已使用'
};
var Coupon = exports.Coupon = function Coupon(props) {
var className = props.className,
value = props.value,
condition = props.condition,
name = props.name,
endAt = props.endAt,
desc = props.desc,
_props$status = props.status,
status = _props$status === void 0 ? 'normal' : _props$status,
oShowCountdown = props.showCountdown,
_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] || '';
var nearExpired = status === 'nearExpired' || endAt && (0, _date.isWithin24Hours)(endAt);
var showCountdown = oShowCountdown === true || oShowCountdown === 'auto' && nearExpired;
return /*#__PURE__*/_react.default.createElement(_Flex.Flex, {
className: (0, _clsx.default)('Coupon', className),
"data-status": status,
"data-in-list": inList,
onClick: inList ? undefined : onClick
}, /*#__PURE__*/_react.default.createElement(_Flex.Flex, {
className: "Coupon-object",
center: true,
direction: "column"
}, value && /*#__PURE__*/_react.default.createElement(_Price.Price, {
className: "Coupon-value",
price: value,
currency: "\xA5",
autoFit: true
}), /*#__PURE__*/_react.default.createElement(_Text.Text, {
className: "Coupon-condition",
truncate: true
}, condition)), /*#__PURE__*/_react.default.createElement("div", {
className: "Coupon-divider"
}), /*#__PURE__*/_react.default.createElement(_Flex.FlexItem, {
className: "Coupon-main"
}, /*#__PURE__*/_react.default.createElement(_Text.Text, {
className: "Coupon-name",
truncate: true
}, name), endAt && /*#__PURE__*/_react.default.createElement(_Text.Text, {
className: "Coupon-desc",
truncate: true
}, showCountdown ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", null, "\u9650\u65F6"), " ", /*#__PURE__*/_react.default.createElement(_Countdown.Countdown, {
targetDate: endAt
})) : (0, _date.formatExpireTime)(endAt)), /*#__PURE__*/_react.default.createElement(_Text.Text, {
className: "Coupon-desc",
truncate: true
}, desc)), onClick && /*#__PURE__*/_react.default.createElement(_Flex.Flex, {
className: "Coupon-actions",
center: true
}, /*#__PURE__*/_react.default.createElement(_Button.Button, {
className: "Coupon-btn",
onClick: inList ? onClick : undefined
}, btnText)), statusLabel && /*#__PURE__*/_react.default.createElement(_StatusBadge.StatusBadge, {
text: statusLabel
}));
};