<template>
  <div class="report-edit-container">
    <!-- 左侧罪犯列表 -->
    <div class="prisoner-sidebar">
      <div class="sidebar-header">
        <h3>服刑人员列表</h3>
        <el-input
          v-model="searchKeyword"
          placeholder="搜索姓名/编号"
          prefix-icon="Search"
          clearable
          @input="handleSearch"
          @clear="loadPrisonerList"
          class="search-input"
        />
      </div>

      <div class="prisoner-list" v-loading="prisonerLoading">
        <div
          v-for="prisoner in prisonerList"
          :key="prisoner.id"
          :class="['prisoner-card', { active: currentPrisoner?.id === prisoner.id }]"
          @click="selectPrisoner(prisoner)"
        >
          <div class="card-header">
            <span class="area-name">{{ prisoner.areaName }}</span>
            <el-tag
              v-if="prisoner.riskLevel"
              :type="getRiskLevelType(prisoner.riskLevel)"
              size="small"
            >
              {{ getRiskLevelLabel(prisoner.riskLevel) }}
            </el-tag>
          </div>
          <div class="card-body">
            <span class="prisoner-name">{{ prisoner.name }}</span>
            <span class="prisoner-no">{{ prisoner.prisonerNo }}</span>
          </div>
        </div>

        <el-empty v-if="!prisonerLoading && prisonerList.length === 0" description="暂无数据" />
      </div>

      <div class="sidebar-footer">
        <el-pagination
          v-model:current-page="prisonerPage"
          v-model:page-size="prisonerPageSize"
          :total="prisonerTotal"
          :page-sizes="[10, 20, 50]"
          small
          layout="prev, pager, next, total"
          @current-change="loadPrisonerList"
        />
      </div>
    </div>

    <!-- 右侧报告编辑区 -->
    <div class="report-editor">
      <!-- 顶部操作栏 -->
      <div class="editor-toolbar">
        <div class="toolbar-left">
          <el-button @click="goBack">
            <Icon icon="ep:arrow-left" class="mr-5px" /> 返回
          </el-button>
          <span class="toolbar-divider">|</span>
          <el-button
            type="primary"
            @click="handleAiGenerateAll"
            :loading="aiGenerating"
            :disabled="!currentReport"
          >
            <Icon icon="ep:magic-stick" class="mr-5px" /> AI生成全部
          </el-button>
          <el-button
            @click="handleSaveDraft"
            :loading="saving"
            :disabled="!currentReport"
          >
            <Icon icon="ep:document-checked" class="mr-5px" /> 保存草稿
            <span v-if="lastSaveTime" class="save-time"> ({{ lastSaveTime }})</span>
          </el-button>
        </div>

        <div class="toolbar-center">
          <span class="report-title">{{ currentReport?.title || '未选择报告' }}</span>
        </div>

        <div class="toolbar-right">
          <el-button
            @click="handleShowQuickComment"
            :disabled="!currentReport"
          >
            <Icon icon="ep:tickets" class="mr-5px" /> 快捷评语
          </el-button>
          <el-button
            @click="handleShowVersionHistory"
            :disabled="!currentReport"
          >
            <Icon icon="ep:clock" class="mr-5px" /> 历史版本
          </el-button>
          <el-button
            type="success"
            @click="handleSubmitReview"
            :disabled="!canSubmit"
            v-hasPermi="['prison:report:submit']"
          >
            <Icon icon="ep:position" class="mr-5px" /> 提交审核
          </el-button>
          <el-button
            @click="handlePreview"
            :disabled="!currentReport"
          >
            <Icon icon="ep:view" class="mr-5px" /> 预览
          </el-button>
          <el-button
            type="primary"
            @click="handleExport('pdf')"
            :disabled="!currentReport"
          >
            <Icon icon="ep:download" class="mr-5px" /> 导出
          </el-button>
        </div>
      </div>

      <!-- 基本信息区 -->
      <div class="basic-info" v-if="currentReport">
        <el-descriptions :column="4" border size="small">
          <el-descriptions-item label="服刑人员">
            {{ currentReport.prisonerName }} ({{ currentReport.prisonerNo }})
          </el-descriptions-item>
          <el-descriptions-item label="监区">
            {{ currentReport.areaName || '-' }}
          </el-descriptions-item>
          <el-descriptions-item label="评估日期">
            {{ currentReport.reportDate }}
          </el-descriptions-item>
          <el-descriptions-item label="模板">
            {{ currentReport.templateName }}
          </el-descriptions-item>
          <el-descriptions-item label="风险等级">
            <el-tag
              v-if="currentReport.riskLevel"
              :type="getRiskLevelType(currentReport.riskLevel)"
            >
              {{ getRiskLevelLabel(currentReport.riskLevel) }}
            </el-tag>
            <span v-else>-</span>
          </el-descriptions-item>
          <el-descriptions-item label="状态">
            <dict-tag :type="DICT_TYPE.PRISON_REPORT_STATUS" :value="currentReport.status" />
          </el-descriptions-item>
          <el-descriptions-item label="版本">
            v{{ currentReport.version }}
          </el-descriptions-item>
          <el-descriptions-item label="数据源状态">
            <el-tag v-if="dataSourceStatus.complete" type="success" size="small">
              已加载 {{ dataSourceStatus.loaded }}/{{ dataSourceStatus.total }}
            </el-tag>
            <el-tag v-else type="warning" size="small" loading>
              加载中...
            </el-tag>
          </el-descriptions-item>
        </el-descriptions>
      </div>

      <!-- 审核退回提示 -->
      <div v-if="currentReport?.status === 4 && currentReport.reviewComment" class="reject-notice">
        <el-alert
          type="warning"
          :closable="false"
          show-icon
        >
          <template #title>
            审核退回原因：{{ currentReport.reviewComment }}
            <el-button type="primary" link size="small" @click="scrollToContent">
              立即修改
            </el-button>
          </template>
        </el-alert>
      </div>

      <!-- 编辑内容区 -->
      <div class="editor-content" v-if="currentReport" ref="contentRef">
        <!-- 维度分析区 -->
        <div class="dimension-editor">
          <el-collapse v-model="activeDimensions">
            <el-collapse-item
              v-for="(dimension, index) in currentReport.dimensions"
              :key="dimension.dimensionId"
              :name="dimension.dimensionId"
              :title="dimension.dimensionName"
            >
              <template #title>
                <div class="dimension-title-bar">
                  <span class="dimension-name">{{ index + 1 }}. {{ dimension.dimensionName }}</span>
                  <div class="dimension-tags">
                    <el-tag
                      v-if="dimension.isAiGenerated"
                      type="success"
                      size="small"
                    >
                      AI生成
                    </el-tag>
                    <el-tag
                      v-else-if="dimension.lastModifyTime"
                      type="info"
                      size="small"
                    >
                      已修改
                    </el-tag>
                    <el-tag
                      v-if="dimension.aiGenerateTime"
                      type="info"
                      size="small"
                    >
                      {{ dimension.aiGenerateTime }}
                    </el-tag>
                  </div>
                </div>
              </template>

              <div class="dimension-content">
                <el-input
                  v-model="dimension.content"
                  type="textarea"
                  :rows="6"
                  placeholder="请输入评估内容"
                  @change="markDimensionModified(dimension)"
                />

                <div class="dimension-actions">
                  <el-button
                    v-if="dimension.enableAi"
                    type="primary"
                    size="small"
                    @click="handleAiGenerate(dimension)"
                    :loading="aiGenerating && generatingDimensionId === dimension.dimensionId"
                  >
                    <Icon icon="ep:magic-stick" class="mr-5px" />
                    {{ dimension.isAiGenerated ? '重新生成' : 'AI生成' }}
                  </el-button>
                  <el-button
                    v-if="dimension.lastModifyTime && dimension.isAiGenerated"
                    size="small"
                    @click="handleRestoreAiContent(dimension)"
                  >
                    恢复AI内容
                  </el-button>
                </div>
              </div>
            </el-collapse-item>
          </el-collapse>
        </div>

        <!-- 综合结论与建议 -->
        <div class="conclusion-section">
          <h3 class="section-title">综合结论与建议</h3>

          <el-form label-width="100px" size="default">
            <el-form-item label="风险等级">
              <el-select v-model="currentReport.riskLevel" placeholder="请选择风险等级">
                <el-option
                  v-for="dict in getIntDictOptions(DICT_TYPE.PRISON_RISK_LEVEL)"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>

            <el-form-item label="综合结论">
              <el-input
                v-model="currentReport.conclusion"
                type="textarea"
                :rows="4"
                placeholder="请输入综合结论"
              />
            </el-form-item>

            <el-form-item label="改造建议">
              <el-input
                v-model="currentReport.suggestions"
                type="textarea"
                :rows="4"
                placeholder="请输入改造建议"
              />
            </el-form-item>
          </el-form>
        </div>
      </div>

      <!-- 空状态 -->
      <div v-else class="empty-state">
        <el-empty description="请从左侧选择服刑人员开始编辑报告">
          <el-button type="primary" @click="openCreateDialog">创建报告</el-button>
        </el-empty>
      </div>
    </div>

    <!-- 快捷评语弹窗 -->
    <QuickCommentDialog
      ref="quickCommentDialogRef"
      :category-type="1"
      @insert="insertComment"
    />

    <!-- 历史版本弹窗 -->
    <VersionHistoryDialog
      ref="versionDialogRef"
      :report-id="currentReport?.id"
      @restore="handleRestoreVersion"
    />

    <!-- 报告预览弹窗 -->
    <ReportPreviewDialog ref="previewDialogRef" />
  </div>
