<template>

  <div style="padding:40px">
    <el-form ref="ruleFormRef" :model="formData" :rules="rules" label-width="120px" style="width: 100%">
      <el-row>
        <el-col :span="24">
          <el-form-item label="appId" prop="appId">
            <el-input v-model="formData.appId" />
          </el-form-item>
          <el-form-item label="商户PID" prop="merchantId">
            <el-input v-model="formData.merchantId" />
          </el-form-item>
          <el-form-item label="支付宝网关" prop="aliGateway">
            <el-input v-model="formData.aliGateway" />
          </el-form-item>
          <el-form-item label="商户私钥" prop="publicKey">
            <el-input v-model="formData.publicKey" type="textarea" :rows="2"/>
          </el-form-item>
          <el-form-item label="商户公钥" prop="privateKey">
            <el-input v-model="formData.privateKey" type="textarea" :rows="2"/>
          </el-form-item>
          <el-form-item label="接口密钥" prop="secretKey">
            <el-input v-model="formData.secretKey" type="textarea" :rows="2"/>
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>
    <div class="flex justify-flex-end mt-20">
      <el-button type="primary" @click="save" :disabled="!auth('edit')">保存</el-button>
    </div>
  </div>
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue'
import request from '/@/api/request'
import { sysConfig } from '/@/api/controllerUrls'
import { ElNotification } from 'element-plus/es'
import { auth } from '/@/utils/common'

onMounted(() => {
    getFormData()
})

let formData = ref({
    appId: '',
    merchantId: '',
    aliGateway: '',
    publicKey: '',
    privateKey: '',
    secretKey: '',
})

let rules = ref({
    appId: [{ required: true, message: '请输入', trigger: 'blur' }],
    merchantId: [{ required: true, message: '请输入', trigger: 'blur' }],
    aliGateway: [{ required: true, message: '请输入', trigger: 'blur' }],
    publicKey: [{ required: true, message: '请输入', trigger: 'blur' }],
    privateKey: [{ required: true, message: '请输入', trigger: 'blur' }],
    secretKey: [{ required: true, message: '请输入', trigger: 'blur' }],
})

function getFormData() {
    request.index(sysConfig, { configName: 'alibabaPayment' }, 'edit').then((res: any) => {
        formData.value = res.data.configValue
    })
}

let ruleFormRef = ref()

function save() {
    ruleFormRef.value.validate((valid: any, fields: any) => {
        if (valid) {
            request
                .edit(sysConfig, {
                    configName: 'alibabaPayment',
                    configValue: formData.value,
                })
                .then((res: any) => {
                    ElNotification({ type: 'success', message: res.msg })
                })
        }
    })
}
</script>

<style scoped>
</style>
