提交修改用户部门名称由输入框->树形选择

This commit is contained in:
shibanglin 2022-09-20 10:53:45 +08:00
parent 45d32a59c5
commit aaae8f207c
3 changed files with 31 additions and 14 deletions

View File

@ -307,20 +307,28 @@
</div>
<div nz-row>
<nz-form-item>
<nz-form-label [nzSm]="8" [nzXs]="24" nzFor="departmentId">{{ 'mxk.users.departmentId' | i18n }}
</nz-form-label>
<nz-form-label [nzSm]="8" [nzXs]="24" nzFor="departmentId">{{ 'mxk.users.departmentId' | i18n }}</nz-form-label>
<nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
nzErrorTip="The input is not valid departmentId!">
<input [(ngModel)]="form.model.departmentId" [ngModelOptions]="{ standalone: true }" nz-input
name="departmentId" id="departmentId" />
nzErrorTip="The input is not valid departmentId!">
<input [(ngModel)]="form.model.departmentId" [ngModelOptions]="{ standalone: true }" [disabled]="true" nz-input name="departmentId" id="departmentId" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSm]="8" [nzXs]="24" nzFor="department">{{ 'mxk.users.department' | i18n }}</nz-form-label>
<nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
nzErrorTip="The input is not valid department!">
<input [(ngModel)]="form.model.department" [ngModelOptions]="{ standalone: true }" nz-input
name="department" id="department" />
<nz-form-label [nzSm]="8" [nzXs]="24" nzFor="departmentId">{{ 'mxk.users.department' | i18n }}
</nz-form-label>
<nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid departmentId!">
<!-- <input [(ngModel)]="form.model.departmentId" [ngModelOptions]="{ standalone: true }" nz-input name="departmentId" id="departmentId" />-->
<nz-tree-select
#orgTree
[nzNodes]="orgNodes"
nzShowSearch
nzPlaceHolder="Please select"
[(ngModel)]="form.model.departmentId"
[ngModelOptions]="{ standalone: true }"
(ngModelChange)="onDeptChange($event)"
nzVirtualHeight="300px"
></nz-tree-select>
</nz-form-control>
</nz-form-item>
</div>

View File

@ -14,7 +14,7 @@
* limitations under the License.
*/
import { Component, ChangeDetectorRef, Input, OnInit, Inject } from '@angular/core';
import { Component, ChangeDetectorRef, Input, OnInit, Inject, ViewChild} from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { I18NService } from '@core';
import { _HttpClient, ALAIN_I18N_TOKEN, SettingsService } from '@delon/theme';
@ -27,6 +27,7 @@ import { NzUploadFile, NzUploadChangeParam } from 'ng-zorro-antd/upload';
import { Users } from '../../../entity/Users';
import { UsersService } from '../../../service/users.service';
import { NzTreeSelectComponent } from "ng-zorro-antd/tree-select";
const getBase64 = (file: File): Promise<string | ArrayBuffer | null> =>
new Promise((resolve, reject) => {
@ -66,7 +67,8 @@ export class UserEditerComponent implements OnInit {
@Input() id?: String;
@Input() parentNode?: NzTreeNode;
@Input() isEdit?: boolean;
@Input() orgNodes!: any[];
@ViewChild("orgTree") orgTree!: NzTreeSelectComponent;
form: {
submitting: boolean;
model: Users;
@ -128,7 +130,12 @@ export class UserEditerComponent implements OnInit {
}
}
}
onDeptChange(key: string): void {
let node = this.orgTree.getTreeNodeByKey(key);
if (node){
this.form.model.department = node.title
}
}
onClose(e: MouseEvent): void {
e.preventDefault();
this.modalRef.destroy({ refresh: false });

View File

@ -183,6 +183,7 @@ export class UsersComponent implements OnInit {
nzComponentParams: {
isEdit: false,
parentNode: this.treeNodes.activated,
orgNodes: this.treeNodes.nodes,
id: ''
},
nzWidth: 750,
@ -204,6 +205,7 @@ export class UsersComponent implements OnInit {
nzViewContainerRef: this.viewContainerRef,
nzComponentParams: {
isEdit: true,
orgNodes: this.treeNodes.nodes,
id: editId
},
nzWidth: 750,