import React, { useState, useEffect } from 'react';
import { Link } from 'wouter';
import axios from 'axios';
import Recommend from './Recommend/Recommend';
import Header from '../../components/Header';
import './SeedList.css';
import { useUser } from '../../context/UserContext';
import toast from 'react-hot-toast';
import { confirmAlert } from 'react-confirm-alert';
import 'react-confirm-alert/src/react-confirm-alert.css';
import AuthButton from '../../components/AuthButton';

const SeedList = () => {
    const [seeds, setSeeds] = useState([]);
    const [loading, setLoading] = useState(true);
    const [searchTerm, setSearchTerm] = useState('');
    const [sortOption, setSortOption] = useState('最新');
    const [activeTab, setActiveTab] = useState('种子列表');
    const [filters, setFilters] = useState({});
    const [selectedFilters, setSelectedFilters] = useState({});
    const [tagMode, setTagMode] = useState('any');
    const [errorMsg, setErrorMsg] = useState('');
    const { user } = useUser();

    const TAGS = ['猜你喜欢', '电影', '电视剧', '动漫', '音乐', '游戏', '综艺', '软件', '体育', '学习', '纪录片', '其他'];

    const CATEGORY_MAP = {
        '电影': 'movie',
        '电视剧': 'tv',
        '动漫': 'anime',
        '音乐': 'music',
        '游戏': 'game',
        '综艺': 'variety',
        '软件': 'software',
        '体育': 'sports',
        '学习': 'study',
        '纪录片': 'documentary',
        '其他': 'other',
        '猜你喜欢': '',
        '种子列表': '',
    };

    const formatBytes = (bytes) => {
    if (bytes === 0 || bytes === null || bytes === undefined) return '0 B';
    const k = 1024;
    const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
    const i = Math.floor(Math.log(bytes) / Math.log(k));
    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
    };


    const buildQueryParams = () => {
        const category = CATEGORY_MAP[activeTab] || '';
        const orderKey = sortOption === '最新' ? 'create_time' : (sortOption === '最热' ? 'leechers' : 'create_time');
        const params = {
            page: 1,
            size: 20,
            orderKey,
            orderDesc: true,
        };

        if (searchTerm.trim()) {
            params.keyword = searchTerm.trim();
        }
        if (category) {
            params.category = category;
        }

        const tags = Object.entries(selectedFilters)
            .filter(([_, value]) => value !== '不限')
            .map(([_, value]) => value);

        if (tags.length > 0) {
            params.tags = tags;
            params.tagMode = tagMode;
        }

        return params;
    };


    const fetchSeeds = async () => {
        if (activeTab === '猜你喜欢') return;
        setLoading(true);
        setErrorMsg('');
        try {
            const params = buildQueryParams();
            const response = await axios.get('/seeds/list', { params });
            const data = response.data;

            if (data.code !== 0) throw new Error(data.msg || '获取失败');
            setSeeds(data.data || []);
        } catch (error) {
            console.error('获取种子列表失败:', error);
            setErrorMsg(error.message || '获取失败，请稍后再试。');
            setSeeds([]);
        } finally {
            setLoading(false);
        }
    };

    const fetchFilterOptions = async () => {
        if (activeTab === '猜你喜欢' || !CATEGORY_MAP[activeTab]) return;
        const category = CATEGORY_MAP[activeTab];
        try {
            const res = await axios.get(`/seed-filters?category=${category}`);
            const filterData = res.data || {};
            setFilters(filterData);

            const defaultSelections = {};
            for (const key in filterData) {
                defaultSelections[key] = '不限';
            }
            setSelectedFilters(defaultSelections);
        } catch (err) {
            console.error('获取筛选项失败:', err);
            setFilters({});
            setSelectedFilters({});
        }
    };

    useEffect(() => {
        fetchFilterOptions();
    }, [activeTab]);

    useEffect(() => {
        fetchSeeds();
    }, [activeTab, sortOption, selectedFilters, tagMode, searchTerm]);

    const handleDownload = async (seedId) => {
        try {
            const response = await axios.get(`/seeds/${seedId}/download`, {
                params: { passkey: user.userId },
                responseType: 'blob',
                validateStatus: () => true  // 允许处理非 2xx 响应
            });

            if (response.data && response.data.type === 'application/json') {
                // 服务端返回的是 JSON 而不是 torrent 文件，尝试解析内容
                const reader = new FileReader();
                reader.onload = () => {
                    try {
                        const json = JSON.parse(reader.result);
                        if (json.code === 403 && json.msg === '您没有权限') {
                            toast.error('您已被封禁，如有疑问请联系管理员');
                        } else {
                            toast.error(json.msg || '下载失败，请稍后再试。');
                        }
                    } catch {
                        toast.error('下载失败，请稍后再试。');
                    }
                };
                reader.readAsText(response.data);
                return;
            }

            // 如果是 torrent 文件
            const blob = new Blob([response.data], { type: 'application/x-bittorrent' });
            const downloadUrl = URL.createObjectURL(blob);
            const a = document.createElement('a');
            a.href = downloadUrl;
            a.download = `${seedId}.torrent`;
            a.click();
            URL.revokeObjectURL(downloadUrl);
        } catch (error) {
            console.error('下载失败:', error);
            toast.error('下载失败，请稍后再试。');
        }
    };


    const handleFilterChange = (key, value) => {
        setSelectedFilters(prev => ({ ...prev, [key]: value }));
    };

    const clearFilter = (key) => {
        setSelectedFilters(prev => ({ ...prev, [key]: '不限' }));
    };

    return (
        <div className="seed-list-container">
            <Header />

            <div className="controls">
                <input
                    type="text"
                    placeholder="搜索种子..."
                    value={searchTerm}
                    onChange={(e) => setSearchTerm(e.target.value)}
                    className="search-input"
                />
                <select value={sortOption} onChange={(e) => setSortOption(e.target.value)} className="sort-select">
                    <option value="最新">最新</option>
                    <option value="最热">最热</option>
                </select>
                {/* <select value={tagMode} onChange={(e) => setTagMode(e.target.value)} className="tag-mode-select">
                    <option value="any">包含任意标签</option>
                    <option value="all">包含所有标签</option>
                </select> */}
            </div>

            <div className="tag-filters">
                {TAGS.map(tag => (
                    <button
                        key={tag}
                        className={`tag-button ${activeTab === tag ? 'active-tag' : ''}`}
                        onClick={() => {
                            setActiveTab(tag);
                            setFilters({});
                            setSelectedFilters({});
                        }}
                    >
                        {tag}
                    </button>
                ))}
            </div>

            {activeTab !== '猜你喜欢' && Object.keys(filters).length > 0 && (
                <div className="filter-bar">
                    {Object.entries(filters).map(([key, options]) => (
                        <div className="filter-group" key={key}>
                            <label>{key}:</label>
                            <select value={selectedFilters[key]} onChange={(e) => handleFilterChange(key, e.target.value)}>
                                {options.map(opt => (
                                    <option key={opt} value={opt}>{opt}</option>
                                ))}
                            </select>
                            {selectedFilters[key] !== '不限' && (
                                <button className="clear-filter-btn" onClick={() => clearFilter(key)}>✕</button>
                            )}
                        </div>
                    ))}
                </div>
            )}

            <div className="seed-list-content">
                {activeTab === '猜你喜欢' ? (
                    <Recommend />
                ) : loading ? (
                    <p>加载中...</p>
                ) : errorMsg ? (
                    <p className="error-text">{errorMsg}</p>
                ) : seeds.length === 0 ? (
                    <p>未找到符合条件的种子。</p>
                ) : (
                    <div className="seed-list-card">
                        <div className="seed-list-header">
                            <div className="seed-header-cover"></div>
                            <div className="seed-header-title">种子名称</div>
                            <div className="seed-header-size">大小</div>
                            <div className="seed-header-upload-time">上传时间</div>
                            <div className="seed-header-downloads">下载次数</div>
                            <div className="seed-header-actions">操作</div>
                        </div>
                        <div className="seed-list-body">
                            {seeds.map((seed, index) => {
                                let tagsArray = [];
                                if (seed.tags) {
                                    if (Array.isArray(seed.tags)) {
                                        tagsArray = seed.tags;
                                    } else if (typeof seed.tags === 'string') {
                                        try {
                                            tagsArray = JSON.parse(seed.tags);
                                            if (!Array.isArray(tagsArray)) {
                                                tagsArray = seed.tags.split('，').map(t => t.trim()).filter(t => t);
                                            }
                                        } catch {
                                            tagsArray = seed.tags.split('，').map(t => t.trim()).filter(t => t);
                                        }
                                    }
                                }

                                return (
                                    // <Link to={`/seed/${seed.id}`} key={index} className="seed-item-link">
                                     <Link to={`/seed/${seed.id}`} key={seed.id} className="seed-item-link">
                                        <div className="seed-item">
                                            {seed.imageUrl && (
                                                <img src={seed.imageUrl} alt={seed.title} className="seed-item-cover" />
                                            )}
                                            <div className="seed-item-title">
                                                <div className="seed-title-row">
                                                    <h3 className="seed-title">{seed.title}</h3>
                                                    <div className="seed-tags">
                                                        {tagsArray.map((tag, i) => (
                                                            <span key={i} className="tag-label">{tag}</span>
                                                        ))}
                                                    </div>
                                                </div>
                                            </div>
                                            {/* <div className="seed-item-size">{seed.size || '未知'}</div> */}
                                            <div className="seed-item-size">{seed.size ? formatBytes(seed.size) : '未知'}</div>

                                                <div className="seed-item-upload-time">
                                                    {
                                                        (() => {
                                                        if (!seed.createdTime || !Array.isArray(seed.createdTime)) return '未知';
                                                        const [year, month, day, hour, minute, second] = seed.createdTime;
                                                        if ([year, month, day, hour, minute, second].some(v => typeof v !== 'number')) return '未知';

                                                        const date = new Date(year, month - 1, day, hour, minute, second);
                                                        if (isNaN(date.getTime())) return '未知';

                                                        // 格式化为 yyyy-mm-dd
                                                        const yyyy = date.getFullYear();
                                                        const mm = String(date.getMonth() + 1).padStart(2, '0');  // 月份要加1，补0
                                                        const dd = String(date.getDate()).padStart(2, '0');

                                                        return `${yyyy}-${mm}-${dd}`;
                                                        })()
                                                    }
                                                </div>


                                            <div className="seed-item-downloads">{seed.leechers ?? 0} 次下载</div>
                                            <div className="seed-item-actions" onClick={e => e.stopPropagation()}>
                                                <AuthButton
                                                    roles={["cookie", "chocolate", "ice-cream"]}
                                                    className="btn-primary"
                                                    onClick={e => {
                                                        e.preventDefault();
                                                        e.stopPropagation();
                                                        if (!user || !user.userId) {
                                                            toast.error('请先登录再下载种子文件');
                                                            return;
                                                        }
                                                        confirmAlert({
                                                            title: '确认下载',
                                                            message: `是否下载种子「${seed.title}」？`,
                                                            buttons: [
                                                                {
                                                                    label: '确认',
                                                                    onClick: () => handleDownload(seed.id)
                                                                },
                                                                {
                                                                    label: '取消',
                                                                    onClick: () => { }
                                                                }
                                                            ]
                                                        });
                                                    }}
                                                >
                                                    下载
                                                </AuthButton>
                                                <AuthButton
                                                    roles={["cookie", "chocolate", "ice-cream"]}
                                                    className="btn-outline"
                                                    onClick={async (e) => {
                                                        e.preventDefault();
                                                        e.stopPropagation();

                                                        if (!user || !user.userId) {
                                                            toast.error('请先登录再收藏');
                                                            return;
                                                        }

                                                        try {
                                                            const res = await axios.post(`/seeds/${seed.id}/favorite-toggle`, null, {
                                                                params: { user_id: user.userId },
                                                            });

                                                            if (res.data.code === 0) {
                                                                toast.success('操作成功');
                                                            } else {
                                                                toast.error(res.data.msg || '操作失败');
                                                            }
                                                        } catch (err) {
                                                            console.error('收藏失败:', err);
                                                            toast.error('收藏失败，请稍后再试。');
                                                        }
                                                    }}
                                                >
                                                    收藏
                                                </AuthButton>
                                            </div>
                                        </div>
                                    </Link>
                                );
                            })}
                        </div>
                    </div>
                )}
            </div>
        </div>
    );
};

export default SeedList;