diff --git a/packages/toolkits/pro/template/server/nestJs/libs/models/src/user.ts b/packages/toolkits/pro/template/server/nestJs/libs/models/src/user.ts
index e7e0c235..5e36db27 100644
--- a/packages/toolkits/pro/template/server/nestJs/libs/models/src/user.ts
+++ b/packages/toolkits/pro/template/server/nestJs/libs/models/src/user.ts
@@ -29,6 +29,24 @@ export class User {
   @ManyToMany(() => Role)
   @JoinTable({ name: 'user_role' })
   role: Role[];
+  @Column({nullable: true})
+  department: string;
+  @Column({nullable: true})
+  employeeType: string;
+  @Column({type: 'timestamp',nullable: true})
+  probationStart: string;
+  @Column({type: 'timestamp',nullable: true})
+  probationEnd: string;
+  @Column({nullable: true})
+  probationDuration: string;
+  @Column({type: 'timestamp',nullable: true})
+  protocolStart: string;
+  @Column({type: 'timestamp',nullable: true})
+  protocolEnd: string;
+  @Column({nullable: true})
+  address: string;
+  @Column({nullable: true})
+  status: number;
   @CreateDateColumn()
   createTime: Date;
   @UpdateDateColumn()
diff --git a/packages/toolkits/pro/template/server/nestJs/src/app.module.ts b/packages/toolkits/pro/template/server/nestJs/src/app.module.ts
index ffe940c1..755b153c 100644
--- a/packages/toolkits/pro/template/server/nestJs/src/app.module.ts
+++ b/packages/toolkits/pro/template/server/nestJs/src/app.module.ts
@@ -111,7 +111,8 @@ export class AppModule implements OnModuleInit {
         email: 'admin@no-reply.com',
         password: 'admin',
         roleIds: [role.id],
-        username: 'admin',
+        name: 'admin',
+        status: 1,
       },
       isInit
     );
diff --git a/packages/toolkits/pro/template/server/nestJs/src/user/dto/create-user.dto.ts b/packages/toolkits/pro/template/server/nestJs/src/user/dto/create-user.dto.ts
index c4d34b34..f63cc3e0 100644
--- a/packages/toolkits/pro/template/server/nestJs/src/user/dto/create-user.dto.ts
+++ b/packages/toolkits/pro/template/server/nestJs/src/user/dto/create-user.dto.ts
@@ -4,7 +4,7 @@ export class CreateUserDto {
   @IsNotEmpty({
     message: '用户名不能为空',
   })
-  username: string;
+  name: string;
   @IsNotEmpty({
     message: '邮箱不能为空',
   })
@@ -14,4 +14,13 @@ export class CreateUserDto {
   })
   password: string;
   roleIds: number[] = [];
+  department?: string;
+  employeeType?: string;
+  probationStart?: string;
+  probationEnd?: string;
+  probationDuration?: string;
+  protocolStart?: string;
+  protocolEnd?: string;
+  address?: string;
+  status?: number;
 }
diff --git a/packages/toolkits/pro/template/server/nestJs/src/user/dto/update-pwd-admin.dto.ts b/packages/toolkits/pro/template/server/nestJs/src/user/dto/update-pwd-admin.dto.ts
new file mode 100644
index 00000000..c870eac0
--- /dev/null
+++ b/packages/toolkits/pro/template/server/nestJs/src/user/dto/update-pwd-admin.dto.ts
@@ -0,0 +1,12 @@
+import { PartialType } from '@nestjs/mapped-types';
+import { CreateUserDto } from './create-user.dto';
+import { IsNotEmpty } from 'class-validator';
+
+export class UpdatePwdAdminDto extends PartialType(CreateUserDto) {
+  email: string;
+  @IsNotEmpty({
+    message: '新密码不能为空',
+  })
+  newPassword: string;
+  confirmNewPassword?: string;
+}
diff --git a/packages/toolkits/pro/template/server/nestJs/src/user/dto/update-pwd-user.dto.ts b/packages/toolkits/pro/template/server/nestJs/src/user/dto/update-pwd-user.dto.ts
new file mode 100644
index 00000000..dd678f10
--- /dev/null
+++ b/packages/toolkits/pro/template/server/nestJs/src/user/dto/update-pwd-user.dto.ts
@@ -0,0 +1,16 @@
+import { PartialType } from '@nestjs/mapped-types';
+import { CreateUserDto } from './create-user.dto';
+import { IsNotEmpty } from 'class-validator';
+
+export class UpdatePwdUserDto extends PartialType(CreateUserDto) {
+  email: string;
+  token: string;
+  @IsNotEmpty({
+    message: '新密码不能为空',
+  })
+  newPassword: string;
+  @IsNotEmpty({
+    message: '旧密码不能为空',
+  })
+  oldPassword?: string;
+}
diff --git a/packages/toolkits/pro/template/server/nestJs/src/user/dto/update-user.dto.ts b/packages/toolkits/pro/template/server/nestJs/src/user/dto/update-user.dto.ts
index dd83a3aa..2667c320 100644
--- a/packages/toolkits/pro/template/server/nestJs/src/user/dto/update-user.dto.ts
+++ b/packages/toolkits/pro/template/server/nestJs/src/user/dto/update-user.dto.ts
@@ -3,12 +3,54 @@ import { CreateUserDto } from './create-user.dto';
 import { IsNotEmpty } from 'class-validator';
 
 export class UpdateUserDto extends PartialType(CreateUserDto) {
+  oldPassword: string;
+  newPassword: string;
   @IsNotEmpty({
-    message: '旧密码不能为空',
+    message: '邮箱不能为空',
   })
-  oldPassword: string;
+  email: string;
   @IsNotEmpty({
-    message: '新密码不能为空',
+    message: '职业不能为空',
   })
-  newPassword: string;
+  roleIds: number[] = [];
+  @IsNotEmpty({
+    message: '部门不能为空',
+  })
+  department: string;
+  @IsNotEmpty({
+    message: '招聘类型不能为空',
+  })
+  employeeType: string;
+  @IsNotEmpty({
+    message: '试用起始日期不能为空',
+  })
+  probationStart: string;
+  @IsNotEmpty({
+    message: '试用结束日期不能为空',
+  })
+  probationEnd: string;
+  @IsNotEmpty({
+    message: '试用期时长不能为空',
+  })
+  probationDuration: string;
+  @IsNotEmpty({
+    message: '合同起始日期不能为空',
+  })
+  protocolStart: string;
+  @IsNotEmpty({
+    message: '试用结束日期不能为空',
+  })
+  protocolEnd: string;
+  @IsNotEmpty({
+    message: '地址不能为空',
+  })
+  address: string;
+  @IsNotEmpty({
+    message: '状态不能为空',
+  })
+  status: number;
+  @IsNotEmpty({
+    message: '用户名不能为空',
+  })
+  name: string;
 }
diff --git a/packages/toolkits/pro/template/server/nestJs/src/user/user.controller.ts b/packages/toolkits/pro/template/server/nestJs/src/user/user.controller.ts
index 6f325945..297bd2bf 100644
--- a/packages/toolkits/pro/template/server/nestJs/src/user/user.controller.ts
+++ b/packages/toolkits/pro/template/server/nestJs/src/user/user.controller.ts
@@ -13,7 +13,9 @@ import { UserService } from './user.service';
 import { CreateUserDto } from './dto/create-user.dto';
 import { Permission } from '../public/permission.decorator';
 import { UpdateUserDto } from './dto/update-user.dto';
