Просмотр исходного кода

增加账号管理页面及优化

zuohuaijun 3 лет назад
Родитель
Сommit
94cf027e9a
28 измененных файлов с 519 добавлено и 797 удалено
  1. 4 4
      Admin.NET/Admin.NET.Core/Admin.NET.Core.csproj
  2. 31 101
      Admin.NET/Admin.NET.Core/Admin.NET.Core.xml
  3. 1 1
      Admin.NET/Admin.NET.Core/Entity/SysConfig.cs
  4. 1 1
      Admin.NET/Admin.NET.Core/Entity/SysDataResource.cs
  5. 1 1
      Admin.NET/Admin.NET.Core/Entity/SysDictData.cs
  6. 1 1
      Admin.NET/Admin.NET.Core/Entity/SysDictType.cs
  7. 1 1
      Admin.NET/Admin.NET.Core/Entity/SysMenu.cs
  8. 1 1
      Admin.NET/Admin.NET.Core/Entity/SysOrg.cs
  9. 1 1
      Admin.NET/Admin.NET.Core/Entity/SysPos.cs
  10. 1 1
      Admin.NET/Admin.NET.Core/Entity/SysRole.cs
  11. 6 0
      Admin.NET/Admin.NET.Core/Entity/SysTenant.cs
  12. 6 0
      Admin.NET/Admin.NET.Core/Entity/SysTimer.cs
  13. 23 17
      Admin.NET/Admin.NET.Core/Entity/SysUser.cs
  14. 7 97
      Admin.NET/Admin.NET.Core/Service/User/Dto/UserInput.cs
  15. 1 1
      vue-next-admin/.env.development
  16. 1 1
      vue-next-admin/.env.production
  17. 5 1
      vue-next-admin/src/theme/element.scss
  18. 5 4
      vue-next-admin/src/utils/axios-utils.ts
  19. 5 8
      vue-next-admin/src/views/system/menu/component/editMenu.vue
  20. 13 15
      vue-next-admin/src/views/system/menu/index.vue
  21. 5 8
      vue-next-admin/src/views/system/org/component/editOrg.vue
  22. 10 17
      vue-next-admin/src/views/system/org/component/orgTree.vue
  23. 18 21
      vue-next-admin/src/views/system/org/index.vue
  24. 5 8
      vue-next-admin/src/views/system/pos/component/editPos.vue
  25. 14 16
      vue-next-admin/src/views/system/pos/index.vue
  26. 0 200
      vue-next-admin/src/views/system/user/component/addUser.vue
  27. 150 129
      vue-next-admin/src/views/system/user/component/editUser.vue
  28. 202 141
      vue-next-admin/src/views/system/user/index.vue

+ 4 - 4
Admin.NET/Admin.NET.Core/Admin.NET.Core.csproj

@@ -24,9 +24,9 @@
 
   <ItemGroup>
     <PackageReference Include="AspNetCoreRateLimit" Version="4.0.2" />
-    <PackageReference Include="Furion.Extras.Authentication.JwtBearer" Version="4.5.9" />
-    <PackageReference Include="Furion.Extras.ObjectMapper.Mapster" Version="4.5.9" />
-    <PackageReference Include="Furion.Pure" Version="4.5.9" />
+    <PackageReference Include="Furion.Extras.Authentication.JwtBearer" Version="4.6.0" />
+    <PackageReference Include="Furion.Extras.ObjectMapper.Mapster" Version="4.6.0" />
+    <PackageReference Include="Furion.Pure" Version="4.6.0" />
     <PackageReference Include="Magicodes.IE.Excel" Version="2.6.4" />
     <PackageReference Include="Magicodes.IE.Pdf" Version="2.6.4" />
     <PackageReference Include="Microsoft.AspNetCore.Mvc.NewtonsoftJson" Version="6.0.9" />
@@ -36,7 +36,7 @@
     <PackageReference Include="OnceMi.AspNetCore.OSS" Version="1.1.8" />
     <PackageReference Include="SKIT.FlurlHttpClient.Wechat.Api" Version="2.17.0" />
     <PackageReference Include="SKIT.FlurlHttpClient.Wechat.TenpayV3" Version="2.13.1" />
-    <PackageReference Include="SqlSugarCore" Version="5.1.3.24" />
+    <PackageReference Include="SqlSugarCore" Version="5.1.3.25-preview01" />
     <PackageReference Include="System.Linq.Dynamic.Core" Version="1.2.20" />
     <PackageReference Include="UAParser" Version="3.1.47" />
     <PackageReference Include="Yitter.IdGenerator" Version="1.0.14" />

+ 31 - 101
Admin.NET/Admin.NET.Core/Admin.NET.Core.xml

@@ -1275,6 +1275,11 @@
             架构
             </summary>
         </member>
+        <member name="P:Admin.NET.Core.SysTenant.Order">
+            <summary>
+            排序
+            </summary>
+        </member>
         <member name="P:Admin.NET.Core.SysTenant.Remark">
             <summary>
             备注
@@ -1341,6 +1346,11 @@
             Headers参数 比如{"Authorization":"userpassword"}
             </summary>
         </member>
+        <member name="P:Admin.NET.Core.SysTimer.Order">
+            <summary>
+            排序
+            </summary>
+        </member>
         <member name="P:Admin.NET.Core.SysTimer.Remark">
             <summary>
             备注
@@ -1358,7 +1368,7 @@
         </member>
         <member name="P:Admin.NET.Core.SysUser.Password">
             <summary>
-            密码(默认MD5加密)
+            账号密码(MD5加密)
             </summary>
         </member>
         <member name="P:Admin.NET.Core.SysUser.NickName">
@@ -1416,16 +1426,6 @@
             账号类型-超级管理员_1、管理员_2、普通_3
             </summary>
         </member>
-        <member name="P:Admin.NET.Core.SysUser.Remark">
-            <summary>
-            备注
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.SysUser.Status">
-            <summary>
-            状态
-            </summary>
-        </member>
         <member name="P:Admin.NET.Core.SysUser.OrgId">
             <summary>
             机构Id
@@ -1456,6 +1456,21 @@
             岗位状态
             </summary>
         </member>
+        <member name="P:Admin.NET.Core.SysUser.Order">
+            <summary>
+            排序
+            </summary>
+        </member>
+        <member name="P:Admin.NET.Core.SysUser.Status">
+            <summary>
+            状态
+            </summary>
+        </member>
+        <member name="P:Admin.NET.Core.SysUser.Remark">
+            <summary>
+            备注
+            </summary>
+        </member>
         <member name="T:Admin.NET.Core.SysUserExtOrgPos">
             <summary>
             系统用户附属机构职位表
@@ -6558,101 +6573,11 @@
             职位名称
             </summary>
         </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.UserName">
-            <summary>
-            账号
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.Password">
-            <summary>
-            密码(默认MD5加密)
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.NickName">
-            <summary>
-            昵称
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.Avatar">
-            <summary>
-            头像
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.Birthday">
-            <summary>
-            出生日期
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.Sex">
-            <summary>
-            性别
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.Email">
-            <summary>
-            邮箱
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.Phone">
-            <summary>
-            手机号码
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.RealName">
-            <summary>
-            真实姓名
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.IdCard">
-            <summary>
-            身份证号
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.Signature">
-            <summary>
-            个性签名
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.Introduction">
-            <summary>
-            个人简介
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.UserType">
-            <summary>
-            账号类型-超级管理员_1、管理员_2、普通_3
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.Remark">
-            <summary>
-            备注
-            </summary>
-        </member>
         <member name="P:Admin.NET.Core.Service.UserInput.Status">
             <summary>
             状态
             </summary>
         </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.OrgId">
-            <summary>
-            机构Id
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.PosId">
-            <summary>
-            职位Id
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.JobNum">
-            <summary>
-            工号
-            </summary>
-        </member>
-        <member name="P:Admin.NET.Core.Service.UserInput.JobStatus">
-            <summary>
-            岗位状态
-            </summary>
-        </member>
         <member name="P:Admin.NET.Core.Service.PageUserInput.UserName">
             <summary>
             账号
@@ -6678,6 +6603,11 @@
             真实姓名
             </summary>
         </member>
+        <member name="P:Admin.NET.Core.Service.AddUserInput.Password">
+            <summary>
+            账号密码
+            </summary>
+        </member>
         <member name="P:Admin.NET.Core.Service.DeleteUserInput.OrgId">
             <summary>
             机构Id

