refactor(projects): 页面布局调整为rdms风格

This commit is contained in:
2026-04-15 09:35:54 +08:00
parent a6fc7b48dc
commit e22f6550ae
21 changed files with 990 additions and 188 deletions

View File

@@ -1,10 +1,10 @@
<script setup lang="tsx">
import {computed, nextTick, onMounted, reactive, ref, watch} from 'vue';
import type {TableInstance} from 'element-plus';
import {ElButton, ElPopconfirm, ElSwitch, ElTag} from 'element-plus';
import { computed, nextTick, onMounted, reactive, ref, watch } from 'vue';
import type { TableInstance } from 'element-plus';
import { ElButton, ElPopconfirm, ElSwitch, ElTag } from 'element-plus';
import dayjs from 'dayjs';
import type {FlatResponseData} from '@sa/axios';
import {userGenderRecord} from '@/constants/business';
import type { FlatResponseData } from '@sa/axios';
import { userGenderRecord } from '@/constants/business';
import {
fetchBatchDeleteUser,
fetchDeleteDept,
@@ -17,11 +17,12 @@ import {
fetchUpdateUser,
fetchUpdateUserStatus
} from '@/service/api';
import {useUIPaginatedTable} from '@/hooks/common/table';
import { useUIPaginatedTable } from '@/hooks/common/table';
import BusinessTableActionCell from '@/components/custom/business-table-action-cell';
import BusinessFormDialog from '@/components/custom/business-form-dialog.vue';
import {$t} from '@/locales';
import {buildMenuTree} from '@/views/system/shared/menu-tree';
import { $t } from '@/locales';
import { buildMenuTree } from '@/views/system/shared/menu-tree';
import UserManagementRelation from '@/views/system/user-management-relation/index.vue';
import UserOperateDialog from './modules/user-operate-dialog.vue';
import UserOrgLeaderDialog from './modules/user-org-leader-dialog.vue';
import UserOrgOperateDialog from './modules/user-org-operate-dialog.vue';
@@ -29,9 +30,8 @@ import UserOrgPanel from './modules/user-org-panel.vue';
import UserResignedDialog from './modules/user-resigned-dialog.vue';
import UserResetPasswordDialog from './modules/user-reset-password-dialog.vue';
import UserSearch from './modules/user-search.vue';
import UserManagementRelation from '@/views/system/user-management-relation/index.vue';
defineOptions({name: 'UserManage'});
defineOptions({ name: 'UserManage' });
function getInitSearchParams(): Api.SystemManage.UserSearchParams {
return {
@@ -154,7 +154,7 @@ const deptTree = computed(() => buildMenuTree(deptList.value));
const currentDept = computed(() => deptList.value.find(item => item.id === currentDeptId.value) ?? null);
const deptCount = computed(() => deptList.value.length);
const {columns, columnChecks, data, loading, getDataByPage, mobilePagination} = useUIPaginatedTable<
const { columns, columnChecks, data, loading, getDataByPage, mobilePagination } = useUIPaginatedTable<
FlatResponseData<any, Api.SystemManage.UserList>,
Api.SystemManage.User
>({
@@ -178,9 +178,9 @@ const {columns, columnChecks, data, loading, getDataByPage, mobilePagination} =
searchParams.pageSize = params.pageSize ?? 10;
},
columns: () => [
{prop: 'selection', type: 'selection', width: 48},
{prop: 'index', type: 'index', label: $t('common.index'), width: 64},
{prop: 'username', label: $t('page.system.user.userName'), minWidth: 140, showOverflowTooltip: true},
{ prop: 'selection', type: 'selection', width: 48 },
{ prop: 'index', type: 'index', label: $t('common.index'), width: 64 },
{ prop: 'username', label: $t('page.system.user.userName'), minWidth: 140, showOverflowTooltip: true },
{
prop: 'nickname',
label: $t('page.system.user.nickName'),
@@ -260,9 +260,9 @@ const {columns, columnChecks, data, loading, getDataByPage, mobilePagination} =
formatter: row => {
const state = getUserResignedState(row);
const stateMap: Record<UserResignedState, { type: UI.ThemeColor; label: App.I18n.I18nKey }> = {
active: {type: 'success', label: 'page.system.user.resignedStateEnum.active'},
pending: {type: 'warning', label: 'page.system.user.resignedStateEnum.pending'},
resigned: {type: 'info', label: 'page.system.user.resignedStateEnum.resigned'}
active: { type: 'success', label: 'page.system.user.resignedStateEnum.active' },
pending: { type: 'warning', label: 'page.system.user.resignedStateEnum.pending' },
resigned: { type: 'info', label: 'page.system.user.resignedStateEnum.resigned' }
};
return <ElTag type={stateMap[state].type}>{$t(stateMap[state].label)}</ElTag>;
@@ -323,7 +323,7 @@ const {columns, columnChecks, data, loading, getDataByPage, mobilePagination} =
async function loadDeptTree() {
deptLoading.value = true;
const {error, data: deptItems} = await fetchGetDeptList({
const { error, data: deptItems } = await fetchGetDeptList({
status: 0
});
@@ -425,7 +425,7 @@ function openOrgLeader(row: Api.SystemManage.Dept) {
}
async function handleDeleteDeptAction(row: Api.SystemManage.Dept) {
const {error} = await fetchDeleteDept(row.id);
const { error } = await fetchDeleteDept(row.id);
if (error) {
return;
@@ -450,7 +450,7 @@ async function handleDeleteAction(row: Api.SystemManage.User) {
return;
}
const {error} = await fetchDeleteUser(row.id);
const { error } = await fetchDeleteUser(row.id);
if (error) {
return;
@@ -469,7 +469,7 @@ async function updateUserResignedAt(userId: number, value: number | null) {
const user = detailResult.data;
const {error} = await fetchUpdateUser({
const { error } = await fetchUpdateUser({
id: userId,
username: user.username,
nickname: user.nickname ?? null,
@@ -521,7 +521,7 @@ async function handleBatchDelete() {
return;
}
const {error} = await fetchBatchDeleteUser(userCheckedRowKeys.value);
const { error } = await fetchBatchDeleteUser(userCheckedRowKeys.value);
if (error) {
return;
@@ -534,7 +534,7 @@ async function handleBatchDelete() {
async function handleToggleStatus(row: Api.SystemManage.User, enabled: boolean) {
statusLoadingIds.value = [...statusLoadingIds.value, row.id];
const {error} = await fetchUpdateUserStatus({
const { error } = await fetchUpdateUserStatus({
id: row.id,
status: enabled ? 0 : 1
});
@@ -643,13 +643,13 @@ onMounted(async () => {
<template #default>
<ElButton plain type="primary" :disabled="!currentDept" @click="openAdd">
<template #icon>
<icon-ic-round-plus class="text-icon"/>
<icon-ic-round-plus class="text-icon" />
</template>
{{ $t('common.add') }}
</ElButton>
<ElButton plain type="primary" :disabled="!currentDept" @click="userManagementRelationVisible = true">
<template #icon>
<icon-ic-round-plus class="text-icon"/>
<icon-ic-round-plus class="text-icon" />
</template>
带人关系
</ElButton>
@@ -657,7 +657,7 @@ onMounted(async () => {
<template #reference>
<ElButton type="danger" plain :disabled="userCheckedRowKeys.length === 0">
<template #icon>
<icon-ic-round-delete class="text-icon"/>
<icon-ic-round-delete class="text-icon" />
</template>
{{ $t('common.batchDelete') }}
</ElButton>
@@ -679,7 +679,7 @@ onMounted(async () => {
:data="data"
@selection-change="handleUserSelectionChange"
>
<ElTableColumn v-for="col in columns" :key="String(col.prop)" v-bind="col"/>
<ElTableColumn v-for="col in columns" :key="String(col.prop)" v-bind="col" />
</ElTable>
</div>
<div class="mt-20px flex justify-end">
@@ -694,7 +694,7 @@ onMounted(async () => {
</template>
<div v-else class="h-full flex items-center justify-center">
<ElEmpty :description="$t('page.system.user.emptyOrg')"/>
<ElEmpty :description="$t('page.system.user.emptyOrg')" />
</div>
</ElCard>
</div>
@@ -733,7 +733,7 @@ onMounted(async () => {
@submitted="handleDeptSubmitted"
/>
<UserOrgLeaderDialog v-model:visible="orgLeaderVisible" :dept="leaderDeptData"/>
<UserOrgLeaderDialog v-model:visible="orgLeaderVisible" :dept="leaderDeptData" />
<BusinessFormDialog
v-model="userManagementRelationVisible"
@@ -742,7 +742,7 @@ onMounted(async () => {
:show-footer="false"
max-body-height="70vh"
>
<UserManagementRelation :fromUserIndex="true" :deptId="currentDeptId"/>
<UserManagementRelation :from-user-index="true" :dept-id="currentDeptId" />
</BusinessFormDialog>
</div>
</template>