<!--
  提现配置

  @author zx
  @site https://www.jeequan.com
  @date 2022/04/06 10:14
-->
<template>
  <a-form ref="cashoutFormRef" :model="vdata.cashoutObject" layout="vertical" :rules="vdata.cashoutFormRules">
    <!-- 服务商提现配置 -->
    <a-row v-if="vdata.configMode == 'mgrIsv' && vdata.isSupportCashout" :gutter="24">
      <a-col :span="8">
        <a-form-item label="是否开启提现" name="isOpenIsvCashout">
          <a-radio-group v-model:value="vdata.cashoutObject.isOpenIsvCashout">
            <a-radio :value="1">开启</a-radio>
            <a-radio :value="0">关闭</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>

    <!-- 特约商户提现配置 -->
    <a-row v-if="(vdata.configMode == 'mgrMch' && vdata.isSupportCashout)" :gutter="24">
      <a-col :span="6">
        <a-form-item label="自动提现（支付成功立刻提现）" name="isOpenMchOrderCashout">
          <a-radio-group v-model:value="vdata.cashoutObject.isOpenMchOrderCashout">
            <a-radio :value="1">开启</a-radio>
            <a-radio :value="0">关闭</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :span="6">
        <a-form-item label="自动提现（定时任务）" name="isOpenMchTaskCashout">
          <a-radio-group v-model:value="vdata.cashoutObject.isOpenMchTaskCashout">
            <a-radio :value="1">开启</a-radio>
            <a-radio :value="0">关闭</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :span="6">
        <a-form-item label="提现起止金额（元）" name="minCashoutAmount">
          <a-input-group compact>
            <a-input-number
              v-model:value="vdata.cashoutObject.minCashoutAmount" 
              style="width: 110px; text-align: center" 
              placeholder="最小金额"
              :max="100000"
              :min="0.01"
              :precision="2"
            />
            <a-input style="width: 30px; pointer-events: none; background-color: #fff; border-top: 0; border-bottom: 0;" placeholder="~" disabled />
            <a-input-number
              v-model:value="vdata.cashoutObject.maxCashoutAmount"
              style="width: 110px; text-align: center;"
              placeholder="最大金额"
              :max="100000"
              :min="0.01"
              :precision="2"
            />
          </a-input-group>
        </a-form-item>
      </a-col>
      <a-col :span="6">
        <a-input-group compact>
          <a-form-item label="提现起止时间">
            <!-- <a-input v-model:value="vdata.cashoutObject.startTime" style="width: 100px; text-align: center" placeholder="开始时间" /> -->
            <a-time-picker v-model:value="vdata.cashoutObject.startTime" value-format="HH:mm:ss" />
            <a-input style="width: 30px; pointer-events: none; background-color: #fff; border: 0;" placeholder="~" disabled />
            <a-time-picker v-model:value="vdata.cashoutObject.endTime" value-format="HH:mm:ss" />
            <!-- <a-input v-model:value="vdata.cashoutObject.endTime" style="width: 100px; text-align: center;" placeholder="结束时间" /> -->
          </a-form-item>
        </a-input-group>
      </a-col>
    </a-row>
  </a-form>
</template>
<script setup lang="ts">
import { ref, reactive, defineExpose } from 'vue'

// 当前的form
const cashoutFormRef = ref()

const vdata = reactive({
  isSupportCashout: 0, // 支付接口是否支持提现
  cashoutObject: {}, // 当前配置项
  configMode: {}, // 模式
  cashoutFormRules: {
    isOpenIsvCashout:  [{ type: 'number',  required: true, trigger: 'blur', message: '请选择是否开启提现' }],
    isOpenMchOrderCashout:  [{ type: 'number',  required: true, trigger: 'blur', message: '请选择是否开启商户订单成功自动提现' }],
    isOpenMchTaskCashout:  [{ type: 'number',  required: true, trigger: 'blur', message: '请选择是否开启定时任务自动提现' }],
    minCashoutAmount: [
      { required: false, trigger: 'blur' },
      {
        validator: (rule, value) => {
          if (vdata.cashoutObject.minCashoutAmount > vdata.cashoutObject.maxCashoutAmount) {
            return Promise.reject('最小金额不应大于最大金额')
          } else return Promise.resolve()
        }
      }
    ],
  }, //表单规则
}) as any

// 对外提供的页面的渲染函数 （ configMode，cashoutObject = 当前配置项 ）
function pageRender(isSupportCashout, configMode, cashoutObject){

  // 重置form验证
  // if (formRef.value !== undefined && formRef.value !== null) {
  //   formRef.value.resetFields()
  // }

  // 赋值
  vdata.isSupportCashout = isSupportCashout
  vdata.configMode = configMode
  vdata.cashoutObject = cashoutObject
}


// 对外提供的获取配置参数函数 （返回JSON类型）
function getConfigParams(){
  return cashoutFormRef.value.validate().then( () => {
    return vdata.cashoutObject
  })
}

defineExpose({ getConfigParams, pageRender })

</script>
