219 lines
7.4 KiB
Vue
219 lines
7.4 KiB
Vue
<script lang="ts" setup>
|
|
import { reactive, ref } from 'vue';
|
|
import type { FormInst, FormItemRule } from 'naive-ui';
|
|
import { NButton, NForm, NFormItem, NFormItemGi, NGrid, NInput, NInputNumber, NSpace, NSwitch } from 'naive-ui';
|
|
import { client, safeClient } from '@/service/api';
|
|
|
|
type Asset = CommonType.TreatyBody<typeof client.api.admin.assets.post>;
|
|
|
|
defineOptions({
|
|
name: 'AssetEdit'
|
|
});
|
|
|
|
const props = defineProps<{
|
|
data: Asset;
|
|
}>();
|
|
|
|
const emit = defineEmits<{
|
|
close: [];
|
|
}>();
|
|
|
|
const formRef = ref<FormInst | null>(null);
|
|
const loading = ref(false);
|
|
|
|
const formModel = reactive<Partial<Asset>>({
|
|
code: props.data.code,
|
|
name: props.data.name,
|
|
iconUrl: props.data.iconUrl,
|
|
maxWithdrawPerDay: props.data.maxWithdrawPerDay,
|
|
maxWithdrawPerTx: props.data.maxWithdrawPerTx,
|
|
minDeposit: props.data.minDeposit,
|
|
minWithdraw: props.data.minWithdraw,
|
|
withdrawFeeFixed: props.data.withdrawFeeFixed,
|
|
withdrawFeeRate: props.data.withdrawFeeRate,
|
|
tradeEnabled: props.data.tradeEnabled,
|
|
transferEnabled: props.data.transferEnabled,
|
|
withdrawEnabled: props.data.withdrawEnabled,
|
|
depositEnabled: props.data.depositEnabled,
|
|
isActive: props.data.isActive,
|
|
isRwaAsset: props.data.isRwaAsset,
|
|
sortOrder: props.data.sortOrder
|
|
});
|
|
|
|
// 用于表单输入的临时数字值
|
|
const tempValues = ref({
|
|
maxWithdrawPerDay: Number(props.data.maxWithdrawPerDay) || 0,
|
|
maxWithdrawPerTx: Number(props.data.maxWithdrawPerTx) || 0,
|
|
minDeposit: Number(props.data.minDeposit) || 0,
|
|
minWithdraw: Number(props.data.minWithdraw) || 0,
|
|
withdrawFeeFixed: Number(props.data.withdrawFeeFixed) || 0,
|
|
withdrawFeeRate: Number(props.data.withdrawFeeRate) * 100 || 0, // 转换为百分比
|
|
sortOrder: Number(props.data.sortOrder) || 0
|
|
});
|
|
|
|
const rules: Record<string, FormItemRule | FormItemRule[]> = {
|
|
code: { required: true, message: '请输入资产代码', trigger: 'blur' },
|
|
name: { required: true, message: '请输入资产名称', trigger: 'blur' },
|
|
iconUrl: { required: true, message: '请输入图标地址', trigger: 'blur' },
|
|
minDeposit: { required: true, message: '请输入最小充值金额', trigger: 'blur' },
|
|
minWithdraw: { required: true, message: '请输入最小提现金额', trigger: 'blur' },
|
|
withdrawFeeFixed: { required: true, message: '请输入提现固定手续费', trigger: 'blur' },
|
|
withdrawFeeRate: { required: true, message: '请输入提现手续费率', trigger: 'blur' }
|
|
};
|
|
|
|
// 同步数字输入到表单字符串
|
|
function syncNumberToString() {
|
|
formModel.maxWithdrawPerDay = tempValues.value.maxWithdrawPerDay.toString();
|
|
formModel.maxWithdrawPerTx = tempValues.value.maxWithdrawPerTx.toString();
|
|
formModel.minDeposit = tempValues.value.minDeposit.toString();
|
|
formModel.minWithdraw = tempValues.value.minWithdraw.toString();
|
|
formModel.withdrawFeeFixed = tempValues.value.withdrawFeeFixed.toString();
|
|
formModel.withdrawFeeRate = (tempValues.value.withdrawFeeRate / 100).toString(); // 转回小数
|
|
formModel.sortOrder = tempValues.value.sortOrder;
|
|
}
|
|
|
|
async function handleSubmit() {
|
|
syncNumberToString();
|
|
await formRef.value?.validate();
|
|
loading.value = true;
|
|
await safeClient(() =>
|
|
client.api.admin.assets({ code: props.data.code }).patch({
|
|
...formModel
|
|
})
|
|
);
|
|
loading.value = false;
|
|
window.$message?.success('更新成功');
|
|
emit('close');
|
|
}
|
|
|
|
function handleCancel() {
|
|
emit('close');
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="my-10">
|
|
<NForm ref="formRef" :model="formModel" :rules="rules" label-placement="left" :label-width="140">
|
|
<NGrid :cols="2" :x-gap="12">
|
|
<NFormItemGi label="资产代码" path="code">
|
|
<NInput v-model:value="formModel.code" placeholder="请输入资产代码" />
|
|
</NFormItemGi>
|
|
|
|
<NFormItemGi label="资产名称" path="name">
|
|
<NInput v-model:value="formModel.name" placeholder="请输入资产名称" />
|
|
</NFormItemGi>
|
|
</NGrid>
|
|
|
|
<NFormItem label="图标地址" path="iconUrl">
|
|
<IconPicker v-model="formModel.iconUrl" :collections="['cryptocurrency-color']" />
|
|
</NFormItem>
|
|
|
|
<NGrid :cols="2" :x-gap="12">
|
|
<NFormItemGi label="每日最大提现金额" path="maxWithdrawPerDay">
|
|
<NInputNumber
|
|
v-model:value="tempValues.maxWithdrawPerDay"
|
|
placeholder="请输入每日最大提现金额"
|
|
:min="0"
|
|
:precision="2"
|
|
class="w-full"
|
|
/>
|
|
</NFormItemGi>
|
|
|
|
<NFormItemGi label="单笔最大提现金额" path="maxWithdrawPerTx">
|
|
<NInputNumber
|
|
v-model:value="tempValues.maxWithdrawPerTx"
|
|
placeholder="请输入单笔最大提现金额"
|
|
:min="0"
|
|
:precision="2"
|
|
class="w-full"
|
|
/>
|
|
</NFormItemGi>
|
|
</NGrid>
|
|
|
|
<NGrid :cols="2" :x-gap="12">
|
|
<NFormItemGi label="最小充值金额" path="minDeposit">
|
|
<NInputNumber
|
|
v-model:value="tempValues.minDeposit"
|
|
placeholder="请输入最小充值金额"
|
|
:min="0"
|
|
:precision="2"
|
|
class="w-full"
|
|
/>
|
|
</NFormItemGi>
|
|
|
|
<NFormItemGi label="最小提现金额" path="minWithdraw">
|
|
<NInputNumber
|
|
v-model:value="tempValues.minWithdraw"
|
|
placeholder="请输入最小提现金额"
|
|
:min="0"
|
|
:precision="2"
|
|
class="w-full"
|
|
/>
|
|
</NFormItemGi>
|
|
</NGrid>
|
|
|
|
<NGrid :cols="2" :x-gap="12">
|
|
<NFormItemGi label="提现固定手续费" path="withdrawFeeFixed">
|
|
<NInputNumber
|
|
v-model:value="tempValues.withdrawFeeFixed"
|
|
placeholder="请输入提现固定手续费"
|
|
:min="0"
|
|
:precision="2"
|
|
class="w-full"
|
|
/>
|
|
</NFormItemGi>
|
|
|
|
<NFormItemGi label="提现手续费率" path="withdrawFeeRate">
|
|
<NInputNumber
|
|
v-model:value="tempValues.withdrawFeeRate"
|
|
placeholder="请输入提现手续费率"
|
|
:min="0"
|
|
:max="100"
|
|
:precision="4"
|
|
class="w-full"
|
|
>
|
|
<template #suffix>%</template>
|
|
</NInputNumber>
|
|
</NFormItemGi>
|
|
</NGrid>
|
|
|
|
<NFormItem label="排序" path="sortOrder">
|
|
<NInputNumber v-model:value="tempValues.sortOrder" placeholder="请输入排序" :min="0" class="w-full" />
|
|
</NFormItem>
|
|
|
|
<NGrid :cols="2" :x-gap="12">
|
|
<NFormItemGi label="是否可交易">
|
|
<NSwitch v-model:value="formModel.tradeEnabled" />
|
|
</NFormItemGi>
|
|
|
|
<NFormItemGi label="是否可转账">
|
|
<NSwitch v-model:value="formModel.transferEnabled" />
|
|
</NFormItemGi>
|
|
|
|
<NFormItemGi label="是否可提现">
|
|
<NSwitch v-model:value="formModel.withdrawEnabled" />
|
|
</NFormItemGi>
|
|
|
|
<NFormItemGi label="是否可充值">
|
|
<NSwitch v-model:value="formModel.depositEnabled" />
|
|
</NFormItemGi>
|
|
|
|
<NFormItemGi label="是否启用">
|
|
<NSwitch v-model:value="formModel.isActive" />
|
|
</NFormItemGi>
|
|
|
|
<NFormItemGi label="是否为 RWA 资产">
|
|
<NSwitch v-model:value="formModel.isRwaAsset" />
|
|
</NFormItemGi>
|
|
</NGrid>
|
|
|
|
<NSpace justify="end">
|
|
<NButton type="primary" ghost @click="handleCancel">取消</NButton>
|
|
<NButton type="primary" :loading="loading" @click="handleSubmit">提交</NButton>
|
|
</NSpace>
|
|
</NForm>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="css" scoped></style>
|