| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
|
|
|
|
| import React from 'react';
|
| import { Tag, Button, Space, Popover, Dropdown } from '@douyinfe/semi-ui';
|
| import { IconMore } from '@douyinfe/semi-icons';
|
| import { renderQuota, timestamp2string } from '../../../helpers';
|
| import {
|
| REDEMPTION_STATUS,
|
| REDEMPTION_STATUS_MAP,
|
| REDEMPTION_ACTIONS,
|
| } from '../../../constants/redemption.constants';
|
|
|
| |
| |
|
|
| export const isExpired = (record) => {
|
| return (
|
| record.status === REDEMPTION_STATUS.UNUSED &&
|
| record.expired_time !== 0 &&
|
| record.expired_time < Math.floor(Date.now() / 1000)
|
| );
|
| };
|
|
|
| |
| |
|
|
| const renderTimestamp = (timestamp) => {
|
| return <>{timestamp2string(timestamp)}</>;
|
| };
|
|
|
| |
| |
|
|
| const renderStatus = (status, record, t) => {
|
| if (isExpired(record)) {
|
| return (
|
| <Tag color='orange' shape='circle'>
|
| {t('已过期')}
|
| </Tag>
|
| );
|
| }
|
|
|
| const statusConfig = REDEMPTION_STATUS_MAP[status];
|
| if (statusConfig) {
|
| return (
|
| <Tag color={statusConfig.color} shape='circle'>
|
| {t(statusConfig.text)}
|
| </Tag>
|
| );
|
| }
|
|
|
| return (
|
| <Tag color='black' shape='circle'>
|
| {t('未知状态')}
|
| </Tag>
|
| );
|
| };
|
|
|
| |
| |
|
|
| export const getRedemptionsColumns = ({
|
| t,
|
| manageRedemption,
|
| copyText,
|
| setEditingRedemption,
|
| setShowEdit,
|
| refresh,
|
| redemptions,
|
| activePage,
|
| showDeleteRedemptionModal,
|
| }) => {
|
| return [
|
| {
|
| title: t('ID'),
|
| dataIndex: 'id',
|
| },
|
| {
|
| title: t('名称'),
|
| dataIndex: 'name',
|
| },
|
| {
|
| title: t('状态'),
|
| dataIndex: 'status',
|
| key: 'status',
|
| render: (text, record) => {
|
| return <div>{renderStatus(text, record, t)}</div>;
|
| },
|
| },
|
| {
|
| title: t('额度'),
|
| dataIndex: 'quota',
|
| render: (text) => {
|
| return (
|
| <div>
|
| <Tag color='grey' shape='circle'>
|
| {renderQuota(parseInt(text))}
|
| </Tag>
|
| </div>
|
| );
|
| },
|
| },
|
| {
|
| title: t('创建时间'),
|
| dataIndex: 'created_time',
|
| render: (text) => {
|
| return <div>{renderTimestamp(text)}</div>;
|
| },
|
| },
|
| {
|
| title: t('过期时间'),
|
| dataIndex: 'expired_time',
|
| render: (text) => {
|
| return <div>{text === 0 ? t('永不过期') : renderTimestamp(text)}</div>;
|
| },
|
| },
|
| {
|
| title: t('兑换人ID'),
|
| dataIndex: 'used_user_id',
|
| render: (text) => {
|
| return <div>{text === 0 ? t('无') : text}</div>;
|
| },
|
| },
|
| {
|
| title: '',
|
| dataIndex: 'operate',
|
| fixed: 'right',
|
| width: 205,
|
| render: (text, record) => {
|
|
|
| const moreMenuItems = [
|
| {
|
| node: 'item',
|
| name: t('删除'),
|
| type: 'danger',
|
| onClick: () => {
|
| showDeleteRedemptionModal(record);
|
| },
|
| },
|
| ];
|
|
|
| if (record.status === REDEMPTION_STATUS.UNUSED && !isExpired(record)) {
|
| moreMenuItems.push({
|
| node: 'item',
|
| name: t('禁用'),
|
| type: 'warning',
|
| onClick: () => {
|
| manageRedemption(record.id, REDEMPTION_ACTIONS.DISABLE, record);
|
| },
|
| });
|
| } else if (!isExpired(record)) {
|
| moreMenuItems.push({
|
| node: 'item',
|
| name: t('启用'),
|
| type: 'secondary',
|
| onClick: () => {
|
| manageRedemption(record.id, REDEMPTION_ACTIONS.ENABLE, record);
|
| },
|
| disabled: record.status === REDEMPTION_STATUS.USED,
|
| });
|
| }
|
|
|
| return (
|
| <Space>
|
| <Popover
|
| content={record.key}
|
| style={{ padding: 20 }}
|
| position='top'
|
| >
|
| <Button type='tertiary' size='small'>
|
| {t('查看')}
|
| </Button>
|
| </Popover>
|
| <Button
|
| size='small'
|
| onClick={async () => {
|
| await copyText(record.key);
|
| }}
|
| >
|
| {t('复制')}
|
| </Button>
|
| <Button
|
| type='tertiary'
|
| size='small'
|
| onClick={() => {
|
| setEditingRedemption(record);
|
| setShowEdit(true);
|
| }}
|
| disabled={record.status !== REDEMPTION_STATUS.UNUSED}
|
| >
|
| {t('编辑')}
|
| </Button>
|
| <Dropdown
|
| trigger='click'
|
| position='bottomRight'
|
| menu={moreMenuItems}
|
| >
|
| <Button type='tertiary' size='small' icon={<IconMore />} />
|
| </Dropdown>
|
| </Space>
|
| );
|
| },
|
| },
|
| ];
|
| };
|
|
|