<template>
  <div v-loading="loading">
    <h2>我的简历</h2>
    <el-form :model="form" label-width="80px" v-if="form">
      <el-card style="margin-bottom:16px">
        <template #header>基本信息</template>
        <el-form-item label="姓名"><el-input v-model="form.name" /></el-form-item>
        <el-form-item label="性别">
          <el-radio-group v-model="form.gender">
            <el-radio value="male">男</el-radio>
            <el-radio value="female">女</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="生日"><el-date-picker v-model="form.birthday" type="date" value-format="YYYY-MM-DD" /></el-form-item>
      </el-card>

      <el-card style="margin-bottom:16px">
        <template #header>
          教育经历
          <el-button size="small" @click="addEducation" style="float:right">添加</el-button>
        </template>
        <div v-for="(edu, i) in form.education" :key="i" style="margin-bottom:8px">
          <el-row :gutter="12">
            <el-col :span="8"><el-input v-model="edu.school" placeholder="学校名称" /></el-col>
            <el-col :span="6"><el-input v-model="edu.degree" placeholder="学历" /></el-col>
            <el-col :span="7"><el-input v-model="edu.major" placeholder="专业" /></el-col>
            <el-col :span="3"><el-button type="danger" link @click="form.education.splice(i,1)">删除</el-button></el-col>
          </el-row>
        </div>
      </el-card>

      <el-card style="margin-bottom:16px">
        <template #header>
          工作经历
          <el-button size="small" @click="addExperience" style="float:right">添加</el-button>
        </template>
        <div v-for="(exp, i) in form.experience" :key="i" style="margin-bottom:8px">
          <el-row :gutter="12">
            <el-col :span="8"><el-input v-model="exp.company" placeholder="公司名称" /></el-col>
            <el-col :span="7"><el-input v-model="exp.position" placeholder="职位" /></el-col>
            <el-col :span="6"><el-input v-model="exp.duration" placeholder="时长（如：2年）" /></el-col>
            <el-col :span="3"><el-button type="danger" link @click="form.experience.splice(i,1)">删除</el-button></el-col>
          </el-row>
        </div>
      </el-card>

      <el-card style="margin-bottom:16px">
        <template #header>简历附件</template>
        <div v-if="form.attachment" style="margin-bottom:12px">
          <span style="margin-right:12px">当前附件：{{ attachmentName }}</span>
          <el-button type="primary" link :href="attachmentUrl" target="_blank" tag="a">查看附件</el-button>
        </div>
        <el-upload :http-request="uploadAttachment" name="attachment" accept=".pdf,.doc,.docx" :show-file-list="false">
          <el-button>{{ form.attachment ? '重新上传' : '上传简历（PDF/Word）' }}</el-button>
        </el-upload>
      </el-card>

      <el-button type="primary" @click="save" :loading="saving">保存简历</el-button>
    </el-form>
  </div>
</template>
<script setup>
import { ref, computed, onMounted } from 'vue'
import { getMyResume, updateMyResume, uploadResumeAttachment } from '@/api/resumes'
import { ElMessage } from 'element-plus'

const form = ref(null)
const loading = ref(false)
const saving = ref(false)

onMounted(async () => {
  loading.value = true
  const { data } = await getMyResume()
  form.value = { ...data, education: data.education || [], experience: data.experience || [] }
  loading.value = false
})

const attachmentUrl = computed(() => form.value?.attachment || '')
const attachmentName = computed(() => {
  if (!form.value?.attachment) return ''
  return decodeURIComponent(form.value.attachment.split('/').pop())
})

const addEducation = () => form.value.education.push({ school: '', degree: '', major: '' })
const addExperience = () => form.value.experience.push({ company: '', position: '', duration: '' })

async function uploadAttachment({ file }) {
  const fd = new FormData()
  fd.append('attachment', file)
  try {
    const { data } = await uploadResumeAttachment(fd)
    form.value.attachment = data.attachment
    ElMessage.success('附件上传成功')
  } catch {
    ElMessage.error('附件上传失败')
  }
}

async function save() {
  saving.value = true
  try {
    const { attachment, ...rest } = form.value
    await updateMyResume(rest)
    ElMessage.success('简历已保存')
  } catch {
    ElMessage.error('保存失败')
  } finally {
    saving.value = false
  }
}
</script>
