diff --git a/src/app/components/components.module.ts b/src/app/components/components.module.ts
index 2df3bcc..a801fe4 100644
--- a/src/app/components/components.module.ts
+++ b/src/app/components/components.module.ts
@@ -6,7 +6,7 @@ import { ToastModule } from './toast/toast.module'; //消息提示
import { SidebarMenuModule } from './sidebar-menu/sidebar-menu.module';
import { RequestStatusComponent } from './request-status/request-status.component';
import { NgZorroAntdModule, NZ_I18N, zh_CN } from 'ng-zorro-antd';
-
+import { NoValue } from './pipe/no-value.component';
import { registerLocaleData } from '@angular/common';
import zh from '@angular/common/locales/zh';
registerLocaleData(zh);
@@ -21,6 +21,7 @@ registerLocaleData(zh);
],
declarations: [
RequestStatusComponent,
+ NoValue
],
providers : [ { provide: NZ_I18N, useValue: zh_CN } ],
exports: [
@@ -28,6 +29,7 @@ registerLocaleData(zh);
ToastModule,
SidebarMenuModule,
RequestStatusComponent,
+ NoValue,
]
})
export class ComponentsModule { }
diff --git a/src/app/components/pipe/no-value.component.ts b/src/app/components/pipe/no-value.component.ts
new file mode 100644
index 0000000..26acb1b
--- /dev/null
+++ b/src/app/components/pipe/no-value.component.ts
@@ -0,0 +1,13 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({name: 'null'})
+export class NoValue implements PipeTransform {
+ transform(value: any, exponent: any): any {
+ console.log(value)
+ if(value){
+ return value
+ }else{
+ return '无'
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/app/pages/main.scss b/src/app/pages/main.scss
index 5884cbd..035bb07 100644
--- a/src/app/pages/main.scss
+++ b/src/app/pages/main.scss
@@ -8,7 +8,12 @@
.orange{
color: orange;
}
-
+.left{
+ float: left;
+}
+.right{
+ float: right;
+}
.system-main-container {
position: relative;
padding: 20px 20px;
@@ -16,13 +21,11 @@
height: 100%;
min-height: 300px;
background-color: #f0f0f0;
- overflow-y: scroll;
.system-main-content{
height: 100%;
- min-height: 600px;
.search-box{
- }
+ }
.table-box{
}
@@ -39,8 +42,7 @@
.tree-box{
position: relative;
min-width: 300px;
- min-height: 600px;
- margin-right: 10px;
+ margin-right: 20px;
float: left;
padding: 20px;
height: 100%;
diff --git a/src/app/pages/system-management/department-management/department-management.component.html b/src/app/pages/system-management/department-management/department-management.component.html
index 905ffe4..e9f7c17 100644
--- a/src/app/pages/system-management/department-management/department-management.component.html
+++ b/src/app/pages/system-management/department-management/department-management.component.html
@@ -1,3 +1,185 @@
-
-
diff --git a/src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.scss b/src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.scss
index 63d221c..72ed262 100644
--- a/src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.scss
+++ b/src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.scss
@@ -1,3 +1,12 @@
+.user-modify-box{
+ position: relative;
+ overflow-y:scroll;
+ .user-footer{
+ text-align: center;
+ margin-top: -20px;
+
+ }
+}
.ztree{
padding-bottom: 40px;
padding-right: 16px;
@@ -13,4 +22,10 @@
position: relative;
width: 120px;
height: 40px;
-}
\ No newline at end of file
+}
+//火狐浏览器单独设置样式 解决在火狐浏览器下 底部padding-bottom无效问题
+@-moz-document url-prefix(){
+ .user-footer{
+ padding-bottom: 20px;
+ }
+}
diff --git a/src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.ts b/src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.ts
index 30ed3e1..0a48e7f 100644
--- a/src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.ts
+++ b/src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.ts
@@ -3,6 +3,7 @@ import { FormBuilder,FormControl,FormGroup,Validators} from '@angular/forms';
import { HttpClientService } from '../../../../services/http-client.service';
import { Router,ActivatedRoute } from '@angular/router';
import { NzMessageService } from 'ng-zorro-antd';
+import { Observable } from 'rxjs';
import 'ztree';
declare var $: any;
@@ -30,6 +31,16 @@ export class UserManagementModifyComponent implements OnInit {
saveCheck:any=false; //保存检查,保存验证表单 false 还未验证 true 触发了验证
roleList:any=[]; //保存所选角色
listOfRole:any=[]; //角色列表
+ nameOnly:any=true; //系统账号是否唯一 true唯一 false重复
+ oldLoginName:any=''; //修改时,保存原本的系统账号,用于检测唯一性
+ checkNameStatus:any=''; //检测账号唯一性的图标状态
+ modifyType:any=1; //当前页面操作类型 1 新增用户 2 编辑用户
+ userId:any=''; //用户ID 修改的用户ID
+ userDetail:any={}; //用户详情
+ statusParamsDetail:any={ //获取用户详情接口的状态,0请求失败 1请求前 2请求中 3请求成功,有数据 4请求成功,无数据
+ status:1,
+ }
+ isLoadingSave:any=false;
constructor(
private fb: FormBuilder,
private http:HttpClientService,
@@ -39,6 +50,8 @@ export class UserManagementModifyComponent implements OnInit {
) { }
ngOnInit() {
+ // // 页面监听 动态改变表单高度
+ // $('#main-container').height('height',(document.documentElement.clientHeight-106+'px'));
this.queryRole();
this.validateForm = this.fb.group({
real_name:[ '', [ Validators.required ] ],
@@ -49,25 +62,87 @@ export class UserManagementModifyComponent implements OnInit {
mobile:[ ''],
sex:['m'],
status:['1'],
- role:['']
+ role:[''],
+ remark: ['']
});
//取路由参数
this.route.queryParams.subscribe(routeParams=>{
+ this.modifyType=routeParams.operateType;
//routeParams 1新增 2修改
if(routeParams.operateType==2){
-
-
+ this.userId=routeParams.id;
+ this.queryUserDetail();
+ }else{
+ this.statusParamsDetail.status=3;
}
})
}
+ //获取用户详情
+ queryUserDetail(){
+ this.http.get('/sysapi/setting/user/detail/list', { uid:this.userId }).subscribe((json)=>{
+ if(json.is_success){
+ if(json.body){
+ this.statusParamsDetail.status=3;
+ this.userDetail=json.body;
+ let detail=json.body;
+ this.validateForm.setValue({
+ real_name:detail.real_name,
+ login_name:detail.login_name,
+ password:detail.password,
+ identify_num:detail.identify_num,
+ email:detail.email,
+ mobile:detail.mobile,
+ sex:detail.sex,
+ status:detail.status,
+ role:'',
+ remark:detail.remark,
+ })
+ this.oldLoginName=detail.login_name;
+ if(detail.orgList&&detail.orgList.length>0){
+ this.orgDetail=detail.orgList[0];
+ }
+ if(detail.roleList&&detail.roleList.length>0){
+ detail.roleList.forEach(item=>{
+ this.roleList.push(item.rid)
+ })
+ }
+ }else{
+ this.statusParamsDetail.status=4;
+ }
+ }else{
+ this.statusParamsDetail.status=0;
+ }
+ })
+ }
+ //检验系统账号的唯一性
checkName(){
- console.log(334343)
+ console.log(this.validateForm.value.login_name.trim())
+ console.log(this.oldLoginName)
+ if(this.modifyType==2&&this.validateForm.value.login_name.trim()==this.oldLoginName){
+ this.nameOnly = true;
+ this.checkNameStatus='success';
+ return false;
+ }
+ this.checkNameStatus='validating';
+ this.http.get('/sysapi/setting/user/isOnly', { loginName: this.validateForm.value.login_name.trim() }).subscribe((json) => {
+ if (json.is_success) {
+ if(json.body){
+ this.checkNameStatus='success';
+ this.nameOnly = true;
+ }else{
+ this.checkNameStatus='error';
+ this.nameOnly = false;
+ }
+ } else {
+ this.message.error(`账号验证接口错误`)
+ }
+
+ })
}
//机构树,搜索功能
searchNode() {
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
zTree.cancelSelectedNode()
-
var key = $("#key");
var value = $.trim(key.get(0).value);
var keyType = "name";
@@ -77,7 +152,6 @@ export class UserManagementModifyComponent implements OnInit {
zTree.selectNode(this.nodeList[i], true, false);
}
}
-
}
//删除机构标签
tagClose(event){
@@ -106,40 +180,72 @@ export class UserManagementModifyComponent implements OnInit {
//关闭机构选择页面
close(): void {
this.visible = false;
-
}
- submitForm(): void {
+ submitForm(){
this.saveCheck=true;
for (const i in this.validateForm.controls) {
this.validateForm.controls[ i ].markAsDirty();
this.validateForm.controls[ i ].updateValueAndValidity();
}
- if(this.validateForm.valid&&this.orgDetail&&this.roleList.length>0){
- let item=this.validateForm.value;
- let params={
- real_name: item.real_name,
- login_name: item.login_name,
- password: item.password,
- mobile: item.mobile,
- sex: item.sex,
- identify_num: item.identify_num,
- email: item.email,
- status: item.status,
- orgList: [],
- roleList: [],
- };
- this.roleList.forEach(option=>{
- params.roleList.push({
- rid:option
- })
- })
- this.orgList.forEach(option=>{
- if(option.id==this.orgDetail.id){
- params.orgList.push(option)
+ if(this.validateForm.valid&&this.orgDetail&&this.roleList.length>0&&this.nameOnly){
+ //再次检验账号唯一性,避免用户填完账号直接点击提交,无法利用blur事件验证。
+ if(this.modifyType==2&&this.validateForm.value.login_name.trim()==this.oldLoginName){
+ this.nameOnly = true;
+ this.checkNameStatus='success';
+ this.submitConfirm(2);
+ return false;
+ }
+ this.checkNameStatus='validating';
+ //再次验证用户名唯一性
+ this.http.get('/sysapi/setting/user/isOnly', { loginName: this.validateForm.value.login_name.trim() }).subscribe((json) => {
+ if (json.is_success) {
+ if(json.body){
+ this.checkNameStatus='success';
+ this.nameOnly = true;
+ //表单处理
+ this.submitConfirm(this.modifyType);
+ }else{
+ this.checkNameStatus='error';
+ this.nameOnly = false;
+ return false;
+ }
+ } else {
+ this.message.error(`账号验证接口错误`)
}
})
- console.log(params)
+ }
+ }
+ //确认提交表单 type 1 新增 2修改
+ submitConfirm(type){
+ let item=this.validateForm.value;
+ let params={
+ real_name: item.real_name,
+ login_name: item.login_name,
+ password: item.password,
+ mobile: item.mobile,
+ sex: item.sex,
+ identify_num: item.identify_num,
+ email: item.email,
+ status: item.status,
+ remark: item.remark,
+ orgList: [],
+ roleList: [],
+ };
+ this.roleList.forEach(option=>{
+ params.roleList.push({
+ rid:option
+ })
+ })
+ this.orgList.forEach(option=>{
+ if(option.id==this.orgDetail.id){
+ params.orgList.push(option)
+ }
+ })
+ console.log(params)
+ this.isLoadingSave=true;
+ if(type==1){
this.http.post('/sysapi/setting/user/add', params).subscribe((json) => {
+ this.isLoadingSave=false;
if (json.is_success) {
this.message.success(`新增成功`);
this.router.navigate(['app/system/users'])
@@ -147,9 +253,17 @@ export class UserManagementModifyComponent implements OnInit {
this.message.error(`新增失败`)
}
})
+ }else if(type==2){
+ this.http.put('/sysapi/setting/user/updateById/'+this.userId, params).subscribe((json) => {
+ this.isLoadingSave=false;
+ if (json.is_success) {
+ this.message.success(`修改成功`);
+ this.router.navigate(['app/system/users'])
+ } else {
+ this.message.error(`修改失败`)
+ }
+ })
}
-
-
}
//取消 返回列表页
cancel(){
@@ -210,7 +324,6 @@ export class UserManagementModifyComponent implements OnInit {
}else{
option.pId='hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc';
}
-
}
json.body.push({
name:"全部机构",
diff --git a/src/app/pages/system-management/user-management/user-management.component.html b/src/app/pages/system-management/user-management/user-management.component.html
index adaa731..a087cd1 100644
--- a/src/app/pages/system-management/user-management/user-management.component.html
+++ b/src/app/pages/system-management/user-management/user-management.component.html
@@ -1,15 +1,15 @@
-
+
-
+
- 姓名
+ 姓名
@@ -42,9 +42,7 @@
| 姓名 |
- 性别 |
用户名 |
- 邮箱 |
电话 |
操作 |
@@ -52,12 +50,7 @@
| {{item.real_name}} |
-
- 男
- 女
- |
{{item.login_name}} |
- {{item.email}} |
{{item.mobile}} |
@@ -112,6 +105,24 @@
+
+
+
+ 所属角色
+
+ {{option.role_name}}0&&(i!=userDetail.roleList.length-1)">、
+
+ 无
+
+
+
+
+ 描述
+ {{userDetail.remark}}
+ 无
+
+
+
@@ -137,17 +148,6 @@
-
- 所属角色
-
- {{option.role_name}}0&&(i!=userDetail.roleList.length-1)">、
-
- 无
-
-
-
-
-
状态
已激活
@@ -155,6 +155,8 @@
无
+
+
性别
diff --git a/src/app/pages/system-management/user-management/user-management.component.scss b/src/app/pages/system-management/user-management/user-management.component.scss
index 4357470..a42cc05 100644
--- a/src/app/pages/system-management/user-management/user-management.component.scss
+++ b/src/app/pages/system-management/user-management/user-management.component.scss
@@ -1,10 +1,20 @@
-.user-manage{
- .card{
-
- }
-}
+@import "../../main.scss";
+.system-main-container{
+ .user-manage{
+ .system-main-content{
+ overflow-y:scroll;
+ }
+ .card{
+
+ }
+ .tree-box{
+ overflow-y:scroll;
+ }
+ }
+}
+
.user-detail{
.detail-item-text{
color: #1890ff;
}
-}
\ No newline at end of file
+}
diff --git a/src/app/pages/system-management/user-management/user-management.component.ts b/src/app/pages/system-management/user-management/user-management.component.ts
index 925818e..8bdea13 100644
--- a/src/app/pages/system-management/user-management/user-management.component.ts
+++ b/src/app/pages/system-management/user-management/user-management.component.ts
@@ -4,13 +4,13 @@ import { Router } from '@angular/router';
import { NzMessageService } from 'ng-zorro-antd';
import 'ztree';
-declare var $: any;
+declare var $: any;
declare var jQuery: any;
@Component({
selector: 'app-user-management',
templateUrl: './user-management.component.html',
- styleUrls: ['./user-management.component.scss','../../main.scss']
+ styleUrls: ['./user-management.component.scss',]
})
export class UserManagementComponent implements OnInit {
treeSelected:any; //树模型-当前选中项
@@ -43,6 +43,13 @@ export class UserManagementComponent implements OnInit {
) { }
ngOnInit() {
+ // 页面监听 动态改变表单高度
+ $('#tree-box').css('height',(document.documentElement.clientHeight-106+'px'));
+ $('#main-box').css('height',(document.documentElement.clientHeight-106+'px'));
+ $(window).resize(function(){
+ $('#tree-box').css('height',(document.documentElement.clientHeight-106+'px'));
+ $('#main-box').css('height',(document.documentElement.clientHeight-106+'px'));
+ })
this.initTree();
this.queryTable();
}
@@ -158,16 +165,14 @@ export class UserManagementComponent implements OnInit {
if(json.body.length>0){
this.statusParamsTree.status=3;
let children=[];
- for(var i=0;i{
option.name=option.organization;
if(option.pid){
option.pId=option.pid;
}else{
option.pId='hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc';
}
-
- }
+ });
json.body.push({
name:"全部机构",
isParent:true,
|