+ 1 - 1
Admin.NET/Admin.NET.Core/Entity/SysConfig.cs

@@ -44,7 +44,7 @@ public class SysConfig : EntityBase
     /// 排序
     /// </summary>
     [SugarColumn(ColumnDescription = "排序")]
-    public int Order { get; set; }
+    public int Order { get; set; } = 100;
 
     /// <summary>
     /// 备注

+ 1 - 1
Admin.NET/Admin.NET.Core/Entity/SysDataResource.cs

@@ -37,7 +37,7 @@ public class SysDataResource : EntityBase
     /// 排序
     ///</summary>
     [SugarColumn(ColumnDescription = "排序")]
-    public int Order { get; set; }
+    public int Order { get; set; } = 100;
 
     /// <summary>
     /// 备注

+ 1 - 1
Admin.NET/Admin.NET.Core/Entity/SysDictData.cs

@@ -37,7 +37,7 @@ public class SysDictData : EntityBase
     /// 排序
     /// </summary>
     [SugarColumn(ColumnDescription = "排序")]
-    public int Order { get; set; }
+    public int Order { get; set; } = 100;
 
     /// <summary>
     /// 备注

+ 1 - 1
Admin.NET/Admin.NET.Core/Entity/SysDictType.cs

@@ -24,7 +24,7 @@ public class SysDictType : EntityBase
     /// 排序
     /// </summary>
     [SugarColumn(ColumnDescription = "排序")]
-    public int Order { get; set; }
+    public int Order { get; set; } = 100;
 
     /// <summary>
     /// 备注

+ 1 - 1
Admin.NET/Admin.NET.Core/Entity/SysMenu.cs

@@ -102,7 +102,7 @@ public class SysMenu : EntityBase
     /// 排序
     /// </summary>
     [SugarColumn(ColumnDescription = "排序")]
-    public int Order { get; set; }
+    public int Order { get; set; } = 100;
 
     /// <summary>
     /// 状态

+ 1 - 1
Admin.NET/Admin.NET.Core/Entity/SysOrg.cs

@@ -30,7 +30,7 @@ public class SysOrg : EntityTenant
     /// 排序
     /// </summary>
     [SugarColumn(ColumnDescription = "排序")]
-    public int Order { get; set; }
+    public int Order { get; set; } = 100;
 
     /// <summary>
     /// 备注

+ 1 - 1
Admin.NET/Admin.NET.Core/Entity/SysPos.cs

@@ -24,7 +24,7 @@ public class SysPos : EntityTenant
     /// 排序
     /// </summary>
     [SugarColumn(ColumnDescription = "排序")]
-    public int Order { get; set; }
+    public int Order { get; set; } = 100;
 
     /// <summary>
     /// 备注

+ 1 - 1
Admin.NET/Admin.NET.Core/Entity/SysRole.cs

@@ -24,7 +24,7 @@ public class SysRole : EntityTenant
     /// 排序
     /// </summary>
     [SugarColumn(ColumnDescription = "排序")]
-    public int Order { get; set; }
+    public int Order { get; set; } = 100;
 
     /// <summary>
     /// 数据范围(1全部数据 2本部门及以下数据 3本部门数据 4仅本人数据 5自定义数据)

+ 6 - 0
Admin.NET/Admin.NET.Core/Entity/SysTenant.cs

@@ -55,6 +55,12 @@ public class SysTenant : EntityBase
     [MaxLength(64)]
     public string Schema { get; set; }
 
+    /// <summary>
+    /// 排序
+    /// </summary>
+    [SugarColumn(ColumnDescription = "排序")]
+    public int Order { get; set; } = 100;
+
     /// <summary>
     /// 备注
     /// </summary>

+ 6 - 0
Admin.NET/Admin.NET.Core/Entity/SysTimer.cs

@@ -76,6 +76,12 @@ public class SysTimer : EntityBase
     [SugarColumn(ColumnDescription = "Headers参数")]
     public string Headers { get; set; }
 
+    /// <summary>
+    /// 排序
+    /// </summary>
+    [SugarColumn(ColumnDescription = "排序")]
+    public int Order { get; set; } = 100;
+
     /// <summary>
     /// 备注
     /// </summary>

+ 23 - 17
Admin.NET/Admin.NET.Core/Entity/SysUser.cs

@@ -14,7 +14,7 @@ public class SysUser : EntityTenant
     public virtual string UserName { get; set; }
 
     /// <summary>
-    /// 密码(默认MD5加密)
+    /// 账号密码(MD5加密)
     /// </summary>
     [SugarColumn(ColumnDescription = "账号密码", Length = 64)]
     [Required, MaxLength(64)]
@@ -60,21 +60,21 @@ public class SysUser : EntityTenant
     /// </summary>
     [SugarColumn(ColumnDescription = "手机号码", Length = 16)]
     [MaxLength(16)]
-    public string Phone { get; set; }
+    public virtual string Phone { get; set; }
 
     /// <summary>
     /// 真实姓名
     /// </summary>
     [SugarColumn(ColumnDescription = "真实姓名", Length = 32)]
     [MaxLength(32)]
-    public string RealName { get; set; }
+    public virtual string RealName { get; set; }
 
     /// <summary>
     /// 身份证号
     /// </summary>
     [SugarColumn(ColumnDescription = "身份证号", Length = 32)]
     [MaxLength(32)]
-    public string IdCard { get; set; }
+    public virtual string IdCard { get; set; }
 
     /// <summary>
     /// 个性签名
@@ -96,19 +96,6 @@ public class SysUser : EntityTenant
     [SugarColumn(ColumnDescription = "账号类型")]
     public UserTypeEnum UserType { get; set; } = UserTypeEnum.None;
 
-    /// <summary>
-    /// 备注
-    /// </summary>
-    [SugarColumn(ColumnDescription = "备注", Length = 128)]
-    [MaxLength(128)]
-    public string Remark { get; set; }
-
-    /// <summary>
-    /// 状态
-    /// </summary>
-    [SugarColumn(ColumnDescription = "状态")]
-    public StatusEnum Status { get; set; } = StatusEnum.Enable;
-
     /// <summary>
     /// 机构Id
     /// </summary>
@@ -147,4 +134,23 @@ public class SysUser : EntityTenant
     /// </summary>
     [SugarColumn(ColumnDescription = "岗位状态")]
     public JobStatusEnum JobStatus { get; set; } = JobStatusEnum.On;
+
+    /// <summary>
+    /// 排序
+    /// </summary>
+    [SugarColumn(ColumnDescription = "排序")]
+    public int Order { get; set; } = 100;
+
+    /// <summary>
+    /// 状态
+    /// </summary>
+    [SugarColumn(ColumnDescription = "状态")]
+    public StatusEnum Status { get; set; } = StatusEnum.Enable;
+
+    /// <summary>
+    /// 备注
+    /// </summary>
+    [SugarColumn(ColumnDescription = "备注", Length = 128)]
+    [MaxLength(128)]
+    public string Remark { get; set; }
 }

+ 7 - 97
Admin.NET/Admin.NET.Core/Service/User/Dto/UserInput.cs

@@ -2,101 +2,10 @@
 
 public class UserInput : BaseIdInput
 {
-    /// <summary>
-    /// 账号
-    /// </summary>
-    public virtual string UserName { get; set; }
-
-    /// <summary>
-    /// 密码(默认MD5加密)
-    /// </summary>
-    public virtual string Password { get; set; }
-
-    /// <summary>
-    /// 昵称
-    /// </summary>
-    public virtual string NickName { get; set; }
-
-    /// <summary>
-    /// 头像
-    /// </summary>
-    public virtual string Avatar { get; set; }
-
-    /// <summary>
-    /// 出生日期
-    /// </summary>
-    public virtual DateTime? Birthday { get; set; }
-
-    /// <summary>
-    /// 性别
-    /// </summary>
-    public virtual int Sex { get; set; } = 1;
-
-    /// <summary>
-    /// 邮箱
-    /// </summary>
-    public virtual string Email { get; set; }
-
-    /// <summary>
-    /// 手机号码
-    /// </summary>
-    public virtual string Phone { get; set; }
-
-    /// <summary>
-    /// 真实姓名
-    /// </summary>
-    public virtual string RealName { get; set; }
-
-    /// <summary>
-    /// 身份证号
-    /// </summary>
-    public virtual string IdCard { get; set; }
-
-    /// <summary>
-    /// 个性签名
-    /// </summary>
-    public virtual string Signature { get; set; }
-
-    /// <summary>
-    /// 个人简介
-    /// </summary>
-    public virtual string Introduction { get; set; }
-
-    /// <summary>
-    /// 账号类型-超级管理员_1、管理员_2、普通_3
-    /// </summary>
-    public virtual int UserType { get; set; }
-
-    /// <summary>
-    /// 备注
-    /// </summary>
-    [MaxLength(100)]
-    public virtual string Remark { get; set; }
-
     /// <summary>
     /// 状态
     /// </summary>
     public virtual int Status { get; set; }
-
-    /// <summary>
-    /// 机构Id
-    /// </summary>
-    public virtual long OrgId { get; set; }
-
-    /// <summary>
-    /// 职位Id
-    /// </summary>
-    public virtual long PosId { get; set; }
-
-    /// <summary>
-    /// 工号
-    /// </summary>
-    public virtual string JobNum { get; set; }
-
-    /// <summary>
-    /// 岗位状态
-    /// </summary>
-    public virtual int JobStatus { get; set; }
 }
 
 public class PageUserInput : BasePageInput
