feat: 更新 @riwa/api-types 依赖版本,新增用户编辑表单组件,优化用户列表功能

This commit is contained in:
2026-01-12 19:34:22 +07:00
parent ac7882e99b
commit e3720742f7
5 changed files with 227 additions and 19 deletions

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.7:9527/api/riwa-eden-0.0.126.tgz",
"@riwa/api-types": "http://192.168.1.7:9527/api/riwa-eden-0.0.128.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.7:9527/api/riwa-eden-0.0.126.tgz
version: '@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.126.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.7:9527/api/riwa-eden-0.0.128.tgz
version: '@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.128.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
@@ -1230,9 +1230,9 @@ packages:
'@quansync/fs@0.1.6':
resolution: {integrity: sha512-zoA8SqQO11qH9H8FCBR7NIbowYARIPmBz3nKjgAaOUDi/xPAAu1uAgebtV7KXHTc6CDZJVRZ1u4wIGvY5CWYaw==}
'@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.126.tgz':
resolution: {tarball: http://192.168.1.7:9527/api/riwa-eden-0.0.126.tgz}
version: 0.0.126
'@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.128.tgz':
resolution: {tarball: http://192.168.1.7:9527/api/riwa-eden-0.0.128.tgz}
version: 0.0.128
peerDependencies:
'@elysiajs/eden': ^1.4.5
@@ -5651,7 +5651,7 @@ snapshots:
dependencies:
quansync: 0.3.0
'@riwa/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.126.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/eden@http://192.168.1.7:9527/api/riwa-eden-0.0.128.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

@@ -71,12 +71,12 @@ const columns: TableBaseColumns = [
negativeText: '否',
content: '确认删除该银行信息?',
onPositiveClick: async () => {
safeClient(() =>
await safeClient(() =>
client.api.admin.deposit.reject({ orderId: row.id as string }).post({
reviewNote: '管理员拒绝充值'
})
);
// tableInst.value?.reload();
tableInst.value?.reload();
message.success('删除成功');
}
});

View File

@@ -0,0 +1,120 @@
<script lang="ts" setup>
import { ref, useTemplateRef } from 'vue';
import type { FormInst, FormRules } from 'naive-ui';
import type { Treaty } from '@elysiajs/eden';
import { client, safeClient } from '@/service/api';
defineOptions({ name: 'UserEditForm' });
type Data = Treaty.Data<typeof client.api.admin.users.get>['data'][number];
const props = defineProps<{
data: Data;
}>();
const emit = defineEmits<{
(e: 'close'): void;
}>();
const formInst = useTemplateRef<FormInst>('formInst');
const form = ref({
userId: props.data.userId,
nickname: props.data.nickname,
email: props.data.user?.email || '',
phoneNumber: props.data.user?.phoneNumber || '',
gender: props.data.gender,
language: props.data.language
});
const genderOptions = [
{ label: '男', value: 'male' },
{ label: '女', value: 'female' },
{ label: '其他', value: 'other' }
];
const languageOptions = [
{ label: '简体中文', value: 'zh-CN' },
{ label: 'English', value: 'en-US' },
{ label: '繁體中文', value: 'zh-TW' }
];
const rules: FormRules = {
nickname: [
{ required: true, message: '请输入用户名', trigger: ['blur', 'input'] },
{ min: 2, max: 20, message: '用户名长度为2-20个字符', trigger: ['blur', 'input'] }
],
email: [
{ required: false, message: '请输入邮箱', trigger: ['blur', 'input'] },
{ type: 'email', message: '请输入正确的邮箱格式', trigger: ['blur', 'input'] }
],
phoneNumber: [{ required: false, message: '请输入手机号', trigger: ['blur', 'input'] }]
};
const loading = ref(false);
async function handleSubmit() {
await formInst.value?.validate(async errors => {
if (errors) return;
loading.value = true;
try {
await safeClient(() =>
client.api.admin.users({ userId: form.value.userId }).profile.put({
nickname: form.value.nickname,
gender: form.value.gender,
language: form.value.language
})
);
window.$message?.success('更新成功');
emit('close');
} finally {
loading.value = false;
}
});
}
</script>
<template>
<div class="my-10">
<NForm
ref="formInst"
:model="form"
label-width="auto"
label-placement="left"
:rules="rules"
require-mark-placement="left"
>
<NFormItem path="userId" label="用户ID">
<NInput :value="data.userId" disabled />
</NFormItem>
<NFormItem path="uid" label="UID">
<NInput :value="data.uid" disabled />
</NFormItem>
<NFormItem path="nickname" label="用户名">
<NInput v-model:value="form.nickname" placeholder="请输入用户名" />
</NFormItem>
<NFormItem path="email" label="邮箱">
<NInput :value="form.email" disabled placeholder="邮箱不可修改" />
</NFormItem>
<NFormItem path="phoneNumber" label="手机号">
<NInput :value="form.phoneNumber" disabled placeholder="手机号不可修改" />
</NFormItem>
<NFormItem path="referralCode" label="推荐人ID">
<NInput :value="data.referralCode || '无'" disabled />
</NFormItem>
<NFormItem path="gender" label="性别">
<NSelect v-model:value="form.gender" :options="genderOptions" placeholder="请选择性别" clearable />
</NFormItem>
<NFormItem path="language" label="语言">
<NSelect v-model:value="form.language" :options="languageOptions" placeholder="请选择语言" />
</NFormItem>
<NSpace justify="end">
<NButton @click="$emit('close')"> </NButton>
<NButton type="primary" :loading="loading" @click="handleSubmit"> </NButton>
</NSpace>
</NForm>
</div>
</template>
<style lang="css" scoped></style>

View File

@@ -1,44 +1,132 @@
<script lang="ts" setup>
import { h, ref, useTemplateRef } from 'vue';
import { h, useTemplateRef } from 'vue';
import { NInputNumber, useDialog, useMessage } from 'naive-ui';
import { client, safeClient } from '@/service/api';
import { DepositTypeEnum } from '@/enum';
import type { TableBaseColumns, TableFetchData, TableInst } from '@/components/table';
import EditForm from './components/edit.vue';
const dialog = useDialog();
const message = useMessage();
const tableInst = useTemplateRef<TableInst>('tableInst');
const fetchData: TableFetchData = () => {
const fetchData: TableFetchData = ({ pagination, filter }) => {
return safeClient(() =>
client.api.user.profile.get({
query: {}
client.api.admin.users.get({
query: {
...pagination,
...filter
}
})
);
};
const columns: TableBaseColumns = [
{
title: 'ID',
key: 'id'
title: '用户ID',
key: 'userId'
},
{
title: 'UID',
key: 'uid'
},
{
title: '用户名',
key: 'name'
key: 'nickname'
},
{
title: '邮箱',
key: 'user.email'
},
{
title: '手机号',
key: 'user.phoneNumber'
},
{
title: '推荐人ID',
key: 'referralCode'
},
{
title: '性别',
key: 'gender'
},
{
title: '语言',
key: 'language'
},
{
title: '操作',
fixed: 'right',
key: 'operation',
width: 100,
operations: (row: any) => [
{
contentText: '编辑',
type: 'primary',
ghost: true,
size: 'small',
onClick: () => {
handleEdit(row);
}
}
]
}
];
const filterColumns: TableBaseColumns = [
{
title: '用户ID',
key: 'userId'
},
{
title: '用户名',
key: 'nickname'
},
{
title: '邮箱',
key: 'email'
},
{
title: '状态',
key: 'image'
title: '手机号',
key: 'phoneNumber'
},
{
title: '推荐人ID',
key: 'referralCode'
}
];
function handleEdit(row: any) {
const dialogInstance = dialog.create({
title: '编辑用户',
content: () =>
h(EditForm, {
data: row,
onClose: () => {
dialogInstance.destroy();
tableInst.value?.reload();
}
}),
style: { width: '700px' },
showIcon: false
});
}
</script>
<template>
<TableBase ref="tableInst" :columns="columns" :fetch-data="fetchData" />
<TableBase
ref="tableInst"
show-header-operation
:columns="columns"
:fetch-data="fetchData"
:filter-columns="filterColumns"
:scroll-x="1400"
:header-operations="{
add: false,
refresh: true,
columns: true
}"
/>
</template>
<style lang="css" scoped></style>