oak-pay-business/es/components/withdraw/list/web.pc.js

43 lines
2.3 KiB
JavaScript

import React from 'react';
import { List, Avatar, Result, Button } from 'antd';
import { CalendarOutlined, NodeExpandOutlined } from '@ant-design/icons';
import Styles from './web.pc.module.less';
export default function render(props) {
const { withdraws, gotoDetail } = props.data;
const { t, goBack } = props.methods;
if (withdraws?.length) {
return (<List itemLayout="horizontal" dataSource={withdraws} renderItem={(item, index) => (<List.Item key={index} actions={[
<Button onClick={() => gotoDetail(item.id)}>
{t('common::action.detail')}
</Button>
]}>
<List.Item.Meta avatar={<Avatar size={50} style={{
marginTop: 10,
backgroundColor: item.iStateColor
}}>
{item.iState}
</Avatar>} title={<div className={Styles.title}>
<div className={Styles.price}>
<span className={Styles.symbol}>{t('common::pay.symbol')}</span>
<span>{item.price}</span>
</div>
<div className={Styles.loss}>
<span>{item.lossDescription}</span>
</div>
</div>} description={<div className={Styles.description}>
<div className={Styles.count}>
<NodeExpandOutlined />
<span className={Styles.data}>{item.countDescription}</span>
</div>
<div className={Styles.createAt}>
<CalendarOutlined />
<span className={Styles.data}>{item.createAt}</span>
</div>
</div>}/>
</List.Item>)}/>);
}
return (<Result title={t('noData')} extra={<Button onClick={goBack}>
{t('common::back')}
</Button>}/>);
}