调整用户组的选择方式

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/access/permissions/permissions.component.html

@@ -1,116 +1,162 @@
 <page-header> </page-header>
-
-<nz-card [nzBordered]="false">
-  <form nz-form [nzLayout]="'inline'" (ngSubmit)="onSearch()" class="search__form">
-    <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 24, lg: 24, xl: 48, xxl: 48 }">
-      <div nz-col nzMd="10" nzSm="24">
-        <nz-form-item>
-          <nz-form-label nzFor="roleName">{{ 'mxk.roles.name' | i18n }}</nz-form-label>
-          <nz-form-control>
-            <nz-input-group nzSearch [nzAddOnAfter]="suffixButton">
-              <input nz-input [(ngModel)]="query.params.groupName" [ngModelOptions]="{ standalone: true }"
-                name="groupName" readonly placeholder="" id="groupName" />
-            </nz-input-group>
-            <ng-template #suffixButton>
-              <button nz-button nzType="primary" (click)="onSelect($event)" nzSearch>{{ 'mxk.text.select' | i18n
-                }}</button>
-            </ng-template>
-          </nz-form-control>
-        </nz-form-item>
-      </div>
-      <div nz-col nzMd="10" nzSm="24">
-        <nz-form-item>
-          <nz-form-label nzFor="name">{{ 'mxk.apps.name' | i18n }}</nz-form-label>
-          <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.appName" [ngModelOptions]="{ standalone: true }" name="appName"
-              placeholder="" id="appName" />
-          </nz-form-control>
-        </nz-form-item>
-      </div>
-      <div nz-col [nzSpan]="query.expandForm ? 24 : 4" [class.text-right]="query.expandForm">
-        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' |
-          i18n }}</button>
-        <button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset' |
-          i18n }}</button>
-        <button nz-button (click)="query.expandForm = !query.expandForm" class="mx-sm" style="display: none">
-          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button>
-      </div>
-    </div>
-  </form>
-</nz-card>
 <nz-card [nzBordered]="false">
   <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 8, lg: 24, xl: 48, xxl: 48 }">
-    <div nz-col [nzSpan]="24" class="table-list-toolbar">
-      <button nz-button type="button" [nzType]="'primary'" (click)="onAdd($event)">{{ 'mxk.text.add' | i18n }}</button>
-      <button nz-button type="button" (click)="onBatchDelete($event)" [nzType]="'primary'" nzDanger class="mx-sm">{{
-        'mxk.text.delete' | i18n
-        }}</button>
-    </div>
-
-    <div nz-col nzMd="24" nzSm="24">
+    <div nz-col nzMd="8" nzSm="24" class="grid-border">
+      <nz-card [nzBordered]="false">
+        <form nz-form [nzLayout]="'inline'" (ngSubmit)="onGroupSearch()" class="search__form">
+          <div nz-col nzMd="16" nzSm="24">
+            <nz-form-item>
+              <nz-form-label nzFor="groupName">{{ 'mxk.groups.name' | i18n }}</nz-form-label>
+              <nz-form-control>
+                <input nz-input [(ngModel)]="groupQuery.params.groupName" [ngModelOptions]="{ standalone: true }"
+                  name="groupName" placeholder="" id="groupName" />
+              </nz-form-control>
+            </nz-form-item>
+          </div>
+          <div nz-col [nzSpan]="8" [class.text-right]="groupQuery.expandForm">
+            <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="groupQuery.submitLoading">{{
+              'mxk.text.query' | i18n
+              }}</button>
+          </div>
+        </form>
+      </nz-card>
       <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzBordered nzShowSizeChanger