@@ -117,7 +26,8 @@ public class PageUserInput : BasePageInput
     public long OrgId { get; set; }
 }
 
-public class AddUserInput : UserInput
+[NotTable]
+public class AddUserInput : SysUser
 {
     /// <summary>
     /// 账号名称
@@ -131,13 +41,13 @@ public class AddUserInput : UserInput
     [Required(ErrorMessage = "真实姓名不能为空")]
     public override string RealName { get; set; }
 
-    ///// <summary>
-    ///// 身份证号
-    ///// </summary>
-    //[Required(ErrorMessage = "身份证号不能为空")]
-    //public override string IdCard { get; set; }
+    /// <summary>
+    /// 账号密码
+    /// </summary>
+    public override string Password { get; set; } = CommonConst.SysPassword;
 }
 
+[NotTable]
 public class UpdateUserInput : AddUserInput
 {
 }

+ 1 - 1
vue-next-admin/.env.development

@@ -2,4 +2,4 @@
 ENV = 'development'
 
 # 本地环境接口地址
-VITE_API_URL = 'http://localhost:8888/'
+VITE_API_URL = 'https://localhost:44326'

+ 1 - 1
vue-next-admin/.env.production

@@ -2,4 +2,4 @@
 ENV = 'production'
 
 # 线上环境接口地址
-VITE_API_URL = ''
+VITE_API_URL = 'https://*:5005'

+ 5 - 1
vue-next-admin/src/theme/element.scss

