50 lines
1.5 KiB
TypeScript
50 lines
1.5 KiB
TypeScript
import { RedEnvelopeFilled } from '@ant-design/icons';
|
||
import { IChatItem } from '../ChatLogsType';
|
||
|
||
export const ChatRedpacket: React.FC<IChatItem> = (props) => {
|
||
const type: any = {
|
||
1: '普通红包',
|
||
2: '拼手气群红包',
|
||
3: '激励群红包',
|
||
};
|
||
function content() {
|
||
try {
|
||
const msg = JSON.parse(props.chat?.content as string);
|
||
return (
|
||
<div>
|
||
<div style={{ display: 'flex' }}>
|
||
<RedEnvelopeFilled
|
||
style={{ fontSize: 40, color: 'red', flexShrink: 0, paddingRight: 8 }}
|
||
/>
|
||
<div>
|
||
<div style={{ wordBreak: 'break-all' }}>{msg.wish}</div>
|
||
<div style={{ wordBreak: 'break-all' }}>
|
||
{msg.totalcnt}个,{(msg.totalamount / 100).toFixed(2)}元
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style={{ borderTop: '1px solid #ddd', marginTop: 8, paddingTop: 8, color: '#999' }}>
|
||
{type[msg.type]}
|
||
</div>
|
||
</div>
|
||
);
|
||
} catch (_e) {
|
||
return (
|
||
<div>
|
||
<div style={{ display: 'flex' }}>
|
||
<RedEnvelopeFilled
|
||
style={{ fontSize: 40, color: 'red', flexShrink: 0, paddingRight: 8 }}
|
||
/>
|
||
<div style={{ wordBreak: 'break-all' }}>{props.chat?.content}</div>
|
||
</div>
|
||
<div style={{ borderTop: '1px solid #ddd', marginTop: 8, paddingTop: 8, color: '#999' }}>
|
||
红包
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
}
|
||
|
||
return <>{content()}</>;
|
||
};
|