src/pages/Forum/promotion-part/PromotionDetailDialog.jsx

import { type } from '@testing-library/user-event/dist/type';
import React from 'react';
import { useNavigate } from 'react-router-dom';

const PromotionDetailDialog = ({
  showDetailDialog,
  promotionDetail,
  closeDetailDialog,
  torrents,
  fetchTorrentDetail
}) => {
  const navigate = useNavigate();

  // 处理API返回的日期数组格式
  const parseApiDate = (dateArray) => {
    if (!Array.isArray(dateArray) || dateArray.length < 3) return null;
    
    // 注意：JavaScript的Date月份是从0开始的，所以需要减1
    return new Date(
      dateArray[0],        // 年
      dateArray[1] - 1,    // 月 (减1)
      dateArray[2],        // 日
      dateArray[3] || 0,   // 时 (默认0)
      dateArray[4] || 0,   // 分 (默认0)
      dateArray[5] || 0    // 秒 (默认0)
    );
  };

  const formatDateTime = (dateArray) => {
    if (!dateArray) return '未知';
    
    try {
      const date = parseApiDate(dateArray);
      return date ? date.toLocaleString() : '格式错误';
    } catch (e) {
      return '格式错误';
    }
  };

  const getUploadBonusDisplay = (promo) => {
    if (!promo || !promo.discountPercentage) return '无';
    const bonus = promo.discountPercentage;
    return bonus > 0 ? `+${bonus}%` : `-${Math.abs(bonus)}%`;
  };

  const getDownloadDiscountDisplay = (promo) => {
    if (!promo || !promo.downloadDiscount) return '无';
    const discount = (1 - promo.downloadDiscount) * 100;
    return discount > 0 ? `-${discount.toFixed(1)}%` : '无';
  };

  const redirectToTorrentDetail = (torrentId) => {
    if (fetchTorrentDetail) {
      navigate(`/seed/${torrentId}`);
    }
  };

  return (
    showDetailDialog && promotionDetail && (
      <div className="detail-dialog-overlay">
        <div className="detail-dialog">
          <h3 className="detail-dialog-title">{promotionDetail.name}</h3>
          <button 
            className="close-btn" 
            onClick={closeDetailDialog}
          >
            &times;
          </button>
          
          <div className="detail-content">
            {/* <div className="detail-item"> */}
              {/* <span className="detail-label">促销ID：</span> */}
              {/* <span className="detail-value">{promotionDetail.id}</span>
            </div> */}
            {/* <div className="detail-item">
              <span className="detail-label">促销名称：</span>
              <span className="detail-value">{promotionDetail.name}</span>
            </div> */}
            <div className="detail-item">
              <span className="detail-label">开始时间：</span>
              <span className="detail-value">{formatDateTime(promotionDetail.startTime)}</span>
            </div>
            <div className="detail-item">
              <span className="detail-label">结束时间：</span>
              <span className="detail-value">{formatDateTime(promotionDetail.endTime)}</span>
            </div>
            <div className="detail-item">
              <span className="detail-label">上传奖励：</span>
              <span className="detail-value">{getUploadBonusDisplay(promotionDetail)}</span>
            </div>
            <div className="detail-item">
              <span className="detail-label">下载折扣：</span>
              <span className="detail-value">{getDownloadDiscountDisplay(promotionDetail)}</span>
            </div>
            {/* <div className="detail-item">
              <span className="detail-label">创建时间：</span>
              <span className="detail-value">{formatDateTime(promotionDetail.createTime)}</span>
            </div> */}
            {/* <div className="detail-item">
              <span className="detail-label">创建者：</span>
              <span className="detail-value">{promotionDetail.creator || '未知'}</span>
            </div> */}
            
            {promotionDetail.description && (
              <div className="detail-item">
                <span className="detail-label">描述：</span>
                <span className="detail-value">{promotionDetail.description}</span>
              </div>
            )}
            
            {/* 适用种子列表 */}
            <div className="detail-item">
              <span className="detail-label">适用种子：</span>
              <div className="detail-value">
                {promotionDetail.applicableTorrentIds ? (
                  <div className="torrent-list">
                    {/* 解析字符串形式的数组 */}
                    {parseTorrentIds(promotionDetail.applicableTorrentIds).map(torrentId => {
                      const matchedTorrent = torrents.find(t => t.id === torrentId) || {};

                      return (
                        <button
                          key={torrentId}
                          className="torrent-link"
                          onClick={() => redirectToTorrentDetail(torrentId)}
                          aria-label={`查看种子${matchedTorrent.name || torrentId}的详情`}
                        >
                          {matchedTorrent.name || `种子${torrentId}`}
                          {/* {matchedTorrent.seeders > 10 && <span className="status-indicator hot">热门</span>}
                          {matchedTorrent.seeders === 0 && <span className="status-indicator cold">冷门</span>} */}
                        </button>
                      );
                    })}
                  </div>
                ) : (
                  <span className="empty-list">暂无适用种子</span>
                )}
              </div>
            </div>
          </div>
          
          <div className="dialog-buttons">
            <button onClick={closeDetailDialog}>关闭</button>
          </div>
        </div>
      </div>
    )
  );
};

// 解析种子ID字符串为数组
const parseTorrentIds = (idString) => {
  if (typeof idString === 'number') {
    return [idString];
  }

  if (Array.isArray(idString)) {
    return idString;
  }

  let items = typeof idString === 'string' && !idString.startsWith('[') ? idString.split(',') : JSON.parse(idString || '[]');

  return items;
};

export default PromotionDetailDialog;