rogee/quyun-v2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 添加用户租户管理功能，优化用户列表和租户信息展示，增强查询过滤条件

Browse Source
This commit is contained in:
Rogee
2025-12-24 00:02:44 +08:00
parent 26e4279f1e
commit 3e8a02d549
8 changed files with 847 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
frontend/superadmin/src/service/UserService.js
View File

@@ -7,8 +7,41 @@ function normalizeItems(items) {
}
export const UserService = {
async listUsers({ page, limit, tenantID, username, status, sortField, sortOrder } = {}) {
const query = { page, limit, tenantID, username, status };
async listUsers({
page,
limit,
id,
tenant_id,
username,
status,
role,
created_at_from,
created_at_to,
verified_at_from,
verified_at_to,
sortField,
sortOrder
} = {}) {
const iso = (d) => {
if (!d) return undefined;
const date = d instanceof Date ? d : new Date(d);
if (Number.isNaN(date.getTime())) return undefined;
return date.toISOString();
};
const query = {
page,
limit,
id,
tenant_id,
username,
status,
role,
created_at_from: iso(created_at_from),
created_at_to: iso(created_at_to),
verified_at_from: iso(verified_at_from),
verified_at_to: iso(verified_at_to)
};
if (sortField && sortOrder) {
if (sortOrder === 1) query.asc = sortField;
if (sortOrder === -1) query.desc = sortField;
@@ -55,5 +88,38 @@ export const UserService = {
}
throw error;
}
},
async listUserTenants(
userID,
{ page, limit, tenant_id, code, name, role, status, created_at_from, created_at_to } = {}
) {
if (!userID) throw new Error('userID is required');
const iso = (d) => {
if (!d) return undefined;
const date = d instanceof Date ? d : new Date(d);
if (Number.isNaN(date.getTime())) return undefined;
return date.toISOString();
};
const query = {
page,
limit,
tenant_id,
code,
name,
role,
status,
created_at_from: iso(created_at_from),
created_at_to: iso(created_at_to)
};
const data = await requestJson(`/super/v1/users/${userID}/tenants`, { query });
return {
page: data?.page ?? page ?? 1,
limit: data?.limit ?? limit ?? 10,
total: data?.total ?? 0,
items: normalizeItems(data?.items)
};
}
};

374
frontend/superadmin/src/views/superadmin/Users.vue
View File

@@ -2,6 +2,7 @@
import SearchField from '@/components/SearchField.vue';
import SearchPanel from '@/components/SearchPanel.vue';
import StatisticsStrip from '@/components/StatisticsStrip.vue';
import { TenantService } from '@/service/TenantService';
import { UserService } from '@/service/UserService';
import { useToast } from 'primevue/usetoast';
import { computed, onMounted, ref } from 'vue';
@@ -15,8 +16,15 @@ const totalRecords = ref(0);
const page = ref(1);
const rows = ref(10);
const userID = ref(null);
const tenantID = ref(null);
const username = ref('');
const status = ref('');
const role = ref('');
const createdAtFrom = ref(null);
const createdAtTo = ref(null);
const verifiedAtFrom = ref(null);
const verifiedAtTo = ref(null);
const sortField = ref('id');
const sortOrder = ref(-1);
@@ -28,6 +36,12 @@ function formatDate(value) {
return date.toLocaleString();
}
function formatCny(amountInCents) {
const amount = Number(amountInCents) / 100;
if (!Number.isFinite(amount)) return '-';
return new Intl.NumberFormat('zh-CN', { style: 'currency', currency: 'CNY' }).format(amount);
}
function getStatusSeverity(status) {
switch (status) {
case 'active':
@@ -51,6 +65,31 @@ const statusOptions = ref([]);
const statusUser = ref(null);
const statusValue = ref(null);
const statusFilterOptions = computed(() => [{ label: '全部', value: '' }, ...(statusOptions.value || [])]);
const ownedTenantsDialogVisible = ref(false);
const ownedTenantsLoading = ref(false);
const ownedTenantsUser = ref(null);
const ownedTenants = ref([]);
const ownedTenantsTotal = ref(0);
const ownedTenantsPage = ref(1);
const ownedTenantsRows = ref(10);
const joinedTenantsDialogVisible = ref(false);
const joinedTenantsLoading = ref(false);
const joinedTenantsUser = ref(null);
const joinedTenants = ref([]);
const joinedTenantsTotal = ref(0);
const joinedTenantsPage = ref(1);
const joinedTenantsRows = ref(10);
const joinedTenantsTenantID = ref(null);
const joinedTenantsCode = ref('');
const joinedTenantsName = ref('');
const joinedTenantsRole = ref('');
const joinedTenantsStatus = ref('');
const joinedTenantsJoinedAtFrom = ref(null);
const joinedTenantsJoinedAtTo = ref(null);
const statistics = ref([]);
const statisticsLoading = ref(false);
@@ -154,8 +193,15 @@ async function loadUsers() {
const result = await UserService.listUsers({
page: page.value,
limit: rows.value,
id: userID.value || undefined,
tenant_id: tenantID.value || undefined,
username: username.value,
status: status.value,
role: role.value || undefined,
created_at_from: createdAtFrom.value || undefined,
created_at_to: createdAtTo.value || undefined,
verified_at_from: verifiedAtFrom.value || undefined,
verified_at_to: verifiedAtTo.value || undefined,
sortField: sortField.value,
sortOrder: sortOrder.value
});
@@ -179,8 +225,15 @@ function onSearch() {
}
function onReset() {
userID.value = null;
tenantID.value = null;
username.value = '';
status.value = '';
role.value = '';
createdAtFrom.value = null;
createdAtTo.value = null;
verifiedAtFrom.value = null;
verifiedAtTo.value = null;
sortField.value = 'id';
sortOrder.value = -1;
page.value = 1;
@@ -200,6 +253,107 @@ function onSort(event) {
loadUsers();
}
function openOwnedTenantsDialog(user) {
ownedTenantsUser.value = user;
ownedTenantsDialogVisible.value = true;
ownedTenantsPage.value = 1;
ownedTenantsRows.value = 10;
loadOwnedTenants();
}
function openJoinedTenantsDialog(user) {
joinedTenantsUser.value = user;
joinedTenantsDialogVisible.value = true;
joinedTenantsPage.value = 1;
joinedTenantsRows.value = 10;
joinedTenantsTenantID.value = null;
joinedTenantsCode.value = '';
joinedTenantsName.value = '';
joinedTenantsRole.value = '';
joinedTenantsStatus.value = '';
joinedTenantsJoinedAtFrom.value = null;
joinedTenantsJoinedAtTo.value = null;
loadJoinedTenants();
}
async function loadOwnedTenants() {
const uid = ownedTenantsUser.value?.id;
if (!uid) return;
ownedTenantsLoading.value = true;
try {
const result = await TenantService.listTenants({
page: ownedTenantsPage.value,
limit: ownedTenantsRows.value,
user_id: uid,
sortField: 'id',
sortOrder: -1
});
ownedTenants.value = result.items;
ownedTenantsTotal.value = result.total;
} catch (error) {
toast.add({ severity: 'error', summary: '加载失败', detail: error?.message || '无法加载该用户拥有的租户', life: 4000 });
} finally {
ownedTenantsLoading.value = false;
}
}
function onOwnedTenantsPage(event) {
ownedTenantsPage.value = (event.page ?? 0) + 1;
ownedTenantsRows.value = event.rows ?? ownedTenantsRows.value;
loadOwnedTenants();
}
async function loadJoinedTenants() {
const uid = joinedTenantsUser.value?.id;
if (!uid) return;
joinedTenantsLoading.value = true;
try {
const result = await UserService.listUserTenants(uid, {
page: joinedTenantsPage.value,
limit: joinedTenantsRows.value,
tenant_id: joinedTenantsTenantID.value || undefined,
code: joinedTenantsCode.value,
name: joinedTenantsName.value,
role: joinedTenantsRole.value || undefined,
status: joinedTenantsStatus.value || undefined,
created_at_from: joinedTenantsJoinedAtFrom.value || undefined,
created_at_to: joinedTenantsJoinedAtTo.value || undefined
});
joinedTenants.value = result.items;
joinedTenantsTotal.value = result.total;
} catch (error) {
toast.add({ severity: 'error', summary: '加载失败', detail: error?.message || '无法加载该用户加入的租户', life: 4000 });
} finally {
joinedTenantsLoading.value = false;
}
}
function onJoinedTenantsSearch() {
joinedTenantsPage.value = 1;
loadJoinedTenants();
}
function onJoinedTenantsReset() {
joinedTenantsTenantID.value = null;
joinedTenantsCode.value = '';
joinedTenantsName.value = '';
joinedTenantsRole.value = '';
joinedTenantsStatus.value = '';
joinedTenantsJoinedAtFrom.value = null;
joinedTenantsJoinedAtTo.value = null;
joinedTenantsPage.value = 1;
joinedTenantsRows.value = 10;
loadJoinedTenants();
}
function onJoinedTenantsPage(event) {
joinedTenantsPage.value = (event.page ?? 0) + 1;
joinedTenantsRows.value = event.rows ?? joinedTenantsRows.value;
loadJoinedTenants();
}
onMounted(() => {
loadUsers();
loadStatistics();
@@ -216,6 +370,12 @@ onMounted(() => {
</div>
<SearchPanel :loading="loading" @search="onSearch" @reset="onReset">
<SearchField label="UserID">
<InputNumber v-model="userID" :min="1" placeholder="精确匹配" class="w-full" />
</SearchField>
<SearchField label="TenantID">
<InputNumber v-model="tenantID" :min="1" placeholder="加入该租户的用户" class="w-full" />
</SearchField>
<SearchField label="用户名">
<IconField>
<InputIcon>
@@ -225,7 +385,33 @@ onMounted(() => {
</IconField>
</SearchField>
<SearchField label="状态">
<Select v-model="status" :options="statusOptions" optionLabel="label" optionValue="value" placeholder="请选择" :loading="statusOptionsLoading" class="w-full" />
<Select v-model="status" :options="statusFilterOptions" optionLabel="label" optionValue="value" placeholder="请选择" :loading="statusOptionsLoading" class="w-full" />
</SearchField>
<SearchField label="角色">
<Select
v-model="role"
:options="[
{ label: '全部', value: '' },
{ label: 'user', value: 'user' },
{ label: 'super_admin', value: 'super_admin' }
]"
optionLabel="label"
optionValue="value"
placeholder="请选择"
class="w-full"
/>
</SearchField>
<SearchField label="创建时间 From">
<DatePicker v-model="createdAtFrom" showIcon showButtonBar placeholder="开始时间" class="w-full" />
</SearchField>
<SearchField label="创建时间 To">
<DatePicker v-model="createdAtTo" showIcon showButtonBar placeholder="结束时间" class="w-full" />
</SearchField>
<SearchField label="认证时间 From">
<DatePicker v-model="verifiedAtFrom" showIcon showButtonBar placeholder="开始时间" class="w-full" />
</SearchField>
<SearchField label="认证时间 To">
<DatePicker v-model="verifiedAtTo" showIcon showButtonBar placeholder="结束时间" class="w-full" />
</SearchField>
</SearchPanel>
@@ -265,6 +451,42 @@ onMounted(() => {
</div>
</template>
</Column>
<Column field="balance" header="余额" sortable style="min-width: 10rem">
<template #body="{ data }">
{{ formatCny(data.balance) }}
</template>
</Column>
<Column field="balance_frozen" header="冻结" sortable style="min-width: 10rem">
<template #body="{ data }">
{{ formatCny(data.balance_frozen) }}
</template>
</Column>
<Column header="拥有租户" style="min-width: 10rem">
<template #body="{ data }">
<Button
:label="String(data.owned_tenant_count ?? 0)"
icon="pi pi-building"
text
size="small"
class="p-0"
:disabled="(data.owned_tenant_count ?? 0) === 0"
@click="openOwnedTenantsDialog(data)"
/>
</template>
</Column>
<Column header="加入租户" style="min-width: 10rem">
<template #body="{ data }">
<Button
:label="String(data.joined_tenant_count ?? 0)"
icon="pi pi-users"
text
size="small"
class="p-0"
:disabled="(data.joined_tenant_count ?? 0) === 0"
@click="openJoinedTenantsDialog(data)"
/>
</template>
</Column>
<Column field="verified_at" header="认证时间" sortable style="min-width: 14rem">
<template #body="{ data }">
{{ formatDate(data.verified_at) }}
@@ -301,5 +523,155 @@ onMounted(() => {
<Button label="确认" icon="pi pi-check" @click="confirmUpdateStatus" :loading="statusLoading" :disabled="!statusValue" />
</template>
</Dialog>
<Dialog v-model:visible="ownedTenantsDialogVisible" :modal="true" :style="{ width: '980px' }">
<template #header>
<div class="flex items-center gap-2">
<span class="font-medium">该用户拥有的租户</span>
<span class="text-muted-color truncate max-w-[360px]">{{ ownedTenantsUser?.username ?? '-' }}</span>
</div>
</template>
<div class="flex flex-col gap-4">
<DataTable
:value="ownedTenants"
dataKey="id"
:loading="ownedTenantsLoading"
lazy
:paginator="true"
:rows="ownedTenantsRows"
:totalRecords="ownedTenantsTotal"
:first="(ownedTenantsPage - 1) * ownedTenantsRows"
:rowsPerPageOptions="[10, 20, 50, 100]"
@page="onOwnedTenantsPage"
currentPageReportTemplate="显示第 {first} - {last} 条，共 {totalRecords} 条"
paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown"
scrollable
scrollHeight="420px"
responsiveLayout="scroll"
>
<Column field="id" header="ID" style="min-width: 6rem" />
<Column field="code" header="Code" style="min-width: 10rem" />
<Column field="name" header="名称" style="min-width: 14rem" />
<Column field="status_description" header="状态" style="min-width: 10rem" />
<Column field="user_count" header="用户数" style="min-width: 8rem" />
<Column field="income_amount_paid_sum" header="累计收入" style="min-width: 10rem">
<template #body="{ data }">
{{ formatCny(data.income_amount_paid_sum) }}
</template>
</Column>
<Column field="expired_at" header="过期时间" style="min-width: 14rem">
<template #body="{ data }">
{{ formatDate(data.expired_at) }}
</template>
</Column>
</DataTable>
</div>
<template #footer>
<Button label="关闭" icon="pi pi-times" text @click="ownedTenantsDialogVisible = false" />
</template>
</Dialog>
<Dialog v-model:visible="joinedTenantsDialogVisible" :modal="true" :style="{ width: '1180px' }">
<template #header>
<div class="flex items-center gap-2">
<span class="font-medium">该用户加入的租户</span>
<span class="text-muted-color truncate max-w-[360px]">{{ joinedTenantsUser?.username ?? '-' }}</span>
</div>
</template>
<div class="flex flex-col gap-4">
<SearchPanel :loading="joinedTenantsLoading" @search="onJoinedTenantsSearch" @reset="onJoinedTenantsReset">
<SearchField label="TenantID">
<InputNumber v-model="joinedTenantsTenantID" :min="1" placeholder="精确匹配" class="w-full" />
</SearchField>
<SearchField label="Code">
<InputText v-model="joinedTenantsCode" placeholder="请输入" class="w-full" @keyup.enter="onJoinedTenantsSearch" />
</SearchField>
<SearchField label="名称">
<InputText v-model="joinedTenantsName" placeholder="请输入" class="w-full" @keyup.enter="onJoinedTenantsSearch" />
</SearchField>
<SearchField label="成员角色">
<Select
v-model="joinedTenantsRole"
:options="[
{ label: '全部', value: '' },
{ label: 'tenant_admin', value: 'tenant_admin' },
{ label: 'member', value: 'member' }
]"
optionLabel="label"
optionValue="value"
placeholder="请选择"
class="w-full"
/>
</SearchField>
<SearchField label="成员状态">
<Select v-model="joinedTenantsStatus" :options="statusFilterOptions" optionLabel="label" optionValue="value" placeholder="请选择" :loading="statusOptionsLoading" class="w-full" />
</SearchField>
<SearchField label="加入时间 From">
<DatePicker v-model="joinedTenantsJoinedAtFrom" showIcon showButtonBar placeholder="开始时间" class="w-full" />
</SearchField>
<SearchField label="加入时间 To">
<DatePicker v-model="joinedTenantsJoinedAtTo" showIcon showButtonBar placeholder="结束时间" class="w-full" />
</SearchField>
</SearchPanel>
<DataTable
:value="joinedTenants"
dataKey="tenant_id"
:loading="joinedTenantsLoading"
lazy
:paginator="true"
:rows="joinedTenantsRows"
:totalRecords="joinedTenantsTotal"
:first="(joinedTenantsPage - 1) * joinedTenantsRows"
:rowsPerPageOptions="[10, 20, 50, 100]"
@page="onJoinedTenantsPage"
currentPageReportTemplate="显示第 {first} - {last} 条，共 {totalRecords} 条"
paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown"
scrollable
scrollHeight="420px"
responsiveLayout="scroll"
>
<Column field="tenant_id" header="TenantID" style="min-width: 7rem" />
<Column field="code" header="Code" style="min-width: 10rem" />
<Column field="name" header="名称" style="min-width: 14rem" />
<Column header="Owner" style="min-width: 12rem">
<template #body="{ data }">
<span>{{ data?.owner?.username ?? '-' }}</span>
</template>
</Column>
<Column header="租户状态" style="min-width: 12rem">
<template #body="{ data }">
<Tag :value="data.tenant_status_description || data.tenant_status || '-'" severity="secondary" />
</template>
</Column>
<Column header="成员角色" style="min-width: 14rem">
<template #body="{ data }">
<div class="flex flex-wrap gap-1">
<Tag v-for="r in data.role || []" :key="r" :value="r" severity="secondary" />
<span v-if="!data.role || data.role.length === 0" class="text-muted-color">-</span>
</div>
</template>
</Column>
<Column header="成员状态" style="min-width: 10rem">
<template #body="{ data }">
<Tag :value="data.member_status_description || data.member_status || '-'" :severity="getStatusSeverity(data.member_status)" />
</template>
</Column>
<Column field="joined_at" header="加入时间" style="min-width: 14rem">
<template #body="{ data }">
{{ formatDate(data.joined_at) }}
</template>
</Column>
<Column field="expired_at" header="过期时间" style="min-width: 14rem">
<template #body="{ data }">
{{ formatDate(data.expired_at) }}
</template>
</Column>
</DataTable>
</div>
<template #footer>
<Button label="关闭" icon="pi pi-times" text @click="joinedTenantsDialogVisible = false" />
</template>
</Dialog>
</div>
</template>