// FullScreenInter.js - 主文件保持简洁
import React from 'react';
import { connect } from 'dva';
import { withRouter } from 'dva/router';
import { Icon, Row, Col, message } from 'antd';
import styles from './fullinter.less';
import logo from '../assets/layout/headerno-logo-new.png';
import debounce from 'lodash.debounce';
import storage from '../utils/storage';
import { initFilter, extendRule } from '../utils/common';
import HomeContent from './FullOther/HomeContent';
import TrainingContent from './FullOther/TrainingContent';
import RiskControl from './FullOther/RiskControl';
import ClassBuild from './FullOther/ClassBuild';
import DangerJob from './FullOther/DangerJob';
import HiddenSolve from './FullOther/HiddenSolve';
import moment from 'moment'; // 添加这一行

const getScale = () => {
  const width = 1920,
    height = 1080;
  let ww = window.innerWidth / width;
  let wh = window.innerHeight / height;
  return ww < wh ? ww : wh;
};

class FullScreen extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      nowDate: '',
      riskTypeRate: [],
      riskTotal: [],
      // jobTodayQty: [],
      hiddenSummary: [],
      taskTop3: [],
      scale: getScale(),
      configBanner: ['首页', '风险管控', '隐患治理', '班组建设', '危险作业', '安全培训'],
      mediaList: [],
      currentMediaIndex: 0,
      announcementList: [],
      activeTab: '首页',
      // 安全培训相关数据
      trainingData: {
        listNAME: [],
        YearCount: [],
        MonthRecordCount: [],
        MonthPersonCount: [],
        listAnnourcement: [],
        TITLE: '',
        listVideoImg: [],
        playSet: [],
      },
      trainingSubData: {
        listNAME: [],
        YearCount: [],
        MonthRecordCount: [],
        MonthPersonCount: [],
      },
      trainingSubDataMonth: {
        listNAME: [],
        YearCount: [],
        MonthRecordCount: [],
        MonthPersonCount: [],
      },
      trainingSubIDCard: [],
      trainingSubBSType: {},
      trainingCompanyData: [], // 安全培训专用公司数据
      selectedTrainingMonth: new Date().getMonth() + 1,
      selectedTrainingCompany: '',

      // 隐患治理相关数据
      hiddenSubData: {}, // 隐患治理数据
      hiddenCompanyData: [], // 隐患治理专用公司数据
      selectedHiddenCompany: '', // 隐患治理选中的公司

      // 其他页面数据
      riskSubData: {},
      classSubData: [],
      dangerSubData: {},
      jobTodayQty: [],
      dangerCompanyData: [],
      selectedDangerCompany: '',
      selectedStartDate: moment(),
      selectedEndDate: moment(),

      announcementDetail: null,
      announcementDetailLoading: false,
      announcementModalVisible: false,
      currentAnnouncement: null,
    };
    this.isUnmounted = false;
    this.dataTimer = null; // 新增：用于数据定时请求
  }

  setScale = debounce(() => {
    if (this.isUnmounted) return;
    this.setState({ scale: getScale() });
  }, 500);

  toggleFullscreen = () => {
    if (!document.fullscreenElement) {
      document.documentElement.requestFullscreen?.();
    } else {
      document.exitFullscreen?.();
    }
  };
  startDataRefreshTimer = () => {
    // 清除已有定时器
    if (this.dataTimer) {
      clearInterval(this.dataTimer);
    }

    // 设置新的定时器，每5分钟执行一次
    this.dataTimer = setInterval(
      () => {
        if (!this.isUnmounted) {
          if (this.state.activeTab === '首页') {
            this.getHomeDataArray();
            this.getYearPXData();
          }
          // 安全培训 - 参考原有逻辑
          else if (this.state.activeTab === '安全培训') {
            this.getTrainingCompanyData(); // 先获取公司列表
            this.getHomeSESubYearData();
            this.getHomeSESubYearMonthData();
            this.getHomeSESubIDCardData();
          }
          // 隐患治理 - 参考安全培训的调用顺序
          else if (this.state.activeTab === '隐患治理') {
            this.getHiddenCompanyData(); // 先获取公司列表（与安全培训独立）
          }
          // 风险管控
          else if (this.state.activeTab === '风险管控') {
            this.getRiskSubData();
          }
          // 班组建设
          else if (this.state.activeTab === '班组建设') {
            this.getClassSubData();
          }
          // 危险作业
          else if (this.state.activeTab === '危险作业') {
            this.getDangerCompanyData();
          }
        }
      },
      5 * 60 * 1000
    ); // 5分钟 = 300000毫秒
  };

  componentDidMount() {
    this.isUnmounted = false;
    window.addEventListener('resize', this.setScale);
    this.getHomeDataArray();
    this.getYearPXData();
    // 启动定时刷新
    this.startDataRefreshTimer();
    this.timer = setInterval(() => {
      if (!this.isUnmounted) this.setState({ nowDate: this.getDate() });
    }, 1000);

    document.addEventListener('fullscreenchange', this.handleFullscreenChange);
  }

  getAnnouncementDetail = (announcement) => {
    return new Promise((resolve, reject) => {
      const orgId = storage('lacal').getItem('webOrgId')?.val;
      const json = initFilter(orgId);
      extendRule(json, 'ID', 1, announcement.ID);
      json.Include = ['Nav_Orgs', 'Nav_Orgs.Nav_OrgSub', 'Nav_Files.Nav_ImgFile'];

      this.setState({ announcementDetailLoading: true, announcementDetail: null });

      this.props.dispatch({
        type: 'app/getDataByPost',
        payload: json,
        url: 'PF/PFAnnourcement/Get',
        onComplete: (ret) => {
          if (ret && !this.isUnmounted) {
            this.setState({
              announcementDetail: ret,
              announcementDetailLoading: false,
            });
            resolve(ret);
          } else {
            message.error('暂无公告详情');
            this.setState({ announcementDetailLoading: false });
            reject(new Error('获取公告详情失败'));
          }
        },
        onError: (error) => {
          this.setState({ announcementDetailLoading: false });
          reject(error);
        },
      });
    });
  };

  handleAnnouncementClick = async (announcement) => {
    try {
      const detail = await this.getAnnouncementDetail(announcement);
      this.setState({
        currentAnnouncement: detail,
        announcementModalVisible: true,
      });
    } catch (error) {
      console.error('获取公告详情失败:', error);
    }
  };

  handleAnnouncementModalClose = () => {
    this.setState({
      announcementModalVisible: false,
      currentAnnouncement: null,
    });
  };

  handleCarouselChange = (current) => {
    this.setState({ currentMediaIndex: current });
  };

  handleDotClick = (index) => {
    this.setState({ currentMediaIndex: index });
  };

  handleTabClick = (name) => {
    this.setState({ activeTab: name });
    if (name === '首页') {
      this.getHomeDataArray();
      this.getYearPXData();
    }
    // 安全培训 - 参考原有逻辑
    if (name === '安全培训') {
      this.getTrainingCompanyData(); // 先获取公司列表
      this.getHomeSESubYearData();
      this.getHomeSESubYearMonthData();
      this.getHomeSESubIDCardData();
    }
    // 隐患治理 - 参考安全培训的调用顺序
    if (name === '隐患治理') {
      this.getHiddenCompanyData(); // 先获取公司列表（与安全培训独立）
    }
    // 风险管控
    if (name === '风险管控') {
      this.getRiskSubData();
    }
    // 班组建设
    if (name === '班组建设') {
      this.getClassSubData();
    }
    // 危险作业
    if (name === '危险作业') {
      this.getDangerCompanyData();
    }
  };

  handleFullscreenChange = () => {
    this.forceUpdate();
  };

  componentWillUnmount() {
    this.isUnmounted = true;
    window.removeEventListener('resize', this.setScale);
    if (this.timer) clearInterval(this.timer);
    // 清除数据刷新定时器
    if (this.dataTimer) clearInterval(this.dataTimer);

    document.removeEventListener('fullscreenchange', this.handleFullscreenChange);
  }

  getDate = () => {
    const myDate = new Date();
    const year = myDate.getFullYear();
    const mon = myDate.getMonth() + 1;
    const date = myDate.getDate();
    let hours = myDate.getHours();
    let minutes = myDate.getMinutes();
    let seconds = myDate.getSeconds();
    hours = hours < 10 ? '0' + hours : hours;
    minutes = minutes < 10 ? '0' + minutes : minutes;
    seconds = seconds < 10 ? '0' + seconds : seconds;
    return `${year} 年 ${mon} 月 ${date} 日 \t\t\t${hours} : ${minutes} : ${seconds}`;
  };

  getHomeDataArray = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'BI/BIKanBanController/ReturnAllData',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          this.setState({
            riskTypeRate: ret.riskTypeRate || [],
            // jobTodayQty: ret.jobTodayQty || [],
            hiddenSummary: ret.hiddenSummary || [],
            taskTop3: ret.taskTop3 || [],
          });
        }
      },
    });
  };

  getYearPXData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'BI/BIHeadSE/SEtrInfo',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          this.setState({
            trainingData: ret,
          });
        }
      },
    });
  };

  // ==================== 安全培训相关方法 ====================
  getTrainingCompanyData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'FM/Organization/OrderPaged',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          // 默认选中邦泰公司
          const defaultCompany = ret.find((company) => company.ID === '00500000-0000-0000-0000-000000000000');
          this.setState({
            trainingCompanyData: ret,
          });
          if (defaultCompany && !this.state.selectedTrainingCompany) {
            this.setState(
              {
                selectedTrainingCompany: defaultCompany.ID,
              },
              () => {
                this.getBSTypeMonthData(); // 公司设置完成后获取培训类型数据
              }
            );
          } else {
            this.getBSTypeMonthData();
          }
        }
      },
    });
  };

  getHomeSESubYearData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    const currentYear = new Date().getFullYear();
    json.Parameter1 = currentYear.toString();
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'BI/BIHeadSE/HomeSESubYear',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          const listNAME = ret.map((item) => item.CName);
          const MonthPersonCount = ret.map((item) => item.PCount);
          const MonthRecordCount = ret.map((item) => item.RCount);
          const YearCount = ret.map((item) => item.PCount);

          this.setState({
            trainingSubData: {
              listNAME: listNAME,
              YearCount: YearCount,
              MonthRecordCount: MonthRecordCount,
              MonthPersonCount: MonthPersonCount,
            },
          });
        }
      },
    });
  };

  handleTrainingMonthChange = (month) => {
    this.setState({ selectedTrainingMonth: month }, () => {
      this.getHomeSESubYearMonthData();
    });
  };

  handleTrainingCompanyChange = (company) => {
    this.setState({ selectedTrainingCompany: company }, () => {
      this.getBSTypeMonthData();
    });
  };

  getHomeSESubYearMonthData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    const currentYear = new Date().getFullYear();
    json.Parameter1 = currentYear.toString();
    json.Parameter2 = this.state.selectedTrainingMonth.toString();
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'BI/BIHeadSE/HomeSESubYear',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          const listNAME = ret.map((item) => item.CName);
          const MonthPersonCount = ret.map((item) => item.PCount);
          const MonthRecordCount = ret.map((item) => item.RCount);
          const YearCount = ret.map((item) => item.PCount);

          this.setState({
            trainingSubDataMonth: {
              listNAME: listNAME,
              YearCount: YearCount,
              MonthRecordCount: MonthRecordCount,
              MonthPersonCount: MonthPersonCount,
            },
          });
        }
      },
    });
  };

  getHomeSESubIDCardData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    const currentDate = new Date();
    const year = currentDate.getFullYear();
    const month = String(currentDate.getMonth() + 1).padStart(2, '0');
    const day = String(currentDate.getDate()).padStart(2, '0');
    const currentDateStr = `${year}-${month}-${day}`;

    json.Parameter1 = currentDateStr;
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'BI/BIHeadSE/SubCertificateType',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          this.setState({
            trainingSubIDCard: ret,
          });
        }
      },
    });
  };

  getBSTypeMonthData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    const currentDate = new Date();
    const year = currentDate.getFullYear();
    const month = String(currentDate.getMonth() + 1).padStart(2, '0');
    const day = String(currentDate.getDate()).padStart(2, '0');
    const currentDateStr = `${year}-${month}-${day}`;

    json.Parameter1 = currentDateStr;
    if (this.state.selectedTrainingCompany) {
      json.Parameter2 = this.state.selectedTrainingCompany;
    }
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'BI/BIHeadSE/SubTypeMonth',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          this.setState({
            trainingSubBSType: ret,
          });
        }
      },
    });
  };

  // ==================== 隐患治理相关方法 ====================
  // 获取隐患治理的公司列表（独立于安全培训）
  getHiddenCompanyData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'FM/Organization/OrderPaged',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          // 默认选中邦泰公司
          const defaultCompany = ret.find((company) => company.ID === '00500000-0000-0000-0000-000000000000');
          this.setState({
            hiddenCompanyData: ret,
          });
          if (defaultCompany && !this.state.selectedHiddenCompany) {
            this.setState({
              selectedHiddenCompany: defaultCompany.ID,
            });
          }
          this.getHiddenSubData();
        }
      },
    });
  };

  // 隐患治理公司筛选变化处理
  handleHiddenCompanyChange = (company) => {
    this.setState({ selectedHiddenCompany: company });
  };

  getHiddenSubData = () => {
    // 以下是真实的API调用代码，如需使用请取消注释
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'BI/BIKanBanController/HiddenManage',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          this.setState({
            hiddenSubData: ret,
          });
        }
      },
    });
  };

  // ==================== 其他页面方法 ====================
  getRiskSubData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'BI/BIKanBanController/RiskManage',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          this.setState({
            riskSubData: ret,
          });
        }
      },
    });
  };

  getClassSubData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'BI/BIKanBanController/TeamManage',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          this.setState({
            classSubData: ret,
          });
        }
      },
    });
  };

  getDangerCompanyData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'FM/Organization/OrderPaged',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          const defaultCompany = ret.find((company) => company.ID === '00500000-0000-0000-0000-000000000000');
          this.setState({
            dangerCompanyData: ret,
          });
          if (defaultCompany && !this.state.selectedDangerCompany) {
            this.setState(
              {
                selectedDangerCompany: defaultCompany.ID,
              },
              () => {
                this.getDangerSubData();
              }
            );
          } else {
            this.getDangerSubData();
          }
        }
      },
    });
  };

  handleDangerCompanyChange = (company) => {
    this.setState({ selectedDangerCompany: company }, () => {
      this.getDangerSubData();
    });
  };
  handleStartDateChange = (startDate) => {
    this.setState({ selectedStartDate: startDate }, () => {
      this.getDangerSubData();
    });
  };
  handleEndDateChange = (endDate) => {
    this.setState({ selectedEndDate: endDate }, () => {
      this.getDangerSubData();
    });
  };

  getDangerSubData = () => {
    const orgId = storage('lacal').getItem('webOrgId')?.val;
    const json = initFilter(orgId);
    json.Keyword =''
    if (this.state.selectedDangerCompany) {
        const selectedCompanyObj = this.state.dangerCompanyData?.find(
          (company) => company.ID === this.state.selectedDangerCompany
        );
        const selectedCompanyName = selectedCompanyObj?.NAME;
        if (selectedCompanyName) {
          json.Keyword = selectedCompanyName;
          // filteredData = filteredData.filter((item) => item.companyName === selectedCompanyName);
        }
      }
    
    json.Parameter1 = this.state.selectedStartDate?.format('YYYY-MM-DD') || '';
    json.Parameter2 = this.state.selectedEndDate?.format('YYYY-MM-DD') || '';
    this.props.dispatch({
      type: 'app/getDataByPost',
      payload: json,
      url: 'BI/BIKanBanController/JobManage',
      onComplete: (ret) => {
        if (ret && !this.isUnmounted) {
          //let filteredData = ret.jobList;
          // if (this.state.selectedDangerCompany) {
          //   const selectedCompanyObj = this.state.dangerCompanyData?.find(
          //     (company) => company.ID === this.state.selectedDangerCompany
          //   );
          //   const selectedCompanyName = selectedCompanyObj?.NAME;
          //   if (selectedCompanyName) {
          //     filteredData = filteredData.filter((item) => item.companyName === selectedCompanyName);
          //   }.
          // }

          this.setState({
            dangerSubData: ret.jobList,
            jobTodayQty: ret.jobTodayQty,
          });
        }
      },
    });
  };

  renderOtherTabContent = () => {
    const {
      activeTab,
      trainingSubData,
      trainingSubBSType,
      trainingCompanyData,
      trainingSubDataMonth,
      selectedTrainingMonth,
      selectedTrainingCompany,
      trainingSubIDCard,
      riskSubData,
      classSubData,
      hiddenSubData,
      hiddenCompanyData,
      selectedHiddenCompany,
    } = this.state;

    if (activeTab === '安全培训') {
      return (
        <TrainingContent
          trainingSubData={trainingSubData}
          trainingSubBSType={trainingSubBSType}
          companyData={trainingCompanyData}
          trainingSubDataMonth={trainingSubDataMonth}
          selectedMonth={selectedTrainingMonth}
          selectedCompany={selectedTrainingCompany}
          onMonthChange={this.handleTrainingMonthChange}
          onCompanyChange={this.handleTrainingCompanyChange}
          trainingSubIDCard={trainingSubIDCard}
        />
      );
    }
    if (activeTab === '风险管控') {
      return <RiskControl riskSubData={riskSubData} />;
    }
    if (activeTab === '隐患治理') {
      return (
        <HiddenSolve
          hiddenSubData={hiddenSubData}
          companyData={hiddenCompanyData}
          selectedCompany={selectedHiddenCompany}
          onCompanyChange={this.handleHiddenCompanyChange}
        />
      );
    }
    if (activeTab === '班组建设') {
      return <ClassBuild classSubData={classSubData} />;
    }
    if (activeTab === '危险作业') {
      return (
        <DangerJob
          dangerSubData={this.state.dangerSubData}
          jobTodayQty={this.state.jobTodayQty}
          companyData={this.state.dangerCompanyData}
          selectedCompany={this.state.selectedDangerCompany}
          onCompanyChange={this.handleDangerCompanyChange}
          selectedStartDate={this.state.selectedStartDate}
          onStartChange={this.handleStartDateChange}
          selectedEndDate={this.state.selectedEndDate}
          onEndChange={this.handleEndDateChange}
        />
      );
    }
    return (
      <div className={styles.otherTabContent}>
        <div style={{ textAlign: 'center', color: '#fff' }}>
          <div style={{ fontSize: '32px', fontWeight: 'bold', marginBottom: '20px' }}>{activeTab} 页面</div>
          <div style={{ fontSize: '18px', opacity: 0.8 }}>这里是 {activeTab} 的内容展示区域</div>
          <div style={{ marginTop: '30px', fontSize: '16px', opacity: 0.6 }}>请根据实际需求替换此内容</div>
        </div>
      </div>
    );
  };

  render() {
    const width = 1920,
      height = 1080;
    const {
      scale,
      activeTab,
      riskTypeRate,
      riskTotal,
      hiddenSummary,
      jobTodayQty,
      taskTop3,
      mediaList,
      announcementList,
      currentMediaIndex,
      trainingData,
      announcementModalVisible,
      currentAnnouncement,
      announcementDetailLoading,
    } = this.state;

    return (
      <div className={styles.box} style={{ transform: `scale(${scale}) translate(-50%, -50%)`, width, height }}>
        <div className={styles.blackBack}>
          <div className={styles.backImage}>
            {/* 头部 */}
            <div className={styles.header}>
              <Row style={{ width: '100%', height: '100%', display: 'flex', alignItems: 'center' }}>
                <Col span={9} style={{ display: 'flex', alignItems: 'center' }}>
                  <img src={logo} alt="logo" style={{ height: '50px', marginLeft: '50px' }} />
                  <div style={{ display: 'flex', marginLeft: 'auto' }}>
                    {this.state.configBanner.slice(0, 3).map((item, index) => (
                      <div
                        key={index}
                        className={`${styles.configBanners} ${activeTab === item ? styles.active : ''}`}
                        onClick={() => this.handleTabClick(item)}
                      >
                        {item}
                      </div>
                    ))}
                  </div>
                </Col>
                <Col span={6} style={{ display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
                  <div className={styles.headerText}>金源公司安全生产管控平台</div>
                </Col>
                <Col span={9} style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-end' }}>
                  <div style={{ display: 'flex' }}>
                    {this.state.configBanner.slice(3, 6).map((item, index) => (
                      <div
                        key={index}
                        className={`${styles.configBanners} ${activeTab === item ? styles.active : ''}`}
                        onClick={() => this.handleTabClick(item)}
                      >
                        {item}
                      </div>
                    ))}
                  </div>
                  <Icon
                    type={document.fullscreenElement ? 'fullscreen-exit' : 'fullscreen'}
                    style={{ fontSize: '26px', color: '#000', cursor: 'pointer', margin: '0 20px' }}
                    onClick={this.toggleFullscreen}
                  />
                  <div style={{ color: '#000', fontSize: '14px', marginRight: '20px', fontWeight: 'bold' }}>
                    {this.state.nowDate}
                  </div>
                </Col>
              </Row>
            </div>

            {/* 内容区域 */}
            {activeTab === '首页' ? (
              <HomeContent
                riskTypeRate={riskTypeRate}
                riskTotal={riskTotal}
                hiddenSummary={hiddenSummary}
                // jobTodayQty={jobTodayQty}
                taskTop3={taskTop3}
                mediaList={mediaList}
                announcementList={announcementList}
                currentMediaIndex={currentMediaIndex}
                onCarouselChange={this.handleCarouselChange}
                onDotClick={this.handleDotClick}
                trainingData={trainingData}
                onAnnouncementClick={this.handleAnnouncementClick}
                announcementModalVisible={announcementModalVisible}
                currentAnnouncement={currentAnnouncement}
                announcementDetailLoading={announcementDetailLoading}
                onAnnouncementModalClose={this.handleAnnouncementModalClose}
              />
            ) : (
              this.renderOtherTabContent()
            )}
          </div>
        </div>
      </div>
    );
  }
}

export default withRouter(connect(({ login }) => ({ login }))(FullScreen));