<template>
  <a-form ref="formRef" :model="vdata.currentConfig" layout="vertical" :rules="ifParamsRules">
    <a-row v-if="vdata.mchType === 1" :gutter="16">
      <a-col span="24">
        <a-form-item label="环境配置" name="sandbox">
          <a-radio-group v-model:value="vdata.currentConfig.sandbox">
            <a-radio :value="1">沙箱环境</a-radio>
            <a-radio :value="0">生产环境</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col span="12">
        <a-form-item label="河马付代理商ID" name="appId">
          <a-input v-model:value.trim="vdata.currentConfig.appId" placeholder="请输入河马付代理商ID" @change="changeFun('appId')" />
        </a-form-item>
      </a-col>
      <a-col span="12">
        <a-form-item label="支付产品编号" name="productCode">
          <a-input v-model:value.trim="vdata.currentConfig.productCode" placeholder="请输入河马付支付产品编号" @change="changeFun('productCode')" />
        </a-form-item>
      </a-col>
      <a-col span="24">
        <a-form-item label="河马付代理商私钥" name="privateKey">
          <a-textarea v-model:value="vdata.currentConfig.privateKey" :placeholder="vdata.encryptionField.privateKey || '请输入河马付代理商私钥'" @change="changeFun('privateKey')" />
        </a-form-item>
      </a-col>
      <a-col span="24">
        <a-form-item label="河马付平台公钥" name="publicKey">
          <a-textarea v-model:value="vdata.currentConfig.publicKey" :placeholder="vdata.encryptionField.publicKey || '请输入河马付平台公钥'" @change="changeFun('publicKey')" />
        </a-form-item>
      </a-col>
      <a-col span="12">
        <a-form-item label="微信开户意愿地址（进件必填）" name="wxUrl">
          <a-input v-model:value.trim="vdata.currentConfig.wxUrl" placeholder="请输入微信开户意愿地址" @change="changeFun('wxUrl')" />
        </a-form-item>
      </a-col>
      <a-col span="12">
        <a-form-item label="支付宝开户意愿地址（进件必填）" name="aliUrl">
          <a-input v-model:value.trim="vdata.currentConfig.aliUrl" placeholder="请输入支付宝开户意愿地址" @change="changeFun('aliUrl')" />
        </a-form-item>
      </a-col>
    </a-row>
  </a-form>
</template>
<script setup lang="ts">
import { upload } from '@/api/manage'
import { ref, reactive, defineExpose } from 'vue'

const vdata = reactive ({
  mchType: 1, //商户类型
  isAdd: true,
  ifDefineArray: [], // 接口的配置定义项数组
  currentConfig: {} as any, // 当前配置项
  liteConfig: {} as any, // 小程序配置项
  activeKey: ['1'], // 折叠默认展开
  action: upload.cert, // 上传文件地址
  encryptionField : { // 定义加密的字段
    privateKey: '',
    publicKey: ''
  },

})
//表单规则
const ifParamsRules = reactive({
        appId: [{ trigger: 'blur',
          validator: (rule, value) => {
            if (vdata.mchType === 1 && !value) {
              return Promise.reject(new Error('请输入河马付代理商ID'))
            }
            return Promise.resolve()
         } }],
         productCode: [{ trigger: 'blur',
          validator: (rule, value) => {
            if (vdata.mchType === 1 && !value) {
              return Promise.reject(new Error('请输入河马付支付产品编号'))
            }
            return Promise.resolve()
         } }],
        privateKey: [{ trigger: 'blur',
          validator: (rule, value) => {
            if (!value && !vdata.encryptionField[rule.field]) {
              return Promise.reject(new Error('请输入河马付代理商应用私钥'))
            }
            return Promise.resolve()
        } }],
        publicKey: [{ trigger: 'blur',
          validator: (rule, value) => {
            if (!value && !vdata.encryptionField[rule.field]) {
              return Promise.reject(new Error('请输入河马付平台公钥'))
            }
            return Promise.resolve()
        } }]
      })

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

function getConfigParams(){
  return formRef.value.validate().then( () => {
    return convertEncryData()
  })

}

// 转换加密数据
function convertEncryData(){

  // 对象克隆
  let result = Object.assign({}, vdata.currentConfig)
  Object.keys(vdata.encryptionField).forEach(key => {
    // 加密数据 && 空串
    if (!result[key]) {
      delete result[key]
    }

  })

  // 转换小程序参数
  result.liteParams = vdata.liteConfig

  return result
}

// 对外提供的页面的渲染函数 （ ifDefineArray = 接口的配置定义项数组，  currentConfig = 当前配置项,mchType=商户类型 ）
// 20230918 新增： isProcessStarField = true ( 是否处理 脱敏数据， 默认为 true  )
function pageRender(ifDefineArray, currentConfig, mchType, isProcessStarField = true){  
  // 赋值
  vdata.currentConfig = currentConfig
  if(currentConfig.liteParams) {
    vdata.liteConfig = currentConfig.liteParams
  }

  // 处理加密数据字段
  if(isProcessStarField){
    Object.keys(vdata.encryptionField).forEach(key => {
      vdata.encryptionField[key] = vdata.currentConfig[key]
      delete vdata.currentConfig[key]
    })
  }

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

}

// 消除参数空格
function changeFun(value) {
  if(vdata.currentConfig[value]) {
    vdata.currentConfig[value] = vdata.currentConfig[value].trim()
  }
}

defineExpose({ getConfigParams, pageRender })

</script>