@@ -68,7 +68,7 @@
 // 鼠标 hover 时颜色
 .el-menu-hover-bg-color {
 	background-color: var(--el-color-primary-light-8) !important;
-	// border-right: solid 2px var(--el-color-primary);
+	// border-right: solid 3px var(--el-color-primary);
 }
 // 默认样式修改
 .el-menu {
@@ -113,6 +113,10 @@
 .el-sub-menu.is-active.is-opened .el-sub-menu__title {
 	background-color: unset !important;
 }
+// 当前选中菜单右侧边框
+.el-menu-item.is-active {
+	border-right: solid 3px var(--el-color-primary);
+}
 // 鼠标 hover 时背景色
 .el-menu-item:hover {
 	background-color: var(--el-color-primary-light-9)

+ 5 - 4
vue-next-admin/src/utils/axios-utils.ts

@@ -20,10 +20,11 @@ import { Local, Session } from '/@/utils/storage';
 export const serveConfig = new Configuration({
 	// 如果是 Angular 项目,则取消下面注释,并删除 process.env.NODE_ENV !== "production"
 	// basePath: !environment.production
-	basePath:
-		process.env.NODE_ENV !== 'production'
-			? 'https://localhost:44326' // 开发环境服务器接口地址
-			: 'https://*:5005', // 生产环境服务器接口地址
+	// basePath:
+	// 	process.env.NODE_ENV !== 'production'
+	// 		? 'https://localhost:44326' // 开发环境服务器接口地址
+	// 		: 'https://*:5005', // 生产环境服务器接口地址
+	basePath: import.meta.env.VITE_API_URL,
 });
 
 // token 键定义

+ 5 - 8
vue-next-admin/src/views/system/menu/component/editMenu.vue

@@ -219,17 +219,14 @@ export default defineComponent({
 			// 取父节点Id
 			if (Array.isArray(state.ruleForm.pid))
 				state.ruleForm.pid = state.ruleForm.pid[state.ruleForm.pid.length - 1];
-			formWrap.validate(() => {
-				if (state.ruleForm.id != undefined && state.ruleForm.id != 0) {
-					getAPI(SysMenuApi).sysMenuUpdatePost(state.ruleForm).then(() => {
-						closeDialog();
-					})
+			formWrap.validate(async () => {
+				if (state.ruleForm.id != undefined && state.ruleForm.id > 0) {
+					await getAPI(SysMenuApi).sysMenuUpdatePost(state.ruleForm);
 				}
 				else {
-					getAPI(SysMenuApi).sysMenuAddPost(state.ruleForm).then(() => {
-						closeDialog();
-					})
+					await getAPI(SysMenuApi).sysMenuAddPost(state.ruleForm);
 				}
+				closeDialog();
 			})
 		};
 		return {

+ 13 - 15
vue-next-admin/src/views/system/menu/index.vue

@@ -35,14 +35,14 @@
 
     <el-card shadow="hover" style="margin-top: 5px;">
       <el-table :data="menuData" v-loading="loading" row-key="id"
-        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
+        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" border>
         <el-table-column label="菜单名称" show-overflow-tooltip>
           <template #default="scope">
             <SvgIcon :name="scope.row.icon" />
             <span class="ml10">{{ $t(scope.row.title) }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="类型" show-overflow-tooltip width="80" align="center">
+        <el-table-column label="类型" width="70" align="center" show-overflow-tooltip>
           <template #default="scope">
             <el-tag type="warning" v-if="scope.row.type === 1">目录</el-tag>
             <el-tag v-else-if="scope.row.type === 2">菜单</el-tag>
@@ -52,17 +52,17 @@
         <el-table-column prop="path" label="路由路径" show-overflow-tooltip></el-table-column>
         <el-table-column prop="component" label="组件路径" show-overflow-tooltip></el-table-column>
         <el-table-column prop="permission" label="权限标识" show-overflow-tooltip></el-table-column>
-        <el-table-column prop="order" label="排序" show-overflow-tooltip width="80" align="center">
+        <el-table-column prop="order" label="排序" width="70" align="center" show-overflow-tooltip>
         </el-table-column>
-        <el-table-column label="状态" show-overflow-tooltip width="80" align="center">
+        <el-table-column label="状态" width="80" align="center" show-overflow-tooltip>
           <template #default="scope">
             <el-tag type="success" v-if="scope.row.status === 1">启用</el-tag>
             <el-tag type="danger" v-else>禁用</el-tag>
           </template>
         </el-table-column>
-        <el-table-column prop="createTime" label="修改时间" show-overflow-tooltip align="center">
+        <el-table-column prop="createTime" label="修改时间" align="center" show-overflow-tooltip>
         </el-table-column>
-        <el-table-column label="操作" show-overflow-tooltip width="80" fixed="right" align="center">
+        <el-table-column label="操作" width="80" fixed="right" align="center" show-overflow-tooltip>
           <template #default="scope">
             <el-button size="small" text type="primary" @click="openEditMenu(scope.row)">
               <el-icon>
@@ -118,12 +118,11 @@ export default defineComponent({
     });
 
     // 查询操作
-    const handleQuery = () => {
+    const handleQuery = async () => {
       state.loading = true;
-      getAPI(SysMenuApi).sysMenuListGet(state.queryParams.title, state.queryParams.type).then((res) => {
-        state.menuData = res.data.result;
-        state.loading = false;
-      });
+      var res = await getAPI(SysMenuApi).sysMenuListGet(state.queryParams.title, state.queryParams.type);
+      state.menuData = res.data.result;
+      state.loading = false;
     };
     // 重置操作
     const resetQuery = () => {
@@ -149,10 +148,9 @@ export default defineComponent({
         type: 'warning',
       })
         .then(async () => {
-          getAPI(SysMenuApi).sysMenuDeletePost({ id: row.id }).then(() => {
-            handleQuery();
-            ElMessage.success('删除成功');
-          })
+          await getAPI(SysMenuApi).sysMenuDeletePost({ id: row.id });
+          handleQuery();
+          ElMessage.success('删除成功');
         })
         .catch(() => { });
     };

+ 5 - 8
vue-next-admin/src/views/system/org/component/editOrg.vue

@@ -123,17 +123,14 @@ export default defineComponent({
 			// 取父节点Id
 			if (Array.isArray(state.ruleForm.pid))
 				state.ruleForm.pid = state.ruleForm.pid[state.ruleForm.pid.length - 1];
-			formWrap.validate(() => {
-				if (state.ruleForm.id != undefined && state.ruleForm.id != 0) {
-					getAPI(SysOrgApi).sysOrgUpdatePost(state.ruleForm).then(() => {
-						closeDialog();
-					})
+			formWrap.validate(async () => {
+				if (state.ruleForm.id != undefined && state.ruleForm.id > 0) {
+					await getAPI(SysOrgApi).sysOrgUpdatePost(state.ruleForm);
 				}
 				else {
-					getAPI(SysOrgApi).sysOrgAddPost(state.ruleForm).then(() => {
-						closeDialog();
-					})
+					await getAPI(SysOrgApi).sysOrgAddPost(state.ruleForm);
 				}
+				closeDialog();
 			})
 		};
 		return {

+ 10 - 17
vue-next-admin/src/views/system/org/component/orgTree.vue

@@ -26,7 +26,7 @@
         </div>
       </div>
     </template>
-    <div style='margin-bottom: 45px'>
+    <div style="margin-bottom: 45px" v-loading="state.loading">
       <el-tree ref='treeRef' class='filter-tree' :data='state.orgData' :props='defaultProps'
         :filter-node-method='filterNode' @node-click="nodeClick" />
     </div>
@@ -54,31 +54,24 @@ const defaultProps = {
   label: 'name',
 };
 
-const props = defineProps({
-  maInit: Boolean,
-});
-
 const state = reactive({
   loading: true,
   orgData: [] as any,
 });
 
 onMounted(() => {
-  if (props.maInit == false) {
-    initTreeData();
-  }
+  initTreeData();
 });
 
 watch(filterText, (val) => {
   treeRef.value!.filter(val);
 });
 
-const initTreeData = () => {
+const initTreeData = async () => {
   state.loading = true;
-  getAPI(SysOrgApi).sysOrgListGet(0).then((res) => {
-    state.orgData = res.data.result;
-    state.loading = false;
-  })
+  var res = await getAPI(SysOrgApi).sysOrgListGet(0);
+  state.orgData = res.data.result;
+  state.loading = false;
 };
 
 const filterNode = (value: string, data: Tree) => {
@@ -107,10 +100,10 @@ const emits = defineEmits(['node-click']);
 const nodeClick = (node: any) => {
   emits('node-click', { id: node.id, name: node.name });
 };
-// const init = () => {
-//   initTreeData();
-// };
-// defineExpose({ init });
+
+const orgTreeData = state.orgData; // 异步数据导出不了?
+// 导出
+defineExpose({ orgTreeData });
 </script>
 
 <style scoped>

+ 18 - 21
vue-next-admin/src/views/system/org/index.vue

@@ -40,21 +40,22 @@
 				</el-card>
 
 				<el-card shadow="hover" style="margin-top: 5px;">
-					<el-table :data="orgData" style="width: 100%" row-key="id" default-expand-all
-						:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
+					<el-table :data="orgData" style="width: 100%" v-loading="loading" row-key="id" default-expand-all
+						:tree-props="{ children: 'children', hasChildren: 'hasChildren' }" border>
 						<el-table-column prop="name" label="机构名称" show-overflow-tooltip> </el-table-column>
 						<el-table-column prop="code" label="机构编码" show-overflow-tooltip></el-table-column>
-						<el-table-column prop="order" label="排序" show-overflow-tooltip width="80" align="center">
+						<el-table-column prop="order" label="排序" width="70" align="center" show-overflow-tooltip>
 						</el-table-column>
-						<el-table-column prop="status" label="状态" show-overflow-tooltip width="80" align="center">
+						<el-table-column label="状态" width="70" align="center" show-overflow-tooltip>
 							<template #default="scope">
 								<el-tag type="success" v-if="scope.row.status === 1">启用</el-tag>
 								<el-tag type="danger" v-else>禁用</el-tag>
 							</template>
 						</el-table-column>
-						<el-table-column prop="createTime" label="修改时间" show-overflow-tooltip></el-table-column>
+						<el-table-column prop="createTime" label="修改时间" align="center" show-overflow-tooltip>
+						</el-table-column>
 						<el-table-column prop="remark" label="备注" show-overflow-tooltip></el-table-column>
-						<el-table-column label="操作" show-overflow-tooltip width="80" fixed="right" align="center">
+						<el-table-column label="操作" width="80" fixed="right" align="center" show-overflow-tooltip>
 							<template #default="scope">
 								<el-button size="small" text type="primary" @click="openEditOrg(scope.row)">
 									<el-icon>
@@ -102,7 +103,7 @@ export default defineComponent({
 			},
 			editOrgTitle: "",
 		});
-		onMounted(async () => {
+		onMounted(() => {
 			handleQuery();
 
 			proxy.mittBus.on("submitRefresh", () => {
@@ -113,17 +114,14 @@ export default defineComponent({
 			proxy.mittBus.off("submitRefresh");
 		});
 		// 查询操作
-		const handleQuery = () => {
+		const handleQuery = async () => {
 			state.loading = true;
-			getAPI(SysOrgApi).sysOrgListGet(state.queryParams.id, state.queryParams.name, state.queryParams.code).then((res) => {
-				state.orgData = res.data.result;
-				state.loading = false;
+			var res = await getAPI(SysOrgApi).sysOrgListGet(state.queryParams.id, state.queryParams.name, state.queryParams.code);
+			state.orgData = res.data.result;
+			state.loading = false;
 
-				if (state.queryParams.id == -1) {
-					state.orgTreeData = state.orgData;
-					console.log(state.orgTreeData)
-				}
-			});
+			if (state.queryParams.id == -1)
+				state.orgTreeData = state.orgData;
 		};
 		// 重置操作
 		const resetQuery = () => {
@@ -149,11 +147,10 @@ export default defineComponent({
 				cancelButtonText: '取消',
 				type: 'warning',
 			})
-				.then(() => {
-					getAPI(SysOrgApi).sysOrgDeletePost({ id: row.id }).then(() => {
-						handleQuery();
-						ElMessage.success('删除成功');
-					})
+				.then(async () => {
+					await getAPI(SysOrgApi).sysOrgDeletePost({ id: row.id });
+					handleQuery();
+					ElMessage.success('删除成功');
 				})
 				.catch(() => { });
 		};

+ 5 - 8
vue-next-admin/src/views/system/pos/component/editPos.vue

@@ -103,17 +103,14 @@ export default defineComponent({
 			const formWrap = unref(ruleFormRef) as any;
 			if (!formWrap) return;
 
-			formWrap.validate(() => {
-				if (state.ruleForm.id != undefined && state.ruleForm.id != 0) {
-					getAPI(SysPosApi).sysPosUpdatePost(state.ruleForm).then(() => {
-						closeDialog();
-					})
+			formWrap.validate(async () => {
+				if (state.ruleForm.id != undefined && state.ruleForm.id > 0) {
+					await getAPI(SysPosApi).sysPosUpdatePost(state.ruleForm);
 				}
 				else {
-					getAPI(SysPosApi).sysPosAddPost(state.ruleForm).then(() => {
-						closeDialog();
-					})
+					await getAPI(SysPosApi).sysPosAddPost(state.ruleForm);
 				}
+				closeDialog();
 			})
 		};
 		return {

+ 14 - 16
vue-next-admin/src/views/system/pos/index.vue

@@ -32,21 +32,21 @@
 		</el-card>
 
 		<el-card shadow="hover" style="margin-top: 5px;">
-			<el-table :data="posData" style="width: 100%">
-				<el-table-column type="index" label="序号" width="80" />
+			<el-table :data="posData" style="width: 100%" v-loading="loading" border>
+				<el-table-column type="index" label="序号" width="55" align="center" />
 				<el-table-column prop="name" label="职位名称" show-overflow-tooltip></el-table-column>
 				<el-table-column prop="code" label="职位编码" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="order" label="排序" show-overflow-tooltip width="80" align="center">
+				<el-table-column prop="order" label="排序" width="70" align="center" show-overflow-tooltip>
 				</el-table-column>
-				<el-table-column prop="status" label="状态" show-overflow-tooltip width="80" align="center">
+				<el-table-column label="状态" width="70" align="center" show-overflow-tooltip>
 					<template #default="scope">
 						<el-tag type="success" v-if="scope.row.status === 1">启用</el-tag>
 						<el-tag type="danger" v-else>禁用</el-tag>
 					</template>
 				</el-table-column>
-				<el-table-column prop="createTime" label="修改时间" show-overflow-tooltip></el-table-column>
+				<el-table-column prop="createTime" label="修改时间" align="center" show-overflow-tooltip></el-table-column>
 				<el-table-column prop="remark" label="备注" show-overflow-tooltip></el-table-column>
-				<el-table-column label="操作" show-overflow-tooltip width="80" fixed="right" align="center">
+				<el-table-column label="操作" width="80" fixed="right" align="center" show-overflow-tooltip>
 					<template #default="scope">
 						<el-button size="small" text type="primary" @click="openEditPos(scope.row)">
 							<el-icon>
@@ -101,12 +101,11 @@ export default defineComponent({
 		});
 
 		// 查询操作
-		const handleQuery = () => {
+		const handleQuery = async () => {
 			state.loading = true;
-			getAPI(SysPosApi).sysPosListGet(state.queryParams.name, state.queryParams.code).then((res) => {
-				state.posData = res.data.result;
-				state.loading = false;
-			});
+			var res = await getAPI(SysPosApi).sysPosListGet(state.queryParams.name, state.queryParams.code);
+			state.posData = res.data.result;
+			state.loading = false;
 		};
 		// 重置操作
 		const resetQuery = () => {
@@ -131,11 +130,10 @@ export default defineComponent({
 				cancelButtonText: '取消',
 				type: 'warning',
 			})
-				.then(() => {
-					getAPI(SysPosApi).sysPosDeletePost({ id: row.id }).then(() => {
-						handleQuery();
-						ElMessage.success('删除成功');
-					})
+				.then(async () => {
+					await getAPI(SysPosApi).sysPosDeletePost({ id: row.id });
+					handleQuery();
+					ElMessage.success('删除成功');
 				})
 				.catch(() => { });
 		};

+ 0 - 200
vue-next-admin/src/views/system/user/component/addUser.vue

@@ -1,200 +0,0 @@
-<template>
-	<div class="system-add-user-container">
-		<el-dialog title="新增用户" v-model="isShowDialog" width="769px">
-			<el-form :model="ruleForm" size="default" label-width="90px">
-				<el-row :gutter="35">
-					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="账户名称">
-							<el-input v-model="ruleForm.userName" placeholder="请输入账户名称" clearable></el-input>
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="用户昵称">
-							<el-input v-model="ruleForm.userNickname" placeholder="请输入用户昵称" clearable></el-input>
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="关联角色">
-							<el-select v-model="ruleForm.roleSign" placeholder="请选择" clearable class="w100">
-								<el-option label="超级管理员" value="admin"></el-option>
-								<el-option label="普通用户" value="common"></el-option>
-							</el-select>
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="部门">
-							<el-cascader
-								:options="deptData"
-								:props="{ checkStrictly: true, value: 'deptName', label: 'deptName' }"
-								placeholder="请选择部门"
-								clearable
-								class="w100"
-								v-model="ruleForm.department"
-							>
-								<template #default="{ node, data }">
-									<span>{{ data.deptName }}</span>
-									<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
-								</template>
-							</el-cascader>
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="手机号">
-							<el-input v-model="ruleForm.phone" placeholder="请输入手机号" clearable></el-input>
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="邮箱">
-							<el-input v-model="ruleForm.email" placeholder="请输入" clearable></el-input>
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="性别">
-							<el-select v-model="ruleForm.sex" placeholder="请选择" clearable class="w100">
-								<el-option label="男" value="男"></el-option>
-								<el-option label="女" value="女"></el-option>
-							</el-select>
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="账户密码">
-							<el-input v-model="ruleForm.password" placeholder="请输入" type="password" clearable></el-input>
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="账户过期">
-							<el-date-picker v-model="ruleForm.overdueTime" type="date" placeholder="请选择" class="w100"> </el-date-picker>
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="用户状态">
-							<el-switch v-model="ruleForm.status" inline-prompt active-text="启" inactive-text="禁"></el-switch>
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
-						<el-form-item label="用户描述">
-							<el-input v-model="ruleForm.describe" type="textarea" placeholder="请输入用户描述" maxlength="150"></el-input>
-						</el-form-item>
-					</el-col>
-				</el-row>
-			</el-form>
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button @click="onCancel" size="default">取 消</el-button>
-					<el-button type="primary" @click="onSubmit" size="default">新 增</el-button>
-				</span>
-			</template>
-		</el-dialog>
-	</div>
-</template>
-
-<script lang="ts">
-import { reactive, toRefs, onMounted, defineComponent } from 'vue';
-
-// 定义接口来定义对象的类型
-interface DeptData {
-	deptName: string;
-	createTime: string;
-	status: boolean;
-	sort: number | string;
-	describe: string;
-	id: number;
-	children?: DeptData[];
-}
-interface UserState {
-	isShowDialog: boolean;
-	ruleForm: {
-		userName: string;
-		userNickname: string;
-		roleSign: string;
-		department: any;
-		phone: string;
-		email: string;
-		sex: string;
-		password: string;
-		overdueTime: string;
-		status: boolean;
-		describe: string;
-	};
-	deptData: Array<DeptData>;
-}
-
-export default defineComponent({
-	name: 'systemAddUser',
-	setup() {
-		const state = reactive<UserState>({
-			isShowDialog: false,
-			ruleForm: {
-				userName: '', // 账户名称
-				userNickname: '', // 用户昵称
-				roleSign: '', // 关联角色
-				department: [], // 部门
-				phone: '', // 手机号
-				email: '', // 邮箱
-				sex: '', // 性别
-				password: '', // 账户密码
-				overdueTime: '', // 账户过期
-				status: true, // 用户状态
-				describe: '', // 用户描述
-			},
-			deptData: [], // 部门数据
-		});
-		// 打开弹窗
-		const openDialog = () => {
-			state.isShowDialog = true;
-		};
-		// 关闭弹窗
-		const closeDialog = () => {
-			state.isShowDialog = false;
-		};
-		// 取消
-		const onCancel = () => {
-			closeDialog();
-		};
-		// 新增
-		const onSubmit = () => {
-			closeDialog();
-		};
-		// 初始化部门数据
-		const initTableData = () => {
-			state.deptData.push({
-				deptName: 'vueNextAdmin',
-				createTime: new Date().toLocaleString(),
-				status: true,
-				sort: Math.random(),
-				describe: '顶级部门',
-				id: Math.random(),
-				children: [
-					{
-						deptName: 'IT外包服务',
-						createTime: new Date().toLocaleString(),
-						status: true,
-						sort: Math.random(),
-						describe: '总部',
-						id: Math.random(),
-					},
-					{
-						deptName: '资本控股',
-						createTime: new Date().toLocaleString(),
-						status: true,
-						sort: Math.random(),
-						describe: '分部',
-						id: Math.random(),
-					},
-				],
-			});
-		};
-		// 页面加载时
-		onMounted(() => {
-			initTableData();
-		});
-		return {
-			openDialog,
-			closeDialog,
-			onCancel,
-			onSubmit,
-			...toRefs(state),
-		};
-	},
-});
-</script>

+ 150 - 129
vue-next-admin/src/views/system/user/component/editUser.vue

@@ -1,87 +1,119 @@
 <template>
-	<div class="system-edit-user-container">
-		<el-dialog title="修改用户" v-model="isShowDialog" width="769px">
-			<el-form :model="ruleForm" size="default" label-width="90px">
+	<div class="sys-user-container">
+		<el-dialog v-model="isShowDialog" width="769px">
+			<template #header>
+				<div style="font-size: large" v-drag="['.el-dialog','.el-dialog__header']">
+					{{ title }}
+				</div>
+			</template>
+			<el-form :model="ruleForm" :rules="ruleRules" ref="ruleFormRef" size="default" label-width="80px">
 				<el-row :gutter="35">
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="账户名称">
-							<el-input v-model="ruleForm.userName" placeholder="请输入账户名称" clearable></el-input>
+						<el-form-item label="账号名称" prop="userName">
+							<el-input v-model="ruleForm.userName" placeholder="账号名称" clearable></el-input>
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="用户昵称">
-							<el-input v-model="ruleForm.userNickname" placeholder="请输入用户昵称" clearable></el-input>
+						<el-form-item label="手机号码" prop="phone">
+							<el-input v-model="ruleForm.phone" placeholder="手机号码" clearable></el-input>
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="关联角色">
-							<el-select v-model="ruleForm.roleSign" placeholder="请选择" clearable class="w100">
-								<el-option label="超级管理员" value="admin"></el-option>
-								<el-option label="普通用户" value="common"></el-option>
-							</el-select>
+						<el-form-item label="真实姓名" prop="realName">
+							<el-input v-model="ruleForm.realName" placeholder="真实姓名" clearable></el-input>
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="部门">
-							<el-cascader
-								:options="deptData"
-								:props="{ checkStrictly: true, value: 'deptName', label: 'deptName' }"
-								placeholder="请选择部门"
-								clearable
-								class="w100"
-								v-model="ruleForm.department"
-							>
-								<template #default="{ node, data }">
-									<span>{{ data.deptName }}</span>
-									<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
-								</template>
-							</el-cascader>
+						<el-form-item label="昵称" prop="nickName">
+							<el-input v-model="ruleForm.nickName" placeholder="昵称" clearable></el-input>
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="手机号">
-							<el-input v-model="ruleForm.phone" placeholder="请输入手机号" clearable></el-input>
+						<el-form-item label="出生日期" prop="birthday">
+							<el-date-picker v-model="ruleForm.birthday" type="date" placeholder="出生日期"
+								format="YYYY-MM-DD" value-format="YYYY-MM-DD" style="width: 100%" />
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="邮箱">
-							<el-input v-model="ruleForm.email" placeholder="请输入" clearable></el-input>
+						<el-form-item label="性别" prop="sex">
+							<el-radio-group v-model="ruleForm.sex">
+								<el-radio :label="1">男</el-radio>
+								<el-radio :label="2">女</el-radio>
+							</el-radio-group>
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="性别">
-							<el-select v-model="ruleForm.sex" placeholder="请选择" clearable class="w100">
-								<el-option label="男" value="男"></el-option>
-								<el-option label="女" value="女"></el-option>
-							</el-select>
+						<el-form-item label="证件号码" prop="idCard">
+							<el-input v-model="ruleForm.idCard" placeholder="证件号码" clearable></el-input>
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+						<el-form-item label="邮箱" prop="email">
+							<el-input v-model="ruleForm.email" placeholder="邮箱" clearable></el-input>
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb5">
+						<el-form-item label="排序">
+							<el-input-number v-model="ruleForm.order" controls-position="right" placeholder="排序"
+								class="w100" />
+						</el-form-item>
+					</el-col>
+					<el-divider border-style="dashed" content-position="center">
+						<div style="color: #b1b3b8">其他</div>
+					</el-divider>
+					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
+						<el-form-item label="所属机构">
+							<el-cascader :options="orgData" :props="{ checkStrictly: true, value: 'id', label: 'name' }"
+								placeholder="所属机构" clearable class="w100" v-model="ruleForm.orgId">
+								<template #default="{ node, data }">
+									<span>{{ data.name }}</span>
+									<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
+								</template>
+							</el-cascader>
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="账户密码">
-							<el-input v-model="ruleForm.password" placeholder="请输入" type="password" clearable></el-input>
+						<el-form-item label="职位" prop="posId">
+							<el-select v-model="ruleForm.posId" placeholder="职位" style="width: 100%">
+								<el-option v-for="d in posData" :key="d.id" :label="d.name" :value="d.id" />
+							</el-select>
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="账户过期">
-							<el-date-picker v-model="ruleForm.overdueTime" type="date" placeholder="请选择" class="w100"> </el-date-picker>
+						<el-form-item label="工号" prop="jobNum">
+							<el-input v-model="ruleForm.jobNum" placeholder="所属机构" clearable></el-input>
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
-						<el-form-item label="用户状态">
-							<el-switch v-model="ruleForm.status" inline-prompt active-text="启" inactive-text="禁"></el-switch>
+						<el-form-item label="岗位状态" prop="jobStatus">
+							<el-select v-model="ruleForm.jobStatus" placeholder="岗位状态" style="width: 100%">
+								<el-option v-for="dict in jobStatusType" :key="dict.value" :label="dict.label"
+									:value="dict.value" />
+							</el-select>
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
+						<el-form-item label="个性签名" prop="signature">
+							<el-input v-model="ruleForm.signature" placeholder="个性签名" clearable></el-input>
 						</el-form-item>
 					</el-col>
+					<!-- <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
+						<el-form-item label="本人简介" prop="introduction">
+							<el-input v-model="ruleForm.introduction" placeholder="本人简介" clearable></el-input>
+						</el-form-item>
+					</el-col> -->
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
-						<el-form-item label="用户描述">
-							<el-input v-model="ruleForm.describe" type="textarea" placeholder="请输入用户描述" maxlength="150"></el-input>
+						<el-form-item label="备注">
+							<el-input v-model="ruleForm.remark" placeholder="请输入备注内容" clearable type="textarea">
+							</el-input>
 						</el-form-item>
 					</el-col>
 				</el-row>
 			</el-form>
 			<template #footer>
 				<span class="dialog-footer">
-					<el-button @click="onCancel" size="default">取 消</el-button>
-					<el-button type="primary" @click="onSubmit" size="default">修 改</el-button>
+					<el-button @click="cancel" size="default">取 消</el-button>
+					<el-button type="primary" @click="submit" size="default">确 定</el-button>
 				</span>
 			</template>
 		</el-dialog>
@@ -89,114 +121,103 @@
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, onMounted, defineComponent } from 'vue';
+import { reactive, toRefs, defineComponent, getCurrentInstance, ref, unref, onMounted } from 'vue';
 
-// 定义接口来定义对象的类型
-interface DeptData {
-	deptName: string;
-	createTime: string;
-	status: boolean;
-	sort: number | string;
-	describe: string;
-	id: number;
-	children?: DeptData[];
-}
-interface RuleFormRow {
-	userName: string;
-	userNickname: string;
-	roleSign: string;
-	department: any;
-	phone: string;
-	email: string;
-	sex: string;
-	password: string;
-	overdueTime: string;
-	status: boolean;
-	describe: string;
-}
-interface UserState {
-	isShowDialog: boolean;
-	ruleForm: RuleFormRow;
-	deptData: Array<DeptData>;
-}
+import { getAPI } from '/@/utils/axios-utils';
+import { SysPosApi, SysUserApi } from '/@/api-services/api';
 
 export default defineComponent({
-	name: 'systemEditUser',
+	name: 'sysEditUser',
+	components: {},
+	props: {
+		// 弹窗标题
+		title: {
+			type: String,
+			default: () => "",
+		},
+		// 机构数据
+		orgData: {
+			type: Array,
+			default: () => [],
+		}
+	},
 	setup() {
-		const state = reactive<UserState>({
+		const { proxy } = getCurrentInstance() as any;
+		const ruleFormRef = ref<HTMLElement | null>(null);
+		const state = reactive({
 			isShowDialog: false,
 			ruleForm: {
-				userName: '', // 账户名称
-				userNickname: '', // 用户昵称
-				roleSign: '', // 关联角色
-				department: [], // 部门
-				phone: '', // 手机号
-				email: '', // 邮箱
-				sex: '', // 性别
-				password: '', // 账户密码
-				overdueTime: '', // 账户过期
-				status: true, // 用户状态
-				describe: '', // 用户描述
+				id: 0,
+				userName: '',
+				nickName: '',
+				realName: '',
+				birthday: undefined,
+				sex: 1,
+				phone: '',
+				idCard: '',
+				email: '',
+				orgId: 0,
+				posId: 0,
+				jobNum: '',
+				jobStatus: 1,
+				signature: '',
+				introduction: '',
+				order: 10, // 排序
+				remark: '', // 备注
 			},
-			deptData: [], // 部门数据
+			jobStatusType: [{ value: 1, label: "在职" }, { value: 2, label: "离职" }, { value: 3, label: "请假" }], // 岗位状态
+			posData: [] as any, // 职位数据
+			ruleRules: {
+				userName: [{ required: true, message: "账号名称不能为空", trigger: "blur" }],
+				phone: [{ required: true, message: "手机号码不能为空", trigger: "blur" }],
+				realName: [{ required: true, message: "真实姓名不能为空", trigger: "blur" }],
+			},
+		});
+		onMounted(async () => {
+			var res = await getAPI(SysPosApi).sysPosListGet();
+			state.posData = res.data.result;
 		});
 		// 打开弹窗
-		const openDialog = (row: RuleFormRow) => {
+		const openDialog = (row: any) => {
 			state.ruleForm = row;
 			state.isShowDialog = true;
 		};
 		// 关闭弹窗
 		const closeDialog = () => {
+			proxy.mittBus.emit("submitRefresh");
 			state.isShowDialog = false;
 		};
 		// 取消
-		const onCancel = () => {
-			closeDialog();
-		};
-		// 新增
-		const onSubmit = () => {
-			closeDialog();
+		const cancel = () => {
+			state.isShowDialog = false;
 		};
-		// 初始化部门数据
-		const initTableData = () => {
-			state.deptData.push({
-				deptName: 'vueNextAdmin',
-				createTime: new Date().toLocaleString(),
-				status: true,
-				sort: Math.random(),
-				describe: '顶级部门',
-				id: Math.random(),
-				children: [
-					{
-						deptName: 'IT外包服务',
-						createTime: new Date().toLocaleString(),
-						status: true,
-						sort: Math.random(),
-						describe: '总部',
-						id: Math.random(),
-					},
-					{
-						deptName: '资本控股',
-						createTime: new Date().toLocaleString(),
-						status: true,
-						sort: Math.random(),
-						describe: '分部',
-						id: Math.random(),
-					},
-				],
-			});
+		// 提交
+		const submit = () => {
+			const formWrap = unref(ruleFormRef) as any;
+			if (!formWrap) return;
+
+			// 取父节点Id
+			if (Array.isArray(state.ruleForm.orgId))
+				state.ruleForm.orgId = state.ruleForm.orgId[state.ruleForm.orgId.length - 1];
+			formWrap.validate(async () => {
+				if (state.ruleForm.id != undefined && state.ruleForm.id > 0) {
+					await getAPI(SysUserApi).sysUserUpdatePost(state.ruleForm);
+				}
+				else {
+					await getAPI(SysUserApi).sysUserAddPost(state.ruleForm);
+				}
+				closeDialog();
+			})
 		};
-		// 页面加载时
-		onMounted(() => {
-			initTableData();
-		});
 		return {
+			ruleFormRef,
 			openDialog,
 			closeDialog,
-			onCancel,
-			onSubmit,
+			cancel,
+			submit,
 			...toRefs(state),
 		};
 	},
 });
 </script>
+	

+ 202 - 141
vue-next-admin/src/views/system/user/index.vue

@@ -1,175 +1,236 @@
 <template>
-	<div class="system-user-container">
-		<el-card shadow="hover">
-			<div class="system-user-search mb15">
-				<el-input size="default" placeholder="请输入用户名称" style="max-width: 180px"> </el-input>
-				<el-button size="default" type="primary" class="ml10">
-					<el-icon>
-						<ele-Search />
-					</el-icon>
-					查询
-				</el-button>
-				<el-button size="default" type="success" class="ml10" @click="onOpenAddUser">
-					<el-icon>
-						<ele-FolderAdd />
-					</el-icon>
-					新增用户
-				</el-button>
-			</div>
-			<el-table :data="tableData.data" style="width: 100%">
-				<el-table-column type="index" label="序号" width="60" />
-				<el-table-column prop="userName" label="账户名称" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="userNickname" label="用户昵称" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="roleSign" label="关联角色" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="department" label="部门" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="phone" label="手机号" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="email" label="邮箱" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="status" label="用户状态" show-overflow-tooltip>
-					<template #default="scope">
-						<el-tag type="success" v-if="scope.row.status">启用</el-tag>
-						<el-tag type="info" v-else>禁用</el-tag>
-					</template>
-				</el-table-column>
-				<el-table-column prop="describe" label="用户描述" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column>
-				<el-table-column label="操作" width="100">
-					<template #default="scope">
-						<el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary" @click="onOpenEditUser(scope.row)">修改</el-button>
-						<el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary" @click="onRowDel(scope.row)">删除</el-button>
-					</template>
-				</el-table-column>
-			</el-table>
-			<el-pagination
-				@size-change="onHandleSizeChange"
-				@current-change="onHandleCurrentChange"
-				class="mt15"
-				:pager-count="5"
-				:page-sizes="[10, 20, 30]"
-				v-model:current-page="tableData.param.pageNum"
-				background
-				v-model:page-size="tableData.param.pageSize"
-				layout="total, sizes, prev, pager, next, jumper"
-				:total="tableData.total"
-			>
-			</el-pagination>
-		</el-card>
-		<AddUer ref="addUserRef" />
-		<EditUser ref="editUserRef" />
+	<div class="sys-user-container">
+		<el-row :gutter="5">
+			<el-col :span="4" :xs="24">
+				<OrgTree ref="orgTreeRef" @node-click='nodeClick' />
+			</el-col>
+
+			<el-col :span="20" :xs="24">
+				<el-card shadow="hover">
+					<el-form :model="queryParams" ref="queryForm" :inline="true">
+						<el-form-item label="账号名称" prop="name">
+							<el-input placeholder="账号名称" clearable @keyup.enter="handleQuery"
+								v-model="queryParams.userName" />
+						</el-form-item>
+						<el-form-item label="手机号码" prop="code">
+							<el-input placeholder="手机号码" clearable @keyup.enter="handleQuery"
+								v-model="queryParams.phone" />
+						</el-form-item>
+						<el-form-item>
+							<el-button @click="resetQuery">
+								<el-icon>
+									<ele-Refresh />
+								</el-icon>
+								重置
+							</el-button>
+							<el-button type="primary" @click="handleQuery">
+								<el-icon>
+									<ele-Search />
+								</el-icon>
+								查询
+							</el-button>
+							<el-button @click="openAddUser">
+								<el-icon>
+									<ele-Plus />
+								</el-icon>
+								新增
+							</el-button>
+						</el-form-item>
+					</el-form>
+				</el-card>
+
+				<el-card shadow="hover" style="margin-top: 5px;">
+					<el-table :data="userData" style="width: 100%;" v-loading="loading" border>
+						<el-table-column type="index" label="序号" width="55" align="center" fixed />
+						<el-table-column prop="userName" label="账号名称" width="120" fixed show-overflow-tooltip>
+						</el-table-column>
+						<el-table-column prop="nickName" label="昵称" width="120" show-overflow-tooltip></el-table-column>
+						<el-table-column label="头像" width="80" align="center" show-overflow-tooltip>
+							<template #default="scope">
+								<el-avatar src="" size="small">{{scope.row.userName}} </el-avatar>
+							</template>
+						</el-table-column>
+						<el-table-column label="出生日期" width="100" align="center" show-overflow-tooltip>
+							<template #default="scope">
+								{{formatDate(new Date(scope.row.birthday), 'YYYY-mm-dd')}}
+							</template>
+						</el-table-column>
+						<el-table-column label="性别" width="70" align="center" show-overflow-tooltip>
+							<template #default="scope">
+								<el-tag v-if="scope.row.sex === 1">男</el-tag>
+								<el-tag type="danger" v-else>女</el-tag>
+							</template>
+						</el-table-column>
+						<el-table-column prop="phone" label="手机号码" width="120" align="center" show-overflow-tooltip>
+						</el-table-column>
+						<el-table-column prop="realName" label="真实姓名" width="120" show-overflow-tooltip>
+						</el-table-column>
+						<el-table-column prop="idCard" label="证件号码" width="150" show-overflow-tooltip></el-table-column>
+						<el-table-column label="状态" width="70" align="center" show-overflow-tooltip>
+							<template #default="scope">
+								<el-switch v-model="scope.row.status" :active-value="1" :inactive-value="2" size="small"
+									@change="changeStatus(scope.row)">
+								</el-switch>
+							</template>
+						</el-table-column>
+						<el-table-column prop="order" label="排序" width="70" align="center" show-overflow-tooltip>
+						</el-table-column>
+						<el-table-column prop="createTime" label="修改时间" width="160" show-overflow-tooltip>
+						</el-table-column>
+						<el-table-column prop="remark" label="备注" width="200" show-overflow-tooltip></el-table-column>
+						<el-table-column label="操作" width="80" align="center" fixed="right" show-overflow-tooltip>
+							<template #default="scope">
+								<el-button size="small" text type="primary" @click="openEditUser(scope.row)">
+									<el-icon>
+										<ele-Edit />
+									</el-icon>
+								</el-button>
+								<el-button size="small" text type="primary" @click="delUser(scope.row)">
+									<el-icon>
+										<ele-Delete />
+									</el-icon>
+								</el-button>
+							</template>
+						</el-table-column>
+					</el-table>
+					<el-pagination v-model:currentPage="tableParams.page" v-model:page-size="tableParams.pageSize"
+						:total="tableParams.total" :page-sizes="[10, 20, 50, 100]" small background
+						@size-change="handleSizeChange" @current-change="handleCurrentChange"
+						layout="total, sizes, prev, pager, next, jumper" />
+				</el-card>
+			</el-col>
+		</el-row>
+		<EditUser ref="editUserRef" :title="editUserTitle" :orgData="orgTreeData" />
 	</div>
 </template>
 
 <script lang="ts">
-import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue';
+import { ref, toRefs, reactive, onMounted, defineComponent, getCurrentInstance, onUnmounted } from 'vue';
 import { ElMessageBox, ElMessage } from 'element-plus';
-import AddUer from '/@/views/system/user/component/addUser.vue';
+import { formatDate } from '/@/utils/formatTime';
+import OrgTree from '/@/views/system/org/component/orgTree.vue';
 import EditUser from '/@/views/system/user/component/editUser.vue';
 
-// 定义接口来定义对象的类型
-interface TableDataRow {
-	userName: string;
-	userNickname: string;
-	roleSign: string;
-	department: string[];
-	phone: string;
-	email: string;
-	sex: string;
-	password: string;
-	overdueTime: Date;
-	status: boolean;
-	describe: string;
-	createTime: string;
-}
-interface TableDataState {
-	tableData: {
-		data: Array<TableDataRow>;
-		total: number;
-		loading: boolean;
-		param: {
-			pageNum: number;
-			pageSize: number;
-		};
-	};
-}
+import { getAPI } from '/@/utils/axios-utils';
+import { SysUserApi } from '/@/api-services/apis/sys-user-api';
+import { SysOrgApi } from '/@/api-services/apis/sys-org-api';
 
 export default defineComponent({
 	name: 'sysUser',
-	components: { AddUer, EditUser },
+	components: { OrgTree, EditUser },
 	setup() {
-		const addUserRef = ref();
+		const { proxy } = getCurrentInstance() as any;
+		const orgTreeRef = ref()
 		const editUserRef = ref();
-		const state = reactive<TableDataState>({
-			tableData: {
-				data: [],
-				total: 0,
-				loading: false,
-				param: {
-					pageNum: 1,
-					pageSize: 10,
-				},
+		const state = reactive({
+			loading: true,
+			userData: [] as any,
+			orgTreeData: [] as any, // 编辑页面上级机构树
+			queryParams: {
+				orgId: -1,
+				userName: undefined,
+				phone: undefined,
+
+			},
+			tableParams: {
+				page: 1,
+				pageSize: 10,
+				total: 0 as any,
 			},
+			editUserTitle: "",
+		});
+		onMounted(async () => {
+			loadOrgData();
+			handleQuery();
+
+			proxy.mittBus.on("submitRefresh", () => {
+				handleQuery();
+			});
+		});
+		onUnmounted(() => {
+			proxy.mittBus.off("submitRefresh");
 		});
-		// 初始化表格数据
-		const initTableData = () => {
-			const data: Array<TableDataRow> = [];
-			for (let i = 0; i < 2; i++) {
-				data.push({
-					userName: i === 0 ? 'admin' : 'test',
-					userNickname: i === 0 ? '我是管理员' : '我是普通用户',
-					roleSign: i === 0 ? 'admin' : 'common',
-					department: i === 0 ? ['vueNextAdmin', 'IT外包服务'] : ['vueNextAdmin', '资本控股'],
-					phone: '12345678910',
-					email: 'vueNextAdmin@123.com',
-					sex: '女',
-					password: '123456',
-					overdueTime: new Date(),
-					status: true,
-					describe: i === 0 ? '不可删除' : '测试用户',
-					createTime: new Date().toLocaleString(),
-				});
-			}
-			state.tableData.data = data;
-			state.tableData.total = state.tableData.data.length;
+		// 查询机构数据(可以从机构组件里面获取)
+		const loadOrgData = async () => {
+			state.loading = true;
+			var res = await getAPI(SysOrgApi).sysOrgListGet(0);
+			state.orgTreeData = res.data.result;
+			state.loading = false;
+		};
+		// 查询操作
+		const handleQuery = async () => {
+			state.loading = true;
+			var res = await getAPI(SysUserApi).sysUserPageGet(state.queryParams.userName, state.queryParams.phone,
+				state.queryParams.orgId, state.tableParams.page, state.tableParams.pageSize);
+			state.userData = res.data.result?.items;
+			state.tableParams.total = res.data.result?.total;
+			state.loading = false;
 		};
-		// 打开新增用户弹窗
-		const onOpenAddUser = () => {
-			addUserRef.value.openDialog();
+		// 重置操作
+		const resetQuery = () => {
+			state.queryParams.orgId = -1;
+			state.queryParams.userName = undefined;
+			state.queryParams.phone = undefined;
+			handleQuery();
 		};
-		// 打开修改用户弹窗
-		const onOpenEditUser = (row: TableDataRow) => {
+		// 打开新增页面
+		const openAddUser = () => {
+			state.editUserTitle = "添加账号";
+			editUserRef.value.openDialog({});
+		};
+		// 打开编辑页面
+		const openEditUser = (row: any) => {
+			state.editUserTitle = "编辑账号";
 			editUserRef.value.openDialog(row);
 		};
-		// 删除用户
-		const onRowDel = (row: TableDataRow) => {
-			ElMessageBox.confirm(`此操作将永久删除账户名称:“${row.userName}”,是否继续?`, '提示', {
-				confirmButtonText: '确认',
+		// 删除
+		const delUser = (row: any) => {
+			ElMessageBox.confirm(`确定删除账号:【${row.userName}】?`, '提示', {
+				confirmButtonText: '确',
 				cancelButtonText: '取消',
 				type: 'warning',
 			})
-				.then(() => {
+				.then(async () => {
+					await getAPI(SysUserApi).sysUserDeletePost({ id: row.id });
+					handleQuery();
 					ElMessage.success('删除成功');
 				})
-				.catch(() => {});
+				.catch(() => { });
 		};
 		// 分页改变
-		const onHandleSizeChange = (val: number) => {
-			state.tableData.param.pageSize = val;
+		const handleSizeChange = (val: number) => {
+			state.tableParams.pageSize = val;
+			handleQuery();
 		};
 		// 分页改变
-		const onHandleCurrentChange = (val: number) => {
-			state.tableData.param.pageNum = val;
+		const handleCurrentChange = (val: number) => {
+			state.tableParams.page = val;
+			handleQuery();
+		};
+		// 修改状态
+		const changeStatus = async (row: any) => {
+			await getAPI(SysUserApi).sysUserSetStatusPost({ id: row.id, status: row.status });
+		}
+		// 树组件点击
+		const nodeClick = async (node: any) => {
+			state.queryParams.orgId = node.id;
+			state.queryParams.userName = undefined; // node.name;
+			state.queryParams.phone = undefined;
+			handleQuery();
 		};
-		// 页面加载时
-		onMounted(() => {
-			initTableData();
-		});
 		return {
-			addUserRef,
+			handleQuery,
+			resetQuery,
+			orgTreeRef,
 			editUserRef,
-			onOpenAddUser,
-			onOpenEditUser,
-			onRowDel,
-			onHandleSizeChange,
-			onHandleCurrentChange,
+			openAddUser,
+			openEditUser,
+			delUser,
+			handleSizeChange,
+			handleCurrentChange,
+			changeStatus,
+			nodeClick,
+			formatDate,
 			...toRefs(state),
 		};
 	},