feat: 更新生产和测试环境的服务地址;升级 @riwa/api-types 依赖至 0.0.70;新增交易对编辑功能

This commit is contained in:
2026-01-04 12:02:18 +07:00
parent 2eab7c5365
commit db5683c533
9 changed files with 296 additions and 51 deletions

View File

@@ -1,5 +1,5 @@
# backend service base url, prod environment
VITE_SERVICE_BASE_URL=http://192.168.1.27:9527
VITE_SERVICE_BASE_URL=http://192.168.1.8:9527
# other backend service base url, prod environment
VITE_OTHER_SERVICE_BASE_URL= `{}`

View File

@@ -1,5 +1,5 @@
# backend service base url, test environment
VITE_SERVICE_BASE_URL=http://192.168.1.27:9528
VITE_SERVICE_BASE_URL=http://192.168.1.8:9528
# other backend service base url, test environment
VITE_OTHER_SERVICE_BASE_URL= `{}`

View File

@@ -50,7 +50,7 @@
"@better-scroll/core": "2.5.1",
"@elysiajs/eden": "^1.4.5",
"@iconify/vue": "5.0.0",
"@riwa/api-types": "http://192.168.1.3:9527/api/riwa-api-types-0.0.67.tgz",
"@riwa/api-types": "http://192.168.1.8:9527/api/riwa-api-types-0.0.70.tgz",
"@sa/axios": "workspace:*",
"@sa/color": "workspace:*",
"@sa/hooks": "workspace:*",

12
pnpm-lock.yaml generated
View File