</template>

<script setup lang="ts">
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
import { useRoute, useRouter } from 'vue-router'
import { ReportApi, Report, ReportDimensionContent } from '@/api/prison/report'
import { PrisonerSelectApi, PrisonerBrief } from '@/api/prison/report'
import QuickCommentDialog from '@/views/prison/report/components/QuickCommentDialog.vue'
import VersionHistoryDialog from '@/views/prison/report/components/VersionHistoryDialog.vue'
import ReportPreviewDialog from '@/views/prison/report/components/ReportPreviewDialog.vue'

/** 评估报告编辑页面 */
defineOptions({ name: 'PrisonReportEdit' })

const route = useRoute()
const router = useRouter()
const message = useMessage()

// 左侧罪犯列表
const prisonerLoading = ref(false)
const prisonerList = ref<PrisonerBrief[]>([])
const prisonerPage = ref(1)
const prisonerPageSize = ref(20)
const prisonerTotal = ref(0)
const searchKeyword = ref('')

// 右侧编辑区
const currentPrisoner = ref<PrisonerBrief | null>(null)
const currentReport = ref<Report | null>(null)
const activeDimensions = ref<number[]>([])
const lastSaveTime = ref<string | null>(null)

// 状态
const saving = ref(false)
const aiGenerating = ref(false)
const generatingDimensionId = ref<number | null>(null)
const dataSourceStatus = ref({ total: 6, loaded: 0, complete: false })

