import React, { useCallback } from 'react'
import PanelTitle from '@/pages/Home_v_2504/components/common/PanelTitle';


import OverallSituation from './OverallSituation';
import DateSelector from '@/components/V2504/DateSelector';
import ProgramType from './ProgramType';
import CaseSource from './CaseSource';

import styles from './index.less'
import PunishmentTrend from './PunishmentTrend';
import HighFrequencyType from './HighFrequencyType';
import { INDUSTRY_PAGE_IDS } from '@/constants/dataTypes';
import CaseHandlingQuantity from './CaseHandlingQuantity';

interface Props {
    // 数据类型键名，用于获取正确的dataType
    dataTypeKey?: string;
    // 标题
    title?: string;
    // 页面ID，用于区分不同页面的时间设置
    pageId?: string;
}

export default function RightContent({
    dataTypeKey = '行政处罚',
    title = '行政处罚',
    pageId = INDUSTRY_PAGE_IDS.LAW_ENFORCEMENT_PUNISHMENT,
}: Props) {

 
     // 处理日期变化
      const handleDateChange = useCallback((params: { type: string; startTime: string; endTime: string }) => {
        console.log('Date changed: RightContent!!', params);        
       
      }, []);

    return (
        <div className={styles.container}>
            {/* 标题 */}
            <div className={styles.header}>
                <PanelTitle title={title} />
                <DateSelector
                    onChange={handleDateChange}
                    defaultType="lastMonth"
                    panelType="right"
                    pageId = {pageId}
                    timeOptions={['lastMonth', 'year', 'range']}
                    // useDefaultTypeFirst={true}
                />
            </div>
            <div className={`${styles.topSection} `}>
                <OverallSituation />
                <ProgramType />
            </div>
            <div className={`${styles.middleContent} `}>
                <CaseSource />
                <PunishmentTrend />
            </div>

            <div className={`${styles.bottomContent} `}>
                <HighFrequencyType />
                <CaseHandlingQuantity />
            </div>
        </div>
    )
}