-        [nzData]="query.results.rows" [nzFrontPagination]="false" [nzTotal]="query.results.records"
-        [nzPageSizeOptions]="query.params.pageSizeOptions" [nzPageSize]="query.params.pageSize"
-        [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
-        (nzQueryParams)="onQueryParamsChange($event)">
+        [nzData]="groupQuery.results.rows" [nzFrontPagination]="false" [nzTotal]="groupQuery.results.records"
+        [nzPageSizeOptions]="groupQuery.params.pageSizeOptions" [nzPageSize]="groupQuery.params.pageSize"
+        [nzPageIndex]="groupQuery.params.pageNumber" [nzLoading]="this.groupQuery.tableLoading"
+        (nzQueryParams)="onGroupQueryParamsChange($event)">
         <thead>
           <tr>
-            <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate"
-              (nzCheckedChange)="onTableAllChecked($event)"></th>
+            <th></th>
             <th nzAlign="center" style="display: none">Id</th>
-            <th nzAlign="center">{{ 'mxk.roles.name' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.apps.icon' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.apps.name' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.apps.category' | i18n }}</th>
-            <th nzAlign="center" class="table_cell_action_1">{{ 'mxk.text.action' | i18n }}</th>
+            <th nzAlign="center">{{ 'mxk.groups.name' | i18n }}</th>
+            <th nzAlign="center">{{ 'mxk.groups.category' | i18n }}</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"> {{ data.groupName }}</td>
-            <td nzAlign="center"><img height="30" border="0px" src="{{ data.iconBase64 }}" /></td>
-            <td nzAlign="left"> {{ data.appName }}</td>
-            <td nzAlign="left">
-              <div *ngIf="data.category == 'none'">{{ 'mxk.apps.category.none' | i18n }}</div>
-              <div *ngIf="data.category == '1011'">{{ 'mxk.apps.category.1011' | i18n }}</div>
-              <div *ngIf="data.category == '1012'">{{ 'mxk.apps.category.1012' | i18n }}</div>
-              <div *ngIf="data.category == '1013'">{{ 'mxk.apps.category.1013' | i18n }}</div>
-              <div *ngIf="data.category == '1014'">{{ 'mxk.apps.category.1014' | i18n }}</div>
-              <div *ngIf="data.category == '1015'">{{ 'mxk.apps.category.1015' | i18n }}</div>
-              <div *ngIf="data.category == '1016'">{{ 'mxk.apps.category.1016' | i18n }}</div>
-              <div *ngIf="data.category == '1017'">{{ 'mxk.apps.category.1017' | i18n }}</div>
-              <div *ngIf="data.category == '1111'">{{ 'mxk.apps.category.1111' | i18n }}</div>
-              <div *ngIf="data.category == '1112'">{{ 'mxk.apps.category.1112' | i18n }}</div>
-              <div *ngIf="data.category == '1113'">{{ 'mxk.apps.category.1113' | i18n }}</div>
-              <div *ngIf="data.category == '1114'">{{ 'mxk.apps.category.1114' | i18n }}</div>
-              <div *ngIf="data.category == '1211'">{{ 'mxk.apps.category.1211' | i18n }}</div>
-              <div *ngIf="data.category == '1212'">{{ 'mxk.apps.category.1212' | i18n }}</div>
-              <div *ngIf="data.category == '1213'">{{ 'mxk.apps.category.1213' | i18n }}</div>
-              <div *ngIf="data.category == '1214'">{{ 'mxk.apps.category.1214' | i18n }}</div>
-              <div *ngIf="data.category == '1215'">{{ 'mxk.apps.category.1215' | i18n }}</div>
-              <div *ngIf="data.category == '1311'">{{ 'mxk.apps.category.1311' | i18n }}</div>
-              <div *ngIf="data.category == '1411'">{{ 'mxk.apps.category.1411' | i18n }}</div>
-              <div *ngIf="data.category == '1511'">{{ 'mxk.apps.category.1511' | i18n }}</div>
-              <div *ngIf="data.category == '1512'">{{ 'mxk.apps.category.1512' | i18n }}</div>
-              <div *ngIf="data.category == '1611'">{{ 'mxk.apps.category.1611' | i18n }}</div>
-              <div *ngIf="data.category == '1711'">{{ 'mxk.apps.category.1711' | i18n }}</div>
-              <div *ngIf="data.category == '1712'">{{ 'mxk.apps.category.1712' | i18n }}</div>
-              <div *ngIf="data.category == '1811'">{{ 'mxk.apps.category.1811' | i18n }}</div>
-              <div *ngIf="data.category == '1812'">{{ 'mxk.apps.category.1812' | i18n }}</div>
-              <div *ngIf="data.category == '1911'">{{ 'mxk.apps.category.1911' | i18n }}</div>
-              <div *ngIf="data.category == '1912'">{{ 'mxk.apps.category.1912' | i18n }}</div>
-            </td>
-            <td nzAlign="center" nzBreakWord="false">
-              <div nz-col>
-                <button nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete' | i18n
-                  }}</button>
-              </div>
+          <tr *ngFor="let data of groupQuery.results.rows">
+            <td [nzChecked]="groupQuery.tableCheckedId.has(data.id)" [nzDisabled]="data.disabled"
+              (nzCheckedChange)="onGroupTableItemChecked(data.id, data.groupName, $event)"></td>
+            <td nzAlign="left" style="display: none">
+              <span>{{ data.id }}</span>
             </td>
+            <td nzAlign="left"> {{ data.groupName }}</td>
+            <td nzAlign="center" *ngIf="data.category == 'dynamic'"> {{ 'mxk.groups.category.dynamic' | i18n }}</td>
+            <td nzAlign="center" *ngIf="data.category == 'static'"> {{ 'mxk.groups.category.static' | i18n }}</td>
+            <td nzAlign="center" *ngIf="data.category == 'app'"> {{ 'mxk.groups.category.app' | i18n }}</td>
           </tr>
         </tbody>
       </nz-table>
     </div>
+    <div nz-col nzMd="16" nzSm="24" class="grid-border">
+      <nz-card [nzBordered]="false">
+        <form nz-form [nzLayout]="'inline'" (ngSubmit)="onSearch()" class="search__form">
+          <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 24, lg: 24, xl: 48, xxl: 48 }">
+            <div nz-col nzMd="10" nzSm="24">
+              <nz-form-item>
+                <nz-form-label nzFor="roleName">{{ 'mxk.roles.name' | i18n }}</nz-form-label>
+                <input nz-input [(ngModel)]="query.params.groupName" [ngModelOptions]="{ standalone: true }" readonly
+                  placeholder="" disabled />
+              </nz-form-item>
+            </div>
+            <div nz-col nzMd="10" nzSm="24">
+              <nz-form-item>
+                <nz-form-label nzFor="name">{{ 'mxk.apps.name' | i18n }}</nz-form-label>
+                <nz-form-control>
+                  <input nz-input [(ngModel)]="query.params.appName" [ngModelOptions]="{ standalone: true }"
+                    name="appName" placeholder="" id="appName" />
+                </nz-form-control>
+              </nz-form-item>
+            </div>
+            <div nz-col [nzSpan]="query.expandForm ? 24 : 4" [class.text-right]="query.expandForm">
+              <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query'
+                | i18n }}</button>
+              <button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset'
+                | i18n }}</button>
+              <button nz-button (click)="query.expandForm = !query.expandForm" class="mx-sm" style="display: none">
+                {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button>
+            </div>
+          </div>
+        </form>
+      </nz-card>
+      <nz-card [nzBordered]="false">
+        <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 8, lg: 24, xl: 48, xxl: 48 }">
+          <div nz-col [nzSpan]="24" class="table-list-toolbar">
+            <button nz-button type="button" [nzType]="'primary'" (click)="onAdd($event)">{{ 'mxk.text.add' | i18n
+              }}</button>
+            <button nz-button type="button" (click)="onBatchDelete($event)" [nzType]="'primary'" nzDanger
+              class="mx-sm">{{
+              'mxk.text.delete' | i18n
+              }}</button>
+          </div>
+
+          <div nz-col nzMd="24" nzSm="24">
+            <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzBordered nzShowSizeChanger
+              [nzData]="query.results.rows" [nzFrontPagination]="false" [nzTotal]="query.results.records"
+              [nzPageSizeOptions]="query.params.pageSizeOptions" [nzPageSize]="query.params.pageSize"
+              [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+              (nzQueryParams)="onQueryParamsChange($event)">
+              <thead>
+                <tr>
+                  <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate"
+                    (nzCheckedChange)="onTableAllChecked($event)"></th>
+                  <th nzAlign="center" style="display: none">Id</th>
+                  <th nzAlign="center">{{ 'mxk.roles.name' | i18n }}</th>
+                  <th nzAlign="center">{{ 'mxk.apps.icon' | i18n }}</th>
+                  <th nzAlign="center">{{ 'mxk.apps.name' | i18n }}</th>
+                  <th nzAlign="center">{{ 'mxk.apps.category' | i18n }}</th>
+                  <th nzAlign="center" class="table_cell_action_1">{{ 'mxk.text.action' | i18n }}</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"> {{ data.groupName }}</td>
+                  <td nzAlign="center"><img height="30" border="0px" src="{{ data.iconBase64 }}" /></td>
+                  <td nzAlign="left"> {{ data.appName }}</td>
+                  <td nzAlign="left">
+                    <div *ngIf="data.category == 'none'">{{ 'mxk.apps.category.none' | i18n }}</div>
+                    <div *ngIf="data.category == '1011'">{{ 'mxk.apps.category.1011' | i18n }}</div>
+                    <div *ngIf="data.category == '1012'">{{ 'mxk.apps.category.1012' | i18n }}</div>
+                    <div *ngIf="data.category == '1013'">{{ 'mxk.apps.category.1013' | i18n }}</div>
+                    <div *ngIf="data.category == '1014'">{{ 'mxk.apps.category.1014' | i18n }}</div>
+                    <div *ngIf="data.category == '1015'">{{ 'mxk.apps.category.1015' | i18n }}</div>
+                    <div *ngIf="data.category == '1016'">{{ 'mxk.apps.category.1016' | i18n }}</div>
+                    <div *ngIf="data.category == '1017'">{{ 'mxk.apps.category.1017' | i18n }}</div>
+                    <div *ngIf="data.category == '1111'">{{ 'mxk.apps.category.1111' | i18n }}</div>
+                    <div *ngIf="data.category == '1112'">{{ 'mxk.apps.category.1112' | i18n }}</div>
+                    <div *ngIf="data.category == '1113'">{{ 'mxk.apps.category.1113' | i18n }}</div>
+                    <div *ngIf="data.category == '1114'">{{ 'mxk.apps.category.1114' | i18n }}</div>
+                    <div *ngIf="data.category == '1211'">{{ 'mxk.apps.category.1211' | i18n }}</div>
+                    <div *ngIf="data.category == '1212'">{{ 'mxk.apps.category.1212' | i18n }}</div>
+                    <div *ngIf="data.category == '1213'">{{ 'mxk.apps.category.1213' | i18n }}</div>
+                    <div *ngIf="data.category == '1214'">{{ 'mxk.apps.category.1214' | i18n }}</div>
+                    <div *ngIf="data.category == '1215'">{{ 'mxk.apps.category.1215' | i18n }}</div>
+                    <div *ngIf="data.category == '1311'">{{ 'mxk.apps.category.1311' | i18n }}</div>
+                    <div *ngIf="data.category == '1411'">{{ 'mxk.apps.category.1411' | i18n }}</div>
+                    <div *ngIf="data.category == '1511'">{{ 'mxk.apps.category.1511' | i18n }}</div>
+                    <div *ngIf="data.category == '1512'">{{ 'mxk.apps.category.1512' | i18n }}</div>
+                    <div *ngIf="data.category == '1611'">{{ 'mxk.apps.category.1611' | i18n }}</div>
+                    <div *ngIf="data.category == '1711'">{{ 'mxk.apps.category.1711' | i18n }}</div>
+                    <div *ngIf="data.category == '1712'">{{ 'mxk.apps.category.1712' | i18n }}</div>
+                    <div *ngIf="data.category == '1811'">{{ 'mxk.apps.category.1811' | i18n }}</div>
+                    <div *ngIf="data.category == '1812'">{{ 'mxk.apps.category.1812' | i18n }}</div>
+                    <div *ngIf="data.category == '1911'">{{ 'mxk.apps.category.1911' | i18n }}</div>
+                    <div *ngIf="data.category == '1912'">{{ 'mxk.apps.category.1912' | i18n }}</div>
+                  </td>
+                  <td nzAlign="center" nzBreakWord="false">
+                    <div nz-col>
+                      <button nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete'
+                        | i18n }}</button>
+                    </div>
+                  </td>
+                </tr>
+              </tbody>
+            </nz-table>
+          </div>
+        </div>
+      </nz-card>
+    </div>
   </div>
 </nz-card>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/access/permissions/permissions.component.ts

