nothing
This commit is contained in:
zhouyuejun
+1
-1
@@ -36,7 +36,7 @@
|
||||
"node_modules/font-awesome/scss/font-awesome.scss",
|
||||
"node_modules/ng-zorro-antd/ng-zorro-antd.min.css",
|
||||
"src/styles.scss",
|
||||
"node_modules/ztree/css/zTreeStyle/zTreeStyle.css"
|
||||
"node_modules/ztree/css/metroStyle/metroStyle.css"
|
||||
],
|
||||
"scripts": [
|
||||
"node_modules/jquery/dist/jquery.min.js",
|
||||
|
||||
Generated
+4
@@ -10051,7 +10051,11 @@
|
||||
},
|
||||
"ztree": {
|
||||
"version": "3.5.24",
|
||||
<<<<<<< HEAD
|
||||
"resolved": "http://registry.npm.taobao.org/ztree/download/ztree-3.5.24.tgz",
|
||||
=======
|
||||
"resolved": "https://registry.npmjs.org/ztree/-/ztree-3.5.24.tgz",
|
||||
>>>>>>> develop-2
|
||||
"integrity": "sha1-tj/lKYH98sMpZ1z9J3Lw0UdSH/E=",
|
||||
"requires": {
|
||||
"jquery": "3.3.1"
|
||||
|
||||
@@ -1,9 +1,15 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
import { PageTopModule } from './page-top/page-top.module' //头部
|
||||
import { ToastModule } from './toast/toast.module' //消息提示
|
||||
import { SidebarMenuModule } from './sidebar-menu/sidebar-menu.module'
|
||||
import { PageTopModule } from './page-top/page-top.module'; //头部
|
||||
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 { registerLocaleData } from '@angular/common';
|
||||
import zh from '@angular/common/locales/zh';
|
||||
registerLocaleData(zh);
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
@@ -11,12 +17,17 @@ import { SidebarMenuModule } from './sidebar-menu/sidebar-menu.module'
|
||||
PageTopModule,
|
||||
ToastModule,
|
||||
SidebarMenuModule,
|
||||
NgZorroAntdModule
|
||||
],
|
||||
declarations: [],
|
||||
declarations: [
|
||||
RequestStatusComponent,
|
||||
],
|
||||
providers : [ { provide: NZ_I18N, useValue: zh_CN } ],
|
||||
exports: [
|
||||
PageTopModule,
|
||||
ToastModule,
|
||||
SidebarMenuModule,
|
||||
RequestStatusComponent,
|
||||
]
|
||||
})
|
||||
export class ComponentsModule { }
|
||||
|
||||
@@ -0,0 +1,13 @@
|
||||
<div *ngIf="statusParams.status!=3" class="position-center-box">
|
||||
<div class="loading-icon" *ngIf="statusParams.status==1">
|
||||
<i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
|
||||
</div>
|
||||
<div class="warning-icon" *ngIf="statusParams.status==0">
|
||||
<i nz-icon type="disconnect" theme="outline"></i>
|
||||
<span class="result-text">请求失败</span>
|
||||
</div>
|
||||
<div class="data-null" *ngIf="statusParams.status==4">
|
||||
<span class="result-text">暂无数据</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,23 @@
|
||||
.position-center-box{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
text-align: center;
|
||||
.loading-icon{
|
||||
color: #1890ff;
|
||||
}
|
||||
.warning-icon{
|
||||
color: orange
|
||||
}
|
||||
.data-null{
|
||||
|
||||
}
|
||||
i{
|
||||
font-size: 40px;
|
||||
}
|
||||
.result-text{
|
||||
display: block;
|
||||
padding-top: 10px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { RequestStatusComponent } from './request-status.component';
|
||||
|
||||
describe('RequestStatusComponent', () => {
|
||||
let component: RequestStatusComponent;
|
||||
let fixture: ComponentFixture<RequestStatusComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ RequestStatusComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(RequestStatusComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,18 @@
|
||||
import { Component, OnInit,Input } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-request-status',
|
||||
templateUrl: './request-status.component.html',
|
||||
styleUrls: ['./request-status.component.scss']
|
||||
})
|
||||
export class RequestStatusComponent implements OnInit {
|
||||
//该组件使用，要求父级标签position：relative。
|
||||
@Input() statusParams={
|
||||
status:1, //接口的状态，0请求失败 1请求前loading 2请求中 3请求成功，有数据 4请求成功，无数据
|
||||
}
|
||||
constructor() { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
}
|
||||
+49
-2
@@ -1,12 +1,31 @@
|
||||
/* 基础样式 */
|
||||
.mr10{
|
||||
margin-right: 10px;
|
||||
}
|
||||
.red{
|
||||
color: #f5222d;
|
||||
}
|
||||
.orange{
|
||||
color: orange;
|
||||
}
|
||||
|
||||
.system-main-container {
|
||||
position: relative;
|
||||
padding: 20px 20px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 300px;
|
||||
background-color: #f0f0f0;
|
||||
.system-main-body{
|
||||
overflow-y: scroll;
|
||||
.system-main-content{
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
min-height: 600px;
|
||||
.search-box{
|
||||
|
||||
}
|
||||
.table-box{
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.card{
|
||||
@@ -14,9 +33,14 @@
|
||||
background: #fff;
|
||||
padding: 20px;
|
||||
box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.15);
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.tree-box{
|
||||
position: relative;
|
||||
min-width: 300px;
|
||||
min-height: 600px;
|
||||
margin-right: 10px;
|
||||
float: left;
|
||||
padding: 20px;
|
||||
height: 100%;
|
||||
@@ -24,6 +48,29 @@
|
||||
box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.15);
|
||||
|
||||
}
|
||||
.page-box{
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.table-operation-box{
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
/* 表格样式 */
|
||||
.table-box {
|
||||
.table-operation-btn {
|
||||
padding-left: 2px;
|
||||
padding-right: 2px;
|
||||
cursor: pointer;
|
||||
font-size: 20px;
|
||||
}
|
||||
.edit{
|
||||
color: #40a9ff;
|
||||
}
|
||||
.danger{
|
||||
color: #f86c6b;
|
||||
}
|
||||
}
|
||||
|
||||
/* 目录树样式 */
|
||||
:host /deep/ ul.tree{
|
||||
|
||||
@@ -8,6 +8,7 @@ import { UserManagementComponent } from './user-management/user-management.compo
|
||||
import { DepartmentManagementComponent } from './department-management/department-management.component';
|
||||
import { OperationLogsComponent } from './operation-logs/operation-logs.component';
|
||||
import { DataSynchronizeComponent } from './data-synchronize/data-synchronize.component';
|
||||
import { UserManagementModifyComponent } from './user-management/user-management-modify/user-management-modify.component';
|
||||
|
||||
const systemManagementRoutes: Routes = [
|
||||
{
|
||||
@@ -29,7 +30,7 @@ const systemManagementRoutes: Routes = [
|
||||
},
|
||||
{
|
||||
path: 'users',
|
||||
component: UserManagementComponent
|
||||
component: UserManagementComponent,
|
||||
},
|
||||
{
|
||||
path: 'departments',
|
||||
@@ -42,6 +43,10 @@ const systemManagementRoutes: Routes = [
|
||||
{
|
||||
path: 'synchronization',
|
||||
component: DataSynchronizeComponent
|
||||
},
|
||||
{
|
||||
path: 'users/modify',
|
||||
component: UserManagementModifyComponent
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@ import { OperationLogsComponent } from './operation-logs/operation-logs.componen
|
||||
import { DataSynchronizeComponent } from './data-synchronize/data-synchronize.component';
|
||||
|
||||
|
||||
import { SystemManagementRouting } from './system-management-routing.module'
|
||||
import { SystemManagementRouting } from './system-management-routing.module';
|
||||
import { NgZorroAntdModule, NZ_I18N, zh_CN } from 'ng-zorro-antd';
|
||||
|
||||
import { registerLocaleData } from '@angular/common';
|
||||
@@ -20,7 +20,8 @@ registerLocaleData(zh);
|
||||
import { ColorSettingsComponent } from './personal-settings/color-settings/color-settings.component';
|
||||
import { MsgAlertWarningComponent } from './personal-settings/msg-alert-warning/msg-alert-warning.component';
|
||||
import { FlightAgencyComponent } from './personal-settings/flight-agency/flight-agency.component';
|
||||
|
||||
import { ComponentsModule } from '../../components/components.module';
|
||||
import { UserManagementModifyComponent } from './user-management/user-management-modify/user-management-modify.component';
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
@@ -28,7 +29,8 @@ import { FlightAgencyComponent } from './personal-settings/flight-agency/flight-
|
||||
NgZorroAntdModule,
|
||||
ColorPickerModule,
|
||||
ReactiveFormsModule,
|
||||
FormsModule
|
||||
FormsModule,
|
||||
ComponentsModule
|
||||
],
|
||||
declarations: [
|
||||
SystemManagementComponent,
|
||||
@@ -41,6 +43,7 @@ import { FlightAgencyComponent } from './personal-settings/flight-agency/flight-
|
||||
ColorSettingsComponent,
|
||||
MsgAlertWarningComponent,
|
||||
FlightAgencyComponent,
|
||||
UserManagementModifyComponent,
|
||||
|
||||
],
|
||||
providers : [ { provide: NZ_I18N, useValue: zh_CN } ],
|
||||
|
||||
+109
@@ -0,0 +1,109 @@
|
||||
<div class="system-main-container">
|
||||
<div class="user-modify-box card">
|
||||
<form nz-form [formGroup]="validateForm">
|
||||
<nz-form-item>
|
||||
<nz-form-label [nzSm]="4" [nzXs]="24" nzFor="real_name" nzRequired>姓名</nz-form-label>
|
||||
<nz-form-control [nzSm]="14" [nzXs]="24">
|
||||
<input nz-input id="real_name" formControlName="real_name" placeholder="请输入姓名">
|
||||
<nz-form-explain *ngIf="validateForm.get('real_name').dirty && validateForm.get('real_name').errors">请输入姓名</nz-form-explain>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
<nz-form-item>
|
||||
<nz-form-label [nzSm]="4" [nzXs]="24" nzFor="login_name" nzRequired>系统账号</nz-form-label>
|
||||
<nz-form-control [nzSm]="14" [nzXs]="24">
|
||||
<input nz-input (ngBlur)='checkName()' id="login_name" formControlName="login_name" placeholder="请输入统一身份认证账号">
|
||||
<nz-form-explain *ngIf="validateForm.get('login_name').dirty && validateForm.get('login_name').errors">请输入系统账号</nz-form-explain>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
<nz-form-item>
|
||||
<nz-form-label [nzSm]="4" [nzXs]="24" nzFor="password" nzRequired>系统密码</nz-form-label>
|
||||
<nz-form-control [nzSm]="14" [nzXs]="24">
|
||||
<input nz-input id="password" formControlName="password" placeholder="请输入密码">
|
||||
<nz-form-explain *ngIf="validateForm.get('password').dirty && validateForm.get('password').errors">请输入密码</nz-form-explain>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
<nz-form-item>
|
||||
<nz-form-label [nzSm]="4" [nzXs]="24" nzFor="password" nzRequired>所属机构</nz-form-label>
|
||||
<nz-form-control [nzSm]="14" [nzXs]="24">
|
||||
<span *ngIf="orgDetail">
|
||||
<nz-tag nzMode="closeable" (nzOnClose)="tagClose($event)" >{{orgDetail.organization}}</nz-tag>
|
||||
</span>
|
||||
<a href="javascript:;" (click)="open()"><span *ngIf="orgDetail">修改</span><span *ngIf="!orgDetail">选择</span></a>
|
||||
<nz-form-explain *ngIf="!orgDetail&&saveCheck" class="red">请选择所属机构</nz-form-explain>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
<nz-form-item>
|
||||
<nz-form-label [nzSm]="4" [nzXs]="24" nzRequired>所属角色</nz-form-label>
|
||||
<nz-form-control [nzSm]="14" [nzXs]="24">
|
||||
<div class="relative" *ngIf="statusParamsRole.status!=3">
|
||||
<app-request-status [statusParams]='statusParamsRole'></app-request-status>
|
||||
</div>
|
||||
<nz-select formControlName="role" *ngIf="statusParamsRole.status==3" nzMode="multiple" nzPlaceHolder="请选择所属角色" [(ngModel)]="roleList">
|
||||
<nz-option *ngFor="let option of listOfRole" [nzLabel]="option.role_name" [nzValue]="option.rid"></nz-option>
|
||||
</nz-select>
|
||||
<nz-form-explain *ngIf="(roleList.length<=0)&&saveCheck" class="red">请选择所属角色</nz-form-explain>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
<nz-form-item>
|
||||
<nz-form-label [nzSm]="4" [nzXs]="24" nzFor="identify_num">身份证号</nz-form-label>
|
||||
<nz-form-control [nzSm]="14" [nzXs]="24">
|
||||
<input nz-input id="identify_num" formControlName="identify_num" placeholder="请输入身份证号">
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
<nz-form-item>
|
||||
<nz-form-label [nzSm]="4" [nzXs]="24" nzFor="email">邮箱</nz-form-label>
|
||||
<nz-form-control [nzSm]="14" [nzXs]="24">
|
||||
<input nz-input id="email" formControlName="email" placeholder="请输入邮箱地址">
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
<nz-form-item>
|
||||
<nz-form-label [nzSm]="4" [nzXs]="24" nzFor="mobile">电话</nz-form-label>
|
||||
<nz-form-control [nzSm]="14" [nzXs]="24">
|
||||
<input nz-input id="mobile" formControlName="mobile" placeholder="请输入电话号码">
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
<nz-form-item>
|
||||
<nz-form-label [nzSm]="4" [nzXs]="24" >性别</nz-form-label>
|
||||
<nz-form-control [nzSm]="14" [nzXs]="24">
|
||||
<nz-radio-group formControlName="sex">
|
||||
<label nz-radio nzValue="m">男</label>
|
||||
<label nz-radio nzValue="f">女</label>
|
||||
</nz-radio-group>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
<!-- <nz-form-item>
|
||||
<nz-form-label [nzSm]="4" [nzXs]="24" >状态</nz-form-label>
|
||||
<nz-form-control [nzSm]="14" [nzXs]="24">
|
||||
<nz-radio-group formControlName="status">
|
||||
<label nz-radio nzValue="1">已激活</label>
|
||||
<label nz-radio nzValue="0">未激活</label>
|
||||
</nz-radio-group>
|
||||
</nz-form-control>
|
||||
</nz-form-item> -->
|
||||
|
||||
<nz-form-item nz-row style="margin-bottom:8px;">
|
||||
<nz-form-control [nzSpan]="14" [nzOffset]="6">
|
||||
<button (click)='submitForm()' nz-button nzType="primary" class="mr10">保存</button>
|
||||
<button (click)='cancel()' nz-button nzType="default">取消</button>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 选择所属机构 -->
|
||||
<div class="org-selete-box">
|
||||
<nz-drawer [nzBodyStyle]="{ height: 'calc(100% - 55px)', overflow: 'auto', 'padding-bottom':'53px' }"[nzMaskClosable]="false" [nzWidth]="auto" [nzVisible]="visible" nzTitle="选择机构" (nzOnClose)="close()">
|
||||
<app-request-status [statusParams]='statusParamsTree'></app-request-status>
|
||||
<div class="org-tree-box" [hidden]='statusParamsTree.status!=3'>
|
||||
<div class="search-box">
|
||||
<input nz-input style="width: 180px !important;margin-left: 8px;margin-right: 6px;" id="key" />
|
||||
<button nz-button nzType="primary" nzShape="circle" (click)="searchNode()"><i nz-icon type="search"></i></button>
|
||||
</div>
|
||||
<ul id="treeDemo" class="ztree"></ul>
|
||||
<div class="drawer-footer">
|
||||
<button (click)='treeSave()' nz-button nzType="primary" class="mr10">保存</button>
|
||||
<button (click)=close() nz-button nzType="default">取消</button>
|
||||
</div>
|
||||
</div>
|
||||
</nz-drawer>
|
||||
</div>
|
||||
+16
@@ -0,0 +1,16 @@
|
||||
.ztree{
|
||||
padding-bottom: 40px;
|
||||
padding-right: 16px;
|
||||
}
|
||||
.drawer-footer{
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
left: 50%;
|
||||
bottom: 20px;
|
||||
transform: translate(-50%)
|
||||
}
|
||||
.relative{
|
||||
position: relative;
|
||||
width: 120px;
|
||||
height: 40px;
|
||||
}
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { UserManagementModifyComponent } from './user-management-modify.component';
|
||||
|
||||
describe('UserManagementModifyComponent', () => {
|
||||
let component: UserManagementModifyComponent;
|
||||
let fixture: ComponentFixture<UserManagementModifyComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ UserManagementModifyComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(UserManagementModifyComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
+238
@@ -0,0 +1,238 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
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 'ztree';
|
||||
declare var $: any;
|
||||
declare var jQuery: any;
|
||||
|
||||
@Component({
|
||||
selector: 'app-user-management-modify',
|
||||
templateUrl: './user-management-modify.component.html',
|
||||
styleUrls: ['./user-management-modify.component.scss','../../../main.scss']
|
||||
})
|
||||
export class UserManagementModifyComponent implements OnInit {
|
||||
validateForm: FormGroup;
|
||||
statusParamsTree:any={ //获取机构接口的状态，0请求失败 1请求前 2请求中 3请求成功，有数据 4请求成功，无数据
|
||||
status:1,
|
||||
}
|
||||
statusParamsRole:any={ //获取机构接口的状态，0请求失败 1请求前 2请求中 3请求成功，有数据 4请求成功，无数据
|
||||
status:1,
|
||||
}
|
||||
visible = false; //控制抽屉显示
|
||||
treeSelected:any;
|
||||
orgDetail:any=''; //所选机构详情
|
||||
orgList:any=[]; //机构列表
|
||||
orgSeletedBtn:any=true; //控制机构选择按钮
|
||||
nodeList:any=[];
|
||||
saveCheck:any=false; //保存检查，保存验证表单 false 还未验证 true 触发了验证
|
||||
roleList:any=[]; //保存所选角色
|
||||
listOfRole:any=[]; //角色列表
|
||||
constructor(
|
||||
private fb: FormBuilder,
|
||||
private http:HttpClientService,
|
||||
private route:ActivatedRoute,
|
||||
private router:Router,
|
||||
private message: NzMessageService,
|
||||
) { }
|
||||
|
||||
ngOnInit() {
|
||||
this.queryRole();
|
||||
this.validateForm = this.fb.group({
|
||||
real_name:[ '', [ Validators.required ] ],
|
||||
login_name:[ '', [ Validators.required ] ],
|
||||
password:[ '', [ Validators.required ] ],
|
||||
identify_num:[ ''],
|
||||
email:[ ''],
|
||||
mobile:[ ''],
|
||||
sex:['m'],
|
||||
status:['1'],
|
||||
role:['']
|
||||
});
|
||||
//取路由参数
|
||||
this.route.queryParams.subscribe(routeParams=>{
|
||||
//routeParams 1新增 2修改
|
||||
if(routeParams.operateType==2){
|
||||
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
checkName(){
|
||||
console.log(334343)
|
||||
}
|
||||
//机构树，搜索功能
|
||||
searchNode() {
|
||||
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
|
||||
zTree.cancelSelectedNode()
|
||||
|
||||
var key = $("#key");
|
||||
var value = $.trim(key.get(0).value);
|
||||
var keyType = "name";
|
||||
this.nodeList = zTree.getNodesByParamFuzzy(keyType, value);
|
||||
if (value) {
|
||||
for (var i = this.nodeList.length - 1; i >= 0; i--) {
|
||||
zTree.selectNode(this.nodeList[i], true, false);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
//删除机构标签
|
||||
tagClose(event){
|
||||
this.orgSeletedBtn=true;
|
||||
this.orgDetail='';
|
||||
}
|
||||
//保存选择机构
|
||||
treeSave(){
|
||||
if(this.treeSelected){
|
||||
this.orgDetail=this.treeSelected;
|
||||
this.visible = false;
|
||||
this.orgSeletedBtn=false;
|
||||
}else{
|
||||
//如果没有选择机构,提示请选择机构
|
||||
this.message.create('warning', `请选择所属机构！`,{ nzDuration: 2000 });
|
||||
}
|
||||
}
|
||||
//打开机构树抽屉
|
||||
open(): void {
|
||||
this.treeSelected='';
|
||||
this.statusParamsTree.status=1;
|
||||
this.visible = true;
|
||||
this.initTree();
|
||||
|
||||
}
|
||||
//关闭机构选择页面
|
||||
close(): void {
|
||||
this.visible = false;
|
||||
|
||||
}
|
||||
submitForm(): void {
|
||||
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)
|
||||
}
|
||||
})
|
||||
console.log(params)
|
||||
this.http.post('/sysapi/setting/user/add', params).subscribe((json) => {
|
||||
if (json.is_success) {
|
||||
this.message.success(`新增成功`);
|
||||
this.router.navigate(['app/system/users'])
|
||||
} else {
|
||||
this.message.error(`新增失败`)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
//取消 返回列表页
|
||||
cancel(){
|
||||
this.router.navigate(['app/system/users'])
|
||||
}
|
||||
//获取角色列表
|
||||
queryRole(): void {
|
||||
this.statusParamsRole.status=1;
|
||||
this.http.get('/sysapi/setting/role/list', {page_index: '1',page_size: '100',}).subscribe((json) => {
|
||||
if (json.is_success) {
|
||||
this.listOfRole = json.body.list;
|
||||
if(json.body.list&&json.body.list.length>0){
|
||||
this.statusParamsRole.status=3;
|
||||
}else{
|
||||
this.statusParamsRole.status=4;
|
||||
}
|
||||
} else {
|
||||
this.statusParamsRole.status=0;
|
||||
}
|
||||
})
|
||||
}
|
||||
//树模型参数设置
|
||||
public zNodes: any[];
|
||||
setting = {
|
||||
data: {
|
||||
simpleData: {
|
||||
enable: true
|
||||
}
|
||||
},
|
||||
view: {
|
||||
showLine: true,
|
||||
dblClickExpand: false,
|
||||
showIcon:true
|
||||
},
|
||||
callback: {
|
||||
//节点点击事件
|
||||
onClick: (event, treeId, treeNode, clickFlag) => {
|
||||
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
|
||||
this.treeSelected=treeNode;
|
||||
},
|
||||
},
|
||||
};
|
||||
//获取机构列表，树模型数据处理
|
||||
initTree(){
|
||||
//获取目录列表
|
||||
this.statusParamsTree.status=1;
|
||||
this.http.get("/sysapi/setting/organization/list",).subscribe(json=>{
|
||||
if(json.is_success){
|
||||
if(json.body.length>0){
|
||||
this.orgList=json.body;
|
||||
this.statusParamsTree.status=3;
|
||||
let children=[];
|
||||
for(var i=0;i<json.body.length;i++){
|
||||
let option=json.body[i];
|
||||
option.name=option.organization;
|
||||
if(option.pid){
|
||||
option.pId=option.pid;
|
||||
}else{
|
||||
option.pId='hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc';
|
||||
}
|
||||
|
||||
}
|
||||
json.body.push({
|
||||
name:"全部机构",
|
||||
isParent:true,
|
||||
open:true,
|
||||
id:'hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc',
|
||||
})
|
||||
}else{
|
||||
//数据为空
|
||||
this.statusParamsTree.status=4;
|
||||
}
|
||||
}else{
|
||||
//请求失败
|
||||
this.statusParamsTree.status=0;
|
||||
}
|
||||
this.zNodes=json.body;
|
||||
$.fn.zTree.init($("#treeDemo"), this.setting, this.zNodes);
|
||||
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
|
||||
let node = zTree.getNodes();
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
@@ -1,10 +1,169 @@
|
||||
<div class="system-main-container">
|
||||
<div class="user-manage">
|
||||
<div class="tree-box">
|
||||
<ul id="treeDemo" class="ztree"></ul>
|
||||
<app-request-status [statusParams]='statusParamsTree'></app-request-status>
|
||||
<ul [hidden]='statusParamsTree.status!=3' id="treeDemo" class="ztree"></ul>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="system-main-content card">
|
||||
<div class="search-box">
|
||||
<div nz-row>
|
||||
<div nz-col nzSpan="8">
|
||||
<nz-form-item >
|
||||
<nz-form-label nzSpan="6">姓名</nz-form-label>
|
||||
<nz-form-control nzSpan="17">
|
||||
<input nz-input [(ngModel)]='search.real_name' placeholder="请输入姓名">
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
<div nz-col nzSpan="8">
|
||||
<nz-form-item >
|
||||
<nz-form-label nzSpan="8">用户名</nz-form-label>
|
||||
<nz-form-control nzSpan="15">
|
||||
<input nz-input [(ngModel)]='search.login_name' placeholder="请输入用户名">
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
<div nz-col nzSpan="8">
|
||||
<nz-form-item >
|
||||
<nz-form-control nzSpan="24">
|
||||
<button class="mr10" nz-button nzType="primary" (click)="queryTable()"><i nz-icon type="search"></i>查询</button>
|
||||
<button (click)="reset()" nz-button nzType="primary"><i nz-icon type="sync" theme="outline"></i>重置</button>
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-operation-box">
|
||||
<button (click)="addModify(1)" nz-button nzType="primary"><i nz-icon type="plus" theme="outline"></i>新增</button>
|
||||
</div>
|
||||
</div>
|
||||
<app-request-status *ngIf='statusParamsTable.status!=4' [statusParams]='statusParamsTable'></app-request-status>
|
||||
<div class="table-box" *ngIf='statusParamsTable.status==3||statusParamsTable.status==4||statusParamsTable.status==0'>
|
||||
<nz-table [nzShowPagination]='false' #dataSet [nzData]="tableData">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>姓名</th>
|
||||
<th>性别</th>
|
||||
<th>用户名</th>
|
||||
<th>邮箱</th>
|
||||
<th>电话</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ngFor="let item of dataSet.data">
|
||||
<td><a (click)='open(item)' href="javascript:;">{{item.real_name}}</a></td>
|
||||
<td>
|
||||
<span *ngIf="item.sex=='m'">男</span>
|
||||
<span *ngIf="item.sex=='f'">女</span>
|
||||
</td>
|
||||
<td>{{item.login_name}}</td>
|
||||
<td>{{item.email}}</td>
|
||||
<td>{{item.mobile}}</td>
|
||||
<td>
|
||||
<i (click)="addModify(2,item)" class="table-operation-btn edit" nz-icon type="edit" theme="outline"></i>
|
||||
<nz-divider nzType="vertical"></nz-divider>
|
||||
<i nz-popconfirm nzTitle="确定删除该用户?" nzOkText="确定" nzCancelText="取消" (nzOnConfirm)="delectConfirm(item)" (nzOnCancel)="delectCancel()" class="table-operation-btn danger" nz-icon type="delete" theme="outline"></i>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</nz-table>
|
||||
<div class="page-box" *ngIf="statusParamsTable.status==3">
|
||||
<nz-pagination [nzPageIndex]="search.page_index" (nzPageIndexChange)='pageChange($event)' [nzPageSize]='search.page_size' [nzTotal]="collectionSize"></nz-pagination>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 详情 -->
|
||||
<div class="user-detail-box">
|
||||
<nz-drawer [nzBodyStyle]="{ height: 'calc(100% - 55px)', overflow: 'auto', 'padding-bottom':'53px' }"[nzMaskClosable]="true" [nzWidth]="500" [nzVisible]="visible" nzTitle="用户详情" (nzOnClose)="close()">
|
||||
<app-request-status [statusParams]='statusParamsDetail'></app-request-status>
|
||||
<form class="user-detail" *ngIf='statusParamsDetail.status==3' nz-form [nzLayout]="'inline'">
|
||||
<div nz-row nzGutter="8">
|
||||
<div nz-col nzSpan="24">
|
||||
<nz-form-item>
|
||||
<nz-form-label>姓名</nz-form-label>
|
||||
<span class="detail-item-text">{{userDetail.real_name}}</span>
|
||||
<span *ngIf='!userDetail.real_name'>无</span>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
<div nz-col nzSpan="24">
|
||||
<nz-form-item>
|
||||
<nz-form-label>系统账号</nz-form-label>
|
||||
<span class="detail-item-text">{{userDetail.login_name}}</span>
|
||||
<span *ngIf='!userDetail.login_name'>无</span>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
</div>
|
||||
<div nz-row nzGutter="8">
|
||||
<div nz-col nzSpan="24">
|
||||
<nz-form-item>
|
||||
<nz-form-label>系统密码</nz-form-label>
|
||||
<span class="detail-item-text">{{userDetail.password}}</span>
|
||||
<span *ngIf='!userDetail.password'>无</span>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
<div nz-col nzSpan="24">
|
||||
<nz-form-item>
|
||||
<nz-form-label>所属机构</nz-form-label>
|
||||
<span *ngFor="let option of userDetail.orgList" class="detail-item-text">{{option.organization}}</span>
|
||||
<span *ngIf="userDetail.orgList.length<=0">无</span>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
</div>
|
||||
<div nz-row nzGutter="8">
|
||||
<div nz-col nzSpan="24">
|
||||
<nz-form-item>
|
||||
<nz-form-label>身份证号</nz-form-label>
|
||||
<span class="detail-item-text">{{userDetail.identify_num}}</span>
|
||||
<span *ngIf='!userDetail.identify_num'>无</span>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
<div nz-col nzSpan="24">
|
||||
<nz-form-item>
|
||||
<nz-form-label>邮箱</nz-form-label>
|
||||
<span class="detail-item-text">{{userDetail.email}}</span>
|
||||
<span *ngIf='!userDetail.email'>无</span>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
</div>
|
||||
<div nz-row nzGutter="8">
|
||||
<div nz-col nzSpan="24">
|
||||
<nz-form-item>
|
||||
<nz-form-label>电话</nz-form-label>
|
||||
<span class="detail-item-text">{{userDetail.mobile}}</span>
|
||||
<span *ngIf='!userDetail.mobile'>无</span>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
<div nz-col nzSpan="24">
|
||||
<nz-form-item>
|
||||
<nz-form-label>所属角色</nz-form-label>
|
||||
<ng-container *ngFor="let option of userDetail.roleList;let i=index">
|
||||
<span class="detail-item-text">{{option.role_name}}</span><span *ngIf="userDetail.roleList.length>0&&(i!=userDetail.roleList.length-1)">、</span>
|
||||
</ng-container>
|
||||
<span *ngIf="userDetail.roleList.length<=0">无</span>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
</div>
|
||||
<div nz-row nzGutter="8">
|
||||
<div nz-col nzSpan="24">
|
||||
<nz-form-item>
|
||||
<nz-form-label>状态</nz-form-label>
|
||||
<span class="detail-item-text" *ngIf='userDetail.status==1'>已激活</span>
|
||||
<span class="detail-item-text" *ngIf='userDetail.status==0'>未激活</span>
|
||||
<span *ngIf='!userDetail.status'>无</span>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
<div nz-col nzSpan="24">
|
||||
<nz-form-item>
|
||||
<nz-form-label>性别</nz-form-label>
|
||||
<span class="detail-item-text" *ngIf='userDetail.sex=="m"'>男</span>
|
||||
<span class="detail-item-text" *ngIf='userDetail.sex=="f"'>女</span>
|
||||
<span *ngIf='!userDetail.sex'>无</span>
|
||||
</nz-form-item>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</nz-drawer>
|
||||
</div>
|
||||
@@ -2,4 +2,9 @@
|
||||
.card{
|
||||
|
||||
}
|
||||
}
|
||||
.user-detail{
|
||||
.detail-item-text{
|
||||
color: #1890ff;
|
||||
}
|
||||
}
|
||||
@@ -1,5 +1,7 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { HttpClientService } from '../../../services/http-client.service';
|
||||
import { Router } from '@angular/router';
|
||||
import { NzMessageService } from 'ng-zorro-antd';
|
||||
|
||||
import 'ztree';
|
||||
declare var $: any;
|
||||
@@ -12,34 +14,123 @@ declare var jQuery: any;
|
||||
})
|
||||
export class UserManagementComponent implements OnInit {
|
||||
treeSelected:any; //树模型-当前选中项
|
||||
collectionSize:any ;
|
||||
public tableData:any=[];
|
||||
statusParamsTable:any={ //获取目录树接口的状态，0请求失败 1请求前 2请求中 3请求成功，有数据 4请求成功，无数据
|
||||
status:1,
|
||||
}
|
||||
statusParamsTree:any={ //获取机构接口的状态，0请求失败 1请求前 2请求中 3请求成功，有数据 4请求成功，无数据
|
||||
status:1,
|
||||
}
|
||||
statusParamsDetail:any={ //获取用户详情接口的状态，0请求失败 1请求前 2请求中 3请求成功，有数据 4请求成功，无数据
|
||||
status:1,
|
||||
}
|
||||
public search:any={
|
||||
page_index:'1',
|
||||
page_size:'10',
|
||||
real_name:'',
|
||||
login_name:'',
|
||||
orgId:'',
|
||||
orgId:'',
|
||||
}
|
||||
parentNode:any;
|
||||
parentName:any;
|
||||
isTreeTop:any=false; //判断是否为树最顶层
|
||||
visible = false;
|
||||
userDetail:any={}; //用户详情
|
||||
|
||||
|
||||
constructor(
|
||||
private http:HttpClientService,
|
||||
private router:Router,
|
||||
private message: NzMessageService,
|
||||
) { }
|
||||
|
||||
ngOnInit() {
|
||||
this.initTree();
|
||||
this.queryTable();
|
||||
}
|
||||
//删除
|
||||
delectConfirm(item){
|
||||
this.http.delete('/sysapi/setting/user/deleteById/'+item.uid).subscribe((json)=>{
|
||||
if(json.is_success){
|
||||
this.message.success(`删除成功!`);
|
||||
this.queryTable();
|
||||
}else{
|
||||
this.message.error(`删除失败`)
|
||||
}
|
||||
})
|
||||
}
|
||||
//取消删除
|
||||
delectCancel(){
|
||||
|
||||
}
|
||||
//新增、修改 1新增 2修改
|
||||
addModify(type,item?){
|
||||
if(type==1){
|
||||
this.router.navigate(['app/system/users/modify'],{queryParams:{operateType:1}})
|
||||
}else if(type==2){
|
||||
this.router.navigate(['app/system/users/modify'],{queryParams:{operateType:2,id:item.uid}})
|
||||
}
|
||||
}
|
||||
//打开详情页面
|
||||
open(item): void {
|
||||
this.statusParamsDetail.status=1;
|
||||
this.visible = true;
|
||||
this.userDetail={};
|
||||
this.http.get('/sysapi/setting/user/detail/list', { uid: item.uid }).subscribe((json)=>{
|
||||
if(json.is_success){
|
||||
if(json.body){
|
||||
this.statusParamsDetail.status=3;
|
||||
this.userDetail=json.body;
|
||||
}else{
|
||||
this.statusParamsDetail.status=4;
|
||||
}
|
||||
}else{
|
||||
this.statusParamsDetail.status=0;
|
||||
}
|
||||
})
|
||||
}
|
||||
//关闭详情页面
|
||||
close(): void {
|
||||
this.visible = false;
|
||||
}
|
||||
//重置，重置搜索条件
|
||||
reset(){
|
||||
this.search.page_index=1;
|
||||
this.search.page_size=10;
|
||||
this.search.real_name='';
|
||||
this.search.login_name='';
|
||||
this.queryTable();
|
||||
}
|
||||
//获取列表
|
||||
queryTable():void{
|
||||
this.statusParamsTable.status=1;
|
||||
this.http.get('/sysapi/setting/user/list',this.search).subscribe((json)=>{
|
||||
if(json.is_success){
|
||||
this.tableData=json.body.list;
|
||||
this.collectionSize=json.body.total;
|
||||
if(json.body.list&&json.body.list.length>0){
|
||||
this.statusParamsTable.status=3;
|
||||
}else{
|
||||
this.statusParamsTable.status=4;
|
||||
}
|
||||
}else{
|
||||
this.statusParamsTable.status=0;
|
||||
}
|
||||
})
|
||||
}
|
||||
//翻页
|
||||
pageChange(event){
|
||||
this.search.page_index=event;
|
||||
this.queryTable();
|
||||
}
|
||||
//树模型参数设置
|
||||
public zNodes: any[];
|
||||
setting = {
|
||||
data: {
|
||||
simpleData: {
|
||||
enable: true
|
||||
enable: true
|
||||
}
|
||||
},
|
||||
view: {
|
||||
showLine: false,
|
||||
showLine: true,
|
||||
dblClickExpand: false,
|
||||
showIcon:true
|
||||
},
|
||||
@@ -47,47 +138,50 @@ export class UserManagementComponent implements OnInit {
|
||||
//节点点击事件
|
||||
onClick: (event, treeId, treeNode, clickFlag) => {
|
||||
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
|
||||
zTree.expandNode(treeNode);
|
||||
this.treeSelected=treeNode;
|
||||
this.search.orgId=this.treeSelected.id;
|
||||
this.parentNode=this.treeSelected.getParentNode();
|
||||
if(!this.parentNode){
|
||||
this.isTreeTop=true;
|
||||
}else{
|
||||
this.isTreeTop=false;
|
||||
let isTopNode=this.treeSelected.getParentNode(); //是否为顶级节点 true不是顶级节点 false 为顶级节点
|
||||
if(isTopNode){ //子节点
|
||||
this.search.orgId=this.treeSelected.id;
|
||||
}else{ //顶级节点
|
||||
this.search.orgId='';
|
||||
}
|
||||
this.queryTable();
|
||||
},
|
||||
//节点展开事件
|
||||
onExpand: (event, treeId, treeNode) => {
|
||||
|
||||
}
|
||||
},
|
||||
};
|
||||
//新树模型
|
||||
//获取机构列表，树模型数据处理
|
||||
initTree(){
|
||||
//获取目录列表
|
||||
this.statusParamsTree.status=1;
|
||||
this.http.get("/sysapi/setting/organization/list",).subscribe(json=>{
|
||||
if(json.is_success&&json.body){
|
||||
let children=[];
|
||||
for(var i=0;i<json.body.length;i++){
|
||||
let option=json.body[i];
|
||||
option.name=option.organization;
|
||||
if(option.pid){
|
||||
option.pId=option.pid;
|
||||
}else{
|
||||
option.pId='hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc';
|
||||
if(json.is_success){
|
||||
if(json.body.length>0){
|
||||
this.statusParamsTree.status=3;
|
||||
let children=[];
|
||||
for(var i=0;i<json.body.length;i++){
|
||||
let option=json.body[i];
|
||||
option.name=option.organization;
|
||||
if(option.pid){
|
||||
option.pId=option.pid;
|
||||
}else{
|
||||
option.pId='hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc';
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
json.body.push({
|
||||
name:"全部机构",
|
||||
isParent:true,
|
||||
open:true,
|
||||
id:'hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc',
|
||||
})
|
||||
}else{
|
||||
//数据为空
|
||||
this.statusParamsTree.status=4;
|
||||
}
|
||||
json.body.push({
|
||||
name:"全部机构",
|
||||
isParent:true,
|
||||
open:true,
|
||||
id:'hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc',
|
||||
})
|
||||
|
||||
}else{
|
||||
//请求失败
|
||||
this.statusParamsTree.status=0;
|
||||
}
|
||||
|
||||
this.zNodes=json.body;
|
||||
$.fn.zTree.init($("#treeDemo"), this.setting, this.zNodes);
|
||||
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
|
||||
|
||||
Reference in New Issue
Block a user