-import { PaginationQueryDto } from './dto/pagination-query.dto'
+import { PaginationQueryDto } from './dto/pagination-query.dto';
+import {UpdatePwdAdminDto} from "./dto/update-pwd-admin.dto";
+import {UpdatePwdUserDto} from "./dto/update-pwd-user.dto";
 
 @Controller('user')
 export class UserController {
@@ -35,7 +37,7 @@ export class UserController {
   @Patch('/update')
   @Permission('user::update')
   async UpdateUser(@Body() body: UpdateUserDto) {
-    return this.userService.updateUserPwd(body);
+    return this.userService.updateUserInfo(body);
   }
   @Get()
   @Permission('user::query')
@@ -44,4 +46,16 @@ export class UserController {
   ) {
     return this.userService.getAllUser(paginationQuery);
   }
+
+  @Patch('/admin/updatePwd')
+  @Permission('user::password::force-update')
+  async updatePwdAdmin(@Body() body: UpdatePwdAdminDto) {
+    return this.userService.updatePwdAdmin(body);
+  }
+
+  @Patch('/updatePwd')
+  @Permission('user::update')
+  async updatePwdUser(@Body() body: UpdatePwdUserDto) {
+    return this.userService.updatePwdUser(body);
+  }
 }
diff --git a/packages/toolkits/pro/template/server/nestJs/src/user/user.service.ts b/packages/toolkits/pro/template/server/nestJs/src/user/user.service.ts
index eb0a064b..69dfeead 100644
--- a/packages/toolkits/pro/template/server/nestJs/src/user/user.service.ts
+++ b/packages/toolkits/pro/template/server/nestJs/src/user/user.service.ts
@@ -1,13 +1,15 @@
-import { HttpException, HttpStatus, Injectable } from '@nestjs/common';
-import { CreateUserDto } from './dto/create-user.dto';
-import { UpdateUserDto } from './dto/update-user.dto';
-import { PaginationQueryDto } from "./dto/pagination-query.dto";
-import { InjectRepository } from '@nestjs/typeorm';
-import { Role, User } from '@app/models';
-import { In, Repository } from 'typeorm';
+import {HttpException, HttpStatus, Injectable} from '@nestjs/common';
+import {CreateUserDto} from './dto/create-user.dto';
+import {UpdateUserDto} from './dto/update-user.dto';
+import {PaginationQueryDto} from "./dto/pagination-query.dto";
+import {UpdatePwdAdminDto} from "./dto/update-pwd-admin.dto";
+import {UpdatePwdUserDto} from "./dto/update-pwd-user.dto";
+import {InjectRepository} from '@nestjs/typeorm';
+import {Role, User} from '@app/models';
+import {In, Repository} from 'typeorm';
 import * as crypto from 'crypto';
-import { AuthService } from '../auth/auth.service';
-import { paginate, IPaginationOptions } from 'nestjs-typeorm-paginate';
+import {AuthService} from '../auth/auth.service';
+import {paginate, IPaginationOptions} from 'nestjs-typeorm-paginate';
 import * as process from "process";
 
 @Injectable()
@@ -17,10 +19,16 @@ export class UserService {
     private userRep: Repository<User>,
     @InjectRepository(Role)
     private roleRep: Repository<Role>,
-    private readonly authService: AuthService
-  ) {}
+    private readonly authService: AuthService,
+  ) {
+  }
+
   async create(createUserDto: CreateUserDto, isInit: boolean) {
-    const { email, password, roleIds = [], username } = createUserDto;
+    const {
+      email, password, roleIds = [], name,
+      department, employeeType, probationStart, probationEnd, probationDuration,
+      protocolStart, protocolEnd, address, status
+    } = createUserDto;
     const userInfo = this.getUserInfo(email);
     if (isInit == true && (await userInfo)) {
       return userInfo;
@@ -37,9 +45,18 @@ export class UserService {
       const user = this.userRep.create({
         email,
         password,
-        name: username,
+        name: name,
         role: await roles,
         deleteAt: 0,
+        department: department,
+        employeeType: employeeType,
+        protocolStart: protocolStart,
+        protocolEnd: protocolEnd,
+        probationEnd: probationEnd,
+        probationStart: probationStart,
+        probationDuration: probationDuration,
+        address: address,
+        status: status,
       });
       return this.userRep.save(user);
     } catch (err) {
@@ -52,38 +69,77 @@ export class UserService {
 
   //获取所有用户信息
   async getAllUser(paginationQuery: PaginationQueryDto): Promise<any> {
-    const { page, limit } = paginationQuery; // 从DTO获取分页参数
-    return await paginate<User>(this.userRep, {
+    const {page, limit} = paginationQuery; // 从DTO获取分页参数
+    const relations = ['role', 'role.permission']
+    const result = await paginate<User>(this.userRep, {
       page: Number(page) || Number(process.env.PAGITION_PAGE),
       limit: Number(limit) || Number(process.env.PAGITION_LIMIT),
-    },{
+    }, {
       where: {deleteAt: 0},
-      select: ['id', 'name', 'email', 'createTime', 'updateTime'],
+      select: ['id', 'name', 'email', 'department', 'employeeType', 'protocolStart', 'protocolEnd',
+        'probationEnd', 'probationStart', 'probationDuration', 'address', 'status'],
+      relations,
     });
+    for (const user of result.items) {
+      if (user.probationStart !== null) {
+        user.probationStart = await this.formatDateToDay(new Date(user.probationStart));
+      }
+      if (user.probationEnd !== null) {
+        user.probationEnd = await this.formatDateToDay(new Date(user.probationEnd));
+      }
+      if (user.protocolStart !== null) {
+        user.protocolStart = await this.formatDateToDay(new Date(user.protocolStart));
+      }
+      if (user.protocolEnd !== null) {
+        user.protocolEnd = await this.formatDateToDay(new Date(user.protocolEnd));
+      }
+    }
+    return result;
+  }
+
+  async formatDateToDay(date: {
+    getFullYear: () => any;
+    getMonth: () => number;
+    getDate: () => any;
+  }) {
+    const year = date.getFullYear();
+    const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份是从0开始的
+    const day = String(date.getDate()).padStart(2, '0');
+    return `${year}-${month}-${day}`;
   }
 
   async getUserInfo(email: string, relations: string[] = []) {
-    return await this.userRep.findOne({
-      where: { email, deleteAt: 0 },
+    const user = await this.userRep.findOne({
+      where: {email, deleteAt: 0},
       select: [
-        'id',
-        'name',
-        'email',
-        'createTime',
-        'updateTime',
-        'role',
-        'deleteAt',
+        'id', 'name', 'email', 'department', 'employeeType', 'protocolStart', 'protocolEnd',
+        'probationEnd', 'probationStart', 'probationDuration', 'address', 'status'
       ],
       relations,
     });
+    if (user) {
+      if (user.probationStart !== null) {
+        user.probationStart = await this.formatDateToDay(new Date(user.probationStart));
+      }
+      if (user.probationEnd !== null) {
+        user.probationEnd = await this.formatDateToDay(new Date(user.probationEnd));
+      }
+      if (user.protocolStart !== null) {
+        user.protocolStart = await this.formatDateToDay(new Date(user.protocolStart));
+      }
+      if (user.protocolEnd !== null) {
+        user.protocolEnd = await this.formatDateToDay(new Date(user.protocolEnd));
+      }
+    }
+    return user;
   }
 
   async getUserPermission(token: string, userInfo: User) {
-    const { email } = userInfo;
-    const { role } = (await this.getUserInfo(email, [
+    const {email} = userInfo;
+    const {role} = (await this.getUserInfo(email, [
       'role',
       'role.permission',
-    ])) ?? { role: [] as Role[] };
+    ])) ?? {role: [] as Role[]};
     const permission = role.flatMap((r) => r.permission);
     const permissionNames = permission.map((p) => p.name);
     return [...new Set([...permissionNames])];
@@ -96,6 +152,7 @@ export class UserService {
       .toString('hex');
     return newHash === storedHash;
   }
+
   //修改密码后加密
   async encry(value: string, salt: string) {
     return crypto.pbkdf2Sync(value, salt, 1000, 18, 'sha256').toString('hex');
@@ -111,46 +168,73 @@ export class UserService {
   }
 
   //修改密码
-  async updateUserPwd(updateUserDto: UpdateUserDto) {
-    const { email, newPassword, oldPassword } = updateUserDto;
+  async updatePwdUser(data: UpdatePwdUserDto) {
+    const {email, newPassword, oldPassword,token} = data;
     const user = this.userRep.findOne({
-      where: { email, deleteAt: 0 },
+      where: {email, deleteAt: 0},
       select: [
         'id',
         'name',
         'email',
         'salt',
         'password',
-        'createTime',
-        'updateTime',
-        'role',
-        'deleteAt',
       ],
     });
     if (user) {
-      if (
-        !(await this.verifyPassword(
-          oldPassword,
-          (
-            await user
-          ).password,
-          (
-            await user
-          ).salt
-        ))
-      ) {
+      if (!(await this.verifyPassword(oldPassword, (await user).password, (await user).salt))) {
         throw new HttpException('旧密码错误', HttpStatus.BAD_REQUEST);
       } else {
-        (await user).password = await this.encry(
-          newPassword,
-          (
-            await user
-          ).salt
-        );
+        (await user).password = await this.encry(newPassword, (await user).salt);
         await this.userRep.save(await user);
-        await this.authService.logout(email);
         return;
       }
     }
   }
+
+  async updatePwdAdmin(data: UpdatePwdAdminDto){
+    const {email, newPassword } = data;
+    const user = this.userRep.findOne({
+      where: {email, deleteAt: 0},
+      select: [
+        'id',
+        'name',
+        'email',
+        'salt',
+        'password',
+      ],
+    });
+    if (user) {
+      (await user).password = await this.encry(newPassword, (await user).salt);
+        await this.userRep.save(await user);
+        return;
+    }
+  }
+
+  async updateUserInfo(updateUserDto: UpdateUserDto) {
+    const {
+      email, roleIds, department, employeeType, probationStart, probationEnd,
+      probationDuration, protocolStart, protocolEnd, address, status, name
+    } = updateUserDto;
+    const user = this.getUserInfo(email);
+    const roles = this.roleRep.find({
+      where: {
+        id: In(roleIds),
+      },
+    });
+    if (user) {
+      (await user).name = name;
+      (await user).department = department;
+      (await user).employeeType = employeeType;
+      (await user).probationStart = probationStart;
+      (await user).probationEnd = probationEnd;
+      (await user).probationDuration = probationDuration;
+      (await user).protocolStart = protocolStart;
+      (await user).protocolEnd = protocolEnd;
+      (await user).address = address;
+      (await user).status = status;
+      (await user).role = await roles;
+    }
+    return await this.userRep.save(await user);
+  }
+
 }
diff --git a/packages/toolkits/pro/template/tinyvue/src/api/role.ts b/packages/toolkits/pro/template/tinyvue/src/api/role.ts
new file mode 100644
index 00000000..089039c5
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/api/role.ts
@@ -0,0 +1,7 @@
+import axios from "axios";
+
+
+
+export function getRoles() {
+  return axios.get('/api/role');
+}
diff --git a/packages/toolkits/pro/template/tinyvue/src/api/user.ts b/packages/toolkits/pro/template/tinyvue/src/api/user.ts
index 628e9eb7..8d502da5 100644
--- a/packages/toolkits/pro/template/tinyvue/src/api/user.ts
+++ b/packages/toolkits/pro/template/tinyvue/src/api/user.ts
@@ -50,8 +50,8 @@ export function logout(data: LogoutData) {
 }
 
 // 获取全部用户
-export function getAllUser() {
-  return axios.get<UserInfo>(`/api/user`);
+export function getAllUser(page?: number, limit?: number) {
+  return axios.get<UserInfo>(`/api/user?page=${page}&limit=${limit}`);
 }
 
 // 获取单个用户
@@ -59,18 +59,27 @@ export function getUserInfo(email: string) {
   return axios.get<UserInfo>(`/api/user/info/${email}`);
 }
 
-export function delUser(email: string) {
+export function deleteUser(email: string) {
   return axios.delete<UserInfo>(`/api/user/${email}`);
 }
 
-export function updateUserInfo(data: UserInfo) {
-  return axios.put<UserInfo>(`/api/user/userInfo`, data);
+export function updateUserInfo(data: any) {
+  return axios.patch('/api/user/update', data);
 }
 
 export function getUserData(data?: UserData) {
   return axios.post<UserRes>('/api/user/data', data);
 }
 
-export function registerUser(data: LoginData) {
-  return axios.post<UserInfo>('/api/user/register', data);
+export function registerUser(data: any) {
+  return axios.post<UserInfo>('/api/user/reg', data);
 }
+
+export function updatePwdAdmin(data: any) {
+  return axios.patch('/api/user/admin/updatePwd', data);
+}
+
+export function updatePwdUser(data: any) {
+  return axios.patch('/api/user/updatePwd', data);
+}
+
diff --git a/packages/toolkits/pro/template/tinyvue/src/components/menu/index.vue b/packages/toolkits/pro/template/tinyvue/src/components/menu/index.vue
index 8e166201..a2fec5b2 100644
--- a/packages/toolkits/pro/template/tinyvue/src/components/menu/index.vue
+++ b/packages/toolkits/pro/template/tinyvue/src/components/menu/index.vue
@@ -33,6 +33,7 @@
     IconUser,
     IconFiletext,
     IconApplication,
+    IconGroup,
   } from '@opentiny/vue-icon';
   import { TreeMenu as tinyTreeMenu } from '@opentiny/vue';
   import router from '@/router';
@@ -48,6 +49,7 @@
   const iconUser = IconUser();
   const iconFiletext = IconFiletext();
   const iconApplication = IconApplication();
+  const iconGroup = IconGroup();
   const tree = ref();
   const expandeArr = ref();
   const routerTitle = [
@@ -189,6 +191,30 @@
       icon: null,
       bold: 'title',
     },
+    {
+      value: 'UserManager',
+      name: 'menu.userManager',
+      icon: iconGroup,
+      bold: 'main-title',
+    },
+    {
+      value: 'AllInfo',
+      name: 'menu.userManager.info',
+      icon: null,
+      bold: 'title',
+    },
+    {
+      value: 'AllSetting',
+      name: 'menu.userManager.setting',
+      icon: null,
+      bold: 'title',
+    },
+    {
+      value: 'UserAdd',
+      name: 'menu.userManager.useradd',
+      icon: null,
+      bold: 'title',
+    },
   ];
 
   // 获取路由数据
@@ -258,6 +284,7 @@
       'Result',
       'User',
       'Cloud',
+      'UserManager',
     ];
     if (filter.indexOf(data.id) === -1) {
       router.push({ name: data.id });
diff --git a/packages/toolkits/pro/template/tinyvue/src/components/navbar/index.vue b/packages/toolkits/pro/template/tinyvue/src/components/navbar/index.vue
index c828b224..3f07cd3e 100644
--- a/packages/toolkits/pro/template/tinyvue/src/components/navbar/index.vue
+++ b/packages/toolkits/pro/template/tinyvue/src/components/navbar/index.vue
@@ -62,35 +62,121 @@
             <iconUser v-if="item.value === 2"></iconUser>
             <iconWriting v-if="item.value === 3"></iconWriting>
             <iconCheckOut v-if="item.value === 4"></iconCheckOut>
+            <iconEdit v-if="item.value === 5"></iconEdit>
             {{ $t(item.label) }}
           </li>
         </div>
       </li>
     </ul>
   </div>
+  <div v-if="state.isPwdUpdate">
+    <tiny-modal
+      v-model="state.isPwdUpdate"
+      :lock-scroll="true"
+      show-header
+      show-footer
+      mask-closable="true"
+      height="350"
+      width="600"
+      :title="$t('userInfo.modal.title.pwdUpdate')"
+    >
+      <template #default>
+        <tiny-layout>
+          <tiny-form
+            :model="state.pwdData"
+            :rules="rules"
+            label-width="150px"
+            :label-align="true"
+            label-position="left"
+            size="small"
+          >
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="10" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userInfo.table.email')"
+                >
+                  <label>{{ userStore.userInfo.email }}</label>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="10" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userInfo.modal.input.oldPassword')"
+                  prop="newPassword"
+                >
+                  <tiny-input v-model="state.pwdData.oldPassword" type="password" show-password></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="10" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userInfo.modal.input.newPassword')"
+                  prop="newPassword"
+                >
+                  <tiny-input v-model="state.pwdData.newPassword" type="password" show-password></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="10" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userInfo.modal.input.confirmNewPassword')"
+                  prop="confirmNewPassword"
+                >
+                  <tiny-input v-model="state.pwdData.confirmNewPassword" type="password" show-password></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+          </tiny-form>
+        </tiny-layout>
+      </template>
+      <template #footer>
+        <tiny-button type="primary" @click="handlePwdUpdateSubmit">确定</tiny-button>
+        <tiny-button @click="handlePwdUpdateCancel">取消</tiny-button>
+      </template>
+    </tiny-modal>
+  </div>
 </template>
 
 <script lang="ts" setup>
-  import { ref } from 'vue';
+import {reactive, ref} from 'vue';
   import { useI18n } from 'vue-i18n';
-  import { UserHead as TinyUserHead, Modal } from '@opentiny/vue';
+  import { UserHead as TinyUserHead,
+    Modal as TinyModal,
+    Button as TinyButton,
+    Form as TinyForm,
+    FormItem as TinyFormItem,
+    Row as TinyRow,
+    Col as TinyCol,
+    Input as TinyInput,
+  } from '@opentiny/vue';
   import {
     IconReplace,
     IconUser,
     IconCheckOut,
     IconWriting,
+    IconEdit,
   } from '@opentiny/vue-icon';
   import { useAppStore, useUserStore } from '@/store';
   import router from '@/router';
   import { LOCALE_OPTIONS } from '@/locale';
   import useLocale from '@/hooks/locale';
   import useUser from '@/hooks/user';
+import {getToken} from '@/utils/auth';
+import {updatePwdUser} from "@/api/user";
 
   const i18 = useI18n();
+  const {t} = useI18n();
   const iconReplace = IconReplace();
   const iconUser = IconUser();
   const iconCheckOut = IconCheckOut();
   const iconWriting = IconWriting();
+  const iconEdit = IconEdit();
   const lan = ref(false);
 
   const appStore = useAppStore();
@@ -99,6 +185,15 @@
   const { changeLocale } = useLocale();
   const locales = [...LOCALE_OPTIONS];
 
+// 加载效果
+const state = reactive<{
+  isPwdUpdate: boolean;
+  pwdData: any;
+}>({
+  isPwdUpdate: false,
+  pwdData: {} as any,
+});
+
   // 切换语言
   const changeLan = () => {
     lan.value = !lan.value;
@@ -119,12 +214,13 @@
     { label: 'messageBox.userCenter', value: 2 },
     { label: 'messageBox.userSettings', value: 3 },
     { label: 'messageBox.logout', value: 4 },
+    { label: 'messageBox.updatePwd',value: 5 },
   ];
 
   const switchRoles = async () => {
     const res = await userStore.switchRoles();
-    
-    Modal.message({
+
+    TinyModal.message({
       message: res as string,
       status: 'success',
     });
@@ -144,6 +240,9 @@
       case 4:
         logout();
         break;
+      case 5:
+        handlePwdUpdate();
+        break;
       default:
       // eslint-disable-next-line no-console
     }
@@ -153,6 +252,52 @@
   const jumpUrl = () => {
     window.location.href = `${window.location.protocol}//${window.location.host}`;
   };
+
+const handlePwdUpdate = () => {
+  state.isPwdUpdate = true;
+}
+
+const handlePwdUpdateCancel =()=>{
+  state.isPwdUpdate = false;
+  state.pwdData = {} as any;
+}
+
+async function handlePwdUpdateSubmit(){
+  let data = state.pwdData;
+  let newTemp = {
+    email: userStore.userInfo.email,
+    token: getToken(),
+    newPassword: data.newPassword,
+    confirmNewPassword: data.confirmNewPassword,
+    oldPassword: data.oldPassword,
+  }
+  if(newTemp.newPassword !== newTemp.confirmNewPassword){
+    TinyModal.message({
+      message: t('userInfo.modal.message.error'),
+      status: 'error',
+    });
+  }else{
+    try {
+      await updatePwdUser(newTemp);
+      TinyModal.message({
+        message: t('baseForm.form.submit.success'),
+        status: 'success',
+      });
+      state.pwdData = {} as any;
+      state.isPwdUpdate = false;
+      logout()
+    } catch (error) {
+      if (error.response && error.response.data) {
+        const errorMessage = error.response.data.message || '未知错误';
+        TinyModal.message({
+          message: errorMessage,
+          status: 'error',
+        });
+      }
+    }
+  }
+}
+
 </script>
 
 <style scoped lang="less">
diff --git a/packages/toolkits/pro/template/tinyvue/src/locale/en-US.ts b/packages/toolkits/pro/template/tinyvue/src/locale/en-US.ts
index 723c8bc9..a231f6c4 100644
--- a/packages/toolkits/pro/template/tinyvue/src/locale/en-US.ts
+++ b/packages/toolkits/pro/template/tinyvue/src/locale/en-US.ts
@@ -24,6 +24,12 @@ import localeHello from '@/views/cloud/hello/locale/en-US';
 
 import localeContracts from '@/views/cloud/contracts/locale/en-US';
 
+import localeUserManager from '@/views/userManager/info/locale/en-US';
+
+import localeUserManagerSetting from '@/views/userManager/setting/locale/en-US';
+
+import localeUserManagerUserAdd from '@/views/userManager/useradd/locale/en-US';
+
 import localeSettings from './en-US/settings';
 
 import localeHttpError from './en-US/httpError';
@@ -40,12 +46,17 @@ export default {
   'menu.profile.detail': 'Basic details page',
   'menu.visualization': 'Data Visualization',
   'menu.user': 'User Center',
+  'menu.userManager': 'User Manager',
+  'menu.userManager.info': 'All User Info',
+  'menu.userManager.setting': 'All User Setting',
+  'menu.userManager.useradd': 'Add User',
   'navbar.docs': 'Docs',
   'navbar.action.locale': 'Switch to English',
   'messageBox.switchRoles': 'Switch Roles',
   'messageBox.userCenter': 'User Center',
   'messageBox.userSettings': 'User Settings',
   'messageBox.logout': 'Logout',
+  'messageBox.updatePwd': 'Update Password',
   'menu.cloud': 'Cloud service capability',
   ...localeTheme,
   ...localeSettings,
@@ -65,4 +76,7 @@ export default {
   ...localeHello,
   ...localeContracts,
   ...localeHttpError,
+  ...localeUserManager,
+  ...localeUserManagerSetting,
+  ...localeUserManagerUserAdd,
 };
diff --git a/packages/toolkits/pro/template/tinyvue/src/locale/zh-CN.ts b/packages/toolkits/pro/template/tinyvue/src/locale/zh-CN.ts
index 84b1d13f..b50a37f5 100644
--- a/packages/toolkits/pro/template/tinyvue/src/locale/zh-CN.ts
+++ b/packages/toolkits/pro/template/tinyvue/src/locale/zh-CN.ts
@@ -24,10 +24,17 @@ import localeHello from '@/views/cloud/hello/locale/zh-CN';
 
 import localeContracts from '@/views/cloud/contracts/locale/zh-CN';
 
+import localeUserManager from '@/views/userManager/info/locale/zh-CN';
+
+import localeUserManagerSetting from '@/views/userManager/setting/locale/zh-CN';
+
+import localeUserManagerUserAdd from '@/views/userManager/useradd/locale/zh-CN';
+
 import localeSettings from './zh-CN/settings';
 
 import localeHttpError from './zh-CN/httpError';
 
+
 export default {
   'menu.board': '看板',
   'menu.home': '监控页',
@@ -40,12 +47,17 @@ export default {
   'menu.profile.detail': '基础详情页',
   'menu.visualization': '数据可视化',
   'menu.user': '个人中心',
+  'menu.userManager': '用户管理',
+  'menu.userManager.info': '所有用户',
+  'menu.userManager.setting': '修改信息',
+  'menu.userManager.useradd': '添加用户',
   'navbar.docs': '文档中心',
   'navbar.action.locale': '切换为中文',
   'messageBox.switchRoles': '切换角色',
   'messageBox.userCenter': '用户中心',
   'messageBox.userSettings': '用户设置',
   'messageBox.logout': '退出登录',
+  'messageBox.updatePwd': '修改密码',
   'menu.cloud': '云服务能力展示',
   ...localeTheme,
   ...localeSettings,
@@ -65,4 +77,7 @@ export default {
   ...localeHello,
   ...localeContracts,
   ...localeHttpError,
+  ...localeUserManager,
+  ...localeUserManagerSetting,
+  ...localeUserManagerUserAdd,
 };
diff --git a/packages/toolkits/pro/template/tinyvue/src/router/routes/modules/userManager.ts b/packages/toolkits/pro/template/tinyvue/src/router/routes/modules/userManager.ts
new file mode 100644
index 00000000..4b88e8b3
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/router/routes/modules/userManager.ts
@@ -0,0 +1,53 @@
+import { RoleType } from '@/types/roleType';
+
+export default {
+  path: 'userManager',
+  name: 'UserManager',
+  id: 'UserManager',
+  label: 'UserManager',
+  component: () => import('@/views/userManager/index.vue'),
+  meta: {
+    locale: 'menu.userManager',
+    requiresAuth: true,
+    order: 9,
+    roles: [RoleType.admin],
+  },
+  children: [
+    {
+      path: 'allInfo',
+      name: 'AllInfo',
+      id: 'AllInfo',
+      label: 'AllInfo',
+      component: () => import('@/views/userManager/info/index.vue'),
+      meta: {
+        locale: 'menu.userManager.info',
+        requiresAuth: true,
+        roles: [RoleType.admin],
+      },
+    },
+    {
+      path: 'allSetting',
+      name: 'AllSetting',
+      id: 'AllSetting',
+      label: 'AllSetting',
+      component: () => import('@/views/userManager/setting/index.vue'),
+      meta: {
+        locale: 'menu.userManager.setting',
+        requiresAuth: true,
+        roles: [RoleType.admin],
+      },
+    },
+    {
+      path: 'userAdd',
+      name: 'UserAdd',
+      id: 'UserAdd',
+      label: 'UserAdd',
+      component: () => import('@/views/userManager/useradd/index.vue'),
+      meta: {
+        locale: 'menu.userManager.useradd',
+        requiresAuth: true,
+        roles: [RoleType.admin],
+      },
+    },
+  ],
+};
diff --git a/packages/toolkits/pro/template/tinyvue/src/store/modules/user/index.ts b/packages/toolkits/pro/template/tinyvue/src/store/modules/user/index.ts
index 2eae9d3a..78d16c5b 100644
--- a/packages/toolkits/pro/template/tinyvue/src/store/modules/user/index.ts
+++ b/packages/toolkits/pro/template/tinyvue/src/store/modules/user/index.ts
@@ -84,10 +84,18 @@ const useUserStore = defineStore('user', {
         const userInfo = {
           id: userRes.data.id,
           name:userRes.data.name,
-          role:userRes.data.role[0].name,
-          createTime:userRes.data.createTime,
-          updateTime:userRes.data.updateTime,
           email:userRes.data.email,
+          role:userRes.data.role[0].name,
+          department: userRes.data.department,
+          employeeType: userRes.data.employeeType,
+          job: userRes.data.role[0].name,
+          probationStart: userRes.data.probationStart,
+          probationEnd: userRes.data.probationEnd,
+          probationDuration: userRes.data.probationDuration,
+          protocolStart: userRes.data.protocolStart,
+          protocolEnd: userRes.data.protocolEnd,
+          address: userRes.data.address,
+          status: userRes.data.status,
         }
         this.setInfo(userInfo);
       } catch (err) {
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/form/step/components/head.vue b/packages/toolkits/pro/template/tinyvue/src/views/form/step/components/head.vue
index b46e549b..08e585d6 100644
--- a/packages/toolkits/pro/template/tinyvue/src/views/form/step/components/head.vue
+++ b/packages/toolkits/pro/template/tinyvue/src/views/form/step/components/head.vue
@@ -3,7 +3,7 @@
     <img src="@/assets/images/user-head.png" alt="user" class="user-image" />
     <div>
       <h3 class="user-name">{{ $t('stepForm.head.admin') }}</h3>
-      <h3 class="user-name">{{ userStore.userInfo.username }}</h3>
+      <h3 class="user-name">{{ userStore.userInfo.name }}</h3>
     </div>
   </div>
   <div class="divider"></div>
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/index.vue b/packages/toolkits/pro/template/tinyvue/src/views/userManager/index.vue
new file mode 100644
index 00000000..6c71efda
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/index.vue
@@ -0,0 +1,5 @@
+<template>
+  <router-view />
+</template>
+
+<script lang="ts" setup></script>
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/components/info-tab.vue b/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/components/info-tab.vue
new file mode 100644
index 00000000..4ed20dd4
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/components/info-tab.vue
@@ -0,0 +1,425 @@
+<template>
+  <div class="tiny-fullscreen-scroll">
+    <div class="tiny-fullscreen-wrapper">
+      <div class="table">
+        <tiny-grid ref="expandGrid"
+                   :fetch-data="fetchDataOption"
+                   :pager="pagerConfig"
+                   :auto-resize="true"
+        >
+          <tiny-grid-column type="index" width="60"></tiny-grid-column>
+          <tiny-grid-column type="expand" width="60">
+            <template #default="data">
+              <ul>
+                <li>
+                  <span>{{ $t('userInfo.table.id') }}：</span>
+                  <span>{{ data.row.id }}</span>
+                </li>
+                <li>
+                  <span>{{ $t('userInfo.table.name') }}：</span>
+                  <span>{{ data.row.name }}</span>
+                </li>
+                <li>
+                  <span>{{ $t('userInfo.table.email') }}：</span>
+                  <span>{{ $t(`${data.row.email}`) }}</span>
+                </li>
+                <li>
+                  <span>{{ $t('userInfo.table.department') }}：</span>
+                  <span>{{ $t(`${data.row.department}`) }}</span>
+                </li>
+                <li>
+                  <span>{{ $t('userInfo.table.employeeType') }}：</span>
+                  <span>{{ $t(`${data.row.employeeType}`) }}</span>
+                </li>
+                <li>
+                  <span>{{ $t('userInfo.table.job') }}：</span>
+                  <span>{{ $t(`${data.row.role[0].name}`) }}</span>
+                </li>
+                <li>
+                  <span>{{ $t('userInfo.table.probationStart') }}：</span>
+                  <span>{{ $t(`${data.row.probationStart}`) }}</span>
+                </li>
+                <li>
+                  <span>{{ $t('userInfo.table.probationEnd') }}：</span>
+                  <span>{{ $t(`${data.row.probationEnd}`) }}</span>
+                </li>
+                <li>
+                  <span>{{ $t('userInfo.table.probationDuration') }}：</span>
+                  <span>{{ $t(`${data.row.probationDuration}`) }}</span>
+                </li>
+                <li>
+                  <span>{{ $t('userInfo.table.protocolStart') }}：</span>
+                  <span>{{ $t(`${data.row.protocolStart}`) }}</span>
+                </li><li>
+                <span>{{ $t('userInfo.table.protocolEnd') }}：</span>
+                <span>{{ $t(`${data.row.protocolEnd}`) }}</span>
+              </li><li>
+                <span>{{ $t('userInfo.table.address') }}：</span>
+                <span>{{ $t(`${data.row.address}`) }}</span>
+              </li><li>
+                <span>{{ $t('userInfo.table.status') }}：</span>
+                <span v-if="data.row.status == 1">已启用</span>
+                <span v-if="data.row.status !== 1">已禁用</span>
+              </li>
+              </ul>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column
+            field="name"
+            :title="$t('userInfo.table.id')"
+          >
+            <template #default="data">
+              <span>{{ $t(`${data.row.id}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column
+            field="time"
+            :title="$t('userInfo.table.name')"
+          >
+            <template #default="data">
+              <span>{{ $t(`${data.row.name}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.email')">
+            <template #default="data">
+              <span>{{ $t(`${data.row.email}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.department')">
+            <template #default="data">
+              <span v-if="data.row.department !== null">{{ $t(`${data.row.department}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.employeeType')">
+            <template #default="data">
+              <span v-if="data.row.employeeType !== null">{{ $t(`${data.row.employeeType}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.job')">
+            <template #default="data">
+              <span>{{ $t(`${data.row.role[0].name}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.probationStart')">
+            <template #default="data">
+              <span v-if="data.row.probationStart !== null">{{ $t(`${data.row.probationStart}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.probationEnd')">
+            <template #default="data">
+              <span v-if="data.row.probationEnd !== null">{{ $t(`${data.row.probationEnd}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.probationDuration')">
+            <template #default="data">
+              <span v-if="data.row.probationDuration !== null">{{ $t(`${data.row.probationDuration}`) }}{{$t('userInfo.day')}}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.protocolStart')">
+            <template #default="data">
+              <span v-if="data.row.protocolStart !== null">{{ $t(`${data.row.protocolStart}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.protocolEnd')">
+            <template #default="data">
+              <span v-if="data.row.protocolEnd !== null">{{ $t(`${data.row.protocolEnd}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.address')">
+            <template #default="data">
+              <span v-if="data.row.address !== null">{{ $t(`${data.row.address}`) }}</span>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column field="type" :title="$t('userInfo.table.status')">
+            <template #default="data">
+              <div v-if="data.row.status == 1">
+                <img style="width: 20px" src="@/assets/images/success.png" alt="success" />
+              </div>
+              <div v-if="data.row.status !== 1">
+                <img style="width: 20px" src="@/assets/images/error.png" alt="error" />
+              </div>
+            </template>
+          </tiny-grid-column>
+          <tiny-grid-column
+            :title="$t('userInfo.table.operations')"
+            align="center"
+          >
+            <template v-slot="data">
+              <a class="operation-update" @click="handleUpdate(data.row.email)">
+                {{ $t('userInfo.table.operations.update') }}
+              </a>
+              <a class="operation-delete" @click="handleDelete(data.row.email)">
+                {{ $t('userInfo.table.operations.delete') }}
+              </a>
+              <a class="operation-pwd-update" @click="handlePwdUpdate(data.row.email)">
+                {{ $t('userInfo.table.operations.pwdUpdate') }}
+              </a>
+            </template>
+          </tiny-grid-column>
+        </tiny-grid>
+      </div>
+    </div>
+  </div>
+  <div v-if="state.isPwdUpdate">
+    <tiny-modal
+      v-model="state.isPwdUpdate"
+      :lock-scroll="true"
+      show-header
+      show-footer
+      mask-closable="true"
+      height="350"
+      width="600"
+      :title="$t('userInfo.modal.title.pwdUpdate')"
+    >
+      <template #default>
+        <tiny-layout>
+          <tiny-form
+            :model="state.pwdData"
+            :rules="rules"
+            label-width="150px"
+            :label-align="true"
+            label-position="left"
+            size="small"
+          >
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="10" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userInfo.table.email')"
+                >
+                  <label>{{ state.pwdData.email }}</label>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="10" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userInfo.modal.input.newPassword')"
+                  prop="newPassword"
+                >
+                  <tiny-input v-model="state.pwdData.newPassword" type="password" show-password></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="10" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userInfo.modal.input.confirmNewPassword')"
+                  prop="confirmNewPassword"
+                >
+                  <tiny-input v-model="state.pwdData.confirmNewPassword" type="password" show-password></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+          </tiny-form>
+        </tiny-layout>
+      </template>
+      <template #footer>
+        <tiny-button type="primary" @click="handlePwdUpdateSubmit">确定</tiny-button>
+        <tiny-button @click="handlePwdUpdateCancel">取消</tiny-button>
+      </template>
+    </tiny-modal>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import {ref, reactive, onMounted, watch, computed} from 'vue';
+import {useI18n} from 'vue-i18n';
+import {
+  Tabs as TinyTabs,
+  TabItem as TinyTabItem,
+  Loading,
+  GridColumn as TinyGridColumn,
+  Grid as TinyGrid, Pager as TinyPager, Modal as TinyModal,
+  Button as TinyButton,
+  Form as TinyForm,
+  FormItem as TinyFormItem,
+  Row as TinyRow,
+  Col as TinyCol,
+  Input as TinyInput,
+} from '@opentiny/vue';
+import {IconChevronDown} from '@opentiny/vue-icon';
+import {useUserStore} from '@/store';
+import {getAllUser, deleteUser, updatePwdAdmin, registerUser, updatePwdUser} from '@/api/user';
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
+
+const {t} = useI18n();
+
+// 加载效果
+const state = reactive<{
+  loading: any;
+  tableData: any;
+  pageData: any;
+  isPwdUpdate: boolean;
+  pwdData: any;
+}>({
+  loading: null,
+  tableData: [] as any,
+  pageData: [] as any,
+  isPwdUpdate: false,
+  pwdData: {} as any,
+});
+
+// 变量设置
+const userStore = useUserStore();
+const ChevronDown = IconChevronDown();
+const activeName = ref('1');
+const Filter = ref(false);
+const Sort = ref(false);
+
+const filterInfo = ref();
+
+const pagerConfig = reactive({
+  component: TinyPager,
+  attrs: {
+    currentPage: 1,
+    pageSize: 10,
+    pageSizes: [5, 10, 15, 20],
+    total: 10,
+    layout: 'total, prev, pager, next, jumper, sizes',
+  },
+});
+
+// 校验规则
+const rulesType = {
+  required: true,
+  trigger: 'blur',
+};
+const rules = computed(() => {
+  return {
+    newPassword: [rulesType],
+    confirmNewPassword: [rulesType]
+  };
+});
+
+// 请求数据接口方法
+const fetchData = async (
+  params: {
+    pageIndex: 1,
+    pageSize: 10,
+  }
+) => {
+  userStore.setInfo({reset: false, submit: false});
+  state.loading = Loading.service({
+    text: 'loading...',
+    target: document.getElementById('contain'),
+    background: 'rgba(0, 0, 0, 0.7)',
+  });
+  try {
+    const {data} = await getAllUser(params.pageIndex, params.pageSize);
+    const total = data.meta.totalItems;
+    return {
+      result: data.items,
+      page: {total},
+    }
+  } finally {
+    state.loading.close();
+  }
+};
+
+const fetchDataOption = reactive({
+  api: ({page}: any) => {
+    const {currentPage, pageSize} = page;
+    return fetchData({
+      pageIndex: currentPage,
+      pageSize,
+    });
+  },
+});
+
+const handleDelete = (email: string) => {
+  deleteUser(email).then((res) => {
+    TinyModal.message({
+      message: '已删除',
+      status: 'success',
+    });
+  })
+}
+
+const handleUpdate = (email: string) => {
+  router.push({
+    name: 'AllSetting',
+    query: {
+      email,
+    },
+  });
+}
+
+const handlePwdUpdate = (email: string) => {
+  state.isPwdUpdate = true;
+  state.pwdData.email = email;
+}
+
+const handlePwdUpdateCancel =()=>{
+  state.isPwdUpdate = false;
+  state.pwdData = {} as any;
+}
+
+async function handlePwdUpdateSubmit(){
+  let data = state.pwdData;
+  let newTemp = {
+    email: data.email,
+    newPassword: data.newPassword,
+    confirmNewPassword: data.confirmNewPassword,
+  }
+  if(newTemp.newPassword !== newTemp.confirmNewPassword){
+    TinyModal.message({
+      message: t('userInfo.modal.message.error'),
+      status: 'error',
+    });
+  }else{
+    try {
+      await updatePwdAdmin(newTemp);
+      TinyModal.message({
+        message: t('baseForm.form.submit.success'),
+        status: 'success',
+      });
+      state.pwdData = {} as any;
+      state.isPwdUpdate = false;
+    } catch (error) {
+      if (error.response && error.response.data) {
+        const errorMessage = error.response.data.message || '未知错误';
+        TinyModal.message({
+          message: errorMessage,
+          status: 'error',
+        });
+      }
+    }
+  }
+}
+
+</script>
+
+<style scoped lang="less">
+#contain {
+  height: 100%;
+  padding: 15px;
+  overflow: hidden;
+}
+
+.table {
+  padding-bottom: 20px;
+  background-color: #fff;
+}
+
+.operation {
+
+  &-delete {
+    padding-right: 5px;
+    color: red;
+  }
+
+  &-update {
+    padding-right: 5px;
+    color: #1890ff;
+  }
+
+  &-pwd-update {
+    color: orange;
+  }
+}
+
+
+</style>
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/index.vue b/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/index.vue
new file mode 100644
index 00000000..526942f3
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/index.vue
@@ -0,0 +1,61 @@
+<template>
+  <div class="container">
+    <Breadcrumb :items="['menu.userManager', 'menu.userManager.info']" />
+    <div class="container-info">
+      <div class="general-card">
+        <div class="general-content">
+          <info-tab></info-tab>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import infoTab from './components/info-tab.vue';
+</script>
+
+<style scoped lang="less">
+  .container {
+    width: 100%;
+    height: 100%;
+  }
+  .container-info {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    width: 100%;
+    height: calc(100% - 60px);
+    margin: 0 auto;
+
+    .general-card {
+      flex: 1 1 auto;
+      height: 100%;
+      overflow-x: hidden;
+      overflow-y: auto;
+      border-radius: 10px;
+
+      .general-top {
+        display: flex;
+        min-height: 178px;
+        margin-bottom: 20px;
+        overflow: hidden;
+        background-image: url('@/assets/images/blue-bg.png');
+        background-size: 100% 100%;
+        border-radius: 4px;
+        box-shadow: 0 0 8px 8px rgba(169, 174, 184, 0.05);
+      }
+
+      .general-content {
+        height: calc(100% - 198px);
+        position: relative;
+        color: black;
+        font-size: medium;
+        background-color: #fff;
+        border-radius: 10px;
+        box-shadow: 0 0 8px 8px rgba(169, 174, 184, 0.05);
+        overflow-y: auto;
+      }
+    }
+  }
+</style>
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/locale/en-US.ts b/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/locale/en-US.ts
new file mode 100644
index 00000000..a31812ef
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/locale/en-US.ts
@@ -0,0 +1,31 @@
+export default {
+  'menu.allUser.info': 'All User Info',
+  'userInfo.table.id': 'ID',
+  'userInfo.table.name': 'Name',
+  'userInfo.table.email': 'Email',
+  'userInfo.table.department': 'Department',
+  'userInfo.table.employeeType': 'EmployeeType',
+  'userInfo.table.job': 'Job',
+  'userInfo.table.probation': 'Probation',
+  'userInfo.table.probationStart': 'ProbationStart',
+  'userInfo.table.probationEnd': 'ProbationEnd',
+  'userInfo.table.probationDuration': 'ProbationDuration',
+  'userInfo.table.protocol': 'Protocol',
+  'userInfo.table.protocolStart': 'ProtocolStart',
+  'userInfo.table.protocolEnd': 'ProtocolEnd',
+  'userInfo.table.address': 'Address',
+  'userInfo.table.status': 'Status',
+  'userInfo.table.createTime': 'CreateTime',
+  'userInfo.table.updateTime': 'UpdateTime',
+  'userInfo.table.operations': 'Operation',
+  'userInfo.table.operations.update': 'Update',
+  'userInfo.table.operations.delete': 'Delete',
+  'userInfo.table.operations.pwdUpdate': 'Password',
+  'userInfo.day': 'Day',
+  'userInfo.modal.title.pwdUpdate': 'Update Password',
+  'userInfo.modal.input.oldPassword': 'Old Password',
+  'userInfo.modal.input.newPassword': 'New Password',
+  'userInfo.modal.input.confirmNewPassword': 'Confirm New Password',
+  'userInfo.modal.message.error': 'Confirm New Password Error',
+  'userInfo.modal.message.notNull': 'Password Is Not Null',
+};
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/locale/zh-CN.ts b/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/locale/zh-CN.ts
new file mode 100644
index 00000000..68de9abd
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/info/locale/zh-CN.ts
@@ -0,0 +1,31 @@
+export default {
+  'menu.allUser.info': '所有用户',
+  'userInfo.table.id': 'ID',
+  'userInfo.table.name': '名称',
+  'userInfo.table.email': '邮箱',
+  'userInfo.table.department': '部门',
+  'userInfo.table.employeeType': '招聘类型',
+  'userInfo.table.job': '职位',
+  'userInfo.table.probation': '试用期',
+  'userInfo.table.probationStart': '试用期开始日期',
+  'userInfo.table.probationEnd': '试用期结束日期',
+  'userInfo.table.probationDuration': '试用期时长',
+  'userInfo.table.protocol': '劳动合同',
+  'userInfo.table.protocolStart': '劳动合同开始日期',
+  'userInfo.table.protocolEnd': '劳动合同结束日期',
+  'userInfo.table.address': '地址',
+  'userInfo.table.status': '状态',
+  'userInfo.table.createTime': '创建时间',
+  'userInfo.table.updateTime': '更新时间',
+  'userInfo.table.operations': '操作',
+  'userInfo.table.operations.update': '修改',
+  'userInfo.table.operations.delete': '删除',
+  'userInfo.table.operations.pwdUpdate': '密码',
+  'userInfo.day': '天',
+  'userInfo.modal.title.pwdUpdate': '修改密码',
+  'userInfo.modal.input.oldPassword': '旧密码',
+  'userInfo.modal.input.newPassword': '新密码',
+  'userInfo.modal.input.confirmNewPassword': '确认新密码',
+  'userInfo.modal.message.error': '确认新密码错误',
+  'userInfo.modal.message.notNull': '密码不能为空',
+};
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/components/head.vue b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/components/head.vue
new file mode 100644
index 00000000..0ecae7b0
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/components/head.vue
@@ -0,0 +1,164 @@
+<template>
+  <div class="user">
+    <img src="@/assets/images/user-head.png" alt="user" class="user-image" />
+    <div>
+      <h3 class="user-name">{{ $t('stepForm.head.admin') }}</h3>
+      <h3 class="user-name">{{ userData.name }}</h3>
+    </div>
+  </div>
+  <div class="divider"></div>
+  <div class="user-content">
+    <tiny-layout>
+      <tiny-row :flex="true" justify="center" class="margin-bottom">
+        <img src="@/assets/images/head-1.png" class="head-image" />
+        <tiny-col :span="6">
+          <div class="col">
+            <div>{{ $t('stepForm.recruitment.department') }}</div>
+            <div class="space"></div>
+            <div>{{ userData.department }}</div>
+          </div>
+        </tiny-col>
+        <img src="@/assets/images/head-2.png" class="head-image" />
+        <tiny-col :span="6">
+          <div class="col">
+            <div>{{ $t('stepForm.recruitment.type') }}</div>
+            <div class="space"></div>
+            <div>{{ userData.employeeType }}</div>
+          </div>
+        </tiny-col>
+        <img src="@/assets/images/head-3.png" class="head-image" />
+        <tiny-col :span="6">
+          <div class="col">
+            <div>{{ $t('stepForm.recruitment.position') }}</div>
+            <div class="space"></div>
+            <div v-if="userData.role">{{ userData.role[0].name }}</div>
+          </div>
+        </tiny-col>
+      </tiny-row>
+      <tiny-row :flex="true" justify="center" class="margin-bottom">
+        <img src="@/assets/images/head-4.png" class="head-image" />
+        <tiny-col :span="6">
+          <div class="col">
+            <div>{{ $t('stepForm.probation.start') }}</div>
+            <div class="space"></div>
+            <div>
+              {{ userData.probationStart }}
+              ~
+              {{ userData.probationEnd }}
+            </div>
+          </div>
+        </tiny-col>
+        <img src="@/assets/images/head-5.png" class="head-image" />
+        <tiny-col :span="6">
+          <div class="col">
+            <div>{{ $t('stepForm.start.date') }}</div>
+            <div class="space"></div>
+            <div>{{ userData.protocolStart }}</div>
+          </div>
+        </tiny-col>
+        <img src="@/assets/images/head-6.png" class="head-image" />
+        <tiny-col :span="6">
+          <div class="col">
+            <div>{{ $t('stepForm.probation.period') }}</div>
+            <div class="space"></div>
+            <div
+              >{{ userData.probationDuration
+              }}{{ $t('stepForm.probation.day') }}</div
+            >
+          </div>
+        </tiny-col>
+      </tiny-row>
+    </tiny-layout>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { onMounted,defineProps } from 'vue';
+  import {
+    Layout as TinyLayout,
+    Row as TinyRow,
+    Col as TinyCol,
+  } from '@opentiny/vue';
+
+  const props = defineProps({
+    userData: {} as any
+  })
+
+</script>
+
+<style scoped lang="less">
+  .user-content {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    width: 66%;
+    padding-bottom: 8px;
+  }
+
+  .divider {
+    width: 1px;
+    height: 60px;
+    margin-top: 70px;
+    background: #fff;
+    opacity: 0.3;
+  }
+
+  .user {
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+    width: 16%;
+  }
+
+  .user-image {
+    font-style: oblique;
+    border-radius: 60px;
+    fill: var(--ti-common-color-line-active);
+  }
+
+  .space {
+    height: 10px;
+  }
+
+  .head-image {
+    margin-top: 6px;
+    padding-right: 10px;
+  }
+
+  .user-name {
+    padding-left: 26px;
+    color: #fff;
+    font-weight: 600;
+    font-size: large;
+  }
+
+  .margin-bottom {
+    margin-top: 30px;
+    margin-bottom: 30px;
+  }
+
+  .col {
+    color: #fff;
+  }
+</style>
+
+<style lang="less" scoped>
+  // responsive
+  @media (max-width: @screen-lg) {
+    .margin-bottom {
+      margin-top: 10px;
+      margin-bottom: 12px;
+    }
+  }
+  @media (max-width: @screen-ml) {
+    .margin-bottom {
+      margin-top: 10px;
+      margin-bottom: 12px;
+    }
+  }
+  @media (max-width: @screen-xs) {
+    .user {
+      width: 25%;
+    }
+  }
+</style>
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/components/set-from.vue b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/components/set-from.vue
new file mode 100644
index 00000000..122e6b8d
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/components/set-from.vue
@@ -0,0 +1,266 @@
+<template>
+  <tiny-layout>
+    <tiny-form
+      ref="setFormRef"
+      :model="state.filterOptions"
+      :rules="rules"
+      label-width="150px"
+      :label-align="true"
+      label-position="left"
+      size="small"
+    >
+      <tiny-row :flex="true" justify="left">
+        <tiny-col :span="5" label-width="100px">
+          <tiny-form-item
+            :label="$t('userSetting.name')"
+            prop="department"
+          >
+            <tiny-input v-model="state.filterOptions.name"></tiny-input>
+          </tiny-form-item>
+        </tiny-col>
+        <tiny-col :span="5" label-width="100px">
+          <tiny-form-item :label="$t('userSetting.address')" prop="position">
+            <tiny-input v-model="state.filterOptions.address"></tiny-input>
+          </tiny-form-item>
+        </tiny-col>
+      </tiny-row>
+
+      <tiny-row :flex="true" justify="left">
+        <tiny-col :span="5" label-width="100px">
+          <tiny-form-item
+            :label="$t('userSetting.department')"
+            prop="department"
+          >
+            <tiny-input v-model="state.filterOptions.department"></tiny-input>
+          </tiny-form-item>
+        </tiny-col>
+        <tiny-col :span="5" label-width="100px">
+          <tiny-form-item :label="$t('userSetting.position')" prop="position">
+            <tiny-input v-model="state.filterOptions.position"></tiny-input>
+          </tiny-form-item>
+        </tiny-col>
+      </tiny-row>
+
+      <tiny-row :flex="true" justify="left">
+        <tiny-col :span="5" label-width="100px">
+          <tiny-form-item :label="$t('userSetting.type')" prop="type">
+            <tiny-select
+              v-model="state.filterOptions.type"
+              :placeholder="$t('baseForm.form.label.placeholder')"
+            >
+              <tiny-option
+                v-for="item in (projectData as any)"
+                :key="item.value"
+                :label="$t(item.label)"
+                :value="item.label"
+              ></tiny-option>
+            </tiny-select>
+          </tiny-form-item>
+        </tiny-col>
+        <tiny-col :span="5" label-width="100px">
+          <tiny-form-item :label="$t('userSetting.date')" prop="date">
+            <tiny-date-picker
+              v-model="state.filterOptions.date"
+              unlink-panels
+              type="daterange"
+              range-separator="-"
+              :start-placeholder="$t('userSetting.first')"
+              :end-placeholder="$t('userSetting.last')"
+            ></tiny-date-picker>
+          </tiny-form-item>
+        </tiny-col>
+      </tiny-row>
+
+      <tiny-row :flex="true" justify="left">
+        <tiny-col :span="5" label-width="100px">
+          <tiny-form-item :label="$t('userSetting.during')" prop="during">
+            <tiny-input v-model="state.filterOptions.during"></tiny-input>
+          </tiny-form-item>
+        </tiny-col>
+        <tiny-col :span="5" label-width="100px">
+          <tiny-form-item :label="$t('userSetting.startTime')" prop="startTime">
+            <tiny-date-picker
+              v-model="state.filterOptions.startTime"
+              @blur="handleBlur"
+            ></tiny-date-picker>
+          </tiny-form-item>
+        </tiny-col>
+      </tiny-row>
+
+      <tiny-row :flex="true" justify="left">
+        <tiny-col :span="5" label-width="100px">
+          <tiny-form-item :label="$t('userSetting.endTime')" prop="endTime">
+            <tiny-date-picker
+              v-model="state.filterOptions.endTime"
+              @blur="handleBlur"
+            ></tiny-date-picker>
+          </tiny-form-item>
+        </tiny-col>
+        <tiny-col :span="5" label-width="100px">
+          <tiny-form-item :label="$t('userSetting.status')" prop="type">
+            <tiny-select
+              v-model="state.filterOptions.status"
+              :placeholder="$t('baseForm.form.label.placeholder')"
+            >
+              <tiny-option
+                v-for="item in (statusData as any)"
+                :key="item.value"
+                :label="$t(item.label)"
+                :value="item.label"
+              ></tiny-option>
+            </tiny-select>
+          </tiny-form-item>
+        </tiny-col>
+      </tiny-row>
+    </tiny-form>
+  </tiny-layout>
+</template>
+
+<script lang="ts" setup>
+import {ref, reactive, defineProps, computed, defineExpose, onMounted} from 'vue';
+  import { useI18n } from 'vue-i18n';
+  import {
+    Select as TinySelect,
+    Option as TinyOption,
+    Layout as TinyLayout,
+    Form as TinyForm,
+    FormItem as TinyFormItem,
+    Row as TinyRow,
+    Col as TinyCol,
+    Input as TinyInput,
+    DatePicker as TinyDatePicker,
+    Modal,
+  } from '@opentiny/vue';
+
+
+  const props = defineProps({
+    userData: {} as any
+  })
+
+  interface FilterOptions {
+    department: string;
+    position: Array<object>;
+    type: Array<object>;
+    date: Array<object>;
+    during: Array<object>;
+    startTime: string;
+    endTime: string;
+    name: string;
+    address: string;
+    status: number;
+  }
+
+  const projectData = [
+    {
+      value: '1',
+      label: 'Social Recruitment',
+    },
+    {
+      value: '2',
+      label: 'School Recruitment',
+    },
+    {
+      value: '3',
+      label: 'Job Transfer',
+    },
+  ];
+
+  const statusData = [
+    {
+      value: 1,
+      label: 'Active',
+    },
+    {
+      value: 2,
+      label: 'Disabled',
+    },
+  ];
+
+  // 加载效果
+  const state = reactive<{
+    filterOptions: FilterOptions;
+  }>({
+    filterOptions: {
+      name: props.userData.name,
+      address: props.userData.address,
+      department: props.userData.department,
+      position: '',
+      type: props.userData.employeeType,
+      date: [props.userData.probationStart,props.userData.probationEnd],
+      during: props.userData.probationDuration,
+      startTime: props.userData.protocolStart,
+      endTime: props.userData.protocolEnd,
+      status: '',
+    } as FilterOptions,
+  });
+
+  // 初始化请求数据
+  const setFormRef = ref();
+  const { t } = useI18n();
+
+  // 校验规则
+  const rulesType = {
+    required: true,
+    trigger: 'blur',
+  };
+  const rulesSelect = {
+    required: true,
+    message: '必选',
+    trigger: 'blur',
+  };
+  const rules = computed(() => {
+    return {
+      department: [rulesType],
+      position: [rulesType],
+      type: [rulesSelect],
+      date: [rulesType],
+      during: [rulesType],
+      startTime: [rulesType],
+      endTime: [rulesType],
+      name:[rulesType],
+      address: [rulesType],
+      status: [rulesSelect],
+    };
+  });
+
+  // 结束时间校验
+  const handleBlur = () => {
+    const start = state.filterOptions.startTime?.getTime();
+    const end = state.filterOptions.endTime?.getTime();
+    if (end < start) {
+      state.filterOptions.endTime = '';
+      Modal.message({
+        message: t('userInfo.time.message'),
+        status: 'error',
+      });
+    }
+  };
+  const setFormValid = () => {
+    let setValidate = false;
+    setFormRef.value.validate((valid: boolean) => {
+      setValidate = valid;
+    });
+
+    return setValidate;
+  };
+
+  const setReset = () => {
+    state.filterOptions = {} as FilterOptions;
+  };
+
+  const setData = () => {
+    return state;
+  };
+
+  defineExpose({
+    setData,
+    setFormValid,
+    setReset,
+  });
+</script>
+
+<style scoped lang="less">
+  :deep(.tiny-row) {
+    margin-bottom: 15px;
+  }
+</style>
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/index.vue b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/index.vue
new file mode 100644
index 00000000..9e28591a
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/index.vue
@@ -0,0 +1,378 @@
+<template>
+  <div class="container-set">
+    <Breadcrumb :items="['menu.userManager', 'menu.userManager.setting']"/>
+    <div class="general-card">
+      <div class="general-top">
+        <headtop :userData="state.userData"></headtop>
+      </div>
+      <div class="general-contain">
+
+        <tiny-layout>
+          <tiny-form
+            ref="setFormRef"
+            :model="state.userData"
+            :rules="rules"
+            label-width="150px"
+            :label-align="true"
+            label-position="left"
+            size="small"
+          >
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userSetting.name')"
+                  prop="name"
+                >
+                  <tiny-input v-model="state.userData.name"></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userSetting.address')" prop="address">
+                  <tiny-input v-model="state.userData.address"></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userSetting.department')"
+                  prop="department"
+                >
+                  <tiny-input v-model="state.userData.department"></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userSetting.position')" prop="roleIds">
+                  <tiny-select
+                    v-model="state.userData.roleIds"
+                    :placeholder="$t('baseForm.form.label.placeholder')"
+                  >
+                    <tiny-option
+                      v-for="item in (state.roleData as any)"
+                      :key="item.id"
+                      :label="$t(item.name)"
+                      :value="item.id"
+                    ></tiny-option>
+                  </tiny-select>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userSetting.type')" prop="employeeType">
+                  <tiny-select
+                    v-model="state.userData.employeeType"
+                    :placeholder="$t('baseForm.form.label.placeholder')"
+                  >
+                    <tiny-option
+                      v-for="item in (projectData as any)"
+                      :key="item.value"
+                      :label="$t(item.label)"
+                      :value="item.label"
+                    ></tiny-option>
+                  </tiny-select>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userSetting.date')" prop="probationDate">
+                  <tiny-date-picker
+                    v-model="state.userData.probationDate"
+                    unlink-panels
+                    type="daterange"
+                    range-separator="-"
+                    :start-placeholder="$t('userSetting.first')"
+                    :end-placeholder="$t('userSetting.last')"
+                  ></tiny-date-picker>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userSetting.during')" prop="probationDuration">
+                  <tiny-input v-model="state.userData.probationDuration"></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userSetting.startTime')" prop="protocolStart">
+                  <tiny-date-picker
+                    v-model="state.userData.protocolStart"
+                    @blur="handleBlur"
+                  ></tiny-date-picker>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userSetting.endTime')" prop="protocolEnd">
+                  <tiny-date-picker
+                    v-model="state.userData.protocolEnd"
+                    @blur="handleBlur"
+                  ></tiny-date-picker>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userSetting.status')" prop="status">
+                  <tiny-select
+                    v-model="state.userData.status"
+                    :placeholder="$t('baseForm.form.label.placeholder')"
+                  >
+                    <tiny-option
+                      v-for="item in (statusData as any)"
+                      :key="item.value"
+                      :label="$t(item.label)"
+                      :value="item.label"
+                    ></tiny-option>
+                  </tiny-select>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+          </tiny-form>
+        </tiny-layout>
+
+        <div class="general-btn">
+          <tiny-button
+            type="primary"
+            native-type="submit"
+            @click="handleSubmit"
+          >{{ $t('userSetting.save') }}
+          </tiny-button
+          >
+          <tiny-button @click="handleFormReset">
+            {{ $t('userSetting.cancel') }}
+          </tiny-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import {computed, onMounted, reactive} from 'vue';
+import {useI18n} from 'vue-i18n';
+import {
+  Select as TinySelect,
+  Option as TinyOption,
+  Layout as TinyLayout,
+  Form as TinyForm,
+  FormItem as TinyFormItem,
+  Row as TinyRow,
+  Col as TinyCol,
+  Input as TinyInput,
+  DatePicker as TinyDatePicker,
+  Modal,
+  Button as TinyButton,
+} from '@opentiny/vue';
+import {getSimpleDate} from '@/utils/time';
+import {useRoute, useRouter} from 'vue-router';
+import {getAllUser, getUserInfo, updateUserInfo} from '@/api/user'
+import {getRoles} from '@/api/role'
+
+import headtop from './components/head.vue';
+import setFrom from './components/set-from.vue';
+
+
+const route = useRoute();
+const router = useRouter();
+
+
+// 初始化请求数据
+onMounted(() => {
+  fecthData();
+  fetchRole()
+});
+
+// 加载效果
+const state = reactive<{
+  userData: any;
+  roleData: any;
+}>({
+  userData: {} as any,
+  roleData: [] as any,
+});
+
+const projectData = [
+  {
+    value: '1',
+    label: 'Social Recruitment',
+  },
+  {
+    value: '2',
+    label: 'School Recruitment',
+  },
+  {
+    value: '3',
+    label: 'Job Transfer',
+  },
+];
+
+const statusData = [
+  {
+    value: 1,
+    label: 'Active',
+  },
+  {
+    value: 2,
+    label: 'Disabled',
+  },
+];
+
+// 校验规则
+const rulesType = {
+  required: true,
+  trigger: 'blur',
+};
+const rulesSelect = {
+  required: true,
+  message: '必选',
+  trigger: 'blur',
+};
+const rules = computed(() => {
+  return {
+    department: [rulesType],
+    roleIds: [rulesSelect],
+    employeeType: [rulesSelect],
+    probationDate: [rulesSelect],
+    probationDuration: [rulesType],
+    protocolStart: [rulesSelect],
+    protocolEnd: [rulesSelect],
+    name:[rulesType],
+    address: [rulesType],
+    status: [rulesSelect],
+  };
+});
+
+const {t} = useI18n();
+
+// btn操作
+function handleFormReset() {
+  router.back();
+}
+
+async function handleSubmit() {
+  let data = state.userData;
+  if(data.status === 'Active'){data.status = 1}
+  else{ data.status = 2 }
+  let newTemp = {
+    email: data.email,
+    name: data.name,
+    address: data.address,
+    department: data.department,
+    roleIds: [data.roleIds],
+    employeeType: data.employeeType,
+    probationStart: getSimpleDate(data.probationDate[0]),
+    probationEnd: getSimpleDate(data.probationDate[1]),
+    probationDuration: data.probationDuration,
+    protocolStart: getSimpleDate(data.protocolStart),
+    protocolEnd: getSimpleDate(data.protocolEnd),
+    status: data.status,
+  };
+
+  try {
+    await updateUserInfo(newTemp);
+    Modal.message({
+      message: t('baseForm.form.submit.success'),
+      status: 'success',
+    });
+    handleFormReset();
+  } catch (error) {
+    if (error.response && error.response.data) {
+      const errorMessage = error.response.data.message || '未知错误';
+      Modal.message({
+        message: errorMessage[0],
+        status: 'error',
+      });
+    }
+  }
+}
+
+async function fecthData() {
+  if (route.query.email !== undefined || null) {
+    const {data} = await getUserInfo(route.query.email);
+    if (data.status === 1) {
+      data.status = statusData[0].label
+    } else {
+      data.status = statusData[1].label
+    }
+    if(data.role !== null){
+      data.roleIds = data.role[0].id
+      data.roleName = data.role[0].name
+    }
+    state.userData = data;
+    state.userData.probationDate = [data.probationStart, data.probationEnd]
+  }
+}
+
+async function fetchRole(){
+  const {data} = await getRoles();
+  state.roleData = data;
+}
+
+</script>
+
+<style scoped lang="less">
+.container-set {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  width: 98%;
+  height: inherit;
+  margin: 0 auto;
+
+  .general-card {
+    height: 100%;
+    padding: 10px;
+    overflow-x: hidden;
+    overflow-y: auto;
+    border-radius: 10px;
+
+    .general-top {
+      display: flex;
+      justify-content: space-around;
+      min-height: 202px;
+      margin: 0 -12px;
+      overflow: hidden;
+      background-image: url('@/assets/images/step-head.png');
+      background-size: 100% 100%;
+    }
+
+    .general-contain {
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-start;
+      min-height: 75%;
+      padding: 30px 0 10px 20px;
+      color: black;
+      background-color: #fff;
+      border-radius: 10px;
+
+      .tiny-layout {
+        width: 80%;
+      }
+    }
+
+    .general-btn {
+      position: relative;
+      left: 160px;
+
+      button {
+        width: 100px;
+        height: 36px;
+        border-radius: 4px;
+      }
+    }
+
+    .margin-bottom {
+      margin: 15px 0;
+    }
+
+    .col {
+      padding: 4px 0;
+      color: #fff;
+    }
+  }
+}
+</style>
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/locale/en-US.ts b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/locale/en-US.ts
new file mode 100644
index 00000000..4d5d2626
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/locale/en-US.ts
@@ -0,0 +1,17 @@
+export default {
+  'menu.allUser.setting': 'User Setting',
+  'userSetting.cancel': 'Cancel',
+  'userSetting.reset': 'Reset',
+  'userSetting.department': 'Department:',
+  'userSetting.position': 'Position:',
+  'userSetting.type': 'Recruitment Type:',
+  'userSetting.date': 'Trial Start and End Date:',
+  'userSetting.during': 'Probation Period:',
+  'userSetting.startTime': 'Labor Contract Start Date:',
+  'userSetting.endTime': 'Labor Contract End Date:',
+  'userSetting.first': 'Start Time',
+  'userSetting.last': 'End Time',
+  'userSetting.name': 'UserName',
+  'userSetting.address': 'Address',
+  'userSetting.status': 'Status',
+};
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/locale/zh-CN.ts b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/locale/zh-CN.ts
new file mode 100644
index 00000000..2823c288
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/setting/locale/zh-CN.ts
@@ -0,0 +1,17 @@
+export default {
+  'menu.allUser.setting': '用户设置',
+  'userSetting.save': '保存',
+  'userSetting.cancel': '取消',
+  'userSetting.department': '所属部门:',
+  'userSetting.position': '职位:',
+  'userSetting.type': '招聘类型:',
+  'userSetting.date': '试用起止日期:',
+  'userSetting.during': '试用期时长:',
+  'userSetting.startTime': '劳动合同开始日期:',
+  'userSetting.endTime': '劳动合同结束日期:',
+  'userSetting.first': '开始时间',
+  'userSetting.last': '结束时间',
+  'userSetting.name': '用户名',
+  'userSetting.address': '地址',
+  'userSetting.status': '状态',
+};
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/useradd/index.vue b/packages/toolkits/pro/template/tinyvue/src/views/userManager/useradd/index.vue
new file mode 100644
index 00000000..98b0c394
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/useradd/index.vue
@@ -0,0 +1,379 @@
+<template>
+  <div class="container-set">
+    <Breadcrumb :items="['menu.userManager', 'menu.userManager.useradd']"/>
+    <div class="general-card">
+      <div class="general-contain">
+        <tiny-layout>
+          <tiny-form
+            ref="setFormRef"
+            :model="state.userData"
+            :rules="rules"
+            label-width="150px"
+            :label-align="true"
+            label-position="left"
+            size="small"
+          >
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userAdd.email')"
+                  prop="email"
+                >
+                  <tiny-input v-model="state.userData.email"></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userAdd.password')" prop="password">
+                  <tiny-input v-model="state.userData.password "
+                              type="password"
+                              show-password></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userAdd.name')"
+                  prop="name"
+                >
+                  <tiny-input v-model="state.userData.name"></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userAdd.address')" prop="address">
+                  <tiny-input v-model="state.userData.address"></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item
+                  :label="$t('userAdd.department')"
+                  prop="department"
+                >
+                  <tiny-input v-model="state.userData.department"></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userAdd.position')" prop="roleIds">
+                  <tiny-select
+                    v-model="state.userData.roleIds"
+                    :placeholder="$t('baseForm.form.label.placeholder')"
+                  >
+                    <tiny-option
+                      v-for="item in (state.roleData as any)"
+                      :key="item.id"
+                      :label="$t(item.name)"
+                      :value="item.id"
+                    ></tiny-option>
+                  </tiny-select>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userAdd.type')" prop="employeeType">
+                  <tiny-select
+                    v-model="state.userData.employeeType"
+                    :placeholder="$t('baseForm.form.label.placeholder')"
+                  >
+                    <tiny-option
+                      v-for="item in (projectData as any)"
+                      :key="item.value"
+                      :label="$t(item.label)"
+                      :value="item.label"
+                    ></tiny-option>
+                  </tiny-select>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userAdd.date')" prop="probationDate">
+                  <tiny-date-picker
+                    v-model="state.userData.probationDate"
+                    unlink-panels
+                    type="daterange"
+                    range-separator="-"
+                    :start-placeholder="$t('userAdd.first')"
+                    :end-placeholder="$t('userAdd.last')"
+                  ></tiny-date-picker>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userAdd.during')" prop="probationDuration">
+                  <tiny-input v-model="state.userData.probationDuration"></tiny-input>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userAdd.startTime')" prop="protocolStart">
+                  <tiny-date-picker
+                    v-model="state.userData.protocolStart"
+                    @blur="handleBlur"
+                  ></tiny-date-picker>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+
+            <tiny-row :flex="true" justify="left">
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userAdd.endTime')" prop="protocolEnd">
+                  <tiny-date-picker
+                    v-model="state.userData.protocolEnd"
+                    @blur="handleBlur"
+                  ></tiny-date-picker>
+                </tiny-form-item>
+              </tiny-col>
+              <tiny-col :span="5" label-width="100px">
+                <tiny-form-item :label="$t('userAdd.status')" prop="status">
+                  <tiny-select
+                    v-model="state.userData.status"
+                    :placeholder="$t('baseForm.form.label.placeholder')"
+                  >
+                    <tiny-option
+                      v-for="item in (statusData as any)"
+                      :key="item.value"
+                      :label="$t(item.label)"
+                      :value="item.label"
+                    ></tiny-option>
+                  </tiny-select>
+                </tiny-form-item>
+              </tiny-col>
+            </tiny-row>
+          </tiny-form>
+        </tiny-layout>
+
+        <div class="general-btn">
+          <tiny-button
+            type="primary"
+            native-type="submit"
+            @click="handleSubmit"
+          >{{ $t('userAdd.save') }}
+          </tiny-button>
+
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import {computed, onMounted, reactive} from 'vue';
+import {useI18n} from 'vue-i18n';
+import {
+  Select as TinySelect,
+  Option as TinyOption,
+  Layout as TinyLayout,
+  Form as TinyForm,
+  FormItem as TinyFormItem,
+  Row as TinyRow,
+  Col as TinyCol,
+  Input as TinyInput,
+  DatePicker as TinyDatePicker,
+  Modal,
+  Button as TinyButton,
+} from '@opentiny/vue';
+import {getSimpleDate} from '@/utils/time';
+import {useRoute, useRouter} from 'vue-router';
+import {getUserInfo, registerUser, updateUserInfo} from '@/api/user'
+import {getRoles} from '@/api/role'
+
+
+const route = useRoute();
+const router = useRouter();
+
+// 初始化请求数据
+onMounted(() => {
+  fetchRole()
+});
+
+const {t} = useI18n();
+
+// 加载效果
+const state = reactive<{
+  userData: any;
+  roleData: any;
+}>({
+  userData: {} as any,
+  roleData: [] as any,
+});
+
+const projectData = [
+  {
+    value: '1',
+    label: 'Social Recruitment',
+  },
+  {
+    value: '2',
+    label: 'School Recruitment',
+  },
+  {
+    value: '3',
+    label: 'Job Transfer',
+  },
+];
+
+const statusData = [
+  {
+    value: 1,
+    label: 'Active',
+  },
+  {
+    value: 2,
+    label: 'Disabled',
+  },
+];
+
+// 校验规则
+const rulesType = {
+  required: true,
+  trigger: 'blur',
+};
+const rulesSelect = {
+  required: true,
+  message: '必选',
+  trigger: 'blur',
+};
+
+const rules = computed(() => {
+  return {
+    email: [rulesType],
+    password: [rulesType],
+    department: [rulesType],
+    roleIds: [rulesSelect],
+    employeeType: [rulesSelect],
+    probationDate: [rulesSelect],
+    probationDuration: [rulesType],
+    protocolStart: [rulesSelect],
+    protocolEnd: [rulesSelect],
+    name:[rulesType],
+    address: [rulesType],
+    status: [rulesSelect],
+  };
+});
+
+async function handleSubmit() {
+  let data = state.userData;
+  if(data.status === 'Active'){data.status = 1}
+  else{ data.status = 2 }
+  let newTemp = {
+    email: data.email,
+    password: data.password,
+    name: data.name,
+    address: data.address,
+    department: data.department,
+    roleIds: [data.roleIds],
+    employeeType: data.employeeType,
+    probationStart: getSimpleDate(data.probationDate[0]),
+    probationEnd: getSimpleDate(data.probationDate[1]),
+    probationDuration: data.probationDuration,
+    protocolStart: getSimpleDate(data.protocolStart),
+    protocolEnd: getSimpleDate(data.protocolEnd),
+    status: data.status,
+  };
+
+  try {
+    await registerUser(newTemp);
+    Modal.message({
+      message: t('baseForm.form.submit.success'),
+      status: 'success',
+    });
+    state.userData = {} as any;
+  } catch (error) {
+    if (error.response && error.response.data) {
+      const errorMessage = error.response.data.message || '未知错误';
+      Modal.message({
+        message: errorMessage[0],
+        status: 'error',
+      });
+    }
+  }
+}
+
+async function fetchRole(){
+  const {data} = await getRoles();
+  state.roleData = data;
+}
+
+// 结束时间校验
+const handleBlur = () => {
+  const start = state.userData.protocolStart?.getTime();
+  const end = state.userData.protocolEnd?.getTime();
+  if (end < start) {
+    state.userData.protocolEnd = '';
+    Modal.message({
+      message: t('userInfo.time.message'),
+      status: 'error',
+    });
+  }
+};
+
+</script>
+
+<style scoped lang="less">
+.container-set {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  width: 98%;
+  height: inherit;
+  margin: 0 auto;
+
+  .general-card {
+    height: 100%;
+    padding: 10px;
+    overflow-x: hidden;
+    overflow-y: auto;
+    border-radius: 10px;
+
+    .general-top {
+      display: flex;
+      justify-content: space-around;
+      min-height: 202px;
+      margin: 0 -12px;
+      overflow: hidden;
+      background-image: url('@/assets/images/step-head.png');
+      background-size: 100% 100%;
+    }
+
+    .general-contain {
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-start;
+      min-height: 75%;
+      padding: 30px 0 10px 20px;
+      color: black;
+      background-color: #fff;
+      border-radius: 10px;
+
+      .tiny-layout {
+        width: 80%;
+      }
+    }
+
+    .general-btn {
+      position: relative;
+      left: 160px;
+
+      button {
+        width: 100px;
+        height: 36px;
+        border-radius: 4px;
+      }
+    }
+
+    .margin-bottom {
+      margin: 15px 0;
+    }
+
+    .col {
+      padding: 4px 0;
+      color: #fff;
+    }
+  }
+}
+</style>
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/useradd/locale/en-US.ts b/packages/toolkits/pro/template/tinyvue/src/views/userManager/useradd/locale/en-US.ts
new file mode 100644
index 00000000..134d37aa
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/useradd/locale/en-US.ts
@@ -0,0 +1,19 @@
+export default {
+  'menu.allUser.useradd': 'User Add',
+  'userAdd.cancel': 'Cancel',
+  'userAdd.save': 'Save',
+  'userAdd.email': 'Email',
+  'userAdd.password': 'Password',
+  'userAdd.department': 'Department:',
+  'userAdd.position': 'Position:',
+  'userAdd.type': 'Recruitment Type:',
+  'userAdd.date': 'Trial Start and End Date:',
+  'userAdd.during': 'Probation Period:',
+  'userAdd.startTime': 'Labor Contract Start Date:',
+  'userAdd.endTime': 'Labor Contract End Date:',
+  'userAdd.first': 'Start Time',
+  'userAdd.last': 'End Time',
+  'userAdd.name': 'UserName',
+  'userAdd.address': 'Address',
+  'userAdd.status': 'Status',
+};
diff --git a/packages/toolkits/pro/template/tinyvue/src/views/userManager/useradd/locale/zh-CN.ts b/packages/toolkits/pro/template/tinyvue/src/views/userManager/useradd/locale/zh-CN.ts
new file mode 100644
index 00000000..c5ab8033
--- /dev/null
+++ b/packages/toolkits/pro/template/tinyvue/src/views/userManager/useradd/locale/zh-CN.ts
@@ -0,0 +1,19 @@
+export default {
+  'menu.allUser.useradd': '添加用户',
+  'userAdd.save': '提交',
+  'userAdd.cancel': '取消',
+  'userAdd.email': '邮箱',
+  'userAdd.password': '密码',
+  'userAdd.department': '所属部门:',
+  'userAdd.position': '职位:',
+  'userAdd.type': '招聘类型:',
+  'userAdd.date': '试用起止日期:',
+  'userAdd.during': '试用期时长:',
+  'userAdd.startTime': '劳动合同开始日期:',
+  'userAdd.endTime': '劳动合同结束日期:',
+  'userAdd.first': '开始时间',
+  'userAdd.last': '结束时间',
+  'userAdd.name': '用户名',
+  'userAdd.address': '地址',
+  'userAdd.status': '状态',
+};