Selaa lähdekoodia

组织机构列表列宽比例调整,编辑窗口->父级节点修改成树形选择器

shibanglin 2 vuotta sitten
vanhempi
commit
3fc96c45b0

+ 16 - 3
maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/organizations/organization-editer/organization-editer.component.html

@@ -72,9 +72,22 @@
           </nz-form-label>
           <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48"
             nzErrorTip="The input is not valid parentName!">
-            <input [(ngModel)]="form.model.parentName" readonly [ngModelOptions]="{ standalone: true }" nz-input
-              name="parentName" id="parentName" />
+            <!--<input [(ngModel)]="form.model.parentName" readonly [ngModelOptions]="{ standalone: true }" nz-input
+              name="parentName" id="parentName" />-->
+            <nz-tree-select
+              #orgTree
+              [nzNodes]="orgNodes"
+              nzShowSearch
+              nzPlaceHolder="Please select"
+              [(ngModel)]="form.model.parentId"
+              [ngModelOptions]="{ standalone: true }"
+              (ngModelChange)="onDeptChange($event)"
+              nzVirtualHeight="300px"
+            ></nz-tree-select>
           </nz-form-control>
+
+
+
         </nz-form-item>
 
         <nz-form-item>
@@ -217,4 +230,4 @@
 <div *nzModalFooter>
   <button nz-button nzType="default" (click)="onClose($event)">{{ 'mxk.text.close' | i18n }}</button>
   <button nz-button nzType="primary" (click)="onSubmit($event)">{{ 'mxk.text.submit' | i18n }}</button>
-</div>
+</div>

+ 10 - 3
maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/organizations/organization-editer/organization-editer.component.ts

@@ -15,7 +15,7 @@
  */
 import { I18nPluralPipe } from '@angular/common';
 import { LocalizedString } from '@angular/compiler';
-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 { NzFormatEmitEvent, NzTreeNode, NzTreeNodeOptions } from 'ng-zorro-antd/
 
 import { Organizations } from '../../../entity/Organizations';
 import { OrganizationsService } from '../../../service/organizations.service';