// 组件引用
const contentRef = ref()
const quickCommentDialogRef = ref()
const versionDialogRef = ref()
const previewDialogRef = ref()

/** 加载罪犯列表 */
const loadPrisonerList = async () => {
  prisonerLoading.value = true
  try {
    const data = await PrisonerSelectApi.getPrisonerPage({
      pageNo: prisonerPage.value,
      pageSize: prisonerPageSize.value,
      name: searchKeyword.value,
      prisonerNo: searchKeyword.value
    })
    prisonerList.value = data.list
    prisonerTotal.value = data.total
  } finally {
    prisonerLoading.value = false
  }
}

/** 搜索罪犯 */
const handleSearch = () => {
  prisonerPage.value = 1
  if (searchKeyword.value) {
    // 防抖搜索
    setTimeout(() => loadPrisonerList(), 300)
  } else {
    loadPrisonerList()
  }
}

/** 选择罪犯 */
const selectPrisoner = async (prisoner: PrisonerBrief) => {
  currentPrisoner.value = prisoner
  // 检查是否已有报告
  await loadReportForPrisoner(prisoner.id)
}

/** 为罪犯加载/创建报告 */
const loadReportForPrisoner = async (prisonerId: number) => {
  try {
    // 这里应该调用API获取该罪犯的最新报告
    // 暂时使用模拟数据
    // const data = await ReportApi.getLatestReportByPrisoner(prisonerId)
    // currentReport.value = data

    // 模拟初始化报告数据
    currentReport.value = {
      id: Date.now(),
      reportNo: `BG${new Date().toISOString().slice(0, 10).replace(/-/g, '')}${String(Math.floor(Math.random() * 10000)).padStart(4, '0')}`,
      prisonerId: prisonerId,
      prisonerNo: currentPrisoner.value?.prisonerNo || '',
      prisonerName: currentPrisoner.value?.name || '',
      templateId: 1,
      templateName: '入监综合评估报告',
      title: `${currentPrisoner.value?.name}服刑期间综合评估报告`,
      reportDate: new Date().toISOString().slice(0, 10),
      dimensions: [
        {
          dimensionId: 1,
          dimensionName: '基本信息',
          content: '',
          isAiGenerated: false,
          enableAi: false,
          sort: 1
        },
        {
          dimensionId: 2,
          dimensionName: '犯罪情况分析',
          content: '',
          isAiGenerated: true,
          enableAi: true,
          sort: 2
        },
        {
          dimensionId: 3,
          dimensionName: '服刑表现评估',
          content: '',
          isAiGenerated: true,
          enableAi: true,
          sort: 3
        },
        {
          dimensionId: 4,
          dimensionName: '消费行为分析',
          content: '',
          isAiGenerated: true,
          enableAi: true,
          sort: 4
        },
        {
          dimensionId: 5,
          dimensionName: '综合评估结论',
          content: '',
          isAiGenerated: true,
          enableAi: true,
          sort: 5
        }
      ],
      status: 1,
      version: 1
    }

    // 默认展开所有维度
    activeDimensions.value = currentReport.value.dimensions.map(d => d.dimensionId)
    updateDataSourceStatus()
  } catch {}
}

