feat: 更新 @riwa/api-types 依赖版本,新增用户编辑表单组件,优化用户列表功能
This commit is contained in:
@@ -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
12
pnpm-lock.yaml
generated
@@ -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))
|
||||
|
||||
|
||||
@@ -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('删除成功');
|
||||
}
|
||||
});
|
||||
|
||||
120
src/views/user/list/components/edit.vue
Normal file
120
src/views/user/list/components/edit.vue
Normal 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>
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user