+import {NzTreeSelectComponent} from "ng-zorro-antd/tree-select";
 
 @Component({
   selector: 'app-organization-editer',
@@ -45,7 +46,8 @@ export class OrganizationEditerComponent implements OnInit {
   @Input() id?: String;
   @Input() parentNode?: NzTreeNode;
   @Input() isEdit?: boolean;
-
+  @Input() orgNodes!: any[];
+  @ViewChild("orgTree") orgTree!: NzTreeSelectComponent;
   form: {
     submitting: boolean;
     model: Organizations;
@@ -80,7 +82,12 @@ export class OrganizationEditerComponent implements OnInit {
       }
     }
   }
-
+  onDeptChange(key: string): void {
+    let node = this.orgTree.getTreeNodeByKey(key);
+    if (node){
+      this.form.model.parentName = node.title
+    }
+  }
   onClose(e: MouseEvent): void {
     e.preventDefault();
     this.modalRef.destroy({ refresh: false });

+ 17 - 17
maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/organizations/organizations.component.html

@@ -62,33 +62,33 @@
           <tr>
             <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate"
               (nzCheckedChange)="onTableAllChecked($event)"></th>
-            <th nzAlign="center">{{ 'mxk.organizations.code' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.organizations.name' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.organizations.type' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.text.sortIndex' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.text.status' | i18n }}</th>
-            <th nzAlign="center"><a>{{ 'mxk.text.action' | i18n }}</a></th>
+            <th nzAlign="center" style="width: 20%;">{{ 'mxk.organizations.code' | i18n }}</th>
+            <th nzAlign="center" style="width: 30%;">{{ 'mxk.organizations.name' | i18n }}</th>
+            <th nzAlign="center" style="width: 10%;">{{ 'mxk.organizations.type' | i18n }}</th>
+            <th nzAlign="center" style="width: 10%;">{{ 'mxk.text.sortIndex' | i18n }}</th>
+            <th nzAlign="center" style="width: 10%;">{{ 'mxk.text.status' | i18n }}</th>
+            <th nzAlign="center" style="width: 20%;"><a>{{ 'mxk.text.action' | i18n }}</a></th>
           </tr>
         </thead>
         <tbody>
           <tr *ngFor="let data of query.results.rows">
             <td [nzChecked]="query.tableCheckedId.has(data.id)" [nzDisabled]="data.disabled"
               (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
-            <td nzAlign="left">
-              <span>{{ data.id }}</span>
+            <td nzAlign="center">
+              <span>{{ data.orgCode }}</span>
             </td>
-            <td nzAlign="left"> {{ data.orgName }}</td>
-            <td nzAlign="left" *ngIf="data.type == 'company'"> {{ 'mxk.organizations.type.company' | i18n }}</td>
-            <td nzAlign="left" *ngIf="data.type == 'division'"> {{ 'mxk.organizations.type.division' | i18n }}</td>
-            <td nzAlign="left" *ngIf="data.type == 'department'"> {{ 'mxk.organizations.type.department' | i18n }}</td>
-            <td nzAlign="left" *ngIf="data.type == 'entity'"> {{ 'mxk.organizations.type.entity' | i18n }}</td>
-            <td nzAlign="left" *ngIf="data.type == 'virtual'"> {{ 'mxk.organizations.type.virtual' | i18n }}</td>
+            <td nzAlign="center"> {{ data.orgName }}</td>
+            <td nzAlign="center" *ngIf="data.type == 'company'"> {{ 'mxk.organizations.type.company' | i18n }}</td>
+            <td nzAlign="center" *ngIf="data.type == 'division'"> {{ 'mxk.organizations.type.division' | i18n }}</td>
+            <td nzAlign="center" *ngIf="data.type == 'department'"> {{ 'mxk.organizations.type.department' | i18n }}</td>
+            <td nzAlign="center" *ngIf="data.type == 'entity'"> {{ 'mxk.organizations.type.entity' | i18n }}</td>
+            <td nzAlign="center" *ngIf="data.type == 'virtual'"> {{ 'mxk.organizations.type.virtual' | i18n }}</td>
             <td nzAlign="center"> {{ data.sortIndex }}</td>
             <td nzAlign="center"> <i *ngIf="data.status == 1" nz-icon nzType="check-circle" nzTheme="fill"
                 style="color: green"></i></td>
-            <td nzAlign="left" nzBreakWord="false">
+            <td nzAlign="center" nzBreakWord="false">
               <div nz-col>
-                <button nz-button type="button" (click)="onEdit($event, data.id)" style="float: left">
+                <button nz-button type="button" (click)="onEdit($event, data.id)">
                   {{ 'mxk.text.edit' | i18n }}
                 </button>
                 <button
@@ -102,4 +102,4 @@
       </nz-table>
     </div>
   </div>
-</nz-card>
+</nz-card>

+ 5 - 0
maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/organizations/organizations.component.ts

@@ -162,6 +162,7 @@ export class OrganizationsComponent implements OnInit {
       nzComponentParams: {
         isEdit: false,
         parentNode: this.treeNodes.activated,
+        orgNodes: this.treeNodes.nodes,
         id: ''
       },
       nzOnOk: () => new Promise(resolve => setTimeout(resolve, 1000))
@@ -170,6 +171,7 @@ export class OrganizationsComponent implements OnInit {
     modal.afterClose.subscribe(result => {
       if (result.refresh) {
         this.fetch();
+        this.tree()
       }
     });
   }
@@ -182,6 +184,7 @@ export class OrganizationsComponent implements OnInit {
       nzViewContainerRef: this.viewContainerRef,
       nzComponentParams: {
         isEdit: true,
+        orgNodes: this.treeNodes.nodes,
         id: editId
       },
       nzOnOk: () => new Promise(resolve => setTimeout(resolve, 1000))
@@ -190,6 +193,7 @@ export class OrganizationsComponent implements OnInit {
     modal.afterClose.subscribe(result => {
       if (result.refresh) {
         this.fetch();
+        this.tree()
       }
     });
   }
@@ -200,6 +204,7 @@ export class OrganizationsComponent implements OnInit {
       if (res.code == 0) {
         this.msg.success(this.i18n.fanyi('mxk.alert.delete.success'));
         this.fetch();
+        this.tree()
       } else {
         this.msg.error(this.i18n.fanyi('mxk.alert.delete.error'));
       }