<template>
  <a-form
    :model="form"
    :label-col="{sm: { span: 8 } }"
    :wrapper-col="{ span:24}"
    ref="formRef"
  >
    <a-row :gutter="8">
      <a-col :xs="24">
        <a-form-item
          required
          name="authCondition"
          :rules="[{ required: true, message: '请选择认证条件' }]"
          :label-col="{ sm: { span: 4 }}"
          :wrapper-Col="{span: 24 }"
        >
          <template #label>
            认证条件
            <a-tooltip title="开启需要额外收费，请联系技服人员确认">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.authCondition"
            name="radioGroup"
          >
            <a-radio value="1">默认</a-radio>
            <a-radio value="2">实名认证</a-radio>
            <a-radio value="3">学生认证</a-radio>
            <a-radio value="4">无需认证</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="firstFree"
          :rules="[{ required: true, message: '请选择是否首单免费' }]"
        >
          <template #label>
            是否首单免费
            <a-tooltip title="开启后，用户在该城市的首单免骑行费">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.firstFree"
            name="radioGroup"
            @change="changeFirstFree"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col
        v-if="showFirstFreeAmount"
        :xs="12"
      >
        <a-form-item
          required
          name="firstFreeAmount"
          :rules="[{ required: true, message: '请输入首单免费金额' }]"
        >
          <template #label>
            首单免费金额
            <a-tooltip title="首单免骑行费的最高金额">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-input
            v-model:value="form.firstFreeAmount"
            placeholder="请输入首单免费金额"
            type="number"
          />
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="firstFreeDispatch"
          :rules="[{ required: true, message: '请选择是否首单免调度费' }]"
        >
          <template #label>
            是否首单免调度费
            <a-tooltip title="开启后，用户在该城市产生的首笔调度费会免除">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.firstFreeDispatch"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :xs="12">
        <a-form-item
          required
          name="freeEveryday"
          :rules="[{ required: true, message: '请输入每日免费次数' }]"
        >
          <template #label>
            每日免费次数
            <a-tooltip title="0为不限制，大于0的时候为该用户在这个城市最多的免费次数使用次数，超过将按正常的时间进行计费。">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-input
            v-model:value="form.freeEveryday"
            placeholder="请输入每日免费次数"
            type="number"
          />
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="freeNotRecord"
          :rules="[{ required: true, message: '请选择免费时长不计入计费时长' }]"
          :label-col="{ sm: { span: 10 }}"
          :wrapper-Col="{span: 24 }"
        >
          <template #label>
            免费时长不计入计费时长
            <a-tooltip title="开启后，免费时长不计入计费时长">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.freeNotRecord"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :xs="12">
        <a-form-item
          :extra="extraText"
          required
          name="faceRecogintion"
          :rules="[{ required: true, message: '请选择实名开启人脸识别' }]"
        >
          <template #label>
            实名开启人脸识别
            <a-tooltip title="实名完成的时候是否需要开启人脸识别">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.faceRecogintion"
            name="radioGroup"
            @change="changeFaceRecogintion"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="deposit"
          :rules="[{ required: true, message: '请选择是否收取押金' }]"
        >
          <template #label>
            是否收取押金
            <a-tooltip title="开启后，用户在该城市的借车都需要检查是否缴纳了押金0元">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.deposit"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="violationFine"
          :rules="[{ required: true, message: '请选择违章罚款限制骑行' }]"
        >
          <template #label>
            违章罚款限制骑行
            <a-tooltip title="开启后违章罚款限制骑行">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.violationFine"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :xs="12">
        <a-form-item
          required
          name="minVoliation"
          :rules="[{ required: true, message: '请输入违章最低限制笔数' }]"
        >
          <template #label>
            违章最低限制笔数
            <a-tooltip title="开启后违章最低限制笔数">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-input
            v-model:value="form.minVoliation"
            placeholder="请输入违章最低限制笔数"
            type="number"
          />
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="showNearbyBike"
          :rules="[{ required: true, message: '请选择地图显示附近车辆' }]"
        >
          <template #label>
            地图显示附近车辆
            <a-tooltip title="小程序地图是否显示附近的车辆">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.showNearbyBike"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :xs="12">
        <a-form-item
          required
          name="showNearbyStation"
          :rules="[{ required: true, message: '请选择地图显示附近站点' }]"
        >
          <template #label>
            地图显示附近站点
            <a-tooltip title="小程序地图是否显示附近的站点">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.showNearbyStation"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="orderAppeal"
          :rules="[{ required: true, message: '请选择是否开启订单申诉' }]"
        >
          <template #label>
            是否开启订单申诉
            <a-tooltip title="是否开启订单申诉">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.orderAppeal"
            name="radioGroup"
            @change="changeOrderAppeal"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col
        v-if="orderAppeal"
        :xs="12"
      >
        <a-form-item
          required
          name="appealPicture"
          :rules="[{ required: true, message: '请选择订单申诉图片必传' }]"
        >
          <template #label>
            订单申诉图片必传
            <a-tooltip title="开启后，用户提交订单申诉时，图片必传才可提交">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.appealPicture"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col
        v-if="orderAppeal"
        :xs="12"
      >
        <a-form-item
          required
          name="automaticRefund"
          :rules="[{ required: true, message: '请选择0公里申诉自动退款' }]"
        >
          <template #label>
            0公里申诉自动退款
            <a-tooltip title="开启后，若用户的骑行订单骑行距离为0时将自动审核通过并退款，你可以设定订单时长">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.automaticRefund"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :xs="12">
        <a-form-item
          required
          label="扣款优先使用余额"
          name="balancePrefer"
          :rules="[{ required: true, message: '请选择扣款优先使用余额' }]"
        >
          <a-radio-group
            v-model:value="form.balancePrefer"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="enableRecharge"
          :rules="[{ required: true, message: '请选择是否开启充值' }]"
        >
          <template #label>
            是否开启充值
            <a-tooltip title="开启后用户可进行余额充值">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.enableRecharge"
            name="radioGroup"
            @change="changeEnableRecharge"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :xs="12">
        <a-form-item
          required
          name="showElectricity"
          :rules="[{ required: true, message: '请选择地图车辆显示电量' }]"
        >
          <template #label>
            地图车辆显示电量
            <a-tooltip title="用户端小程序地图上的车辆电量显示">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.showElectricity"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="balanceRefund"
          :rules="[{ required: true, message: '请选择开启余额退款' }]"
        >
          <template #label>
            开启余额退款
            <a-tooltip title="开启后用户可以在用户端钱包对充值剩余金额发起退款">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.balanceRefund"
            name="radioGroup"
            @change="changeBalanceRefund"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :xs="12">
        <a-form-item
          required
          name="splitBilling"
          :rules="[{ required: true, message: '请选择开启车辆分账' }]"
        >
          <template #label>
            开启车辆分账
            <a-tooltip title="开启后可根据车型配置分账规则，按照车辆进行分账">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.splitBilling"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row
      v-if="showBalanceRefund"
      :gutter="8"
    >
      <a-col :xs="12">
        <a-form-item
          required
          name="balanceAutomaticRefund"
          :rules="[{ required: true, message: '请选择余额退款自动通过' }]"
        >
          <template #label>
            余额退款自动通过
            <a-tooltip title="开启后用户发起退款时，自动通过退款申请并退款（需同步开启免财务审核）">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.balanceAutomaticRefund"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :xs="12">
        <a-form-item
          required
          name="deductionGift"
          :rules="[{ required: true, message: '请选择余额退款扣减赠送金' }]"
        >
          <template #label>
            余额退款扣减赠送金
            <a-tooltip title="用户进行余额退款时，充值赠送金的扣减方式：
            1、按退款金额等比例扣除：退款金额➗剩余充值金额，再乘以剩余赠送金 2、全额扣除：将该用户剩余赠送金清零">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.deductionGift"
            name="radioGroup"
          >
            <a-radio value="1">按退款金额等比例扣除</a-radio>
            <a-radio value="2">赠送金清零</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="userApplyIncoice"
          :rules="[{ required: true, message: '请选择开启用户申请开票' }]"
        >
          <template #label>
            开启用户申请开票
            <a-tooltip title="用户可以对骑行订单申请开票，由后台审核处理">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.userApplyIncoice"
            name="radioGroup"
            @change="changeUserApplyIncoice"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col
        v-if="showIssueAnInvoiceStartTime"
        :xs="12"
      >
        <a-form-item
          required
          name="issueAnInvoiceStartTime"
          :rules="[{ required: true, message: '请选择允许开票开始时间' }]"
        >
          <template #label>
            允许开票开始时间
            <a-tooltip title="设置可开票的订单开始时间，在该时间范围之前的无法申请开票">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-date-picker
            style="width: 100%;"
            valueFormat="YYYY-MM-DD"
            v-model:value="form.issueAnInvoiceStartTime"
          />
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="useStudy"
          :rules="[{ required: true, message: '请选择用车前学习' }]"
        >
          <template #label>
            用车前学习
            <a-tooltip title="开启后，新用户在第一次用车前，需在用车学习页面完成学习才可用车">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.useStudy"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :xs="12">
        <a-form-item
          required
          name="showEnsuracy"
          :rules="[{ required: true, message: '请选择是否显示保险信息' }]"
        >
          <template #label>
            是否显示保险信息
            <a-tooltip title="开启后，已关联保险的车辆，用户可在订单信息中查看投保信息">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.showEnsuracy"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row :gutter="8">
      <a-col :xs="12">
        <a-form-item
          required
          name="showDetails"
          :rules="[{ required: true, message: '请选择扫码后详情显示' }]"
        >
          <template #label>
            扫码后详情显示
            <a-tooltip title="用户端扫码后显示地图或者Banner图片">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.showDetails"
            name="radioGroup"
          >
            <a-radio value="1">Banner</a-radio>
            <a-radio value="2">地图</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
      <a-col :xs="12">
        <a-form-item
          required
          name="openLockDirect"
          :rules="[{ required: true, message: '请选择扫码后直接开锁' }]"
        >
          <template #label>
            扫码后直接开锁
            <a-tooltip title="开启后，扫码车辆直接开锁，不进入车辆详情页">
              <QuestionCircleOutlined style="margin-left: 5px;color: rgb(192,192,192);" />
            </a-tooltip>
          </template>
          <a-radio-group
            v-model:value="form.openLockDirect"
            name="radioGroup"
          >
            <a-radio value="1">是</a-radio>
            <a-radio value="2">否</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-col>
    </a-row>
    <a-row
      v-if="showRechargeRule"
      :gutter="8"
    >
      <a-col :xs="24">
        <a-form-item
          required
          label="充值规则"
          name="rechargeRule"
          :rules="[{ required: true, message: '请设置充值规则' }]"
          :label-col="{ sm: { span: 4 }}"
          :wrapper-Col="{span: 24 }"
        >
          <div style="display: flex;align-items: center;">
            <a-input
              style="width: 200px;"
              v-model:value="amountInput"
              placeholder="请输入充值金额"
              type="number"
              :rules="[]"
            />
            <a-button
              style="margin-left: 20px;"
              type="primary"
              @click="addAmount"
            >
              添加金额
            </a-button>
          </div>
          <div style="margin-top: 10px;">
            <template
              v-for="(tag) in form.rechargeRule"
              :key="tag"
            >
              <a-tag
                color="#55acee"
                :closable="true"
                @close="handleClose(tag)"
                style="width: 60px; display: inline-block;"
              >
                {{tag.name}}
              </a-tag>
            </template>
          </div>
        </a-form-item>
      </a-col>
    </a-row>
  </a-form>