@@ -28,6 +28,7 @@ import { NzTableQueryParams } from 'ng-zorro-antd/table';
 import { NzFormatEmitEvent, NzTreeNode, NzTreeNodeOptions } from 'ng-zorro-antd/tree';
 
 import { GroupPermissionsService } from '../../../service/group-permissions.service';
+import { GroupsService } from '../../../service/groups.service';
 import { set2String } from '../../../shared/index';
 import { SelectGroupsComponent } from '../../idm/groups/select-groups/select-groups.component';
 import { PermissionsEditerComponent } from './permissions-editer/permissions-editer.component';
@@ -66,37 +67,38 @@ export class PermissionsComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-    params: {
-      displayName: '',
-      username: '',
-      groupId: '',
-      groupName: '',
-      appName: '',
-      appId: '',
-      startDate: '',
-      endDate: '',
-      startDatePicker: addDays(new Date(), -30),
-      endDatePicker: new Date(),
-      pageSize: 10,
-      pageNumber: 1,
-      pageSizeOptions: [10, 20, 50]
-    },
-    results: {
-      records: 0,
-      rows: []
-    },
-    expandForm: false,
-    submitLoading: false,
-    tableLoading: false,
-    tableInitialize: true,
-    tableCheckedId: new Set<String>(),
-    indeterminate: false,
-    checked: false
-  };
+      params: {
+        displayName: '',
+        username: '',
+        groupId: '',
+        groupName: '',
+        appName: '',
+        appId: '',
+        startDate: '',
+        endDate: '',
+        startDatePicker: addDays(new Date(), -30),
+        endDatePicker: new Date(),
+        pageSize: 10,
+        pageNumber: 1,
+        pageSizeOptions: [10, 20, 50]
+      },
+      results: {
+        records: 0,
+        rows: []
+      },
+      expandForm: false,
+      submitLoading: false,
+      tableLoading: false,
+      tableInitialize: true,
+      tableCheckedId: new Set<String>(),
+      indeterminate: false,
+      checked: false
+    };
 
   constructor(
     private modalService: NzModalService,
     private groupPermissionsService: GroupPermissionsService,
+    private groupsService: GroupsService,
     private viewContainerRef: ViewContainerRef,
     private fb: FormBuilder,
     private msg: NzMessageService,
@@ -104,7 +106,7 @@ export class PermissionsComponent implements OnInit {
     private route: ActivatedRoute,
     private cdr: ChangeDetectorRef,
     private http: _HttpClient
-  ) {}
+  ) { }
 
   ngOnInit(): void {
     if (this.route.snapshot.queryParams['groupId']) {
@@ -126,7 +128,7 @@ export class PermissionsComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void {}
+  onReset(): void { }
 
   onBatchDelete(e: MouseEvent): void {
     e.preventDefault();
@@ -143,22 +145,24 @@ export class PermissionsComponent implements OnInit {
 
   onAdd(e: MouseEvent): void {
     e.preventDefault();
-    const modal = this.modalService.create({
-      nzContent: PermissionsEditerComponent,
-      nzViewContainerRef: this.viewContainerRef,
-      nzComponentParams: {
-        isEdit: false,
-        groupId: this.query.params.groupId
-      },
-      nzWidth: 700,
-      nzOnOk: () => new Promise(resolve => setTimeout(resolve, 1000))
-    });
-    // Return a result when closed
-    modal.afterClose.subscribe(result => {
-      if (result.refresh) {
-        this.fetch();
-      }
-    });
+    if (this.query.params.groupId !== '') {
+      const modal = this.modalService.create({
+        nzContent: PermissionsEditerComponent,
+        nzViewContainerRef: this.viewContainerRef,
+        nzComponentParams: {
+          isEdit: false,
+          groupId: this.query.params.groupId
+        },
+        nzWidth: 700,
+        nzOnOk: () => new Promise(resolve => setTimeout(resolve, 1000))
+      });
+      // Return a result when closed
+      modal.afterClose.subscribe(result => {
+        if (result.refresh) {
+          this.fetch();
+        }
+      });
+    }
   }
 
   onSelect(e: MouseEvent): void {
@@ -239,4 +243,94 @@ export class PermissionsComponent implements OnInit {
     this.query.results.rows.filter(({ disabled }) => !disabled).forEach(({ id }) => this.updateTableCheckedSet(id, checked));
     this.refreshTableCheckedStatus();
   }
+
+  //group list
+  groupQuery: {
+    params: {
+      groupName: String;
+      pageSize: number;
+      pageNumber: number;
+      pageSizeOptions: number[];
+    };
+    results: {
+      records: number;
+      rows: NzSafeAny[];
+    };
+    expandForm: Boolean;
+    submitLoading: boolean;
+    tableLoading: boolean;
+    tableCheckedId: Set<String>;
+    indeterminate: boolean;
+    checked: boolean;
+  } = {
+      params: {
+        groupName: '',
+        pageSize: 10,
+        pageNumber: 1,
+        pageSizeOptions: [10, 20, 50]
+      },
+      results: {
+        records: 0,
+        rows: []
+      },
+      expandForm: false,
+      submitLoading: false,
+      tableLoading: false,
+      tableCheckedId: new Set<String>(),
+      indeterminate: false,
+      checked: false
+    };
+
+  onGroupSearch(): void {
+    this.fetchGroup();
+  }
+
+  onGroupQueryParamsChange(tableQueryParams: NzTableQueryParams): void {
+    this.groupQuery.params.pageNumber = tableQueryParams.pageIndex;
+    this.groupQuery.params.pageSize = tableQueryParams.pageSize;
+    this.fetchGroup();
+  }
+
+  fetchGroup(): void {
+    this.groupQuery.submitLoading = true;
+    this.groupQuery.tableLoading = true;
+    this.groupQuery.indeterminate = false;
+    this.groupQuery.checked = false;
+    this.groupQuery.tableCheckedId.clear();
+    this.groupsService.fetch(this.groupQuery.params).subscribe(res => {
+      this.groupQuery.results = res.data;
+      this.groupQuery.submitLoading = false;
+      this.groupQuery.tableLoading = false;
+      this.cdr.detectChanges();
+    });
+  }
+
+  updateGroupTableCheckedSet(id: String, checked: boolean): void {
+    if (checked) {
+      this.groupQuery.tableCheckedId.add(id);
+    } else {
+      this.groupQuery.tableCheckedId.delete(id);
+    }
+  }
+
+  refreshGroupTableCheckedStatus(): void {
+    const listOfEnabledData = this.groupQuery.results.rows.filter(({ disabled }) => !disabled);
+    this.groupQuery.checked = listOfEnabledData.every(({ id }) => this.groupQuery.tableCheckedId.has(id));
+    this.groupQuery.indeterminate = listOfEnabledData.some(({ id }) => this.groupQuery.tableCheckedId.has(id)) && !this.groupQuery.checked;
+  }
+
+  onGroupTableItemChecked(groupId: String, groupName: String, checked: boolean): void {
+    console.log(`checked ${checked} , groupId ${groupId}  , groupName ${groupName}`);
+    this.onGroupTableAllChecked(false);
+    this.updateGroupTableCheckedSet(groupId, checked);
+    this.refreshGroupTableCheckedStatus();
+    this.query.params.groupId = groupId;
+    this.query.params.groupName = groupName;
+    this.fetch();
+  }
+
+  onGroupTableAllChecked(checked: boolean): void {
+    this.groupQuery.results.rows.filter(({ disabled }) => !disabled).forEach(({ id }) => this.updateGroupTableCheckedSet(id, checked));
+    this.refreshGroupTableCheckedStatus();
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/idm/group-members/group-members.component.html

@@ -1,92 +1,138 @@
 <page-header> </page-header>
-
-<nz-card [nzBordered]="false">
-  <form nz-form [nzLayout]="'inline'" (ngSubmit)="onSearch()" class="search__form">
-    <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 24, lg: 24, xl: 48, xxl: 48 }">
-      <div nz-col nzMd="8" nzSm="24">
-        <nz-form-item>
-          <nz-form-label nzFor="groupName">{{ 'mxk.roles.name' | i18n }}</nz-form-label>
-          <nz-form-control>
-            <nz-input-group nzSearch [nzAddOnAfter]="suffixButton">
-              <input nz-input [(ngModel)]="query.params.groupName" [ngModelOptions]="{ standalone: true }"
-                name="groupName" readonly placeholder="" id="groupName" />
-            </nz-input-group>
-            <ng-template #suffixButton>
-              <button nz-button nzType="primary" (click)="onSelect($event)" nzSearch>{{ 'mxk.text.select' | i18n
-                }}</button>
-            </ng-template>
-          </nz-form-control>
-        </nz-form-item>
-      </div>
-      <div nz-col nzMd="8" nzSm="24">
-        <nz-form-item>
-          <nz-form-label nzFor="name">{{ 'mxk.users.username' | i18n }}</nz-form-label>
-          <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.username" [ngModelOptions]="{ standalone: true }" name="username"
-              placeholder="" id="username" />
-          </nz-form-control>
-        </nz-form-item>
-      </div>
-      <div nz-col [nzSpan]="query.expandForm ? 24 : 8" [class.text-right]="query.expandForm">
-        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' |
-          i18n }}</button>
-        <button nz-button type="reset" (click)="onReset()" class="mx-sm">{{ 'mxk.text.reset' | i18n }}</button>
-        <button nz-button (click)="query.expandForm = !query.expandForm" class="mx-sm" style="display: none">
-          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button>
-      </div>
-    </div>
-  </form>
-</nz-card>
 <nz-card [nzBordered]="false">
   <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 8, lg: 24, xl: 48, xxl: 48 }">
-    <div nz-col [nzSpan]="24" class="table-list-toolbar">
-      <button nz-button type="button" [nzType]="'primary'" (click)="onAdd($event)">{{ 'mxk.text.add' | i18n }}</button>
-      <button nz-button type="button" (click)="onBatchDelete($event)" [nzType]="'primary'" nzDanger class="mx-sm">{{
-        'mxk.text.delete' | i18n
-        }}</button>
-    </div>
-
-    <div nz-col nzMd="24" nzSm="24">
+    <div nz-col nzMd="8" nzSm="24" class="grid-border">
+      <nz-card [nzBordered]="false">
+        <form nz-form [nzLayout]="'inline'" (ngSubmit)="onGroupSearch()" class="search__form">
+          <div nz-col nzMd="16" nzSm="24">
+            <nz-form-item>
+              <nz-form-label nzFor="groupName">{{ 'mxk.groups.name' | i18n }}</nz-form-label>
+              <nz-form-control>
+                <input nz-input [(ngModel)]="groupQuery.params.groupName" [ngModelOptions]="{ standalone: true }"
+                  name="groupName" placeholder="" id="groupName" />
+              </nz-form-control>
+            </nz-form-item>
+          </div>
+          <div nz-col [nzSpan]="8" [class.text-right]="groupQuery.expandForm">
+            <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="groupQuery.submitLoading">{{
+              'mxk.text.query' | i18n
+              }}</button>
+          </div>
+        </form>
+      </nz-card>
       <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzBordered nzShowSizeChanger
-        [nzData]="query.results.rows" [nzFrontPagination]="false" [nzTotal]="query.results.records"
-        [nzPageSizeOptions]="query.params.pageSizeOptions" [nzPageSize]="query.params.pageSize"
-        [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
-        (nzQueryParams)="onQueryParamsChange($event)">
+        [nzData]="groupQuery.results.rows" [nzFrontPagination]="false" [nzTotal]="groupQuery.results.records"
+        [nzPageSizeOptions]="groupQuery.params.pageSizeOptions" [nzPageSize]="groupQuery.params.pageSize"
+        [nzPageIndex]="groupQuery.params.pageNumber" [nzLoading]="this.groupQuery.tableLoading"
+        (nzQueryParams)="onGroupQueryParamsChange($event)">
         <thead>
           <tr>
-            <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate"
-              (nzCheckedChange)="onTableAllChecked($event)"></th>
-            <th nzAlign="center">{{ 'mxk.roles.name' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.users.username' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.users.displayName' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.users.department' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.users.jobTitle' | i18n }}</th>
-            <th nzAlign="center">{{ 'mxk.users.gender' | i18n }}</th>
-            <th nzAlign="center" class="table_cell_action_1">{{ 'mxk.text.action' | i18n }}</th>
+            <th></th>
+            <th nzAlign="center" style="display: none">Id</th>
+            <th nzAlign="center">{{ 'mxk.groups.name' | i18n }}</th>
+            <th nzAlign="center">{{ 'mxk.groups.category' | i18n }}</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"> {{ data.groupName }}</td>
-            <td nzAlign="left"> {{ data.username }}</td>
-            <td nzAlign="left"> {{ data.displayName }}</td>
-            <td nzAlign="left"> {{ data.department }}</td>
-            <td nzAlign="left"> {{ data.jobTitle }}</td>
-            <td nzAlign="center"> {{ data.gender == 1 ? ('mxk.users.gender.female' | i18n) : ('mxk.users.gender.male' |
-              i18n) }}</td>
-            <td nzAlign="center" nzBreakWord="false">
-              <div nz-col>
-                <button *ngIf="data.category == 'static'" nz-button type="button" (click)="onDelete($event, data.id)"
-                  nzDanger>{{
-                  'mxk.text.delete' | i18n
-                  }}</button>
-              </div>
+          <tr *ngFor="let data of groupQuery.results.rows">
+            <td [nzChecked]="groupQuery.tableCheckedId.has(data.id)" [nzDisabled]="data.disabled"
+              (nzCheckedChange)="onGroupTableItemChecked(data.id, data.groupName, $event)"></td>
+            <td nzAlign="left" style="display: none">
+              <span>{{ data.id }}</span>
             </td>
+            <td nzAlign="left"> {{ data.groupName }}</td>
+            <td nzAlign="center" *ngIf="data.category == 'dynamic'"> {{ 'mxk.groups.category.dynamic' | i18n }}</td>
+            <td nzAlign="center" *ngIf="data.category == 'static'"> {{ 'mxk.groups.category.static' | i18n }}</td>
+            <td nzAlign="center" *ngIf="data.category == 'app'"> {{ 'mxk.groups.category.app' | i18n }}</td>
           </tr>
         </tbody>
       </nz-table>
     </div>
+    <div nz-col nzMd="16" nzSm="24" class="grid-border">
+      <nz-card [nzBordered]="false">
+        <form nz-form [nzLayout]="'inline'" (ngSubmit)="onSearch()" class="search__form">
+          <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 24, lg: 24, xl: 48, xxl: 48 }">
+            <div nz-col nzMd="8" nzSm="24">
+              <nz-form-item>
+                <nz-form-label nzFor="groupName">{{ 'mxk.roles.name' | i18n }}</nz-form-label>
+                <input nz-input [(ngModel)]="query.params.groupName" [ngModelOptions]="{ standalone: true }" readonly
+                  disabled placeholder="" />
+              </nz-form-item>
+            </div>
+            <div nz-col nzMd="8" nzSm="24">
+              <nz-form-item>
+                <nz-form-label nzFor="name">{{ 'mxk.users.username' | i18n }}</nz-form-label>
+                <nz-form-control>
+                  <input nz-input [(ngModel)]="query.params.username" [ngModelOptions]="{ standalone: true }"
+                    name="username" placeholder="" id="username" />
+                </nz-form-control>
+              </nz-form-item>
+            </div>
+            <div nz-col [nzSpan]="query.expandForm ? 24 : 8" [class.text-right]="query.expandForm">
+              <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query'
+                | i18n }}</button>
+              <button nz-button type="reset" (click)="onReset()" class="mx-sm">{{ 'mxk.text.reset' | i18n }}</button>
+              <button nz-button (click)="query.expandForm = !query.expandForm" class="mx-sm" style="display: none">
+                {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button>
+            </div>
+          </div>
+        </form>
+      </nz-card>
+      <nz-card [nzBordered]="false">
+        <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 8, lg: 24, xl: 48, xxl: 48 }">
+          <div nz-col [nzSpan]="24" class="table-list-toolbar">
+            <button nz-button type="button" [nzType]="'primary'" (click)="onAdd($event)">{{ 'mxk.text.add' | i18n
+              }}</button>
+            <button nz-button type="button" (click)="onBatchDelete($event)" [nzType]="'primary'" nzDanger
+              class="mx-sm">{{
+              'mxk.text.delete' | i18n
+              }}</button>
+          </div>
+
+          <div nz-col nzMd="24" nzSm="24">
+            <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzBordered nzShowSizeChanger
+              [nzData]="query.results.rows" [nzFrontPagination]="false" [nzTotal]="query.results.records"
+              [nzPageSizeOptions]="query.params.pageSizeOptions" [nzPageSize]="query.params.pageSize"
+              [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+              (nzQueryParams)="onQueryParamsChange($event)">
+              <thead>
+                <tr>
+                  <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate"
+                    (nzCheckedChange)="onTableAllChecked($event)"></th>
+                  <th nzAlign="center">{{ 'mxk.roles.name' | i18n }}</th>
+                  <th nzAlign="center">{{ 'mxk.users.username' | i18n }}</th>
+                  <th nzAlign="center">{{ 'mxk.users.displayName' | i18n }}</th>
+                  <th nzAlign="center">{{ 'mxk.users.department' | i18n }}</th>
+                  <th nzAlign="center">{{ 'mxk.users.jobTitle' | i18n }}</th>
+                  <th nzAlign="center">{{ 'mxk.users.gender' | i18n }}</th>
+                  <th nzAlign="center" class="table_cell_action_1">{{ 'mxk.text.action' | i18n }}</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"> {{ data.groupName }}</td>
+                  <td nzAlign="left"> {{ data.username }}</td>
+                  <td nzAlign="left"> {{ data.displayName }}</td>
+                  <td nzAlign="left"> {{ data.department }}</td>
+                  <td nzAlign="left"> {{ data.jobTitle }}</td>
+                  <td nzAlign="center"> {{ data.gender == 1 ? ('mxk.users.gender.female' | i18n) :
+                    ('mxk.users.gender.male' | i18n) }}</td>
+                  <td nzAlign="center" nzBreakWord="false">
+                    <div nz-col>
+                      <button *ngIf="data.category == 'static'" nz-button type="button"
+                        (click)="onDelete($event, data.id)" nzDanger>{{
+                        'mxk.text.delete' | i18n
+                        }}</button>
+                    </div>
+                  </td>
+                </tr>
+              </tbody>
+            </nz-table>
+          </div>
+        </div>
+      </nz-card>
+    </div>
   </div>
 </nz-card>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/idm/group-members/group-members.component.ts

@@ -28,6 +28,7 @@ import { NzTableQueryParams } from 'ng-zorro-antd/table';
 import { NzFormatEmitEvent, NzTreeNode, NzTreeNodeOptions } from 'ng-zorro-antd/tree';
 
 import { GroupMembersService } from '../../../service/group-members.service';
+import { GroupsService } from '../../../service/groups.service';
 import { set2String } from '../../../shared/index';
 import { SelectGroupsComponent } from '../groups/select-groups/select-groups.component';
 import { GroupMembersEditerComponent } from './group-members-editer/group-members-editer.component';
@@ -67,44 +68,45 @@ export class GroupMembersComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-    params: {
-      groupName: '',
-      displayName: '',
-      username: '',
-      groupId: '',
-      appName: '',
-      appId: '',
-      startDate: '',
-      endDate: '',
-      startDatePicker: addDays(new Date(), -30),
-      endDatePicker: new Date(),
-      pageSize: 10,
-      pageNumber: 1,
-      pageSizeOptions: [10, 20, 50]
-    },
-    results: {
-      records: 0,
-      rows: []
-    },
-    expandForm: false,
-    submitLoading: false,
-    tableLoading: false,
-    tableInitialize: true,
-    tableCheckedId: new Set<String>(),
-    indeterminate: false,
-    checked: false
-  };
+      params: {
+        groupName: '',
+        displayName: '',
+        username: '',
+        groupId: '',
+        appName: '',
+        appId: '',
+        startDate: '',
+        endDate: '',
+        startDatePicker: addDays(new Date(), -30),
+        endDatePicker: new Date(),
+        pageSize: 10,
+        pageNumber: 1,
+        pageSizeOptions: [10, 20, 50]
+      },
+      results: {
+        records: 0,
+        rows: []
+      },
+      expandForm: false,
+      submitLoading: false,
+      tableLoading: false,
+      tableInitialize: true,
+      tableCheckedId: new Set<String>(),
+      indeterminate: false,
+      checked: false
+    };
 
   constructor(
     private modalService: NzModalService,
     private groupMembersService: GroupMembersService,
+    private groupsService: GroupsService,
     private viewContainerRef: ViewContainerRef,
     private fb: FormBuilder,
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private route: ActivatedRoute,
     private cdr: ChangeDetectorRef
-  ) {}
+  ) { }
 
   ngOnInit(): void {
     if (this.route.snapshot.queryParams['username']) {
@@ -266,4 +268,94 @@ export class GroupMembersComponent implements OnInit {
     this.query.results.rows.filter(({ disabled }) => !disabled).forEach(({ id }) => this.updateTableCheckedSet(id, checked));
     this.refreshTableCheckedStatus();
   }
+
+  //group list
+  groupQuery: {
+    params: {
+      groupName: String;
+      pageSize: number;
+      pageNumber: number;
+      pageSizeOptions: number[];
+    };
+    results: {
+      records: number;
+      rows: NzSafeAny[];
+    };
+    expandForm: Boolean;
+    submitLoading: boolean;
+    tableLoading: boolean;
+    tableCheckedId: Set<String>;
+    indeterminate: boolean;
+    checked: boolean;
+  } = {
+      params: {
+        groupName: '',
+        pageSize: 10,
+        pageNumber: 1,
+        pageSizeOptions: [10, 20, 50]
+      },
+      results: {
+        records: 0,
+        rows: []
+      },
+      expandForm: false,
+      submitLoading: false,
+      tableLoading: false,
+      tableCheckedId: new Set<String>(),
+      indeterminate: false,
+      checked: false
+    };
+
+  onGroupSearch(): void {
+    this.fetchGroup();
+  }
+
+  onGroupQueryParamsChange(tableQueryParams: NzTableQueryParams): void {
+    this.groupQuery.params.pageNumber = tableQueryParams.pageIndex;
+    this.groupQuery.params.pageSize = tableQueryParams.pageSize;
+    this.fetchGroup();
+  }
+
+  fetchGroup(): void {
+    this.groupQuery.submitLoading = true;
+    this.groupQuery.tableLoading = true;
+    this.groupQuery.indeterminate = false;
+    this.groupQuery.checked = false;
+    this.groupQuery.tableCheckedId.clear();
+    this.groupsService.fetch(this.groupQuery.params).subscribe(res => {
+      this.groupQuery.results = res.data;
+      this.groupQuery.submitLoading = false;
+      this.groupQuery.tableLoading = false;
+      this.cdr.detectChanges();
+    });
+  }
+
+  updateGroupTableCheckedSet(id: String, checked: boolean): void {
+    if (checked) {
+      this.groupQuery.tableCheckedId.add(id);
+    } else {
+      this.groupQuery.tableCheckedId.delete(id);
+    }
+  }
+
+  refreshGroupTableCheckedStatus(): void {
+    const listOfEnabledData = this.groupQuery.results.rows.filter(({ disabled }) => !disabled);
+    this.groupQuery.checked = listOfEnabledData.every(({ id }) => this.groupQuery.tableCheckedId.has(id));
+    this.groupQuery.indeterminate = listOfEnabledData.some(({ id }) => this.groupQuery.tableCheckedId.has(id)) && !this.groupQuery.checked;
+  }
+
+  onGroupTableItemChecked(groupId: String, groupName: String, checked: boolean): void {
+    console.log(`checked ${checked} , groupId ${groupId}  , groupName ${groupName}`);
+    this.onGroupTableAllChecked(false);
+    this.updateGroupTableCheckedSet(groupId, checked);
+    this.refreshGroupTableCheckedStatus();
+    this.query.params.groupId = groupId;
+    this.query.params.groupName = groupName;
+    this.fetch();
+  }
+
+  onGroupTableAllChecked(checked: boolean): void {
+    this.groupQuery.results.rows.filter(({ disabled }) => !disabled).forEach(({ id }) => this.updateGroupTableCheckedSet(id, checked));
+    this.refreshGroupTableCheckedStatus();
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/idm/groups/group-editer/group-editer.component.ts

@@ -24,7 +24,7 @@ import { NzModalRef, NzModalService } from 'ng-zorro-antd/modal';
 
 import { Groups } from '../../../../entity/Groups';
 import { TreeNodes } from '../../../../entity/TreeNodes';
-import { GroupsService } from '../../../../service/Groups.service';
+import { GroupsService } from '../../../../service/groups.service';
 import { OrganizationsService } from '../../../../service/organizations.service';
 
 @Component({
@@ -47,9 +47,9 @@ export class GroupEditerComponent implements OnInit {
     submitting: boolean;
     model: Groups;
   } = {
-    submitting: false,
-    model: new Groups()
-  };
+      submitting: false,
+      model: new Groups()
+    };
 
   // TreeNodes
   treeNodes = new TreeNodes(false);
@@ -66,7 +66,7 @@ export class GroupEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) {}
+  ) { }
 
   ngOnInit(): void {
     this.tree();

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/idm/groups/groups.component.ts

@@ -25,7 +25,7 @@ import { NzMessageService } from 'ng-zorro-antd/message';
 import { NzModalRef, NzModalService } from 'ng-zorro-antd/modal';
 import { NzTableQueryParams } from 'ng-zorro-antd/table';
 
-import { GroupsService } from '../../../service/Groups.service';
+import { GroupsService } from '../../../service/groups.service';
 import { set2String } from '../../../shared/index';
 import { GroupEditerComponent } from './group-editer/group-editer.component';
 
@@ -59,29 +59,29 @@ export class GroupsComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-    params: {
-      groupName: '',
-      displayName: '',
-      employeeNumber: '',
-      startDate: '',
-      endDate: '',
-      startDatePicker: addDays(new Date(), -30),
-      endDatePicker: new Date(),
-      pageSize: 10,
-      pageNumber: 1,
-      pageSizeOptions: [10, 20, 50]
-    },
-    results: {
-      records: 0,
-      rows: []
-    },
-    expandForm: false,
-    submitLoading: false,
-    tableLoading: false,
-    tableCheckedId: new Set<String>(),
-    indeterminate: false,
-    checked: false
-  };
+      params: {
+        groupName: '',
+        displayName: '',
+        employeeNumber: '',
+        startDate: '',
+        endDate: '',
+        startDatePicker: addDays(new Date(), -30),
+        endDatePicker: new Date(),
+        pageSize: 10,
+        pageNumber: 1,
+        pageSizeOptions: [10, 20, 50]
+      },
+      results: {
+        records: 0,
+        rows: []
+      },
+      expandForm: false,
+      submitLoading: false,
+      tableLoading: false,
+      tableCheckedId: new Set<String>(),
+      indeterminate: false,
+      checked: false
+    };
 
   constructor(
     private modalService: NzModalService,
@@ -92,7 +92,7 @@ export class GroupsComponent implements OnInit {
     private router: Router,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) {}
+  ) { }
 
   ngOnInit(): void {
     this.fetch();
@@ -108,7 +108,7 @@ export class GroupsComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void {}
+  onReset(): void { }
 
   onBatchDelete(e: MouseEvent): void {
     e.preventDefault();

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/idm/groups/select-groups/select-groups.component.ts

@@ -23,7 +23,7 @@ import { NzMessageService } from 'ng-zorro-antd/message';
 import { NzModalRef, NzModalService } from 'ng-zorro-antd/modal';
 import { NzTableQueryParams } from 'ng-zorro-antd/table';
 
-import { GroupsService } from '../../../../service/Groups.service';
+import { GroupsService } from '../../../../service/groups.service';
 
 @Component({
   selector: 'app-select-groups',
@@ -55,29 +55,29 @@ export class SelectGroupsComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-    params: {
-      groupName: '',
-      displayName: '',
-      protocol: '',
-      startDate: '',
-      endDate: '',
-      startDatePicker: addDays(new Date(), -30),
-      endDatePicker: new Date(),
-      pageSize: 5,
-      pageNumber: 1,
-      pageSizeOptions: [5, 15, 50]
-    },
-    results: {
-      records: 0,
-      rows: []
-    },
-    expandForm: false,
-    submitLoading: false,
-    tableLoading: false,
-    tableCheckedId: new Set<String>(),
-    indeterminate: false,
-    checked: false
-  };
+      params: {
+        groupName: '',
+        displayName: '',
+        protocol: '',
+        startDate: '',
+        endDate: '',
+        startDatePicker: addDays(new Date(), -30),
+        endDatePicker: new Date(),
+        pageSize: 5,
+        pageNumber: 1,
+        pageSizeOptions: [5, 15, 50]
+      },
+      results: {
+        records: 0,
+        rows: []
+      },
+      expandForm: false,
+      submitLoading: false,
+      tableLoading: false,
+      tableCheckedId: new Set<String>(),
+      indeterminate: false,
+      checked: false
+    };
 
   constructor(
     private modalRef: NzModalRef,
@@ -86,7 +86,7 @@ export class SelectGroupsComponent implements OnInit {
     private fb: FormBuilder,
     private msg: NzMessageService,
     private cdr: ChangeDetectorRef
-  ) {}
+  ) { }
 
   ngOnInit(): void {
     this.fetch();
@@ -102,7 +102,7 @@ export class SelectGroupsComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void {}
+  onReset(): void { }
 
   fetch(): void {
     this.query.submitLoading = true;

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/permissions/privileges/privileges.component.ts

@@ -36,7 +36,7 @@ import { NzTableQueryParams } from 'ng-zorro-antd/table';
 import { NzFormatEmitEvent, NzTreeNode, NzTreeNodeOptions, NzTreeComponent } from 'ng-zorro-antd/tree';
 
 import { TreeNodes } from '../../../entity/TreeNodes';
-import { GroupsService } from '../../../service/Groups.service';
+import { GroupsService } from '../../../service/groups.service';
 import { GroupPrivilegesService } from '../../../service/group-privileges.service';
 import { ResourcesService } from '../../../service/resources.service';
 import { set2String } from '../../../shared/index';
@@ -75,31 +75,31 @@ export class PrivilegesComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-    params: {
-      groupName: '',
-      displayName: '',
-      employeeNumber: '',
-      appId: '',
-      appName: '',
-      startDate: '',
-      endDate: '',
-      startDatePicker: addDays(new Date(), -30),
-      endDatePicker: new Date(),
-      pageSize: 10,
-      pageNumber: 1,
-      pageSizeOptions: [10, 20, 50]
-    },
-    results: {
-      records: 0,
-      rows: []
-    },
-    expandForm: false,
-    submitLoading: false,
-    tableLoading: false,
-    tableCheckedId: new Set<String>(),
-    indeterminate: false,
-    checked: false
-  };
+      params: {
+        groupName: '',
+        displayName: '',
+        employeeNumber: '',
+        appId: '',
+        appName: '',
+        startDate: '',
+        endDate: '',
+        startDatePicker: addDays(new Date(), -30),
+        endDatePicker: new Date(),
+        pageSize: 10,
+        pageNumber: 1,
+        pageSizeOptions: [10, 20, 50]
+      },
+      results: {
+        records: 0,
+        rows: []
+      },
+      expandForm: false,
+      submitLoading: false,
+      tableLoading: false,
+      tableCheckedId: new Set<String>(),
+      indeterminate: false,
+      checked: false
+    };
 
   treeNodes = new TreeNodes(true);
 
@@ -114,7 +114,7 @@ export class PrivilegesComponent implements OnInit {
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef,
     private http: _HttpClient
-  ) {}
+  ) { }
 
   ngOnInit(): void {
     this.fetch();
@@ -130,7 +130,7 @@ export class PrivilegesComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void {}
+  onReset(): void { }
 
   onSave(e: MouseEvent): void {
     e.preventDefault();