/** 更新数据源状态 */
const updateDataSourceStatus = () => {
  // 模拟数据源加载完成
  dataSourceStatus.value = { total: 6, loaded: 6, complete: true }
}

/** 获取风险等级类型 */
const getRiskLevelType = (level?: number): string => {
  const map: Record<number, string> = {
    1: 'success',
    2: 'warning',
    3: 'danger',
    4: 'danger'
  }
  return level ? map[level] || 'info' : 'info'
}

/** 获取风险等级标签 */
const getRiskLevelLabel = (level?: number): string => {
  const map: Record<number, string> = {
    1: '低风险',
    2: '中风险',
    3: '高风险',
    4: '极高风险'
  }
  return level ? map[level] || '-' : '未评估'
}

/** 标记维度已修改 */
const markDimensionModified = (dimension: ReportDimensionContent) => {
  dimension.isAiGenerated = false
  dimension.lastModifyTime = new Date().toISOString().slice(0, 19).replace('T', ' ')
}

/** AI生成单个维度 */
const handleAiGenerate = async (dimension: ReportDimensionContent) => {
  if (!currentReport.value) return

  generatingDimensionId.value = dimension.dimensionId
  aiGenerating.value = true

  try {
    // 调用AI生成接口
    await ReportApi.generateReportByAi(currentReport.value.id, [dimension.dimensionId])

    // 重新获取报告数据
    const data = await ReportApi.getReport(currentReport.value.id)
    currentReport.value = data
    message.success(t('prison.report.aiGenerateComplete'))
  } catch {
    message.error(t('prison.report.aiGenerateFailed'))
  } finally {
    aiGenerating.value = false
    generatingDimensionId.value = null
  }
}

