<template>
  <el-dialog
    v-model="visible"
    :title="dataForm.id ? '编辑' : '新增'"
    width="600px"
    :close-on-click-modal="false"
    destroy-on-close
    append-to-body
  >
    <el-form
      ref="dataFormRef"
      :model="dataForm"
      :rules="dataRules"
      label-width="120px"
    >
      <el-form-item label="异动ID" prop="turnOverId">
        <el-input v-model="dataForm.turnOverId" placeholder="请输入异动ID" clearable />
      </el-form-item>
      <el-form-item label="退补类型" prop="type">
        <el-select v-model="dataForm.type" placeholder="请选择退补类型" clearable>
          <el-option label="学费" value="1" />
          <el-option label="代办费" value="2" />
          <el-option label="捐资费" value="3" />
        </el-select>
      </el-form-item>
      <el-form-item label="原费用" prop="oldFee">
        <el-input-number v-model="dataForm.oldFee" :min="0" :precision="2" placeholder="请输入原费用" />
      </el-form-item>
      <el-form-item label="变更后费用" prop="newFee">
        <el-input-number v-model="dataForm.newFee" :min="0" :precision="2" placeholder="请输入变更后费用" />
      </el-form-item>
      <el-form-item label="变更费用" prop="fee">
        <el-input-number v-model="dataForm.fee" :precision="2" placeholder="请输入变更费用" />
      </el-form-item>
      <el-form-item label="补还是退" prop="incOrDec">
        <el-select v-model="dataForm.incOrDec" placeholder="请选择补还是退" clearable>
          <el-option label="补" value="1" />
          <el-option label="退" value="2" />
        </el-select>
      </el-form-item>
      <el-form-item label="是否推送" prop="pushed">
        <el-select v-model="dataForm.pushed" placeholder="请选择是否推送" clearable>
          <el-option label="是" value="1" />
          <el-option label="否" value="0" />
        </el-select>
      </el-form-item>
      <el-form-item label="推送失败原因" prop="pushFailReason">
        <el-input v-model="dataForm.pushFailReason" type="textarea" :rows="3" placeholder="请输入推送失败原因" clearable />
      </el-form-item>
    </el-form>
    
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="visible = false">取消</el-button>
        <el-button type="primary" @click="dataFormSubmit" :loading="submitLoading">确定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue'
import { useMessage } from '/@/hooks/message'
import { addObj, putObj } from '/@/api/recruit/recruitstudentsignupturnovermoneychange'

// 消息提示 hooks
const message = useMessage()

// Emits
const emit = defineEmits<{
  (e: 'refresh'): void
}>()

// 表单引用
const dataFormRef = ref()
const submitLoading = ref(false)

// 弹窗显示状态
const visible = ref(false)

// 表单数据
const dataForm = reactive({
  id: '',
  turnOverId: '',
  type: '',
  oldFee: undefined as number | undefined,
  newFee: undefined as number | undefined,
  fee: undefined as number | undefined,
  incOrDec: '',
  pushed: '',
  pushFailReason: ''
})

// 表单验证规则
const dataRules = {}

// 初始化
const init = (row?: any) => {
  visible.value = true
  submitLoading.value = false
  
  // 重置表单
  dataForm.id = ''
  dataForm.turnOverId = ''
  dataForm.type = ''
  dataForm.oldFee = undefined
  dataForm.newFee = undefined
  dataForm.fee = undefined
  dataForm.incOrDec = ''
  dataForm.pushed = ''
  dataForm.pushFailReason = ''
  
  // 如果是编辑，填充数据
  if (row && row.id) {
    dataForm.id = row.id || ''
    dataForm.turnOverId = row.turnOverId || ''
    dataForm.type = row.type || ''
    dataForm.oldFee = row.oldFee
    dataForm.newFee = row.newFee
    dataForm.fee = row.fee
    dataForm.incOrDec = row.incOrDec || ''
    dataForm.pushed = row.pushed || ''
    dataForm.pushFailReason = row.pushFailReason || ''
  }
  
  // 清除验证
  nextTick(() => {
    dataFormRef.value?.clearValidate()
  })
}

// 提交表单
const dataFormSubmit = async () => {
  if (!dataFormRef.value) return
  
  await dataFormRef.value.validate(async (valid: boolean) => {
    if (valid) {
      submitLoading.value = true
      try {
        if (dataForm.id) {
          await putObj(dataForm)
          message.success('修改成功')
        } else {
          await addObj(dataForm)
          message.success('添加成功')
        }
        visible.value = false
        emit('refresh')
      } catch (error: any) {
        message.error(error.msg || '操作失败')
      } finally {
        submitLoading.value = false
      }
    }
  })
}

// 暴露方法给父组件
defineExpose({
  init
})
</script>

<style lang="scss" scoped>
.w-full {
  width: 100%;
}

.dialog-footer {
  text-align: right;
}
</style>