</template>

<script setup>
import { getGUID } from '@/utils/tools';
import { ref, defineProps } from 'vue'
import _ from 'lodash'
import { callOperate } from '@/apis/call.js'
import dayjs from 'dayjs';

const amountInput = ref();
const formRef = ref();
const form = ref({
  rechargeRule: [],
  tableName: 'ebikeSysRoperatesetDto'
});
const extraText = ref("");
const showFirstFreeAmount = ref(false);
const orderAppeal = ref(false);
const showRechargeRule = ref(false);
const showIssueAnInvoiceStartTime = ref(false);
const showBalanceRefund = ref(false);

const changeFirstFree = (e) => {
  const value = e.target.value;
  if (value == '1') {
    showFirstFreeAmount.value = true
  } else {
    showFirstFreeAmount.value = false
    form.value.firstFreeAmount = 0;
  }
}

const changeFaceRecogintion = (e) => {
  const value = e.target.value;
  if (value == '1') {
    extraText.value = "开启需要额外收费，请联系技服人员确认"
  } else {
    extraText.value = ""
  }
}

const changeOrderAppeal = (e) => {
  const value = e.target.value;
  if (value == '1') {
    orderAppeal.value = true
  } else {
    orderAppeal.value = false
    form.value.appealPicture = null;
    form.value.automaticRefund = null;
  }
}

