import { ref, computed, watch, onMounted, nextTick } from 'vue'
import { getRobotTaskData, type RobotTaskData } from '../data/robotTasks'
import { robotConfig } from '../config/robotConfig'

interface Props {
  visible: boolean
  robotType: string
}

export function useTaskDetail(props: Props) {
  // 响应式数据
  const taskData = ref<RobotTaskData>(getRobotTaskData(props.robotType))
  const taskListContainer = ref<HTMLElement>()
  const selectedTaskIndex = ref(0)

  // 详情视图相关
  const showDetails = ref(false)
  const taskDetails = ref('')
  const isLoadingDetails = ref(false)
  let sseInterval: number | undefined = undefined

  // SSE相关配置
  const sseUrl = ref('')
  const useSSE = ref(false)
  const useMarkdown = ref(true)

  // 数字动画相关
  const animatedWorkTaskCount = ref(0)
  const animatedProblemCount = ref(0)

  // 跟踪已处理的检测项目
  const processedItems = ref<Set<string>>(new Set())

  // 保存原始检测数据，用于重置
  const originalDetectionItems = ref<any[]>([])

  // 保存 WebSocket 清理函数
  let cleanupWebSocket: (() => void) | undefined = undefined

  // 当前更新索引
  const currentUpdateIndexRef = ref(0)

  // 动画完成标志
  let isAnimationComplete = true

  // 模拟完成标志
  let isSimulationComplete = true

  // 重置检测数据到原始状态
  const resetDetectionData = () => {
    // 只在有原始数据且当前任务有检测数据时重置
    if (originalDetectionItems.value.length > 0) {
      const task = taskData.value.taskList[selectedTaskIndex.value]
      if (task) {
        // 深拷贝原始数据以避免引用问题
        task.detectionItems = JSON.parse(JSON.stringify(originalDetectionItems.value))
      }
    }
  }

  // 重置模拟状态
  const resetSimulationState = () => {
    // 清理之前的 WebSocket
    if (cleanupWebSocket) {
      cleanupWebSocket()
      cleanupWebSocket = undefined
    }
    // 重置已处理项目
    processedItems.value.clear()
    // 重置更新索引
    currentUpdateIndexRef.value = 0
    // 重置模拟完成标志
    isSimulationComplete = true
  }

  // 保存当前任务的原始检测数据
  const saveOriginalDetectionData = () => {
    const task = taskData.value.taskList[selectedTaskIndex.value]
    if (task && task.detectionItems) {
      // 深拷贝当前检测数据以避免引用问题
      originalDetectionItems.value = JSON.parse(JSON.stringify(task.detectionItems))
    } else {
      // 清空原始数据如果当前任务没有检测数据
      originalDetectionItems.value = []
    }
  }

  // 开始或重新开始模拟
  const startSimulation = () => {
    // 保存当前任务的原始检测数据
    saveOriginalDetectionData()
    // 重置状态
    resetSimulationState()
    // 重新启动模拟
    cleanupWebSocket = simulateWebSocket()
  }

  // 停止模拟
  const stopSimulation = () => {
    if (cleanupWebSocket) {
      cleanupWebSocket()
      cleanupWebSocket = undefined
    }
  }

  // 切换详情视图
  const toggleDetails = () => {
    if (showDetails.value) {
      // 返回列表视图
      showDetails.value = false
      // 清理SSE模拟
      if (sseInterval) {
        clearInterval(sseInterval)
        sseInterval = undefined
      }
    } else {
      // 切换到详情视图
      showDetails.value = true
      const task = taskData.value.taskList[selectedTaskIndex.value]
      if (isCurrentTaskRunning.value) {
        // 正在进行的任务，模拟SSE
        simulateSSE()
      } else {
        // 已完成的任务，直接显示详情
        taskDetails.value = task?.details || getMockDetails()
      }
    }
  }

  // 模拟SSE连接返回数据
  const simulateSSE = () => {
    isLoadingDetails.value = true
    taskDetails.value = ''

    const fullDetails = selectedTaskData.value?.details || getMockDetails()
    let index = 0
    const speed = 20 // 字符显示速度

    sseInterval = window.setInterval(() => {
      if (index < fullDetails.length) {
        taskDetails.value += fullDetails[index]
        index++
      } else {
        clearInterval(sseInterval)
        sseInterval = undefined
        isLoadingDetails.value = false
      }
    }, speed)
  }

  // 获取模拟详情数据
  const getMockDetails = () => {
    return `## 任务详情\n\n### 任务概览\n- 任务类型：${taskData.value.title}\n- 时间：${taskData.value.taskTime}\n\n### 检查过程\n14:30:00 - 14:38:25 淮阳区黄集区域养老服务中心\n14:30:15 【食材采购质量检查】\n✅ 食材新鲜度：通过视觉识别算法分析食材色泽、纹理和形态，判断新鲜度。结果：正常。所有食材均在保质期内，无变质迹象。\n✅ 食材来源合规性：通过二维码扫描和数据库比对，验证食材供应商资质。结果：正常。所有食材来源均可追溯，供应商资质齐全。\n✅ 食材储存条件：检测冷库温度、湿度和通风情况。结果：正常。储存环境符合食品安全标准。\n\n14:32:40 【营养搭配检查】\n✅ 蛋白质摄入量：分析当日食谱蛋白质含量。结果：正常。蛋白质摄入量符合老年人营养需求标准。\n⚠️ 维生素摄入量：分析食谱维生素含量。结果：低风险。维生素A摄入量略低于标准，建议增加胡萝卜、南瓜等食物。\n✅ 膳食均衡性：评估食谱中各类营养素比例。结果：正常。碳水化合物、蛋白质、脂肪比例合理。`
  }

  // 选中的任务数据（添加错误处理）
  const selectedTaskData = computed(() => {
    try {
      const task = taskData.value?.taskList?.[selectedTaskIndex.value]
      if (task?.detectionItems && task.detectionItems.length > 0) {
        return task
      }
      return {
        details: task?.details || '',
        institutionsList: taskData.value?.institutionsList || [],
        detectionItems: taskData.value?.detectionItems || [],
      }
    } catch (error) {
      console.error('Error in selectedTaskData computed:', error)
      return {
        details: '',
        institutionsList: [],
        detectionItems: [],
      }
    }
  })

  // 计算当前正在排查的机构名称
  const currentInstitutionName = computed(() => {
    if (
      taskData.value.isRunning &&
      selectedTaskData.value.institutionsList &&
      selectedTaskData.value.institutionsList.length > 0
    ) {
      return selectedTaskData.value.institutionsList[0].name
    }
    return ''
  })

  // 计算已排查的机构数量
  const inspectedCount = computed(() => {
    if (selectedTaskData.value.institutionsList) {
      return selectedTaskData.value.institutionsList.length
    }
    return 0
  })

  // 机构列表
  const institutionsList = computed(() => {
    return selectedTaskData.value.institutionsList || []
  })

  // 判断当前选中的任务是否是正在运行的任务
  const isCurrentTaskRunning = computed(() => {
    return taskData.value?.isRunning && selectedTaskIndex.value === 0
  })

  // 标记项目为已处理
  const markItemAsProcessed = (detectionIndex: number, itemIndex: number) => {
    processedItems.value.add(`${detectionIndex}-${itemIndex}`)
  }

  // 检查项目是否已处理
  const isChecked = (detectionIndex: number, itemIndex: number) => {
    const currentPath = `${detectionIndex}-${itemIndex}`
    return processedItems.value.has(currentPath)
  }

  // 检查项目是否正在检测中
  const isChecking = (detectionIndex: number, itemIndex: number) => {
    // 构建当前项目的路径
    const currentPath = `${detectionIndex}-${itemIndex}`

    // 检查是否是检测事项2的第二条或之后的项目
    // 对于检测事项2，只显示第一条直接结果，从第二条开始检测
    // 对于后续检测事项，所有项目都需要检测
    if (detectionIndex < 1 || (detectionIndex === 1 && itemIndex < 1)) {
      return false // 检测事项1和检测事项2的第一条直接显示结果
    }

    // 检查是否已经处理过
    if (processedItems.value.has(currentPath)) {
      return false // 已处理的项目不显示检测中
    }

    // 检查是否是当前正在处理的项目或后续项目
    const updateOrder = buildUpdateOrder()
    if (updateOrder.length > 0) {
      const currentIndex = currentUpdateIndexRef.value

      // 检查是否在更新顺序中
      for (let i = currentIndex; i < updateOrder.length; i++) {
        const item = updateOrder[i]
        if (item.detectionIndex === detectionIndex && item.itemIndex === itemIndex) {
          // 如果是当前正在处理的项目，显示检测中
          if (i === currentIndex) {
            return true
          }
          // 否则显示-（未开始检测）
          break
        }
      }
    }

    return false
  }

  // 动态生成检测项目更新顺序：从检测事项2的第二条开始到最后一个检测事项的最后一条
  const buildUpdateOrder = () => {
    try {
      const order: { detectionIndex: number; itemIndex: number }[] = []
      const detectionItems = selectedTaskData.value.detectionItems

      if (!detectionItems) return order

      // 从检测事项2开始（index >= 1）
      for (let d = 1; d < detectionItems.length; d++) {
        const detection = detectionItems[d]
        if (detection?.tableData) {
          // 对于检测事项2，从第二个项目开始（index >= 1）
          // 对于后续检测事项，从第一个项目开始（index >= 0）
          const startIndex = d === 1 ? 1 : 0
          for (let i = startIndex; i < detection.tableData.length; i++) {
            order.push({ detectionIndex: d, itemIndex: i })
          }
        }
      }
      return order
    } catch (error) {
      console.error('Error in buildUpdateOrder:', error)
      return []
    }
  }

  // 检查是否所有检测项目都已处理完成
  const isAllItemsProcessed = () => {
    try {
      const updateOrder = buildUpdateOrder()
      return updateOrder.length > 0 && currentUpdateIndexRef.value >= updateOrder.length
    } catch (error) {
      console.error('Error in isAllItemsProcessed:', error)
      return false
    }
  }

  // 模拟WebSocket通信
  const simulateWebSocket = () => {
    // 只在当前任务是运行中时才模拟
    if (!isCurrentTaskRunning.value) {
      // 不需要模拟时，直接标记为完成
      isSimulationComplete = true
      return
    }

    console.log('模拟WebSocket通信已启动')

    let updateOrder = buildUpdateOrder()
    currentUpdateIndexRef.value = 0

    console.log('模拟WebSocket通信更新顺序1:', updateOrder)

    // 模拟WebSocket连接
    const updateInterval = setInterval(() => {
      console.log('模拟WebSocket通信进入循环', currentUpdateIndexRef.value)
      try {
        // 检查是否所有项目都已处理完成
        if (isAllItemsProcessed()) {
          console.log('所有检测项目已处理完成，停止WebSocket模拟')
          // 标记模拟完成
          isSimulationComplete = true
          clearInterval(updateInterval)
          return
        }

        // 动态检查是否有新的检测事项
        const newOrder = buildUpdateOrder()
        if (newOrder.length > updateOrder.length) {
          updateOrder = newOrder
          console.log('检测项目更新顺序已更新:', newOrder)
        }

        if (
          selectedTaskData.value.detectionItems &&
          currentUpdateIndexRef.value < updateOrder.length
        ) {
          const { detectionIndex, itemIndex } = updateOrder[currentUpdateIndexRef.value]
          const detectionItem = selectedTaskData.value.detectionItems[detectionIndex]

          if (detectionItem && detectionItem.tableData && detectionItem.tableData[itemIndex]) {
            const row = detectionItem.tableData[itemIndex]

            // 生成更平衡的状态
            const random = Math.random()
            let newStatus = '正常'
            if (random > 0.7) {
              newStatus = '异常'
            } else if (random > 0.5) {
              newStatus = '高风险'
            } else if (random > 0.3) {
              newStatus = '低风险'
            }

            // 更新状态和详情
            row.result = newStatus

            if (newStatus === '正常') {
              row.details = '-'
            } else if (newStatus === '低风险') {
              row.details = '检测到潜在安全隐患'
            } else if (newStatus === '高风险') {
              row.details = '发现严重安全问题，需要立即处理'
            } else {
              row.details = '发现异常情况'
            }

            row.evidence = `HJ-20260410-${1510 + currentUpdateIndexRef.value}`

            // 标记为已处理
            markItemAsProcessed(detectionIndex, itemIndex)

            // 移动到下一个项目
            currentUpdateIndexRef.value++

            console.log('处理项目:', { detectionIndex, itemIndex, newStatus })
            console.log('当前更新索引:', currentUpdateIndexRef.value)
          }
        }
      } catch (error) {
        console.error('Error in WebSocket simulation:', error)
      }
    }, 2000)

    // 清理定时器
    return () => {
      console.log('清理WebSocket模拟定时器')
      clearInterval(updateInterval)
    }
  }

  // 处理任务点击
  const handleTaskClick = (index: number) => {
    // 如果已经打开了详情则关闭详情
    if (showDetails.value) {
      showDetails.value = false
      if (sseInterval) {
        clearInterval(sseInterval)
        sseInterval = undefined
      }
    }
    selectedTaskIndex.value = index
    // 重置检测数据到原始状态
    resetDetectionData()
    // 重新开始模拟
    startSimulation()
  }

  // 处理弹窗关闭
  const handleClose = () => {
    // 标记动画完成
    isAnimationComplete = true
    // 停止模拟
    stopSimulation()
    // 重置状态
    resetSimulationState()
    // 清空原始数据
    originalDetectionItems.value = []
    // 清理SSE模拟
    if (sseInterval) {
      clearInterval(sseInterval)
      sseInterval = undefined
    }
    // 清理鼠标拖动事件监听器
    cleanupMouseDrag()
  }

  // 数字滚动动画
  const animateNumbers = (targetWorkTask: number, targetProblem: number) => {
    let currentWorkTask = 0
    let currentProblem = 0
    const duration = 2000 // 动画持续时间（毫秒）
    const frameDuration = 16 // 每帧持续时间（约60fps）
    const totalFrames = duration / frameDuration

    let frame = 0

    const intervalId = setInterval(() => {
      frame++
      const progress = frame / totalFrames

      // 使用缓动函数使动画更自然
      const easeProgress = 1 - Math.pow(1 - progress, 3)

      currentWorkTask = Math.floor(targetWorkTask * easeProgress)
      currentProblem = Math.floor(targetProblem * easeProgress)

      animatedWorkTaskCount.value = currentWorkTask
      animatedProblemCount.value = currentProblem

      if (frame >= totalFrames) {
        // 确保最终值正确
        animatedWorkTaskCount.value = targetWorkTask
        animatedProblemCount.value = targetProblem
        clearInterval(intervalId)
        // 标记动画完成
        isAnimationComplete = true
      }
    }, frameDuration)
  }

  // 获取机器人图片路径
  const getRobotImage = (type: string) => {
    const robot = robotConfig.find((r) => r.type === type)
    const imageName = robot?.image || 'robot_auditor.png'
    return new URL(`../assets/images/${imageName}`, import.meta.url).href
  }

  // 获取任务状态
  const getTaskStatus = (index: number) => {
    if (taskData.value.isRunning && index === 0) {
      return 'info'
    }
    const task = taskData.value.taskList[index]
    return task.status === 'danger' ? 'danger' : 'success'
  }

  // 获取机构颜色
  const getInstitutionColor = (institution: any) => {
    if (institution.problemCount === 0) {
      return '#00ffe6' // 正常
    } else if (institution.problemCount === 1) {
      return '#fdd330' // 低风险
    } else {
      return '#fc6565' // 异常
    }
  }

  // 鼠标拖动功能
  let isDragging = false
  let startX = 0
  let scrollLeft = 0

  const handleMouseDown = (e: MouseEvent) => {
    isDragging = true
    startX = e.pageX - (taskListContainer.value?.offsetLeft || 0)
    scrollLeft = taskListContainer.value?.scrollLeft || 0
  }

  const handleMouseMove = (e: MouseEvent) => {
    if (!isDragging || !taskListContainer.value) return
    e.preventDefault()
    const x = e.pageX - (taskListContainer.value.offsetLeft || 0)
    const walk = (x - startX) * 2
    taskListContainer.value.scrollLeft = scrollLeft - walk
  }

  const handleMouseUp = () => {
    isDragging = false
  }

  // 清理鼠标拖动事件监听器
  const cleanupMouseDrag = () => {
    if (taskListContainer.value) {
      taskListContainer.value.removeEventListener('mousedown', handleMouseDown)
    }
    document.removeEventListener('mousemove', handleMouseMove)
    document.removeEventListener('mouseup', handleMouseUp)
  }

  const handleMouseDrag = () => {
    // 使用微任务异步添加事件监听，避免阻塞弹窗渲染
    queueMicrotask(() => {
      if (!taskListContainer.value) return
      taskListContainer.value.addEventListener('mousedown', handleMouseDown)
      document.addEventListener('mousemove', handleMouseMove)
      document.addEventListener('mouseup', handleMouseUp)
    })
  }

  // 初始化或重置模拟和动画（带防抖保护）
  const initSimulationAndAnimation = () => {
    // 检查是否可以执行：数字动画结束且WebSocket模拟完成或不需要模拟
    const canExecute = isAnimationComplete && (isSimulationComplete || !isCurrentTaskRunning.value)

    // 如果不能执行，直接返回
    if (!canExecute) {
      console.log('初始化模拟和动画 - 等待条件满足', {
        isAnimationComplete,
        isSimulationComplete,
        needSimulation: isCurrentTaskRunning.value,
      })
      return
    }

    console.log('初始化模拟和动画')

    // 重置标志
    isAnimationComplete = false
    isSimulationComplete = false

    // 使用微任务异步执行，避免阻塞弹窗渲染
    queueMicrotask(() => {
      // 开始模拟
      startSimulation()
      // 启动数字动画
      animateNumbers(taskData.value.workTaskCount, taskData.value.problemCount)
    })
  }

  // 监听机器人类型变化
  watch(
    () => props.robotType,
    (newRobotType, oldRobotType) => {
      console.log('机器人类型变化:', oldRobotType, '->', newRobotType)
      // 停止当前模拟
      if (oldRobotType) stopSimulation()

      // 更新任务数据
      taskData.value = getRobotTaskData(newRobotType)

      // 重置动画值
      animatedWorkTaskCount.value = 0
      animatedProblemCount.value = 0

      // 清空原始数据
      originalDetectionItems.value = []

      // 重置选中任务索引
      selectedTaskIndex.value = 0

      // 弹窗打开时初始化模拟和动画
      if (props.visible) {
        initSimulationAndAnimation()
      }
    }
  )

  // 监听可见性变化
  watch(
    () => props.visible,
    (newVisible, oldVisible) => {
      console.log('弹窗可见性变化:', oldVisible, '->', newVisible)
      if (newVisible) {
        handleMouseDrag()
        // 弹窗打开时，初始化模拟和动画
        initSimulationAndAnimation()
      } else {
        // 弹窗关闭时，停止模拟
        handleClose()
      }
    }
  )

  // 组件挂载时
  onMounted(() => {
    // 仅添加事件监听器
    handleMouseDrag()
  })

  // 计算工作任务数字
  const workTaskDigits = computed(() => {
    return animatedWorkTaskCount.value.toString().padStart(4, '0').split('')
  })

  // 计算问题数字
  const problemDigits = computed(() => {
    return animatedProblemCount.value.toString().padStart(4, '0').split('')
  })

  return {
    taskData,
    taskListContainer,
    selectedTaskIndex,
    showDetails,
    taskDetails,
    isLoadingDetails,
    sseUrl,
    useSSE,
    useMarkdown,
    workTaskDigits,
    problemDigits,
    selectedTaskData,
    currentInstitutionName,
    inspectedCount,
    institutionsList,
    isCurrentTaskRunning,
    isChecked,
    isChecking,
    toggleDetails,
    handleTaskClick,
    handleClose,
    getRobotImage,
    getTaskStatus,
    getInstitutionColor,
  }
}