@@ -18,8 +18,8 @@ importers:
specifier: 5.0.0
version: 5.0.0(vue@3.5.25(typescript@5.9.3))
'@riwa/api-types':
specifier: http://192.168.1.3:9527/api/riwa-api-types-0.0.67.tgz
version: http://192.168.1.3:9527/api/riwa-api-types-0.0.67.tgz(@elysiajs/eden@1.4.5(elysia@1.4.19(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3)))
specifier: http://192.168.1.8:9527/api/riwa-api-types-0.0.70.tgz
version: http://192.168.1.8:9527/api/riwa-api-types-0.0.70.tgz(@elysiajs/eden@1.4.5(elysia@1.4.19(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3)))
'@sa/axios':
specifier: workspace:*
version: link:packages/axios
@@ -1083,9 +1083,9 @@ packages:
'@quansync/fs@0.1.6':
resolution: {integrity: sha512-zoA8SqQO11qH9H8FCBR7NIbowYARIPmBz3nKjgAaOUDi/xPAAu1uAgebtV7KXHTc6CDZJVRZ1u4wIGvY5CWYaw==}
'@riwa/api-types@http://192.168.1.3:9527/api/riwa-api-types-0.0.67.tgz':
resolution: {tarball: http://192.168.1.3:9527/api/riwa-api-types-0.0.67.tgz}
version: 0.0.67
'@riwa/api-types@http://192.168.1.8:9527/api/riwa-api-types-0.0.70.tgz':
resolution: {tarball: http://192.168.1.8:9527/api/riwa-api-types-0.0.70.tgz}
version: 0.0.70
peerDependencies:
'@elysiajs/eden': ^1.4.5
@@ -5080,7 +5080,7 @@ snapshots:
dependencies:
quansync: 0.3.0
'@riwa/api-types@http://192.168.1.3:9527/api/riwa-api-types-0.0.67.tgz(@elysiajs/eden@1.4.5(elysia@1.4.19(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3)))':
'@riwa/api-types@http://192.168.1.8:9527/api/riwa-api-types-0.0.70.tgz(@elysiajs/eden@1.4.5(elysia@1.4.19(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3)))':
dependencies:
'@elysiajs/eden': 1.4.5(elysia@1.4.19(@sinclair/typebox@0.34.41)(exact-mirror@0.2.5(@sinclair/typebox@0.34.41))(file-type@21.1.1)(openapi-types@12.1.3)(typescript@5.9.3))

View File

@@ -10,7 +10,7 @@ defineOptions({
interface Props {
/** 当前选中的图标 */
modelValue?: string;
modelValue?: string | null | undefined;
/** 图标集前缀 */
prefix?: IconCollection;
/** 每页显示数量 */
@@ -43,7 +43,10 @@ const searchValue = ref('');
const loading = ref(false);
const allIcons = ref<string[]>([]);
const currentPage = ref(1);
const activeCollection = ref<IconCollection>(props.prefix);
// 确保 activeCollection 在 collections 列表中,如果不在则使用第一个
const activeCollection = ref<IconCollection>(
props.collections.includes(props.prefix) ? props.prefix : props.collections[0]
);
// 图标集显示名称映射
const collectionLabels: Record<IconCollection, string> = {
@@ -143,7 +146,7 @@ onMounted(() => {
>
<template #trigger>
<div
class="inline-flex cursor-pointer items-center gap-2 border border-gray-300 rounded px-3 py-2 transition-colors dark:border-gray-700 hover:border-primary"
class="inline-flex cursor-pointer items-center gap-2 border border-gray-300 rounded px-3 py-1 transition-colors dark:border-gray-700 hover:border-primary"
>
<template v-if="modelValue">
<SvgIcon :icon="modelValue" :style="{ fontSize: iconSize }" />

View File

@@ -32,7 +32,7 @@ function handleConfirm() {
</script>
<template>
<div class="rounded-lg bg-white px-5 pt-5 dark:bg-container">
<div class="rounded-lg bg-white p-5 dark:bg-container">
<NForm :label-width="80" label-align="left" label-placement="left">
<NGrid x-gap="20" :cols="4">
<NGi v-for="col in columns" :key="col.key">

View File

@@ -28,7 +28,6 @@ const form = ref<Body>({
isActive: true,
marginEnabled: false,
maxLeverage: null,
futuresEnabled: false,
spotEnabled: true
});
@@ -48,11 +47,20 @@ const rules: FormRules = {
quoteAsset: [{ required: true, message: '请输入计价资产代码', trigger: ['blur', 'input'] }],
minOrderAmount: [{ required: true, message: '请输入最小下单金额', trigger: ['blur', 'change'] }],
minOrderQuantity: [{ required: true, message: '请输入最小下单数量', trigger: ['blur', 'change'] }],
makerFeeRate: [{ required: true, message: '请输入Maker手续费率', trigger: ['blur', 'change'] }],
takerFeeRate: [{ required: true, message: '请输入Taker手续费率', trigger: ['blur', 'change'] }]
makerFeeRate: [{ required: true, message: '请输入挂单手续费率', trigger: ['blur', 'change'] }],
takerFeeRate: [{ required: true, message: '请输入成交手续费率', trigger: ['blur', 'change'] }]
};
const showMaxLeverage = computed(() => form.value.marginEnabled);
const { data: assets } = safeClient(client.api.admin.assets.get());
const assetsOption = computed(() => {
return assets.value?.data
.filter(item => item.code !== 'USDT')
.map(item => ({
label: item.code,
value: item.code
}));
});
// 同步数字输入到表单字符串
function syncNumberToString() {
@@ -92,21 +100,22 @@ function handleSubmit() {
:rules="rules"
require-mark-placement="left"
>
<NFormItem path="symbol" label="交易对标识">
<NInput v-model:value="form.symbol" placeholder="如BTC/USDT" />
</NFormItem>
<NFormItem path="name" label="交易对显示名称">
<NInput v-model:value="form.name" placeholder="如:比特币/泰达币" />
</NFormItem>
<NGrid :cols="2" :x-gap="12">
<NFormItemGi path="baseAsset" label="基础资产代码">
<NInput v-model:value="form.baseAsset" placeholder="如BTC" />
<NSelect
:value="form.baseAsset || undefined"
:options="assetsOption"
placeholder="如BTC"
@update:value="val => (form.baseAsset = val)"
/>
</NFormItemGi>
<NFormItemGi path="quoteAsset" label="计价资产代码">
<NInput v-model:value="form.quoteAsset" placeholder="如USDT" />
<NInput v-model:value="form.quoteAsset" placeholder="如USDT" readonly disabled />
</NFormItemGi>
</NGrid>
@@ -134,8 +143,8 @@ function handleSubmit() {
</NFormItemGi>
</NGrid>
<NFormItem path="iconUrl" label="交易对图标 URL">
<NInput v-model:value="form.iconUrl" placeholder="请输入图标链接" />
<NFormItem path="iconUrl" label="交易对图标">
<IconPicker v-model="form.iconUrl" :collections="['cryptocurrency-color']" />
</NFormItem>
<NFormItem path="description" label="交易对描述">
@@ -143,28 +152,24 @@ function handleSubmit() {
</NFormItem>
<NGrid :cols="2" :x-gap="12">
<NFormItemGi path="isActive" label="是否启用">
<NSwitch v-model:value="form.isActive" />
</NFormItemGi>
<NFormItemGi path="spotEnabled" label="是否支持现货交易">
<NSwitch v-model:value="form.spotEnabled" />
</NFormItemGi>
<NFormItemGi path="futuresEnabled" label="是否支持合约交易">
<NSwitch v-model:value="form.futuresEnabled" />
<NFormItemGi path="isActive" label="是否启用">
<NSwitch v-model:value="form.isActive" />
</NFormItemGi>
<NFormItemGi path="marginEnabled" label="是否支持杠杆交易">
<NSwitch v-model:value="form.marginEnabled" />
</NFormItemGi>
</NGrid>
<NFormItem v-if="showMaxLeverage" path="maxLeverage" label="最大杠杆倍数">
<NInputNumber v-model:value="tempValues.maxLeverage" :min="1" :max="100" :precision="0" class="w-full">
<template #suffix></template>
</NInputNumber>
</NFormItem>
<NFormItemGi v-if="showMaxLeverage" path="maxLeverage" label="最大杠杆倍数">
<NInputNumber v-model:value="tempValues.maxLeverage" :min="1" :max="100" :precision="0" class="w-full">
<template #suffix></template>
</NInputNumber>
</NFormItemGi>
</NGrid>
<NSpace justify="end">
<NButton type="primary" ghost @click="$emit('close')"> </NButton>

View File

@@ -0,0 +1,186 @@
<script lang="ts" setup>
import { computed, ref, useTemplateRef } from 'vue';
import type { FormInst, FormRules } from 'naive-ui';
import { client, safeClient } from '@/service/api';
type Body = CommonType.TreatyBody<typeof client.api.admin.trading_pairs.post>;
defineOptions({
name: 'TradingPairEdit'
});
const props = defineProps<{
data: Body;
}>();
const emit = defineEmits<{
(e: 'close'): void;
}>();
const formInst = useTemplateRef<FormInst>('formInst');
const form = ref<Body>({
symbol: props.data.symbol,
name: props.data.name,
baseAsset: props.data.baseAsset,
quoteAsset: props.data.quoteAsset,
description: props.data.description,
minOrderAmount: props.data.minOrderAmount,
minOrderQuantity: props.data.minOrderQuantity,
makerFeeRate: props.data.makerFeeRate,
takerFeeRate: props.data.takerFeeRate,
iconUrl: props.data.iconUrl,
isActive: props.data.isActive,
marginEnabled: props.data.marginEnabled,
maxLeverage: props.data.maxLeverage,
spotEnabled: props.data.spotEnabled
});
// 用于表单输入的临时数字值
const tempValues = ref({
minOrderAmount: 0,
minOrderQuantity: 0,
makerFeeRate: 0,
takerFeeRate: 0,
maxLeverage: 1
});
const rules: FormRules = {
symbol: [{ required: true, message: '请输入交易对标识', trigger: ['blur', 'input'] }],
name: [{ required: true, message: '请输入交易对显示名称', trigger: ['blur', 'input'] }],
baseAsset: [{ required: true, message: '请输入基础资产代码', trigger: ['blur', 'input'] }],
quoteAsset: [{ required: true, message: '请输入计价资产代码', trigger: ['blur', 'input'] }],
minOrderAmount: [{ required: true, message: '请输入最小下单金额', trigger: ['blur', 'change'] }],
minOrderQuantity: [{ required: true, message: '请输入最小下单数量', trigger: ['blur', 'change'] }],
makerFeeRate: [{ required: true, message: '请输入挂单手续费率', trigger: ['blur', 'change'] }],
takerFeeRate: [{ required: true, message: '请输入成交手续费率', trigger: ['blur', 'change'] }]
};
const showMaxLeverage = computed(() => form.value.marginEnabled);
const { data: assets } = safeClient(client.api.admin.assets.get());
const assetsOption = computed(() => {
return assets.value?.data
.filter(item => item.code !== 'USDT')
.map(item => ({
label: item.code,
value: item.code
}));
});
// 同步数字输入到表单字符串
function syncNumberToString() {
form.value.minOrderAmount = tempValues.value.minOrderAmount.toString();
form.value.minOrderQuantity = tempValues.value.minOrderQuantity.toString();
form.value.makerFeeRate = (tempValues.value.makerFeeRate / 100).toString();
form.value.takerFeeRate = (tempValues.value.takerFeeRate / 100).toString();
if (form.value.marginEnabled) {
form.value.maxLeverage = tempValues.value.maxLeverage;
} else {
form.value.maxLeverage = null;
}
}
function handleSubmit() {
formInst.value?.validate(async errors => {
if (!errors) {
syncNumberToString();
await safeClient(() =>
client.api.admin.trading_pairs({ symbol: props.data.symbol }).patch({
...form.value
})
);
emit('close');
}
});
}
</script>
<template>
<div class="my-10">
<NForm
ref="formInst"
:model="form"
label-width="140px"
label-placement="left"
:rules="rules"
require-mark-placement="left"
>
<NFormItem path="name" label="交易对显示名称">
<NInput v-model:value="form.name" placeholder="如:比特币/泰达币" />
</NFormItem>
<NGrid :cols="2" :x-gap="12">
<NFormItemGi path="baseAsset" label="基础资产代码">
<NSelect
:value="form.baseAsset || undefined"
:options="assetsOption"
placeholder="如BTC"
@update:value="val => (form.baseAsset = val)"
/>
</NFormItemGi>
<NFormItemGi path="quoteAsset" label="计价资产代码">
<NInput v-model:value="form.quoteAsset" placeholder="如USDT" readonly disabled />
</NFormItemGi>
</NGrid>
<NGrid :cols="2" :x-gap="12">
<NFormItemGi path="minOrderAmount" label="最小下单金额USDT">
<NInputNumber v-model:value="tempValues.minOrderAmount" :min="0" :precision="2" class="w-full" />
</NFormItemGi>
<NFormItemGi path="minOrderQuantity" label="最小下单数量">
<NInputNumber v-model:value="tempValues.minOrderQuantity" :min="0" :precision="8" class="w-full" />
</NFormItemGi>
</NGrid>
<NGrid :cols="2" :x-gap="12">
<NFormItemGi path="makerFeeRate" label="挂单手续费率">
<NInputNumber v-model:value="tempValues.makerFeeRate" :min="0" :max="100" :step="0.01" class="w-full">
<template #suffix>%</template>
</NInputNumber>
</NFormItemGi>
<NFormItemGi path="takerFeeRate" label="成交手续费率">
<NInputNumber v-model:value="tempValues.takerFeeRate" :min="0" :max="100" :step="0.01" class="w-full">
<template #suffix>%</template>
</NInputNumber>
</NFormItemGi>
</NGrid>
<NFormItem path="iconUrl" label="交易对图标">
<IconPicker v-model="form.iconUrl" :collections="['cryptocurrency-color']" />
</NFormItem>
<NFormItem path="description" label="交易对描述">
<NInput v-model:value="form.description" type="textarea" placeholder="请输入交易对描述" />
</NFormItem>
<NGrid :cols="2" :x-gap="12">
<NFormItemGi path="spotEnabled" label="是否支持现货交易">
<NSwitch v-model:value="form.spotEnabled" />
</NFormItemGi>
<NFormItemGi path="isActive" label="是否启用">
<NSwitch v-model:value="form.isActive" />
</NFormItemGi>
<NFormItemGi path="marginEnabled" label="是否支持杠杆交易">
<NSwitch v-model:value="form.marginEnabled" />
</NFormItemGi>
<NFormItemGi v-if="showMaxLeverage" path="maxLeverage" label="最大杠杆倍数">
<NInputNumber v-model:value="tempValues.maxLeverage" :min="1" :max="100" :precision="0" class="w-full">
<template #suffix></template>
</NInputNumber>
</NFormItemGi>
</NGrid>
<NSpace justify="end">
<NButton type="primary" ghost @click="$emit('close')"> </NButton>
<NButton type="primary" @click="handleSubmit"> </NButton>
</NSpace>
</NForm>
</div>
</template>
<style lang="css" scoped></style>

View File

@@ -4,6 +4,7 @@ import { NInput, NSelect, NTag, useDialog } from 'naive-ui';
import { client, safeClient } from '@/service/api';
import type { TableBaseColumns, TableFetchData, TableFilterColumns, TableInst } from '@/components/table';
import Add from './components/add.vue';
import Edit from './components/edit.vue';
const dialog = useDialog();
const tableInst = useTemplateRef<TableInst>('tableInst');
@@ -41,16 +42,9 @@ const columns: TableBaseColumns = [
key: 'quoteAsset',
width: 130
},
{
title: '描述',
key: 'description',
width: 200,
ellipsis: {
tooltip: true
}
},
{
title: 'Maker 手续费率',
title: '挂单手续费率',
key: 'makerFeeRate',
width: 140,
render: row => {
@@ -58,7 +52,7 @@ const columns: TableBaseColumns = [
}
},
{
title: 'Taker 手续费率',
title: '成交手续费率',
key: 'takerFeeRate',
width: 140,
render: row => {
@@ -99,19 +93,19 @@ const columns: TableBaseColumns = [
},
{
title: '价格小数位数',
key: 'priceScale',
key: 'pricePrecision',
width: 120,
align: 'center'
},
{
title: '数量小数位数',
key: 'quantityScale',
key: 'quantityPrecision',
width: 120,
align: 'center'
},
{
title: '排序权重',
key: 'sortWeight',
key: 'sortOrder',
width: 100,
align: 'center'
},
@@ -131,6 +125,45 @@ const columns: TableBaseColumns = [
}
);
}
},
{
title: '描述',
key: 'description',
width: 200
},
{
title: '操作',
fixed: 'right',
key: 'operation',
width: 200,
operations: (row: any) => [
{
contentText: '编辑',
ghost: true,
size: 'small',
onClick: () => {
handleEdit(row);
}
},
{
contentText: '删除',
type: 'error',
ghost: true,
size: 'small',
onClick: () => {
dialog.create({
title: '删除确认',
content: '确认删除该交易对吗,删除后不可恢复。',
positiveText: '确认',
negativeText: '取消',
onPositiveClick: async () => {
await safeClient(() => client.api.admin.trading_pairs({ symbol: row.symbol }).delete());
tableInst.value?.reload();
}
});
}
}
]
}
];
@@ -170,8 +203,8 @@ const filterColumns: TableFilterColumns = [
placeholder: '请选择状态',
clearable: true,
options: [
{ label: '支持', value: true },
{ label: '不支持', value: false }
{ label: '激活', value: true },
{ label: '未激活', value: false }
]
}
}
@@ -180,6 +213,7 @@ const filterColumns: TableFilterColumns = [
function handleAdd() {
const dialogInstance = dialog.create({
title: '添加交易对',
showIcon: false,
content: () =>
h(Add, {
onClose: () => {
@@ -191,6 +225,22 @@ function handleAdd() {
closable: true
});
}
function handleEdit(row: any) {
const dialogInstance = dialog.create({
title: '编辑交易对',
showIcon: false,
content: () =>
h(Edit, {
data: row,
onClose: () => {
dialogInstance?.destroy();
tableInst.value?.reload();
}
}),
style: { width: '800px' },
closable: true
});
}
</script>
<template>
@@ -199,6 +249,7 @@ function handleAdd() {
:columns="columns"
:filter-columns="filterColumns"
:fetch-data="fetchData"
:scroll-x="3000"
@add="handleAdd"
/>
</template>