Files
scrm.antd/src/pages/ChatLogs/components/ChatFile.tsx
2023-04-11 15:29:40 +08:00

53 lines
1.7 KiB
TypeScript

import { FileTextFilled } from '@ant-design/icons';
import { IChatItem } from '../ChatLogsType';
import styles from './index.module.scss';
export const ChatFile: React.FC<IChatItem> = (props) => {
function content() {
try {
const msg = JSON.parse(props.chat?.content as string);
return (
<a
style={{ display: 'flex', color: '#000' }}
download={msg.file_name}
href={`/api/${msg.path}`}
>
<div style={{ wordBreak: 'break-all', paddingRight: 8 }}>{msg.file_name}</div>
<FileTextFilled style={{ fontSize: 40, color: '#FA9D3B', flexShrink: 0 }} />
</a>
);
} catch (_e) {
return (
<div>
<div style={{ wordBreak: 'break-all', paddingRight: 8 }}>{props.chat?.content}</div>
<FileTextFilled style={{ fontSize: 40, color: '#FA9D3B', flexShrink: 0 }} />
</div>
);
}
}
return (
<>
{props.from?.user_id == props.chat?.msg_from ? (
<div className={styles.chatRight}>
<div className={styles.chatContentBox}>
<div className={styles.name}>{props.from?.name}</div>
<div className={styles.content}>{content()}</div>
</div>
<div className={styles.chatAvatar}>{props.from?.name[0]}</div>
</div>
) : (
<div className={styles.chatLeft}>
<div className={styles.chatAvatar}>
<img src={props.to?.cust_info.avatar} alt="" />
</div>
<div className={styles.chatContentBox}>
<div className={styles.name}>{props.to?.cust_info.name}</div>
<div className={styles.content}>{content()}</div>
</div>
</div>
)}
</>
);
};