<template>
  <div class="knowledge-audit">
    <el-card>
      <div slot="header" class="card-header">
        <span>知识审核与优化</span>
        <el-button type="primary" @click="handleBatchAudit" :disabled="!selectedRows.length">
          <i class="el-icon-check"></i>批量审核
        </el-button>
      </div>

      <el-alert
        title="审核说明"
        description="对客户聊天记录和AI生成的知识进行审核，确认后自动更新到知识库和工作流中，持续优化话术精准度。"
        type="info"
        show-icon
        :closable="false"
        style="margin-bottom: 20px"
      />

      <el-tabs v-model="activeTab" type="border-card">
        <el-tab-pane label="待审核知识" name="pending">
          <el-table :data="pendingData" v-loading="loading" border @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column prop="id" label="ID" width="80" />
            <el-table-column prop="sourceType" label="来源类型" width="120">
              <template slot-scope="{ row }">
                <el-tag :type="row.sourceType === 'chat' ? 'primary' : 'warning'">
                  {{ row.sourceType === 'chat' ? '聊天记录' : 'AI生成' }}
                </el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="content" label="内容摘要" min-width="250" show-overflow-tooltip />
            <el-table-column prop="suggestion" label="AI优化建议" min-width="200" show-overflow-tooltip />
            <el-table-column prop="createTime" label="创建时间" width="180" />
            <el-table-column label="操作" width="200" fixed="right">
              <template slot-scope="{ row }">
                <el-button type="primary" size="mini" @click="handleView(row)">查看详情</el-button>
                <el-button type="success" size="mini" @click="handleApprove(row)">通过</el-button>
                <el-button type="danger" size="mini" @click="handleReject(row)">驳回</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>

        <el-tab-pane label="已审核记录" name="audited">
          <el-table :data="auditedData" v-loading="loading" border>
            <el-table-column type="index" label="序号" width="60" align="center" />
            <el-table-column prop="id" label="ID" width="80" />
            <el-table-column prop="sourceType" label="来源类型" width="120">
              <template slot-scope="{ row }">
                <el-tag :type="row.sourceType === 'chat' ? 'primary' : 'warning'">
                  {{ row.sourceType === 'chat' ? '聊天记录' : 'AI生成' }}
                </el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="content" label="内容摘要" min-width="250" show-overflow-tooltip />
            <el-table-column prop="auditResult" label="审核结果" width="100">
              <template slot-scope="{ row }">
                <el-tag :type="row.auditResult === 'approve' ? 'success' : 'danger'">
                  {{ row.auditResult === 'approve' ? '已通过' : '已驳回' }}
                </el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="auditor" label="审核人" width="120" />
            <el-table-column prop="auditTime" label="审核时间" width="180" />
          </el-table>
        </el-tab-pane>

        <el-tab-pane label="优化建议" name="suggestions">
          <el-table :data="suggestionData" v-loading="loading" border>
            <el-table-column type="index" label="序号" width="60" align="center" />
            <el-table-column prop="type" label="优化类型" width="120">
              <template slot-scope="{ row }">
                <el-tag :type="getSuggestionType(row.type)">
                  {{ getSuggestionText(row.type) }}
                </el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="description" label="问题描述" min-width="250" />
            <el-table-column prop="suggestion" label="优化建议" min-width="250" />
            <el-table-column prop="impact" label="影响范围" width="120" />
            <el-table-column label="操作" width="150" fixed="right">
              <template slot-scope="{ row }">
                <el-button type="primary" size="mini" @click="handleApply(row)">应用</el-button>
                <el-button type="info" size="mini" @click="handleIgnore(row)">忽略</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </el-card>

    <!-- 查看详情对话框 -->
    <el-dialog :visible.sync="detailDialogVisible" title="审核详情" width="700px">
      <el-descriptions :column="1" border>
        <el-descriptions-item label="来源类型">
          <el-tag :type="currentItem.sourceType === 'chat' ? 'primary' : 'warning'">
            {{ currentItem.sourceType === 'chat' ? '聊天记录' : 'AI生成' }}
          </el-tag>
        </el-descriptions-item>
        <el-descriptions-item label="内容">{{ currentItem.content }}</el-descriptions-item>
        <el-descriptions-item label="AI优化建议">{{ currentItem.suggestion }}</el-descriptions-item>
        <el-descriptions-item label="创建时间">{{ currentItem.createTime }}</el-descriptions-item>
      </el-descriptions>
    </el-dialog>
  </div>
</template>

<script>
import { knowledgeAuditApi } from '@/api/company/knowledge'

export default {
  name: 'KnowledgeAudit',
  data() {
    return {
      loading: false,
      activeTab: 'pending',
      pendingData: [],
      auditedData: [],
      suggestionData: [],
      selectedRows: [],
      detailDialogVisible: false,
      currentItem: {}
    }
  },
  created() {
    this.getPendingList()
    this.getAuditedList()
    this.getSuggestionList()
  },
  methods: {
    async getPendingList() {
      try {
        const res = await knowledgeAuditApi.getPendingList()
        this.pendingData = res.data || []
      } catch (error) {
        this.$message.error('获取待审核列表失败')
      }
    },
    async getAuditedList() {
      try {
        const res = await knowledgeAuditApi.getAuditedList()
        this.auditedData = res.data || []
      } catch (error) {
        this.$message.error('获取已审核列表失败')
      }
    },
    async getSuggestionList() {
      try {
        const res = await knowledgeAuditApi.getSuggestionList({})
        this.suggestionData = res.data || []
      } catch (error) {
        this.$message.error('获取优化建议失败')
      }
    },
    handleSelectionChange(rows) {
      this.selectedRows = rows
    },
    handleView(row) {
      this.currentItem = row
      this.detailDialogVisible = true
    },
    async handleApprove(row) {
      try {
        await knowledgeAuditApi.approve(row.id)
        this.$message.success('审核通过')
        this.getPendingList()
      } catch (error) {
        this.$message.error('审核失败')
      }
    },
    async handleReject(row) {
      try {
        await knowledgeAuditApi.reject(row.id)
        this.$message.success('已驳回')
        this.getPendingList()
      } catch (error) {
        this.$message.error('操作失败')
      }
    },
    async handleBatchAudit() {
      try {
        await this.$confirm('确定要批量通过选中的知识吗？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
        const ids = this.selectedRows.map(row => row.id)
        await knowledgeAuditApi.batchAudit({ ids, auditResult: 'approve' })
        this.$message.success('批量审核成功')
        this.getPendingList()
      } catch (error) {
        if (error !== 'cancel') {
          this.$message.error('批量审核失败')
        }
      }
    },
    async handleApply(row) {
      try {
        await knowledgeAuditApi.applySuggestion(row.id)
        this.$message.success('应用成功')
        this.getSuggestionList()
      } catch (error) {
        this.$message.error('应用失败')
      }
    },
    async handleIgnore(row) {
      try {
        await knowledgeAuditApi.ignoreSuggestion(row.id)
        this.$message.success('已忽略')
        this.getSuggestionList()
      } catch (error) {
        this.$message.error('操作失败')
      }
    },
    getSuggestionText(type) {
      const map = {
        accuracy: '精准度',
        completeness: '完整性',
        clarity: '清晰度'
      }
      return map[type] || type
    },
    getSuggestionType(type) {
      const map = {
        accuracy: 'danger',
        completeness: 'warning',
        clarity: 'info'
      }
      return map[type] || 'info'
    }
  }
}
</script>

<style scoped>
.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
</style>
