From 2fd76f71f72293d16e26ca6f752a1aaac50a4868 Mon Sep 17 00:00:00 2001 From: SHAOJIAHAO <55341701@qq.com> Date: Thu, 4 Aug 2022 08:46:36 +0800 Subject: [PATCH] =?UTF-8?q?[=E6=96=B0=E5=A2=9E]=E7=B3=BB=E7=BB=9F=E7=AE=A1?= =?UTF-8?q?=E7=90=86=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/home/home.module.ts | 18 +- src/app/home/nav/nav.component.scss | 5 + .../or/addor/addor.component.html | 23 ++ .../or/addor/addor.component.scss | 0 .../or/addor/addor.component.ts | 27 ++ .../or/editor/editor.component.html | 24 ++ .../or/editor/editor.component.scss | 0 .../or/editor/editor.component.ts | 29 ++ .../system-management/or/or.component.html | 44 ++- .../system-management/or/or.component.scss | 70 ++++ .../home/system-management/or/or.component.ts | 304 +++++++++++++++++- .../user/adduser/adduser.component.html | 57 ++++ .../user/adduser/adduser.component.scss | 0 .../user/adduser/adduser.component.ts | 87 +++++ .../user/edituser/edituser.component.html | 68 ++++ .../user/edituser/edituser.component.scss | 0 .../user/edituser/edituser.component.ts | 112 +++++++ .../user/user.component.html | 68 +++- .../user/user.component.scss | 52 +++ .../system-management/user/user.component.ts | 152 ++++++++- src/theme.scss | 5 - 21 files changed, 1129 insertions(+), 16 deletions(-) create mode 100644 src/app/home/system-management/or/addor/addor.component.html create mode 100644 src/app/home/system-management/or/addor/addor.component.scss create mode 100644 src/app/home/system-management/or/addor/addor.component.ts create mode 100644 src/app/home/system-management/or/editor/editor.component.html create mode 100644 src/app/home/system-management/or/editor/editor.component.scss create mode 100644 src/app/home/system-management/or/editor/editor.component.ts create mode 100644 src/app/home/system-management/user/adduser/adduser.component.html create mode 100644 src/app/home/system-management/user/adduser/adduser.component.scss create mode 100644 src/app/home/system-management/user/adduser/adduser.component.ts create mode 100644 src/app/home/system-management/user/edituser/edituser.component.html create mode 100644 src/app/home/system-management/user/edituser/edituser.component.scss create mode 100644 src/app/home/system-management/user/edituser/edituser.component.ts delete mode 100644 src/theme.scss diff --git a/src/app/home/home.module.ts b/src/app/home/home.module.ts index 402c78e..2f58651 100644 --- a/src/app/home/home.module.ts +++ b/src/app/home/home.module.ts @@ -35,6 +35,12 @@ import { NzTreeSelectModule } from 'ng-zorro-antd/tree-select'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { NzModalModule } from 'ng-zorro-antd/modal'; import { NzMessageModule } from 'ng-zorro-antd/message'; +import { AdduserComponent } from './system-management/user/adduser/adduser.component'; +import { EdituserComponent } from './system-management/user/edituser/edituser.component'; +import { NzPaginationModule } from 'ng-zorro-antd/pagination'; +import { NzTreeModule } from 'ng-zorro-antd/tree'; +import { AddorComponent } from './system-management/or/addor/addor.component'; +import { EditorComponent } from './system-management/or/editor/editor.component'; @NgModule({ declarations: [ NavComponent, @@ -56,7 +62,11 @@ import { NzMessageModule } from 'ng-zorro-antd/message'; StationTaskApplyComponent, StationWeeklyPlanComponent, AddroleComponent, - EditroleComponent + EditroleComponent, + AdduserComponent, + EdituserComponent, + AddorComponent, + EditorComponent ], imports: [ CommonModule, @@ -75,8 +85,10 @@ import { NzMessageModule } from 'ng-zorro-antd/message'; ReactiveFormsModule, NzModalModule, NzMessageModule, - NzInputModule + NzInputModule, + NzPaginationModule, + NzTreeModule ], - entryComponents: [AddroleComponent, EditroleComponent] + entryComponents: [AddroleComponent, EditroleComponent, AdduserComponent, EdituserComponent] }) export class HomeModule { } diff --git a/src/app/home/nav/nav.component.scss b/src/app/home/nav/nav.component.scss index 19bd89a..58d88fe 100644 --- a/src/app/home/nav/nav.component.scss +++ b/src/app/home/nav/nav.component.scss @@ -13,11 +13,15 @@ nz-header { align-items: center; padding: 0 20px; .logobox{ + width: 220px; img{ margin-right: 8px; } + font-size: 16px; } .headerbtn{ + text-align: right; + width: 220px; a{ color: #fff; } @@ -35,6 +39,7 @@ nz-header { justify-content: center; align-items: center; cursor: pointer; + font-size: 16px; } } diff --git a/src/app/home/system-management/or/addor/addor.component.html b/src/app/home/system-management/or/addor/addor.component.html new file mode 100644 index 0000000..027be1f --- /dev/null +++ b/src/app/home/system-management/or/addor/addor.component.html @@ -0,0 +1,23 @@ +
+
+ + + + + + + + + + + + + +
+
\ No newline at end of file diff --git a/src/app/home/system-management/or/addor/addor.component.scss b/src/app/home/system-management/or/addor/addor.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/home/system-management/or/addor/addor.component.ts b/src/app/home/system-management/or/addor/addor.component.ts new file mode 100644 index 0000000..7fd172c --- /dev/null +++ b/src/app/home/system-management/or/addor/addor.component.ts @@ -0,0 +1,27 @@ +import { Component, OnInit } from '@angular/core'; +import { NzModalRef } from 'ng-zorro-antd/modal'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { HttpClient } from '@angular/common/http'; +@Component({ + selector: 'app-addor', + templateUrl: './addor.component.html', + styleUrls: ['./addor.component.scss'] +}) +export class AddorComponent implements OnInit { + + validateForm!: FormGroup; + constructor(private modal: NzModalRef, private fb: FormBuilder, private http: HttpClient) { } + + ngOnInit(): void { + this.validateForm = this.fb.group({ + name: [null, [Validators.required]], + // code: [null, [Validators.required]], + isGasStation: [false] + }); + } + destroyModal(): void { + this.modal.destroy({ data: 'this the result data' }); + } + + +} diff --git a/src/app/home/system-management/or/editor/editor.component.html b/src/app/home/system-management/or/editor/editor.component.html new file mode 100644 index 0000000..2351467 --- /dev/null +++ b/src/app/home/system-management/or/editor/editor.component.html @@ -0,0 +1,24 @@ +
+
+ + + + + + + + + + + + + +
+
\ No newline at end of file diff --git a/src/app/home/system-management/or/editor/editor.component.scss b/src/app/home/system-management/or/editor/editor.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/home/system-management/or/editor/editor.component.ts b/src/app/home/system-management/or/editor/editor.component.ts new file mode 100644 index 0000000..96a960b --- /dev/null +++ b/src/app/home/system-management/or/editor/editor.component.ts @@ -0,0 +1,29 @@ +import { Component, OnInit, Input } from '@angular/core'; +import { NzModalRef } from 'ng-zorro-antd/modal'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { HttpClient } from '@angular/common/http'; +@Component({ + selector: 'app-editor', + templateUrl: './editor.component.html', + styleUrls: ['./editor.component.scss'] +}) +export class EditorComponent implements OnInit { + @Input() data?: any; + validateForm!: FormGroup; + constructor(private modal: NzModalRef, private fb: FormBuilder, private http: HttpClient) { } + + datacopy: any + ngOnInit(): void { + this.validateForm = this.fb.group({ + name: [null, [Validators.required]], + // code: [null, [Validators.required]], + isGasStation: [] + }); + this.datacopy = JSON.parse(JSON.stringify(this.data)) + } + destroyModal(): void { + this.modal.destroy({ data: 'this the result data' }); + } + + +} diff --git a/src/app/home/system-management/or/or.component.html b/src/app/home/system-management/or/or.component.html index fe5f013..5a32310 100644 --- a/src/app/home/system-management/or/or.component.html +++ b/src/app/home/system-management/or/or.component.html @@ -1 +1,43 @@ -

or works!

+
+
+
+ 组织机构列表 + + {{totalCount}}个单位 +
+
+ + + + +
+
+
+ 机构名称 + 操作 +
+ + + +
+ {{ node.title }} + + 新增 + 编辑 + 删除 + +
+ + + + + + + + + +
\ No newline at end of file diff --git a/src/app/home/system-management/or/or.component.scss b/src/app/home/system-management/or/or.component.scss index e69de29..8497646 100644 --- a/src/app/home/system-management/or/or.component.scss +++ b/src/app/home/system-management/or/or.component.scss @@ -0,0 +1,70 @@ +.orbox { + width: 650px; + height: 100%; + overflow-y: auto; + background: #fff; + box-sizing: border-box; + padding: 20px; + font-size: 15px; +} + +.topbox { + width: 100%; + height: 36px; + display: flex; + align-items: center; + justify-content: space-between; + + .lefttop { + span:nth-child(1) { + color: #000D21; + margin-right: 16px; + } + + span:nth-child(2) { + color: rgba(36, 36, 36, 0.24); + } + } + + .righttop { + height: 36px; + display: flex; + + button { + margin-left: 16px; + } + + nz-input-group { + height: 32px; + } + } +} + +.treeTitle { + width: 100%; + height: 40px; + line-height: 40px; + margin-bottom: 10px; + display: flex; + justify-content: space-between; + color: #000D21; + box-sizing: border-box; + padding-left: 30px; + padding-right: 95px; + border-bottom: 1px solid #E4E7EC; +} + +.nodebox { + font-size: 14px; + text-align: left; +} + +.operation { + position: absolute; + right: 0; + + span { + margin-left: 20px; + } + +} diff --git a/src/app/home/system-management/or/or.component.ts b/src/app/home/system-management/or/or.component.ts index 7999f38..e5d4c7a 100644 --- a/src/app/home/system-management/or/or.component.ts +++ b/src/app/home/system-management/or/or.component.ts @@ -1,5 +1,17 @@ -import { Component, OnInit } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { Component, OnInit, AfterViewInit, ViewChild, ViewContainerRef } from '@angular/core'; +import { TreeService } from 'src/app/service/tree.service'; +import { NzFormatEmitEvent, NzTreeComponent, NzTreeNodeOptions } from 'ng-zorro-antd/tree'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { NzModalService } from 'ng-zorro-antd/modal'; +import { NzMessageService } from 'ng-zorro-antd/message'; +import { AddorComponent } from './addor/addor.component'; +import { EditorComponent } from './editor/editor.component'; +import { NzFormatBeforeDropEvent } from 'ng-zorro-antd/tree'; +import { Observable, of } from 'rxjs'; +import { delay } from 'rxjs/operators'; +import { CustomReuseStrategy } from 'src/app/CustomReuseStrategy'; @Component({ selector: 'app-or', templateUrl: './or.component.html', @@ -7,9 +19,297 @@ import { Component, OnInit } from '@angular/core'; }) export class OrComponent implements OnInit { - constructor() { } + validateForm!: FormGroup; + constructor(private fb: FormBuilder, private http: HttpClient, private toTree: TreeService, private modal: NzModalService, private message: NzMessageService, private viewContainerRef: ViewContainerRef) { } ngOnInit(): void { + this.validateForm = this.fb.group({ + search: [null] + }); + this.getAllOrganization() + + this.deleteRouteSnapshot(); + } + deleteRouteSnapshot() { + CustomReuseStrategy.deleteRouteSnapshot('/system/host'); + } + //搜索框提交 + submitForm(): void { + for (const i in this.validateForm.controls) { + this.validateForm.controls[i].markAsDirty(); + this.validateForm.controls[i].updateValueAndValidity(); + } + } + + //获取所有组织机构 + searchValue = ''; + nzExpandAll = false; + totalCount: string + + allOrList: any + getAllOrganization() { + let OrganizationUnitId = '' + let params = { + // OrganizationUnitId: OrganizationUnitId, + // IsContainsChildren: "true" + ContainsChildren: true, + pageSize: 9999 + } + this.http.get('/api/Organizations', { + params: params + }).subscribe((data: any) => { + console.log('组织机构列表', data) + this.totalCount = data.totalCount + data.items.forEach(element => { + element.key = element.id + element.title = element.name + element.selectable = false + }); + this.allOrList = data.items + this.nodes = [...this.toTree.toTree(data.items)] + this.defaultExpandedKeys = [this.nodes[0].id] + this.defaultExpandedKeys = [...this.defaultExpandedKeys] + }) + } + + + @ViewChild('nzTreeComponent', { static: false }) nzTreeComponent!: NzTreeComponent; + + defaultExpandedKeys = []; + + nodes: any[] = [] + + + addOr(node?: any) { + console.log(node) + const modal = this.modal.create({ + nzTitle: node ? '新增组织机构' : '新增一级组织机构', + nzContent: AddorComponent, + nzViewContainerRef: this.viewContainerRef, + nzWidth: 288, + nzComponentParams: {}, + nzOnOk: async () => { + if (instance.validateForm.valid) { + await new Promise(resolve => { + let body = { + name: instance.validateForm.value.name, + parentId: node ? Number(node.key) : null, + isGasStation: instance.validateForm.value.isGasStation + } + this.http.post('/api/Organizations', body).subscribe(data => { + resolve(data) + this.message.create('success', '创建成功！'); + this.nzTreeComponent.getExpandedNodeList().forEach((item) => { + this.defaultExpandedKeys.push(item.key) + }) + this.getAllOrganization() + return true + }, err => { + resolve(err) + this.message.create('warning', '创建失败'); + return false + }) + }) + } else { + this.message.create('warning', '请填写完整！'); + return false + } + } + }); + const instance = modal.getContentComponent(); + + } + editOr(node) { + // console.log(node) + const modal = this.modal.create({ + nzTitle: '编辑组织机构', + nzContent: EditorComponent, + nzViewContainerRef: this.viewContainerRef, + nzWidth: 288, + nzComponentParams: { + data: node.origin, + }, + nzOnOk: async () => { + if (instance.validateForm.valid) { + await new Promise(resolve => { + let body = { + name: instance.validateForm.value.name, + isGasStation: instance.validateForm.value.isGasStation, + parentId: node.origin.parentId + } + this.http.put(`/api/Organizations/${node.origin.id}`, body).subscribe(data => { + resolve(data) + this.message.create('success', '编辑成功！'); + this.nzTreeComponent.getExpandedNodeList().forEach((item) => { + this.defaultExpandedKeys.push(item.key) + }) + this.getAllOrganization() + return true + }, err => { + resolve(err) + this.message.create('warning', '编辑失败'); + return false + }) + }) + } else { + this.message.create('warning', '请填写完整！'); + return false + } + } + }); + const instance = modal.getContentComponent(); + } + deleteOr(item) { + console.log(item) + if (item.origin.children && item.origin.children.length != 0) { + this.message.create('warning', '请先删除所有子节点'); + } else { + this.modal.confirm({ + nzTitle: `确定要删除${item.title}这个机构吗?`, + nzOkText: '确定', + nzOkType: 'primary', + nzOnOk: () => { + this.http.delete(`/api/Organizations/${item.origin.id}`).subscribe(data => { + this.nzTreeComponent.getExpandedNodeList().forEach((item) => { + this.defaultExpandedKeys.push(item.key) + }) + this.getAllOrganization() + this.message.create('success', '删除成功！'); + }) + }, + nzCancelText: '取消', + nzOnCancel: () => { + + } + }); + } + } + + nzEvent(event: NzFormatEmitEvent): void { + console.log('event', event) + if (this.isDrag) { + let parentId + if (this.pos == 0) {//目标节点内部 + parentId = event.node.key + } else { + if (event.node.level == 0) { + parentId = null + } else { + parentId = event.node.origin.parentId + } + } + + let body = { + parentId: parentId, + name: event.dragNode.origin.name, + isGasStation: event.dragNode.origin.isGasStation + } + this.http.put(`/api/Organizations/${event.dragNode.origin.id}`, body).subscribe(data => { + this.message.create('success', '拖拽成功！'); + this.nzTreeComponent.getExpandedNodeList().forEach((item) => { + this.defaultExpandedKeys.push(item.key) + }) + this.getAllOrganization() + return true + }, err => { + this.message.create('warning', '拖拽失败'); + return false + }) + + + // console.log('this.allOrList', this.allOrList) + // let orders = {} + // let originalData = JSON.parse(JSON.stringify(this.allOrList || [])) //tree原始数据 + // let targetNodeData = []//拖动移入节点的数据，用于遍历求出放在该数组的第几位 + //找到需要重新排序的数组 + // if (this.pos == 0) { + // originalData.forEach(item => { + // if (item.parentId == event.node.key) { + // targetNodeData.push(item) + // } + // }) + // } else { + // if (event.node.origin.parentId) {//如果拖动目标为非一级节点 + // originalData.forEach(item => { + // if (item.parentId == event.node.origin.parentId) { + // targetNodeData.push(item) + // } + // }) + // } else {//如果拖动目标为一级节点 + // originalData.forEach(item => { + // if (!item.parentId) { + // targetNodeData.push(item) + // } + // }) + // } + // } + + + // let idArr = [] + // targetNodeData.forEach(i => { + // idArr.push(i.id) + // }) + // if (this.pos == 0 && event.node.origin.children.length == 1) { + // // console.log("移入,没有兄弟") + // let key = event.dragNode.key + // orders[key] = 0 + // parentId = event.node.key + // } else { + + // let array = [] + // targetNodeData.forEach(item => { + // if (item.id != event.dragNode.key) { //将拖动项先移除掉 + // array.push(item) + // } + // }) + // if (event.dragNode.isEnd[event.dragNode.isEnd.length - 1]) { //如果移入到最后一个 + // // console.log("最后") + // array.push(event.dragNode.origin) + // } else if (event.dragNode.isStart[event.dragNode.isStart.length - 1]) {//如果移入到第一个 + // // console.log("第一") + // array.unshift(event.dragNode.origin) + // } else {//如果移入中间位置 + // // console.log("中间") + // array.splice(event.node.origin.order, 0, event.dragNode.origin) + // } + // array.forEach((item, key) => { + // orders[item.id] = key + // }) + // console.log("移入,多个兄弟",orders) + // } + + // let obj = { + // id: event.dragNode.origin.id, + // parentId: parentId, + // orders: orders + // } + + // this.http.put("/api/DisposalNodes/Sort", obj).subscribe(data => { + // const config = new MatSnackBarConfig(); + // config.verticalPosition = 'top'; + // config.duration = 3000 + // this.snackBar.open('排序成功', '确定', config) + // this.refurbishTreeData() + // }) + + + + } + } + isDrag //是否可以拖动 + pos//放置位置 + beforeDrop = (arg: NzFormatBeforeDropEvent) => { + console.log('arg', arg) + if (arg.node.level === 0) {//如果为数据节点则不允许拖到一级节点 + this.message.create('warning', '不允许拖拽到一级节点'); + this.isDrag = false + return of(false); + } else { + this.isDrag = true + this.pos = arg.pos + return of(true) + } + } } diff --git a/src/app/home/system-management/user/adduser/adduser.component.html b/src/app/home/system-management/user/adduser/adduser.component.html new file mode 100644 index 0000000..483daec --- /dev/null +++ b/src/app/home/system-management/user/adduser/adduser.component.html @@ -0,0 +1,57 @@ +
+
+ + 账号 + + + + + + + + 姓名 + + + + + + + + 所属机构 + + + + + + + + + + + + + + + + 手机号 + + + + + + + +
+
\ No newline at end of file diff --git a/src/app/home/system-management/user/adduser/adduser.component.scss b/src/app/home/system-management/user/adduser/adduser.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/home/system-management/user/adduser/adduser.component.ts b/src/app/home/system-management/user/adduser/adduser.component.ts new file mode 100644 index 0000000..fa3827f --- /dev/null +++ b/src/app/home/system-management/user/adduser/adduser.component.ts @@ -0,0 +1,87 @@ +import { Component, OnInit, Input } from '@angular/core'; +import { NzModalRef } from 'ng-zorro-antd/modal'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { HttpClient } from '@angular/common/http'; +import { TreeService } from 'src/app/service/tree.service'; + +@Component({ + selector: 'app-adduser', + templateUrl: './adduser.component.html', + styleUrls: ['./adduser.component.scss'] +}) +export class AdduserComponent implements OnInit { + + @Input() title?: string; + @Input() subtitle?: string; + validateForm!: FormGroup; + constructor(private modal: NzModalRef, private fb: FormBuilder, private http: HttpClient, private toTree: TreeService) { } + + ngOnInit(): void { + this.validateForm = this.fb.group({ + account: [null, [Validators.required]], + name: [null, [Validators.required]], + organization: [null, [Validators.required]], + role: [[], [Validators.required]], + role2: [[]], + phonenum: [null, [Validators.required]] + }); + + this.getAllRoles() + this.getAllRoles2() + this.getAllOrganization() + } + destroyModal(): void { + this.modal.destroy({ data: 'this the result data' }); + } + + listOfData: any[] = []; + listOfData2: any[] = []; + //获取角色列表 + getAllRoles() { + let params = { + SkipCount: '0', + MaxResultCount: '999' + } + this.http.get('/api/services/app/Role/GetAll', { + params: params + }).subscribe((data: any) => { + // console.log('角色列表', data.result.items) + this.listOfData = data.result.items + }) + } + //获取角色列表 + getAllRoles2() { + let params = { + SkipCount: '0', + MaxResultCount: '999', + IsViolationRoles:'true' + } + this.http.get('/api/services/app/Role/GetAll', { + params: params + }).subscribe((data: any) => { + // console.log('角色列表', data.result.items) + this.listOfData2 = data.result.items + }) + } + //获取所有组织机构 + nodes: any = [] + getAllOrganization() { + let OrganizationUnitId = sessionStorage.getItem('isGasStation') == 'true' ? JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id : JSON.parse(sessionStorage.getItem('userdata')).organization.id + let params = { + OrganizationUnitId: OrganizationUnitId, + IsContainsChildren: "true" + } + this.http.get('/api/services/app/Organization/GetAll', { + params: params + }).subscribe((data: any) => { + data.result.items.forEach(element => { + if (element.id == OrganizationUnitId) { + element.parentId = null + } + element.key = element.id + element.title = element.displayName + }); + this.nodes = [...this.toTree.toTree(data.result.items)] + }) + } +} diff --git a/src/app/home/system-management/user/edituser/edituser.component.html b/src/app/home/system-management/user/edituser/edituser.component.html new file mode 100644 index 0000000..3dce691 --- /dev/null +++ b/src/app/home/system-management/user/edituser/edituser.component.html @@ -0,0 +1,68 @@ +
+
+ + 账号 + + + + + + + + 姓名 + + + + + + + + 所属机构 + + + + + + + + + + + + + + + + 手机号 + + + + + + +
+
\ No newline at end of file diff --git a/src/app/home/system-management/user/edituser/edituser.component.scss b/src/app/home/system-management/user/edituser/edituser.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/home/system-management/user/edituser/edituser.component.ts b/src/app/home/system-management/user/edituser/edituser.component.ts new file mode 100644 index 0000000..4e3ecdf --- /dev/null +++ b/src/app/home/system-management/user/edituser/edituser.component.ts @@ -0,0 +1,112 @@ +import { Component, OnInit, Input } from '@angular/core'; +import { NzModalRef } from 'ng-zorro-antd/modal'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { HttpClient } from '@angular/common/http'; +import { TreeService } from 'src/app/service/tree.service'; + +@Component({ + selector: 'app-edituser', + templateUrl: './edituser.component.html', + styleUrls: ['./edituser.component.scss'] +}) +export class EdituserComponent implements OnInit { + + @Input() data?: any; + @Input() listOfData?: any; + @Input() listOfData2?: any; + @Input() nodes?: any; + validateForm!: FormGroup; + constructor(private modal: NzModalRef, private fb: FormBuilder, private http: HttpClient, private toTree: TreeService) { } + + ngOnInit(): void { + console.log(this.data) + let roleData1 = [] + let roleData2 = [] + this.data.roleNames.forEach(element => { + if (element.indexOf('LEVEL') != -1) { + roleData2.push(element) + } else { + roleData1.push(element) + } + }); + this.validateForm = this.fb.group({ + account: [null, [Validators.required]], + name: [null, [Validators.required]], + organization: [null, [Validators.required]], + role: [roleData1, [Validators.required]], + role2: [roleData2], + phonenum: [null, [Validators.required]] + }); + if (this.listOfData.length == 0) { + this.getAllRoles() + } + if (this.listOfData2.length == 0) { + this.getAllRoles2() + } + if (this.nodes.length == 0) { + this.getAllOrganization() + } + } + + destroyModal(): void { + this.modal.destroy({ data: 'this the result data' }); + } + + //获取角色列表 + async getAllRoles() { + let params = { + SkipCount: '0', + MaxResultCount: '999' + } + await new Promise((resolve, reject) => { + this.http.get('/api/services/app/Role/GetAll', { + params: params + }).subscribe((data: any) => { + resolve(data) + this.listOfData = data.result.items + }) + }) + } + + //获取角色列表 + async getAllRoles2() { + let params = { + SkipCount: '0', + MaxResultCount: '999', + IsViolationRoles: 'true' + } + await new Promise((resolve, reject) => { + this.http.get('/api/services/app/Role/GetAll', { + params: params + }).subscribe((data: any) => { + resolve(data) + this.listOfData2 = data.result.items + }) + }) + } + + //获取所有组织机构 + async getAllOrganization() { + let OrganizationUnitId = sessionStorage.getItem('isGasStation') == 'true' ? JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id : JSON.parse(sessionStorage.getItem('userdata')).organization.id + let params = { + OrganizationUnitId: OrganizationUnitId, + IsContainsChildren: "true" + } + await new Promise((resolve, reject) => { + this.http.get('/api/services/app/Organization/GetAll', { + params: params + }).subscribe((data: any) => { + data.result.items.forEach(element => { + if (element.id == OrganizationUnitId) { + element.parentId = null + } + element.key = element.id + element.title = element.displayName + }); + this.nodes = [...this.toTree.toTree(data.result.items)] + resolve(data) + }) + }) + } + +} diff --git a/src/app/home/system-management/user/user.component.html b/src/app/home/system-management/user/user.component.html index d039bb7..6d4cedc 100644 --- a/src/app/home/system-management/user/user.component.html +++ b/src/app/home/system-management/user/user.component.html @@ -1 +1,67 @@ -

user works!

+
+
+ + 用户管理 + +
+
+
+ + + + + +
+ + +
+
+
+ + + + 账号 + 姓名 + 角色/预警接收级别 + 所属机构 + 审核状态 + 用户状态 + 操作 + + + + + 2 + 3 + + 4 + + item + 5 + + + 6 + + + 8 + + + 编辑 + 重置密码 + 启用 + + 删除 + + + + +
+ +
+
\ No newline at end of file diff --git a/src/app/home/system-management/user/user.component.scss b/src/app/home/system-management/user/user.component.scss index e69de29..fa6a0e6 100644 --- a/src/app/home/system-management/user/user.component.scss +++ b/src/app/home/system-management/user/user.component.scss @@ -0,0 +1,52 @@ +.box { + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + color: #303133; + + .header { + width: 100%; + height: 56px; + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 20px; + border-bottom: 1px solid #E4E7EC; + + span { + color: #303133; + font-weight: 500; + font-size: 16px; + } + } + + .searchbox{ + height: 70px; + display: flex; + justify-content: space-between; + padding: 0 20px; + align-items: center; + .search{ + width: 60%; + display: flex; + input{ + margin-right: 16px; + } + button{ + margin-right: 16px; + } + } + } + .content { + flex: 1; + box-sizing: border-box; + padding: 18px; + padding-top: 0px; + .operation { + a { + margin-right: 16px; + } + } + } +} diff --git a/src/app/home/system-management/user/user.component.ts b/src/app/home/system-management/user/user.component.ts index 5df0c83..4672e0a 100644 --- a/src/app/home/system-management/user/user.component.ts +++ b/src/app/home/system-management/user/user.component.ts @@ -1,5 +1,12 @@ -import { Component, OnInit } from '@angular/core'; - +import { Component, OnInit, TemplateRef, ViewContainerRef } from '@angular/core'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { NzFormatEmitEvent, NzTreeComponent, NzTreeNodeOptions } from 'ng-zorro-antd/tree'; +import { NzModalService } from 'ng-zorro-antd/modal'; +import { AdduserComponent } from './adduser/adduser.component'; +import { NzMessageService } from 'ng-zorro-antd/message'; +import { HttpClient } from '@angular/common/http'; +import { EdituserComponent } from './edituser/edituser.component'; +import { TreeService } from 'src/app/service/tree.service'; @Component({ selector: 'app-user', templateUrl: './user.component.html', @@ -7,9 +14,146 @@ import { Component, OnInit } from '@angular/core'; }) export class UserComponent implements OnInit { - constructor() { } - + validateForm!: FormGroup; + constructor(private fb: FormBuilder, private modal: NzModalService, private viewContainerRef: ViewContainerRef, private message: NzMessageService, private http: HttpClient, private toTree: TreeService) { } + searchForm = { + id: '', + name: '', + or: '' + } + usersNum + loading + usersLIst = [1] ngOnInit(): void { } + pageChange($event) { + + } + //新增用户 + addUser(): void { + const modal = this.modal.create({ + nzTitle: '新增用户', + nzContent: AdduserComponent, + nzViewContainerRef: this.viewContainerRef, + nzWidth: 460, + nzMaskClosable: false, + nzComponentParams: { + title: '', + subtitle: '' + }, + nzOnOk: async () => { + if (instance.validateForm.valid) { + await new Promise(resolve => { + let roleNames = [...instance.validateForm.value.role, ...instance.validateForm.value.role2] + let body = { + userName: instance.validateForm.value.account, + name: instance.validateForm.value.name, + organizationUnitId: Number(instance.validateForm.value.organization), + roleNames: roleNames, + phoneNumber: instance.validateForm.value.phonenum, + isActive: true + } + // this.http.post(this.addUrl, body).subscribe(data => { + // resolve(data) + // this.message.create('success', '创建成功！'); + // this.SkipCount = 0 + // this.getAllUsers() + // return true + // }, err => { + // resolve(err) + // this.message.create('warning', err.error.error.message); + // return false + // }) + }) + } else { + this.message.create('warning', '请填写完整！'); + return false + } + } + }); + const instance = modal.getContentComponent(); + modal.afterOpen.subscribe(() => console.log('[afterOpen] emitted!')); + modal.afterClose.subscribe(result => console.log('[afterClose] The result is:', result)); + } + //编辑用户 + editUser(data): void { + console.log(data) + const modal = this.modal.create({ + nzTitle: '编辑用户', + nzContent: EdituserComponent, + nzViewContainerRef: this.viewContainerRef, + nzWidth: 460, + nzMaskClosable: false, + nzComponentParams: { + data: data + }, + nzOnOk: async () => { + if (instance.validateForm.valid) { + await new Promise(resolve => { + + for (let index = 0; index < instance.validateForm.value.role2.length; index++) { + const element = instance.validateForm.value.role2[index]; + if (element.indexOf('HANDLE') != -1) { + instance.validateForm.value.role2.splice(index, 1) + index-- + } + } + let roleNames = [...instance.validateForm.value.role, ...instance.validateForm.value.role2] + let body = { + id: data.id, + userName: instance.validateForm.value.account, + name: instance.validateForm.value.name, + organizationUnitId: instance.validateForm.value.organization, + roleNames: roleNames, + phoneNumber: instance.validateForm.value.phonenum, + isActive: true + } + // this.http.put(this.editUrl, body).subscribe(data => { + // resolve(data) + // this.message.create('success', '编辑成功！'); + // this.getAllUsers() + // return true + // }, err => { + // resolve(err) + // this.message.create('warning', '编辑失败'); + // return false + // }) + }) + } else { + this.message.create('warning', '请填写完整！'); + return false + } + } + }); + const instance = modal.getContentComponent(); + } + + //重置密码 + resetPassword(item) { + console.log(item) + this.modal.confirm({ + nzTitle: `确定要重置${item.userName}这个账户的密码吗?`, + nzOkText: '确定', + nzOkType: 'primary', + nzOnOk: () => { + let body = { + userId: item.id + } + this.http.post('/api/services/app/User/ResetPassword', body).subscribe(data => { + this.message.create('success', '重置成功！'); + }) + }, + nzCancelText: '取消', + nzOnCancel: () => { + + } + }); + } + cancel(item, type) { + + } + delete(item) { + + } } diff --git a/src/theme.scss b/src/theme.scss deleted file mode 100644 index 87c3565..0000000 --- a/src/theme.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -------- 引入官方提供的 less 样式入口文件 ----------- -@import "../node_modules/ng-zorro-antd/ng-zorro-antd.less"; - -// -------- 自定义参数覆盖 ----------- -@primary-color : #f5222d; \ No newline at end of file