import React from 'react';
import VtxBaseModal from '../vtx-base-modal';
import { OverView, WGGS, TFRD, WGXW, Alarm, SPJK } from './components';
import { overViewService } from './api';

export interface HousingEstateModalProps {
    visible?: boolean;
    onCancel?: () => void;
    theme?: 'dark' | 'light';
    id: string;
}

const TABS = [
    {
        key: 'overview',
        title: '综合总览',
    },
    {
        key: 'wggs',
        title: '违规人公示',
    },
    {
        key: 'tfrd',
        title: '居民投放热度',
    },
    {
        key: 'wgxw',
        title: '居民违规行为',
    },
    {
        key: 'alarm',
        title: '报警事件分析',
    },
    {
        key: 'video',
        title: '视频监控',
    },
];

const VtxHousingEstateModal = (props: HousingEstateModalProps) => {
    const { visible = false, onCancel, theme = 'dark', id } = props;
    const PREFIX = 'estate';
    const throwPoints = overViewService.throwPoints({
        housingEstateId: id,
    });

    const tabContents = {
        overview: <OverView classPrefix={PREFIX} id={id} throwPoints={throwPoints} />,
        wggs: <WGGS classPrefix={PREFIX} id={id} throwPoints={throwPoints} />,
        tfrd: <TFRD classPrefix={PREFIX} id={id} />,
        alarm: <Alarm classPrefix={PREFIX} id={id} />,
        wgxw: <WGXW classPrefix={PREFIX} id={id} throwPoints={throwPoints} />,
        video: <SPJK classPrefix={PREFIX} />,
    };

    return (
        <VtxBaseModal
            title="小区"
            theme={theme}
            tabs={TABS}
            contents={tabContents}
            visible={visible}
            onCancel={onCancel}
        />
    );
};

export default VtxHousingEstateModal;
