91 lines
2.8 KiB
TypeScript
91 lines
2.8 KiB
TypeScript
import { SignalFilled } from '@ant-design/icons';
|
|
import { Modal } from 'antd';
|
|
import React, { useEffect, useState } from 'react';
|
|
import { IChatItem } from '../ChatLogsType';
|
|
import styles from './index.module.scss';
|
|
|
|
export const ChatVote: React.FC<IChatItem> = (props) => {
|
|
const votetype: any = { '101': '发起投票', '102': '参与投票' };
|
|
const [open, setOpen] = useState(false);
|
|
const [voteitem, setVoteitem] = useState([]);
|
|
|
|
useEffect(() => {
|
|
try {
|
|
const msg = JSON.parse(props.chat?.content as string);
|
|
setVoteitem(msg?.voteitem);
|
|
} catch (e) {
|
|
/* empty */
|
|
}
|
|
}, [props.chat]);
|
|
|
|
function content() {
|
|
try {
|
|
const msg = JSON.parse(props.chat?.content as string);
|
|
|
|
return (
|
|
<>
|
|
<div
|
|
style={{ display: 'flex', color: '#000', flexDirection: 'column', cursor: 'pointer' }}
|
|
onClick={() => setOpen(true)}
|
|
>
|
|
<div style={{ wordBreak: 'break-all', fontWeight: 'bold' }}>{msg?.votetitle}</div>
|
|
<div style={{ wordBreak: 'break-all' }}>
|
|
{Array.isArray(msg?.voteitem)
|
|
? [0, 1, 2].map((item) => {
|
|
return msg?.voteitem[item] ? (
|
|
<div key={msg?.voteitem[item]} className={styles.voteitem}>
|
|
{msg?.voteitem[item]}
|
|
</div>
|
|
) : (
|
|
<></>
|
|
);
|
|
})
|
|
: null}
|
|
</div>
|
|
<div
|
|
style={{ borderTop: '1px solid #ddd', color: '#999', marginTop: 8, paddingTop: 8 }}
|
|
>
|
|
<SignalFilled style={{ color: '#F0B40E' }} /> 投票 [
|
|
{votetype[msg?.votetype as string]}]
|
|
</div>
|
|
</div>
|
|
<Modal
|
|
open={open}
|
|
title={msg?.votetitle}
|
|
centered
|
|
onCancel={() => {
|
|
setOpen(false);
|
|
}}
|
|
footer={false}
|
|
>
|
|
<div style={{ maxHeight: '75vh', overflow: 'auto' }}>
|
|
{Array.isArray(voteitem)
|
|
? voteitem.map((item) => {
|
|
return (
|
|
<div key={`_${item}`} className={styles.voteitem}>
|
|
{item}
|
|
</div>
|
|
);
|
|
})
|
|
: null}
|
|
</div>
|
|
</Modal>
|
|
</>
|
|
);
|
|
} catch (e) {
|
|
/* empty */
|
|
}
|
|
|
|
return (
|
|
<div style={{ display: 'flex', color: '#000', flexDirection: 'column' }}>
|
|
<div style={{ wordBreak: 'break-all' }}>{props.chat?.content}</div>
|
|
<div style={{ borderTop: '1px solid #ddd', color: '#999', marginTop: 8, paddingTop: 8 }}>
|
|
<SignalFilled style={{ color: '#F0B40E' }} /> 投票
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return <>{content()}</>;
|
|
};
|