const changeEnableRecharge = (e) => {
  const value = e.target.value;
  if (value == '1') {
    showRechargeRule.value = true
  } else {
    showRechargeRule.value = false
    form.value.rechargeRule = [];
  }
}

const changeBalanceRefund = (e) => {
  const value = e.target.value;
  if (value == '1') {
    showBalanceRefund.value = true
  } else {
    showBalanceRefund.value = false
    form.value.balanceAutomaticRefund = null;
    form.value.deductionGift = null;
  }
}

const changeUserApplyIncoice = (e) => {
  const value = e.target.value;
  if (value == '1') {
    showIssueAnInvoiceStartTime.value = true
  } else {
    showIssueAnInvoiceStartTime.value = false
    form.value.issueAnInvoiceStartTime = null;
  }
}

const addAmount = (data) => {
  if (amountInput) {
    if (amountInput.value == undefined || amountInput.value == "") return;
    form.value.rechargeRule.push({
      key: getGUID(),
      name: amountInput.value + "元",
      value: amountInput.value
    })
    amountInput.value = "";
  }
}

const handleClose = (data) => {
  const key = data.key;
  let item = _.clone(form.value.rechargeRule);
  remove(key, "key", item)
  form.value.rechargeRule = item;
}

const remove = (val, filed, array) => {
  const index = array.findIndex(obj => obj[filed] === val);
  if (index > -1) {
    array.splice(index, 1);
  }
}

