frontend format code

maxkey-web-frontend/maxkey-web-mgt-app/src/app/app.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { Component, ElementRef, OnInit, Renderer2 } from '@angular/core';
 import { NavigationEnd, NavigationError, RouteConfigLoadStart, Router } from '@angular/router';

maxkey-web-frontend/maxkey-web-mgt-app/src/app/app.module.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 /* eslint-disable import/order */
 /* eslint-disable import/no-duplicates */

maxkey-web-frontend/maxkey-web-mgt-app/src/app/core/core.module.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { NgModule, Optional, SkipSelf } from '@angular/core';
 

maxkey-web-frontend/maxkey-web-mgt-app/src/app/core/index.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 export * from './i18n/i18n.service';
 export * from './module-import-guard';

maxkey-web-frontend/maxkey-web-mgt-app/src/app/core/module-import-guard.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 // https://angular.io/guide/styleguide#style-04-12
 export function throwIfAlreadyLoaded(parentModule: any, moduleName: string): void {

maxkey-web-frontend/maxkey-web-mgt-app/src/app/core/startup/startup.service.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { HttpClient } from '@angular/common/http';
 import { Inject, Injectable } from '@angular/core';

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/Accounts.ts

@@ -1,53 +1,52 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import format from 'date-fns/format';
 
 import { BaseEntity } from './BaseEntity';
 
 export class Accounts extends BaseEntity {
-    strategyId!: String;
+  strategyId!: String;
-    strategyName!: String;
+  strategyName!: String;
-    appId!: String;
+  appId!: String;
-    appName!: String;
+  appName!: String;
-    userId!: String;
+  userId!: String;
-    username!: String;
+  username!: String;
-    displayName!: String;
+  displayName!: String;
-    relatedUsername!: String;
+  relatedUsername!: String;
-    relatedPassword!: String;
+  relatedPassword!: String;
-    createType!: String;
+  createType!: String;
 
-    constructor() {
+  constructor() {
-        super();
+    super();
-        this.createType = 'manual';
+    this.createType = 'manual';
-    }
+  }
 
-    override init(data: any): void {
+  override init(data: any): void {
-        Object.assign(this, data);
+    Object.assign(this, data);
-        if (this.status == 1) {
+    if (this.status == 1) {
-            this.switch_status = true;
+      this.switch_status = true;
-        }
     }
+  }
 
-    override trans(): void {
+  override trans(): void {
-        if (this.switch_status) {
+    if (this.switch_status) {
-            this.status = 1;
+      this.status = 1;
-        } else {
+    } else {
-            this.status = 0;
+      this.status = 0;
-        }
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/AccountsStrategy.ts

@@ -1,55 +1,54 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import format from 'date-fns/format';
 
 import { BaseEntity } from './BaseEntity';
 
 export class AccountsStrategy extends BaseEntity {
-    name!: String;
+  name!: String;
-    appId!: String;
+  appId!: String;
-    appName!: String;
+  appName!: String;
-    filters!: String;
+  filters!: String;
-    orgIdsList!: String;
+  orgIdsList!: String;
-    mapping!: String;
+  mapping!: String;
-    suffixes!: String;
+  suffixes!: String;
-    createType!: String;
+  createType!: String;
-    switch_dynamic: boolean = false;
+  switch_dynamic: boolean = false;
-    picker_resumeTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
+  picker_resumeTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
-    picker_suspendTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
+  picker_suspendTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
 
-    constructor() {
+  constructor() {
-        super();
+    super();
-        this.createType = 'manual';
+    this.createType = 'manual';
-        this.mapping = 'username';
+    this.mapping = 'username';
-    }
+  }
 
-    override init(data: any): void {
+  override init(data: any): void {
-        Object.assign(this, data);
+    Object.assign(this, data);
-        if (this.status == 1) {
+    if (this.status == 1) {
-            this.switch_status = true;
+      this.switch_status = true;
-        }
     }
+  }
 
-    override trans(): void {
+  override trans(): void {
-        if (this.switch_status) {
+    if (this.switch_status) {
-            this.status = 1;
+      this.status = 1;
-        } else {
+    } else {
-            this.status = 0;
+      this.status = 0;
-        }
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/Adapters.ts

@@ -1,45 +1,44 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import format from 'date-fns/format';
 
 import { BaseEntity } from './BaseEntity';
 
 export class Adapters extends BaseEntity {
-    name!: String;
+  name!: String;
-    protocol!: String;
+  protocol!: String;
-    adapter!: String;
+  adapter!: String;
-    switch_dynamic: boolean = false;
+  switch_dynamic: boolean = false;
 
-    constructor() {
+  constructor() {
-        super();
+    super();
-    }
+  }
 
-    override init(data: any): void {
+  override init(data: any): void {
-        Object.assign(this, data);
+    Object.assign(this, data);
-        if (this.status == 1) {
+    if (this.status == 1) {
-            this.switch_status = true;
+      this.switch_status = true;
-        }
     }
-    override trans(): void {
+  }
-        if (this.switch_status) {
+  override trans(): void {
-            this.status = 1;
+    if (this.switch_status) {
-        } else {
+      this.status = 1;
-            this.status = 0;
+    } else {
-        }
+      this.status = 0;
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/AppsCasDetails.ts

@@ -19,32 +19,32 @@ import format from 'date-fns/format';
 import { Apps } from './Apps';
 
 export class AppsCasDetails extends Apps {
-    service!: String;
+  service!: String;
-    callbackUrl!: String;
+  callbackUrl!: String;
-    casUser!: String;
+  casUser!: String;
-    expires!: Number;
+  expires!: Number;
 
-    constructor() {
+  constructor() {
-        super();
+    super();
-        this.expires = 300;
+    this.expires = 300;
-        this.casUser = 'username';
+    this.casUser = 'username';
-    }
+  }
 
-    override init(data: any): void {
+  override init(data: any): void {
-        Object.assign(this, data);
+    Object.assign(this, data);
-        super.init(data);
+    super.init(data);
-        if (this.status == 1) {
+    if (this.status == 1) {
-            this.switch_status = true;
+      this.switch_status = true;
-        } else {
+    } else {
-            this.switch_status = false;
+      this.switch_status = false;
-        }
     }
+  }
 
-    override trans(): void {
+  override trans(): void {
-        if (this.switch_status) {
+    if (this.switch_status) {
-            this.status = 1;
+      this.status = 1;
-        } else {
+    } else {
-            this.status = 0;
+      this.status = 0;
-        }
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/AppsExtendApiDetails.ts

@@ -19,25 +19,25 @@ import format from 'date-fns/format';
 import { Apps } from './Apps';
 
 export class AppsExtendApiDetails extends Apps {
-    constructor() {
+  constructor() {
-        super();
+    super();
-    }
+  }
 
-    override init(data: any): void {
+  override init(data: any): void {
-        Object.assign(this, data);
+    Object.assign(this, data);
-        super.init(data);
+    super.init(data);
-        if (this.status == 1) {
+    if (this.status == 1) {
-            this.switch_status = true;
+      this.switch_status = true;
-        } else {
+    } else {
-            this.switch_status = false;
+      this.switch_status = false;
-        }
     }
+  }
 
-    override trans(): void {
+  override trans(): void {
-        if (this.switch_status) {
+    if (this.switch_status) {
-            this.status = 1;
+      this.status = 1;
-        } else {
+    } else {
-            this.status = 0;
+      this.status = 0;
-        }
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/AppsOauth20Details.ts

@@ -19,117 +19,117 @@ import format from 'date-fns/format';
 import { Apps } from './Apps';
 
 export class AppsOauth20Details extends Apps {
-    clientId!: String;
+  clientId!: String;
 
-    clientSecret!: String;
+  clientSecret!: String;
 
-    scope!: String;
+  scope!: String;
 
-    resourceIds!: String;
+  resourceIds!: String;
 
-    authorizedGrantTypes!: String;
+  authorizedGrantTypes!: String;
 
-    registeredRedirectUris!: String;
+  registeredRedirectUris!: String;
 
-    authorities!: String;
+  authorities!: String;
 
-    accessTokenValiditySeconds!: String;
+  accessTokenValiditySeconds!: String;
 
-    refreshTokenValiditySeconds!: String;
+  refreshTokenValiditySeconds!: String;
 
-    approvalPrompt!: String;
+  approvalPrompt!: String;
 
-    // for OpenID Connect
+  // for OpenID Connect
 
-    issuer!: String;
+  issuer!: String;
 
-    audience!: String;
+  audience!: String;
 
-    algorithm!: String;
+  algorithm!: String;
 
-    algorithmKey!: String;
+  algorithmKey!: String;
 
-    encryptionMethod!: String;
+  encryptionMethod!: String;
 
-    signature!: String;
+  signature!: String;
 
-    signatureKey!: String;
+  signatureKey!: String;
 
-    subject!: String;
+  subject!: String;
 
-    userInfoResponse!: String;
+  userInfoResponse!: String;
 
-    pkce!: String;
+  pkce!: String;
 
-    select_authorizedGrantTypes!: string[];
+  select_authorizedGrantTypes!: string[];
 
-    select_scope!: string[];
+  select_scope!: string[];
 
-    constructor() {
+  constructor() {
-        super();
+    super();
-        this.select_authorizedGrantTypes = ['authorization_code'];
+    this.select_authorizedGrantTypes = ['authorization_code'];
-        this.select_scope = ['read'];
+    this.select_scope = ['read'];
-        this.pkce = 'no';
+    this.pkce = 'no';
-        this.approvalPrompt = 'auto';
+    this.approvalPrompt = 'auto';
-        this.accessTokenValiditySeconds = '300';
+    this.accessTokenValiditySeconds = '300';
-        this.refreshTokenValiditySeconds = '300';
+    this.refreshTokenValiditySeconds = '300';
-        this.subject = 'username';
+    this.subject = 'username';
+  }
+
+  override init(data: any): void {
+    Object.assign(this, data);
+    super.init(data);
+    if (this.status == 1) {
+      this.switch_status = true;
+    } else {
+      this.switch_status = false;
+    }
+    if (this.approvalPrompt == '') {
+    }
+    this.select_scope = [''];
+    let scopeArray: String[] = `${this.scope},`.split(',');
+    for (let i = 0; i < scopeArray.length; i++) {
+      this.select_scope.push(`${scopeArray[i]}`);
     }
 
-    override init(data: any): void {
+    this.select_authorizedGrantTypes = [''];
-        Object.assign(this, data);
+    let authorizedGrantTypesArray = `${this.authorizedGrantTypes},`.split(',');
-        super.init(data);
+    for (let i = 0; i < authorizedGrantTypesArray.length; i++) {
-        if (this.status == 1) {
+      this.select_authorizedGrantTypes.push(authorizedGrantTypesArray[i]);
-            this.switch_status = true;
+    }
+    if (this.pkce == null || this.pkce == '') {
+      this.pkce = 'no';
+    }
+    this.pkce = this.pkce.toLowerCase();
+  }
+
+  override trans(): void {
+    if (this.switch_status) {
+      this.status = 1;
+    } else {
+      this.status = 0;
+    }
+    this.scope = '';
+
+    for (let i = 0; i < this.select_scope.length; i++) {
+      if (this.select_scope[i] != '') {
+        if (this.scope === '') {
+          this.scope = this.select_scope[i];
         } else {
-            this.switch_status = false;
+          this.scope = `${this.scope},${this.select_scope[i]}`;
         }
-        if (this.approvalPrompt == '') {
+      }
-        }
-        this.select_scope = [''];
-        let scopeArray: String[] = `${this.scope},`.split(',');
-        for (let i = 0; i < scopeArray.length; i++) {
-            this.select_scope.push(`${scopeArray[i]}`);
-        }
-
-        this.select_authorizedGrantTypes = [''];
-        let authorizedGrantTypesArray = `${this.authorizedGrantTypes},`.split(',');
-        for (let i = 0; i < authorizedGrantTypesArray.length; i++) {
-            this.select_authorizedGrantTypes.push(authorizedGrantTypesArray[i]);
-        }
-        if (this.pkce == null || this.pkce == '') {
-            this.pkce = 'no';
-        }
-        this.pkce = this.pkce.toLowerCase();
     }
-
+    this.authorizedGrantTypes = '';
-    override trans(): void {
+    let n = 0;
-        if (this.switch_status) {
+    for (let i = 0; i < this.select_authorizedGrantTypes.length; i++) {
-            this.status = 1;
+      if (this.select_authorizedGrantTypes[i] != '') {
+        if (this.authorizedGrantTypes === '') {
+          this.authorizedGrantTypes = this.select_authorizedGrantTypes[i];
         } else {
-            this.status = 0;
+          this.authorizedGrantTypes = `${this.authorizedGrantTypes},${this.select_authorizedGrantTypes[i]}`;
-        }
-        this.scope = '';
-
-        for (let i = 0; i < this.select_scope.length; i++) {
-            if (this.select_scope[i] != '') {
-                if (this.scope === '') {
-                    this.scope = this.select_scope[i];
-                } else {
-                    this.scope = `${this.scope},${this.select_scope[i]}`;
-                }
-            }
-        }
-        this.authorizedGrantTypes = '';
-        let n = 0;
-        for (let i = 0; i < this.select_authorizedGrantTypes.length; i++) {
-            if (this.select_authorizedGrantTypes[i] != '') {
-                if (this.authorizedGrantTypes === '') {
-                    this.authorizedGrantTypes = this.select_authorizedGrantTypes[i];
-                } else {
-                    this.authorizedGrantTypes = `${this.authorizedGrantTypes},${this.select_authorizedGrantTypes[i]}`;
-                }
-            }
         }
+      }
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/AppsTokenBasedDetails.ts

@@ -19,36 +19,36 @@ import format from 'date-fns/format';
 import { Apps } from './Apps';
 
 export class AppsTokenBasedDetails extends Apps {
-    redirectUri!: String;
+  redirectUri!: String;
-    tokenType!: String;
+  tokenType!: String;
-    cookieName!: String;
+  cookieName!: String;
-    algorithm!: String;
+  algorithm!: String;
-    algorithmKey!: String;
+  algorithmKey!: String;
-    expires!: Number;
+  expires!: Number;
 
-    constructor() {
+  constructor() {
-        super();
+    super();
-        this.expires = 300;
+    this.expires = 300;
-        this.tokenType = 'POST';
+    this.tokenType = 'POST';
-        this.cookieName = 'ltpa_token';
+    this.cookieName = 'ltpa_token';
-        this.algorithm = 'AES';
+    this.algorithm = 'AES';
-    }
+  }
 
-    override init(data: any): void {
+  override init(data: any): void {
-        Object.assign(this, data);
+    Object.assign(this, data);
-        super.init(data);
+    super.init(data);
-        if (this.status == 1) {
+    if (this.status == 1) {
-            this.switch_status = true;
+      this.switch_status = true;
-        } else {
+    } else {
-            this.switch_status = false;
+      this.switch_status = false;
-        }
     }
+  }
 
-    override trans(): void {
+  override trans(): void {
-        if (this.switch_status) {
+    if (this.switch_status) {
-            this.status = 1;
+      this.status = 1;
-        } else {
+    } else {
-            this.status = 0;
+      this.status = 0;
-        }
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/BaseEntity.ts

@@ -15,31 +15,31 @@
  */
 
 export class BaseEntity {
-    id!: String;
+  id!: String;
-    instId!: String;
+  instId!: String;
-    instName!: String;
+  instName!: String;
-    sortIndex!: Number;
+  sortIndex!: Number;
-    status!: Number;
+  status!: Number;
-    description!: String;
+  description!: String;
-    switch_status: boolean = false;
+  switch_status: boolean = false;
-    str_status!: String;
+  str_status!: String;
 
-    constructor() {
+  constructor() {
-        this.status = 1;
+    this.status = 1;
-        this.sortIndex = 1;
+    this.sortIndex = 1;
-        this.switch_status = true;
+    this.switch_status = true;
+  }
+  init(data: any): void {
+    Object.assign(this, data);
+    if (this.status == 1) {
+      this.switch_status = true;
     }
-    init(data: any): void {
+  }
-        Object.assign(this, data);
+  trans(): void {
-        if (this.status == 1) {
+    if (this.switch_status) {
-            this.switch_status = true;
+      this.status = 1;
-        }
+    } else {
-    }
+      this.status = 0;
-    trans(): void {
-        if (this.switch_status) {
-            this.status = 1;
-        } else {
-            this.status = 0;
-        }
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/ChangePassword.ts

@@ -1,30 +1,29 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { BaseEntity } from './BaseEntity';
 
 export class ChangePassword extends BaseEntity {
-    userId!: String;
+  userId!: String;
-    username!: String;
+  username!: String;
-    email!: String;
+  email!: String;
-    mobile!: String;
+  mobile!: String;
-    displayName!: String;
+  displayName!: String;
-    oldPassword!: String;
+  oldPassword!: String;
-    password!: String;
+  password!: String;
-    confirmPassword!: String;
+  confirmPassword!: String;
-    decipherable!: String;
+  decipherable!: String;
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/Connectors.ts

@@ -19,48 +19,48 @@ import format from 'date-fns/format';
 import { BaseEntity } from './BaseEntity';
 
 export class Connectors extends BaseEntity {
-    connName!: String;
+  connName!: String;
-    justInTime!: Number;
+  justInTime!: Number;
-    filters!: String;
+  filters!: String;
-    scheduler!: String;
+  scheduler!: String;
-    providerUrl!: String;
+  providerUrl!: String;
-    principal!: String;
+  principal!: String;
-    credentials!: String;
+  credentials!: String;
 
-    switch_justInTime: boolean = true;
+  switch_justInTime: boolean = true;
 
-    constructor() {
+  constructor() {
-        super();
+    super();
-        this.status = 1;
+    this.status = 1;
-        this.justInTime = 1;
+    this.justInTime = 1;
+  }
+
+  override init(data: any): void {
+    Object.assign(this, data);
+    if (this.status == 1) {
+      this.switch_status = true;
+    } else {
+      this.switch_status = false;
     }
 
-    override init(data: any): void {
+    if (this.justInTime == 1) {
-        Object.assign(this, data);
+      this.switch_justInTime = true;
-        if (this.status == 1) {
+    } else {
-            this.switch_status = true;
+      this.switch_justInTime = false;
-        } else {
+    }
-            this.switch_status = false;
+  }
-        }
 
-        if (this.justInTime == 1) {
+  override trans(): void {
-            this.switch_justInTime = true;
+    if (this.switch_status) {
-        } else {
+      this.status = 1;
-            this.switch_justInTime = false;
+    } else {
-        }
+      this.status = 0;
     }
 
-    override trans(): void {
+    if (this.switch_justInTime) {
-        if (this.switch_status) {
+      this.justInTime = 1;
-            this.status = 1;
+    } else {
-        } else {
+      this.justInTime = 0;
-            this.status = 0;
-        }
-
-        if (this.switch_justInTime) {
-            this.justInTime = 1;
-        } else {
-            this.justInTime = 0;
-        }
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/EmailSenders.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { BaseEntity } from './BaseEntity';
 

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/ExtraAttr.ts

@@ -19,9 +19,9 @@ import format from 'date-fns/format';
 import { BaseEntity } from './BaseEntity';
 
 export class ExtraAttr {
-    id!: string;
+  id!: string;
-    attr!: string;
+  attr!: string;
-    type!: string;
+  type!: string;
-    value!: string;
+  value!: string;
-    constructor() { }
+  constructor() {}
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/Institutions.ts

@@ -17,17 +17,17 @@
 import { BaseEntity } from './BaseEntity';
 
 export class Institutions extends BaseEntity {
-    name!: String;
+  name!: String;
-    fullName!: String;
+  fullName!: String;
-    contact!: String;
+  contact!: String;
-    email!: String;
+  email!: String;
-    phone!: String;
+  phone!: String;
-    address!: String;
+  address!: String;
-    logo!: String;
+  logo!: String;
-    frontTitle!: String;
+  frontTitle!: String;
-    consoleTitle!: String;
+  consoleTitle!: String;
-    consoleDomain!: String;
+  consoleDomain!: String;
-    domain!: String;
+  domain!: String;
-    captcha!: String;
+  captcha!: String;
-    defaultUri!: String;
+  defaultUri!: String;
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/LdapContext.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { BaseEntity } from './BaseEntity';
 

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/Message.ts

@@ -1,25 +1,24 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import format from 'date-fns/format';
 import { NzSafeAny } from 'ng-zorro-antd/core/types';
 
 export class Message<NzSafeAny> {
-    code: number = 0;
+  code: number = 0;
-    message: string = '';
+  message: string = '';
-    data: any;
+  data: any;
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/Organizations.ts

@@ -17,45 +17,45 @@
 import { BaseEntity } from './BaseEntity';
 
 export class Organizations extends BaseEntity {
-    orgCode!: String;
+  orgCode!: String;
-    orgName!: String;
+  orgName!: String;
-    fullName!: String;
+  fullName!: String;
-    parentId!: String;
+  parentId!: String;
-    parentCode!: string;
+  parentCode!: string;
-    parentName!: String;
+  parentName!: String;
-    type!: String;
+  type!: String;
-    codePath!: String;
+  codePath!: String;
-    namePath!: String;
+  namePath!: String;
-    level!: Number;
+  level!: Number;
-    division!: String;
+  division!: String;
-    country!: String;
+  country!: String;
-    region!: String;
+  region!: String;
-    locality!: String;
+  locality!: String;
-    street!: String;
+  street!: String;
-    address!: String;
+  address!: String;
-    contact!: String;
+  contact!: String;
-    postalCode!: String;
+  postalCode!: String;
-    phone!: String;
+  phone!: String;
-    fax!: String;
+  fax!: String;
-    email!: String;
+  email!: String;
-    switch_dynamic: boolean = false;
+  switch_dynamic: boolean = false;
 
-    constructor() {
+  constructor() {
-        super();
+    super();
-        this.status = 1;
+    this.status = 1;
-    }
+  }
 
-    override init(data: any): void {
+  override init(data: any): void {
-        Object.assign(this, data);
+    Object.assign(this, data);
-        if (this.status == 1) {
+    if (this.status == 1) {
-            this.switch_status = true;
+      this.switch_status = true;
-        }
     }
-    override trans(): void {
+  }
-        if (this.switch_status) {
+  override trans(): void {
-            this.status = 1;
+    if (this.switch_status) {
-        } else {
+      this.status = 1;
-            this.status = 0;
+    } else {
-        }
+      this.status = 0;
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/PageResults.ts

@@ -18,13 +18,13 @@ import format from 'date-fns/format';
 import { NzSafeAny } from 'ng-zorro-antd/core/types';
 
 export class PageResults {
-    page: number = 0;
+  page: number = 0;
-    total: number = 0;
+  total: number = 0;
-    totalPage: number = 0;
+  totalPage: number = 0;
-    records: number = 0;
+  records: number = 0;
-    rows: any[] = [];
+  rows: any[] = [];
 
-    init(data: any): void {
+  init(data: any): void {
-        Object.assign(this, data);
+    Object.assign(this, data);
-    }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/PasswordPolicy.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { BaseEntity } from './BaseEntity';
 

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/Resources.ts

@@ -17,35 +17,35 @@
 import { BaseEntity } from './BaseEntity';
 
 export class Resources extends BaseEntity {
-    resourceName!: String;
+  resourceName!: String;
-    permission!: String;
+  permission!: String;
-    appId!: String;
+  appId!: String;
-    appName!: String;
+  appName!: String;
-    parentId!: String;
+  parentId!: String;
-    parentName!: String;
+  parentName!: String;
-    resourceType!: String;
+  resourceType!: String;
-    resourceIcon!: String;
+  resourceIcon!: String;
-    resourceStyle!: String;
+  resourceStyle!: String;
-    resourceUrl!: String;
+  resourceUrl!: String;
-    resourceAction!: String;
+  resourceAction!: String;
-    switch_dynamic: boolean = false;
+  switch_dynamic: boolean = false;
 
-    constructor() {
+  constructor() {
-        super();
+    super();
-        this.status = 1;
+    this.status = 1;
-    }
+  }
 
-    override init(data: any): void {
+  override init(data: any): void {
-        Object.assign(this, data);
+    Object.assign(this, data);
-        if (this.status == 1) {
+    if (this.status == 1) {
-            this.switch_status = true;
+      this.switch_status = true;
-        }
     }
-    override trans(): void {
+  }
-        if (this.switch_status) {
+  override trans(): void {
-            this.status = 1;
+    if (this.switch_status) {
-        } else {
+      this.status = 1;
-            this.status = 0;
+    } else {
-        }
+      this.status = 0;
     }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/RoleMembers.ts

@@ -16,4 +16,4 @@
 
 import { BaseEntity } from './BaseEntity';
 
-export class RoleMembers extends BaseEntity { }
+export class RoleMembers extends BaseEntity {}

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/Roles.ts

@@ -19,47 +19,47 @@ import format from 'date-fns/format';
 import { BaseEntity } from './BaseEntity';
 
 export class Roles extends BaseEntity {
-    roleCode!: String;
+  roleCode!: String;
-    roleName!: String;
+  roleName!: String;
-    category!: String;
+  category!: String;
-    filters!: String;
+  filters!: String;
-    orgIdsList!: String;
+  orgIdsList!: String;
-    resumeTime!: String;
+  resumeTime!: String;
-    suspendTime!: String;
+  suspendTime!: String;
-    isdefault!: String;
+  isdefault!: String;
 
-    picker_resumeTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
+  picker_resumeTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
-    picker_suspendTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
+  picker_suspendTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
 
-    constructor() {
+  constructor() {
-        super();
+    super();
+  }
+
+  override init(data: any): void {
+    Object.assign(this, data);
+    if (this.status == 1) {
+      this.switch_status = true;
     }
 
-    override init(data: any): void {
+    if (this.resumeTime != '') {
-        Object.assign(this, data);
+      this.picker_resumeTime = new Date(format(new Date(), `yyyy-MM-dd ${this.resumeTime}:00`));
-        if (this.status == 1) {
-            this.switch_status = true;
-        }
-
-        if (this.resumeTime != '') {
-            this.picker_resumeTime = new Date(format(new Date(), `yyyy-MM-dd ${this.resumeTime}:00`));
-        }
-        if (this.suspendTime != '') {
-            this.picker_suspendTime = new Date(format(new Date(), `yyyy-MM-dd ${this.suspendTime}:00`));
-        }
     }
-    override trans(): void {
+    if (this.suspendTime != '') {
-        if (this.switch_status) {
+      this.picker_suspendTime = new Date(format(new Date(), `yyyy-MM-dd ${this.suspendTime}:00`));
-            this.status = 1;
-        } else {
-            this.status = 0;
-        }
-
-        if (this.picker_resumeTime) {
-            this.resumeTime = format(this.picker_resumeTime, 'HH:mm');
-        }
-        if (this.picker_suspendTime) {
-            this.suspendTime = format(this.picker_suspendTime, 'HH:mm');
-        }
     }
+  }
+  override trans(): void {
+    if (this.switch_status) {
+      this.status = 1;
+    } else {
+      this.status = 0;
+    }
+
+    if (this.picker_resumeTime) {
+      this.resumeTime = format(this.picker_resumeTime, 'HH:mm');
+    }
+    if (this.picker_suspendTime) {
+      this.suspendTime = format(this.picker_suspendTime, 'HH:mm');
+    }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/SmsProvider.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { BaseEntity } from './BaseEntity';
 

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/Synchronizers.ts

@@ -1,84 +1,83 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import format from 'date-fns/format';
 
 import { BaseEntity } from './BaseEntity';
 
 export class Synchronizers extends BaseEntity {
-    name!: String;
+  name!: String;
-    filters!: String;
+  filters!: String;
-    sourceType!: String;
+  sourceType!: String;
-    service!: String;
+  service!: String;
-    resumeTime!: String;
+  resumeTime!: String;
-    suspendTime!: String;
+  suspendTime!: String;
-    scheduler!: String;
+  scheduler!: String;
-    syncStartTime!: Number;
+  syncStartTime!: Number;
-    providerUrl!: String;
+  providerUrl!: String;
-    driverClass!: String;
+  driverClass!: String;
-    principal!: String;
+  principal!: String;
-    credentials!: String;
+  credentials!: String;
-    sslSwitch!: Number;
+  sslSwitch!: Number;
-    basedn!: String;
+  basedn!: String;
-    msadDomain!: String;
+  msadDomain!: String;
-    trustStore!: String;
+  trustStore!: String;
-    trustStorePassword!: String;
+  trustStorePassword!: String;
-    switch_sslSwitch: boolean = false;
+  switch_sslSwitch: boolean = false;
-    picker_resumeTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
+  picker_resumeTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
-    picker_suspendTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
+  picker_suspendTime: Date = new Date(format(new Date(), 'yyyy-MM-dd 00:00:00'));
 
-    constructor() {
+  constructor() {
-        super();
+    super();
-        this.status = 1;
+    this.status = 1;
-        this.sourceType != 'API';
+    this.sourceType != 'API';
-    }
+  }
 
-    override init(data: any): void {
+  override init(data: any): void {
-        Object.assign(this, data);
+    Object.assign(this, data);
-        if (this.status == 1) {
+    if (this.status == 1) {
-            this.switch_status = true;
+      this.switch_status = true;
-        }
-        if (this.sslSwitch == 1) {
-            this.switch_sslSwitch = true;
-        }
-        if (this.resumeTime != '') {
-            this.picker_resumeTime = new Date(format(new Date(), `yyyy-MM-dd ${this.resumeTime}:00`));
-        }
-        if (this.suspendTime != '') {
-            this.picker_suspendTime = new Date(format(new Date(), `yyyy-MM-dd ${this.suspendTime}:00`));
-        }
     }
+    if (this.sslSwitch == 1) {
+      this.switch_sslSwitch = true;
+    }
+    if (this.resumeTime != '') {
+      this.picker_resumeTime = new Date(format(new Date(), `yyyy-MM-dd ${this.resumeTime}:00`));
+    }
+    if (this.suspendTime != '') {
+      this.picker_suspendTime = new Date(format(new Date(), `yyyy-MM-dd ${this.suspendTime}:00`));
+    }
+  }
 
-    override trans(): void {
+  override trans(): void {
-        if (this.switch_status) {
+    if (this.switch_status) {
-            this.status = 1;
+      this.status = 1;
-        } else {
+    } else {
-            this.status = 0;
+      this.status = 0;
-        }
-        if (this.switch_sslSwitch) {
-            this.sslSwitch = 1;
-        } else {
-            this.sslSwitch = 0;
-        }
-        if (this.picker_resumeTime) {
-            this.resumeTime = format(this.picker_resumeTime, 'HH:mm');
-        }
-        if (this.picker_suspendTime) {
-            this.suspendTime = format(this.picker_suspendTime, 'HH:mm');
-        }
     }
+    if (this.switch_sslSwitch) {
+      this.sslSwitch = 1;
+    } else {
+      this.sslSwitch = 0;
+    }
+    if (this.picker_resumeTime) {
+      this.resumeTime = format(this.picker_resumeTime, 'HH:mm');
+    }
+    if (this.picker_suspendTime) {
+      this.suspendTime = format(this.picker_suspendTime, 'HH:mm');
+    }
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/TreeNodes.ts

@@ -16,48 +16,48 @@
 
 import { NzFormatEmitEvent, NzTreeNode, NzTreeNodeOptions } from 'ng-zorro-antd/tree';
 export class TreeNodes {
-    activated!: NzTreeNode;
+  activated!: NzTreeNode;
-    request!: any[];
+  request!: any[];
-    nodes!: any[];
+  nodes!: any[];
-    checkable!: boolean;
+  checkable!: boolean;
-    checkedKeys!: any[];
+  checkedKeys!: any[];
-    selectedKeys!: any[];
+  selectedKeys!: any[];
-    _rootNode!: any;
+  _rootNode!: any;
-    constructor(checkable: boolean) {
+  constructor(checkable: boolean) {
-        this.checkable = checkable;
+    this.checkable = checkable;
-        this.checkedKeys = [];
+    this.checkedKeys = [];
-        this.selectedKeys = [];
+    this.selectedKeys = [];
-    }
+  }
 
-    init(treeAttrs: any) {
+  init(treeAttrs: any) {
-        let nodeType = treeAttrs.rootNode.attrs && treeAttrs.rootNode.attrs.type ? treeAttrs.rootNode.attrs.type : '';
+    let nodeType = treeAttrs.rootNode.attrs && treeAttrs.rootNode.attrs.type ? treeAttrs.rootNode.attrs.type : '';
-        this._rootNode = {
+    this._rootNode = {
-            title: treeAttrs.rootNode.title,
+      title: treeAttrs.rootNode.title,
-            key: treeAttrs.rootNode.key,
+      key: treeAttrs.rootNode.key,
-            type: nodeType,
+      type: nodeType,
-            expanded: true,
+      expanded: true,
-            isLeaf: false
+      isLeaf: false
-        };
+    };
-        this.request = treeAttrs.nodes;
+    this.request = treeAttrs.nodes;
-    }
+  }
 
-    build(): any[] {
+  build(): any[] {
-        return this.buildTree(this._rootNode);
+    return this.buildTree(this._rootNode);
-    }
+  }
 
-    buildTree(rootNode: any): any[] {
+  buildTree(rootNode: any): any[] {
-        let treeNodes: any[] = [];
+    let treeNodes: any[] = [];
-        for (let node of this.request) {
+    for (let node of this.request) {
-            if (node.key != rootNode.key && node.parentKey == rootNode.key) {
+      if (node.key != rootNode.key && node.parentKey == rootNode.key) {
-                let nodeType = node.attrs && node.attrs.type ? node.attrs.type : '';
+        let nodeType = node.attrs && node.attrs.type ? node.attrs.type : '';
-                let treeNode = { title: node.title, key: node.key, type: nodeType, expanded: false, isLeaf: true };
+        let treeNode = { title: node.title, key: node.key, type: nodeType, expanded: false, isLeaf: true };
-                this.buildTree(treeNode);
+        this.buildTree(treeNode);
-                treeNodes.push(treeNode);
+        treeNodes.push(treeNode);
-                //console.log(treeNode);
+        //console.log(treeNode);
-                rootNode.isLeaf = false;
+        rootNode.isLeaf = false;
-            }
+      }
-        }
-        rootNode.children = treeNodes;
-        return [rootNode];
     }
+    rootNode.children = treeNodes;
+    return [rootNode];
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/entity/Users.ts

@@ -17,173 +17,173 @@
 import { BaseEntity } from './BaseEntity';
 
 export class Users extends BaseEntity {
-    username!: String;
+  username!: String;
-    password!: String;
+  password!: String;
-    decipherable!: String;
+  decipherable!: String;
-    sharedSecret!: String;
+  sharedSecret!: String;
-    sharedCounter!: String;
+  sharedCounter!: String;
-    /**
+  /**
-     * "Employee", "Supplier","Dealer","Contractor",Partner,Customer "Intern",
+   * "Employee", "Supplier","Dealer","Contractor",Partner,Customer "Intern",
-     * "Temp", "External", and "Unknown" .
+   * "Temp", "External", and "Unknown" .
-     */
+   */
-    userType!: String;
+  userType!: String;
 
-    userState!: String;
+  userState!: String;
-    windowsAccount!: String;
+  windowsAccount!: String;
 
-    // for user name
+  // for user name
-    displayName!: String;
+  displayName!: String;
-    nickName!: String;
+  nickName!: String;
-    nameZhSpell!: String;
+  nameZhSpell!: String;
-    nameZhShortSpell!: String;
+  nameZhShortSpell!: String;
-    givenName!: String;
+  givenName!: String;
-    middleName!: String;
+  middleName!: String;
-    familyName!: String;
+  familyName!: String;
-    honorificPrefix!: String;
+  honorificPrefix!: String;
-    honorificSuffix!: String;
+  honorificSuffix!: String;
-    formattedName!: String;
+  formattedName!: String;
 
-    married!: Number;
+  married!: Number;
-    gender!: Number;
+  gender!: Number;
-    birthDate!: String;
+  birthDate!: String;
-    picture!: String;
+  picture!: String;
-    pictureId!: String;
+  pictureId!: String;
-    pictureBase64!: string;
+  pictureBase64!: string;
-    idType!: Number;
+  idType!: Number;
-    idCardNo!: String;
+  idCardNo!: String;
-    webSite!: String;
+  webSite!: String;
-    startWorkDate!: String;
+  startWorkDate!: String;
 
-    // for security
+  // for security
-    authnType!: String;
+  authnType!: String;
-    email!: String;
+  email!: String;
-    emailVerified!: Number;
+  emailVerified!: Number;
-    mobile!: String;
+  mobile!: String;
-    mobileVerified!: String;
+  mobileVerified!: String;
-    passwordQuestion!: String;
+  passwordQuestion!: String;
-    passwordAnswer!: String;
+  passwordAnswer!: String;
 
-    // for apps login protected
+  // for apps login protected
-    appLoginAuthnType!: String;
+  appLoginAuthnType!: String;
-    appLoginPassword!: String;
+  appLoginPassword!: String;
-    protectedApps!: String;
+  protectedApps!: String;
-    protectedAppsMap!: String;
+  protectedAppsMap!: String;
 
-    passwordLastSetTime!: String;
+  passwordLastSetTime!: String;
-    badPasswordCount!: Number;
+  badPasswordCount!: Number;
-    badPasswordTime!: String;
+  badPasswordTime!: String;
-    unLockTime!: String;
+  unLockTime!: String;
-    isLocked!: Number;
+  isLocked!: Number;
-    lastLoginTime!: String;
+  lastLoginTime!: String;
-    lastLoginIp!: String;
+  lastLoginIp!: String;
-    lastLogoffTime!: String;
+  lastLogoffTime!: String;
-    passwordSetType!: Number;
+  passwordSetType!: Number;
-    loginCount!: Number;
+  loginCount!: Number;
-    regionHistory!: String;
+  regionHistory!: String;
-    passwordHistory!: String;
+  passwordHistory!: String;
 
-    locale!: String;
+  locale!: String;
-    timeZone!: String;
+  timeZone!: String;
-    preferredLanguage!: String;
+  preferredLanguage!: String;
 
-    // for work
+  // for work
-    workCountry!: String;
+  workCountry!: String;
-    workRegion!: String; // province;
+  workRegion!: String; // province;
-    workLocality!: String; // city;
+  workLocality!: String; // city;
-    workStreetAddress!: String;
+  workStreetAddress!: String;
-    workAddressFormatted!: String;
+  workAddressFormatted!: String;
-    workEmail!: String;
+  workEmail!: String;
-    workPhoneNumber!: String;
+  workPhoneNumber!: String;
-    workPostalCode!: String;
+  workPostalCode!: String;
-    workFax!: String;
+  workFax!: String;
-    workOfficeName!: String;
+  workOfficeName!: String;
-    // for home
+  // for home
-    homeCountry!: String;
+  homeCountry!: String;
-    homeRegion!: String; // province;
+  homeRegion!: String; // province;
-    homeLocality!: String; // city;
+  homeLocality!: String; // city;
-    homeStreetAddress!: String;
+  homeStreetAddress!: String;
-    homeAddressFormatted!: String;
+  homeAddressFormatted!: String;
-    homeEmail!: String;
+  homeEmail!: String;
-    homePhoneNumber!: String;
+  homePhoneNumber!: String;
-    homePostalCode!: String;
+  homePostalCode!: String;
-    homeFax!: String;
+  homeFax!: String;
-    // for company
+  // for company
-    employeeNumber!: String;
+  employeeNumber!: String;
-    costCenter!: String;
+  costCenter!: String;
-    organization!: String;
+  organization!: String;
-    division!: String;
+  division!: String;
-    departmentId!: String;
+  departmentId!: String;
-    department!: String;
+  department!: String;
-    jobTitle!: String;
+  jobTitle!: String;
-    jobLevel!: String;
+  jobLevel!: String;
-    managerId!: String;
+  managerId!: String;
-    manager!: String;
+  manager!: String;
-    assistantId!: String;
+  assistantId!: String;
-    assistant!: String;
+  assistant!: String;
-    entryDate!: String;
+  entryDate!: String;
-    quitDate!: String;
+  quitDate!: String;
 
-    // for social contact
+  // for social contact
-    defineIm!: String;
+  defineIm!: String;
-    theme!: String;
+  theme!: String;
-    /*
+  /*
-     * for extended Attribute from userType extraAttribute for database
+   * for extended Attribute from userType extraAttribute for database
-     * extraAttributeName & extraAttributeValue for page submit
+   * extraAttributeName & extraAttributeValue for page submit
-     */
+   */
-    //protected String extraAttribute;
+  //protected String extraAttribute;
-    //protected String extraAttributeName;
+  //protected String extraAttributeName;
-    //protected String extraAttributeValue;
+  //protected String extraAttributeValue;
-    //@JsonIgnore
+  //@JsonIgnore
-    //protected HashMap<String, String> extraAttributeMap;
+  //protected HashMap<String, String> extraAttributeMap;
 
-    online!: Number;
+  online!: Number;
 
-    gridList!: Number;
+  gridList!: Number;
-    switch_dynamic: boolean = false;
+  switch_dynamic: boolean = false;
 
-    gender_select!: String;
+  gender_select!: String;
-    str_married!: String;
+  str_married!: String;
-    str_idType!: String;
+  str_idType!: String;
-    constructor() {
+  constructor() {
-        super();
+    super();
-        this.status = 1;
+    this.status = 1;
-        this.sortIndex = 1;
+    this.sortIndex = 1;
-        this.gender = 1;
+    this.gender = 1;
-        this.userType = 'EMPLOYEE';
+    this.userType = 'EMPLOYEE';
-        this.userState = 'RESIDENT';
+    this.userState = 'RESIDENT';
-        this.gender_select = '1';
+    this.gender_select = '1';
-        this.str_married = '0';
+    this.str_married = '0';
-        this.str_idType = '0';
+    this.str_idType = '0';
+  }
+
+  override init(data: any): void {
+    Object.assign(this, data);
+    if (this.status == 1) {
+      this.switch_status = true;
+    }
+    if (this.gender == 1) {
+      this.gender_select = '1';
+    } else {
+      this.gender_select = '2';
+    }
+    this.str_status = `${this.status}`;
+    this.str_married = `${this.married}`;
+    this.str_idType = `${this.idType}`;
+  }
+  override trans(): void {
+    if (this.switch_status) {
+      this.status = 1;
+    } else {
+      this.status = 0;
     }
 
-    override init(data: any): void {
+    if (this.gender_select == '1') {
-        Object.assign(this, data);
+      this.gender = 1;
-        if (this.status == 1) {
+    } else {
-            this.switch_status = true;
+      this.gender = 2;
-        }
-        if (this.gender == 1) {
-            this.gender_select = '1';
-        } else {
-            this.gender_select = '2';
-        }
-        this.str_status = `${this.status}`;
-        this.str_married = `${this.married}`;
-        this.str_idType = `${this.idType}`;
-    }
-    override trans(): void {
-        if (this.switch_status) {
-            this.status = 1;
-        } else {
-            this.status = 0;
-        }
-
-        if (this.gender_select == '1') {
-            this.gender = 1;
-        } else {
-            this.gender = 2;
-        }
-        this.status = Number.parseInt(`${this.str_status}`);
-        this.married = Number.parseInt(`${this.str_married}`);
-        this.idType = Number.parseInt(`${this.str_idType}`);
     }
+    this.status = Number.parseInt(`${this.str_status}`);
+    this.married = Number.parseInt(`${this.str_married}`);
+    this.idType = Number.parseInt(`${this.str_idType}`);
+  }
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/global-config.module.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 /* eslint-disable import/order */
 import { ModuleWithProviders, NgModule, Optional, SkipSelf } from '@angular/core';

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/basic/basic.component.ts

@@ -154,5 +154,5 @@ export class LayoutBasicComponent implements OnInit {
     }
   }
 
-  constructor(private settingsService: SettingsService, private authnService: AuthnService) { }
+  constructor(private settingsService: SettingsService, private authnService: AuthnService) {}
 }

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/basic/widgets/clear-storage.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { ChangeDetectionStrategy, Component, HostListener } from '@angular/core';
 import { NzMessageService } from 'ng-zorro-antd/message';

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/basic/widgets/fullscreen.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { ChangeDetectionStrategy, Component, HostListener } from '@angular/core';
 import screenfull from 'screenfull';

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/basic/widgets/i18n.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { DOCUMENT } from '@angular/common';
 import { ChangeDetectionStrategy, Component, Inject, Input } from '@angular/core';

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/basic/widgets/icon.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
 

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/basic/widgets/notify.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
 import { NoticeIconList, NoticeIconSelect, NoticeItem } from '@delon/abc/notice-icon';

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/basic/widgets/rtl.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { ChangeDetectionStrategy, Component, HostListener } from '@angular/core';
 import { RTLService } from '@delon/theme';

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/basic/widgets/search.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import {
   AfterViewInit,

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/basic/widgets/task.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
 

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/basic/widgets/user.component.ts

@@ -81,7 +81,7 @@ export class HeaderUserComponent {
     private router: Router,
     private authnService: AuthnService,
     @Inject(DA_SERVICE_TOKEN) private tokenService: ITokenService
-  ) { }
+  ) {}
 
   logout(): void {
     this.authnService

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/blank/blank.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { Component } from '@angular/core';
 

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/layout.module.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
@@ -23,7 +22,6 @@ import { GlobalFooterModule } from '@delon/abc/global-footer';
 import { NoticeIconModule } from '@delon/abc/notice-icon';
 import { AlainThemeModule } from '@delon/theme';
 import { SettingDrawerModule } from '@delon/theme/setting-drawer';
-
 //import { ThemeBtnModule } from '@delon/theme/theme-btn';
 import { NzAutocompleteModule } from 'ng-zorro-antd/auto-complete';
 import { NzAvatarModule } from 'ng-zorro-antd/avatar';
@@ -94,4 +92,4 @@ const PASSPORT = [LayoutPassportComponent];
   declarations: [...COMPONENTS, ...HEADERCOMPONENTS, ...PASSPORT],
   exports: [...COMPONENTS, ...PASSPORT]
 })
-export class LayoutModule { }
+export class LayoutModule {}

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/passport/passport.component.html

@@ -36,4 +36,4 @@
     </global-footer>
   </div>
 </div>
-<theme-btn></theme-btn>
+<theme-btn></theme-btn>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/layout/passport/passport.component.ts

@@ -40,7 +40,7 @@ export class LayoutPassportComponent implements OnInit {
     }
   ];
 
-  constructor(@Inject(DA_SERVICE_TOKEN) private tokenService: ITokenService, private authnService: AuthnService) { }
+  constructor(@Inject(DA_SERVICE_TOKEN) private tokenService: ITokenService, private authnService: AuthnService) {}
 
   ngOnInit(): void {
     this.inst = this.authnService.getInst();

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

@@ -66,4 +66,4 @@ const COMPONENTS = [
   imports: [NzIconModule, SharedModule, CommonModule, RouterModule.forChild(routes)],
   exports: [RouterModule]
 })
-export class AccessModule { }
+export class AccessModule {}

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

@@ -6,32 +6,47 @@
         <nz-form-item>
           <nz-form-label nzFor="appName">{{ 'mxk.apps.name' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.appName" [ngModelOptions]="{ standalone: true }" name="appName"
+            <input
-              placeholder="" id="appName" />
+              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 : 10" [class.text-right]="query.expandForm">
-        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          i18n }}</button>
+        <button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset' | 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>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
         <button nz-button nzType="primary" (click)="onSubmit($event)">{{ 'mxk.text.confirm' | i18n }}</button>
       </div>
     </div>
   </form>
 
-  <nz-table #dynamicTable nzTableLayout="auto" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+  <nz-table
-    [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+    #dynamicTable
-    [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzTableLayout="auto"
-    (nzQueryParams)="onQueryParamsChange($event)" nzWidth="100%">
+    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)"
+    nzWidth="100%"
+  >
     <thead>
       <tr>
-        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate"
+        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate" (nzCheckedChange)="onTableAllChecked($event)"></th>
-          (nzCheckedChange)="onTableAllChecked($event)"></th>
         <th nzAlign="center" style="display: none">Id</th>
         <th nzAlign="center">{{ 'mxk.apps.icon' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.apps.name' | i18n }}</th>
@@ -40,8 +55,11 @@
     </thead>
     <tbody>
       <tr *ngFor="let data of query.results.rows">
-        <td [nzChecked]="query.tableCheckedId.has(data.id)" [nzDisabled]="data.disabled"
+        <td
-          (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+          [nzChecked]="query.tableCheckedId.has(data.id)"
+          [nzDisabled]="data.disabled"
+          (nzCheckedChange)="onTableItemChecked(data.id, $event)"
+        ></td>
         <td nzAlign="center"><img height="30" border="0px" src="{{ data.iconBase64 }}" /></td>
         <td nzAlign="left"> {{ data.appName }}</td>
         <td nzAlign="left">
@@ -81,4 +99,4 @@
 <div *nzModalFooter style="display: none">
   <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>

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

@@ -59,30 +59,30 @@ export class PermissionsEditerComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        appName: '',
+      appName: '',
-        displayName: '',
+      displayName: '',
-        username: '',
+      username: '',
-        roleId: '',
+      roleId: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 5,
+      pageSize: 5,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [5, 15, 50]
+      pageSizeOptions: [5, 15, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalRef: NzModalRef,
@@ -92,7 +92,7 @@ export class PermissionsEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.roleId) {
@@ -111,7 +111,7 @@ export class PermissionsEditerComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   fetch(): void {
     this.query.submitLoading = true;

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

@@ -8,12 +8,18 @@
           <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.roleName" [ngModelOptions]="{ standalone: true }"
+              <input
-                name="roleName" readonly placeholder="" id="roleName" />
+                nz-input
+                [(ngModel)]="query.params.roleName"
+                [ngModelOptions]="{ standalone: true }"
+                name="roleName"
+                readonly
+                placeholder=""
+                id="roleName"
+              />
             </nz-input-group>
             <ng-template #suffixButton>
-              <button nz-button nzType="primary" (click)="onSelect($event)" nzSearch>{{ 'mxk.text.select' | i18n
+              <button nz-button nzType="primary" (click)="onSelect($event)" nzSearch>{{ 'mxk.text.select' | i18n }}</button>
-                }}</button>
             </ng-template>
           </nz-form-control>
         </nz-form-item>
@@ -22,18 +28,23 @@
         <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"
+            <input
-              placeholder="" id="appName" />
+              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' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          i18n }}</button>
+        <button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset' | 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>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
       </div>
     </div>
   </form>
@@ -44,30 +55,44 @@
       <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>
+      }}</button>
     </div>
 
     <div nz-col nzMd="24" nzSm="24">
-      <nz-table #dynamicTable nzTableLayout="auto" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+      <nz-table
-        [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+        #dynamicTable
-        [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber"
+        nzTableLayout="auto"
-        [nzLoading]="this.query.tableLoading" (nzQueryParams)="onQueryParamsChange($event)">
+        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"
+            <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate" (nzCheckedChange)="onTableAllChecked($event)"></th>
-              (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"><a>{{ 'mxk.text.action' | i18n }}</a></th>
+            <th nzAlign="center"
+              ><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"
+            <td
-              (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+              [nzChecked]="query.tableCheckedId.has(data.id)"
+              [nzDisabled]="data.disabled"
+              (nzCheckedChange)="onTableItemChecked(data.id, $event)"
+            ></td>
             <td nzAlign="left"> {{ data.roleName }}</td>
             <td nzAlign="center"><img height="30" border="0px" src="{{ data.iconBase64 }}" /></td>
             <td nzAlign="left"> {{ data.appName }}</td>
@@ -103,8 +128,7 @@
             </td>
             <td nzAlign="left" nzBreakWord="false">
               <div nz-col>
-                <button nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete' | i18n
+                <button nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-                  }}</button>
               </div>
             </td>
           </tr>
@@ -112,4 +136,4 @@
       </nz-table>
     </div>
   </div>
-</nz-card>
+</nz-card>

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

@@ -66,33 +66,33 @@ export class PermissionsComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        displayName: '',
+      displayName: '',
-        username: '',
+      username: '',
-        roleId: '',
+      roleId: '',
-        roleName: '',
+      roleName: '',
-        appName: '',
+      appName: '',
-        appId: '',
+      appId: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableInitialize: true,
+    tableInitialize: true,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalService: NzModalService,
@@ -104,7 +104,7 @@ export class PermissionsComponent implements OnInit {
     private route: ActivatedRoute,
     private cdr: ChangeDetectorRef,
     private http: _HttpClient
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.route.snapshot.queryParams['roleId']) {
@@ -126,7 +126,7 @@ export class PermissionsComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   onBatchDelete(e: MouseEvent): void {
     e.preventDefault();

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/access/role-members/member-roles-editer/member-roles-editer.component.html

@@ -1,56 +1,74 @@
 <div *nzModalTitle> {{ 'mxk.text.add' | i18n }} </div>
 <nz-card [nzBordered]="false">
-    <form nz-form [nzLayout]="'inline'" (ngSubmit)="onSearch()" class="search__form">
+  <form nz-form [nzLayout]="'inline'" (ngSubmit)="onSearch()" class="search__form">
-        <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 8, lg: 24, xl: 48, xxl: 48 }">
+    <div nz-row [nzGutter]="{ xs: 8, sm: 8, md: 8, lg: 24, xl: 48, xxl: 48 }">
-            <div nz-col nzMd="14" nzSm="24">
+      <div nz-col nzMd="14" nzSm="24">
-                <nz-form-item>
+        <nz-form-item>
-                    <nz-form-label nzFor="name">{{ 'mxk.roles.name' | i18n }}</nz-form-label>
+          <nz-form-label nzFor="name">{{ 'mxk.roles.name' | i18n }}</nz-form-label>
-                    <nz-form-control>
+          <nz-form-control>
-                        <input nz-input [(ngModel)]="query.params.roleName" [ngModelOptions]="{ standalone: true }"
+            <input
-                            name="roleName" placeholder="" id="roleName" />
+              nz-input
-                    </nz-form-control>
+              [(ngModel)]="query.params.roleName"
-                </nz-form-item>
+              [ngModelOptions]="{ standalone: true }"
-            </div>
+              name="roleName"
+              placeholder=""
+              id="roleName"
+            />
+          </nz-form-control>
+        </nz-form-item>
+      </div>
 
-            <div nz-col [nzSpan]="query.expandForm ? 24 : 10" [class.text-right]="query.expandForm">
+      <div nz-col [nzSpan]="query.expandForm ? 24 : 10" [class.text-right]="query.expandForm">
-                <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-                    '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 type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{
+        <button nz-button (click)="query.expandForm = !query.expandForm" class="mx-sm" style="display: none">
-                    'mxk.text.reset' | i18n }}</button>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | 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>
+        <button nz-button nzType="primary" (click)="onSubmit($event)">{{ 'mxk.text.confirm' | i18n }}</button>
-                <button nz-button nzType="primary" (click)="onSubmit($event)">{{ 'mxk.text.confirm' | i18n }}</button>
+      </div>
-            </div>
+    </div>
-        </div>
+  </form>
-    </form>
 
-    <nz-table #dynamicTable nzTableLayout="auto" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+  <nz-table
-        [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+    #dynamicTable
-        [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber"
+    nzTableLayout="auto"
-        [nzLoading]="this.query.tableLoading" (nzQueryParams)="onQueryParamsChange($event)" nzWidth="100%">
+    nzBordered
-        <thead>
+    nzShowSizeChanger
-            <tr>
+    [nzData]="query.results.rows"
-                <th></th>
+    [nzFrontPagination]="false"
-                <th nzAlign="center" style="display: none">Id</th>
+    [nzTotal]="query.results.records"
-                <th nzAlign="center">{{ 'mxk.roles.name' | i18n }}</th>
+    [nzPageSizeOptions]="query.params.pageSizeOptions"
-                <th nzAlign="center">{{ 'mxk.roles.dynamic' | i18n }}</th>
+    [nzPageSize]="query.params.pageSize"
-            </tr>
+    [nzPageIndex]="query.params.pageNumber"
-        </thead>
+    [nzLoading]="this.query.tableLoading"
-        <tbody>
+    (nzQueryParams)="onQueryParamsChange($event)"
-            <tr *ngFor="let data of query.results.rows">
+    nzWidth="100%"
-                <td [nzChecked]="query.tableCheckedId.has(data.id)" [nzDisabled]="data.disabled"
+  >
-                    (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+    <thead>
-                <td nzAlign="left" style="display: none">
+      <tr>
-                    <span>{{ data.id }}</span>
+        <th></th>
-                </td>
+        <th nzAlign="center" style="display: none">Id</th>
-                <td nzAlign="left"> {{ data.roleName }}</td>
+        <th nzAlign="center">{{ 'mxk.roles.name' | i18n }}</th>
-                <td nzAlign="center"> <i *ngIf="data.dynamic == 1" nz-icon nzType="check-circle" nzTheme="fill"
+        <th nzAlign="center">{{ 'mxk.roles.dynamic' | i18n }}</th>
-                        style="color: green"></i></td>
+      </tr>
-            </tr>
+    </thead>
-        </tbody>
+    <tbody>
-    </nz-table>
+      <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" style="display: none">
+          <span>{{ data.id }}</span>
+        </td>
+        <td nzAlign="left"> {{ data.roleName }}</td>
+        <td nzAlign="center"> <i *ngIf="data.dynamic == 1" nz-icon nzType="check-circle" nzTheme="fill" style="color: green"></i></td>
+      </tr>
+    </tbody>
+  </nz-table>
 </nz-card>
 <div *nzModalFooter style="display: none">
-    <button nz-button nzType="default" (click)="onClose($event)">{{ 'mxk.text.close' | i18n }}</button>
+  <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>
+  <button nz-button nzType="primary" (click)="onSubmit($event)">{{ 'mxk.text.submit' | i18n }}</button>
-</div>
+</div>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/access/role-members/member-roles-editer/member-roles-editer.component.ts

@@ -57,29 +57,29 @@ export class MemberRolesEditerComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        roleName: '',
+      roleName: '',
-        username: '',
+      username: '',
-        protocol: '',
+      protocol: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 5,
+      pageSize: 5,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [5, 15, 50]
+      pageSizeOptions: [5, 15, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalRef: NzModalRef,
@@ -89,7 +89,7 @@ export class MemberRolesEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.username) {
@@ -108,7 +108,7 @@ export class MemberRolesEditerComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   fetch(): void {
     this.query.submitLoading = true;

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/access/role-members/role-members-editer/role-members-editer.component.html

@@ -6,32 +6,47 @@
         <nz-form-item>
           <nz-form-label nzFor="username">{{ 'mxk.users.username' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.username" [ngModelOptions]="{ standalone: true }" name="username"
+            <input
-              placeholder="" id="username" />
+              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 : 10" [class.text-right]="query.expandForm">
-        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          i18n }}</button>
+        <button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset' | 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>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
         <button nz-button nzType="primary" (click)="onSubmit($event)">{{ 'mxk.text.confirm' | i18n }}</button>
       </div>
     </div>
   </form>
 
-  <nz-table #dynamicTable nzTableLayout="auto" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+  <nz-table
-    [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+    #dynamicTable
-    [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzTableLayout="auto"
-    (nzQueryParams)="onQueryParamsChange($event)" nzWidth="100%">
+    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)"
+    nzWidth="100%"
+  >
     <thead>
       <tr>
-        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate"
+        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate" (nzCheckedChange)="onTableAllChecked($event)"></th>
-          (nzCheckedChange)="onTableAllChecked($event)"></th>
         <th nzAlign="center" style="display: none">Id</th>
         <th nzAlign="center">{{ 'mxk.users.username' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.users.displayName' | i18n }}</th>
@@ -43,17 +58,18 @@
     </thead>
     <tbody>
       <tr *ngFor="let data of query.results.rows">
-        <td [nzChecked]="query.tableCheckedId.has(data.id)" [nzDisabled]="data.disabled"
+        <td
-          (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+          [nzChecked]="query.tableCheckedId.has(data.id)"
+          [nzDisabled]="data.disabled"
+          (nzCheckedChange)="onTableItemChecked(data.id, $event)"
+        ></td>
         <td nzAlign="left"> {{ data.username }}</td>
         <td nzAlign="left"> {{ data.displayName }}</td>
         <td nzAlign="left"> {{ data.employeeNumber }}</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' |
+        <td nzAlign="center"> {{ data.gender == 1 ? ('mxk.users.gender.female' | i18n) : ('mxk.users.gender.male' | i18n) }}</td>
-          i18n) }}</td>
+        <td nzAlign="center"> <i *ngIf="data.dynamic == 1" nz-icon nzType="check-circle" nzTheme="fill" style="color: green"></i></td>
-        <td nzAlign="center"> <i *ngIf="data.dynamic == 1" nz-icon nzType="check-circle" nzTheme="fill"
-            style="color: green"></i></td>
       </tr>
     </tbody>
   </nz-table>
@@ -61,4 +77,4 @@
 <div *nzModalFooter style="display: none">
   <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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/access/role-members/role-members-editer/role-members-editer.component.ts

@@ -60,30 +60,30 @@ export class RoleMembersEditerComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        name: '',
+      name: '',
-        displayName: '',
+      displayName: '',
-        username: '',
+      username: '',
-        roleId: '',
+      roleId: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 5,
+      pageSize: 5,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [5, 15, 50]
+      pageSizeOptions: [5, 15, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalRef: NzModalRef,
@@ -93,7 +93,7 @@ export class RoleMembersEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.roleId) {
@@ -112,7 +112,7 @@ export class RoleMembersEditerComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   fetch(): void {
     this.query.submitLoading = true;

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

@@ -8,12 +8,18 @@
           <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.roleName" [ngModelOptions]="{ standalone: true }"
+              <input
-                name="roleName" readonly placeholder="" id="roleName" />
+                nz-input
+                [(ngModel)]="query.params.roleName"
+                [ngModelOptions]="{ standalone: true }"
+                name="roleName"
+                readonly
+                placeholder=""
+                id="roleName"
+              />
             </nz-input-group>
             <ng-template #suffixButton>
-              <button nz-button nzType="primary" (click)="onSelect($event)" nzSearch>{{ 'mxk.text.select' | i18n
+              <button nz-button nzType="primary" (click)="onSelect($event)" nzSearch>{{ 'mxk.text.select' | i18n }}</button>
-                }}</button>
             </ng-template>
           </nz-form-control>
         </nz-form-item>
@@ -22,17 +28,23 @@
         <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"
+            <input
-              placeholder="" id="username" />
+              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' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          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>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
       </div>
     </div>
   </form>
@@ -43,44 +55,56 @@
       <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>
+      }}</button>
     </div>
 
     <div nz-col nzMd="24" nzSm="24">
-      <nz-table #dynamicTable nzTableLayout="auto" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+      <nz-table
-        [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+        #dynamicTable
-        [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber"
+        nzTableLayout="auto"
-        [nzLoading]="this.query.tableLoading" (nzQueryParams)="onQueryParamsChange($event)">
+        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"
+            <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate" (nzCheckedChange)="onTableAllChecked($event)"></th>
-              (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"><a>{{ 'mxk.text.action' | i18n }}</a></th>
+            <th nzAlign="center"
+              ><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"
+            <td
-              (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+              [nzChecked]="query.tableCheckedId.has(data.id)"
+              [nzDisabled]="data.disabled"
+              (nzCheckedChange)="onTableItemChecked(data.id, $event)"
+            ></td>
             <td nzAlign="left"> {{ data.roleName }}</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' |
+            <td nzAlign="center"> {{ data.gender == 1 ? ('mxk.users.gender.female' | i18n) : ('mxk.users.gender.male' | i18n) }}</td>
-              i18n) }}</td>
             <td nzAlign="left" nzBreakWord="false">
               <div nz-col>
-                <button *ngIf="data.category == 'static'" nz-button type="button" (click)="onDelete($event, data.id)"
+                <button *ngIf="data.category == 'static'" nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{
-                  nzDanger>{{
                   'mxk.text.delete' | i18n
-                  }}</button>
+                }}</button>
               </div>
             </td>
           </tr>
@@ -88,4 +112,4 @@
       </nz-table>
     </div>
   </div>
-</nz-card>
+</nz-card>

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

@@ -67,33 +67,33 @@ export class RoleMembersComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        roleName: '',
+      roleName: '',
-        displayName: '',
+      displayName: '',
-        username: '',
+      username: '',
-        roleId: '',
+      roleId: '',
-        appName: '',
+      appName: '',
-        appId: '',
+      appId: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableInitialize: true,
+    tableInitialize: true,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalService: NzModalService,
@@ -104,7 +104,7 @@ export class RoleMembersComponent implements OnInit {
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private route: ActivatedRoute,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.route.snapshot.queryParams['username']) {

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/access/roles/role-editer/role-editer.component.html

@@ -4,8 +4,7 @@
     <nz-form-item class="d-none">
       <nz-form-label [nzMd]="6" nzRequired nzFor="id">{{ 'mxk.text.id' | i18n }}</nz-form-label>
       <nz-form-control [nzMd]="18" nzErrorTip="The input is not valid id!">
-        <input [(ngModel)]="form.model.id" disabled="{{ isEdit }}" [ngModelOptions]="{ standalone: true }" nz-input
+        <input [(ngModel)]="form.model.id" disabled="{{ isEdit }}" [ngModelOptions]="{ standalone: true }" nz-input name="id" />
-          name="id" />
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
@@ -17,8 +16,7 @@
     <nz-form-item>
       <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="roleName">{{ 'mxk.roles.name' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid minLength!">
-        <input [(ngModel)]="form.model.roleName" [ngModelOptions]="{ standalone: true }" nz-input name="roleName"
+        <input [(ngModel)]="form.model.roleName" [ngModelOptions]="{ standalone: true }" nz-input name="roleName" id="roleName" />
-          id="roleName" />
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
@@ -33,40 +31,77 @@
     <nz-form-item *ngIf="form.model.category == 'dynamic'">
       <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="resumeTime">{{ 'mxk.roles.resumeTime' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzXs]="24" nzErrorTip="The input is not valid port!">
-        <nz-time-picker [(ngModel)]="form.model.picker_resumeTime" [ngModelOptions]="{ standalone: true }"
+        <nz-time-picker
-          nzFormat="HH:mm" name="picker_resumeTime" id="picker_resumeTime"></nz-time-picker>
+          [(ngModel)]="form.model.picker_resumeTime"
+          [ngModelOptions]="{ standalone: true }"
+          nzFormat="HH:mm"
+          name="picker_resumeTime"
+          id="picker_resumeTime"
+        ></nz-time-picker>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item *ngIf="form.model.category == 'dynamic'">
       <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="suspendTime">{{ 'mxk.roles.suspendTime' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzXs]="24" nzErrorTip="The input is not valid suspendTime!">
-        <nz-time-picker [(ngModel)]="form.model.picker_suspendTime" [ngModelOptions]="{ standalone: true }"
+        <nz-time-picker
-          nzFormat="HH:mm" name="picker_suspendTime" id="picker_suspendTime"></nz-time-picker>
+          [(ngModel)]="form.model.picker_suspendTime"
+          [ngModelOptions]="{ standalone: true }"
+          nzFormat="HH:mm"
+          name="picker_suspendTime"
+          id="picker_suspendTime"
+        ></nz-time-picker>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item *ngIf="form.model.category == 'dynamic'">
       <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="orgIdsList">{{ 'mxk.roles.orgIdsList' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzXs]="24" nzErrorTip="The input is not valid upperCase!">
-        <input type="hidden" [(ngModel)]="form.model.orgIdsList" [ngModelOptions]="{ standalone: true }" nz-input
+        <input
-          name="orgIdsList" id="orgIdsList" />
+          type="hidden"
-        <nz-tree-select nzVirtualHeight="300px" [nzMaxTagCount]="3" [(ngModel)]="selectValues"
+          [(ngModel)]="form.model.orgIdsList"
-          [ngModelOptions]="{ standalone: true }" [nzNodes]="treeNodes.nodes" nzCheckable nzPlaceHolder="Please select"
+          [ngModelOptions]="{ standalone: true }"
-          [nzCheckStrictly]="true">
+          nz-input
+          name="orgIdsList"
+          id="orgIdsList"
+        />
+        <nz-tree-select
+          nzVirtualHeight="300px"
+          [nzMaxTagCount]="3"
+          [(ngModel)]="selectValues"
+          [ngModelOptions]="{ standalone: true }"
+          [nzNodes]="treeNodes.nodes"
+          nzCheckable
+          nzPlaceHolder="Please select"
+          [nzCheckStrictly]="true"
+        >
         </nz-tree-select>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item *ngIf="form.model.category == 'dynamic'">
       <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="filters">{{ 'mxk.roles.filters' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzXs]="24" nzErrorTip="The input is not valid filters!">
-        <textarea rows="4" nz-input [(ngModel)]="form.model.filters" [ngModelOptions]="{ standalone: true }" nz-input
+        <textarea
-          name="filters" id="filters"></textarea>
+          rows="4"
+          nz-input
+          [(ngModel)]="form.model.filters"
+          [ngModelOptions]="{ standalone: true }"
+          nz-input
+          name="filters"
+          id="filters"
+        ></textarea>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
       <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzXs]="24" nzErrorTip="The input is not valid encoding!">
-        <textarea rows="4" nz-input [(ngModel)]="form.model.description" [ngModelOptions]="{ standalone: true }"
+        <textarea
-          nz-input name="description" id="description"></textarea>
+          rows="4"
+          nz-input
+          [(ngModel)]="form.model.description"
+          [ngModelOptions]="{ standalone: true }"
+          nz-input
+          name="description"
+          id="description"
+        ></textarea>
       </nz-form-control>
     </nz-form-item>
   </form>
@@ -75,4 +110,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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/access/roles/role-editer/role-editer.component.ts

@@ -47,9 +47,9 @@ export class RoleEditerComponent implements OnInit {
     submitting: boolean;
     model: Roles;
   } = {
-      submitting: false,
+    submitting: false,
-      model: new Roles()
+    model: new Roles()
-    };
+  };
 
   // TreeNodes
   treeNodes = new TreeNodes(false);
@@ -66,7 +66,7 @@ export class RoleEditerComponent 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/access/roles/roles.component.html

@@ -7,19 +7,24 @@
         <nz-form-item>
           <nz-form-label nzFor="roleName">{{ 'mxk.roles.name' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.roleName" [ngModelOptions]="{ standalone: true }" name="roleName"
+            <input
-              placeholder="" id="roleName" />
+              nz-input
+              [(ngModel)]="query.params.roleName"
+              [ngModelOptions]="{ standalone: true }"
+              name="roleName"
+              placeholder=""
+              id="roleName"
+            />
           </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' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          i18n }}</button>
+        <button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset' | 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>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
       </div>
     </div>
   </form>
@@ -29,27 +34,43 @@
     <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>
+    }}</button>
   </div>
-  <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+  <nz-table
-    [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+    #dynamicTable
-    [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzTableLayout="auto"
-    (nzQueryParams)="onQueryParamsChange($event)" nzWidth="100%">
+    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)"
+    nzWidth="100%"
+  >
     <thead>
       <tr>
-        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate"
+        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate" (nzCheckedChange)="onTableAllChecked($event)"></th>
-          (nzCheckedChange)="onTableAllChecked($event)"></th>
         <th nzAlign="center" style="display: none">Id</th>
         <th nzAlign="center">{{ 'mxk.roles.name' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.roles.category' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.text.description' | i18n }}</th>
-        <th nzAlign="center"><a>{{ 'mxk.text.action' | i18n }}</a></th>
+        <th nzAlign="center"
+          ><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"
+        <td
-          (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+          [nzChecked]="query.tableCheckedId.has(data.id)"
+          [nzDisabled]="data.disabled"
+          (nzCheckedChange)="onTableItemChecked(data.id, $event)"
+        ></td>
         <td nzAlign="left" style="display: none">
           <span>{{ data.id }}</span>
         </td>
@@ -61,20 +82,22 @@
           <div nz-col>
             <button nz-button type="button" (click)="onMembers($event, data.id, data.roleName)" style="float: left">{{
               'mxk.roles.member' | i18n
-              }}</button>
+            }}</button>
-            <button nz-button type="button" (click)="onPermissions($event, data.id, data.roleName)"
+            <button nz-button type="button" (click)="onPermissions($event, data.id, data.roleName)" style="float: left">{{
-              style="float: left">{{
               'mxk.roles.permissions' | i18n
-              }}</button>
+            }}</button>
-            <button nz-button type="button" (click)="onEdit($event, data.id)" style="float: left">{{ 'mxk.text.edit' |
+            <button nz-button type="button" (click)="onEdit($event, data.id)" style="float: left">{{ 'mxk.text.edit' | i18n }}</button>
-              i18n }}</button>
             <button
               *ngIf="data.roleCode != 'ROLE_ADMINISTRATORS' && data.roleCode != 'ROLE_ALL_USER' && data.roleCode != 'ROLE_MANAGERS'"
-              nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete' | i18n
+              nz-button
-              }}</button>
+              type="button"
+              (click)="onDelete($event, data.id)"
+              nzDanger
+              >{{ 'mxk.text.delete' | i18n }}</button
+            >
           </div>
         </td>
       </tr>
     </tbody>
   </nz-table>
-</nz-card>
+</nz-card>

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

@@ -59,29 +59,29 @@ export class RolesComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        roleName: '',
+      roleName: '',
-        displayName: '',
+      displayName: '',
-        employeeNumber: '',
+      employeeNumber: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalService: NzModalService,
@@ -92,7 +92,7 @@ export class RolesComponent 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 RolesComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   onBatchDelete(e: MouseEvent): void {
     e.preventDefault();

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

@@ -6,28 +6,44 @@
         <nz-form-item>
           <nz-form-label nzFor="roleName">{{ 'mxk.roles.name' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.roleName" [ngModelOptions]="{ standalone: true }" name="roleName"
+            <input
-              placeholder="" id="roleName" />
+              nz-input
+              [(ngModel)]="query.params.roleName"
+              [ngModelOptions]="{ standalone: true }"
+              name="roleName"
+              placeholder=""
+              id="roleName"
+            />
           </nz-form-control>
         </nz-form-item>
       </div>
 
       <div nz-col [nzSpan]="query.expandForm ? 24 : 10" [class.text-right]="query.expandForm">
-        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          i18n }}</button>
+        <button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset' | 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>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
         <button nz-button nzType="primary" (click)="onSubmit($event)">{{ 'mxk.text.confirm' | i18n }}</button>
       </div>
     </div>
   </form>
 
-  <nz-table #dynamicTable nzTableLayout="auto" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+  <nz-table
-    [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+    #dynamicTable
-    [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzTableLayout="auto"
-    (nzQueryParams)="onQueryParamsChange($event)" nzWidth="100%">
+    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)"
+    nzWidth="100%"
+  >
     <thead>
       <tr>
         <th></th>
@@ -38,8 +54,11 @@
     </thead>
     <tbody>
       <tr *ngFor="let data of query.results.rows">
-        <td [nzChecked]="query.tableCheckedId.has(data.id)" [nzDisabled]="data.disabled"
+        <td
-          (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+          [nzChecked]="query.tableCheckedId.has(data.id)"
+          [nzDisabled]="data.disabled"
+          (nzCheckedChange)="onTableItemChecked(data.id, $event)"
+        ></td>
         <td nzAlign="left" style="display: none">
           <span>{{ data.id }}</span>
         </td>
@@ -53,4 +72,4 @@
 <div *nzModalFooter style="display: none">
   <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>

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

@@ -55,29 +55,29 @@ export class SelectRolesComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        roleName: '',
+      roleName: '',
-        displayName: '',
+      displayName: '',
-        protocol: '',
+      protocol: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 5,
+      pageSize: 5,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [5, 15, 50]
+      pageSizeOptions: [5, 15, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalRef: NzModalRef,
@@ -86,7 +86,7 @@ export class SelectRolesComponent implements OnInit {
     private fb: FormBuilder,
     private msg: NzMessageService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     this.fetch();
@@ -102,7 +102,7 @@ export class SelectRolesComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   fetch(): void {
     this.query.submitLoading = true;

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

@@ -56,29 +56,29 @@ export class SessionsComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        username: '',
+      username: '',
-        displayName: '',
+      displayName: '',
-        employeeNumber: '',
+      employeeNumber: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private fb: FormBuilder,
@@ -86,7 +86,7 @@ export class SessionsComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     this.fetch();
@@ -102,7 +102,7 @@ export class SessionsComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   onTerminate(e: MouseEvent): void {
     e.preventDefault();

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/accounts/account-editer/account-editer.component.html

@@ -4,105 +4,125 @@
     <nz-form-item style="display: none">
       <nz-form-label [nzMd]="6" nzFor="id">{{ 'mxk.text.id' | i18n }}</nz-form-label>
       <nz-form-control [nzMd]="18" nzErrorTip="The input is not valid id!">
-        <input [(ngModel)]="form.model.id" disabled="{{ isEdit }}" [ngModelOptions]="{ standalone: true }" nz-input
+        <input [(ngModel)]="form.model.id" disabled="{{ isEdit }}" [ngModelOptions]="{ standalone: true }" nz-input name="id" id="id" />
-          name="id" id="id" />
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="display: none">
-      <nz-form-label [nzSm]="6" [nzXs]="24" readonly nzRequired nzFor="userId">{{ 'mxk.users.id' | i18n }}
+      <nz-form-label [nzSm]="6" [nzXs]="24" readonly nzRequired nzFor="userId">{{ 'mxk.users.id' | i18n }} </nz-form-label>
-      </nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid minLength!">
-        <input [(ngModel)]="form.model.userId" [ngModelOptions]="{ standalone: true }" nz-input name="userId"
+        <input [(ngModel)]="form.model.userId" [ngModelOptions]="{ standalone: true }" nz-input name="userId" id="userId" />
-          id="userId" />
       </nz-form-control>
     </nz-form-item>
 
     <nz-form-item *ngIf="!isEdit && username == ''">
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="displayName">{{ 'mxk.users.displayName' | i18n }}
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="displayName">{{ 'mxk.users.displayName' | i18n }} </nz-form-label>
-      </nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid displayName!">
         <nz-input-group nzSearch [nzAddOnAfter]="suffixButton">
-          <input [(ngModel)]="form.model.displayName" readonly [ngModelOptions]="{ standalone: true }" nz-input
+          <input
-            name="displayName" id="displayName" />
+            [(ngModel)]="form.model.displayName"
+            readonly
+            [ngModelOptions]="{ standalone: true }"
+            nz-input
+            name="displayName"
+            id="displayName"
+          />
         </nz-input-group>
         <ng-template #suffixButton>
-          <button nz-button nzType="primary" nzSearch (click)="onSelectUser($event)">{{ 'mxk.text.select' | i18n
+          <button nz-button nzType="primary" nzSearch (click)="onSelectUser($event)">{{ 'mxk.text.select' | i18n }}</button>
-            }}</button>
         </ng-template>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item *ngIf="isEdit || username !== ''">
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="displayName">{{ 'mxk.users.displayName' | i18n }}
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="displayName">{{ 'mxk.users.displayName' | i18n }} </nz-form-label>
-      </nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid displayName!">
         <nz-input-group>
-          <input [(ngModel)]="form.model.displayName" disabled [ngModelOptions]="{ standalone: true }" nz-input
+          <input
-            name="displayName" id="displayName" />
+            [(ngModel)]="form.model.displayName"
+            disabled
+            [ngModelOptions]="{ standalone: true }"
+            nz-input
+            name="displayName"
+            id="displayName"
+          />
         </nz-input-group>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="username">{{ 'mxk.users.username' | i18n }}
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="username">{{ 'mxk.users.username' | i18n }} </nz-form-label>
-      </nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid username!">
-        <input [(ngModel)]="form.model.username" disabled="true" [ngModelOptions]="{ standalone: true }" nz-input
+        <input
-          name="username" id="username" />
+          [(ngModel)]="form.model.username"
+          disabled="true"
+          [ngModelOptions]="{ standalone: true }"
+          nz-input
+          name="username"
+          id="username"
+        />
       </nz-form-control>
     </nz-form-item>
     <nz-form-item style="display: none">
       <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="appId">{{ 'mxk.apps.id' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid appId!">
-        <input [(ngModel)]="form.model.appId" readonly [ngModelOptions]="{ standalone: true }" nz-input name="appId"
+        <input [(ngModel)]="form.model.appId" readonly [ngModelOptions]="{ standalone: true }" nz-input name="appId" id="appId" />
-          id="appId" />
       </nz-form-control>
     </nz-form-item>
     <nz-form-item *ngIf="isEdit">
       <nz-form-label nzRequired [nzSm]="6" [nzXs]="24" nzFor="appName">{{ 'mxk.apps.name' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid appName!">
-        <input [(ngModel)]="form.model.appName" disabled="true" [ngModelOptions]="{ standalone: true }" nz-input
+        <input
-          name="appName" id="appName" />
+          [(ngModel)]="form.model.appName"
+          disabled="true"
+          [ngModelOptions]="{ standalone: true }"
+          nz-input
+          name="appName"
+          id="appName"
+        />
       </nz-form-control>
     </nz-form-item>
     <nz-form-item *ngIf="!isEdit && username == ''">
       <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid appName!">
         <nz-input-group nzSearch [nzAddOnAfter]="suffixStrategyButton">
-          <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName"
+          <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName" id="appName" />
-            id="appName" />
         </nz-input-group>
         <ng-template #suffixStrategyButton>
-          <button nz-button nzType="primary" nzSearch (click)="onSelectApp($event)">{{ 'mxk.text.select' | i18n
+          <button nz-button nzType="primary" nzSearch (click)="onSelectApp($event)">{{ 'mxk.text.select' | i18n }}</button>
-            }}</button>
         </ng-template>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="relatedUsername">{{ 'mxk.accounts.relatedUsername' | i18n
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="relatedUsername">{{ 'mxk.accounts.relatedUsername' | i18n }}</nz-form-label>
-        }}</nz-form-label>
+      <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid relatedUsername!">
-      <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48"
-        nzErrorTip="The input is not valid relatedUsername!">
         <nz-input-group nzSearch>
-          <input [(ngModel)]="form.model.relatedUsername" [ngModelOptions]="{ standalone: true }" nz-input
+          <input
-            disabled="{{ isEdit }}" name="relatedUsername" id="relatedUsername" />
+            [(ngModel)]="form.model.relatedUsername"
+            [ngModelOptions]="{ standalone: true }"
+            nz-input
+            disabled="{{ isEdit }}"
+            name="relatedUsername"
+            id="relatedUsername"
+          />
         </nz-input-group>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="relatedPassword">{{ 'mxk.accounts.relatedPassword' | i18n
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="relatedPassword">{{ 'mxk.accounts.relatedPassword' | i18n }}</nz-form-label>
-        }}</nz-form-label>
+      <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid relatedPassword!">
-      <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48"
-        nzErrorTip="The input is not valid relatedPassword!">
         <nz-input-group nzSearch [nzSuffix]="suffixTemplate" [nzAddOnAfter]="suffixPasswordButton">
-          <input [(ngModel)]="form.model.relatedPassword" [ngModelOptions]="{ standalone: true }" nz-input
+          <input
-            [type]="passwordVisible ? 'text' : 'password'" name="relatedPassword" id="relatedPassword" />
+            [(ngModel)]="form.model.relatedPassword"
+            [ngModelOptions]="{ standalone: true }"
+            nz-input
+            [type]="passwordVisible ? 'text' : 'password'"
+            name="relatedPassword"
+            id="relatedPassword"
+          />
         </nz-input-group>
         <ng-template #suffixTemplate>
-          <i nz-icon [nzType]="passwordVisible ? 'eye-invisible' : 'eye'"
+          <i nz-icon [nzType]="passwordVisible ? 'eye-invisible' : 'eye'" (click)="passwordVisible = !passwordVisible"></i>
-            (click)="passwordVisible = !passwordVisible"></i>
         </ng-template>
         <ng-template #suffixPasswordButton>
-          <button nz-button nzType="primary" nzSearch (click)="onPassword($event)">{{ 'mxk.text.generate' | i18n
+          <button nz-button nzType="primary" nzSearch (click)="onPassword($event)">{{ 'mxk.text.generate' | i18n }}</button>
-            }}</button>
         </ng-template>
       </nz-form-control>
     </nz-form-item>
@@ -112,4 +132,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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/accounts/account-editer/account-editer.component.ts

@@ -51,9 +51,9 @@ export class AccountEditerComponent implements OnInit {
     submitting: boolean;
     model: Accounts;
   } = {
-      submitting: false,
+    submitting: false,
-      model: new Accounts()
+    model: new Accounts()
-    };
+  };
 
   formGroup: FormGroup = new FormGroup({});
 
@@ -67,7 +67,7 @@ export class AccountEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.isEdit) {

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

@@ -8,12 +8,18 @@
           <nz-form-label nzFor="appName">{{ 'mxk.accounts.appName' | i18n }}</nz-form-label>
           <nz-form-control>
             <nz-input-group nzSearch [nzAddOnAfter]="suffixButton">
-              <input nz-input [(ngModel)]="query.params.appName" [ngModelOptions]="{ standalone: true }" name="appName"
+              <input
-                readonly placeholder="" id="appName" />
+                nz-input
+                [(ngModel)]="query.params.appName"
+                [ngModelOptions]="{ standalone: true }"
+                name="appName"
+                readonly
+                placeholder=""
+                id="appName"
+              />
             </nz-input-group>
             <ng-template #suffixButton>
-              <button nz-button nzType="primary" (click)="onSelect($event)" nzSearch>{{ 'mxk.text.select' | i18n
+              <button nz-button nzType="primary" (click)="onSelect($event)" nzSearch>{{ 'mxk.text.select' | i18n }}</button>
-                }}</button>
             </ng-template>
           </nz-form-control>
         </nz-form-item>
@@ -22,18 +28,24 @@
         <nz-form-item>
           <nz-form-label nzFor="name">{{ 'mxk.accounts.username' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.username" [ngModelOptions]="{ standalone: true }" name="username"
+            <input
-              placeholder="" id="username" />
+              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' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          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>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
       </div>
     </div>
   </form>
@@ -43,28 +55,43 @@
     <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>
+    }}</button>
   </div>
-  <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+  <nz-table
-    [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+    #dynamicTable
-    [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzTableLayout="auto"
-    (nzQueryParams)="onQueryParamsChange($event)">
+    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"
+        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate" (nzCheckedChange)="onTableAllChecked($event)"></th>
-          (nzCheckedChange)="onTableAllChecked($event)"></th>
         <th nzAlign="center" style="display: none">Id</th>
         <th nzAlign="center">{{ 'mxk.accounts.username' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.accounts.displayName' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.accounts.appName' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.accounts.relatedUsername' | i18n }}</th>
-        <th nzAlign="center"><a>{{ 'mxk.text.action' | i18n }}</a></th>
+        <th nzAlign="center"
+          ><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"
+        <td
-          (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+          [nzChecked]="query.tableCheckedId.has(data.id)"
+          [nzDisabled]="data.disabled"
+          (nzCheckedChange)="onTableItemChecked(data.id, $event)"
+        ></td>
         <td nzAlign="left" style="display: none">
           <span>{{ data.id }}</span>
         </td>
@@ -75,11 +102,10 @@
 
         <td nzAlign="left" nzBreakWord="false">
           <div nz-col>
-            <button nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete' | i18n
+            <button nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-              }}</button>
           </div>
         </td>
       </tr>
     </tbody>
   </nz-table>
-</nz-card>
+</nz-card>

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

@@ -63,31 +63,31 @@ export class AccountsComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        username: '',
+      username: '',
-        displayName: '',
+      displayName: '',
-        employeeNumber: '',
+      employeeNumber: '',
-        appId: '',
+      appId: '',
-        appName: '',
+      appName: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalService: NzModalService,
@@ -98,7 +98,7 @@ export class AccountsComponent implements OnInit {
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private route: ActivatedRoute,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.route.snapshot.queryParams['username']) {

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-basic-details-editer/app-basic-details-editer.component.html

@@ -8,22 +8,24 @@
             <nz-form-item style="width: 100%">
               <nz-form-label [nzMd]="8" nzRequired nzFor="id">{{ 'mxk.text.id' | i18n }}</nz-form-label>
               <nz-form-control [nzMd]="16" nzErrorTip="The input is not valid id!">
-                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id"
+                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id" id="id" />
-                  id="id" />
               </nz-form-control>
             </nz-form-item>
             <nz-form-item style="width: 100%">
-              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }}
+              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }} </nz-form-label>
-              </nz-form-label>
+              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid secret!">
-              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-                nzErrorTip="The input is not valid secret!">
                 <nz-input-group nzSearch [nzAddOnAfter]="suffixPasswordButton">
-                  <input [(ngModel)]="form.model.secret" readonly [ngModelOptions]="{ standalone: true }" nz-input
+                  <input
-                    name="secret" id="secret" />
+                    [(ngModel)]="form.model.secret"
+                    readonly
+                    [ngModelOptions]="{ standalone: true }"
+                    nz-input
+                    name="secret"
+                    id="secret"
+                  />
                 </nz-input-group>
                 <ng-template #suffixPasswordButton>
-                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate'
+                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate' | i18n }}</button>
-                    | i18n }}</button>
                 </ng-template>
               </nz-form-control>
             </nz-form-item>
@@ -32,44 +34,57 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="icon">{{ 'mxk.apps.icon' | i18n }}</nz-form-label>
             <div nz-col class="clearfix" nzSm="16" nzXs="24">
-              <nz-upload nzAction="/file/upload/" nzListType="picture-card" [(nzFileList)]="fileList"
+              <nz-upload
-                nzName="uploadFile" [nzShowButton]="fileList.length < 1" [nzPreview]="handlePreview"
+                nzAction="/file/upload/"
-                (nzChange)="uploadImageChange($event)">
+                nzListType="picture-card"
+                [(nzFileList)]="fileList"
+                nzName="uploadFile"
+                [nzShowButton]="fileList.length < 1"
+                [nzPreview]="handlePreview"
+                (nzChange)="uploadImageChange($event)"
+              >
                 <div>
                   <i nz-icon nzType="plus"></i>
                   <div style="margin-top: 8px">Upload</div>
                 </div>
               </nz-upload>
-              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null"
+              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
-                (nzOnCancel)="previewVisible = false">
                 <ng-template #modalContent>
                   <img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
                 </ng-template>
               </nz-modal>
             </div>
 
-            <nz-form-control style="display: none" [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control
-              nzErrorTip="The input is not valid icon!">
+              style="display: none"
-              <input [(ngModel)]="form.model.iconId" disabled="true" [ngModelOptions]="{ standalone: true }" nz-input
+              [nzSm]="16"
-                name="icon" id="icon" />
+              [nzMd]="16"
+              [nzXs]="36"
+              [nzXl]="48"
+              nzErrorTip="The input is not valid icon!"
+            >
+              <input
+                [(ngModel)]="form.model.iconId"
+                disabled="true"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="icon"
+                id="icon"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid name!">
-              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName"
+              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName" id="appName" />
-                id="appName" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="frequently">{{ 'mxk.apps.frequently' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid frequently!">
-              nzErrorTip="The input is not valid frequently!">
+              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="yes">{{ 'mxk.text.yes' | i18n }}</label>
                 <label nz-radio-button nzValue="no">{{ 'mxk.text.no' | i18n }}</label>
               </nz-radio-group>
@@ -78,20 +93,15 @@
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid protocol!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol" id="protocol" />
-              nzErrorTip="The input is not valid protocol!">
-              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol"
-                id="protocol" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="category">{{ 'mxk.apps.category' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid category!">
-              nzErrorTip="The input is not valid category!">
+              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category" id="category">
-              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category"
-                id="category">
                 <nz-option nzValue="none" nzLabel="{{ 'mxk.apps.category.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1011" nzLabel="{{ 'mxk.apps.category.1011' | i18n }}"></nz-option>
                 <nz-option nzValue="1012" nzLabel="{{ 'mxk.apps.category.1012' | i18n }}"></nz-option>
@@ -126,33 +136,31 @@
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid loginUrl!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl" id="loginUrl" />
-              nzErrorTip="The input is not valid loginUrl!">
-              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl"
-                id="loginUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }}
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="The input is not valid status!">
-              <nz-switch [(ngModel)]="form.model.switch_status" [ngModelOptions]="{ standalone: true }" name="status"
+              <nz-switch
-                [nzCheckedChildren]="statuscheckedTemplate" [nzUnCheckedChildren]="statusunCheckedTemplate"></nz-switch>
+                [(ngModel)]="form.model.switch_status"
+                [ngModelOptions]="{ standalone: true }"
+                name="status"
+                [nzCheckedChildren]="statuscheckedTemplate"
+                [nzUnCheckedChildren]="statusunCheckedTemplate"
+              ></nz-switch>
               <ng-template #statuscheckedTemplate><i nz-icon nzType="check"></i></ng-template>
               <ng-template #statusunCheckedTemplate><i nz-icon nzType="close"></i></ng-template>
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isExtendAttr!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              nzErrorTip="The input is not valid isExtendAttr!">
-              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="0">{{ 'mxk.text.no' | i18n }}</label>
                 <label nz-radio-button nzValue="1">{{ 'mxk.text.yes' | i18n }}</label>
               </nz-radio-group>
@@ -164,18 +172,14 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutUrl">{{ 'mxk.apps.logoutUrl' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutUrl!">
-              nzErrorTip="The input is not valid logoutUrl!">
+              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input name="logoutUrl" id="logoutUrl" />
-              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="logoutUrl" id="logoutUrl" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutType">{{ 'mxk.apps.logoutType' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutType!">
-              nzErrorTip="The input is not valid logoutType!">
+              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType" id="logoutType">
-              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType"
-                id="logoutType">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.logoutType.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.logoutType.back_channel' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.logoutType.front_channel' | i18n }}"></nz-option>
@@ -187,10 +191,8 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="visible">{{ 'mxk.apps.visible' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid visible!">
-              nzErrorTip="The input is not valid visible!">
+              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible" id="visible">
-              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible"
-                id="visible">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.visible.hidden' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.visible.all' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.visible.internet' | i18n }}"></nz-option>
@@ -200,38 +202,30 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="sortIndex">{{ 'mxk.text.sortIndex' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sortIndex!">
-              nzErrorTip="The input is not valid sortIndex!">
+              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input name="sortIndex" id="sortIndex" />
-              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input
-                name="sortIndex" id="sortIndex" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendor">{{ 'mxk.apps.vendor' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendor!">
-              nzErrorTip="The input is not valid vendor!">
+              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor" id="vendor" />
-              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor"
-                id="vendor" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendorUrl">{{ 'mxk.apps.vendor.url' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendorUrl!">
-              nzErrorTip="The input is not valid vendorUrl!">
+              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input name="vendorUrl" id="vendorUrl" />
-              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="vendorUrl" id="vendorUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isAdapter">{{ 'mxk.apps.isAdapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isAdapter!">
-              nzErrorTip="The input is not valid isAdapter!">
+              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter" id="isAdapter">
-              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter"
-                id="isAdapter">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.isAdapter.no' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.isAdapter.yes' | i18n }}"></nz-option>
               </nz-select>
@@ -239,32 +233,50 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="adapterName">{{ 'mxk.apps.adapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid adapterName!">
-              nzErrorTip="The input is not valid adapterName!">
               <nz-input-group nzSearch [nzAddOnAfter]="suffixAdapterButton">
-                <input [(ngModel)]="form.model.adapterName" [ngModelOptions]="{ standalone: true }" nz-input
+                <input
-                  name="adapterName" id="adapterName" />
+                  [(ngModel)]="form.model.adapterName"
+                  [ngModelOptions]="{ standalone: true }"
+                  nz-input
+                  name="adapterName"
+                  id="adapterName"
+                />
               </nz-input-group>
               <ng-template #suffixAdapterButton>
-                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' |
+                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' | i18n }}</button>
-                  i18n }}</button>
               </ng-template>
 
-              <input type="hidden" [(ngModel)]="form.model.adapterId" [ngModelOptions]="{ standalone: true }" nz-input
+              <input
-                name="adapterId" id="adapterId" />
+                type="hidden"
-              <input type="hidden" [(ngModel)]="form.model.adapter" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.adapterId"
-                name="adapter" id="adapter" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapterId"
+                id="adapterId"
+              />
+              <input
+                type="hidden"
+                [(ngModel)]="form.model.adapter"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapter"
+                id="adapter"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid description!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid description!">
+                [(ngModel)]="form.model.description"
-              <input [(ngModel)]="form.model.description" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="description" id="description" />
+                nz-input
+                name="description"
+                id="description"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -289,22 +301,24 @@
                 <td>
                   <button nz-button type="button" (click)="startExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.edit' | i18n
-                    }}</button>
+                  }}</button>
-                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' |
+                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-                    i18n }}</button>
                 </td>
               </ng-container>
               <ng-template #editTemplate>
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr"
+                <td
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr" [ngModelOptions]="{ standalone: true }"
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type"
+                /></td>
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                <td
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value"
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type" [ngModelOptions]="{ standalone: true }"
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                /></td>
+                <td
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value" [ngModelOptions]="{ standalone: true }"
+                /></td>
                 <td>
                   <button nz-button type="button" (click)="saveExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.submit' | i18n
-                    }}</button>
+                  }}</button>
                 </td>
               </ng-template>
             </tr>
@@ -318,4 +332,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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-basic-details-editer/app-basic-details-editer.component.ts

@@ -60,9 +60,9 @@ export class AppBasicDetailsEditerComponent implements OnInit {
     submitting: boolean;
     model: Apps;
   } = {
-      submitting: false,
+    submitting: false,
-      model: new Apps()
+    model: new Apps()
-    };
+  };
 
   formGroup: FormGroup = new FormGroup({});
 
@@ -84,7 +84,7 @@ export class AppBasicDetailsEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.isEdit) {

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-cas-details-editer/app-cas-details-editer.component.html

@@ -8,22 +8,24 @@
             <nz-form-item style="width: 100%">
               <nz-form-label [nzMd]="8" nzRequired nzFor="id">{{ 'mxk.text.id' | i18n }}</nz-form-label>
               <nz-form-control [nzMd]="16" nzErrorTip="The input is not valid id!">
-                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id"
+                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id" id="id" />
-                  id="id" />
               </nz-form-control>
             </nz-form-item>
             <nz-form-item style="width: 100%">
-              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }}
+              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }} </nz-form-label>
-              </nz-form-label>
+              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid secret!">
-              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-                nzErrorTip="The input is not valid secret!">
                 <nz-input-group nzSearch [nzAddOnAfter]="suffixPasswordButton">
-                  <input [(ngModel)]="form.model.secret" readonly [ngModelOptions]="{ standalone: true }" nz-input
+                  <input
-                    name="secret" id="secret" />
+                    [(ngModel)]="form.model.secret"
+                    readonly
+                    [ngModelOptions]="{ standalone: true }"
+                    nz-input
+                    name="secret"
+                    id="secret"
+                  />
                 </nz-input-group>
                 <ng-template #suffixPasswordButton>
-                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate'
+                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate' | i18n }}</button>
-                    | i18n }}</button>
                 </ng-template>
               </nz-form-control>
             </nz-form-item>
@@ -32,44 +34,57 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="icon">{{ 'mxk.apps.icon' | i18n }}</nz-form-label>
             <div nz-col class="clearfix" nzSm="16" nzXs="24">
-              <nz-upload nzAction="/file/upload/" nzListType="picture-card" [(nzFileList)]="fileList"
+              <nz-upload
-                nzName="uploadFile" [nzShowButton]="fileList.length < 1" [nzPreview]="handlePreview"
+                nzAction="/file/upload/"
-                (nzChange)="uploadImageChange($event)">
+                nzListType="picture-card"
+                [(nzFileList)]="fileList"
+                nzName="uploadFile"
+                [nzShowButton]="fileList.length < 1"
+                [nzPreview]="handlePreview"
+                (nzChange)="uploadImageChange($event)"
+              >
                 <div>
                   <i nz-icon nzType="plus"></i>
                   <div style="margin-top: 8px">Upload</div>
                 </div>
               </nz-upload>
-              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null"
+              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
-                (nzOnCancel)="previewVisible = false">
                 <ng-template #modalContent>
                   <img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
                 </ng-template>
               </nz-modal>
             </div>
 
-            <nz-form-control style="display: none" [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control
-              nzErrorTip="The input is not valid icon!">
+              style="display: none"
-              <input [(ngModel)]="form.model.iconId" disabled="true" [ngModelOptions]="{ standalone: true }" nz-input
+              [nzSm]="16"
-                name="icon" id="icon" />
+              [nzMd]="16"
+              [nzXs]="36"
+              [nzXl]="48"
+              nzErrorTip="The input is not valid icon!"
+            >
+              <input
+                [(ngModel)]="form.model.iconId"
+                disabled="true"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="icon"
+                id="icon"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid name!">
-              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName"
+              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName" id="appName" />
-                id="appName" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="frequently">{{ 'mxk.apps.frequently' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid frequently!">
-              nzErrorTip="The input is not valid frequently!">
+              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="yes">{{ 'mxk.text.yes' | i18n }}</label>
                 <label nz-radio-button nzValue="no">{{ 'mxk.text.no' | i18n }}</label>
               </nz-radio-group>
@@ -78,20 +93,15 @@
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid protocol!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol" id="protocol" />
-              nzErrorTip="The input is not valid protocol!">
-              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol"
-                id="protocol" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="category">{{ 'mxk.apps.category' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid category!">
-              nzErrorTip="The input is not valid category!">
+              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category" id="category">
-              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category"
-                id="category">
                 <nz-option nzValue="none" nzLabel="{{ 'mxk.apps.category.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1011" nzLabel="{{ 'mxk.apps.category.1011' | i18n }}"></nz-option>
                 <nz-option nzValue="1012" nzLabel="{{ 'mxk.apps.category.1012' | i18n }}"></nz-option>
@@ -126,33 +136,31 @@
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid loginUrl!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl" id="loginUrl" />
-              nzErrorTip="The input is not valid loginUrl!">
-              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl"
-                id="loginUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }}
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="The input is not valid status!">
-              <nz-switch [(ngModel)]="form.model.switch_status" [ngModelOptions]="{ standalone: true }" name="status"
+              <nz-switch
-                [nzCheckedChildren]="statuscheckedTemplate" [nzUnCheckedChildren]="statusunCheckedTemplate"></nz-switch>
+                [(ngModel)]="form.model.switch_status"
+                [ngModelOptions]="{ standalone: true }"
+                name="status"
+                [nzCheckedChildren]="statuscheckedTemplate"
+                [nzUnCheckedChildren]="statusunCheckedTemplate"
+              ></nz-switch>
               <ng-template #statuscheckedTemplate><i nz-icon nzType="check"></i></ng-template>
               <ng-template #statusunCheckedTemplate><i nz-icon nzType="close"></i></ng-template>
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isExtendAttr!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              nzErrorTip="The input is not valid isExtendAttr!">
-              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="0">{{ 'mxk.text.no' | i18n }}</label>
                 <label nz-radio-button nzValue="1">{{ 'mxk.text.yes' | i18n }}</label>
               </nz-radio-group>
@@ -163,34 +171,31 @@
       <nz-tab nzTitle="{{ 'mxk.apps.cas.tab' | i18n }}">
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="service">{{ 'mxk.apps.cas.service' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="service">{{ 'mxk.apps.cas.service' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid service!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.service" [ngModelOptions]="{ standalone: true }" nz-input name="service" id="service" />
-              nzErrorTip="The input is not valid service!">
-              <input [(ngModel)]="form.model.service" [ngModelOptions]="{ standalone: true }" nz-input name="service"
-                id="service" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="callbackUrl">{{ 'mxk.apps.cas.callbackUrl' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="callbackUrl">{{ 'mxk.apps.cas.callbackUrl' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid callbackUrl!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid callbackUrl!">
+                [(ngModel)]="form.model.callbackUrl"
-              <input [(ngModel)]="form.model.callbackUrl" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="callbackUrl" id="callbackUrl" />
+                nz-input
+                name="callbackUrl"
+                id="callbackUrl"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="casUser">{{ 'mxk.apps.cas.casUser' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="casUser">{{ 'mxk.apps.cas.casUser' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid casUser!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select [(ngModel)]="form.model.casUser" [ngModelOptions]="{ standalone: true }" name="category" id="category">
-              nzErrorTip="The input is not valid casUser!">
-              <nz-select [(ngModel)]="form.model.casUser" [ngModelOptions]="{ standalone: true }" name="category"
-                id="category">
                 <nz-option nzValue="username" nzLabel="{{ 'mxk.users.username' | i18n }}"></nz-option>
                 <nz-option nzValue="employeeNumber" nzLabel="{{ 'mxk.users.employeeNumber' | i18n }}"></nz-option>
                 <nz-option nzValue="email" nzLabel="{{ 'mxk.users.email' | i18n }}"></nz-option>
@@ -201,13 +206,10 @@
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="expires">{{ 'mxk.apps.cas.expires' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="expires">{{ 'mxk.apps.cas.expires' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid expires!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-              nzErrorTip="The input is not valid expires!">
               <nz-input-group nzAddOnAfter="{{ 'mxk.text.second' | i18n }}">
-                <input [(ngModel)]="form.model.expires" [ngModelOptions]="{ standalone: true }" nz-input name="expires"
+                <input [(ngModel)]="form.model.expires" [ngModelOptions]="{ standalone: true }" nz-input name="expires" id="expires" />
-                  id="expires" />
               </nz-input-group>
             </nz-form-control>
           </nz-form-item>
@@ -217,18 +219,14 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutUrl">{{ 'mxk.apps.logoutUrl' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutUrl!">
-              nzErrorTip="The input is not valid logoutUrl!">
+              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input name="logoutUrl" id="logoutUrl" />
-              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="logoutUrl" id="logoutUrl" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutType">{{ 'mxk.apps.logoutType' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutType!">
-              nzErrorTip="The input is not valid logoutType!">
+              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType" id="logoutType">
-              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType"
-                id="logoutType">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.logoutType.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.logoutType.back_channel' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.logoutType.front_channel' | i18n }}"></nz-option>
@@ -240,10 +238,8 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="visible">{{ 'mxk.apps.visible' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid visible!">
-              nzErrorTip="The input is not valid visible!">
+              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible" id="visible">
-              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible"
-                id="visible">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.visible.hidden' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.visible.all' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.visible.internet' | i18n }}"></nz-option>
@@ -253,38 +249,30 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="sortIndex">{{ 'mxk.text.sortIndex' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sortIndex!">
-              nzErrorTip="The input is not valid sortIndex!">
+              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input name="sortIndex" id="sortIndex" />
-              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input
-                name="sortIndex" id="sortIndex" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendor">{{ 'mxk.apps.vendor' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendor!">
-              nzErrorTip="The input is not valid vendor!">
+              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor" id="vendor" />
-              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor"
-                id="vendor" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendorUrl">{{ 'mxk.apps.vendor.url' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendorUrl!">
-              nzErrorTip="The input is not valid vendorUrl!">
+              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input name="vendorUrl" id="vendorUrl" />
-              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="vendorUrl" id="vendorUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isAdapter">{{ 'mxk.apps.isAdapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isAdapter!">
-              nzErrorTip="The input is not valid isAdapter!">
+              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter" id="isAdapter">
-              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter"
-                id="isAdapter">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.isAdapter.no' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.isAdapter.yes' | i18n }}"></nz-option>
               </nz-select>
@@ -292,31 +280,49 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="adapterName">{{ 'mxk.apps.adapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid adapterName!">
-              nzErrorTip="The input is not valid adapterName!">
               <nz-input-group nzSearch [nzAddOnAfter]="suffixAdapterButton">
-                <input [(ngModel)]="form.model.adapterName" [ngModelOptions]="{ standalone: true }" nz-input
+                <input
-                  name="adapterName" id="adapterName" />
+                  [(ngModel)]="form.model.adapterName"
+                  [ngModelOptions]="{ standalone: true }"
+                  nz-input
+                  name="adapterName"
+                  id="adapterName"
+                />
               </nz-input-group>
               <ng-template #suffixAdapterButton>
-                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' |
+                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' | i18n }}</button>
-                  i18n }}</button>
               </ng-template>
-              <input type="hidden" [(ngModel)]="form.model.adapterId" [ngModelOptions]="{ standalone: true }" nz-input
+              <input
-                name="adapterId" id="adapterId" />
+                type="hidden"
-              <input type="hidden" [(ngModel)]="form.model.adapter" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.adapterId"
-                name="adapter" id="adapter" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapterId"
+                id="adapterId"
+              />
+              <input
+                type="hidden"
+                [(ngModel)]="form.model.adapter"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapter"
+                id="adapter"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid description!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid description!">
+                [(ngModel)]="form.model.description"
-              <input [(ngModel)]="form.model.description" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="description" id="description" />
+                nz-input
+                name="description"
+                id="description"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -341,22 +347,24 @@
                 <td>
                   <button nz-button type="button" (click)="startExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.edit' | i18n
-                    }}</button>
+                  }}</button>
-                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' |
+                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-                    i18n }}</button>
                 </td>
               </ng-container>
               <ng-template #editTemplate>
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr"
+                <td
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr" [ngModelOptions]="{ standalone: true }"
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type"
+                /></td>
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                <td
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value"
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type" [ngModelOptions]="{ standalone: true }"
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                /></td>
+                <td
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value" [ngModelOptions]="{ standalone: true }"
+                /></td>
                 <td>
                   <button nz-button type="button" (click)="saveExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.submit' | i18n
-                    }}</button>
+                  }}</button>
                 </td>
               </ng-template>
             </tr>
@@ -370,4 +378,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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-cas-details-editer/app-cas-details-editer.component.ts

@@ -60,9 +60,9 @@ export class AppCasDetailsEditerComponent implements OnInit {
     submitting: boolean;
     model: AppsCasDetails;
   } = {
-      submitting: false,
+    submitting: false,
-      model: new AppsCasDetails()
+    model: new AppsCasDetails()
-    };
+  };
 
   formGroup: FormGroup = new FormGroup({});
 
@@ -84,7 +84,7 @@ export class AppCasDetailsEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.isEdit) {

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-extend-api-details-editer/app-extend-api-details-editer.component.html

@@ -8,22 +8,24 @@
             <nz-form-item style="width: 100%">
               <nz-form-label [nzMd]="8" nzRequired nzFor="id">{{ 'mxk.text.id' | i18n }}</nz-form-label>
               <nz-form-control [nzMd]="16" nzErrorTip="The input is not valid id!">
-                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id"
+                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id" id="id" />
-                  id="id" />
               </nz-form-control>
             </nz-form-item>
             <nz-form-item style="width: 100%">
-              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }}
+              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }} </nz-form-label>
-              </nz-form-label>
+              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid secret!">
-              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-                nzErrorTip="The input is not valid secret!">
                 <nz-input-group nzSearch [nzAddOnAfter]="suffixPasswordButton">
-                  <input [(ngModel)]="form.model.secret" readonly [ngModelOptions]="{ standalone: true }" nz-input
+                  <input
-                    name="secret" id="secret" />
+                    [(ngModel)]="form.model.secret"
+                    readonly
+                    [ngModelOptions]="{ standalone: true }"
+                    nz-input
+                    name="secret"
+                    id="secret"
+                  />
                 </nz-input-group>
                 <ng-template #suffixPasswordButton>
-                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate'
+                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate' | i18n }}</button>
-                    | i18n }}</button>
                 </ng-template>
               </nz-form-control>
             </nz-form-item>
@@ -32,44 +34,57 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="icon">{{ 'mxk.apps.icon' | i18n }}</nz-form-label>
             <div nz-col class="clearfix" nzSm="16" nzXs="24">
-              <nz-upload nzAction="/file/upload/" nzListType="picture-card" [(nzFileList)]="fileList"
+              <nz-upload
-                nzName="uploadFile" [nzShowButton]="fileList.length < 1" [nzPreview]="handlePreview"
+                nzAction="/file/upload/"
-                (nzChange)="uploadImageChange($event)">
+                nzListType="picture-card"
+                [(nzFileList)]="fileList"
+                nzName="uploadFile"
+                [nzShowButton]="fileList.length < 1"
+                [nzPreview]="handlePreview"
+                (nzChange)="uploadImageChange($event)"
+              >
                 <div>
                   <i nz-icon nzType="plus"></i>
                   <div style="margin-top: 8px">Upload</div>
                 </div>
               </nz-upload>
-              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null"
+              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
-                (nzOnCancel)="previewVisible = false">
                 <ng-template #modalContent>
                   <img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
                 </ng-template>
               </nz-modal>
             </div>
 
-            <nz-form-control style="display: none" [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control
-              nzErrorTip="The input is not valid icon!">
+              style="display: none"
-              <input [(ngModel)]="form.model.iconId" disabled="true" [ngModelOptions]="{ standalone: true }" nz-input
+              [nzSm]="16"
-                name="icon" id="icon" />
+              [nzMd]="16"
+              [nzXs]="36"
+              [nzXl]="48"
+              nzErrorTip="The input is not valid icon!"
+            >
+              <input
+                [(ngModel)]="form.model.iconId"
+                disabled="true"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="icon"
+                id="icon"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid name!">
-              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName"
+              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName" id="appName" />
-                id="appName" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="frequently">{{ 'mxk.apps.frequently' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid frequently!">
-              nzErrorTip="The input is not valid frequently!">
+              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="yes">{{ 'mxk.text.yes' | i18n }}</label>
                 <label nz-radio-button nzValue="no">{{ 'mxk.text.no' | i18n }}</label>
               </nz-radio-group>
@@ -78,20 +93,15 @@
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid protocol!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol" id="protocol" />
-              nzErrorTip="The input is not valid protocol!">
-              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol"
-                id="protocol" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="category">{{ 'mxk.apps.category' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid category!">
-              nzErrorTip="The input is not valid category!">
+              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category" id="category">
-              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category"
-                id="category">
                 <nz-option nzValue="none" nzLabel="{{ 'mxk.apps.category.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1011" nzLabel="{{ 'mxk.apps.category.1011' | i18n }}"></nz-option>
                 <nz-option nzValue="1012" nzLabel="{{ 'mxk.apps.category.1012' | i18n }}"></nz-option>
@@ -126,33 +136,31 @@
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid loginUrl!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl" id="loginUrl" />
-              nzErrorTip="The input is not valid loginUrl!">
-              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl"
-                id="loginUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }}
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="The input is not valid status!">
-              <nz-switch [(ngModel)]="form.model.switch_status" [ngModelOptions]="{ standalone: true }" name="status"
+              <nz-switch
-                [nzCheckedChildren]="statuscheckedTemplate" [nzUnCheckedChildren]="statusunCheckedTemplate"></nz-switch>
+                [(ngModel)]="form.model.switch_status"
+                [ngModelOptions]="{ standalone: true }"
+                name="status"
+                [nzCheckedChildren]="statuscheckedTemplate"
+                [nzUnCheckedChildren]="statusunCheckedTemplate"
+              ></nz-switch>
               <ng-template #statuscheckedTemplate><i nz-icon nzType="check"></i></ng-template>
               <ng-template #statusunCheckedTemplate><i nz-icon nzType="close"></i></ng-template>
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isExtendAttr!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              nzErrorTip="The input is not valid isExtendAttr!">
-              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="0">{{ 'mxk.text.no' | i18n }}</label>
                 <label nz-radio-button nzValue="1">{{ 'mxk.text.yes' | i18n }}</label>
               </nz-radio-group>
@@ -163,21 +171,21 @@
       <nz-tab nzTitle="{{ 'mxk.apps.extendapi.tab' | i18n }}">
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="principal">{{ 'mxk.apps.principal' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="principal">{{ 'mxk.apps.principal' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid principal!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.principal" [ngModelOptions]="{ standalone: true }" nz-input name="principal" id="principal" />
-              nzErrorTip="The input is not valid principal!">
-              <input [(ngModel)]="form.model.principal" [ngModelOptions]="{ standalone: true }" nz-input
-                name="principal" id="principal" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="credentials">{{ 'mxk.apps.credentials' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="credentials">{{ 'mxk.apps.credentials' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid credentials!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid credentials!">
+                [(ngModel)]="form.model.credentials"
-              <input [(ngModel)]="form.model.credentials" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="credentials" id="credentials" />
+                nz-input
+                name="credentials"
+                id="credentials"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -185,10 +193,8 @@
         <div nz-row>
           <nz-form-item style="width: 100%">
             <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="credential">{{ 'mxk.apps.credential' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid credential!">
-              nzErrorTip="The input is not valid credential!">
+              <nz-radio-group [(ngModel)]="form.model.credential" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              <nz-radio-group [(ngModel)]="form.model.credential" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="user-defined">{{ 'mxk.apps.credential.user-defined' | i18n }}</label>
                 <label nz-radio-button nzValue="shared">{{ 'mxk.apps.credential.shared' | i18n }}</label>
                 <label nz-radio-button nzValue="system">{{ 'mxk.apps.credential.system' | i18n }}</label>
@@ -198,12 +204,14 @@
         </div>
         <div nz-row style="{{ form.model.credential == 'system' ? '' : 'display: none;' }}">
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="systemUserAttr">{{ 'mxk.apps.systemUserAttr' | i18n
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="systemUserAttr">{{ 'mxk.apps.systemUserAttr' | i18n }}</nz-form-label>
-              }}</nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid systemUserAttr!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select
-              nzErrorTip="The input is not valid systemUserAttr!">
+                [(ngModel)]="form.model.systemUserAttr"
-              <nz-select [(ngModel)]="form.model.systemUserAttr" [ngModelOptions]="{ standalone: true }"
+                [ngModelOptions]="{ standalone: true }"
-                name="systemUserAttr" id="systemUserAttr">
+                name="systemUserAttr"
+                id="systemUserAttr"
+              >
                 <nz-option nzValue="username" nzLabel="{{ 'mxk.users.username' | i18n }}"></nz-option>
                 <nz-option nzValue="employeeNumber" nzLabel="{{ 'mxk.users.employeeNumber' | i18n }}"></nz-option>
                 <nz-option nzValue="email" nzLabel="{{ 'mxk.users.email' | i18n }}"></nz-option>
@@ -218,21 +226,29 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="sharedUsername">{{
               'mxk.apps.credential.sharedUsername' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sharedUsername!">
-              nzErrorTip="The input is not valid sharedUsername!">
+              <input
-              <input [(ngModel)]="form.model.sharedUsername" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.sharedUsername"
-                name="sharedUsername" id="sharedUsername" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="sharedUsername"
+                id="sharedUsername"
+              />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="sharedPassword">{{
               'mxk.apps.credential.sharedPassword' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sharedPassword!">
-              nzErrorTip="The input is not valid sharedPassword!">
+              <input
-              <input [(ngModel)]="form.model.sharedPassword" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.sharedPassword"
-                name="sharedPassword" id="sharedPassword" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="sharedPassword"
+                id="sharedPassword"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -241,18 +257,14 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutUrl">{{ 'mxk.apps.logoutUrl' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutUrl!">
-              nzErrorTip="The input is not valid logoutUrl!">
+              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input name="logoutUrl" id="logoutUrl" />
-              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="logoutUrl" id="logoutUrl" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutType">{{ 'mxk.apps.logoutType' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutType!">
-              nzErrorTip="The input is not valid logoutType!">
+              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType" id="logoutType">
-              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType"
-                id="logoutType">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.logoutType.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.logoutType.back_channel' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.logoutType.front_channel' | i18n }}"></nz-option>
@@ -264,10 +276,8 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="visible">{{ 'mxk.apps.visible' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid visible!">
-              nzErrorTip="The input is not valid visible!">
+              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible" id="visible">
-              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible"
-                id="visible">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.visible.hidden' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.visible.all' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.visible.internet' | i18n }}"></nz-option>
@@ -277,38 +287,30 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="sortIndex">{{ 'mxk.text.sortIndex' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sortIndex!">
-              nzErrorTip="The input is not valid sortIndex!">
+              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input name="sortIndex" id="sortIndex" />
-              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input
-                name="sortIndex" id="sortIndex" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendor">{{ 'mxk.apps.vendor' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendor!">
-              nzErrorTip="The input is not valid vendor!">
+              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor" id="vendor" />
-              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor"
-                id="vendor" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendorUrl">{{ 'mxk.apps.vendor.url' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendorUrl!">
-              nzErrorTip="The input is not valid vendorUrl!">
+              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input name="vendorUrl" id="vendorUrl" />
-              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="vendorUrl" id="vendorUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isAdapter">{{ 'mxk.apps.isAdapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isAdapter!">
-              nzErrorTip="The input is not valid isAdapter!">
+              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter" id="isAdapter">
-              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter"
-                id="isAdapter">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.isAdapter.no' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.isAdapter.yes' | i18n }}"></nz-option>
               </nz-select>
@@ -316,31 +318,49 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="adapterName">{{ 'mxk.apps.adapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid adapterName!">
-              nzErrorTip="The input is not valid adapterName!">
               <nz-input-group nzSearch [nzAddOnAfter]="suffixAdapterButton">
-                <input [(ngModel)]="form.model.adapterName" [ngModelOptions]="{ standalone: true }" nz-input
+                <input
-                  name="adapterName" id="adapterName" />
+                  [(ngModel)]="form.model.adapterName"
+                  [ngModelOptions]="{ standalone: true }"
+                  nz-input
+                  name="adapterName"
+                  id="adapterName"
+                />
               </nz-input-group>
               <ng-template #suffixAdapterButton>
-                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' |
+                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' | i18n }}</button>
-                  i18n }}</button>
               </ng-template>
-              <input type="hidden" [(ngModel)]="form.model.adapterId" [ngModelOptions]="{ standalone: true }" nz-input
+              <input
-                name="adapterId" id="adapterId" />
+                type="hidden"
-              <input type="hidden" [(ngModel)]="form.model.adapter" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.adapterId"
-                name="adapter" id="adapter" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapterId"
+                id="adapterId"
+              />
+              <input
+                type="hidden"
+                [(ngModel)]="form.model.adapter"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapter"
+                id="adapter"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid description!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid description!">
+                [(ngModel)]="form.model.description"
-              <input [(ngModel)]="form.model.description" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="description" id="description" />
+                nz-input
+                name="description"
+                id="description"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -365,22 +385,24 @@
                 <td>
                   <button nz-button type="button" (click)="startExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.edit' | i18n
-                    }}</button>
+                  }}</button>
-                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' |
+                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-                    i18n }}</button>
                 </td>
               </ng-container>
               <ng-template #editTemplate>
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr"
+                <td
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr" [ngModelOptions]="{ standalone: true }"
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type"
+                /></td>
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                <td
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value"
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type" [ngModelOptions]="{ standalone: true }"
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                /></td>
+                <td
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value" [ngModelOptions]="{ standalone: true }"
+                /></td>
                 <td>
                   <button nz-button type="button" (click)="saveExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.submit' | i18n
-                    }}</button>
+                  }}</button>
                 </td>
               </ng-template>
             </tr>
@@ -394,4 +416,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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-form-based-details-editer/app-form-based-details-editer.component.html

@@ -8,22 +8,24 @@
             <nz-form-item style="width: 100%">
               <nz-form-label [nzMd]="8" nzRequired nzFor="id">{{ 'mxk.text.id' | i18n }}</nz-form-label>
               <nz-form-control [nzMd]="16" nzErrorTip="The input is not valid id!">
-                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id"
+                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id" id="id" />
-                  id="id" />
               </nz-form-control>
             </nz-form-item>
             <nz-form-item style="width: 100%">
-              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }}
+              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }} </nz-form-label>
-              </nz-form-label>
+              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid secret!">
-              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-                nzErrorTip="The input is not valid secret!">
                 <nz-input-group nzSearch [nzAddOnAfter]="suffixPasswordButton">
-                  <input [(ngModel)]="form.model.secret" readonly [ngModelOptions]="{ standalone: true }" nz-input
+                  <input
-                    name="secret" id="secret" />
+                    [(ngModel)]="form.model.secret"
+                    readonly
+                    [ngModelOptions]="{ standalone: true }"
+                    nz-input
+                    name="secret"
+                    id="secret"
+                  />
                 </nz-input-group>
                 <ng-template #suffixPasswordButton>
-                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate'
+                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate' | i18n }}</button>
-                    | i18n }}</button>
                 </ng-template>
               </nz-form-control>
             </nz-form-item>
@@ -32,44 +34,57 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="icon">{{ 'mxk.apps.icon' | i18n }}</nz-form-label>
             <div nz-col class="clearfix" nzSm="16" nzXs="24">
-              <nz-upload nzAction="/file/upload/" nzListType="picture-card" [(nzFileList)]="fileList"
+              <nz-upload
-                nzName="uploadFile" [nzShowButton]="fileList.length < 1" [nzPreview]="handlePreview"
+                nzAction="/file/upload/"
-                (nzChange)="uploadImageChange($event)">
+                nzListType="picture-card"
+                [(nzFileList)]="fileList"
+                nzName="uploadFile"
+                [nzShowButton]="fileList.length < 1"
+                [nzPreview]="handlePreview"
+                (nzChange)="uploadImageChange($event)"
+              >
                 <div>
                   <i nz-icon nzType="plus"></i>
                   <div style="margin-top: 8px">Upload</div>
                 </div>
               </nz-upload>
-              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null"
+              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
-                (nzOnCancel)="previewVisible = false">
                 <ng-template #modalContent>
                   <img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
                 </ng-template>
               </nz-modal>
             </div>
 
-            <nz-form-control style="display: none" [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control
-              nzErrorTip="The input is not valid icon!">
+              style="display: none"
-              <input [(ngModel)]="form.model.iconId" disabled="true" [ngModelOptions]="{ standalone: true }" nz-input
+              [nzSm]="16"
-                name="icon" id="icon" />
+              [nzMd]="16"
+              [nzXs]="36"
+              [nzXl]="48"
+              nzErrorTip="The input is not valid icon!"
+            >
+              <input
+                [(ngModel)]="form.model.iconId"
+                disabled="true"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="icon"
+                id="icon"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid name!">
-              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName"
+              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName" id="appName" />
-                id="appName" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="frequently">{{ 'mxk.apps.frequently' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid frequently!">
-              nzErrorTip="The input is not valid frequently!">
+              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="yes">{{ 'mxk.text.yes' | i18n }}</label>
                 <label nz-radio-button nzValue="no">{{ 'mxk.text.no' | i18n }}</label>
               </nz-radio-group>
@@ -78,20 +93,15 @@
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid protocol!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol" id="protocol" />
-              nzErrorTip="The input is not valid protocol!">
-              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol"
-                id="protocol" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="category">{{ 'mxk.apps.category' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid category!">
-              nzErrorTip="The input is not valid category!">
+              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category" id="category">
-              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category"
-                id="category">
                 <nz-option nzValue="none" nzLabel="{{ 'mxk.apps.category.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1011" nzLabel="{{ 'mxk.apps.category.1011' | i18n }}"></nz-option>
                 <nz-option nzValue="1012" nzLabel="{{ 'mxk.apps.category.1012' | i18n }}"></nz-option>
@@ -126,33 +136,31 @@
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid loginUrl!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl" id="loginUrl" />
-              nzErrorTip="The input is not valid loginUrl!">
-              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl"
-                id="loginUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }}
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="The input is not valid status!">
-              <nz-switch [(ngModel)]="form.model.switch_status" [ngModelOptions]="{ standalone: true }" name="status"
+              <nz-switch
-                [nzCheckedChildren]="statuscheckedTemplate" [nzUnCheckedChildren]="statusunCheckedTemplate"></nz-switch>
+                [(ngModel)]="form.model.switch_status"
+                [ngModelOptions]="{ standalone: true }"
+                name="status"
+                [nzCheckedChildren]="statuscheckedTemplate"
+                [nzUnCheckedChildren]="statusunCheckedTemplate"
+              ></nz-switch>
               <ng-template #statuscheckedTemplate><i nz-icon nzType="check"></i></ng-template>
               <ng-template #statusunCheckedTemplate><i nz-icon nzType="close"></i></ng-template>
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isExtendAttr!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              nzErrorTip="The input is not valid isExtendAttr!">
-              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="0">{{ 'mxk.text.no' | i18n }}</label>
                 <label nz-radio-button nzValue="1">{{ 'mxk.text.yes' | i18n }}</label>
               </nz-radio-group>
@@ -165,11 +173,15 @@
           <nz-form-item style="width: 100%">
             <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="redirectUri">{{
               'mxk.apps.formbased.redirectUri' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid redirectUri!">
-              nzErrorTip="The input is not valid redirectUri!">
+              <input
-              <input [(ngModel)]="form.model.redirectUri" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.redirectUri"
-                name="redirectUri" id="redirectUri" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="redirectUri"
+                id="redirectUri"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -177,42 +189,56 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="usernameMapping">{{
               'mxk.apps.formbased.usernameMapping' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid usernameMapping!">
-              nzErrorTip="The input is not valid usernameMapping!">
+              <input
-              <input [(ngModel)]="form.model.usernameMapping" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.usernameMapping"
-                name="usernameMapping" id="usernameMapping" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="usernameMapping"
+                id="usernameMapping"
+              />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="passwordMapping">{{
               'mxk.apps.formbased.passwordMapping' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid passwordMapping!">
-              nzErrorTip="The input is not valid passwordMapping!">
+              <input
-              <input [(ngModel)]="form.model.passwordMapping" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.passwordMapping"
-                name="passwordMapping" id="passwordMapping" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="passwordMapping"
+                id="passwordMapping"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="authorizeView">{{ 'mxk.apps.formbased.authorizeView' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="authorizeView">{{ 'mxk.apps.formbased.authorizeView' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid authorizeView!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid authorizeView!">
+                [(ngModel)]="form.model.authorizeView"
-              <input [(ngModel)]="form.model.authorizeView" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="authorizeView" id="authorizeView" />
+                nz-input
+                name="authorizeView"
+                id="authorizeView"
+              />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="passwordAlgorithm">{{
               'mxk.apps.formbased.passwordAlgorithm' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid passwordAlgorithm!">
-              nzErrorTip="The input is not valid passwordAlgorithm!">
+              <nz-select
-              <nz-select [(ngModel)]="form.model.passwordAlgorithm" [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="form.model.passwordAlgorithm"
-                name="passwordAlgorithm" id="passwordAlgorithm">
+                [ngModelOptions]="{ standalone: true }"
+                name="passwordAlgorithm"
+                id="passwordAlgorithm"
+              >
                 <nz-option nzValue="NONE" nzLabel="NONE"></nz-option>
                 <nz-option nzValue="MD5" nzLabel="MD5"></nz-option>
                 <nz-option nzValue="SHA" nzLabel="SHA"></nz-option>
@@ -234,10 +260,8 @@
         <div nz-row>
           <nz-form-item style="width: 100%">
             <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="credential">{{ 'mxk.apps.credential' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid credential!">
-              nzErrorTip="The input is not valid credential!">
+              <nz-radio-group [(ngModel)]="form.model.credential" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              <nz-radio-group [(ngModel)]="form.model.credential" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="user-defined">{{ 'mxk.apps.credential.user-defined' | i18n }}</label>
                 <label nz-radio-button nzValue="shared">{{ 'mxk.apps.credential.shared' | i18n }}</label>
                 <label nz-radio-button nzValue="system">{{ 'mxk.apps.credential.system' | i18n }}</label>
@@ -247,12 +271,14 @@
         </div>
         <div nz-row style="{{ form.model.credential == 'system' ? '' : 'display: none;' }}">
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="systemUserAttr">{{ 'mxk.apps.systemUserAttr' | i18n
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="systemUserAttr">{{ 'mxk.apps.systemUserAttr' | i18n }}</nz-form-label>
-              }}</nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid systemUserAttr!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select
-              nzErrorTip="The input is not valid systemUserAttr!">
+                [(ngModel)]="form.model.systemUserAttr"
-              <nz-select [(ngModel)]="form.model.systemUserAttr" [ngModelOptions]="{ standalone: true }"
+                [ngModelOptions]="{ standalone: true }"
-                name="systemUserAttr" id="systemUserAttr">
+                name="systemUserAttr"
+                id="systemUserAttr"
+              >
                 <nz-option nzValue="username" nzLabel="{{ 'mxk.users.username' | i18n }}"></nz-option>
                 <nz-option nzValue="employeeNumber" nzLabel="{{ 'mxk.users.employeeNumber' | i18n }}"></nz-option>
                 <nz-option nzValue="email" nzLabel="{{ 'mxk.users.email' | i18n }}"></nz-option>
@@ -267,21 +293,29 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="sharedUsername">{{
               'mxk.apps.credential.sharedUsername' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sharedUsername!">
-              nzErrorTip="The input is not valid sharedUsername!">
+              <input
-              <input [(ngModel)]="form.model.sharedUsername" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.sharedUsername"
-                name="sharedUsername" id="sharedUsername" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="sharedUsername"
+                id="sharedUsername"
+              />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="sharedPassword">{{
               'mxk.apps.credential.sharedPassword' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sharedPassword!">
-              nzErrorTip="The input is not valid sharedPassword!">
+              <input
-              <input [(ngModel)]="form.model.sharedPassword" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.sharedPassword"
-                name="sharedPassword" id="sharedPassword" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="sharedPassword"
+                id="sharedPassword"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -290,18 +324,14 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutUrl">{{ 'mxk.apps.logoutUrl' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutUrl!">
-              nzErrorTip="The input is not valid logoutUrl!">
+              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input name="logoutUrl" id="logoutUrl" />
-              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="logoutUrl" id="logoutUrl" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutType">{{ 'mxk.apps.logoutType' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutType!">
-              nzErrorTip="The input is not valid logoutType!">
+              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType" id="logoutType">
-              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType"
-                id="logoutType">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.logoutType.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.logoutType.back_channel' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.logoutType.front_channel' | i18n }}"></nz-option>
@@ -313,10 +343,8 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="visible">{{ 'mxk.apps.visible' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid visible!">
-              nzErrorTip="The input is not valid visible!">
+              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible" id="visible">
-              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible"
-                id="visible">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.visible.hidden' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.visible.all' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.visible.internet' | i18n }}"></nz-option>
@@ -326,38 +354,30 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="sortIndex">{{ 'mxk.text.sortIndex' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sortIndex!">
-              nzErrorTip="The input is not valid sortIndex!">
+              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input name="sortIndex" id="sortIndex" />
-              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input
-                name="sortIndex" id="sortIndex" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendor">{{ 'mxk.apps.vendor' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendor!">
-              nzErrorTip="The input is not valid vendor!">
+              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor" id="vendor" />
-              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor"
-                id="vendor" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendorUrl">{{ 'mxk.apps.vendor.url' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendorUrl!">
-              nzErrorTip="The input is not valid vendorUrl!">
+              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input name="vendorUrl" id="vendorUrl" />
-              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="vendorUrl" id="vendorUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isAdapter">{{ 'mxk.apps.isAdapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isAdapter!">
-              nzErrorTip="The input is not valid isAdapter!">
+              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter" id="isAdapter">
-              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter"
-                id="isAdapter">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.isAdapter.no' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.isAdapter.yes' | i18n }}"></nz-option>
               </nz-select>
@@ -365,31 +385,49 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="adapterName">{{ 'mxk.apps.adapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid adapterName!">
-              nzErrorTip="The input is not valid adapterName!">
               <nz-input-group nzSearch [nzAddOnAfter]="suffixAdapterButton">
-                <input [(ngModel)]="form.model.adapterName" [ngModelOptions]="{ standalone: true }" nz-input
+                <input
-                  name="adapterName" id="adapterName" />
+                  [(ngModel)]="form.model.adapterName"
+                  [ngModelOptions]="{ standalone: true }"
+                  nz-input
+                  name="adapterName"
+                  id="adapterName"
+                />
               </nz-input-group>
               <ng-template #suffixAdapterButton>
-                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' |
+                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' | i18n }}</button>
-                  i18n }}</button>
               </ng-template>
-              <input type="hidden" [(ngModel)]="form.model.adapterId" [ngModelOptions]="{ standalone: true }" nz-input
+              <input
-                name="adapterId" id="adapterId" />
+                type="hidden"
-              <input type="hidden" [(ngModel)]="form.model.adapter" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.adapterId"
-                name="adapter" id="adapter" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapterId"
+                id="adapterId"
+              />
+              <input
+                type="hidden"
+                [(ngModel)]="form.model.adapter"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapter"
+                id="adapter"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid description!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid description!">
+                [(ngModel)]="form.model.description"
-              <input [(ngModel)]="form.model.description" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="description" id="description" />
+                nz-input
+                name="description"
+                id="description"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -414,22 +452,24 @@
                 <td>
                   <button nz-button type="button" (click)="startExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.edit' | i18n
-                    }}</button>
+                  }}</button>
-                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' |
+                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-                    i18n }}</button>
                 </td>
               </ng-container>
               <ng-template #editTemplate>
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr"
+                <td
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr" [ngModelOptions]="{ standalone: true }"
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type"
+                /></td>
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                <td
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value"
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type" [ngModelOptions]="{ standalone: true }"
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                /></td>
+                <td
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value" [ngModelOptions]="{ standalone: true }"
+                /></td>
                 <td>
                   <button nz-button type="button" (click)="saveExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.submit' | i18n
-                    }}</button>
+                  }}</button>
                 </td>
               </ng-template>
             </tr>
@@ -443,4 +483,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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-form-based-details-editer/app-form-based-details-editer.component.ts

@@ -60,9 +60,9 @@ export class AppFormBasedDetailsEditerComponent implements OnInit {
     submitting: boolean;
     model: AppsFormBasedDetails;
   } = {
-      submitting: false,
+    submitting: false,
-      model: new AppsFormBasedDetails()
+    model: new AppsFormBasedDetails()
-    };
+  };
 
   formGroup: FormGroup = new FormGroup({});
 
@@ -85,7 +85,7 @@ export class AppFormBasedDetailsEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.isEdit) {

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-jwt-details-editer/app-jwt-details-editer.component.html

@@ -8,22 +8,24 @@
             <nz-form-item style="width: 100%">
               <nz-form-label [nzMd]="8" nzRequired nzFor="id">{{ 'mxk.text.id' | i18n }}</nz-form-label>
               <nz-form-control [nzMd]="16" nzErrorTip="The input is not valid id!">
-                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id"
+                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id" id="id" />
-                  id="id" />
               </nz-form-control>
             </nz-form-item>
             <nz-form-item style="width: 100%">
-              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }}
+              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }} </nz-form-label>
-              </nz-form-label>
+              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid secret!">
-              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-                nzErrorTip="The input is not valid secret!">
                 <nz-input-group nzSearch [nzAddOnAfter]="suffixPasswordButton">
-                  <input [(ngModel)]="form.model.secret" readonly [ngModelOptions]="{ standalone: true }" nz-input
+                  <input
-                    name="secret" id="secret" />
+                    [(ngModel)]="form.model.secret"
+                    readonly
+                    [ngModelOptions]="{ standalone: true }"
+                    nz-input
+                    name="secret"
+                    id="secret"
+                  />
                 </nz-input-group>
                 <ng-template #suffixPasswordButton>
-                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate'
+                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate' | i18n }}</button>
-                    | i18n }}</button>
                 </ng-template>
               </nz-form-control>
             </nz-form-item>
@@ -32,44 +34,57 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="icon">{{ 'mxk.apps.icon' | i18n }}</nz-form-label>
             <div nz-col class="clearfix" nzSm="16" nzXs="24">
-              <nz-upload nzAction="/file/upload/" nzListType="picture-card" [(nzFileList)]="fileList"
+              <nz-upload
-                nzName="uploadFile" [nzShowButton]="fileList.length < 1" [nzPreview]="handlePreview"
+                nzAction="/file/upload/"
-                (nzChange)="uploadImageChange($event)">
+                nzListType="picture-card"
+                [(nzFileList)]="fileList"
+                nzName="uploadFile"
+                [nzShowButton]="fileList.length < 1"
+                [nzPreview]="handlePreview"
+                (nzChange)="uploadImageChange($event)"
+              >
                 <div>
                   <i nz-icon nzType="plus"></i>
                   <div style="margin-top: 8px">Upload</div>
                 </div>
               </nz-upload>
-              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null"
+              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
-                (nzOnCancel)="previewVisible = false">
                 <ng-template #modalContent>
                   <img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
                 </ng-template>
               </nz-modal>
             </div>
 
-            <nz-form-control style="display: none" [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control
-              nzErrorTip="The input is not valid icon!">
+              style="display: none"
-              <input [(ngModel)]="form.model.iconId" disabled="true" [ngModelOptions]="{ standalone: true }" nz-input
+              [nzSm]="16"
-                name="icon" id="icon" />
+              [nzMd]="16"
+              [nzXs]="36"
+              [nzXl]="48"
+              nzErrorTip="The input is not valid icon!"
+            >
+              <input
+                [(ngModel)]="form.model.iconId"
+                disabled="true"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="icon"
+                id="icon"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid name!">
-              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName"
+              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName" id="appName" />
-                id="appName" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="frequently">{{ 'mxk.apps.frequently' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid frequently!">
-              nzErrorTip="The input is not valid frequently!">
+              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="yes">{{ 'mxk.text.yes' | i18n }}</label>
                 <label nz-radio-button nzValue="no">{{ 'mxk.text.no' | i18n }}</label>
               </nz-radio-group>
@@ -78,20 +93,15 @@
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid protocol!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol" id="protocol" />
-              nzErrorTip="The input is not valid protocol!">
-              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol"
-                id="protocol" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="category">{{ 'mxk.apps.category' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid category!">
-              nzErrorTip="The input is not valid category!">
+              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category" id="category">
-              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category"
-                id="category">
                 <nz-option nzValue="none" nzLabel="{{ 'mxk.apps.category.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1011" nzLabel="{{ 'mxk.apps.category.1011' | i18n }}"></nz-option>
                 <nz-option nzValue="1012" nzLabel="{{ 'mxk.apps.category.1012' | i18n }}"></nz-option>
@@ -126,33 +136,31 @@
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid loginUrl!">
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl" id="loginUrl" />
-              nzErrorTip="The input is not valid loginUrl!">
-              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl"
-                id="loginUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }}
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="The input is not valid status!">
-              <nz-switch [(ngModel)]="form.model.switch_status" [ngModelOptions]="{ standalone: true }" name="status"
+              <nz-switch
-                [nzCheckedChildren]="statuscheckedTemplate" [nzUnCheckedChildren]="statusunCheckedTemplate"></nz-switch>
+                [(ngModel)]="form.model.switch_status"
+                [ngModelOptions]="{ standalone: true }"
+                name="status"
+                [nzCheckedChildren]="statuscheckedTemplate"
+                [nzUnCheckedChildren]="statusunCheckedTemplate"
+              ></nz-switch>
               <ng-template #statuscheckedTemplate><i nz-icon nzType="check"></i></ng-template>
               <ng-template #statusunCheckedTemplate><i nz-icon nzType="close"></i></ng-template>
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isExtendAttr!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              nzErrorTip="The input is not valid isExtendAttr!">
-              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="0">{{ 'mxk.text.no' | i18n }}</label>
                 <label nz-radio-button nzValue="1">{{ 'mxk.text.yes' | i18n }}</label>
               </nz-radio-group>
@@ -163,23 +171,23 @@
       <nz-tab nzTitle="{{ 'mxk.apps.jwt.tab' | i18n }}">
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="redirectUri">{{ 'mxk.apps.jwt.redirectUri' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="redirectUri">{{ 'mxk.apps.jwt.redirectUri' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid redirectUri!">
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid redirectUri!">
+                [(ngModel)]="form.model.redirectUri"
-              <input [(ngModel)]="form.model.redirectUri" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="redirectUri" id="redirectUri" />
+                nz-input
+                name="redirectUri"
+                id="redirectUri"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="subject">{{ 'mxk.apps.jwt.subject' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="subject">{{ 'mxk.apps.jwt.subject' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid subject!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select [(ngModel)]="form.model.subject" [ngModelOptions]="{ standalone: true }" name="subject" id="subject">
-              nzErrorTip="The input is not valid subject!">
-              <nz-select [(ngModel)]="form.model.subject" [ngModelOptions]="{ standalone: true }" name="subject"
-                id="subject">
                 <nz-option nzValue="username" nzLabel="{{ 'mxk.users.username' | i18n }}"></nz-option>
                 <nz-option nzValue="employeeNumber" nzLabel="{{ 'mxk.users.employeeNumber' | i18n }}"></nz-option>
                 <nz-option nzValue="email" nzLabel="{{ 'mxk.users.email' | i18n }}"></nz-option>
@@ -190,12 +198,9 @@
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="tokenType">{{ 'mxk.apps.jwt.tokenType' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="tokenType">{{ 'mxk.apps.jwt.tokenType' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid tokenType!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select [(ngModel)]="form.model.tokenType" [ngModelOptions]="{ standalone: true }" name="tokenType" id="tokenType">
-              nzErrorTip="The input is not valid tokenType!">
-              <nz-select [(ngModel)]="form.model.tokenType" [ngModelOptions]="{ standalone: true }" name="tokenType"
-                id="tokenType">
                 <nz-option nzValue="GET" nzLabel="GET"></nz-option>
                 <nz-option nzValue="POST" nzLabel="POST"></nz-option>
                 <nz-option nzValue="LTPA" nzLabel="LTPA"></nz-option>
@@ -205,22 +210,16 @@
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="jwtName">{{ 'mxk.apps.jwt.jwtName' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="jwtName">{{ 'mxk.apps.jwt.jwtName' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid jwtName!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.jwtName" [ngModelOptions]="{ standalone: true }" nz-input name="jwtName" id="jwtName" />
-              nzErrorTip="The input is not valid jwtName!">
-              <input [(ngModel)]="form.model.jwtName" [ngModelOptions]="{ standalone: true }" nz-input name="jwtName"
-                id="jwtName" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="expires">{{ 'mxk.apps.jwt.expires' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="expires">{{ 'mxk.apps.jwt.expires' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid expires!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-              nzErrorTip="The input is not valid expires!">
               <nz-input-group nzAddOnAfter="{{ 'mxk.text.second' | i18n }}">
-                <input [(ngModel)]="form.model.expires" [ngModelOptions]="{ standalone: true }" nz-input name="expires"
+                <input [(ngModel)]="form.model.expires" [ngModelOptions]="{ standalone: true }" nz-input name="expires" id="expires" />
-                  id="expires" />
               </nz-input-group>
             </nz-form-control>
           </nz-form-item>
@@ -228,29 +227,28 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="issuer">{{ 'mxk.apps.jwt.issuer' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid issuer!">
-              nzErrorTip="The input is not valid issuer!">
+              <input [(ngModel)]="form.model.issuer" [ngModelOptions]="{ standalone: true }" nz-input name="issuer" id="issuer" />
-              <input [(ngModel)]="form.model.issuer" [ngModelOptions]="{ standalone: true }" nz-input name="issuer"
-                id="issuer" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="audience">{{ 'mxk.apps.jwt.audience' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid audience!">
-              nzErrorTip="The input is not valid audience!">
+              <input [(ngModel)]="form.model.audience" [ngModelOptions]="{ standalone: true }" nz-input name="audience" id="audience" />
-              <input [(ngModel)]="form.model.audience" [ngModelOptions]="{ standalone: true }" nz-input name="audience"
-                id="audience" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="signature">{{ 'mxk.apps.jwt.signature' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="signature">{{ 'mxk.apps.jwt.signature' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid signature!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select
-              nzErrorTip="The input is not valid signature!">
+                (ngModelChange)="onSelectSignature($event)"
-              <nz-select (ngModelChange)="onSelectSignature($event)" [(ngModel)]="form.model.signature"
+                [(ngModel)]="form.model.signature"
-                [ngModelOptions]="{ standalone: true }" name="signature" id="signature">
+                [ngModelOptions]="{ standalone: true }"
+                name="signature"
+                id="signature"
+              >
                 <nz-option nzValue="NONE" nzLabel="NONE"></nz-option>
                 <nz-option nzValue="RS256" nzLabel="RS256"></nz-option>
                 <nz-option nzValue="RS384" nzLabel="RS384"></nz-option>
@@ -267,22 +265,29 @@
           <nz-form-item style="width: 100%">
             <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="signatureKey">{{
               'mxk.apps.oauth.connect.signatureKey' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid signatureKey!">
-              nzErrorTip="The input is not valid signatureKey!">
+              <textarea
-              <textarea [(ngModel)]="form.model.signatureKey" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.signatureKey"
-                name="signatureKey" id="signatureKey"></textarea>
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="signatureKey"
+                id="signatureKey"
+              ></textarea>
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="algorithm">{{ 'mxk.apps.oauth.connect.algorithm' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="algorithm">{{ 'mxk.apps.oauth.connect.algorithm' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid algorithm!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select
-              nzErrorTip="The input is not valid algorithm!">
+                (ngModelChange)="onSelectAlgorithm($event)"
-              <nz-select (ngModelChange)="onSelectAlgorithm($event)" [(ngModel)]="form.model.algorithm"
+                [(ngModel)]="form.model.algorithm"
-                [ngModelOptions]="{ standalone: true }" name="algorithm" id="algorithm">
+                [ngModelOptions]="{ standalone: true }"
+                name="algorithm"
+                id="algorithm"
+              >
                 <nz-option nzValue="NONE" nzLabel="NONE"></nz-option>
                 <nz-option nzValue="RSA1_5" nzLabel="RSA1_5"></nz-option>
                 <nz-option nzValue="RSA_OAEP" nzLabel="RSA_OAEP"></nz-option>
@@ -299,11 +304,14 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="encryptionMethod">{{
               'mxk.apps.oauth.connect.encryptionMethod' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid encryptionMethod!">
-              nzErrorTip="The input is not valid encryptionMethod!">
+              <nz-select
-              <nz-select [(ngModel)]="form.model.encryptionMethod" [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="form.model.encryptionMethod"
-                name="encryptionMethod" id="encryptionMethod">
+                [ngModelOptions]="{ standalone: true }"
+                name="encryptionMethod"
+                id="encryptionMethod"
+              >
                 <nz-option nzValue="A128GCM" nzLabel="A128GCM"></nz-option>
                 <nz-option nzValue="A192GCM" nzLabel="A192GCM"></nz-option>
                 <nz-option nzValue="A256GCM" nzLabel="A256GCM"></nz-option>
@@ -317,12 +325,15 @@
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="algorithmKey">{{ 'mxk.apps.oauth.connect.algorithmKey' | i18n
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="algorithmKey">{{ 'mxk.apps.oauth.connect.algorithmKey' | i18n }}</nz-form-label>
-              }}</nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid algorithmKey!">
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+              <textarea
-              nzErrorTip="The input is not valid algorithmKey!">
+                [(ngModel)]="form.model.algorithmKey"
-              <textarea [(ngModel)]="form.model.algorithmKey" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="algorithmKey" id="algorithmKey"></textarea>
+                nz-input
+                name="algorithmKey"
+                id="algorithmKey"
+              ></textarea>
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -331,18 +342,14 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutUrl">{{ 'mxk.apps.logoutUrl' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutUrl!">
-              nzErrorTip="The input is not valid logoutUrl!">
+              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input name="logoutUrl" id="logoutUrl" />
-              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="logoutUrl" id="logoutUrl" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutType">{{ 'mxk.apps.logoutType' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutType!">
-              nzErrorTip="The input is not valid logoutType!">
+              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType" id="logoutType">
-              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType"
-                id="logoutType">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.logoutType.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.logoutType.back_channel' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.logoutType.front_channel' | i18n }}"></nz-option>
@@ -354,10 +361,8 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="visible">{{ 'mxk.apps.visible' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid visible!">
-              nzErrorTip="The input is not valid visible!">
+              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible" id="visible">
-              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible"
-                id="visible">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.visible.hidden' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.visible.all' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.visible.internet' | i18n }}"></nz-option>
@@ -367,38 +372,30 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="sortIndex">{{ 'mxk.text.sortIndex' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sortIndex!">
-              nzErrorTip="The input is not valid sortIndex!">
+              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input name="sortIndex" id="sortIndex" />
-              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input
-                name="sortIndex" id="sortIndex" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendor">{{ 'mxk.apps.vendor' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendor!">
-              nzErrorTip="The input is not valid vendor!">
+              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor" id="vendor" />
-              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor"
-                id="vendor" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendorUrl">{{ 'mxk.apps.vendor.url' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendorUrl!">
-              nzErrorTip="The input is not valid vendorUrl!">
+              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input name="vendorUrl" id="vendorUrl" />
-              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="vendorUrl" id="vendorUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isAdapter">{{ 'mxk.apps.isAdapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isAdapter!">
-              nzErrorTip="The input is not valid isAdapter!">
+              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter" id="isAdapter">
-              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter"
-                id="isAdapter">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.isAdapter.no' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.isAdapter.yes' | i18n }}"></nz-option>
               </nz-select>
@@ -406,31 +403,49 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="adapterName">{{ 'mxk.apps.adapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid adapterName!">
-              nzErrorTip="The input is not valid adapterName!">
               <nz-input-group nzSearch [nzAddOnAfter]="suffixAdapterButton">
-                <input [(ngModel)]="form.model.adapterName" [ngModelOptions]="{ standalone: true }" nz-input
+                <input
-                  name="adapterName" id="adapterName" />
+                  [(ngModel)]="form.model.adapterName"
+                  [ngModelOptions]="{ standalone: true }"
+                  nz-input
+                  name="adapterName"
+                  id="adapterName"
+                />
               </nz-input-group>
               <ng-template #suffixAdapterButton>
-                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' |
+                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' | i18n }}</button>
-                  i18n }}</button>
               </ng-template>
-              <input type="hidden" [(ngModel)]="form.model.adapterId" [ngModelOptions]="{ standalone: true }" nz-input
+              <input
-                name="adapterId" id="adapterId" />
+                type="hidden"
-              <input type="hidden" [(ngModel)]="form.model.adapter" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.adapterId"
-                name="adapter" id="adapter" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapterId"
+                id="adapterId"
+              />
+              <input
+                type="hidden"
+                [(ngModel)]="form.model.adapter"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapter"
+                id="adapter"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid description!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid description!">
+                [(ngModel)]="form.model.description"
-              <input [(ngModel)]="form.model.description" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="description" id="description" />
+                nz-input
+                name="description"
+                id="description"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -455,22 +470,24 @@
                 <td>
                   <button nz-button type="button" (click)="startExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.edit' | i18n
-                    }}</button>
+                  }}</button>
-                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' |
+                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-                    i18n }}</button>
                 </td>
               </ng-container>
               <ng-template #editTemplate>
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr"
+                <td
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr" [ngModelOptions]="{ standalone: true }"
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type"
+                /></td>
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                <td
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value"
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type" [ngModelOptions]="{ standalone: true }"
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                /></td>
+                <td
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value" [ngModelOptions]="{ standalone: true }"
+                /></td>
                 <td>
                   <button nz-button type="button" (click)="saveExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.submit' | i18n
-                    }}</button>
+                  }}</button>
                 </td>
               </ng-template>
             </tr>
@@ -484,4 +501,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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-jwt-details-editer/app-jwt-details-editer.component.ts

@@ -61,9 +61,9 @@ export class AppJwtDetailsEditerComponent implements OnInit {
     submitting: boolean;
     model: AppsJwtDetails;
   } = {
-      submitting: false,
+    submitting: false,
-      model: new AppsJwtDetails()
+    model: new AppsJwtDetails()
-    };
+  };
 
   formGroup: FormGroup = new FormGroup({});
 
@@ -86,7 +86,7 @@ export class AppJwtDetailsEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.isEdit) {

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-oauth20-details-editer/app-oauth20-details-editer.component.html

@@ -8,22 +8,24 @@
             <nz-form-item style="width: 100%">
               <nz-form-label [nzMd]="8" nzRequired nzFor="id">{{ 'mxk.text.id' | i18n }}</nz-form-label>
               <nz-form-control [nzMd]="16" nzErrorTip="The input is not valid id!">
-                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id"
+                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id" id="id" />
-                  id="id" />
               </nz-form-control>
             </nz-form-item>
             <nz-form-item style="width: 100%">
-              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }}
+              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }} </nz-form-label>
-              </nz-form-label>
+              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid secret!">
-              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-                nzErrorTip="The input is not valid secret!">
                 <nz-input-group nzSearch [nzAddOnAfter]="suffixPasswordButton">
-                  <input [(ngModel)]="form.model.secret" readonly [ngModelOptions]="{ standalone: true }" nz-input
+                  <input
-                    name="secret" id="secret" />
+                    [(ngModel)]="form.model.secret"
+                    readonly
+                    [ngModelOptions]="{ standalone: true }"
+                    nz-input
+                    name="secret"
+                    id="secret"
+                  />
                 </nz-input-group>
                 <ng-template #suffixPasswordButton>
-                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate'
+                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate' | i18n }}</button>
-                    | i18n }}</button>
                 </ng-template>
               </nz-form-control>
             </nz-form-item>
@@ -32,44 +34,57 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="icon">{{ 'mxk.apps.icon' | i18n }}</nz-form-label>
             <div nz-col class="clearfix" nzSm="16" nzXs="24">
-              <nz-upload nzAction="/file/upload/" nzListType="picture-card" [(nzFileList)]="fileList"
+              <nz-upload
-                nzName="uploadFile" [nzShowButton]="fileList.length < 1" [nzPreview]="handlePreview"
+                nzAction="/file/upload/"
-                (nzChange)="uploadImageChange($event)">
+                nzListType="picture-card"
+                [(nzFileList)]="fileList"
+                nzName="uploadFile"
+                [nzShowButton]="fileList.length < 1"
+                [nzPreview]="handlePreview"
+                (nzChange)="uploadImageChange($event)"
+              >
                 <div>
                   <i nz-icon nzType="plus"></i>
                   <div style="margin-top: 8px">Upload</div>
                 </div>
               </nz-upload>
-              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null"
+              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
-                (nzOnCancel)="previewVisible = false">
                 <ng-template #modalContent>
                   <img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
                 </ng-template>
               </nz-modal>
             </div>
 
-            <nz-form-control style="display: none" [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control
-              nzErrorTip="The input is not valid icon!">
+              style="display: none"
-              <input [(ngModel)]="form.model.iconId" disabled="true" [ngModelOptions]="{ standalone: true }" nz-input
+              [nzSm]="16"
-                name="icon" id="icon" />
+              [nzMd]="16"
+              [nzXs]="36"
+              [nzXl]="48"
+              nzErrorTip="The input is not valid icon!"
+            >
+              <input
+                [(ngModel)]="form.model.iconId"
+                disabled="true"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="icon"
+                id="icon"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid name!">
-              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName"
+              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName" id="appName" />
-                id="appName" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="frequently">{{ 'mxk.apps.frequently' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid frequently!">
-              nzErrorTip="The input is not valid frequently!">
+              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="yes">{{ 'mxk.text.yes' | i18n }}</label>
                 <label nz-radio-button nzValue="no">{{ 'mxk.text.no' | i18n }}</label>
               </nz-radio-group>
@@ -78,10 +93,8 @@
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid protocol!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-              nzErrorTip="The input is not valid protocol!">
               <nz-select [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" name="protocol">
                 <nz-option nzValue="OAuth_v2.0" nzLabel="OAuth v2.0"></nz-option>
                 <nz-option nzValue="OAuth_v2.1" nzLabel="OAuth v2.1"></nz-option>
@@ -91,10 +104,8 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="category">{{ 'mxk.apps.category' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid category!">
-              nzErrorTip="The input is not valid category!">
+              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category" id="category">
-              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category"
-                id="category">
                 <nz-option nzValue="none" nzLabel="{{ 'mxk.apps.category.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1011" nzLabel="{{ 'mxk.apps.category.1011' | i18n }}"></nz-option>
                 <nz-option nzValue="1012" nzLabel="{{ 'mxk.apps.category.1012' | i18n }}"></nz-option>
@@ -129,33 +140,31 @@
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid loginUrl!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl" id="loginUrl" />
-              nzErrorTip="The input is not valid loginUrl!">
-              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl"
-                id="loginUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }}
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="The input is not valid status!">
-              <nz-switch [(ngModel)]="form.model.switch_status" [ngModelOptions]="{ standalone: true }" name="status"
+              <nz-switch
-                [nzCheckedChildren]="statuscheckedTemplate" [nzUnCheckedChildren]="statusunCheckedTemplate"></nz-switch>
+                [(ngModel)]="form.model.switch_status"
+                [ngModelOptions]="{ standalone: true }"
+                name="status"
+                [nzCheckedChildren]="statuscheckedTemplate"
+                [nzUnCheckedChildren]="statusunCheckedTemplate"
+              ></nz-switch>
               <ng-template #statuscheckedTemplate><i nz-icon nzType="check"></i></ng-template>
               <ng-template #statusunCheckedTemplate><i nz-icon nzType="close"></i></ng-template>
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isExtendAttr!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              nzErrorTip="The input is not valid isExtendAttr!">
-              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="0">{{ 'mxk.text.no' | i18n }}</label>
                 <label nz-radio-button nzValue="1">{{ 'mxk.text.yes' | i18n }}</label>
               </nz-radio-group>
@@ -168,22 +177,29 @@
           <nz-form-item style="width: 100%">
             <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="registeredRedirectUris">{{
               'mxk.apps.oauth.registeredRedirectUris' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid registeredRedirectUris!">
-              nzErrorTip="The input is not valid registeredRedirectUris!">
+              <textarea
-              <textarea [(ngModel)]="form.model.registeredRedirectUris" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.registeredRedirectUris"
-                name="registeredRedirectUris" id="registeredRedirectUris"></textarea>
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="registeredRedirectUris"
+                id="registeredRedirectUris"
+              ></textarea>
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="GrantTypes">{{ 'mxk.apps.oauth.GrantTypes' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="GrantTypes">{{ 'mxk.apps.oauth.GrantTypes' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid authorizedGrantTypes!">
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+              <nz-select
-              nzErrorTip="The input is not valid authorizedGrantTypes!">
+                [(ngModel)]="form.model.select_authorizedGrantTypes"
-              <nz-select [(ngModel)]="form.model.select_authorizedGrantTypes" nzMode="multiple"
+                nzMode="multiple"
-                nzPlaceHolder="Please select" [ngModelOptions]="{ standalone: true }" name="authorizedGrantTypes">
+                nzPlaceHolder="Please select"
+                [ngModelOptions]="{ standalone: true }"
+                name="authorizedGrantTypes"
+              >
                 <nz-option nzValue="authorization_code" nzLabel="authorization_code"></nz-option>
                 <nz-option nzValue="password" nzLabel="password"></nz-option>
                 <nz-option nzValue="client_credentials" nzLabel="client_credentials"></nz-option>
@@ -197,12 +213,9 @@
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="subject">{{ 'mxk.apps.oauth.subject' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="subject">{{ 'mxk.apps.oauth.subject' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid subject!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select [(ngModel)]="form.model.subject" [ngModelOptions]="{ standalone: true }" name="subject" id="subject">
-              nzErrorTip="The input is not valid subject!">
-              <nz-select [(ngModel)]="form.model.subject" [ngModelOptions]="{ standalone: true }" name="subject"
-                id="subject">
                 <nz-option nzValue="username" nzLabel="{{ 'mxk.users.username' | i18n }}"></nz-option>
                 <nz-option nzValue="employeeNumber" nzLabel="{{ 'mxk.users.employeeNumber' | i18n }}"></nz-option>
                 <nz-option nzValue="email" nzLabel="{{ 'mxk.users.email' | i18n }}"></nz-option>
@@ -213,11 +226,14 @@
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="scope">{{ 'mxk.apps.oauth.scope' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="scope">{{ 'mxk.apps.oauth.scope' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid scope!">
-              <nz-select [(ngModel)]="form.model.select_scope" [ngModelOptions]="{ standalone: true }" nzMode="multiple"
+              <nz-select
-                nzPlaceHolder="Please select">
+                [(ngModel)]="form.model.select_scope"
+                [ngModelOptions]="{ standalone: true }"
+                nzMode="multiple"
+                nzPlaceHolder="Please select"
+              >
                 <nz-option nzValue="read" nzLabel="read"></nz-option>
                 <nz-option nzValue="write" nzLabel="write"></nz-option>
                 <nz-option nzValue="trust" nzLabel="trust"></nz-option>
@@ -235,12 +251,10 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="approvalPrompt">{{
               'mxk.apps.oauth.approvalPrompt' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid approvalPrompt!">
-              nzErrorTip="The input is not valid approvalPrompt!">
               <nz-input-group>
-                <nz-radio-group [(ngModel)]="form.model.approvalPrompt" [ngModelOptions]="{ standalone: true }"
+                <nz-radio-group [(ngModel)]="form.model.approvalPrompt" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-                  nzButtonStyle="solid">
                   <label nz-radio-button nzValue="force">{{ 'mxk.apps.oauth.approvalPrompt.force' | i18n }}</label>
                   <label nz-radio-button nzValue="auto">{{ 'mxk.apps.oauth.approvalPrompt.auto' | i18n }}</label>
                 </nz-radio-group>
@@ -251,8 +265,7 @@
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="pkce">PKCE</nz-form-label>
             <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid PKCE!">
               <nz-input-group>
-                <nz-radio-group [(ngModel)]="form.model.pkce" [ngModelOptions]="{ standalone: true }"
+                <nz-radio-group [(ngModel)]="form.model.pkce" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-                  nzButtonStyle="solid">
                   <label nz-radio-button nzValue="yes">{{ 'mxk.text.yes' | i18n }}</label>
                   <label nz-radio-button nzValue="no">{{ 'mxk.text.no' | i18n }}</label>
                 </nz-radio-group>
@@ -264,24 +277,38 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="accessTokenValiditySeconds">{{
               'mxk.apps.oauth.accessTokenValiditySeconds' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control
-              nzErrorTip="The input is not valid accessTokenValiditySeconds!">
+              [nzSm]="16"
+              [nzMd]="16"
+              [nzXs]="36"
+              [nzXl]="48"
+              nzErrorTip="The input is not valid accessTokenValiditySeconds!"
+            >
               <nz-input-group nzAddOnAfter="{{ 'mxk.text.second' | i18n }}">
-                <input [(ngModel)]="form.model.accessTokenValiditySeconds" [ngModelOptions]="{ standalone: true }"
+                <input
-                  nz-input name="accessTokenValiditySeconds" id="accessTokenValiditySeconds" />
+                  [(ngModel)]="form.model.accessTokenValiditySeconds"
+                  [ngModelOptions]="{ standalone: true }"
+                  nz-input
+                  name="accessTokenValiditySeconds"
+                  id="accessTokenValiditySeconds"
+                />
               </nz-input-group>
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="refreshTokenValiditySeconds">{{
               'mxk.apps.oauth.refreshTokenValiditySeconds' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid expires!">
-              nzErrorTip="The input is not valid expires!">
               <nz-input-group nzAddOnAfter="{{ 'mxk.text.second' | i18n }}">
-                <input [(ngModel)]="form.model.refreshTokenValiditySeconds" [ngModelOptions]="{ standalone: true }"
+                <input
-                  nz-input name="refreshTokenValiditySeconds" id="refreshTokenValiditySeconds" />
+                  [(ngModel)]="form.model.refreshTokenValiditySeconds"
+                  [ngModelOptions]="{ standalone: true }"
+                  nz-input
+                  name="refreshTokenValiditySeconds"
+                  id="refreshTokenValiditySeconds"
+                />
               </nz-input-group>
             </nz-form-control>
           </nz-form-item>
@@ -290,33 +317,30 @@
       <nz-tab nzTitle="{{ 'mxk.apps.oauth.connect.tab' | i18n }}">
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="issuer">{{ 'mxk.apps.oauth.connect.issuer' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="issuer">{{ 'mxk.apps.oauth.connect.issuer' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid issuer!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.issuer" [ngModelOptions]="{ standalone: true }" nz-input name="issuer" id="issuer" />
-              nzErrorTip="The input is not valid issuer!">
-              <input [(ngModel)]="form.model.issuer" [ngModelOptions]="{ standalone: true }" nz-input name="issuer"
-                id="issuer" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="audience">{{ 'mxk.apps.oauth.connect.audience' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="audience">{{ 'mxk.apps.oauth.connect.audience' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid audience!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.audience" [ngModelOptions]="{ standalone: true }" nz-input name="audience" id="audience" />
-              nzErrorTip="The input is not valid audience!">
-              <input [(ngModel)]="form.model.audience" [ngModelOptions]="{ standalone: true }" nz-input name="audience"
-                id="audience" />
             </nz-form-control>
           </nz-form-item>
         </div>
 
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="signature">{{ 'mxk.apps.oauth.connect.signature' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="signature">{{ 'mxk.apps.oauth.connect.signature' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid signature!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select
-              nzErrorTip="The input is not valid signature!">
+                (ngModelChange)="onSelectSignature($event)"
-              <nz-select (ngModelChange)="onSelectSignature($event)" [(ngModel)]="form.model.signature"
+                [(ngModel)]="form.model.signature"
-                [ngModelOptions]="{ standalone: true }" name="signature" id="signature">
+                [ngModelOptions]="{ standalone: true }"
+                name="signature"
+                id="signature"
+              >
                 <nz-option nzValue="NONE" nzLabel="NONE"></nz-option>
                 <nz-option nzValue="RS256" nzLabel="RS256"></nz-option>
                 <nz-option nzValue="RS384" nzLabel="RS384"></nz-option>
@@ -330,11 +354,14 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="userInfoResponse">{{
               'mxk.apps.oauth.connect.userInfoResponse' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid userInfoResponse!">
-              nzErrorTip="The input is not valid userInfoResponse!">
+              <nz-select
-              <nz-select [(ngModel)]="form.model.userInfoResponse" [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="form.model.userInfoResponse"
-                name="userInfoResponse" id="userInfoResponse">
+                [ngModelOptions]="{ standalone: true }"
+                name="userInfoResponse"
+                id="userInfoResponse"
+              >
                 <nz-option nzValue="NORMAL" nzLabel="NORMAL"></nz-option>
                 <nz-option nzValue="SIGNING" nzLabel="SIGNING"></nz-option>
                 <nz-option nzValue="ENCRYPTION" nzLabel="ENCRYPTION"></nz-option>
@@ -345,23 +372,29 @@
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="signatureKey">{{ 'mxk.apps.oauth.connect.signatureKey' | i18n
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="signatureKey">{{ 'mxk.apps.oauth.connect.signatureKey' | i18n }}</nz-form-label>
-              }}</nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid signatureKey!">
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+              <textarea
-              nzErrorTip="The input is not valid signatureKey!">
+                [(ngModel)]="form.model.signatureKey"
-              <textarea [(ngModel)]="form.model.signatureKey" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="signatureKey" id="signatureKey"></textarea>
+                nz-input
+                name="signatureKey"
+                id="signatureKey"
+              ></textarea>
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="algorithm">{{ 'mxk.apps.oauth.connect.algorithm' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="algorithm">{{ 'mxk.apps.oauth.connect.algorithm' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid algorithm!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select
-              nzErrorTip="The input is not valid algorithm!">
+                (ngModelChange)="onSelectAlgorithm($event)"
-              <nz-select (ngModelChange)="onSelectAlgorithm($event)" [(ngModel)]="form.model.algorithm"
+                [(ngModel)]="form.model.algorithm"
-                [ngModelOptions]="{ standalone: true }" name="algorithm" id="algorithm">
+                [ngModelOptions]="{ standalone: true }"
+                name="algorithm"
+                id="algorithm"
+              >
                 <nz-option nzValue="NONE" nzLabel="NONE"></nz-option>
                 <nz-option nzValue="RSA1_5" nzLabel="RSA1_5"></nz-option>
                 <nz-option nzValue="RSA_OAEP" nzLabel="RSA_OAEP"></nz-option>
@@ -378,11 +411,14 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="encryptionMethod">{{
               'mxk.apps.oauth.connect.encryptionMethod' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid encryptionMethod!">
-              nzErrorTip="The input is not valid encryptionMethod!">
+              <nz-select
-              <nz-select [(ngModel)]="form.model.encryptionMethod" [ngModelOptions]="{ standalone: true }"
+                [(ngModel)]="form.model.encryptionMethod"
-                name="encryptionMethod" id="encryptionMethod">
+                [ngModelOptions]="{ standalone: true }"
+                name="encryptionMethod"
+                id="encryptionMethod"
+              >
                 <nz-option nzValue="A128GCM" nzLabel="A128GCM"></nz-option>
                 <nz-option nzValue="A192GCM" nzLabel="A192GCM"></nz-option>
                 <nz-option nzValue="A256GCM" nzLabel="A256GCM"></nz-option>
@@ -396,12 +432,15 @@
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="algorithmKey">{{ 'mxk.apps.oauth.connect.algorithmKey' | i18n
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="algorithmKey">{{ 'mxk.apps.oauth.connect.algorithmKey' | i18n }}</nz-form-label>
-              }}</nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid algorithmKey!">
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+              <textarea
-              nzErrorTip="The input is not valid algorithmKey!">
+                [(ngModel)]="form.model.algorithmKey"
-              <textarea [(ngModel)]="form.model.algorithmKey" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="algorithmKey" id="algorithmKey"></textarea>
+                nz-input
+                name="algorithmKey"
+                id="algorithmKey"
+              ></textarea>
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -410,18 +449,14 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutUrl">{{ 'mxk.apps.logoutUrl' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutUrl!">
-              nzErrorTip="The input is not valid logoutUrl!">
+              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input name="logoutUrl" id="logoutUrl" />
-              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="logoutUrl" id="logoutUrl" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutType">{{ 'mxk.apps.logoutType' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutType!">
-              nzErrorTip="The input is not valid logoutType!">
+              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType" id="logoutType">
-              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType"
-                id="logoutType">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.logoutType.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.logoutType.back_channel' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.logoutType.front_channel' | i18n }}"></nz-option>
@@ -433,10 +468,8 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="visible">{{ 'mxk.apps.visible' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid visible!">
-              nzErrorTip="The input is not valid visible!">
+              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible" id="visible">
-              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible"
-                id="visible">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.visible.hidden' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.visible.all' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.visible.internet' | i18n }}"></nz-option>
@@ -446,38 +479,30 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="sortIndex">{{ 'mxk.text.sortIndex' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sortIndex!">
-              nzErrorTip="The input is not valid sortIndex!">
+              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input name="sortIndex" id="sortIndex" />
-              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input
-                name="sortIndex" id="sortIndex" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendor">{{ 'mxk.apps.vendor' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendor!">
-              nzErrorTip="The input is not valid vendor!">
+              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor" id="vendor" />
-              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor"
-                id="vendor" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendorUrl">{{ 'mxk.apps.vendor.url' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendorUrl!">
-              nzErrorTip="The input is not valid vendorUrl!">
+              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input name="vendorUrl" id="vendorUrl" />
-              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="vendorUrl" id="vendorUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isAdapter">{{ 'mxk.apps.isAdapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isAdapter!">
-              nzErrorTip="The input is not valid isAdapter!">
+              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter" id="isAdapter">
-              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter"
-                id="isAdapter">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.isAdapter.no' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.isAdapter.yes' | i18n }}"></nz-option>
               </nz-select>
@@ -485,31 +510,49 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="adapterName">{{ 'mxk.apps.adapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid adapterName!">
-              nzErrorTip="The input is not valid adapterName!">
               <nz-input-group nzSearch [nzAddOnAfter]="suffixAdapterButton">
-                <input [(ngModel)]="form.model.adapterName" [ngModelOptions]="{ standalone: true }" nz-input
+                <input
-                  name="adapterName" id="adapterName" />
+                  [(ngModel)]="form.model.adapterName"
+                  [ngModelOptions]="{ standalone: true }"
+                  nz-input
+                  name="adapterName"
+                  id="adapterName"
+                />
               </nz-input-group>
               <ng-template #suffixAdapterButton>
-                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' |
+                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' | i18n }}</button>
-                  i18n }}</button>
               </ng-template>
-              <input type="hidden" [(ngModel)]="form.model.adapterId" [ngModelOptions]="{ standalone: true }" nz-input
+              <input
-                name="adapterId" id="adapterId" />
+                type="hidden"
-              <input type="hidden" [(ngModel)]="form.model.adapter" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.adapterId"
-                name="adapter" id="adapter" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapterId"
+                id="adapterId"
+              />
+              <input
+                type="hidden"
+                [(ngModel)]="form.model.adapter"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapter"
+                id="adapter"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid description!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid description!">
+                [(ngModel)]="form.model.description"
-              <input [(ngModel)]="form.model.description" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="description" id="description" />
+                nz-input
+                name="description"
+                id="description"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -534,22 +577,24 @@
                 <td>
                   <button nz-button type="button" (click)="startExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.edit' | i18n
-                    }}</button>
+                  }}</button>
-                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' |
+                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-                    i18n }}</button>
                 </td>
               </ng-container>
               <ng-template #editTemplate>
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr"
+                <td
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr" [ngModelOptions]="{ standalone: true }"
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type"
+                /></td>
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                <td
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value"
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type" [ngModelOptions]="{ standalone: true }"
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                /></td>
+                <td
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value" [ngModelOptions]="{ standalone: true }"
+                /></td>
                 <td>
                   <button nz-button type="button" (click)="saveExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.submit' | i18n
-                    }}</button>
+                  }}</button>
                 </td>
               </ng-template>
             </tr>
@@ -563,4 +608,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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-oauth20-details-editer/app-oauth20-details-editer.component.ts

@@ -60,9 +60,9 @@ export class AppOauth20DetailsEditerComponent implements OnInit {
     submitting: boolean;
     model: AppsOauth20Details;
   } = {
-      submitting: false,
+    submitting: false,
-      model: new AppsOauth20Details()
+    model: new AppsOauth20Details()
-    };
+  };
 
   formGroup: FormGroup = new FormGroup({});
 
@@ -85,7 +85,7 @@ export class AppOauth20DetailsEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.isEdit) {

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-saml20-details-editer/app-saml20-details-editer.component.ts

@@ -60,9 +60,9 @@ export class AppSaml20DetailsEditerComponent implements OnInit {
     submitting: boolean;
     model: AppsSamlDetails;
   } = {
-      submitting: false,
+    submitting: false,
-      model: new AppsSamlDetails()
+    model: new AppsSamlDetails()
-    };
+  };
 
   formGroup: FormGroup = new FormGroup({});
 
@@ -85,7 +85,7 @@ export class AppSaml20DetailsEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.isEdit) {

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-token-based-details-editer/app-token-based-details-editer.component.html

@@ -8,22 +8,24 @@
             <nz-form-item style="width: 100%">
               <nz-form-label [nzMd]="8" nzRequired nzFor="id">{{ 'mxk.text.id' | i18n }}</nz-form-label>
               <nz-form-control [nzMd]="16" nzErrorTip="The input is not valid id!">
-                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id"
+                <input [(ngModel)]="form.model.id" readonly [ngModelOptions]="{ standalone: true }" nz-input name="id" id="id" />
-                  id="id" />
               </nz-form-control>
             </nz-form-item>
             <nz-form-item style="width: 100%">
-              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }}
+              <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="secret">{{ 'mxk.apps.secret' | i18n }} </nz-form-label>
-              </nz-form-label>
+              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid secret!">
-              <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-                nzErrorTip="The input is not valid secret!">
                 <nz-input-group nzSearch [nzAddOnAfter]="suffixPasswordButton">
-                  <input [(ngModel)]="form.model.secret" readonly [ngModelOptions]="{ standalone: true }" nz-input
+                  <input
-                    name="secret" id="secret" />
+                    [(ngModel)]="form.model.secret"
+                    readonly
+                    [ngModelOptions]="{ standalone: true }"
+                    nz-input
+                    name="secret"
+                    id="secret"
+                  />
                 </nz-input-group>
                 <ng-template #suffixPasswordButton>
-                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate'
+                  <button nz-button nzType="primary" nzSearch (click)="onGenerateSecret($event)">{{ 'mxk.text.generate' | i18n }}</button>
-                    | i18n }}</button>
                 </ng-template>
               </nz-form-control>
             </nz-form-item>
@@ -32,44 +34,57 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="icon">{{ 'mxk.apps.icon' | i18n }}</nz-form-label>
             <div nz-col class="clearfix" nzSm="16" nzXs="24">
-              <nz-upload nzAction="/file/upload/" nzListType="picture-card" [(nzFileList)]="fileList"
+              <nz-upload
-                nzName="uploadFile" [nzShowButton]="fileList.length < 1" [nzPreview]="handlePreview"
+                nzAction="/file/upload/"
-                (nzChange)="uploadImageChange($event)">
+                nzListType="picture-card"
+                [(nzFileList)]="fileList"
+                nzName="uploadFile"
+                [nzShowButton]="fileList.length < 1"
+                [nzPreview]="handlePreview"
+                (nzChange)="uploadImageChange($event)"
+              >
                 <div>
                   <i nz-icon nzType="plus"></i>
                   <div style="margin-top: 8px">Upload</div>
                 </div>
               </nz-upload>
-              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null"
+              <nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
-                (nzOnCancel)="previewVisible = false">
                 <ng-template #modalContent>
                   <img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
                 </ng-template>
               </nz-modal>
             </div>
 
-            <nz-form-control style="display: none" [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control
-              nzErrorTip="The input is not valid icon!">
+              style="display: none"
-              <input [(ngModel)]="form.model.iconId" disabled="true" [ngModelOptions]="{ standalone: true }" nz-input
+              [nzSm]="16"
-                name="icon" id="icon" />
+              [nzMd]="16"
+              [nzXs]="36"
+              [nzXl]="48"
+              nzErrorTip="The input is not valid icon!"
+            >
+              <input
+                [(ngModel)]="form.model.iconId"
+                disabled="true"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="icon"
+                id="icon"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.apps.name' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid name!">
-              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName"
+              <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" nz-input name="appName" id="appName" />
-                id="appName" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="frequently">{{ 'mxk.apps.frequently' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid frequently!">
-              nzErrorTip="The input is not valid frequently!">
+              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              <nz-radio-group [(ngModel)]="form.model.frequently" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="yes">{{ 'mxk.text.yes' | i18n }}</label>
                 <label nz-radio-button nzValue="no">{{ 'mxk.text.no' | i18n }}</label>
               </nz-radio-group>
@@ -78,20 +93,15 @@
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="protocol">{{ 'mxk.apps.protocol' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid protocol!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol" id="protocol" />
-              nzErrorTip="The input is not valid protocol!">
-              <input [(ngModel)]="form.model.protocol" [ngModelOptions]="{ standalone: true }" nz-input name="protocol"
-                id="protocol" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="category">{{ 'mxk.apps.category' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid category!">
-              nzErrorTip="The input is not valid category!">
+              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category" id="category">
-              <nz-select [(ngModel)]="form.model.category" [ngModelOptions]="{ standalone: true }" name="category"
-                id="category">
                 <nz-option nzValue="none" nzLabel="{{ 'mxk.apps.category.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1011" nzLabel="{{ 'mxk.apps.category.1011' | i18n }}"></nz-option>
                 <nz-option nzValue="1012" nzLabel="{{ 'mxk.apps.category.1012' | i18n }}"></nz-option>
@@ -126,33 +136,31 @@
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="loginUrl">{{ 'mxk.apps.loginUrl' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid loginUrl!">
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl" id="loginUrl" />
-              nzErrorTip="The input is not valid loginUrl!">
-              <input [(ngModel)]="form.model.loginUrl" [ngModelOptions]="{ standalone: true }" nz-input name="loginUrl"
-                id="loginUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }}
+            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }} </nz-form-label>
-            </nz-form-label>
             <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="The input is not valid status!">
-              <nz-switch [(ngModel)]="form.model.switch_status" [ngModelOptions]="{ standalone: true }" name="status"
+              <nz-switch
-                [nzCheckedChildren]="statuscheckedTemplate" [nzUnCheckedChildren]="statusunCheckedTemplate"></nz-switch>
+                [(ngModel)]="form.model.switch_status"
+                [ngModelOptions]="{ standalone: true }"
+                name="status"
+                [nzCheckedChildren]="statuscheckedTemplate"
+                [nzUnCheckedChildren]="statusunCheckedTemplate"
+              ></nz-switch>
               <ng-template #statuscheckedTemplate><i nz-icon nzType="check"></i></ng-template>
               <ng-template #statusunCheckedTemplate><i nz-icon nzType="close"></i></ng-template>
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isExtendAttr">{{ 'mxk.apps.isExtendAttr' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isExtendAttr!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-              nzErrorTip="The input is not valid isExtendAttr!">
-              <nz-radio-group [(ngModel)]="form.model.isExtendAttr" [ngModelOptions]="{ standalone: true }"
-                nzButtonStyle="solid">
                 <label nz-radio-button nzValue="0">{{ 'mxk.text.no' | i18n }}</label>
                 <label nz-radio-button nzValue="1">{{ 'mxk.text.yes' | i18n }}</label>
               </nz-radio-group>
@@ -163,23 +171,23 @@
       <nz-tab nzTitle="{{ 'mxk.apps.tokenbased.tab' | i18n }}">
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="redirectUri">{{ 'mxk.apps.jwt.redirectUri' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="redirectUri">{{ 'mxk.apps.jwt.redirectUri' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid redirectUri!">
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid redirectUri!">
+                [(ngModel)]="form.model.redirectUri"
-              <input [(ngModel)]="form.model.redirectUri" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="redirectUri" id="redirectUri" />
+                nz-input
+                name="redirectUri"
+                id="redirectUri"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="tokenType">{{ 'mxk.apps.tokenbased.tokenType' | i18n
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="tokenType">{{ 'mxk.apps.tokenbased.tokenType' | i18n }}</nz-form-label>
-              }}</nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid tokenType!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select [(ngModel)]="form.model.tokenType" [ngModelOptions]="{ standalone: true }" name="tokenType" id="tokenType">
-              nzErrorTip="The input is not valid tokenType!">
-              <nz-select [(ngModel)]="form.model.tokenType" [ngModelOptions]="{ standalone: true }" name="tokenType"
-                id="tokenType">
                 <nz-option nzValue="POST" nzLabel="POST"></nz-option>
                 <nz-option nzValue="GET" nzLabel="GET"></nz-option>
                 <nz-option nzValue="LTPA" nzLabel="LTPA"></nz-option>
@@ -190,22 +198,29 @@
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="cookieName">{{
               'mxk.apps.tokenbased.cookieName' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid cookieName!">
-              nzErrorTip="The input is not valid cookieName!">
+              <input
-              <input [(ngModel)]="form.model.cookieName" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.cookieName"
-                name="cookieName" id="cookieName" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="cookieName"
+                id="cookieName"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="algorithm">{{ 'mxk.apps.tokenbased.algorithm' | i18n
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="algorithm">{{ 'mxk.apps.tokenbased.algorithm' | i18n }}</nz-form-label>
-              }}</nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid algorithm!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <nz-select
-              nzErrorTip="The input is not valid algorithm!">
+                [(ngModel)]="form.model.algorithm"
-              <nz-select [(ngModel)]="form.model.algorithm" (ngModelChange)="onSelectAlgorithm($event)"
+                (ngModelChange)="onSelectAlgorithm($event)"
-                [ngModelOptions]="{ standalone: true }" name="algorithm" id="algorithm">
+                [ngModelOptions]="{ standalone: true }"
+                name="algorithm"
+                id="algorithm"
+              >
                 <nz-option nzValue="DES" nzLabel="DES"></nz-option>
                 <nz-option nzValue="DESede" nzLabel="DESede"></nz-option>
                 <nz-option nzValue="Blowfish" nzLabel="Blowfish"></nz-option>
@@ -215,13 +230,10 @@
           </nz-form-item>
 
           <nz-form-item>
-            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="expires">{{ 'mxk.apps.tokenbased.expires' | i18n }}
+            <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="expires">{{ 'mxk.apps.tokenbased.expires' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid expires!">
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
-              nzErrorTip="The input is not valid expires!">
               <nz-input-group nzAddOnAfter="{{ 'mxk.text.second' | i18n }}">
-                <input [(ngModel)]="form.model.expires" [ngModelOptions]="{ standalone: true }" nz-input name="expires"
+                <input [(ngModel)]="form.model.expires" [ngModelOptions]="{ standalone: true }" nz-input name="expires" id="expires" />
-                  id="expires" />
               </nz-input-group>
             </nz-form-control>
           </nz-form-item>
@@ -230,11 +242,15 @@
           <nz-form-item style="width: 100%">
             <nz-form-label [nzSm]="4" [nzXs]="24" nzRequired nzFor="userPropertys">{{
               'mxk.apps.tokenbased.token.content' | i18n
-              }}</nz-form-label>
+            }}</nz-form-label>
-            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="20" [nzMd]="20" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid userPropertys!">
-              nzErrorTip="The input is not valid userPropertys!">
+              <nz-select
-              <nz-select [(ngModel)]="form.model.select_userPropertys" nzMode="multiple" nzPlaceHolder="Please select"
+                [(ngModel)]="form.model.select_userPropertys"
-                [ngModelOptions]="{ standalone: true }" name="userPropertys">
+                nzMode="multiple"
+                nzPlaceHolder="Please select"
+                [ngModelOptions]="{ standalone: true }"
+                name="userPropertys"
+              >
                 <nz-option nzValue="userId" nzLabel="{{ 'mxk.users.id' | i18n }}"></nz-option>
                 <nz-option nzValue="username" nzLabel="{{ 'mxk.users.username' | i18n }}"></nz-option>
                 <nz-option nzValue="displayName" nzLabel="{{ 'mxk.users.displayName' | i18n }}"></nz-option>
@@ -258,18 +274,14 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutUrl">{{ 'mxk.apps.logoutUrl' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutUrl!">
-              nzErrorTip="The input is not valid logoutUrl!">
+              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input name="logoutUrl" id="logoutUrl" />
-              <input [(ngModel)]="form.model.logoutUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="logoutUrl" id="logoutUrl" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="logoutType">{{ 'mxk.apps.logoutType' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid logoutType!">
-              nzErrorTip="The input is not valid logoutType!">
+              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType" id="logoutType">
-              <nz-select [(ngModel)]="form.model.logoutType" [ngModelOptions]="{ standalone: true }" name="logoutType"
-                id="logoutType">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.logoutType.none' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.logoutType.back_channel' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.logoutType.front_channel' | i18n }}"></nz-option>
@@ -281,10 +293,8 @@
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="visible">{{ 'mxk.apps.visible' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid visible!">
-              nzErrorTip="The input is not valid visible!">
+              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible" id="visible">
-              <nz-select [(ngModel)]="form.model.visible" [ngModelOptions]="{ standalone: true }" name="visible"
-                id="visible">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.visible.hidden' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.visible.all' | i18n }}"></nz-option>
                 <nz-option nzValue="2" nzLabel="{{ 'mxk.apps.visible.internet' | i18n }}"></nz-option>
@@ -294,38 +304,30 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="sortIndex">{{ 'mxk.text.sortIndex' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid sortIndex!">
-              nzErrorTip="The input is not valid sortIndex!">
+              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input name="sortIndex" id="sortIndex" />
-              <input [(ngModel)]="form.model.sortIndex" [ngModelOptions]="{ standalone: true }" nz-input
-                name="sortIndex" id="sortIndex" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendor">{{ 'mxk.apps.vendor' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendor!">
-              nzErrorTip="The input is not valid vendor!">
+              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor" id="vendor" />
-              <input [(ngModel)]="form.model.vendor" [ngModelOptions]="{ standalone: true }" nz-input name="vendor"
-                id="vendor" />
             </nz-form-control>
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="vendorUrl">{{ 'mxk.apps.vendor.url' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid vendorUrl!">
-              nzErrorTip="The input is not valid vendorUrl!">
+              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input name="vendorUrl" id="vendorUrl" />
-              <input [(ngModel)]="form.model.vendorUrl" [ngModelOptions]="{ standalone: true }" nz-input
-                name="vendorUrl" id="vendorUrl" />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="isAdapter">{{ 'mxk.apps.isAdapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid isAdapter!">
-              nzErrorTip="The input is not valid isAdapter!">
+              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter" id="isAdapter">
-              <nz-select [(ngModel)]="form.model.isAdapter" [ngModelOptions]="{ standalone: true }" name="isAdapter"
-                id="isAdapter">
                 <nz-option nzValue="0" nzLabel="{{ 'mxk.apps.isAdapter.no' | i18n }}"></nz-option>
                 <nz-option nzValue="1" nzLabel="{{ 'mxk.apps.isAdapter.yes' | i18n }}"></nz-option>
               </nz-select>
@@ -333,31 +335,49 @@
           </nz-form-item>
           <nz-form-item>
             <nz-form-label [nzSm]="8" [nzXs]="24" nzFor="adapterName">{{ 'mxk.apps.adapter' | i18n }}</nz-form-label>
-            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+            <nz-form-control [nzSm]="16" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid adapterName!">
-              nzErrorTip="The input is not valid adapterName!">
               <nz-input-group nzSearch [nzAddOnAfter]="suffixAdapterButton">
-                <input [(ngModel)]="form.model.adapterName" [ngModelOptions]="{ standalone: true }" nz-input
+                <input
-                  name="adapterName" id="adapterName" />
+                  [(ngModel)]="form.model.adapterName"
+                  [ngModelOptions]="{ standalone: true }"
+                  nz-input
+                  name="adapterName"
+                  id="adapterName"
+                />
               </nz-input-group>
               <ng-template #suffixAdapterButton>
-                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' |
+                <button nz-button nzType="primary" nzSearch (click)="onSelectAdapter($event)">{{ 'mxk.text.select' | i18n }}</button>
-                  i18n }}</button>
               </ng-template>
-              <input type="hidden" [(ngModel)]="form.model.adapterId" [ngModelOptions]="{ standalone: true }" nz-input
+              <input
-                name="adapterId" id="adapterId" />
+                type="hidden"
-              <input type="hidden" [(ngModel)]="form.model.adapter" [ngModelOptions]="{ standalone: true }" nz-input
+                [(ngModel)]="form.model.adapterId"
-                name="adapter" id="adapter" />
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapterId"
+                id="adapterId"
+              />
+              <input
+                type="hidden"
+                [(ngModel)]="form.model.adapter"
+                [ngModelOptions]="{ standalone: true }"
+                nz-input
+                name="adapter"
+                id="adapter"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
         <div nz-row>
           <nz-form-item style="width: 100%">
-            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }}
+            <nz-form-label [nzSm]="4" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }} </nz-form-label>
-            </nz-form-label>
+            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid description!">
-            <nz-form-control [nzSm]="20" [nzMd]="16" [nzXs]="36" [nzXl]="48"
+              <input
-              nzErrorTip="The input is not valid description!">
+                [(ngModel)]="form.model.description"
-              <input [(ngModel)]="form.model.description" [ngModelOptions]="{ standalone: true }" nz-input
+                [ngModelOptions]="{ standalone: true }"
-                name="description" id="description" />
+                nz-input
+                name="description"
+                id="description"
+              />
             </nz-form-control>
           </nz-form-item>
         </div>
@@ -382,22 +402,24 @@
                 <td>
                   <button nz-button type="button" (click)="startExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.edit' | i18n
-                    }}</button>
+                  }}</button>
-                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' |
+                  <button nz-button type="button" (click)="deleteExtraAttrRow(data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-                    i18n }}</button>
                 </td>
               </ng-container>
               <ng-template #editTemplate>
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr"
+                <td
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.attr" [ngModelOptions]="{ standalone: true }"
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type"
+                /></td>
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                <td
-                <td><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value"
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.type" [ngModelOptions]="{ standalone: true }"
-                    [ngModelOptions]="{ standalone: true }" /></td>
+                /></td>
+                <td
+                  ><input type="text" nz-input [(ngModel)]="extraAttrEditCache[data.id].data.value" [ngModelOptions]="{ standalone: true }"
+                /></td>
                 <td>
                   <button nz-button type="button" (click)="saveExtraAttrEdit(data.id)" style="float: left">{{
                     'mxk.text.submit' | i18n
-                    }}</button>
+                  }}</button>
                 </td>
               </ng-template>
             </tr>
@@ -411,4 +433,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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/app-token-based-details-editer/app-token-based-details-editer.component.ts

@@ -61,9 +61,9 @@ export class AppTokenBasedDetailsEditerComponent implements OnInit {
     submitting: boolean;
     model: AppsTokenBasedDetails;
   } = {
-      submitting: false,
+    submitting: false,
-      model: new AppsTokenBasedDetails()
+    model: new AppsTokenBasedDetails()
-    };
+  };
 
   formGroup: FormGroup = new FormGroup({});
 
@@ -86,7 +86,7 @@ export class AppTokenBasedDetailsEditerComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     if (this.isEdit) {

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

@@ -7,8 +7,14 @@
         <nz-form-item>
           <nz-form-label nzFor="appName">{{ 'mxk.apps.name' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.appName" [ngModelOptions]="{ standalone: true }" name="appName"
+            <input
-              placeholder="" id="appName" />
+              nz-input
+              [(ngModel)]="query.params.appName"
+              [ngModelOptions]="{ standalone: true }"
+              name="appName"
+              placeholder=""
+              id="appName"
+            />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -34,12 +40,11 @@
       </div>
       <div nz-col [nzSpan]="query.expandForm ? 24 : 4" [class.text-right]="query.expandForm">
         <nz-form-item>
-          <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' |
+          <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-            i18n }}</button>
+          <button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset' | 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>
+            {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+          >
         </nz-form-item>
       </div>
     </div>
@@ -66,29 +71,45 @@
 
     <button nz-button type="button" (click)="onBatchDelete($event)" [nzType]="'primary'" nzDanger class="mx-sm">{{
       'mxk.text.delete' | i18n
-      }}</button>
+    }}</button>
   </div>
-  <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+  <nz-table
-    [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+    #dynamicTable
-    [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzTableLayout="auto"
-    (nzQueryParams)="onQueryParamsChange($event)" nzWidth="100%">
+    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)"
+    nzWidth="100%"
+  >
     <thead>
       <tr>
-        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate"
+        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate" (nzCheckedChange)="onTableAllChecked($event)"></th>
-          (nzCheckedChange)="onTableAllChecked($event)"></th>
         <th nzAlign="center" style="display: none">Id</th>
         <th nzAlign="center">{{ 'mxk.apps.icon' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.apps.name' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.apps.protocol' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.apps.category' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.text.status' | i18n }}</th>
-        <th nzAlign="center"><a>{{ 'mxk.text.action' | i18n }}</a></th>
+        <th nzAlign="center"
+          ><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"
+        <td
-          (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+          [nzChecked]="query.tableCheckedId.has(data.id)"
+          [nzDisabled]="data.disabled"
+          (nzCheckedChange)="onTableItemChecked(data.id, $event)"
+        ></td>
         <td nzAlign="left" style="display: none">
           <span>{{ data.id }}</span>
         </td>
@@ -126,22 +147,19 @@
           <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"> <i *ngIf="data.status == 1" nz-icon nzType="check-circle" nzTheme="fill"
+        <td nzAlign="center"> <i *ngIf="data.status == 1" nz-icon nzType="check-circle" nzTheme="fill" style="color: green"></i></td>
-            style="color: green"></i></td>
         <td nzAlign="left" nzBreakWord="false">
           <div nz-col>
-            <button nz-button type="button" (click)="onResourcesMgmt($event, data.id, data.appName)"
+            <button nz-button type="button" (click)="onResourcesMgmt($event, data.id, data.appName)" style="float: left">{{
-              style="float: left">{{
               'mxk.apps.resources' | i18n
-              }}</button>
+            }}</button>
             <button nz-button type="button" (click)="onEdit($event, data.id, data.protocol)" style="float: left">{{
               'mxk.text.edit' | i18n
-              }}</button>
+            }}</button>
-            <button nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete' | i18n
+            <button nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-              }}</button>
           </div>
         </td>
       </tr>
     </tbody>
   </nz-table>
-</nz-card>
+</nz-card>

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

@@ -66,29 +66,29 @@ export class AppsComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        appName: '',
+      appName: '',
-        displayName: '',
+      displayName: '',
-        protocol: '',
+      protocol: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalService: NzModalService,
@@ -99,7 +99,7 @@ export class AppsComponent implements OnInit {
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private router: Router,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     this.fetch();
@@ -115,7 +115,7 @@ export class AppsComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   onBatchDelete(e: MouseEvent): void {
     e.preventDefault();

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/apps/select-apps/select-apps.component.html

@@ -6,28 +6,44 @@
         <nz-form-item>
           <nz-form-label nzFor="appName">{{ 'mxk.apps.name' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.appName" [ngModelOptions]="{ standalone: true }" name="appName"
+            <input
-              placeholder="" id="appName" />
+              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 : 10" [class.text-right]="query.expandForm">
-        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          i18n }}</button>
+        <button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset' | 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>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
         <button nz-button nzType="primary" (click)="onSubmit($event)">{{ 'mxk.text.confirm' | i18n }}</button>
       </div>
     </div>
   </form>
 
-  <nz-table #dynamicTable nzTableLayout="auto" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+  <nz-table
-    [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+    #dynamicTable
-    [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzTableLayout="auto"
-    (nzQueryParams)="onQueryParamsChange($event)" nzWidth="100%">
+    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)"
+    nzWidth="100%"
+  >
     <thead>
       <tr>
         <th></th>
@@ -39,8 +55,11 @@
     </thead>
     <tbody>
       <tr *ngFor="let data of query.results.rows">
-        <td [nzChecked]="query.tableCheckedId.has(data.id)" [nzDisabled]="data.disabled"
+        <td
-          (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+          [nzChecked]="query.tableCheckedId.has(data.id)"
+          [nzDisabled]="data.disabled"
+          (nzCheckedChange)="onTableItemChecked(data.id, $event)"
+        ></td>
         <td nzAlign="left" style="display: none">
           <span>{{ data.id }}</span>
         </td>
@@ -84,4 +103,4 @@
 <div *nzModalFooter style="display: none">
   <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>

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

@@ -56,29 +56,29 @@ export class SelectAppsComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        appName: '',
+      appName: '',
-        displayName: '',
+      displayName: '',
-        protocol: '',
+      protocol: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 5,
+      pageSize: 5,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [5, 15, 50]
+      pageSizeOptions: [5, 15, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalRef: NzModalRef,
@@ -87,7 +87,7 @@ export class SelectAppsComponent implements OnInit {
     private fb: FormBuilder,
     private msg: NzMessageService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     this.fetch();
@@ -103,7 +103,7 @@ export class SelectAppsComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   fetch(): void {
     this.query.submitLoading = true;

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/audit/audit-connector/audit-connector.component.html

@@ -7,8 +7,7 @@
         <nz-form-item>
           <nz-form-label nzFor="conName">{{ 'mxk.history.connector.conName' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.conName" [ngModelOptions]="{ standalone: true }" name="conName"
+            <input nz-input [(ngModel)]="query.params.conName" [ngModelOptions]="{ standalone: true }" name="conName" id="conName" />
-              id="conName" />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -16,8 +15,13 @@
         <nz-form-item>
           <nz-form-label nzFor="sourceName">{{ 'mxk.history.connector.sourceName' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.sourceName" [ngModelOptions]="{ standalone: true }"
+            <input
-              id="sourceName" name="sourceName" />
+              nz-input
+              [(ngModel)]="query.params.sourceName"
+              [ngModelOptions]="{ standalone: true }"
+              id="sourceName"
+              name="sourceName"
+            />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -25,8 +29,13 @@
         <nz-form-item>
           <nz-form-label nzFor="employeeNumber">{{ 'mxk.users.employeeNumber' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.employeeNumber" [ngModelOptions]="{ standalone: true }"
+            <input
-              id="employeeNumber" name="employeeNumber" />
+              nz-input
+              [(ngModel)]="query.params.employeeNumber"
+              [ngModelOptions]="{ standalone: true }"
+              id="employeeNumber"
+              name="employeeNumber"
+            />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -34,8 +43,14 @@
         <nz-form-item>
           <nz-form-label nzFor="startDatePicker">{{ 'mxk.text.startDate' | i18n }}</nz-form-label>
           <nz-form-control>
-            <nz-date-picker nzShowTime nzFormat="yyyy-MM-dd HH:mm:ss" [(ngModel)]="query.params.startDatePicker"
+            <nz-date-picker
-              [ngModelOptions]="{ standalone: true }" name="startDatePicker" nzPlaceHolder="startDatePicker">
+              nzShowTime
+              nzFormat="yyyy-MM-dd HH:mm:ss"
+              [(ngModel)]="query.params.startDatePicker"
+              [ngModelOptions]="{ standalone: true }"
+              name="startDatePicker"
+              nzPlaceHolder="startDatePicker"
+            >
             </nz-date-picker>
           </nz-form-control>
         </nz-form-item>
@@ -44,29 +59,45 @@
         <nz-form-item>
           <nz-form-label nzFor="endDatePicker">{{ 'mxk.text.endDate' | i18n }}</nz-form-label>
           <nz-form-control>
-            <nz-date-picker nzShowTime nzFormat="yyyy-MM-dd HH:mm:ss" [(ngModel)]="query.params.endDatePicker"
+            <nz-date-picker
-              [ngModelOptions]="{ standalone: true }" name="endDatePicker" nzPlaceHolder="endDatePicker">
+              nzShowTime
+              nzFormat="yyyy-MM-dd HH:mm:ss"
+              [(ngModel)]="query.params.endDatePicker"
+              [ngModelOptions]="{ standalone: true }"
+              name="endDatePicker"
+              nzPlaceHolder="endDatePicker"
+            >
             </nz-date-picker>
           </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' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          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">
-          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
       </div>
     </div>
   </form>
 </nz-card>
 <nz-card>
-  <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzShowSizeChanger [nzBordered]="true"
+  <nz-table
-    [nzData]="query.results.rows" [nzFrontPagination]="false" [nzTotal]="query.results.records"
+    #dynamicTable
-    [nzPageSizeOptions]="query.params.pageSizeOptions" [nzPageSize]="query.params.pageSize"
+    nzTableLayout="auto"
-    [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzSize="small"
-    (nzQueryParams)="onQueryParamsChange($event)">
+    nzShowSizeChanger
+    [nzBordered]="true"
+    [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 nzAlign="center">{{ 'mxk.history.connector.id' | i18n }}</th>
@@ -94,4 +125,4 @@
       </tr>
     </tbody>
   </nz-table>
-</nz-card>
+</nz-card>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/audit/audit-connector/audit-connector.component.ts

@@ -51,33 +51,33 @@ export class AuditConnectorComponent implements OnInit {
     submitLoading: boolean;
     tableLoading: boolean;
   } = {
-      params: {
+    params: {
-        conName: '',
+      conName: '',
-        sourceName: '',
+      sourceName: '',
-        employeeNumber: '',
+      employeeNumber: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false
+    tableLoading: false
-    };
+  };
 
   constructor(
     private fb: FormBuilder,
     private historyService: HistoryService,
     private msg: NzMessageService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     this.fetch();
@@ -93,7 +93,7 @@ export class AuditConnectorComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   fetch(): void {
     this.query.submitLoading = true;

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/audit/audit-login-apps/audit-login-apps.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -51,26 +50,26 @@ export class AuditLoginAppsComponent implements OnInit {
     submitLoading: boolean;
     tableLoading: boolean;
   } = {
-      params: {
+    params: {
-        username: '',
+      username: '',
-        displayName: '',
+      displayName: '',
-        employeeNumber: '',
+      employeeNumber: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false
+    tableLoading: false
-    };
+  };
 
   constructor(
     private fb: FormBuilder,
@@ -78,7 +77,7 @@ export class AuditLoginAppsComponent implements OnInit {
     private msg: NzMessageService,
     private cdr: ChangeDetectorRef,
     private http: _HttpClient
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     this.fetch();
@@ -88,7 +87,7 @@ export class AuditLoginAppsComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   onQueryParamsChange(tableQueryParams: NzTableQueryParams): void {
     this.query.params.pageNumber = tableQueryParams.pageIndex;

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/audit/audit-logins/audit-logins.component.html

@@ -7,8 +7,7 @@
         <nz-form-item>
           <nz-form-label nzFor="username">{{ 'mxk.users.username' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.username" [ngModelOptions]="{ standalone: true }" name="username"
+            <input nz-input [(ngModel)]="query.params.username" [ngModelOptions]="{ standalone: true }" name="username" id="username" />
-              id="username" />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -16,8 +15,13 @@
         <nz-form-item>
           <nz-form-label nzFor="displayName">{{ 'mxk.users.displayName' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.displayName" [ngModelOptions]="{ standalone: true }"
+            <input
-              id="displayName" name="displayName" />
+              nz-input
+              [(ngModel)]="query.params.displayName"
+              [ngModelOptions]="{ standalone: true }"
+              id="displayName"
+              name="displayName"
+            />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -25,8 +29,13 @@
         <nz-form-item>
           <nz-form-label nzFor="employeeNumber">{{ 'mxk.users.employeeNumber' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.employeeNumber" [ngModelOptions]="{ standalone: true }"
+            <input
-              id="employeeNumber" name="employeeNumber" />
+              nz-input
+              [(ngModel)]="query.params.employeeNumber"
+              [ngModelOptions]="{ standalone: true }"
+              id="employeeNumber"
+              name="employeeNumber"
+            />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -34,8 +43,14 @@
         <nz-form-item>
           <nz-form-label nzFor="startDatePicker">{{ 'mxk.text.startDate' | i18n }}</nz-form-label>
           <nz-form-control>
-            <nz-date-picker nzShowTime nzFormat="yyyy-MM-dd HH:mm:ss" [(ngModel)]="query.params.startDatePicker"
+            <nz-date-picker
-              [ngModelOptions]="{ standalone: true }" name="startDatePicker" nzPlaceHolder="startDatePicker">
+              nzShowTime
+              nzFormat="yyyy-MM-dd HH:mm:ss"
+              [(ngModel)]="query.params.startDatePicker"
+              [ngModelOptions]="{ standalone: true }"
+              name="startDatePicker"
+              nzPlaceHolder="startDatePicker"
+            >
             </nz-date-picker>
           </nz-form-control>
         </nz-form-item>
@@ -44,29 +59,45 @@
         <nz-form-item>
           <nz-form-label nzFor="endDatePicker">{{ 'mxk.text.endDate' | i18n }}</nz-form-label>
           <nz-form-control>
-            <nz-date-picker nzShowTime nzFormat="yyyy-MM-dd HH:mm:ss" [(ngModel)]="query.params.endDatePicker"
+            <nz-date-picker
-              [ngModelOptions]="{ standalone: true }" name="endDatePicker" nzPlaceHolder="endDatePicker">
+              nzShowTime
+              nzFormat="yyyy-MM-dd HH:mm:ss"
+              [(ngModel)]="query.params.endDatePicker"
+              [ngModelOptions]="{ standalone: true }"
+              name="endDatePicker"
+              nzPlaceHolder="endDatePicker"
+            >
             </nz-date-picker>
           </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' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          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">
-          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
       </div>
     </div>
   </form>
 </nz-card>
 <nz-card>
-  <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzShowSizeChanger [nzBordered]="true"
+  <nz-table
-    [nzData]="query.results.rows" [nzFrontPagination]="false" [nzTotal]="query.results.records"
+    #dynamicTable
-    [nzPageSizeOptions]="query.params.pageSizeOptions" [nzPageSize]="query.params.pageSize"
+    nzTableLayout="auto"
-    [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzSize="small"
-    (nzQueryParams)="onQueryParamsChange($event)">
+    nzShowSizeChanger
+    [nzBordered]="true"
+    [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 nzAlign="center">{{ 'mxk.history.login.sessionId' | i18n }}</th>
@@ -98,4 +129,4 @@
       </tr>
     </tbody>
   </nz-table>
-</nz-card>
+</nz-card>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/audit/audit-logins/audit-logins.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -52,33 +51,33 @@ export class AuditLoginsComponent implements OnInit {
     submitLoading: boolean;
     tableLoading: boolean;
   } = {
-      params: {
+    params: {
-        username: '',
+      username: '',
-        displayName: '',
+      displayName: '',
-        employeeNumber: '',
+      employeeNumber: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false
+    tableLoading: false
-    };
+  };
 
   constructor(
     private fb: FormBuilder,
     private historyService: HistoryService,
     private msg: NzMessageService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     this.fetch();
@@ -88,7 +87,7 @@ export class AuditLoginsComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   onQueryParamsChange(tableQueryParams: NzTableQueryParams): void {
     this.query.params.pageNumber = tableQueryParams.pageIndex;

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/audit/audit-synchronizer/audit-synchronizer.component.html

@@ -7,8 +7,7 @@
         <nz-form-item>
           <nz-form-label nzFor="syncName">{{ 'mxk.history.synchronizer.syncName' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.syncName" [ngModelOptions]="{ standalone: true }" name="syncName"
+            <input nz-input [(ngModel)]="query.params.syncName" [ngModelOptions]="{ standalone: true }" name="syncName" id="syncName" />
-              id="syncName" />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -16,8 +15,13 @@
         <nz-form-item>
           <nz-form-label nzFor="objectName">{{ 'mxk.history.synchronizer.objectName' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.objectName" [ngModelOptions]="{ standalone: true }"
+            <input
-              id="objectName" name="objectName" />
+              nz-input
+              [(ngModel)]="query.params.objectName"
+              [ngModelOptions]="{ standalone: true }"
+              id="objectName"
+              name="objectName"
+            />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -25,8 +29,13 @@
         <nz-form-item>
           <nz-form-label nzFor="employeeNumber">{{ 'mxk.users.employeeNumber' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.employeeNumber" [ngModelOptions]="{ standalone: true }"
+            <input
-              id="employeeNumber" name="employeeNumber" />
+              nz-input
+              [(ngModel)]="query.params.employeeNumber"
+              [ngModelOptions]="{ standalone: true }"
+              id="employeeNumber"
+              name="employeeNumber"
+            />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -34,8 +43,14 @@
         <nz-form-item>
           <nz-form-label nzFor="startDatePicker">{{ 'mxk.text.startDate' | i18n }}</nz-form-label>
           <nz-form-control>
-            <nz-date-picker nzShowTime nzFormat="yyyy-MM-dd HH:mm:ss" [(ngModel)]="query.params.startDatePicker"
+            <nz-date-picker
-              [ngModelOptions]="{ standalone: true }" name="startDatePicker" nzPlaceHolder="startDatePicker">
+              nzShowTime
+              nzFormat="yyyy-MM-dd HH:mm:ss"
+              [(ngModel)]="query.params.startDatePicker"
+              [ngModelOptions]="{ standalone: true }"
+              name="startDatePicker"
+              nzPlaceHolder="startDatePicker"
+            >
             </nz-date-picker>
           </nz-form-control>
         </nz-form-item>
@@ -44,29 +59,45 @@
         <nz-form-item>
           <nz-form-label nzFor="endDatePicker">{{ 'mxk.text.endDate' | i18n }}</nz-form-label>
           <nz-form-control>
-            <nz-date-picker nzShowTime nzFormat="yyyy-MM-dd HH:mm:ss" [(ngModel)]="query.params.endDatePicker"
+            <nz-date-picker
-              [ngModelOptions]="{ standalone: true }" name="endDatePicker" nzPlaceHolder="endDatePicker">
+              nzShowTime
+              nzFormat="yyyy-MM-dd HH:mm:ss"
+              [(ngModel)]="query.params.endDatePicker"
+              [ngModelOptions]="{ standalone: true }"
+              name="endDatePicker"
+              nzPlaceHolder="endDatePicker"
+            >
             </nz-date-picker>
           </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' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          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">
-          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
       </div>
     </div>
   </form>
 </nz-card>
 <nz-card>
-  <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzShowSizeChanger [nzBordered]="true"
+  <nz-table
-    [nzData]="query.results.rows" [nzFrontPagination]="false" [nzTotal]="query.results.records"
+    #dynamicTable
-    [nzPageSizeOptions]="query.params.pageSizeOptions" [nzPageSize]="query.params.pageSize"
+    nzTableLayout="auto"
-    [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzSize="small"
-    (nzQueryParams)="onQueryParamsChange($event)">
+    nzShowSizeChanger
+    [nzBordered]="true"
+    [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 nzAlign="center">{{ 'mxk.history.synchronizer.syncId' | i18n }}</th>
@@ -92,4 +123,4 @@
       </tr>
     </tbody>
   </nz-table>
-</nz-card>
+</nz-card>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/audit/audit-synchronizer/audit-synchronizer.component.ts

@@ -51,33 +51,33 @@ export class AuditSynchronizerComponent implements OnInit {
     submitLoading: boolean;
     tableLoading: boolean;
   } = {
-      params: {
+    params: {
-        syncName: '',
+      syncName: '',
-        objectName: '',
+      objectName: '',
-        employeeNumber: '',
+      employeeNumber: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false
+    tableLoading: false
-    };
+  };
 
   constructor(
     private fb: FormBuilder,
     private historyService: HistoryService,
     private msg: NzMessageService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     this.fetch();
@@ -93,7 +93,7 @@ export class AuditSynchronizerComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   fetch(): void {
     this.query.submitLoading = true;

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/audit/audit-system-logs/audit-system-logs.component.html

@@ -7,8 +7,7 @@
         <nz-form-item>
           <nz-form-label nzFor="username">{{ 'mxk.users.username' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.username" [ngModelOptions]="{ standalone: true }" name="username"
+            <input nz-input [(ngModel)]="query.params.username" [ngModelOptions]="{ standalone: true }" name="username" id="username" />
-              id="username" />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -16,8 +15,13 @@
         <nz-form-item>
           <nz-form-label nzFor="displayName">{{ 'mxk.users.displayName' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.displayName" [ngModelOptions]="{ standalone: true }"
+            <input
-              id="displayName" name="displayName" />
+              nz-input
+              [(ngModel)]="query.params.displayName"
+              [ngModelOptions]="{ standalone: true }"
+              id="displayName"
+              name="displayName"
+            />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -25,8 +29,13 @@
         <nz-form-item>
           <nz-form-label nzFor="employeeNumber">{{ 'mxk.users.employeeNumber' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.employeeNumber" [ngModelOptions]="{ standalone: true }"
+            <input
-              id="employeeNumber" name="employeeNumber" />
+              nz-input
+              [(ngModel)]="query.params.employeeNumber"
+              [ngModelOptions]="{ standalone: true }"
+              id="employeeNumber"
+              name="employeeNumber"
+            />
           </nz-form-control>
         </nz-form-item>
       </div>
@@ -34,8 +43,14 @@
         <nz-form-item>
           <nz-form-label nzFor="startDatePicker">{{ 'mxk.text.startDate' | i18n }}</nz-form-label>
           <nz-form-control>
-            <nz-date-picker nzShowTime nzFormat="yyyy-MM-dd HH:mm:ss" [(ngModel)]="query.params.startDatePicker"
+            <nz-date-picker
-              [ngModelOptions]="{ standalone: true }" name="startDatePicker" nzPlaceHolder="startDatePicker">
+              nzShowTime
+              nzFormat="yyyy-MM-dd HH:mm:ss"
+              [(ngModel)]="query.params.startDatePicker"
+              [ngModelOptions]="{ standalone: true }"
+              name="startDatePicker"
+              nzPlaceHolder="startDatePicker"
+            >
             </nz-date-picker>
           </nz-form-control>
         </nz-form-item>
@@ -44,29 +59,45 @@
         <nz-form-item>
           <nz-form-label nzFor="endDatePicker">{{ 'mxk.text.endDate' | i18n }}</nz-form-label>
           <nz-form-control>
-            <nz-date-picker nzShowTime nzFormat="yyyy-MM-dd HH:mm:ss" [(ngModel)]="query.params.endDatePicker"
+            <nz-date-picker
-              [ngModelOptions]="{ standalone: true }" name="endDatePicker" nzPlaceHolder="endDatePicker">
+              nzShowTime
+              nzFormat="yyyy-MM-dd HH:mm:ss"
+              [(ngModel)]="query.params.endDatePicker"
+              [ngModelOptions]="{ standalone: true }"
+              name="endDatePicker"
+              nzPlaceHolder="endDatePicker"
+            >
             </nz-date-picker>
           </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' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          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">
-          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
       </div>
     </div>
   </form>
 </nz-card>
 <nz-card>
-  <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzShowSizeChanger [nzBordered]="true"
+  <nz-table
-    [nzData]="query.results.rows" [nzFrontPagination]="false" [nzTotal]="query.results.records"
+    #dynamicTable
-    [nzPageSizeOptions]="query.params.pageSizeOptions" [nzPageSize]="query.params.pageSize"
+    nzTableLayout="auto"
-    [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzSize="small"
-    (nzQueryParams)="onQueryParamsChange($event)">
+    nzShowSizeChanger
+    [nzBordered]="true"
+    [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 nzAlign="center" style="display: none">{{ 'mxk.history.systemlogs.id' | i18n }}</th>
@@ -92,4 +123,4 @@
       </tr>
     </tbody>
   </nz-table>
-</nz-card>
+</nz-card>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/audit/audit-system-logs/audit-system-logs.component.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -52,33 +51,33 @@ export class AuditSystemLogsComponent implements OnInit {
     submitLoading: boolean;
     tableLoading: boolean;
   } = {
-      params: {
+    params: {
-        username: '',
+      username: '',
-        displayName: '',
+      displayName: '',
-        employeeNumber: '',
+      employeeNumber: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false
+    tableLoading: false
-    };
+  };
 
   constructor(
     private fb: FormBuilder,
     private historyService: HistoryService,
     private msg: NzMessageService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     this.fetch();
@@ -88,7 +87,7 @@ export class AuditSystemLogsComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   onQueryParamsChange(tableQueryParams: NzTableQueryParams): void {
     this.query.params.pageNumber = tableQueryParams.pageIndex;

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/audit/audit.module.ts

@@ -1,19 +1,18 @@
 /*
  * Copyright [2022] [MaxKey of copyright http://www.maxkey.top]
- * 
+ *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *     http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
 
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/config/accounts-strategy/accounts-strategy-editer/accounts-strategy-editer.component.html

@@ -4,35 +4,37 @@
     <nz-form-item>
       <nz-form-label [nzMd]="6" nzFor="id">{{ 'mxk.text.id' | i18n }}</nz-form-label>
       <nz-form-control [nzMd]="18" nzErrorTip="The input is not valid id!">
-        <input [(ngModel)]="form.model.id" disabled="{{ isEdit }}" [ngModelOptions]="{ standalone: true }" nz-input
+        <input [(ngModel)]="form.model.id" disabled="{{ isEdit }}" [ngModelOptions]="{ standalone: true }" nz-input name="id" id="id" />
-          name="id" id="id" />
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="name">{{ 'mxk.accountsstrategy.name' | i18n }}
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="name">{{ 'mxk.accountsstrategy.name' | i18n }} </nz-form-label>
-      </nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not validminLength!">
         <input [(ngModel)]="form.model.name" [ngModelOptions]="{ standalone: true }" nz-input name="name" id="name" />
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.accountsstrategy.appName' | i18n }}
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="appName">{{ 'mxk.accountsstrategy.appName' | i18n }} </nz-form-label>
-      </nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid appName!">
         <nz-input-group nzSearch [nzAddOnAfter]="suffixButton">
-          <input [(ngModel)]="form.model.appName" [ngModelOptions]="{ standalone: true }" readonly type="text" nz-input
+          <input
-            name="appName" id="appName" />
+            [(ngModel)]="form.model.appName"
+            [ngModelOptions]="{ standalone: true }"
+            readonly
+            type="text"
+            nz-input
+            name="appName"
+            id="appName"
+          />
         </nz-input-group>
         <ng-template #suffixButton>
           <button nz-button nzType="primary" nzSearch (click)="onSelect($event)">{{ 'mxk.text.select' | i18n }}</button>
         </ng-template>
-        <input type="hidden" [(ngModel)]="form.model.appId" [ngModelOptions]="{ standalone: true }" nz-input
+        <input type="hidden" [(ngModel)]="form.model.appId" [ngModelOptions]="{ standalone: true }" nz-input name="appId" id="appId" />
-          name="appId" id="appId" />
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="mapping">{{ 'mxk.accountsstrategy.mapping' | i18n }}
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="mapping">{{ 'mxk.accountsstrategy.mapping' | i18n }} </nz-form-label>
-      </nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid mapping!">
         <nz-select [(ngModel)]="form.model.mapping" [ngModelOptions]="{ standalone: true }">
           <nz-option nzValue="username" nzLabel="username"></nz-option>
@@ -45,39 +47,54 @@
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="suffixes">{{ 'mxk.accountsstrategy.suffixes' | i18n }}
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="suffixes">{{ 'mxk.accountsstrategy.suffixes' | i18n }} </nz-form-label>
-      </nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid suffixes!">
-        <input [(ngModel)]="form.model.suffixes" [ngModelOptions]="{ standalone: true }" nz-input name="suffixes"
+        <input [(ngModel)]="form.model.suffixes" [ngModelOptions]="{ standalone: true }" nz-input name="suffixes" id="suffixes" />
-          id="suffixes" />
       </nz-form-control>
     </nz-form-item>
 
     <nz-form-item>
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="orgIdsList">{{ 'mxk.accountsstrategy.orgIdsList' | i18n }}
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="orgIdsList">{{ 'mxk.accountsstrategy.orgIdsList' | i18n }} </nz-form-label>
-      </nz-form-label>
       <nz-form-control [nzSm]="18" [nzXs]="24" nzErrorTip="The input is not valid upperCase!">
-        <input type="hidden" [(ngModel)]="form.model.orgIdsList" [ngModelOptions]="{ standalone: true }" nz-input
+        <input
-          name="orgIdsList" id="orgIdsList" />
+          type="hidden"
-        <nz-tree-select nzVirtualHeight="300px" [nzMaxTagCount]="3" [(ngModel)]="selectValues"
+          [(ngModel)]="form.model.orgIdsList"
-          [ngModelOptions]="{ standalone: true }" [nzNodes]="treeNodes.nodes" nzCheckable nzPlaceHolder="Please select"
+          [ngModelOptions]="{ standalone: true }"
-          [nzCheckStrictly]="true">
+          nz-input
+          name="orgIdsList"
+          id="orgIdsList"
+        />
+        <nz-tree-select
+          nzVirtualHeight="300px"
+          [nzMaxTagCount]="3"
+          [(ngModel)]="selectValues"
+          [ngModelOptions]="{ standalone: true }"
+          [nzNodes]="treeNodes.nodes"
+          nzCheckable
+          nzPlaceHolder="Please select"
+          [nzCheckStrictly]="true"
+        >
         </nz-tree-select>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
       <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="filters">{{ 'mxk.accountsstrategy.filters' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzXs]="24" nzErrorTip="The input is not valid filters!">
-        <textarea rows="4" nz-input [(ngModel)]="form.model.filters" [ngModelOptions]="{ standalone: true }" nz-input
+        <textarea
-          name="filters" id="filters"></textarea>
+          rows="4"
+          nz-input
+          [(ngModel)]="form.model.filters"
+          [ngModelOptions]="{ standalone: true }"
+          nz-input
+          name="filters"
+          id="filters"
+        ></textarea>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
-      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="createType">{{ 'mxk.accountsstrategy.createType' | i18n }}
+      <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="createType">{{ 'mxk.accountsstrategy.createType' | i18n }} </nz-form-label>
-      </nz-form-label>
       <nz-form-control [nzSm]="18" [nzMd]="18" [nzXs]="36" [nzXl]="48" nzErrorTip="The input is not valid createType!">
-        <nz-radio-group [(ngModel)]="form.model.createType" [ngModelOptions]="{ standalone: true }"
+        <nz-radio-group [(ngModel)]="form.model.createType" [ngModelOptions]="{ standalone: true }" nzButtonStyle="solid">
-          nzButtonStyle="solid">
           <label nz-radio-button nzValue="manual">{{ 'mxk.text.manual' | i18n }}</label>
           <label nz-radio-button nzValue="automatic">{{ 'mxk.text.automatic' | i18n }}</label>
         </nz-radio-group>
@@ -86,15 +103,27 @@
     <nz-form-item style="display: none">
       <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="description">{{ 'mxk.text.description' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="18" [nzXs]="24" nzErrorTip="The input is not valid encoding!">
-        <textarea rows="4" nz-input [(ngModel)]="form.model.description" [ngModelOptions]="{ standalone: true }"
+        <textarea
-          nz-input name="description" id="description"></textarea>
+          rows="4"
+          nz-input
+          [(ngModel)]="form.model.description"
+          [ngModelOptions]="{ standalone: true }"
+          nz-input
+          name="description"
+          id="description"
+        ></textarea>
       </nz-form-control>
     </nz-form-item>
     <nz-form-item>
       <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="status">{{ 'mxk.text.status' | i18n }}</nz-form-label>
       <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="The input is not valid status!">
-        <nz-switch [(ngModel)]="form.model.switch_status" [ngModelOptions]="{ standalone: true }" name="status"
+        <nz-switch
-          [nzCheckedChildren]="checkedTemplate" [nzUnCheckedChildren]="unCheckedTemplate"></nz-switch>
+          [(ngModel)]="form.model.switch_status"
+          [ngModelOptions]="{ standalone: true }"
+          name="status"
+          [nzCheckedChildren]="checkedTemplate"
+          [nzUnCheckedChildren]="unCheckedTemplate"
+        ></nz-switch>
         <ng-template #checkedTemplate><i nz-icon nzType="check"></i></ng-template>
         <ng-template #unCheckedTemplate><i nz-icon nzType="close"></i></ng-template>
       </nz-form-control>
@@ -105,4 +134,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>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/config/accounts-strategy/accounts-strategy-editer/accounts-strategy-editer.component.ts

@@ -48,9 +48,9 @@ export class AccountsStrategyEditerComponent implements OnInit {
     submitting: boolean;
     model: AccountsStrategy;
   } = {
-      submitting: false,
+    submitting: false,
-      model: new AccountsStrategy()
+    model: new AccountsStrategy()
-    };
+  };
 
   formGroup: FormGroup = new FormGroup({});
   // TreeNodes
@@ -68,7 +68,7 @@ export class AccountsStrategyEditerComponent 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/config/accounts-strategy/accounts-strategy.component.html

@@ -7,19 +7,17 @@
         <nz-form-item>
           <nz-form-label nzFor="name">{{ 'mxk.accountsstrategy.name' | i18n }}</nz-form-label>
           <nz-form-control>
-            <input nz-input [(ngModel)]="query.params.name" [ngModelOptions]="{ standalone: true }" name="name"
+            <input nz-input [(ngModel)]="query.params.name" [ngModelOptions]="{ standalone: true }" name="name" placeholder="" id="name" />
-              placeholder="" id="name" />
           </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' |
+        <button nz-button type="submit" [nzType]="'primary'" [nzLoading]="query.submitLoading">{{ 'mxk.text.query' | i18n }}</button>
-          i18n }}</button>
+        <button nz-button type="reset" (click)="onReset()" class="mx-sm" style="display: none">{{ 'mxk.text.reset' | 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>
+          {{ query.expandForm ? ('mxk.text.collapse' | i18n) : ('mxk.text.expand' | i18n) }}</button
+        >
       </div>
     </div>
   </form>
@@ -29,48 +27,60 @@
     <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>
+    }}</button>
   </div>
-  <nz-table #dynamicTable nzTableLayout="auto" nzSize="small" nzBordered nzShowSizeChanger [nzData]="query.results.rows"
+  <nz-table
-    [nzFrontPagination]="false" [nzTotal]="query.results.records" [nzPageSizeOptions]="query.params.pageSizeOptions"
+    #dynamicTable
-    [nzPageSize]="query.params.pageSize" [nzPageIndex]="query.params.pageNumber" [nzLoading]="this.query.tableLoading"
+    nzTableLayout="auto"
-    (nzQueryParams)="onQueryParamsChange($event)" nzWidth="100%">
+    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)"
+    nzWidth="100%"
+  >
     <thead>
       <tr>
-        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate"
+        <th [nzChecked]="query.checked" [nzIndeterminate]="query.indeterminate" (nzCheckedChange)="onTableAllChecked($event)"></th>
-          (nzCheckedChange)="onTableAllChecked($event)"></th>
         <th nzAlign="center" style="display: none">Id</th>
         <th nzAlign="center">{{ 'mxk.accountsstrategy.name' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.accountsstrategy.appIcon' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.accountsstrategy.appName' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.accountsstrategy.createType' | i18n }}</th>
         <th nzAlign="center">{{ 'mxk.text.status' | i18n }}</th>
-        <th nzAlign="center"><a>{{ 'mxk.text.action' | i18n }}</a></th>
+        <th nzAlign="center"
+          ><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"
+        <td
-          (nzCheckedChange)="onTableItemChecked(data.id, $event)"></td>
+          [nzChecked]="query.tableCheckedId.has(data.id)"
+          [nzDisabled]="data.disabled"
+          (nzCheckedChange)="onTableItemChecked(data.id, $event)"
+        ></td>
         <td nzAlign="left" style="display: none">
           <span>{{ data.id }}</span>
         </td>
         <td nzAlign="left"> {{ data.name }}</td>
         <td nzAlign="center"><img height="30" border="0px" src="{{ data.appIconBase64 }}" /></td>
         <td nzAlign="left"> {{ data.appName }}</td>
-        <td nzAlign="center">{{ data.createType == 'manual' ? ('mxk.text.manual' | i18n) : ('mxk.text.manual' | i18n) }}
+        <td nzAlign="center">{{ data.createType == 'manual' ? ('mxk.text.manual' | i18n) : ('mxk.text.manual' | i18n) }} </td>
-        </td>
+        <td nzAlign="center"> <i *ngIf="data.status == 1" nz-icon nzType="check-circle" nzTheme="fill" style="color: green"></i></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">
           <div nz-col>
-            <button nz-button type="button" (click)="onEdit($event, data.id)" style="float: left">{{ 'mxk.text.edit' |
+            <button nz-button type="button" (click)="onEdit($event, data.id)" style="float: left">{{ 'mxk.text.edit' | i18n }}</button>
-              i18n }}</button>
+            <button nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete' | i18n }}</button>
-            <button nz-button type="button" (click)="onDelete($event, data.id)" nzDanger>{{ 'mxk.text.delete' | i18n
-              }}</button>
           </div>
         </td>
       </tr>
     </tbody>
   </nz-table>
-</nz-card>
+</nz-card>

maxkey-web-frontend/maxkey-web-mgt-app/src/app/routes/config/accounts-strategy/accounts-strategy.component.ts

@@ -58,29 +58,29 @@ export class AccountsStrategyComponent implements OnInit {
     indeterminate: boolean;
     checked: boolean;
   } = {
-      params: {
+    params: {
-        name: '',
+      name: '',
-        displayName: '',
+      displayName: '',
-        protocol: '',
+      protocol: '',
-        startDate: '',
+      startDate: '',
-        endDate: '',
+      endDate: '',
-        startDatePicker: addDays(new Date(), -30),
+      startDatePicker: addDays(new Date(), -30),
-        endDatePicker: new Date(),
+      endDatePicker: new Date(),
-        pageSize: 10,
+      pageSize: 10,
-        pageNumber: 1,
+      pageNumber: 1,
-        pageSizeOptions: [10, 20, 50]
+      pageSizeOptions: [10, 20, 50]
-      },
+    },
-      results: {
+    results: {
-        records: 0,
+      records: 0,
-        rows: []
+      rows: []
-      },
+    },
-      expandForm: false,
+    expandForm: false,
-      submitLoading: false,
+    submitLoading: false,
-      tableLoading: false,
+    tableLoading: false,
-      tableCheckedId: new Set<String>(),
+    tableCheckedId: new Set<String>(),
-      indeterminate: false,
+    indeterminate: false,
-      checked: false
+    checked: false
-    };
+  };
 
   constructor(
     private modalService: NzModalService,
@@ -90,7 +90,7 @@ export class AccountsStrategyComponent implements OnInit {
     private msg: NzMessageService,
     @Inject(ALAIN_I18N_TOKEN) private i18n: I18NService,
     private cdr: ChangeDetectorRef
-  ) { }
+  ) {}
 
   ngOnInit(): void {
     this.fetch();
@@ -106,7 +106,7 @@ export class AccountsStrategyComponent implements OnInit {
     this.fetch();
   }
 
-  onReset(): void { }
+  onReset(): void {}
 
   onBatchDelete(e: MouseEvent): void {
     e.preventDefault();