'use client';

import { useState } from 'react';
import {
  Dialog,
  DialogTitle,
  DialogContent,
  DialogActions,
  Button,
  Box,
  Typography,
  CircularProgress,
  List,
  ListItem,
  ListItemText,
  ListItemSecondaryAction,
  IconButton,
  Alert,
  Paper,
  useTheme,
  Tooltip
} from '@mui/material';
import WarningAmberIcon from '@mui/icons-material/WarningAmber';
import FolderOpenIcon from '@mui/icons-material/FolderOpen';
import DeleteIcon from '@mui/icons-material/Delete';
import { useTranslation } from 'react-i18next';

/**
 * 项目迁移对话框组件
 * @param {Object} props - 组件属性
 * @param {boolean} props.open - 对话框是否打开
 * @param {Function} props.onClose - 关闭对话框的回调函数
 * @param {Array<string>} props.projectIds - 需要迁移的项目ID列表
 */
export default function MigrationDialog({ open, onClose, projectIds = [] }) {
  const { t } = useTranslation();
  const theme = useTheme();
  const [migrating, setMigrating] = useState(false);
  const [success, setSuccess] = useState(false);
  const [error, setError] = useState(null);
  const [migratedCount, setMigratedCount] = useState(0);
  const [taskId, setTaskId] = useState(null);
  const [progress, setProgress] = useState(0);
  const [statusText, setStatusText] = useState('');
  const [processingIds, setProcessingIds] = useState([]);

  // 打开项目目录
  const handleOpenDirectory = async projectId => {
    try {
      setProcessingIds(prev => [...prev, projectId]);

      const response = await fetch('/api/projects/open-directory', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({ projectId })
      });

      if (!response.ok) {
        const data = await response.json();
        throw new Error(data.error || t('migration.openDirectoryFailed'));
      }

      // 成功打开目录，不需要特别处理
    } catch (err) {
      console.error('打开目录错误:', err);
      setError(err.message);
    } finally {
      setProcessingIds(prev => prev.filter(id => id !== projectId));
    }
  };

  // 删除项目目录
  const handleDeleteDirectory = async projectId => {
    try {
      if (!window.confirm(t('migration.confirmDelete'))) {
        return;
      }

      setProcessingIds(prev => [...prev, projectId]);

      const response = await fetch('/api/projects/delete-directory', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({ projectId })
      });

      if (!response.ok) {
        const data = await response.json();
        throw new Error(data.error || t('migration.deleteDirectoryFailed'));
      }

      // 从列表中移除已删除的项目
      const updatedProjectIds = projectIds.filter(id => id !== projectId);
      // 这里我们不能直接修改 projectIds，因为它是从父组件传入的
      // 但我们可以通知用户界面刷新
      window.location.reload();
    } catch (err) {
      console.error('删除目录错误:', err);
      setError(err.message);
    } finally {
      setProcessingIds(prev => prev.filter(id => id !== projectId));
    }
  };

  // 处理迁移操作
  const handleMigration = async () => {
    try {
      setMigrating(true);
      setError(null);
      setSuccess(false);
      setProgress(0);
      setStatusText(t('migration.starting'));

      // 调用异步迁移接口启动迁移任务
      const response = await fetch('/api/projects/migrate', {
        method: 'POST'
      });

      if (!response.ok) {
        throw new Error(t('migration.failed'));
      }

      const { success, taskId: newTaskId } = await response.json();

      if (!success || !newTaskId) {
        throw new Error(t('migration.startFailed'));
      }

      // 保存任务ID
      setTaskId(newTaskId);
      setStatusText(t('migration.processing'));

      // 开始轮询任务状态
      await pollMigrationStatus(newTaskId);
    } catch (err) {
      console.error('迁移错误:', err);
      setError(err.message);
      setMigrating(false);
    }
  };

  // 轮询迁移任务状态
  const pollMigrationStatus = async id => {
    try {
      // 定义轮询间隔（毫秒）
      const pollInterval = 1000;

      // 发送请求获取任务状态
      const response = await fetch(`/api/projects/migrate?taskId=${id}`);

      if (!response.ok) {
        throw new Error(t('migration.statusFailed'));
      }

      const { success, task } = await response.json();

      if (!success || !task) {
        throw new Error(t('migration.taskNotFound'));
      }

      // 更新进度
      setProgress(task.progress || 0);

      // 根据任务状态更新UI
      if (task.status === 'completed') {
        // 任务完成
        setMigratedCount(task.completed);
        setSuccess(true);
        setMigrating(false);
        setStatusText(t('migration.completed'));

        // 迁移成功后，延迟关闭对话框并刷新页面
        setTimeout(() => {
          onClose();
          window.location.reload();
        }, 2000);
      } else if (task.status === 'failed') {
        // 任务失败
        throw new Error(task.error || t('migration.failed'));
      } else {
        // 任务仍在进行中，继续轮询
        setTimeout(() => pollMigrationStatus(id), pollInterval);

        // 更新状态文本
        if (task.total > 0) {
          setStatusText(
            t('migration.progressStatus', {
              completed: task.completed || 0,
              total: task.total
            })
          );
        }
      }
    } catch (err) {
      console.error('获取迁移状态错误:', err);
      setError(err.message);
      setMigrating(false);
    }
  };

  return (
    <Dialog open={open} onClose={migrating ? undefined : onClose} maxWidth="sm" fullWidth>
      <DialogTitle
        sx={{
          display: 'flex',
          alignItems: 'center',
          gap: 1.5
        }}
      >
        <WarningAmberIcon color="warning" />
        <Typography variant="h6">{t('migration.title')}</Typography>
      </DialogTitle>

      <DialogContent>
        {success ? (
          <Alert severity="success" sx={{ mb: 2 }}>
            {t('migration.success', { count: migratedCount })}
          </Alert>
        ) : error ? (
          <Alert severity="error" sx={{ mb: 2 }}>
            {error}
          </Alert>
        ) : null}

        <Typography variant="body1" sx={{ mb: 2 }}>
          {t('migration.description')}
        </Typography>

        {projectIds.length > 0 && (
          <Box sx={{ mt: 2, mb: 2 }}>
            <Typography variant="subtitle1" sx={{ mb: 1 }}>
              {t('migration.projectsList')}:
            </Typography>
            <Paper variant="outlined" sx={{ maxHeight: 180, overflow: 'auto' }}>
              <List dense>
                {projectIds.map(id => (
                  <ListItem key={id}>
                    <ListItemText primary={id} />
                    <ListItemSecondaryAction>
                      <Tooltip title={t('migration.openDirectory')}>
                        <IconButton
                          edge="end"
                          aria-label="open"
                          onClick={() => handleOpenDirectory(id)}
                          disabled={processingIds.includes(id)}
                          size="small"
                        >
                          <FolderOpenIcon fontSize="small" />
                        </IconButton>
                      </Tooltip>
                      <Tooltip title={t('migration.deleteDirectory')}>
                        <IconButton
                          edge="end"
                          aria-label="delete"
                          onClick={() => handleDeleteDirectory(id)}
                          disabled={processingIds.includes(id)}
                          size="small"
                          sx={{ ml: 1, color: 'error.main' }}
                        >
                          <DeleteIcon fontSize="small" />
                        </IconButton>
                      </Tooltip>
                    </ListItemSecondaryAction>
                  </ListItem>
                ))}
              </List>
            </Paper>
          </Box>
        )}

        {migrating && (
          <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', my: 3, gap: 1.5 }}>
            <CircularProgress variant={progress > 0 ? 'determinate' : 'indeterminate'} value={progress} />
            <Typography variant="body2" color="text.secondary">
              {statusText || t('migration.migrating')}
            </Typography>
            {progress > 0 && (
              <Typography variant="body2" color="text.secondary">
                {progress}%
              </Typography>
            )}
          </Box>
        )}
      </DialogContent>

      <DialogActions>
        <Button onClick={onClose} disabled={migrating}>
          {t('common.cancel')}
        </Button>
        <Button onClick={handleMigration} variant="contained" color="primary" disabled={migrating || success}>
          {migrating ? t('migration.migrating') : t('migration.migrate')}
        </Button>
      </DialogActions>
    </Dialog>
  );
}