const validateForm = async () => {
  await formRef.value.validate();
  const formData = _.cloneDeep(formRef.value.getFieldsValue());
  formData['issueAnInvoiceStartTime'] = dayjs(formData['issueAnInvoiceStartTime']).format('YYYY-MM-DD')
  formData['tableName'] = form.value.tableName
  formData['id'] = form.value.id
  return formData;
}

const loadFormData = (formData) => {
  if (formData) {
    if (formData['userApplyIncoice'] == "1") {
      formData['issueAnInvoiceStartTime'] = dayjs(formData['issueAnInvoiceStartTime'], 'YYYY-MM-DD')
    }
    let rechargeRule = [];
    if (formData['rechargeRule']) {
      formData['rechargeRule'].map(item => {
        rechargeRule.push({
          name: item + "元",
          value: item,
          key: getGUID()
        })
      })
      formData['rechargeRule'] = rechargeRule
    }
    form.value = { ...form.value, ...formData }
    if (formData['firstFree']) {
      changeFirstFree({ target: { value: formData['firstFree'] } })
    }
    if (formData['faceRecogintion']) {
      changeFaceRecogintion({ target: { value: formData['faceRecogintion'] } })
    }
    if (formData['orderAppeal']) {
      changeOrderAppeal({ target: { value: formData['orderAppeal'] } })
    }
    if (formData['enableRecharge']) {
      changeEnableRecharge({ target: { value: formData['enableRecharge'] } })
    }
    if (formData['balanceRefund']) {
      changeBalanceRefund({ target: { value: formData['balanceRefund'] } })
    }
    if (formData['userApplyIncoice']) {
      changeUserApplyIncoice({ target: { value: formData['userApplyIncoice'] } })
    }
  }
}

const getFormData = () => {
  return _.cloneDeep(form.value);
}

const resetFormValue = () => {
  formRef.value.resetFields()
}

defineExpose({ validateForm, resetFormValue, loadFormData, getFormData });
</script>