/** AI生成全部 */
const handleAiGenerateAll = async () => {
  if (!currentReport.value) return

  aiGenerating.value = true

  try {
    // 调用批量AI生成接口
    await ReportApi.generateReportByAi(currentReport.value.id)

    // 重新获取报告数据
    const data = await ReportApi.getReport(currentReport.value.id)
    currentReport.value = data
    message.success(t('prison.report.aiGenerateAllComplete'))
  } catch {
    message.error(t('prison.report.aiGenerateFailed'))
  } finally {
    aiGenerating.value = false
    generatingDimensionId.value = null
  }
}

/** 保存草稿 */
const handleSaveDraft = async () => {
  if (!currentReport.value) return

  saving.value = true
  try {
    // 调用保存接口
    await ReportApi.updateReport(currentReport.value)

    lastSaveTime.value = new Date().toLocaleTimeString()
    message.success(t('common.saveSuccess'))
  } catch {
    message.error(t('common.saveFailed'))
  } finally {
    saving.value = false
  }
}

/** 提交审核 */
const handleSubmitReview = async () => {
  if (!currentReport.value) return

  try {
    await message.confirm(t('prison.report.submitConfirm'))
    await ReportApi.submitReport(currentReport.value.id)
    message.success(t('prison.report.submitSuccess'))
    // 刷新报告状态
    currentReport.value.status = 2
  } catch {}
}

/** 恢复AI原始内容 */
const handleRestoreAiContent = async (dimension: ReportDimensionContent) => {
  try {
    await message.confirm(t('prison.report.restoreAiConfirm'))
    // 调用接口获取AI原始内容
    await ReportApi.generateReportByAi(currentReport.value!.id, [dimension.dimensionId])
    // 重新获取报告数据
    const data = await ReportApi.getReport(currentReport.value!.id)
    currentReport.value = data
    message.success(t('prison.report.restoreAiSuccess'))
  } catch {}
}

/** 预览报告 */
const handlePreview = () => {
  if (currentReport.value) {
    previewDialogRef.value?.open(currentReport.value.id)
  }
}

/** 导出报告 */
const handleExport = async (format: 'pdf' | 'word') => {
  if (!currentReport.value) return

  try {
    const data = await ReportApi.exportReport(currentReport.value.id, format)
    const fileName = `${currentReport.value.reportNo}_${currentReport.value.prisonerName}.${format}`
    message.success('导出成功')
  } catch {}
}

/** 显示快捷评语 */
const handleShowQuickComment = () => {
  quickCommentDialogRef.value?.open()
}

/** 插入快捷评语 */
const insertComment = (comment: string) => {
  message.success(t('prison.report.commentInserted'))
}

/** 显示历史版本 */
const handleShowVersionHistory = () => {
  versionDialogRef.value?.open()
}

/** 恢复版本 */
const handleRestoreVersion = async (versionId: number) => {
  try {
    await ReportVersionApi.restoreVersion(versionId)
    message.success(t('prison.report.versionRestored'))
    // 刷新报告内容
    loadReportForPrisoner(currentPrisoner.value!.id)
  } catch {}
}

/** 跳转到内容区 */
const scrollToContent = () => {
  contentRef.value?.scrollIntoView({ behavior: 'smooth' })
}

/** 返回列表 */
const goBack = () => {
  router.push('/prison/report')
}

/** 打开创建报告弹窗 */
const openCreateDialog = () => {
  // 导航到创建页面
  router.push('/prison/report?action=create')
}

/** 是否可以提交 */
const canSubmit = computed(() => {
  if (!currentReport.value) return false
  if (currentReport.value.status !== 1 && currentReport.value.status !== 4) return false
  // 检查是否所有必填项都已填写
  return currentReport.value.dimensions.every(d => d.content)
})

