49 lines
1.3 KiB
TypeScript
49 lines
1.3 KiB
TypeScript
import React from 'react';
|
|
import { useSelector } from 'react-redux';
|
|
import { Modal } from 'antd';
|
|
import { selectIsMobile } from '@store/slices/deviceSlice';
|
|
import DynamicNewsDetailPanel from './DynamicNewsDetail/DynamicNewsDetailPanel';
|
|
import './EventDetailModal.less';
|
|
|
|
interface EventDetailModalProps {
|
|
/** 是否打开弹窗 */
|
|
open: boolean;
|
|
/** 关闭弹窗回调 */
|
|
onClose: () => void;
|
|
/** 事件对象 */
|
|
event: any; // TODO: 后续可替换为具体的 Event 类型
|
|
}
|
|
|
|
/**
|
|
* 事件详情弹窗组件
|
|
*/
|
|
const EventDetailModal: React.FC<EventDetailModalProps> = ({
|
|
open,
|
|
onClose,
|
|
event,
|
|
}) => {
|
|
const isMobile = useSelector(selectIsMobile);
|
|
|
|
return (
|
|
<Modal
|
|
open={open}
|
|
onCancel={onClose}
|
|
footer={null}
|
|
title={event?.title || '事件详情'}
|
|
width='100vw'
|
|
destroyOnClose
|
|
className="event-detail-modal"
|
|
styles={{
|
|
mask: { background: 'transparent' },
|
|
content: { borderRadius: 24, padding: 0, maxWidth: 1400, background: 'transparent', margin: '0 auto' },
|
|
header: { background: '#FFFFFF', borderBottom: '1px solid #E2E8F0', padding: '16px 24px', borderRadius: '24px 24px 0 0' },
|
|
body: { padding: 0 },
|
|
}}
|
|
>
|
|
{event && <DynamicNewsDetailPanel event={event} showHeader={false} />}
|
|
</Modal>
|
|
);
|
|
};
|
|
|
|
export default EventDetailModal;
|