<template>
  <ContentWrap>
    <el-form
      label-position="top"
      ref="formRef"
      v-loading="formLoading"
      status-icon
      :model="formData"
    >
      <el-form-item label="快速充值金额" prop="predefinedRechargeAmount">
        <el-input v-model="formData.predefinedRechargeAmount" placeholder="" />
        <span style="color: gray">用英文的,分割。例如100,200,300,400</span>
      </el-form-item>
      <el-form-item label="最低提款额" prop="minWithdrawAmount">
        <el-input v-model="formData.minWithdrawAmount" placeholder="" />
        <span style="color: gray">最好设置大于注册赠送金额</span>
      </el-form-item>
      <el-form-item label="U兑换法币汇率" prop="exchangeRate">
        <el-input v-model="formData.exchangeRate" placeholder="" />
        <span style="color: gray">例如: 1U=7RMB, 填7</span>
      </el-form-item>
      <el-form-item label="主要货币类型" prop="mainCurrencyType">
        <el-radio-group v-model="formData.mainCurrencyType">
          <el-radio
            v-for="dict in getIntDictOptions(DICT_TYPE.MEMBER_CURRENCY_TYPE)"
            :key="dict.label"
            :label="dict.value"
          >
            {{ dict.label }}
          </el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="提现手续费(%)" prop="withdrawalFee">
        <el-input-number v-model="formData.withdrawalFee" :step="1" :precision="2" :max="100">
          <template #append>%</template>
        </el-input-number>
      </el-form-item>
      <el-form-item label="提现开始时间" prop="withdrawStartTime">
        <el-time-picker v-model="formData.withdrawStartTime" />
      </el-form-item>
      <el-form-item label="提现结束时间" prop="withdrawEndTime">
        <el-time-picker v-model="formData.withdrawEndTime" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">保存</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>
  </ContentWrap>
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue'
import * as ConfigApi from '@/api/infra/config'
import { ElMessage } from 'element-plus'
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'

defineOptions({ name: 'FinanceConfig' })

const formLoading = ref(false)
const formData = ref({
  predefinedRechargeAmount: '',
  minWithdrawAmount: '0',
  exchangeRate: '',
  mainCurrencyType: '',
  withdrawalFee: 0,
  withdrawStartTime: '',
  withdrawEndTime: ''
})

const getList = async () => {
  const params = {
    category: 'finance',
    pageSize: 50
  }
  const res = await ConfigApi.getConfigPage(params)
  if (res.code === 200) {
    ElMessage.success('更新成功')
  }
  const list = res.list
  list.forEach((item) => {
    // 设置表单
    if (item.key === 'predefinedRechargeAmount') {
      formData.value.predefinedRechargeAmount = item.value
    } else if (item.key === 'minWithdrawAmount') {
      formData.value.minWithdrawAmount = item.value
    } else if (item.key === 'exchangeRate') {
      formData.value.exchangeRate = item.value
    } else if (item.key === 'mainCurrencyType') {
      formData.value.mainCurrencyType = item.value
    } else if (item.key === 'withdrawalFee') {
      formData.value.withdrawalFee = item.value
    } else if (item.key === 'withdrawStartTime') {
      formData.value.withdrawStartTime = item.value
    } else if (item.key === 'withdrawEndTime') {
      formData.value.withdrawEndTime = item.value
    }
  })
}

const onSubmit = async () => {
  formLoading.value = true
  let list = [
    // key= formData key, value = formData value, name = form label
    {
      key: 'predefinedRechargeAmount',
      value: formData.value.predefinedRechargeAmount,
      name: '快速充值金额'
    },
    { key: 'minWithdrawAmount', value: formData.value.minWithdrawAmount, name: '最低提款额' },
    { key: 'exchangeRate', value: formData.value.exchangeRate, name: 'U兑换法币汇率' },
    { key: 'mainCurrencyType', value: formData.value.mainCurrencyType, name: '主要货币类型' },
    { key: 'withdrawalFee', value: formData.value.withdrawalFee, name: '提现手续费' },
    { key: 'withdrawStartTime', value: formData.value.withdrawStartTime, name: '提现开始时间' },
    { key: 'withdrawEndTime', value: formData.value.withdrawEndTime, name: '提现结束时间' }
  ]
  try {
    const res = await ConfigApi.batchCreateFinanceConfig({ list: list })
  } finally {
    formLoading.value = false
  }
}

// 初始化
onMounted(() => {
  getList()
})
</script>
