133 lines
2.4 KiB
Vue
133 lines
2.4 KiB
Vue
<script lang="ts" setup>
|
|
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 = ({ pagination, filter }) => {
|
|
return safeClient(() =>
|
|
client.api.admin.users.get({
|
|
query: {
|
|
...pagination,
|
|
...filter
|
|
}
|
|
})
|
|
);
|
|
};
|
|
|
|
const columns: TableBaseColumns = [
|
|
{
|
|
title: '用户ID',
|
|
key: 'userId'
|
|
},
|
|
{
|
|
title: 'UID',
|
|
key: 'uid'
|
|
},
|
|
{
|
|
title: '用户名',
|
|
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: '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"
|
|
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>
|