// 初始化
onMounted(() => {
  loadPrisonerList()

  // 如果有报告ID参数，加载报告
  const reportId = route.query.id
  if (reportId) {
    // loadReport(Number(reportId))
  }
})

// 键盘快捷键
onMounted(() => {
  document.addEventListener('keydown', handleKeydown)
})

onUnmounted(() => {
  document.removeEventListener('keydown', handleKeydown)
})

/** 处理键盘快捷键 */
const handleKeydown = (e: KeyboardEvent) => {
  // Ctrl + S 保存
  if (e.ctrlKey && e.key === 's') {
    e.preventDefault()
    handleSaveDraft()
  }
}
</script>

<style lang="scss" scoped>
.report-edit-container {
  display: flex;
  height: calc(100vh - 84px);
  background: #f5f7fa;
}

/* 左侧罪犯列表 */
.prisoner-sidebar {
  width: 280px;
  background: #fff;
  border-right: 1px solid #e4e7ed;
  display: flex;
  flex-direction: column;

  .sidebar-header {
    padding: 15px;
    border-bottom: 1px solid #e4e7ed;

    h3 {
      margin: 0 0 10px 0;
      font-size: 16px;
      font-weight: 600;
      color: #303133;
    }

    .search-input {
      width: 100%;
    }
  }

  .prisoner-list {
    flex: 1;
    overflow-y: auto;
    padding: 10px;
  }

  .prisoner-card {
    padding: 12px;
    border: 1px solid #e4e7ed;
    border-radius: 6px;
    margin-bottom: 10px;
    cursor: pointer;
    transition: all 0.2s;

    &:hover {
      border-color: #409eff;
      background: #ecf5ff;
    }

    &.active {
      border-color: #409eff;
      background: #ecf5ff;
      box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.2);
    }

    .card-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 8px;

      .area-name {
        font-size: 12px;
        color: #909399;
      }
    }

    .card-body {
      display: flex;
      flex-direction: column;
      gap: 4px;

      .prisoner-name {
        font-size: 15px;
        font-weight: 500;
        color: #303133;
      }

      .prisoner-no {
        font-size: 12px;
        color: #909399;
      }
    }
  }

  .sidebar-footer {
    padding: 10px;
    border-top: 1px solid #e4e7ed;
    display: flex;
    justify-content: center;
  }
}

/* 右侧报告编辑区 */
.report-editor {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;

  .editor-toolbar {
    height: 50px;
    background: #fff;
    border-bottom: 1px solid #e4e7ed;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;

    .toolbar-left,
    .toolbar-right {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .toolbar-divider {
      margin: 0 10px;
      color: #e4e7ed;
    }

    .toolbar-center {
      .report-title {
        font-size: 16px;
        font-weight: 600;
        color: #303133;
      }
    }

    .save-time {
      font-size: 12px;
      color: #909399;
    }
  }

  .basic-info {
    padding: 15px 20px;
    background: #fff;
    border-bottom: 1px solid #e4e7ed;
  }

  .reject-notice {
    padding: 10px 20px;
    background: #fdf6ec;
  }

  .editor-content {
    flex: 1;
    overflow-y: auto;
    padding: 20px;

    .dimension-editor {
      background: #fff;
      border-radius: 4px;
      padding: 15px;
      margin-bottom: 20px;

      .dimension-title-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;

        .dimension-name {
          font-weight: 600;
          color: #303133;
        }

        .dimension-tags {
          display: flex;
          gap: 8px;
        }
      }

      .dimension-content {
        .dimension-actions {
          margin-top: 10px;
          display: flex;
          gap: 10px;
        }
      }
    }

    .conclusion-section {
      background: #fff;
      border-radius: 4px;
      padding: 20px;

      .section-title {
        font-size: 16px;
        font-weight: 600;
        color: #303133;
        margin: 0 0 20px 0;
        padding-bottom: 10px;
        border-bottom: 1px solid #e4e7ed;
      }
    }
  }

  .empty-state {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

/* 动画 */
.prisoner-card {
  transition: all 0.2s ease;
}
</style>
