<template>
  <el-dialog v-model="visible" title="反馈处理" width="500px">
    <el-descriptions border :column="1" class="mb-20">
      <el-descriptions-item label="反馈人">{{ currentFeedback?.studentName }}</el-descriptions-item>
      <el-descriptions-item label="类型">{{ getTypeLabel(currentFeedback?.type) }}</el-descriptions-item>
      <el-descriptions-item label="内容">{{ currentFeedback?.content }}</el-descriptions-item>
    </el-descriptions>
    <el-form label-position="top">
      <el-form-item label="回复内容">
        <el-input v-model="replyContent" type="textarea" rows="4" placeholder="请输入回复内容..." />
      </el-form-item>
    </el-form>
    <template #footer>
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="confirm">确认回复</el-button>
    </template>
  </el-dialog>
</template>

<script setup>
import { ref } from 'vue'
import { ElMessage } from 'element-plus'

const emit = defineEmits(['success'])

const visible = ref(false)
const currentFeedback = ref(null)
const replyContent = ref('')

const open = (row) => {
  currentFeedback.value = row
  replyContent.value = ''
  visible.value = true
}

const confirm = () => {
  if (!replyContent.value) {
    ElMessage.warning('请输入回复内容')
    return
  }
  visible.value = false
  ElMessage.success('回复成功')
  emit('success', { ...currentFeedback.value, reply: replyContent.value })
}

const getTypeLabel = (type) => {
  const map = { complaint: '投诉', suggestion: '建议', consult: '咨询' }
  return map[type] || type
}

defineExpose({
  open
})
</script>

<style lang="scss" scoped>
.mb-20 { margin-bottom: 20px; }
</style>
