GTsoft/ruoyi-plus-soybean
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 完成用户列表

Browse Source
This commit is contained in:
xlsea 2024-09-12 16:16:38 +08:00
parent 0a62e4dcaa
commit 85f6c31878
19 changed files with 618 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
docs/template/typings/soy.api.d.ts.vm vendored
View File

@ -7,7 +7,7 @@
*/
namespace ${ModuleName} {
/** ${businessname} */
type ${BusinessName} = Api.Common.CommonRecord<{
type ${BusinessName} = Common.CommonRecord<{
#foreach($column in $columns)#if(!$BaseEntity.contains($column.javaField))
/** $column.columnComment */
$column.javaField:#if($column.javaField.indexOf("id") != -1 || $column.javaField.indexOf("Id") != -1) CommonType.IdType; #elseif($column.javaType == 'Long' || $column.javaType == 'Integer' || $column.javaType == 'Double' || $column.javaType == 'Float' || $column.javaType == 'BigDecimal') number; #elseif($column.javaType == 'Boolean') boolean; #else string; #end
@ -15,7 +15,7 @@ namespace ${ModuleName} {
}>;
/** ${businessname} search params */
type ${BusinessName}SearchParams = Api.CommonType.RecordNullable<
type ${BusinessName}SearchParams = CommonType.RecordNullable<
Pick<
Api.${ModuleName}.${BusinessName},
#foreach($column in $columns)
@ -24,11 +24,11 @@ namespace ${ModuleName} {
#end
#end
> &
Api.Common.CommonSearchParams<${BusinessName}>
Api.Common.CommonSearchParams
>;
/** ${businessname} operate params */
type ${BusinessName}OperateParams = Api.CommonType.RecordNullable<
type ${BusinessName}OperateParams = CommonType.RecordNullable<
Pick<
Api.${ModuleName}.${BusinessName},
#foreach($column in $columns)

16
src/components/advanced/table-header-operation.vue
View File

@ -11,18 +11,21 @@ interface Props {
loading?: boolean;
showAdd?: boolean;
showDelete?: boolean;
showExport?: boolean;
}
withDefaults(defineProps<Props>(), {
itemAlign: undefined,
showAdd: true,
showDelete: true
showDelete: true,
showExport: false
});
interface Emits {
(e: 'add'): void;
(e: 'delete'): void;
(e: 'refresh'): void;
(e: 'export'): void;
}
const emit = defineEmits<Emits>();
@ -42,6 +45,10 @@ function batchDelete() {
function refresh() {
emit('refresh');
}
function handleExport() {
emit('export');
}
</script>
<template>
@ -65,7 +72,14 @@ function refresh() {
</template>
{{ $t('common.confirmDelete') }}
</NPopconfirm>
<NButton v-if="showExport" size="small" ghost type="warning" @click="handleExport">
<template #icon>
<icon-ic-round-download class="text-icon" />
</template>
导出
</NButton>
</slot>
<slot name="after"></slot>
<NButton size="small" @click="refresh">
<template #icon>
<icon-mdi-refresh class="text-icon" :class="{ 'animate-spin': loading }" />

60
src/components/custom/post-select.vue Normal file
View File

@ -0,0 +1,60 @@
<script setup lang="ts">
import { useLoading } from '@sa/hooks';
import type { SelectProps } from 'naive-ui';
import { ref, useAttrs, watch } from 'vue';
import { fetchGetPostSelect } from '@/service/api/system';
defineOptions({
name: 'PostSelect'
});
interface Props {
deptId?: string;
[key: string]: any;
}
const props = defineProps<Props>();
const value = defineModel<string | null>('value', { required: true });
const attrs: SelectProps = useAttrs();
const { loading: roleLoading, startLoading: startRoleLoading, endLoading: endRoleLoading } = useLoading();
/** the enabled role options */
const roleOptions = ref<CommonType.Option<CommonType.IdType>[]>([]);
watch(
() => props.deptId,
() => {
if (!props.deptId) return;
getRoleOptions();
},
{ immediate: true }
);
async function getRoleOptions() {
startRoleLoading();
const { error, data } = await fetchGetPostSelect(props.deptId);
if (!error) {
roleOptions.value = data.map(item => ({
label: item.postName,
value: item.postId
}));
}
endRoleLoading();
}
</script>
<template>
<NSelect
v-model:value="value"
:loading="roleLoading"
:options="roleOptions"
v-bind="attrs"
placeholder="请选择岗位"
/>
</template>
<style scoped></style>

52
src/components/custom/role-select.vue Normal file
View File

@ -0,0 +1,52 @@
<script setup lang="ts">
import { useLoading } from '@sa/hooks';
import type { SelectProps } from 'naive-ui';
import { ref, useAttrs } from 'vue';
import { fetchGetRoleSelect } from '@/service/api/system';
defineOptions({
name: 'RoleSelect'
});
interface Props {
[key: string]: any;
}
defineProps<Props>();
const value = defineModel<string | null>('value', { required: true });
const attrs: SelectProps = useAttrs();
const { loading: roleLoading, startLoading: startRoleLoading, endLoading: endRoleLoading } = useLoading();
/** the enabled role options */
const roleOptions = ref<CommonType.Option<CommonType.IdType>[]>([]);
async function getRoleOptions() {
startRoleLoading();
const { error, data } = await fetchGetRoleSelect();
if (!error) {
roleOptions.value = data.map(item => ({
label: item.roleName,
value: item.roleId
}));
}
endRoleLoading();
}
getRoleOptions();
</script>
<template>
<NSelect
v-model:value="value"
:loading="roleLoading"
:options="roleOptions"
v-bind="attrs"
placeholder="请选择角色"
/>
</template>
<style scoped></style>

1
src/hooks/common/form.ts
View File

@ -48,6 +48,7 @@ export function useFormRules() {
function createRequiredRule(message: string): App.Global.FormRule {
return {
required: true,
trigger: ['change', 'blur'],
message
};
}

36
src/service/api/system/dept.ts Normal file
View File

@ -0,0 +1,36 @@
import { request } from '@/service/request';
/** 获取部门列表 */
export function fetchGetDeptList(params?: Api.System.DeptSearchParams) {
return request<Api.System.DeptList>({
url: '/system/dept/list',
method: 'get',
params
});
}
/** 新增部门 */
export function fetchCreateDept(data: Api.System.DeptOperateParams) {
return request<boolean>({
url: '/system/dept',
method: 'post',
data
});
}
/** 修改部门 */
export function fetchUpdateDept(data: Api.System.DeptOperateParams) {
return request<boolean>({
url: '/system/dept',
method: 'put',
data
});
}
/** 批量删除部门 */
export function fetchDeleteDept(deptIds: CommonType.IdType[]) {
return request<boolean>({
url: `/system/dept/${deptIds.join(',')}`,
method: 'delete'
});
}

3
src/service/api/system/index.ts
View File

@ -1,3 +1,6 @@
export * from './menu';
export * from './dict';
export * from './user';
export * from './dept';
export * from './role';
export * from './post';

45
src/service/api/system/post.ts Normal file
View File

@ -0,0 +1,45 @@
import { request } from '@/service/request';
/** 获取岗位信息列表 */
export function fetchGetPostList(params?: Api.System.PostSearchParams) {
return request<Api.System.PostList>({
url: '/system/post/list',
method: 'get',
params
});
}
/** 新增岗位信息 */
export function fetchCreatePost(data: Api.System.PostOperateParams) {
return request<boolean>({
url: '/system/post',
method: 'post',
data
});
}
/** 修改岗位信息 */
export function fetchUpdatePost(data: Api.System.PostOperateParams) {
return request<boolean>({
url: '/system/post',
method: 'put',
data
});
}
/** 批量删除岗位信息 */
export function fetchDeletePost(postIds: CommonType.IdType[]) {
return request<boolean>({
url: `/system/post/${postIds.join(',')}`,
method: 'delete'
});
}
/** 获取岗位选择框列表 */
export function fetchGetPostSelect(deptId?: CommonType.IdType, postIds?: CommonType.IdType[]) {
return request<Api.System.Post[]>({
url: '/system/post/optionselect',
method: 'get',
params: { postIds, deptId }
});
}

45
src/service/api/system/role.ts Normal file
View File

@ -0,0 +1,45 @@
import { request } from '@/service/request';
/** 获取角色信息列表 */
export function fetchGetRoleList(params?: Api.System.RoleSearchParams) {
return request<Api.System.RoleList>({
url: '/system/role/list',
method: 'get',
params
});
}
/** 新增角色信息 */
export function fetchCreateRole(data: Api.System.RoleOperateParams) {
return request<boolean>({
url: '/system/role',
method: 'post',
data
});
}
/** 修改角色信息 */
export function fetchUpdateRole(data: Api.System.RoleOperateParams) {
return request<boolean>({
url: '/system/role',
method: 'put',
data
});
}
/** 批量删除角色信息 */
export function fetchDeleteRole(roleIds: CommonType.IdType[]) {
return request<boolean>({
url: `/system/role/${roleIds.join(',')}`,
method: 'delete'
});
}
/** 获取角色选择框列表 */
export function fetchGetRoleSelect(roleIds?: CommonType.IdType[]) {
return request<Api.System.Role[]>({
url: '/system/role/optionselect',
method: 'get',
params: { roleIds }
});
}

16
src/service/api/system/user.ts
View File

@ -34,3 +34,19 @@ export function fetchBatchDeleteUser(userIds: CommonType.IdType[]) {
method: 'delete'
});
}
/** 根据用户编号获取详细信息 */
export function fetchGetUserInfo(userId?: CommonType.IdType) {
return request<Api.System.UserInfo>({
url: `/system/user/${userId}`,
method: 'get'
});
}
/** 获取部门树列表 */
export function fetchGetDeptTree() {
return request<Api.Common.CommonTreeRecord>({
url: '/system/user/deptTree',
method: 'get'
});
}

14
src/typings/api/api.d.ts vendored
View File

@ -70,6 +70,20 @@ declare namespace Api {
/** record tenant id */
tenantId: string;
} & CommonRecord<T>;
/** common tree record */
type CommonTreeRecord = {
/** record id */
id: CommonType.IdType;
/** record parent id */
parentId: CommonType.IdType;
/** record label */
label: string;
/** record weight */
weight: number;
/** record children */
children: CommonTreeRecord[];
}[];
}
/**

111
src/typings/api/system.api.d.ts vendored
View File

@ -38,7 +38,23 @@ declare namespace Api {
/** role search params */
type RoleSearchParams = CommonType.RecordNullable<
Pick<Role, 'roleName' | 'roleKey' | 'status'> & Common.CommonSearchParams
Pick<Api.System.Role, 'roleName' | 'roleKey' | 'status'> & Api.Common.CommonSearchParams
>;
/** role operate params */
type RoleOperateParams = CommonType.RecordNullable<
Pick<
Api.System.Role,
| 'roleId'
| 'roleName'
| 'roleKey'
| 'roleSort'
| 'dataScope'
| 'menuCheckStrictly'
| 'deptCheckStrictly'
| 'status'
| 'remark'
>
>;
/** role list */
@ -81,8 +97,6 @@ declare namespace Api {
password: string;
/** 帐号状态（0正常 1停用） */
status: string;
/** 删除标志（0代表存在 2代表删除） */
delFlag: string;
/** 最后登录IP */
loginIp: string;
/** 最后登录时间 */
@ -110,9 +124,17 @@ declare namespace Api {
| 'password'
| 'status'
| 'remark'
> & { roleIds: string[] }
> & { roleIds: CommonType.IdType[]; postIds: CommonType.IdType[] }
>;
/** user info */
type UserInfo = {
/** user post ids */
postIds: string[];
/** user role ids */
roleIds: string[];
};
/** user list */
type UserList = Common.PaginatingQueryRecord<User>;
@ -274,5 +296,86 @@ declare namespace Api {
/** 备注 */
remark: string;
}>;
/** dept */
type Dept = Api.Common.CommonRecord<{
/** 部门id */
deptId: CommonType.IdType;
/** 租户编号 */
tenantId: CommonType.IdType;
/** 父部门id */
parentId: CommonType.IdType;
/** 祖级列表 */
ancestors: string;
/** 部门名称 */
deptName: string;
/** 部门类别编码 */
deptCategory: string;
/** 显示顺序 */
orderNum: number;
/** 负责人 */
leader: number;
/** 联系电话 */
phone: string;
/** 邮箱 */
email: string;
/** 部门状态（0正常 1停用） */
status: string;
}>;
/** dept search params */
type DeptSearchParams = CommonType.RecordNullable<
Pick<Api.System.Dept, 'parentId' | 'deptName' | 'deptCategory' | 'status'> & Api.Common.CommonSearchParams
>;
/** dept operate params */
type DeptOperateParams = CommonType.RecordNullable<
Pick<
Api.System.Dept,
'deptId' | 'parentId' | 'deptName' | 'deptCategory' | 'orderNum' | 'leader' | 'phone' | 'email' | 'status'
>
>;
/** dept list */
type DeptList = Api.Common.PaginatingQueryRecord<Dept>;
/** post */
type Post = Common.CommonRecord<{
/** 岗位ID */
postId: CommonType.IdType;
/** 租户编号 */
tenantId: CommonType.IdType;
/** 部门id */
deptId: CommonType.IdType;
/** 岗位编码 */
postCode: string;
/** 类别编码 */
postCategory: string;
/** 岗位名称 */
postName: string;
/** 显示顺序 */
postSort: number;
/** 状态（0正常 1停用） */
status: string;
/** 备注 */
remark: string;
}>;
/** post search params */
type PostSearchParams = CommonType.RecordNullable<
Pick<Api.System.Post, 'deptId' | 'postCode' | 'postCategory' | 'postName' | 'status'> &
Api.Common.CommonSearchParams
>;
/** post operate params */
type PostOperateParams = CommonType.RecordNullable<
Pick<
Api.System.Post,
'postId' | 'deptId' | 'postCode' | 'postCategory' | 'postName' | 'postSort' | 'status' | 'remark'
>
>;
/** post list */
type PostList = Api.Common.PaginatingQueryRecord<Post>;
}
}

7
src/typings/components.d.ts vendored
View File

@ -11,9 +11,10 @@ declare module 'vue' {
BetterScroll: typeof import('./../components/custom/better-scroll.vue')['default']
BooleanTag: typeof import('./../components/custom/boolean-tag.vue')['default']
ButtonIcon: typeof import('./../components/custom/button-icon.vue')['default']
copy: typeof import('./../components/custom/dict-select copy.vue')['default']
copy: typeof import('./../components/custom/role-select copy.vue')['default']
CountTo: typeof import('./../components/custom/count-to.vue')['default']
DarkModeContainer: typeof import('./../components/common/dark-mode-container.vue')['default']
DeptTreeSelect: typeof import('./../components/custom/dept-tree-select.vue')['default']
DictRadio: typeof import('./../components/custom/dict-radio.vue')['default']
DictSelect: typeof import('./../components/custom/dict-select.vue')['default']
DictTag: typeof import('./../components/custom/dict-tag.vue')['default']
@ -22,6 +23,7 @@ declare module 'vue' {
IconAntDesignEnterOutlined: typeof import('~icons/ant-design/enter-outlined')['default']
IconAntDesignReloadOutlined: typeof import('~icons/ant-design/reload-outlined')['default']
IconAntDesignSettingOutlined: typeof import('~icons/ant-design/setting-outlined')['default']
IconEpCopyDocument: typeof import('~icons/ep/copy-document')['default']
IconGridiconsFullscreen: typeof import('~icons/gridicons/fullscreen')['default']
IconGridiconsFullscreenExit: typeof import('~icons/gridicons/fullscreen-exit')['default']
'IconIc:roundPlus': typeof import('~icons/ic/round-plus')['default']
@ -49,6 +51,7 @@ declare module 'vue' {
MenuToggler: typeof import('./../components/common/menu-toggler.vue')['default']
MenuTreeSelect: typeof import('./../components/custom/menu-tree-select.vue')['default']
MonacoEditor: typeof import('./../components/common/monaco-editor.vue')['default']
NA: typeof import('naive-ui')['NA']
NAlert: typeof import('naive-ui')['NAlert']
NBreadcrumb: typeof import('naive-ui')['NBreadcrumb']
NBreadcrumbItem: typeof import('naive-ui')['NBreadcrumbItem']
@ -110,7 +113,9 @@ declare module 'vue' {
NTreeSelect: typeof import('naive-ui')['NTreeSelect']
NWatermark: typeof import('naive-ui')['NWatermark']
PinToggler: typeof import('./../components/common/pin-toggler.vue')['default']
PostSelect: typeof import('./../components/custom/post-select.vue')['default']
ReloadButton: typeof import('./../components/common/reload-button.vue')['default']
RoleSelect: typeof import('./../components/custom/role-select.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
SoybeanAvatar: typeof import('./../components/custom/soybean-avatar.vue')['default']

2
src/utils/service.ts
View File

@ -60,7 +60,7 @@ export function getServiceBaseURL(env: Env.ImportMeta, isProxy: boolean) {
});
return {
baseURL: isProxy ? proxyPattern : baseURL,
baseURL: isProxy ? proxyPattern : baseURL + proxyPattern,
otherBaseURL
};
}

126
src/views/system/user/index.vue
View File

@ -1,6 +1,8 @@
<script setup lang="tsx">
import { NButton, NPopconfirm } from 'naive-ui';
import { fetchBatchDeleteUser, fetchGetUserList } from '@/service/api/system';
import { ref } from 'vue';
import { useLoading } from '@sa/hooks';
import { fetchBatchDeleteUser, fetchGetDeptTree, fetchGetUserList } from '@/service/api/system';
import { $t } from '@/locales';
import { useAppStore } from '@/store/modules/app';
import { useTable, useTableOperate } from '@/hooks/common/table';
@ -143,10 +145,66 @@ async function handleDelete(userId: CommonType.IdType) {
async function edit(userId: CommonType.IdType) {
handleEdit('userId', userId);
}
const { loading: treeLoading, startLoading: startTreeLoading, endLoading: endTreeLoading } = useLoading();
const deptPattern = ref<string>();
const deptData = ref<Api.Common.CommonTreeRecord>([]);
async function getTreeData() {
startTreeLoading();
const { data: tree, error } = await fetchGetDeptTree();
if (!error) {
deptData.value = tree;
}
endTreeLoading();
}
getTreeData();
function handleClickTree(keys: string[]) {
searchParams.deptId = keys.length ? keys[0] : null;
checkedRowKeys.value = [];
getDataByPage();
}
function handleResetTreeData() {
deptPattern.value = undefined;
getTreeData();
}
</script>
<template>
<TableSiderLayout sider-title="部门列表">
<template #header-extra>
<NButton size="small" text class="h-18px" @click.stop="() => handleResetTreeData()">
<template #icon>
<SvgIcon icon="ic:round-refresh" />
</template>
</NButton>
</template>
<template #sider>
<NInput v-model:value="deptPattern" clearable :placeholder="$t('common.keywordSearch')" />
<NSpin class="dept-tree" :show="treeLoading">
<NTree
block-node
show-line
:data="deptData as []"
:default-expanded-keys="deptData?.length ? [deptData[0].id!] : []"
:show-irrelevant-nodes="false"
:pattern="deptPattern"
block-line
class="infinite-scroll h-full min-h-200px py-3"
key-field="id"
label-field="label"
virtual-scroll
@update:selected-keys="handleClickTree"
>
<template #empty>
<NEmpty description="暂无部门信息" class="h-full min-h-200px justify-center" />
</template>
</NTree>
</NSpin>
</template>
<div class="h-full flex-col-stretch gap-12px overflow-hidden lt-sm:overflow-auto">
<UserSearch v-model:model="searchParams" @reset="resetSearchParams" @search="getDataByPage" />
<TableRowCheckAlert v-model:checked-row-keys="checkedRowKeys" />
@ -178,6 +236,7 @@ async function edit(userId: CommonType.IdType) {
v-model:visible="drawerVisible"
:operate-type="operateType"
:row-data="editingData"
:dept-data="deptData"
@submitted="getDataByPage"
/>
</NCard>
@ -185,4 +244,67 @@ async function edit(userId: CommonType.IdType) {
</TableSiderLayout>
</template>
<style scoped></style>
<style scoped lang="scss">
.dept-tree {
.n-button {
--n-padding: 8px !important;
}
:deep(.n-tree__empty) {
height: 100%;
justify-content: center;
}
:deep(.n-spin-content) {
height: 100%;
}
:deep(.infinite-scroll) {
height: calc(100vh - 228px - var(--calc-footer-height, 0px)) !important;
max-height: calc(100vh - 228px - var(--calc-footer-height, 0px)) !important;
}
@media screen and (max-width: 1024px) {
:deep(.infinite-scroll) {
height: calc(100vh - 227px - var(--calc-footer-height, 0px)) !important;
max-height: calc(100vh - 227px - var(--calc-footer-height, 0px)) !important;
}
}
:deep(.n-tree-node) {
height: 33px;
}
:deep(.n-tree-node-switcher) {
height: 33px;
}
:deep(.n-tree-node-switcher__icon) {
font-size: 16px !important;
height: 16px !important;
width: 16px !important;
}
}
:deep(.n-data-table-wrapper),
:deep(.n-data-table-base-table),
:deep(.n-data-table-base-table-body) {
height: 100%;
}
@media screen and (max-width: 800px) {
:deep(.n-data-table-base-table-body) {
max-height: calc(100vh - 400px - var(--calc-footer-height, 0px));
}
}
@media screen and (max-width: 802px) {
:deep(.n-data-table-base-table-body) {
max-height: calc(100vh - 473px - var(--calc-footer-height, 0px));
}
}
:deep(.n-card-header__main) {
min-width: 69px !important;
}
</style>

80
src/views/system/user/modules/user-operate-drawer.vue
View File

@ -1,8 +1,9 @@
<script setup lang="ts">
import { computed, reactive, watch } from 'vue';
import { useLoading } from '@sa/hooks';
import { useFormRules, useNaiveForm } from '@/hooks/common/form';
import { $t } from '@/locales';
import { fetchCreateUser, fetchUpdateUser } from '@/service/api/system';
import { fetchCreateUser, fetchGetUserInfo, fetchUpdateUser } from '@/service/api/system';
defineOptions({
name: 'UserOperateDrawer'
@ -13,6 +14,8 @@ interface Props {
operateType: NaiveUI.TableOperateType;
/** the edit row data */
rowData?: Api.System.User | null;
/** the dept tree data */
deptData?: Api.Common.CommonTreeRecord;
}
const props = defineProps<Props>();
@ -27,8 +30,9 @@ const visible = defineModel<boolean>('visible', {
default: false
});
const { loading: deptLoading, startLoading: startDeptLoading, endLoading: endDeptLoading } = useLoading();
const { formRef, validate, restoreValidation } = useNaiveForm();
const { createRequiredRule } = useFormRules();
const { createRequiredRule, patternRules } = useFormRules();
const title = computed(() => {
const titles: Record<NaiveUI.TableOperateType, string> = {
@ -51,20 +55,31 @@ function createDefaultModel(): Model {
phonenumber: '',
sex: '',
password: '',
status: '',
status: '0',
roleIds: [],
postIds: [],
remark: ''
};
}
type RuleKey = Extract<keyof Model, 'userName' | 'nickName' | 'password' | 'status'>;
type RuleKey = Extract<keyof Model, 'userName' | 'nickName' | 'password' | 'status' | 'phonenumber'>;
const rules: Record<RuleKey, App.Global.FormRule> = {
userName: createRequiredRule('用户名称不能为空'),
nickName: createRequiredRule('用户昵称不能为空'),
password: createRequiredRule('密码不能为空'),
status: createRequiredRule('帐号状态不能为空')
const rules: Record<RuleKey, App.Global.FormRule[]> = {
userName: [createRequiredRule('用户名称不能为空')],
nickName: [createRequiredRule('用户昵称不能为空')],
password: [createRequiredRule('密码不能为空'), patternRules.pwd],
phonenumber: [patternRules.phone],
status: [createRequiredRule('帐号状态不能为空')]
};
async function getUserInfo() {
const { error, data } = await fetchGetUserInfo(props.rowData?.userId);
if (!error) {
model.roleIds = data.roleIds;
model.postIds = data.postIds;
}
}
function handleUpdateModelWhenEdit() {
if (props.operateType === 'add') {
Object.assign(model, createDefaultModel());
@ -72,7 +87,10 @@ function handleUpdateModelWhenEdit() {
}
if (props.operateType === 'edit' && props.rowData) {
startDeptLoading();
Object.assign(model, props.rowData);
getUserInfo();
endDeptLoading();
}
}
@ -134,26 +152,46 @@ watch(visible, () => {
<NDrawer v-model:show="visible" :title="title" display-directive="show" :width="800" class="max-w-90%">
<NDrawerContent :title="title" :native-scrollbar="false" closable>
<NForm ref="formRef" :model="model" :rules="rules">
<NFormItem label="部门" path="deptId">
<!-- <NInput v-model:value="model.deptId" placeholder="请输入部门" /> -->
</NFormItem>
<NFormItem label="用户名称" path="userName">
<NInput v-model:value="model.userName" placeholder="请输入用户名称" />
</NFormItem>
<NFormItem label="用户昵称" path="nickName">
<NInput v-model:value="model.nickName" placeholder="请输入用户昵称" />
</NFormItem>
<NFormItem label="用户邮箱" path="email">
<NInput v-model:value="model.email" placeholder="请输入用户邮箱" />
<NFormItem label="归属部门" path="deptId">
<NTreeSelect
v-model:value="model.deptId"
:loading="deptLoading"
clearable
:options="deptData as []"
label-field="label"
key-field="id"
:default-expanded-keys="deptData?.length ? [deptData[0].id] : []"
placeholder="请选择归属部门"
/>
</NFormItem>
<NFormItem label="手机号码" path="phonenumber">
<NInput v-model:value="model.phonenumber" placeholder="请输入手机号码" />
</NFormItem>
<NFormItem label="用户性别" path="sex">
<DictRadio v-model:value="model.sex" dict-code="sys_user_sex" />
<NFormItem label="邮箱" path="email">
<NInput v-model:value="model.email" placeholder="请输入邮箱" />
</NFormItem>
<NFormItem label="密码" path="password">
<NInput v-model:value="model.password" placeholder="请输入密码" />
<NFormItem v-if="operateType === 'add'" label="用户名称" path="userName">
<NInput v-model:value="model.userName" placeholder="请输入用户名称" />
</NFormItem>
<NFormItem v-if="operateType === 'add'" label="用户密码" path="password">
<NInput
v-model:value="model.password"
type="password"
show-password-on="click"
placeholder="请输入用户密码"
/>
</NFormItem>
<NFormItem label="用户性别" path="sex">
<DictRadio v-model:value="model.sex" dict-code="sys_user_sex" placeholder="请选择用户性别" />
</NFormItem>
<NFormItem label="岗位" path="postIds">
<PostSelect v-model:value="model.postIds" :dept-id="model.deptId" multiple clearable />
</NFormItem>
<NFormItem label="角色" path="roleIds">
<RoleSelect v-model:value="model.roleIds" multiple clearable />
</NFormItem>
<NFormItem label="状态" path="status">
<DictRadio v-model:value="model.status" dict-code="sys_normal_disable" />

2
src/views/tool/gen/index.vue
View File

@ -241,7 +241,7 @@ getDataNames();
@reset="resetSearchParams"
@search="getDataByPage"
/>
<TableColumnCheckAlert v-model:columns="checkedRowKeys" />
<TableRowCheckAlert v-model:checked-row-keys="checkedRowKeys" />
<NCard title="代码生成" :bordered="false" size="small" class="sm:flex-1-hidden card-wrapper">
<template #header-extra>
<TableHeaderOperation

4
src/views/tool/gen/modules/gen-table-import-drawer.vue
View File

@ -34,7 +34,7 @@ const { columns, data, getData, getDataByPage, loading, mobilePagination, search
showTotal: true,
apiParams: {
pageNum: 1,
pageSize: 15,
pageSize: 30,
// if you want to use the searchParams in Form, you need to define the following properties, and the value is null
// the value can not be undefined, otherwise the property in Form will not be reactive
dataName: null,
@ -102,7 +102,7 @@ watch(visible, () => {
@reset="resetSearchParams"
@search="getDataByPage"
/>
<TableColumnCheckAlert v-model:columns="checkedRowKeys" class="mb-16px" />
<TableRowCheckAlert v-model:checked-row-keys="checkedRowKeys" class="mb-16px" />
<NDataTable
v-model:checked-row-keys="checkedRowKeys"
:columns="columns"

27
src/views/tool/gen/modules/gen-table-preview-drawer.vue
View File

@ -1,6 +1,7 @@
<script setup lang="ts">
import { useLoading } from '@sa/hooks';
import { ref, watch } from 'vue';
import { useClipboard } from '@vueuse/core';
import { fetchGetGenPreview } from '@/service/api/tool';
import MonacoEditor from '@/components/common/monaco-editor.vue';
@ -51,6 +52,24 @@ async function handleSubmit() {
emit('submitted');
}
const { copy, isSupported } = useClipboard();
async function handleCopyCode() {
if (!isSupported) {
window.$message?.error('您的浏览器不支持Clipboard API');
return;
}
const code = previewData.value[tab.value];
if (!previewData.value[tab.value]) {
return;
}
await copy(code);
window.$message?.success('代码复制成功');
}
watch(visible, () => {
if (visible.value) {
previewData.value = {};
@ -117,6 +136,14 @@ function getGenLanguage(name: string) {
:language="getGenLanguage(genMap[tab])"
height="calc(100vh - 162px)"
/>
<div class="position-absolute right-42px top-2px">
<NButton text :focusable="false" class="flex-center" @click="handleCopyCode">
<template #icon>
<icon-ep-copy-document class="text-14px" />
</template>
<span>复制</span>
</NButton>
</div>
</div>
</NSpin>
<template #footer>