diff --git a/.eslintrc.js b/.eslintrc.js
index f7dbd95e..b2d90ec9 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -15,7 +15,9 @@ module.exports = {
     project: 'tsconfig.json',
   },
   rules: {
-    // eslint规则
+    // 不必要的转义字符，设置为警告。
+    // 在正则表达式中，特殊字符加个转义字符可以增强可读性。比如 /[\*]/ 一眼看过去知道是只是匹配"*"这个字符的. 而/[*]/可能会让人误解为一个通配符。
+    'no-useless-escape': 1,
     'no-case-declarations': 'off',
     'no-fallthrough': 'off',
     'no-underscore-dangle': 'off',
diff --git a/packages/plugins/hwc/src/core/config/constants.ts b/packages/plugins/hwc/src/core/config/constants.ts
index fe0ce056..a1f5569d 100644
--- a/packages/plugins/hwc/src/core/config/constants.ts
+++ b/packages/plugins/hwc/src/core/config/constants.ts
@@ -51,7 +51,6 @@ export const REG_FG_DEP_NAME = /^[a-zA-Z][\w|\-|.]{0,95}$/;
 // 大小写字母数字正则表达式
 export const REG_LETTER_NUMBER = /[a-zA-Z0-9]/;
 
-
 export const CONSTANTS = {
   TINY_PRO_DEFAULT_BIN,
   TINY_PRO_DEFAULT_HOME_FOLDER,
@@ -60,4 +59,3 @@ export const CONSTANTS = {
   TINY_PRO_DEFAULT_LOCAL_INFO_FILE,
   TINY_PRO_DEFAULT_HWC_EXPORTS,
 };
-
diff --git a/packages/plugins/hwc/src/core/hcloud-client/index.ts b/packages/plugins/hwc/src/core/hcloud-client/index.ts
index 9b0b22bb..497a4578 100644
--- a/packages/plugins/hwc/src/core/hcloud-client/index.ts
+++ b/packages/plugins/hwc/src/core/hcloud-client/index.ts
@@ -161,12 +161,14 @@ class HCloudClient {
   // 期望返回的是一个Json时
   execJson(command: string) {
     return new Promise<any>((resolve) => {
-      this.exec(command).then((res) => {
-        res ? resolve(JSON.parse(res)) : resolve(res);
-      }).catch((res) => {
-        log.error(res);
-        process.exit(1);
-      });
+      this.exec(command)
+        .then((res) => {
+          res ? resolve(JSON.parse(res)) : resolve(res);
+        })
+        .catch((res) => {
+          log.error(res);
+          process.exit(1);
+        });
     });
   }
 
diff --git a/packages/plugins/hwc/src/core/utils/error-utils.ts b/packages/plugins/hwc/src/core/utils/error-utils.ts
index 7071b57b..1b7b43c2 100644
--- a/packages/plugins/hwc/src/core/utils/error-utils.ts
+++ b/packages/plugins/hwc/src/core/utils/error-utils.ts
@@ -3,10 +3,12 @@ type CommonError = {
 };
 
 export function isCommonError(error: unknown): error is CommonError {
-  return typeof error === 'object' &&
+  return (
+    typeof error === 'object' &&
     error !== null &&
     'message' in error &&
-    typeof (error as Record<string, unknown>).message === 'string';
+    typeof (error as Record<string, unknown>).message === 'string'
+  );
 }
 
 export class ErrorUtils {
diff --git a/packages/plugins/hwc/src/lib/configure/commands/index.ts b/packages/plugins/hwc/src/lib/configure/commands/index.ts
index dafaa87a..8d3c0624 100644
--- a/packages/plugins/hwc/src/lib/configure/commands/index.ts
+++ b/packages/plugins/hwc/src/lib/configure/commands/index.ts
@@ -152,6 +152,8 @@ export const configure = async () => {
 
     log.success(configureMsg.cfgTermResultSuccessMsg);
   } catch (err) {
-    log.error(`${configureMsg.cfgTermResultErrMsg}：${ErrorUtils.getErrorMessage(err)}`);
+    log.error(
+      `${configureMsg.cfgTermResultErrMsg}：${ErrorUtils.getErrorMessage(err)}`
+    );
   }
 };
diff --git a/packages/plugins/hwc/src/lib/configure/services/configure.ts b/packages/plugins/hwc/src/lib/configure/services/configure.ts
index f498dd23..4b72591a 100644
--- a/packages/plugins/hwc/src/lib/configure/services/configure.ts
+++ b/packages/plugins/hwc/src/lib/configure/services/configure.ts
@@ -24,7 +24,9 @@ export const writeAkSkFile = (
       JSON.stringify({ accessKeyId, secretAccessKey })
     );
   } catch (err) {
-    log.error(`${configureMsg.cfgTermWriteAkSkError}:${ErrorUtils.getErrorMessage(err)}`);
+    log.error(
+      `${configureMsg.cfgTermWriteAkSkError}:${ErrorUtils.getErrorMessage(err)}`
+    );
   }
 };
 
@@ -51,7 +53,9 @@ export const writeLocalHwcInfo = (akSkFilePath: string) => {
       })
     );
   } catch (err) {
-    log.error(`${configureMsg.cfgTermWriteHwcError}:${ErrorUtils.getErrorMessage(err)}`);
+    log.error(
+      `${configureMsg.cfgTermWriteHwcError}:${ErrorUtils.getErrorMessage(err)}`
+    );
   }
 };
 
@@ -73,6 +77,10 @@ export const addGitIgnore = () => {
       fs.writeFileSync(gitignorePath, content);
     }
   } catch (err) {
-    log.error(`${configureMsg.cfgTermAddGitIgnoreError}:${ErrorUtils.getErrorMessage(err)}`);
+    log.error(
+      `${configureMsg.cfgTermAddGitIgnoreError}:${ErrorUtils.getErrorMessage(
+        err
+      )}`
+    );
   }
 };
diff --git a/packages/plugins/hwc/src/lib/hwc-apig/commands/add.ts b/packages/plugins/hwc/src/lib/hwc-apig/commands/add.ts
index 22c6dfc7..6c17d381 100644
--- a/packages/plugins/hwc/src/lib/hwc-apig/commands/add.ts
+++ b/packages/plugins/hwc/src/lib/hwc-apig/commands/add.ts
@@ -64,6 +64,8 @@ export const addApig = async (instanceId?: string) => {
 
     setHwcExports('hwcConfig.apigList', apigList);
   } catch (err) {
-    log.error(`${apigMsg.apigTermGetApigListErrMsg}：${ErrorUtils.getErrorMessage(err)}`);
+    log.error(
+      `${apigMsg.apigTermGetApigListErrMsg}：${ErrorUtils.getErrorMessage(err)}`
+    );
   }
 };
diff --git a/packages/plugins/hwc/src/lib/hwc-apig/commands/group-add.ts b/packages/plugins/hwc/src/lib/hwc-apig/commands/group-add.ts
index eea4a7b7..3a956cbc 100644
--- a/packages/plugins/hwc/src/lib/hwc-apig/commands/group-add.ts
+++ b/packages/plugins/hwc/src/lib/hwc-apig/commands/group-add.ts
@@ -56,6 +56,10 @@ export const addApigGroups = async (instanceId?: string) => {
     setHwcExports('hwcConfig.apigGroupsList', groupsList);
     log.success(`${commandName}成功`);
   } catch (err) {
-    log.error(`${apigMsg.groupTermGetGroupListErrMsg}：${ErrorUtils.getErrorMessage(err)}`);
+    log.error(
+      `${apigMsg.groupTermGetGroupListErrMsg}：${ErrorUtils.getErrorMessage(
+        err
+      )}`
+    );
   }
 };
diff --git a/packages/plugins/hwc/src/lib/hwc-apig/commands/publish.ts b/packages/plugins/hwc/src/lib/hwc-apig/commands/publish.ts
index b2e1bf55..5036a919 100644
--- a/packages/plugins/hwc/src/lib/hwc-apig/commands/publish.ts
+++ b/packages/plugins/hwc/src/lib/hwc-apig/commands/publish.ts
@@ -63,11 +63,11 @@ export const publishApig = async (instanceId?: string) => {
         log.success(apigMsg.apigTermPublishSuccessMsg(apiName));
       }
     } else {
-      log.info(
-        chalk.magenta(commonMsg.commandAddNullMsg('API列表', 'apig'))
-      );
+      log.info(chalk.magenta(commonMsg.commandAddNullMsg('API列表', 'apig')));
     }
   } catch (err) {
-    log.error(`${apigMsg.apigTermPublishErrMsg}：${ErrorUtils.getErrorMessage(err)}`);
+    log.error(
+      `${apigMsg.apigTermPublishErrMsg}：${ErrorUtils.getErrorMessage(err)}`
+    );
   }
 };
diff --git a/packages/plugins/hwc/src/lib/hwc-apig/services/group-validate.ts b/packages/plugins/hwc/src/lib/hwc-apig/services/group-validate.ts
index dbd3c5de..1c2e02d6 100644
--- a/packages/plugins/hwc/src/lib/hwc-apig/services/group-validate.ts
+++ b/packages/plugins/hwc/src/lib/hwc-apig/services/group-validate.ts
@@ -32,7 +32,8 @@ export class ApigGroupValidators extends ValidatorService {
     const groups = await getApigGroups(instanceId, regionId);
 
     for (const group of groups) {
-      for (const item of group?.url_domains) {
+      const url_domains = group?.url_domains || [];
+      for (const item of url_domains) {
         if (item.domain === domain) {
           return commonMsg.commonTermIsExist(
             apigMsg.groupTermDomainName,
diff --git a/packages/plugins/hwc/src/lib/hwc-eip/commands/add.ts b/packages/plugins/hwc/src/lib/hwc-eip/commands/add.ts
index c187189b..2d6b7a5a 100644
--- a/packages/plugins/hwc/src/lib/hwc-eip/commands/add.ts
+++ b/packages/plugins/hwc/src/lib/hwc-eip/commands/add.ts
@@ -9,7 +9,7 @@ import {
   ErrorUtils,
 } from '../../../core';
 import { queryEipList } from '../services/eip-services';
-import { commonMsg } from "../../../assets/i18n";
+import { commonMsg } from '../../../assets/i18n';
 
 export const commandName = '同步弹性公网IP';
 
@@ -56,9 +56,7 @@ export const addEip = async () => {
         colWidths: [6, 20, 20, 20, 15],
       });
     } else {
-      log.info(
-        chalk.magenta(commonMsg.commandAddNullMsg('弹性公网IP', 'eip'))
-      );
+      log.info(chalk.magenta(commonMsg.commandAddNullMsg('弹性公网IP', 'eip')));
     }
     setHwcExports('hwcConfig.eipList', { publicips });
     log.success(`${commandName}成功`);
diff --git a/packages/plugins/hwc/src/lib/hwc-fg/commands/add.ts b/packages/plugins/hwc/src/lib/hwc-fg/commands/add.ts
index cb9590db..912c118c 100644
--- a/packages/plugins/hwc/src/lib/hwc-fg/commands/add.ts
+++ b/packages/plugins/hwc/src/lib/hwc-fg/commands/add.ts
@@ -9,7 +9,7 @@ import {
 } from '../../../core';
 import { commonMsg } from '../../../assets/i18n';
 import { queryFunctions } from '../services/fg-services';
-import { cliConfig as tinyStageCliConfig, logs } from "@opentiny/cli-devkit";
+import { cliConfig as tinyStageCliConfig, logs } from '@opentiny/cli-devkit';
 
 export const commandName = '同步线上函数工作流';
 
diff --git a/packages/plugins/hwc/src/lib/hwc-fg/commands/create.ts b/packages/plugins/hwc/src/lib/hwc-fg/commands/create.ts
index f6888ceb..7f7a5a22 100644
--- a/packages/plugins/hwc/src/lib/hwc-fg/commands/create.ts
+++ b/packages/plugins/hwc/src/lib/hwc-fg/commands/create.ts
@@ -1,6 +1,10 @@
 import { logs, cliConfig as tinyStageCliConfig } from '@opentiny/cli-devkit';
 import chalk from 'chalk';
-import { getCreateDBConfigQuestions, getCreateQuestions, getCreateRuntimeQuestions } from '../questions';
+import {
+  getCreateDBConfigQuestions,
+  getCreateQuestions,
+  getCreateRuntimeQuestions,
+} from '../questions';
 import { createFg, queryFunctions } from '../services/fg-services';
 import { createDBCfg } from './db-cfg-create';
 import {
diff --git a/packages/plugins/hwc/src/lib/hwc-fg/commands/db-cfg-create.ts b/packages/plugins/hwc/src/lib/hwc-fg/commands/db-cfg-create.ts
index 40e9282a..6980dda3 100644
--- a/packages/plugins/hwc/src/lib/hwc-fg/commands/db-cfg-create.ts
+++ b/packages/plugins/hwc/src/lib/hwc-fg/commands/db-cfg-create.ts
@@ -1,7 +1,19 @@
-import { cliConfig as tinyStageCliConfig, fs, logs } from '@opentiny/cli-devkit';
+import {
+  cliConfig as tinyStageCliConfig,
+  fs,
+  logs,
+} from '@opentiny/cli-devkit';
 import chalk from 'chalk';
-import { getDBCfgCreateQuestions, getDBListQuestions, getPasswordAndDirQuestions } from '../questions';
-import { databaseCreate, queryDatabaseLists, queryInstances,} from '../../hwc-mysql/services';
+import {
+  getDBCfgCreateQuestions,
+  getDBListQuestions,
+  getPasswordAndDirQuestions,
+} from '../questions';
+import {
+  databaseCreate,
+  queryDatabaseLists,
+  queryInstances,
+} from '../../hwc-mysql/services';
 import { databaseQuestions } from '../../hwc-mysql/questions';
 import {
   CONSTANTS,
@@ -76,7 +88,12 @@ export const createDBCfg = async () => {
   }
 };
 
-async function startCreateDBProcess(msg: string, instanceId: string, cliConfig, ans) {
+async function startCreateDBProcess(
+  msg: string,
+  instanceId: string,
+  cliConfig,
+  ans
+) {
   console.log(chalk.yellow(fmtDashTitle(msg)));
   const databaseQuest = await databaseQuestions();
   const databaseInfo = await inquirer.prompt(databaseQuest, {
diff --git a/packages/plugins/hwc/src/lib/hwc-fg/questions.ts b/packages/plugins/hwc/src/lib/hwc-fg/questions.ts
index ab46dc75..1bf6826f 100644
--- a/packages/plugins/hwc/src/lib/hwc-fg/questions.ts
+++ b/packages/plugins/hwc/src/lib/hwc-fg/questions.ts
@@ -8,7 +8,12 @@ import {
   InstanceInfo,
 } from '../hwc.types';
 import { queryFunctions } from './services/fg-services';
-import { getTinyProConfigure, REG_FG_NAME, REG_FG_DEP_NAME, REG_LETTER_NUMBER } from '../../core';
+import {
+  getTinyProConfigure,
+  REG_FG_NAME,
+  REG_FG_DEP_NAME,
+  REG_LETTER_NUMBER,
+} from '../../core';
 
 export async function getCreateQuestions(fgRuntime) {
   const cliConfig = getTinyProConfigure();
@@ -175,7 +180,8 @@ export function getCreateDepQuestions(
         if (existDeps.find((dep) => dep.name === name)) {
           return '依赖包名称已存在，请重新输入';
         }
-        return REG_FG_DEP_NAME.test(name) && REG_LETTER_NUMBER.test(name.slice(-1))
+        return REG_FG_DEP_NAME.test(name) &&
+          REG_LETTER_NUMBER.test(name.slice(-1))
           ? true
           : '依赖包名称格式错误';
       },
@@ -232,7 +238,8 @@ export function getUpdateDepQuestions(
         ) {
           return '依赖包名称已存在，请重新输入';
         }
-        return REG_FG_DEP_NAME.test(name) && REG_LETTER_NUMBER.test(name.slice(-1))
+        return REG_FG_DEP_NAME.test(name) &&
+          REG_LETTER_NUMBER.test(name.slice(-1))
           ? true
           : '依赖包名称格式错误';
       },
diff --git a/packages/plugins/hwc/src/lib/hwc-obs/commands/add.ts b/packages/plugins/hwc/src/lib/hwc-obs/commands/add.ts
index 3aade536..28df4383 100644
--- a/packages/plugins/hwc/src/lib/hwc-obs/commands/add.ts
+++ b/packages/plugins/hwc/src/lib/hwc-obs/commands/add.ts
@@ -77,6 +77,8 @@ export const addObs = async () => {
     setHwcExports('hwcConfig.obs', { bucketsList });
     log.success(`${commandName}成功`);
   } catch (err) {
-    log.error(`${obsMsg.obsTermGetListErrMsg}：${ErrorUtils.getErrorMessage(err)}`);
+    log.error(
+      `${obsMsg.obsTermGetListErrMsg}：${ErrorUtils.getErrorMessage(err)}`
+    );
   }
 };
diff --git a/packages/plugins/hwc/src/lib/hwc-obs/commands/create.ts b/packages/plugins/hwc/src/lib/hwc-obs/commands/create.ts
index d9e627e5..e0408e35 100644
--- a/packages/plugins/hwc/src/lib/hwc-obs/commands/create.ts
+++ b/packages/plugins/hwc/src/lib/hwc-obs/commands/create.ts
@@ -56,6 +56,8 @@ export const createObs = async () => {
       setHwcExports('hwcConfig.obs', { bucketsList });
     }
   } catch (err) {
-    log.error(`${obsMsg.obsTermCreateErrMsg}：${ErrorUtils.getErrorMessage(err)}`);
+    log.error(
+      `${obsMsg.obsTermCreateErrMsg}：${ErrorUtils.getErrorMessage(err)}`
+    );
   }
 };
diff --git a/packages/plugins/hwc/src/lib/hwc-obs/obs-client.ts b/packages/plugins/hwc/src/lib/hwc-obs/obs-client.ts
index 689860e9..63d7eb96 100644
--- a/packages/plugins/hwc/src/lib/hwc-obs/obs-client.ts
+++ b/packages/plugins/hwc/src/lib/hwc-obs/obs-client.ts
@@ -10,7 +10,6 @@ export const createObsClient = (cliConfig: ITinyProConfig) => {
     secret_access_key: cliConfig.secretAccessKey,
     server,
   };
-  let obsClient;
   let options = { ...clientOptions };
 
   if (proxy) {
@@ -20,7 +19,7 @@ export const createObsClient = (cliConfig: ITinyProConfig) => {
     };
     options = { ...clientOptions, ...proxyOptions };
   }
-  obsClient = new ObsClient(options);
+  const obsClient = new ObsClient(options);
 
   return obsClient;
 };
diff --git a/packages/plugins/hwc/src/lib/hwc-obs/services/obs-service.ts b/packages/plugins/hwc/src/lib/hwc-obs/services/obs-service.ts
index 3ea4dbc7..983c28f2 100644
--- a/packages/plugins/hwc/src/lib/hwc-obs/services/obs-service.ts
+++ b/packages/plugins/hwc/src/lib/hwc-obs/services/obs-service.ts
@@ -19,7 +19,9 @@ export const isBucketExist = (obsClient: any, bucketName: string) => {
       return true;
     })
     .catch((err: any) => {
-      log.error(`${obsMsg.obsTermheadBucketErrMsg}： ${ErrorUtils.getErrorMessage(err)}`);
+      log.error(
+        `${obsMsg.obsTermheadBucketErrMsg}： ${ErrorUtils.getErrorMessage(err)}`
+      );
 
       throw err;
     });
@@ -45,7 +47,9 @@ export const createBucket = (
     })
     .catch((err: any) => {
       // 此处只记录Err，不抛出异常，以免外部重复打印错误
-      log.error(`${obsMsg.obsTermCreateErrMsg}：${ErrorUtils.getErrorMessage(err)}`);
+      log.error(
+        `${obsMsg.obsTermCreateErrMsg}：${ErrorUtils.getErrorMessage(err)}`
+      );
     });
 };
 
@@ -75,7 +79,9 @@ export const getBucketsList = (obsClient: any) => {
     })
     .catch((err: any) => {
       // 此处只记录Err，不抛出异常，以免外部重复打印错误
-      log.error(`${obsMsg.obsTermGetListErrMsg}：${ErrorUtils.getErrorMessage(err)}`);
+      log.error(
+        `${obsMsg.obsTermGetListErrMsg}：${ErrorUtils.getErrorMessage(err)}`
+      );
     });
 };
 
@@ -94,6 +100,8 @@ export const getBucketMetadata = (obsClient: any, bucketName: string) => {
     })
     .catch((err: any) => {
       // 此处只记录Err，不抛出异常，以免外部重复打印错误
-      log.error(`${obsMsg.obsTermGetListErrMsg}：${ErrorUtils.getErrorMessage(err)}`);
+      log.error(
+        `${obsMsg.obsTermGetListErrMsg}：${ErrorUtils.getErrorMessage(err)}`
+      );
     });
 };
diff --git a/packages/plugins/hwc/src/lib/hwc-vpc/commands/add.ts b/packages/plugins/hwc/src/lib/hwc-vpc/commands/add.ts
index eb94207a..d6bf7fb3 100644
--- a/packages/plugins/hwc/src/lib/hwc-vpc/commands/add.ts
+++ b/packages/plugins/hwc/src/lib/hwc-vpc/commands/add.ts
@@ -53,6 +53,8 @@ export const addVpc = async () => {
     setHwcExports('hwcConfig.vpc', { vpcsList });
     log.success(`${commandName}成功`);
   } catch (err) {
-    log.error(`${vpcMsg.vpcTermGetVpcsListErrMsg}：${ErrorUtils.getErrorMessage(err)}`);
+    log.error(
+      `${vpcMsg.vpcTermGetVpcsListErrMsg}：${ErrorUtils.getErrorMessage(err)}`
+    );
   }
 };
diff --git a/packages/plugins/hwc/src/lib/hwc-vpc/commands/security-groups-create.ts b/packages/plugins/hwc/src/lib/hwc-vpc/commands/security-groups-create.ts
index c3f2a9b5..aca70f08 100644
--- a/packages/plugins/hwc/src/lib/hwc-vpc/commands/security-groups-create.ts
+++ b/packages/plugins/hwc/src/lib/hwc-vpc/commands/security-groups-create.ts
@@ -1,7 +1,12 @@
 import inquirer from 'inquirer';
 import chalk from 'chalk';
 import { cliConfig as tinyStageCliConfig, logs } from '@opentiny/cli-devkit';
-import { CONSTANTS, fmtDashTitle, getTinyProConfigure, ErrorUtils } from '../../../core';
+import {
+  CONSTANTS,
+  fmtDashTitle,
+  getTinyProConfigure,
+  ErrorUtils,
+} from '../../../core';
 import { EipValidator } from '../../hwc-eip/services/validate';
 import { createSecurityGroups } from '../services/security-groups-service';
 
@@ -27,7 +32,7 @@ async function promptSecurityGroups() {
   return inquirer.prompt(questions);
 }
 
-export const  securityGroupsCreate =  async () => {
+export const securityGroupsCreate = async () => {
   const cliConfig = getTinyProConfigure();
 
   console.log(
diff --git a/packages/plugins/link/.eslintrc.js b/packages/plugins/link/.eslintrc.js
deleted file mode 100644
index bd426041..00000000
--- a/packages/plugins/link/.eslintrc.js
+++ /dev/null
@@ -1,22 +0,0 @@
-module.exports = {
-  extends: [],
-  globals: {
-    // 这里填入你的项目需要的全局变量rm -
-    // 这里值为 false 表示这个全局变量不允许被重新赋值，比如：
-    // jQuery: false,
-    // $: true,
-  },
-  rules: {
-    // 这里填入你的项目需要的个性化配置，比如：
-    //
-    // // 一个缩进必须用两个空格替代
-    // 'indent': [
-    //     'error',
-    //     2,
-    //     {
-    //         SwitchCase: 1,
-    //         flatTernaryExpressions: true
-    //     }
-    // ]
-  }
-};
diff --git a/packages/plugins/link/demo/index.ts b/packages/plugins/link/demo/index.ts
index 7495e7df..2d9f28b7 100644
--- a/packages/plugins/link/demo/index.ts
+++ b/packages/plugins/link/demo/index.ts
@@ -14,7 +14,7 @@ import './index.less';
 
 const tinyPluginLink = new TinyPluginLink('#mountNode', {
   id: 123,
-  user: 'xxx'
+  user: 'xxx',
 });
 
 TinyPluginLink.num = 12; // initialize the static variable
diff --git a/packages/plugins/link/src/index.ts b/packages/plugins/link/src/index.ts
index 3124b4e7..6ea56b2a 100644
--- a/packages/plugins/link/src/index.ts
+++ b/packages/plugins/link/src/index.ts
@@ -17,5 +17,5 @@ export default {
   go,
   help,
   init,
-  default: init
+  default: init,
 };
diff --git a/packages/plugins/link/src/lib/go.ts b/packages/plugins/link/src/lib/go.ts
index 63424250..02812752 100644
--- a/packages/plugins/link/src/lib/go.ts
+++ b/packages/plugins/link/src/lib/go.ts
@@ -21,7 +21,7 @@ export interface CliOption {
   clientOptions: any;
 }
 
-export default async function(options?: CliOption) {
+export default async function (options?: CliOption) {
   log.info('控制台输入的参数为： %o', options.clientArgs);
   log.info('控制台输入的选项为： %o', options.clientOptions);
   log.info('这是第一条插件命令111');
diff --git a/packages/plugins/link/src/lib/help.ts b/packages/plugins/link/src/lib/help.ts
index 682b9eb3..2e312294 100644
--- a/packages/plugins/link/src/lib/help.ts
+++ b/packages/plugins/link/src/lib/help.ts
@@ -12,7 +12,7 @@
 import chalk from 'chalk';
 import { cliConfig } from '@opentiny/cli-devkit';
 
-export default function() {
+export default function () {
   const tool = cliConfig.getBinName();
   const help = `
 tiny-plugin-link Plugin help info:  
diff --git a/packages/plugins/lint/src/help.ts b/packages/plugins/lint/src/help.ts
index 9804d4e9..e752e7c1 100644
--- a/packages/plugins/lint/src/help.ts
+++ b/packages/plugins/lint/src/help.ts
@@ -1,7 +1,7 @@
 import chalk from 'chalk';
 import { cliConfig } from '@opentiny/cli-devkit';
 
-export default function() {
+export default function () {
   const tool = cliConfig.getBinName();
   const help = `
 tiny-plugin-lint Plugin help info:  
diff --git a/packages/plugins/lint/src/index.ts b/packages/plugins/lint/src/index.ts
index 6607b8da..83cc324b 100644
--- a/packages/plugins/lint/src/index.ts
+++ b/packages/plugins/lint/src/index.ts
@@ -13,14 +13,14 @@ async function fix(options) {
 
   const { clientOptions = {} } = options;
   const optsArr = [];
-  Object.keys(clientOptions).forEach(key => {
+  Object.keys(clientOptions).forEach((key) => {
     optsArr.push(`--${key}`);
     optsArr.push(clientOptions[key]);
   });
   const paramArr = ['.', '--ext', '.js,.jsx,.ts,.tsx', '--fix'].concat(optsArr);
 
   spawn.sync('./node_modules/eslint/bin/eslint.js', paramArr, {
-    stdio: 'inherit'
+    stdio: 'inherit',
   });
   log.success('fixing eslint syntax，please fix the errors/warnings');
 }
@@ -30,7 +30,7 @@ async function prettier() {
     './node_modules/.bin/prettier',
     ['--write', './**/*.{ts,tsx,css,less,scss}'],
     {
-      stdio: 'inherit'
+      stdio: 'inherit',
     }
   );
   log.success('prettier run scccess!');
@@ -74,7 +74,7 @@ async function checkInitEnv() {
     log.warn('你尚未初始化eslint 环境，请进行先初始化');
     const defaultOption: CliOption = {
       clientOptions: {},
-      clientArgs: {}
+      clientArgs: {},
     };
     await init(defaultOption);
     process.exit(1);
@@ -92,7 +92,7 @@ function report() {
       '-f',
       'html',
       '-o',
-      'eslint-report.html'
+      'eslint-report.html',
     ],
     { stdio: 'inherit' }
   );
@@ -107,5 +107,5 @@ export default {
   prettier,
   report,
   hooks,
-  default: run
+  default: run,
 };
diff --git a/packages/plugins/lint/src/init.ts b/packages/plugins/lint/src/init.ts
index cfcb592b..1360757f 100644
--- a/packages/plugins/lint/src/init.ts
+++ b/packages/plugins/lint/src/init.ts
@@ -45,38 +45,38 @@ async function getEslintType(options: EslintOption = {}): Promise<Answer> {
         choices: [
           {
             name: 'javascript',
-            value: 'index'
+            value: 'index',
           },
           {
             name: 'typescript',
-            value: 'typescript'
+            value: 'typescript',
           },
           {
             name: 'angular',
-            value: 'angular'
+            value: 'angular',
           },
           {
             name: 'angularjs',
-            value: 'angularjs'
+            value: 'angularjs',
           },
           {
             name: 'vue(javascript)',
-            value: 'vue'
+            value: 'vue',
           },
           {
             name: 'vue(typescript)',
-            value: 'vue-ts'
+            value: 'vue-ts',
           },
           {
             name: 'react(javascript)',
-            value: 'react'
+            value: 'react',
           },
           {
             name: 'react(typescript)',
-            value: 'react-ts'
-          }
-        ]
-      }
+            value: 'react-ts',
+          },
+        ],
+      },
     ]);
   }
   return answers;
@@ -89,7 +89,7 @@ export interface CliOption {
   clientOptions: any;
 }
 
-export default async function(options?: CliOption) {
+export default async function (options?: CliOption) {
   const answers: Answer = await getEslintType(options.clientOptions);
   const from = utils.getTemplatePath();
   const to = utils.getDistPath();
@@ -112,7 +112,7 @@ export default async function(options?: CliOption) {
       './node_modules/.bin/prettier --write ./**/*.{ts,tsx,css,less,scss}',
     stylelint:
       './node_modules/.bin/stylelint ./src/**/*.scss ./src/**/*.less ./src/**/*.css --fix',
-    lint: 'npm run eslint && npm run prettier && npm run stylelint'
+    lint: 'npm run eslint && npm run prettier && npm run stylelint',
   });
   fs.writePackage(pkg);
   // 额外包写入
@@ -120,7 +120,7 @@ export default async function(options?: CliOption) {
     typescript: [
       'typescript@~4.8.4',
       '@typescript-eslint/parser@5.52.0',
-      '@typescript-eslint/eslint-plugin@5.53.0'
+      '@typescript-eslint/eslint-plugin@5.53.0',
     ],
     react: ['eslint-plugin-react@7.18.3'],
     vue: ['vue-eslint-parser@7.3.0', 'eslint-plugin-vue@7.3.0'],
@@ -129,8 +129,8 @@ export default async function(options?: CliOption) {
       'typescript@~4.8.4',
       '@typescript-eslint/parser@5.52.0',
       '@typescript-eslint/eslint-plugin@5.53.0',
-      'eslint-plugin-rxjs'
-    ]
+      'eslint-plugin-rxjs',
+    ],
   };
   // 完整依赖
   const depen = [
@@ -140,12 +140,12 @@ export default async function(options?: CliOption) {
     'prettier',
     'cross-spawn',
     'stylelint',
-    'stylelint-config-standard'
+    'stylelint-config-standard',
   ].concat(extra[answers.type] || []);
   // 安装最新的eslint依赖
   await npm.install(depen, {
     // 写入 devDependencies
-    'save-dev': true
+    'save-dev': true,
   });
   // 写入pre-commit
   if (fs.existsSync(path.join(cwd, '.git'))) {
diff --git a/packages/plugins/lint/src/utils.ts b/packages/plugins/lint/src/utils.ts
index c30b5b18..3c00f5fc 100644
--- a/packages/plugins/lint/src/utils.ts
+++ b/packages/plugins/lint/src/utils.ts
@@ -4,7 +4,7 @@ import { fs } from '@opentiny/cli-devkit';
 const cwd = process.cwd();
 
 function firstUpperCase(str: string) {
-  return str.replace(/^\S/, s => s.toUpperCase());
+  return str.replace(/^\S/, (s) => s.toUpperCase());
 }
 
 /**
@@ -37,10 +37,7 @@ export function generateNames(name: string) {
     className: camelTrans(name, true),
 
     // 全大写
-    constName: name
-      .split('-')
-      .join('')
-      .toUpperCase()
+    constName: name.split('-').join('').toUpperCase(),
   };
 }
 
@@ -73,5 +70,5 @@ export default {
   getDistPath,
   getTemplatePath,
   generateNames,
-  addPreCommitHook
+  addPreCommitHook,
 };
diff --git a/packages/toolkits/dev/src/index.ts b/packages/toolkits/dev/src/index.ts
index 141ef6ee..38e715a3 100644
--- a/packages/toolkits/dev/src/index.ts
+++ b/packages/toolkits/dev/src/index.ts
@@ -21,5 +21,5 @@ export default {
   help,
   build,
   temp,
-  default: help
+  default: help,
 };
diff --git a/packages/toolkits/dev/src/lib/build.ts b/packages/toolkits/dev/src/lib/build.ts
index 6dc9ad14..8fa50bb4 100644
--- a/packages/toolkits/dev/src/lib/build.ts
+++ b/packages/toolkits/dev/src/lib/build.ts
@@ -9,5 +9,4 @@
  * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
  *
  */
-export default function () {
-}
+export default function () {}
diff --git a/packages/toolkits/dev/src/lib/help.ts b/packages/toolkits/dev/src/lib/help.ts
index 909933e3..cb8534d5 100644
--- a/packages/toolkits/dev/src/lib/help.ts
+++ b/packages/toolkits/dev/src/lib/help.ts
@@ -14,7 +14,7 @@
 import chalk from 'chalk';
 import { cliConfig } from '@opentiny/cli-devkit';
 
-export default function() {
+export default function () {
   const tool = cliConfig.getBinName();
   const help = `
 tiny-toolkit-dev Plugin help info:  
diff --git a/packages/toolkits/dev/src/lib/init.ts b/packages/toolkits/dev/src/lib/init.ts
index b3c27bcb..307fb445 100644
--- a/packages/toolkits/dev/src/lib/init.ts
+++ b/packages/toolkits/dev/src/lib/init.ts
@@ -31,13 +31,13 @@ export default async () => {
       choices: [
         {
           name: `${prefix}套件 ---- 用于生成项目模板`,
-          value: 'toolkit'
+          value: 'toolkit',
         },
         {
           name: `${prefix}插件 ---- 用于拓展${prefix}功能`,
-          value: 'plugin'
-        }
-      ]
+          value: 'plugin',
+        },
+      ],
     },
     {
       type: 'input',
@@ -58,8 +58,8 @@ export default async () => {
           return `${prefix} 套件名称需要 ${prefix}-toolkit- 开头`;
         }
         return true;
-      }
-    }
+      },
+    },
   ]);
 
   const from = utils.getTemplatePath(answers.type);
@@ -82,7 +82,7 @@ export default async () => {
     // 完整的插件名称 ， 如 tiny-plugin-npm
     pluginName,
     pluginShortName,
-    pluginFullname: fullName
+    pluginFullname: fullName,
   };
 
   fs.copyTpl(from, to, data, {
@@ -93,7 +93,7 @@ export default async () => {
         filename = `${prefix}.config.js`;
       }
       return filename;
-    }
+    },
   });
 
   if (answers.type === 'plugin') {
@@ -120,7 +120,7 @@ export default async () => {
     await npm.installDependencies();
     // 独立安装devkit ，保证该模块使用的是当前最新版本
     await npm.install('@opentiny/cli-devkit', {
-      save: true
+      save: true,
     });
   } catch (e) {
     log.error('npm 依赖安装失败');
diff --git a/packages/toolkits/dev/src/lib/temp.ts b/packages/toolkits/dev/src/lib/temp.ts
index a13150b4..46279a4b 100644
--- a/packages/toolkits/dev/src/lib/temp.ts
+++ b/packages/toolkits/dev/src/lib/temp.ts
@@ -13,11 +13,8 @@
 
 // const pkg = require('../../../package.json')
 
-export default () =>{
-
+export default () => {
   // console.log(pkg)
-
-
   // a({
   //   name: 'shell-quote',
   //   version: '1.6.1',
@@ -63,4 +60,4 @@ export default () =>{
   //     'array-map': '~0.0.0'
   //   }
   // })
-}
\ No newline at end of file
+};
diff --git a/packages/toolkits/dev/src/lib/utils.spec.ts b/packages/toolkits/dev/src/lib/utils.spec.ts
index a6983384..8d31cb95 100644
--- a/packages/toolkits/dev/src/lib/utils.spec.ts
+++ b/packages/toolkits/dev/src/lib/utils.spec.ts
@@ -12,7 +12,7 @@
 import test from 'ava';
 import { generateNames } from './utils';
 
-test('# generateNames', t => {
+test('# generateNames', (t) => {
   const name = generateNames('abc-def');
   t.is('abcDef', name.varName);
   t.is('ABCDEF', name.constName);
diff --git a/packages/toolkits/dev/src/lib/utils.ts b/packages/toolkits/dev/src/lib/utils.ts
index 29d29933..da199c25 100644
--- a/packages/toolkits/dev/src/lib/utils.ts
+++ b/packages/toolkits/dev/src/lib/utils.ts
@@ -15,7 +15,7 @@ import { modules, cache } from '@opentiny/cli-devkit';
 const cwd = process.cwd();
 
 function firstUpperCase(str: string) {
-  return str.replace(/^\S/, s => s.toUpperCase());
+  return str.replace(/^\S/, (s) => s.toUpperCase());
 }
 
 /**
@@ -48,10 +48,7 @@ export function generateNames(name: string) {
     className: camelTrans(name, true),
 
     // 全大写
-    constName: name
-      .split('-')
-      .join('')
-      .toUpperCase()
+    constName: name.split('-').join('').toUpperCase(),
   };
 }
 
@@ -80,14 +77,13 @@ export function setModuleCache(name: string) {
   // 写一下缓存，避免未发布时一直去线上拉数据
   const cacheKey = `${modules.utils.UPDATE_CHECK_PRE}${name}`;
   cache.set(cacheKey, true, {
-    expires: modules.utils.NO_TIP_PERIOD * 10
+    expires: modules.utils.NO_TIP_PERIOD * 10,
   });
 }
 
-
 export default {
   getDistPath,
   getTemplatePath,
   generateNames,
-  setModuleCache
+  setModuleCache,
 };
diff --git a/packages/toolkits/dev/template/plugin/src/index.ts b/packages/toolkits/dev/template/plugin/src/index.ts
index 6385cf5a..49dcc89e 100644
--- a/packages/toolkits/dev/template/plugin/src/index.ts
+++ b/packages/toolkits/dev/template/plugin/src/index.ts
@@ -4,5 +4,5 @@ import help from './lib/help';
 export default {
   go,
   help,
-  default: help
-}
\ No newline at end of file
+  default: help,
+};
diff --git a/packages/toolkits/dev/template/plugin/src/lib/demo.spec.ts b/packages/toolkits/dev/template/plugin/src/lib/demo.spec.ts
index 64edaa61..84280ca2 100644
--- a/packages/toolkits/dev/template/plugin/src/lib/demo.spec.ts
+++ b/packages/toolkits/dev/template/plugin/src/lib/demo.spec.ts
@@ -2,13 +2,13 @@ import test from 'ava';
 
 // 基于ava的单元测试 demo文件，单元测试文件以 .spec.ts 结尾
 
-function demoTest(value:string){
+function demoTest(value: string) {
   // tslint:disable-next-line: prefer-template
   return value + '1';
 }
 
 // 简单的单元测试例子
-test('# demo test', t => {
+test('# demo test', (t) => {
   const name = demoTest('abc-def');
   t.is('abc-def1', name);
-})
\ No newline at end of file
+});
diff --git a/packages/toolkits/dev/template/plugin/src/lib/go.ts b/packages/toolkits/dev/template/plugin/src/lib/go.ts
index 06170858..375d69a4 100644
--- a/packages/toolkits/dev/template/plugin/src/lib/go.ts
+++ b/packages/toolkits/dev/template/plugin/src/lib/go.ts
@@ -5,13 +5,13 @@ const log = logs('<%=pluginName%>');
 /**
  * 控制台传入的参数
  */
-export interface CliOption{
-  clientArgs:any,
-  clientOptions:any
+export interface CliOption {
+  clientArgs: any;
+  clientOptions: any;
 }
 
 export default async function (options?: CliOption) {
   log.info('控制台输入的参数为： %o', options.clientArgs);
   log.info('控制台输入的选项为： %o', options.clientOptions);
   log.info('这是第一条插件命令');
-};
+}
diff --git a/packages/toolkits/dev/template/plugin/src/lib/help.ts b/packages/toolkits/dev/template/plugin/src/lib/help.ts
index 57df4746..25a60c5c 100644
--- a/packages/toolkits/dev/template/plugin/src/lib/help.ts
+++ b/packages/toolkits/dev/template/plugin/src/lib/help.ts
@@ -3,8 +3,7 @@ import { cliConfig } from '@opentiny/cli-devkit';
 
 export default function () {
   const tool = cliConfig.getBinName();
-  const help =
-    `
+  const help = `
 <%=pluginName%> Plugin help info:  
 
  $ ${tool} <%= pluginShortName %> go                   # The first command
@@ -12,4 +11,4 @@ export default function () {
  
 `;
   process.stdout.write(chalk.magenta(help));
-};
+}
diff --git a/packages/toolkits/dev/template/toolkit/src/index.ts b/packages/toolkits/dev/template/toolkit/src/index.ts
index 66f58f51..777ad720 100644
--- a/packages/toolkits/dev/template/toolkit/src/index.ts
+++ b/packages/toolkits/dev/template/toolkit/src/index.ts
@@ -8,5 +8,5 @@ export default {
   build,
   init,
   help,
-  default: help
+  default: help,
 };
diff --git a/packages/toolkits/dev/template/toolkit/src/lib/build.ts b/packages/toolkits/dev/template/toolkit/src/lib/build.ts
index ac48cf96..068a5d15 100644
--- a/packages/toolkits/dev/template/toolkit/src/lib/build.ts
+++ b/packages/toolkits/dev/template/toolkit/src/lib/build.ts
@@ -7,7 +7,6 @@ import { CliOption } from './interfaces';
 const log = logs('<%=pluginName%>');
 const cwd = process.cwd();
 
-
 export default function (options?: CliOption) {
   log.info('控制台输入的参数为： %o', options.clientArgs);
   log.info('控制台输入的选项为： %o', options.clientOptions);
@@ -18,10 +17,11 @@ export default function (options?: CliOption) {
   }
 
   log.info('项目打包中...');
-  const cli = spawn('./node_modules/.bin/webpack', [
-    '--config',
-    './webpack.config.js'
-  ], { stdio: 'inherit' });
+  const cli = spawn(
+    './node_modules/.bin/webpack',
+    ['--config', './webpack.config.js'],
+    { stdio: 'inherit' }
+  );
 
   cli.on('close', (status) => {
     if (status === 0) {
@@ -30,4 +30,4 @@ export default function (options?: CliOption) {
       log.error('打包失败', status);
     }
   });
-};
+}
diff --git a/packages/toolkits/dev/template/toolkit/src/lib/demo.spec.ts b/packages/toolkits/dev/template/toolkit/src/lib/demo.spec.ts
index cecc7b8c..84280ca2 100644
--- a/packages/toolkits/dev/template/toolkit/src/lib/demo.spec.ts
+++ b/packages/toolkits/dev/template/toolkit/src/lib/demo.spec.ts
@@ -8,7 +8,7 @@ function demoTest(value: string) {
 }
 
 // 简单的单元测试例子
-test('# demo test', t => {
+test('# demo test', (t) => {
   const name = demoTest('abc-def');
   t.is('abc-def1', name);
 });
diff --git a/packages/toolkits/dev/template/toolkit/src/lib/help.ts b/packages/toolkits/dev/template/toolkit/src/lib/help.ts
index 5fdd0de6..a2912ce7 100644
--- a/packages/toolkits/dev/template/toolkit/src/lib/help.ts
+++ b/packages/toolkits/dev/template/toolkit/src/lib/help.ts
@@ -1,7 +1,7 @@
 import chalk from 'chalk';
 import { cliConfig } from '@opentiny/cli-devkit';
 
-export default function() {
+export default function () {
   const tool = cliConfig.getBinName();
   const help = `
 <%= pluginName %> Toolkit help info:  ${tool} [command] [option] 
@@ -12,4 +12,4 @@ export default function() {
  
 `;
   process.stdout.write(chalk.magenta(help));
-}
\ No newline at end of file
+}
diff --git a/packages/toolkits/dev/template/toolkit/src/lib/init.ts b/packages/toolkits/dev/template/toolkit/src/lib/init.ts
index 2156cab5..c7ba91d0 100644
--- a/packages/toolkits/dev/template/toolkit/src/lib/init.ts
+++ b/packages/toolkits/dev/template/toolkit/src/lib/init.ts
@@ -14,7 +14,7 @@ export default async () => {
   // 当前项目名称集合
   const dirName = cwd.split(path.sep).pop();
   const names = utils.generateNames(dirName);
-  const fullName = modules.utils.toolkitFullName(dirName)
+  const fullName = modules.utils.toolkitFullName(dirName);
 
   const data = {
     ...user.get(),
@@ -23,7 +23,7 @@ export default async () => {
     pluginName: fullName.replace(cliConfig.getScope(), ''),
     prefix,
     pluginShortName: dirName,
-    pluginFullname: fullName
+    pluginFullname: fullName,
   };
   fs.copyTpl(from, to, data, {
     // 改一下名称，兼容其他cli工具的情况
@@ -33,10 +33,9 @@ export default async () => {
         filename = `${prefix}.config.js`;
       }
       return filename;
-    }
+    },
   });
 
-
   // npm 依赖安装
   log.info('正在安装 npm 依赖，安装过程需要几十秒，请耐心等待...');
   try {
@@ -48,13 +47,38 @@ export default async () => {
   }
   log.success('npm 依赖安装成功');
 
-/* prettier-ignore-start */
-  console.log(chalk.yellow('\n--------------------初始化成功,请按下面提示进行操作--------------------\n'));
-  console.log(chalk.green(`${chalk.yellow(`$ ${prefix} start`)}         # 可一键开启项目开发环境`));
-  console.log(chalk.green(`${chalk.yellow(`$ ${prefix} git create`)}    # 可自动在gitlab上创建仓库`));
-  console.log(chalk.green(`${chalk.yellow(`$ ${prefix} help`)}          # 可查看当前套件的详细帮助`));
-  console.log(chalk.green(`\n建议将现有初始化的代码提交一次到master分支, 方便后续切换到 ${chalk.yellow('daily/x.y.z')} 分支进行开发`));
-  console.log(chalk.yellow('\n--------------------技术支持: @<%= name %>--------------------\n'));
-/* prettier-ignore-end */
-
+  /* prettier-ignore-start */
+  console.log(
+    chalk.yellow(
+      '\n--------------------初始化成功,请按下面提示进行操作--------------------\n'
+    )
+  );
+  console.log(
+    chalk.green(
+      `${chalk.yellow(`$ ${prefix} start`)}         # 可一键开启项目开发环境`
+    )
+  );
+  console.log(
+    chalk.green(
+      `${chalk.yellow(`$ ${prefix} git create`)}    # 可自动在gitlab上创建仓库`
+    )
+  );
+  console.log(
+    chalk.green(
+      `${chalk.yellow(`$ ${prefix} help`)}          # 可查看当前套件的详细帮助`
+    )
+  );
+  console.log(
+    chalk.green(
+      `\n建议将现有初始化的代码提交一次到master分支, 方便后续切换到 ${chalk.yellow(
+        'daily/x.y.z'
+      )} 分支进行开发`
+    )
+  );
+  console.log(
+    chalk.yellow(
+      '\n--------------------技术支持: @<%= name %>--------------------\n'
+    )
+  );
+  /* prettier-ignore-end */
 };
diff --git a/packages/toolkits/dev/template/toolkit/src/lib/interfaces.ts b/packages/toolkits/dev/template/toolkit/src/lib/interfaces.ts
index eb9edc78..fa81f3af 100644
--- a/packages/toolkits/dev/template/toolkit/src/lib/interfaces.ts
+++ b/packages/toolkits/dev/template/toolkit/src/lib/interfaces.ts
@@ -4,4 +4,4 @@
 export interface CliOption {
   clientArgs: any;
   clientOptions: any;
-}
\ No newline at end of file
+}
diff --git a/packages/toolkits/dev/template/toolkit/src/lib/start.ts b/packages/toolkits/dev/template/toolkit/src/lib/start.ts
index 5fa1fcf2..928c424a 100644
--- a/packages/toolkits/dev/template/toolkit/src/lib/start.ts
+++ b/packages/toolkits/dev/template/toolkit/src/lib/start.ts
@@ -8,7 +8,6 @@ const log = logs('<%=pluginName%>');
 const cwd = process.cwd();
 
 export default function () {
-
   const toolkitConfig = config.get('toolkitConfig');
 
   if (!fs.existsSync(path.resolve(cwd, 'webpack.config.js'))) {
@@ -16,17 +15,18 @@ export default function () {
     return;
   }
 
-  spawn('./node_modules/.bin/webpack-dev-server', [
-    '--config',
-    './webpack.config.js',
-    '--port',
-    toolkitConfig.port
-  ], { stdio: 'inherit' });
+  spawn(
+    './node_modules/.bin/webpack-dev-server',
+    ['--config', './webpack.config.js', '--port', toolkitConfig.port],
+    { stdio: 'inherit' }
+  );
 
   if (toolkitConfig.open) {
     // 开服务器比较慢,给它留点时间buffer
     setTimeout(() => {
-      open(`http://127.0.0.1:${toolkitConfig.port}/${toolkitConfig.openTarget}`);
+      open(
+        `http://127.0.0.1:${toolkitConfig.port}/${toolkitConfig.openTarget}`
+      );
     }, 500);
   }
-};
+}
diff --git a/packages/toolkits/dev/template/toolkit/src/lib/utils.ts b/packages/toolkits/dev/template/toolkit/src/lib/utils.ts
index 90bf5841..8e63d522 100644
--- a/packages/toolkits/dev/template/toolkit/src/lib/utils.ts
+++ b/packages/toolkits/dev/template/toolkit/src/lib/utils.ts
@@ -4,7 +4,7 @@ import { modules, cache } from '@opentiny/cli-devkit';
 const cwd = process.cwd();
 
 function firstUpperCase(str: string) {
-  return str.replace(/^\S/, s => s.toUpperCase());
+  return str.replace(/^\S/, (s) => s.toUpperCase());
 }
 
 /**
@@ -37,10 +37,7 @@ export function generateNames(name: string) {
     className: camelTrans(name, true),
 
     // 全大写
-    constName: name
-      .split('-')
-      .join('')
-      .toUpperCase()
+    constName: name.split('-').join('').toUpperCase(),
   };
 }
 
@@ -69,7 +66,7 @@ export function setModuleCache(name: string) {
   // 写一下缓存，避免未发布时一直去线上拉数据
   const cacheKey = `${modules.utils.UPDATE_CHECK_PRE}${name}`;
   cache.set(cacheKey, true, {
-    expires: modules.utils.NO_TIP_PERIOD * 10
+    expires: modules.utils.NO_TIP_PERIOD * 10,
   });
 }
 
@@ -77,5 +74,5 @@ export default {
   getDistPath,
   getTemplatePath,
   generateNames,
-  setModuleCache
+  setModuleCache,
 };
diff --git a/packages/toolkits/dev/template/toolkit/template/root/src/index.ts b/packages/toolkits/dev/template/toolkit/template/root/src/index.ts
index e98763ef..97eb0c91 100644
--- a/packages/toolkits/dev/template/toolkit/template/root/src/index.ts
+++ b/packages/toolkits/dev/template/toolkit/template/root/src/index.ts
@@ -1 +1 @@
-console.log(123)
\ No newline at end of file
+console.log(123);
diff --git a/packages/toolkits/docs/src/index.ts b/packages/toolkits/docs/src/index.ts
index 7b3d375a..4cb21d46 100644
--- a/packages/toolkits/docs/src/index.ts
+++ b/packages/toolkits/docs/src/index.ts
@@ -19,5 +19,5 @@ export default {
   build,
   init,
   help,
-  default: help
+  default: help,
 };
diff --git a/packages/toolkits/docs/src/lib/help.ts b/packages/toolkits/docs/src/lib/help.ts
index 24b79b66..d88363cc 100644
--- a/packages/toolkits/docs/src/lib/help.ts
+++ b/packages/toolkits/docs/src/lib/help.ts
@@ -12,7 +12,7 @@
 import chalk from 'chalk';
 import { cliConfig } from '@opentiny/cli-devkit';
 
-export default function() {
+export default function () {
   const tool = cliConfig.getBinName();
   const help = `
 @/tiny-toolkit-docs Toolkit help info:  ${tool} [command] [option] 
diff --git a/packages/toolkits/docs/template/ng/demos/scripts/styles.css b/packages/toolkits/docs/template/ng/demos/scripts/styles.css
index cca41689..7d1e72d6 100644
--- a/packages/toolkits/docs/template/ng/demos/scripts/styles.css
+++ b/packages/toolkits/docs/template/ng/demos/scripts/styles.css
@@ -1 +1,814 @@
-body{margin:0;padding:0;font-size:var(--ti-common-font-size-base);font-family:var(--ti-common-font-family);color:var(--ti-common-color-text-primary);background-color:var(--ti-common-color-bg-white-normal)}button,blockquote,div,section,h1,h2,h3,h4,h5,h6,ul,ol,dl,dt,dd,li,pre,code,form,fieldset,legend,input,textarea,th,td,p,select{margin:0;padding:0}input{vertical-align:middle}fieldset,img{border:0}button,input,textarea{font-family:inherit;font-size:100%;margin:0}button{line-height:normal}textarea{overflow:auto;vertical-align:top;resize:vertical}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:400}ol,ul{list-style:none}q:before{content:""}q:after{content:""}abbr,acronym{border:0;font-feature-settings:normal;font-variant:normal}b,strong{font-weight:700}sub{position:relative;font-size:75%;line-height:0;vertical-align:baseline;bottom:-.25em}sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline;top:-.5em}a{background-color:transparent}label{margin-bottom:0;font-weight:400}table{border-spacing:0 0;border-collapse:collapse;margin-bottom:0}figcaption,figure,hgroup,article,footer,header,nav,section,aside,menu,main,details,summary{display:block}button::-moz-focus-inner{padding:0;border:none}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}input::-ms-clear{width:0;height:0}input[type=password]::-ms-reveal{width:0;height:0}::-webkit-input-placeholder{color:var(--ti-common-color-text-disabled);text-overflow:initial!important}::-moz-placeholder{color:var(--ti-common-color-text-disabled);opacity:1;text-overflow:initial}:-moz-placeholder{color:var(--ti-common-color-text-disabled);opacity:1}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:var(--ti-common-color-text-disabled)!important}input.ng-invalid.ng-touched[tiBlurCheck]:not([tiFocused]),textarea.ng-invalid.ng-touched[tiBlurCheck]:not([tiFocused]),[tiForm].ng-invalid.ng-touched[tiBlurCheck]:not([tiFocused]),input.ng-invalid.ng-dirty[tiBlurCheck]:not([tiFocused]),textarea.ng-invalid.ng-dirty[tiBlurCheck]:not([tiFocused]),[tiForm].ng-invalid.ng-dirty[tiBlurCheck]:not([tiFocused]),input.ng-invalid.ng-touched:not([tiBlurCheck]):not([tiRadiobaseCheck]),textarea.ng-invalid.ng-touched:not([tiBlurCheck]):not([tiRadiobaseCheck]),[tiForm].ng-invalid.ng-touched:not([tiBlurCheck]):not([tiRadiobaseCheck]),input.ng-invalid.ng-dirty:not([tiBlurCheck]):not([tiRadiobaseCheck]),textarea.ng-invalid.ng-dirty:not([tiBlurCheck]):not([tiRadiobaseCheck]),[tiForm].ng-invalid.ng-dirty:not([tiBlurCheck]):not([tiRadiobaseCheck]){border-color:var(--ti-common-color-error-border)!important;background-color:var(--ti-common-color-error-bg)}:root{--ti-base-color-white: #FFFFFF;--ti-base-color-brand-6: #5E7CE0;--ti-base-color-brand-8: #344899;--ti-base-color-brand-7: #526ECC;--ti-base-color-brand-5: #7693F5;--ti-base-color-brand-4: #96ADFA;--ti-base-color-brand-3: #BECCFA;--ti-base-color-brand-2: #E9EDFA;--ti-base-color-brand-1: #F2F5FC;--ti-base-color-common-9: #181818;--ti-base-color-common-8: #282B33;--ti-base-color-common-7: #252B3A;--ti-base-color-common-6: #464C59;--ti-base-color-common-5: #575D6C;--ti-base-color-common-4: #5C6173;--ti-base-color-common-3: #8A8E99;--ti-base-color-common-2: #ADB0B8;--ti-base-color-common-1: #DFE1E6;--ti-base-color-bg-9: #B12220;--ti-base-color-bg-8: #C7000B;--ti-base-color-bg-7: #D64A52;--ti-base-color-bg-6: #EEF0F5;--ti-base-color-bg-5: #F5F5F6;--ti-base-color-bg-4: #FAFAFA;--ti-base-color-bg-3: #FFFFFF;--ti-base-color-bg-2: #FFFFFF;--ti-base-color-bg-1: #FFFFFF;--ti-base-color-error-4: #DE504E;--ti-base-color-error-3: #F66F6A;--ti-base-color-error-2: #FFBCBA;--ti-base-color-error-1: #FFEEED;--ti-base-color-success-4: #3AC295;--ti-base-color-success-3: #50D4AB;--ti-base-color-success-2: #ACF2DC;--ti-base-color-success-1: #EDFFF9;--ti-base-color-warn-5: #E37D29;--ti-base-color-warn-4: #FA9841;--ti-base-color-warn-3: #FAC20A;--ti-base-color-warn-2: #FFD0A6;--ti-base-color-warn-1: #FFF3E8;--ti-base-color-prompt-4: var(--ti-base-color-brand-7);--ti-base-color-prompt-3: var(--ti-base-color-brand-6);--ti-base-color-prompt-2: var(--ti-base-color-brand-3);--ti-base-color-prompt-1: #EBF6FF;--ti-base-color-prompt-icon-from: #7769E8;--ti-base-color-prompt-icon-to: #58BBFF;--ti-base-color-icon-info: #6CBFFF;--ti-base-color-data-3: #A6DD82;--ti-base-color-data-4: #F3689A;--ti-base-color-data-5: #A97AF8;--ti-base-color-transparent: transparent;--ti-common-color-success: var(--ti-base-color-success-3);--ti-common-color-text-success: var(--ti-base-color-success-4);--ti-common-color-success-bg: var(--ti-base-color-success-1);--ti-common-color-success-border: var(--ti-base-color-success-2);--ti-common-color-error: var(--ti-base-color-error-3);--ti-common-color-error-text: var(--ti-base-color-error-4);--ti-common-color-error-bg: var(--ti-base-color-error-1);--ti-common-color-error-border: var(--ti-base-color-error-3);--ti-common-color-error-border-secondary: var(--ti-base-color-error-2);--ti-common-color-warn: var(--ti-base-color-warn-4);--ti-common-color-warn-text: var(--ti-base-color-warn-5);--ti-common-color-warn-bg: var(--ti-base-color-warn-1);--ti-common-color-warn-border: var(--ti-base-color-warn-2);--ti-common-color-warn-secondary: var(--ti-base-color-warn-3);--ti-common-color-prompt: var(--ti-base-color-prompt-3);--ti-common-color-prompt-text: var(--ti-base-color-prompt-4);--ti-common-color-prompt-bg: var(--ti-base-color-prompt-1);--ti-common-color-prompt-border: var(--ti-base-color-prompt-2);--ti-common-color-prompt-icon-from: var(--ti-base-color-prompt-icon-from);--ti-common-color-prompt-icon-to: var(--ti-base-color-prompt-icon-to);--ti-common-color-text-primary: var(--ti-base-color-common-7);--ti-common-color-text-secondary: var(--ti-base-color-common-5);--ti-common-color-text-weaken: var(--ti-base-color-common-3);--ti-common-color-text-disabled: var(--ti-base-color-common-2);--ti-common-color-text-darkbg: var(--ti-base-color-common-2);--ti-common-color-text-darkbg-disabled: var(--ti-base-color-common-5);--ti-common-color-text-link: var(--ti-base-color-brand-7);--ti-common-color-text-link-hover: var(--ti-base-color-brand-8);--ti-common-color-text-link-darkbg: var(--ti-base-color-brand-4);--ti-common-color-text-link-darkbg-hover: var(--ti-base-color-brand-3);--ti-common-color-text-highlight: var(--ti-base-color-brand-7);--ti-common-color-text-white: var(--ti-base-color-white);--ti-common-color-text-gray: var(--ti-base-color-white);--ti-common-color-text-gray-disabled: var(--ti-base-color-common-4);--ti-common-color-text-important: var(--ti-base-color-error-4);--ti-common-color-icon-normal: var(--ti-base-color-common-5);--ti-common-color-icon-hover: var(--ti-base-color-brand-6);--ti-common-color-icon-active: var(--ti-base-color-brand-6);--ti-common-color-icon-disabled: var(--ti-base-color-common-2);--ti-common-color-icon-white: var(--ti-base-color-white);--ti-common-color-icon-graybg-normal: var(--ti-base-color-common-2);--ti-common-color-icon-graybg-hover: var(--ti-base-color-brand-6);--ti-common-color-icon-graybg-active: var(--ti-base-color-brand-6);--ti-common-color-icon-graybg-disabled: var(--ti-base-color-common-1);--ti-common-color-icon-darkbg-normal: var(--ti-base-color-common-2);--ti-common-color-icon-darkbg-hover: var(--ti-base-color-brand-5);--ti-common-color-icon-darkbg-active: var(--ti-base-color-brand-5);--ti-common-color-icon-darkbg-disabled: var(--ti-base-color-common-5);--ti-common-color-icon-info: var(--ti-base-color-icon-info);--ti-common-color-line-normal: var(--ti-base-color-common-2);--ti-common-color-line-hover: var(--ti-base-color-common-5);--ti-common-color-line-active: var(--ti-base-color-brand-6);--ti-common-color-line-disabled: var(--ti-base-color-common-1);--ti-common-color-line-dividing: var(--ti-base-color-common-1);--ti-common-color-dash-line-normal: var(--ti-base-color-common-5);--ti-common-color-dash-line-hover: var(--ti-base-color-brand-7);--ti-common-color-bg-normal: var(--ti-base-color-bg-6);--ti-common-color-bg-emphasize: var(--ti-base-color-brand-6);--ti-common-color-bg-disabled: var(--ti-base-color-bg-5);--ti-common-color-bg-hover: var(--ti-base-color-brand-8);--ti-common-color-bg-gray: var(--ti-base-color-bg-4);--ti-common-color-bg-secondary: var(--ti-base-color-common-2);--ti-common-bg-primary: var(--ti-base-color-bg-8);--ti-common-bg-primary-hover: var(--ti-base-color-bg-7);--ti-common-bg-primary-active: var(--ti-base-color-bg-9);--ti-common-bg-minor: var(--ti-base-color-bg-2);--ti-common-bg-minor-hover: var(--ti-base-color-bg-1);--ti-common-bg-minor-active: var(--ti-base-color-bg-3);--ti-common-color-bg-white-normal: var(--ti-base-color-white);--ti-common-color-bg-white-emphasize: var(--ti-base-color-brand-1);--ti-common-color-bg-light-normal: var(--ti-base-color-brand-2);--ti-common-color-bg-light-emphasize: var(--ti-base-color-brand-3);--ti-common-color-bg-dark-normal: var(--ti-base-color-common-6);--ti-common-color-bg-dark-emphasize: var(--ti-base-color-common-4);--ti-common-color-bg-dark-active: var(--ti-common-color-bg-normal);--ti-common-color-bg-dark-deep: var(--ti-base-color-common-6);--ti-common-color-bg-dark-disabled: var(--ti-base-color-common-1);--ti-common-color-bg-navigation: var(--ti-base-color-common-8);--ti-common-color-bg-dark-select: var(--ti-base-color-common-9);--ti-common-color-data-1: var(--ti-base-color-success-3);--ti-common-color-data-2: var(--ti-base-color-icon-info);--ti-common-color-data-3: var(--ti-base-color-data-3);--ti-common-color-data-4: var(--ti-base-color-data-4);--ti-common-color-data-5: var(--ti-base-color-data-5);--ti-common-color-data-6: var(--ti-base-color-warn-3);--ti-common-color-data-7: var(--ti-base-color-warn-4);--ti-common-color-data-8: var(--ti-base-color-error-3);--ti-common-color-transparent: var(--ti-base-color-transparent);--ti-common-border-radius-normal: 2px;--ti-common-border-radius-0: 0px;--ti-common-border-radius-1: 4px;--ti-common-border-radius-2: 8px;--ti-common-border-radius-3: 50%;--ti-common-font-size-base: 12px;--ti-common-font-size-1: 14px;--ti-common-font-size-2: 16px;--ti-common-font-size-3: 18px;--ti-common-font-size-4: 20px;--ti-common-font-size-5: 24px;--ti-common-font-size-6: 32px;--ti-common-font-size-7: 36px;--ti-common-line-height-number: 1.5;--ti-common-space-base: 4px;--ti-common-space-2x: calc(var(--ti-common-space-base) * 2);--ti-common-space-3x: calc(var(--ti-common-space-base) * 3);--ti-common-space-4x: calc(var(--ti-common-space-base) * 4);--ti-common-space-5x: calc(var(--ti-common-space-base) * 5);--ti-common-space-6x: calc(var(--ti-common-space-base) * 6);--ti-common-space-7x: calc(var(--ti-common-space-base) * 7);--ti-common-space-8x: calc(var(--ti-common-space-base) * 8);--ti-common-space-9x: calc(var(--ti-common-space-base) * 9);--ti-common-space-10x: calc(var(--ti-common-space-base) * 10);--ti-common-space-0: 0px;--ti-common-space-1: 1px;--ti-common-space-6: 6px;--ti-common-space-10: 10px;--ti-common-shadow-1-up: 0 -1px 4px 0 rgba(0, 0, 0, .1);--ti-common-shadow-1-down: 0 1px 4px 0 rgba(0, 0, 0, .1);--ti-common-shadow-1-left: -1px 0px 4px 0 rgba(0, 0, 0, .1);--ti-common-shadow-1-right: 1px 0px 4px 0 rgba(0, 0, 0, .1);--ti-common-shadow-2-up: 0 -2px 8px 0 rgba(0, 0, 0, .2);--ti-common-shadow-2-down: 0 2px 8px 0 rgba(0, 0, 0, .2);--ti-common-shadow-2-left: -2px 0 8px 0 rgba(238, 10, 10, .2);--ti-common-shadow-2-right: 2px 0 8px 0 rgba(252, 5, 5, .2);--ti-common-shadow-3-up: 0 -4px 16px 0 rgba(0, 0, 0, .2);--ti-common-shadow-3-down: 0 4px 16px 0 rgba(0, 0, 0, .2);--ti-common-shadow-3-left: -4px 0 16px 0 rgba(0, 0, 0, .2);--ti-common-shadow-3-right: 4px 0 16px 0 rgba(0, 0, 0, .2);--ti-common-shadow-4-up: 0 -8px 40px 0 rgba(0, 0, 0, .2);--ti-common-shadow-4-down: 0 8px 40px 0 rgba(0, 0, 0, .2);--ti-common-shadow-4-left: -8px 0 40px 0 rgba(0, 0, 0, .2);--ti-common-shadow-4-right: 8px 0 40px 0 rgba(0, 0, 0, .2);--ti-common-shadow-error: 0 1px 3px 0 rgba(199, 54, 54, .25);--ti-common-shadow-warn: 0 1px 3px 0 rgba(204, 100, 20, .25);--ti-common-shadow-prompt: 0 1px 3px 0 rgba(70, 94, 184, .25);--ti-common-shadow-success: 0 1px 3px 0 rgba(39, 176, 128, .25);--ti-common-font-family: "Helvetica", "Arial", "PingFangSC-Regular", "Hiragino Sans GB", "Microsoft YaHei", "\5fae\8f6f\96c5\9ed1", "Microsoft JhengHei";--ti-common-font-weight-1: 100;--ti-common-font-weight-2: 200;--ti-common-font-weight-3: 300;--ti-common-font-weight-4: normal;--ti-common-font-weight-5: 500;--ti-common-font-weight-6: 600;--ti-common-font-weight-7: bold;--ti-common-font-weight-8: 800;--ti-common-font-weight-9: 900;--ti-common-border-weight-normal: 1px;--ti-common-border-weight-1: 2px;--ti-common-border-weight-2: 3px;--ti-common-border-style-dashed: dashed;--ti-common-border-style-dotted: dotted;--ti-common-border-style-solid: solid;--ti-common-size-base: 4px;--ti-common-size-2x: calc(var(--ti-common-size-base) * 2);--ti-common-size-3x: calc(var(--ti-common-size-base) * 3);--ti-common-size-4x: calc(var(--ti-common-size-base) * 4);--ti-common-size-5x: calc(var(--ti-common-size-base) * 5);--ti-common-size-6x: calc(var(--ti-common-size-base) * 6);--ti-common-size-7x: calc(var(--ti-common-size-base) * 7);--ti-common-size-8x: calc(var(--ti-common-size-base) * 8);--ti-common-size-9x: calc(var(--ti-common-size-base) * 9);--ti-common-size-10x: calc(var(--ti-common-size-base) * 10);--ti-common-size-11x: calc(var(--ti-common-size-base) * 11);--ti-common-size-12x: calc(var(--ti-common-size-base) * 12);--ti-common-size-13x: calc(var(--ti-common-size-base) * 13);--ti-common-size-14x: calc(var(--ti-common-size-base) * 14);--ti-common-size-15x: calc(var(--ti-common-size-base) * 15);--ti-common-size-16x: calc(var(--ti-common-size-base) * 16);--ti-common-size-17x: calc(var(--ti-common-size-base) * 17);--ti-common-size-18x: calc(var(--ti-common-size-base) * 18);--ti-common-size-19x: calc(var(--ti-common-size-base) * 19);--ti-common-size-20x: calc(var(--ti-common-size-base) * 20);--ti-common-size-21x: calc(var(--ti-common-size-base) * 21);--ti-common-size-22x: calc(var(--ti-common-size-base) * 22);--ti-common-size-23x: calc(var(--ti-common-size-base) * 23);--ti-common-size-24x: calc(var(--ti-common-size-base) * 24);--ti-common-size-25x: calc(var(--ti-common-size-base) * 25);--ti-common-size-26x: calc(var(--ti-common-size-base) * 26);--ti-common-size-27x: calc(var(--ti-common-size-base) * 27);--ti-common-size-28x: calc(var(--ti-common-size-base) * 28);--ti-common-size-29x: calc(var(--ti-common-size-base) * 29);--ti-common-size-30x: calc(var(--ti-common-size-base) * 30);--ti-common-size-31x: calc(var(--ti-common-size-base) * 31);--ti-common-size-32x: calc(var(--ti-common-size-base) * 32);--ti-common-size-33x: calc(var(--ti-common-size-base) * 33);--ti-common-size-34x: calc(var(--ti-common-size-base) * 34);--ti-common-size-35x: calc(var(--ti-common-size-base) * 35);--ti-common-size-36x: calc(var(--ti-common-size-base) * 36);--ti-common-size-37x: calc(var(--ti-common-size-base) * 37);--ti-common-size-38x: calc(var(--ti-common-size-base) * 38);--ti-common-size-39x: calc(var(--ti-common-size-base) * 39);--ti-common-size-40x: calc(var(--ti-common-size-base) * 40);--ti-common-size-41x: calc(var(--ti-common-size-base) * 41);--ti-common-size-42x: calc(var(--ti-common-size-base) * 42);--ti-common-size-43x: calc(var(--ti-common-size-base) * 43);--ti-common-size-44x: calc(var(--ti-common-size-base) * 44);--ti-common-size-45x: calc(var(--ti-common-size-base) * 45);--ti-common-size-46x: calc(var(--ti-common-size-base) * 46);--ti-common-size-47x: calc(var(--ti-common-size-base) * 47);--ti-common-size-48x: calc(var(--ti-common-size-base) * 48);--ti-common-size-49x: calc(var(--ti-common-size-base) * 49);--ti-common-size-50x: calc(var(--ti-common-size-base) * 50);--ti-common-size-0: 0px;--ti-common-size-auto: auto}html{font-size:var(--ti-common-font-size-base)}.demo-text-warn{color:#e37d29}.demo-code{font-family:Consolas;color:#de504e;background-color:#fbe5e1;padding:2px 4px;border-radius:4px}.demo-link{color:var(--ti-common-color-text-link);text-decoration:none}.demo-link:hover{color:var(--ti-common-color-text-link-hover);text-decoration:underline}.current-value-container{margin-top:.75rem;padding:1rem;border:1px solid #eee;border-radius:.25rem;line-height:1.5rem}.placehoder{color:#adb0b8}.min-w-48{min-width:200px}.min-h-24{min-height:100px}.link{text-decoration:none;color:var(--ti-common-color-text-link)}.link:hover{color:var(--ti-common-color-text-link-hover)}.absolute{position:absolute}.relative{position:relative}.fixed{position:fixed}.top-3{top:.75rem}.top-10{top:2.5rem}.top-12{top:3rem}.top-40{top:10rem}.right-3{right:.75rem}.left-10{left:2.5rem}.left-24{left:6rem}.left-28{left:7rem}.float-right{float:right}.float-left{float:left}.clear-both{clear:both}.m-4{margin:1rem}.m-6{margin:1.5rem}.m-20{margin:5rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.my-3{margin-top:.75rem;margin-bottom:.75rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-7{margin-top:1.75rem;margin-bottom:1.75rem}.mx-1{margin-left:.25rem;margin-right:.25rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-32{margin-top:8rem}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mr-3{margin-right:.75rem}.mr-4{margin-right:1rem}.mr-5{margin-right:1.25rem}.mr-7{margin-right:1.75rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-8{margin-bottom:2rem}.mb-12{margin-bottom:3rem}.ml-3{margin-left:.75rem}.ml-4{margin-left:1rem}.ml-32{margin-left:8rem}.inline-block{display:inline-block}.flex{display:flex}.h-4{height:1rem}.h-5{height:1.25rem}.h-10{height:2.5rem}.h-24{height:6rem}.h-48{height:12rem}.h-80{height:20rem}.h-96{height:24rem}.h-full{height:100%}.max-h-48{max-height:12rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-7{width:1.75rem}.w-16{width:4rem}.w-32{width:8rem}.w-40{width:10rem}.w-48{width:12rem}.w-52{width:13rem}.w-60{width:15rem}.w-64{width:16rem}.w-96{width:24rem}.w-auto{width:auto}.w-2\/5{width:40%}.w-4\/5{width:80%}.w-full{width:100%}.max-w-xs{max-width:20rem}.max-w-xl{max-width:36rem}.max-w-screen-md{max-width:768px}.cursor-pointer{cursor:pointer}.cursor-move{cursor:move}.justify-between{justify-content:space-between}.rounded{border-radius:.25rem}.border{border-width:1px}.border-solid{border-style:solid}.border-bottom-solid{border-bottom-style:solid}.border-gray-300{--tw-border-opacity: 1;border-color:rgba(209,213,219,var(--tw-border-opacity))}.bg-gray-300{--tw-bg-opacity: 1;background-color:rgba(209,213,219,var(--tw-bg-opacity))}.bg-gray-800{--tw-bg-opacity: 1;background-color:rgba(31,41,55,var(--tw-bg-opacity))}.bg-yellow-200{--tw-bg-opacity: 1;background-color:rgba(253,230,138,var(--tw-bg-opacity))}.bg-dark{background-color:#464c59}.bg-opacity-70{--tw-bg-opacity: .7}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-4{padding:1rem}.px-0{padding-left:0;padding-right:0}.pr-2{padding-right:.5rem}.pl-2{padding-left:.5rem}.text-center{text-align:center}.align-middle{vertical-align:middle}.align-bottom{vertical-align:bottom}.leading-6{line-height:1.5rem}.leading-10{line-height:2.5rem}.leading-none{line-height:1}.text-red-500{--tw-text-opacity: 1;color:rgba(239,68,68,var(--tw-text-opacity))}.text-yellow-400{--tw-text-opacity: 1;color:rgba(251,191,36,var(--tw-text-opacity))}.text-yellow-500{--tw-text-opacity: 1;color:rgba(245,158,11,var(--tw-text-opacity))}.text-blue-500{--tw-text-opacity: 1;color:rgba(59,130,246,var(--tw-text-opacity))}.text-blue-600{--tw-text-opacity: 1;color:rgba(37,99,235,var(--tw-text-opacity))}.no-underline{text-decoration:none}.overflow-auto{overflow:auto}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-bold{font-weight:700}pre{white-space:pre-wrap;word-wrap:break-word}
+body {
+  margin: 0;
+  padding: 0;
+  font-size: var(--ti-common-font-size-base);
+  font-family: var(--ti-common-font-family);
+  color: var(--ti-common-color-text-primary);
+  background-color: var(--ti-common-color-bg-white-normal);
+}
+button,
+blockquote,
+div,
+section,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+ul,
+ol,
+dl,
+dt,
+dd,
+li,
+pre,
+code,
+form,
+fieldset,
+legend,
+input,
+textarea,
+th,
+td,
+p,
+select {
+  margin: 0;
+  padding: 0;
+}
+input {
+  vertical-align: middle;
+}
+fieldset,
+img {
+  border: 0;
+}
+button,
+input,
+textarea {
+  font-family: inherit;
+  font-size: 100%;
+  margin: 0;
+}
+button {
+  line-height: normal;
+}
+textarea {
+  overflow: auto;
+  vertical-align: top;
+  resize: vertical;
+}
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+  border: 0;
+  padding: 0;
+}
+address,
+caption,
+cite,
+code,
+dfn,
+em,
+var {
+  font-style: normal;
+  font-weight: 400;
+}
+ol,
+ul {
+  list-style: none;
+}
+q:before {
+  content: '';
+}
+q:after {
+  content: '';
+}
+abbr,
+acronym {
+  border: 0;
+  font-feature-settings: normal;
+  font-variant: normal;
+}
+b,
+strong {
+  font-weight: 700;
+}
+sub {
+  position: relative;
+  font-size: 75%;
+  line-height: 0;
+  vertical-align: baseline;
+  bottom: -0.25em;
+}
+sup {
+  position: relative;
+  font-size: 75%;
+  line-height: 0;
+  vertical-align: baseline;
+  top: -0.5em;
+}
+a {
+  background-color: transparent;
+}
+label {
+  margin-bottom: 0;
+  font-weight: 400;
+}
+table {
+  border-spacing: 0 0;
+  border-collapse: collapse;
+  margin-bottom: 0;
+}
+figcaption,
+figure,
+hgroup,
+article,
+footer,
+header,
+nav,
+section,
+aside,
+menu,
+main,
+details,
+summary {
+  display: block;
+}
+button::-moz-focus-inner {
+  padding: 0;
+  border: none;
+}
+audio,
+canvas,
+progress,
+video {
+  display: inline-block;
+  vertical-align: baseline;
+}
+input::-ms-clear {
+  width: 0;
+  height: 0;
+}
+input[type='password']::-ms-reveal {
+  width: 0;
+  height: 0;
+}
+::-webkit-input-placeholder {
+  color: var(--ti-common-color-text-disabled);
+  text-overflow: initial !important;
+}
+::-moz-placeholder {
+  color: var(--ti-common-color-text-disabled);
+  opacity: 1;
+  text-overflow: initial;
+}
+:-moz-placeholder {
+  color: var(--ti-common-color-text-disabled);
+  opacity: 1;
+}
+input:-ms-input-placeholder,
+textarea:-ms-input-placeholder {
+  color: var(--ti-common-color-text-disabled) !important;
+}
+input.ng-invalid.ng-touched[tiBlurCheck]:not([tiFocused]),
+textarea.ng-invalid.ng-touched[tiBlurCheck]:not([tiFocused]),
+[tiForm].ng-invalid.ng-touched[tiBlurCheck]:not([tiFocused]),
+input.ng-invalid.ng-dirty[tiBlurCheck]:not([tiFocused]),
+textarea.ng-invalid.ng-dirty[tiBlurCheck]:not([tiFocused]),
+[tiForm].ng-invalid.ng-dirty[tiBlurCheck]:not([tiFocused]),
+input.ng-invalid.ng-touched:not([tiBlurCheck]):not([tiRadiobaseCheck]),
+textarea.ng-invalid.ng-touched:not([tiBlurCheck]):not([tiRadiobaseCheck]),
+[tiForm].ng-invalid.ng-touched:not([tiBlurCheck]):not([tiRadiobaseCheck]),
+input.ng-invalid.ng-dirty:not([tiBlurCheck]):not([tiRadiobaseCheck]),
+textarea.ng-invalid.ng-dirty:not([tiBlurCheck]):not([tiRadiobaseCheck]),
+[tiForm].ng-invalid.ng-dirty:not([tiBlurCheck]):not([tiRadiobaseCheck]) {
+  border-color: var(--ti-common-color-error-border) !important;
+  background-color: var(--ti-common-color-error-bg);
+}
+:root {
+  --ti-base-color-white: #ffffff;
+  --ti-base-color-brand-6: #5e7ce0;
+  --ti-base-color-brand-8: #344899;
+  --ti-base-color-brand-7: #526ecc;
+  --ti-base-color-brand-5: #7693f5;
+  --ti-base-color-brand-4: #96adfa;
+  --ti-base-color-brand-3: #beccfa;
+  --ti-base-color-brand-2: #e9edfa;
+  --ti-base-color-brand-1: #f2f5fc;
+  --ti-base-color-common-9: #181818;
+  --ti-base-color-common-8: #282b33;
+  --ti-base-color-common-7: #252b3a;
+  --ti-base-color-common-6: #464c59;
+  --ti-base-color-common-5: #575d6c;
+  --ti-base-color-common-4: #5c6173;
+  --ti-base-color-common-3: #8a8e99;
+  --ti-base-color-common-2: #adb0b8;
+  --ti-base-color-common-1: #dfe1e6;
+  --ti-base-color-bg-9: #b12220;
+  --ti-base-color-bg-8: #c7000b;
+  --ti-base-color-bg-7: #d64a52;
+  --ti-base-color-bg-6: #eef0f5;
+  --ti-base-color-bg-5: #f5f5f6;
+  --ti-base-color-bg-4: #fafafa;
+  --ti-base-color-bg-3: #ffffff;
+  --ti-base-color-bg-2: #ffffff;
+  --ti-base-color-bg-1: #ffffff;
+  --ti-base-color-error-4: #de504e;
+  --ti-base-color-error-3: #f66f6a;
+  --ti-base-color-error-2: #ffbcba;
+  --ti-base-color-error-1: #ffeeed;
+  --ti-base-color-success-4: #3ac295;
+  --ti-base-color-success-3: #50d4ab;
+  --ti-base-color-success-2: #acf2dc;
+  --ti-base-color-success-1: #edfff9;
+  --ti-base-color-warn-5: #e37d29;
+  --ti-base-color-warn-4: #fa9841;
+  --ti-base-color-warn-3: #fac20a;
+  --ti-base-color-warn-2: #ffd0a6;
+  --ti-base-color-warn-1: #fff3e8;
+  --ti-base-color-prompt-4: var(--ti-base-color-brand-7);
+  --ti-base-color-prompt-3: var(--ti-base-color-brand-6);
+  --ti-base-color-prompt-2: var(--ti-base-color-brand-3);
+  --ti-base-color-prompt-1: #ebf6ff;
+  --ti-base-color-prompt-icon-from: #7769e8;
+  --ti-base-color-prompt-icon-to: #58bbff;
+  --ti-base-color-icon-info: #6cbfff;
+  --ti-base-color-data-3: #a6dd82;
+  --ti-base-color-data-4: #f3689a;
+  --ti-base-color-data-5: #a97af8;
+  --ti-base-color-transparent: transparent;
+  --ti-common-color-success: var(--ti-base-color-success-3);
+  --ti-common-color-text-success: var(--ti-base-color-success-4);
+  --ti-common-color-success-bg: var(--ti-base-color-success-1);
+  --ti-common-color-success-border: var(--ti-base-color-success-2);
+  --ti-common-color-error: var(--ti-base-color-error-3);
+  --ti-common-color-error-text: var(--ti-base-color-error-4);
+  --ti-common-color-error-bg: var(--ti-base-color-error-1);
+  --ti-common-color-error-border: var(--ti-base-color-error-3);
+  --ti-common-color-error-border-secondary: var(--ti-base-color-error-2);
+  --ti-common-color-warn: var(--ti-base-color-warn-4);
+  --ti-common-color-warn-text: var(--ti-base-color-warn-5);
+  --ti-common-color-warn-bg: var(--ti-base-color-warn-1);
+  --ti-common-color-warn-border: var(--ti-base-color-warn-2);
+  --ti-common-color-warn-secondary: var(--ti-base-color-warn-3);
+  --ti-common-color-prompt: var(--ti-base-color-prompt-3);
+  --ti-common-color-prompt-text: var(--ti-base-color-prompt-4);
+  --ti-common-color-prompt-bg: var(--ti-base-color-prompt-1);
+  --ti-common-color-prompt-border: var(--ti-base-color-prompt-2);
+  --ti-common-color-prompt-icon-from: var(--ti-base-color-prompt-icon-from);
+  --ti-common-color-prompt-icon-to: var(--ti-base-color-prompt-icon-to);
+  --ti-common-color-text-primary: var(--ti-base-color-common-7);
+  --ti-common-color-text-secondary: var(--ti-base-color-common-5);
+  --ti-common-color-text-weaken: var(--ti-base-color-common-3);
+  --ti-common-color-text-disabled: var(--ti-base-color-common-2);
+  --ti-common-color-text-darkbg: var(--ti-base-color-common-2);
+  --ti-common-color-text-darkbg-disabled: var(--ti-base-color-common-5);
+  --ti-common-color-text-link: var(--ti-base-color-brand-7);
+  --ti-common-color-text-link-hover: var(--ti-base-color-brand-8);
+  --ti-common-color-text-link-darkbg: var(--ti-base-color-brand-4);
+  --ti-common-color-text-link-darkbg-hover: var(--ti-base-color-brand-3);
+  --ti-common-color-text-highlight: var(--ti-base-color-brand-7);
+  --ti-common-color-text-white: var(--ti-base-color-white);
+  --ti-common-color-text-gray: var(--ti-base-color-white);
+  --ti-common-color-text-gray-disabled: var(--ti-base-color-common-4);
+  --ti-common-color-text-important: var(--ti-base-color-error-4);
+  --ti-common-color-icon-normal: var(--ti-base-color-common-5);
+  --ti-common-color-icon-hover: var(--ti-base-color-brand-6);
+  --ti-common-color-icon-active: var(--ti-base-color-brand-6);
+  --ti-common-color-icon-disabled: var(--ti-base-color-common-2);
+  --ti-common-color-icon-white: var(--ti-base-color-white);
+  --ti-common-color-icon-graybg-normal: var(--ti-base-color-common-2);
+  --ti-common-color-icon-graybg-hover: var(--ti-base-color-brand-6);
+  --ti-common-color-icon-graybg-active: var(--ti-base-color-brand-6);
+  --ti-common-color-icon-graybg-disabled: var(--ti-base-color-common-1);
+  --ti-common-color-icon-darkbg-normal: var(--ti-base-color-common-2);
+  --ti-common-color-icon-darkbg-hover: var(--ti-base-color-brand-5);
+  --ti-common-color-icon-darkbg-active: var(--ti-base-color-brand-5);
+  --ti-common-color-icon-darkbg-disabled: var(--ti-base-color-common-5);
+  --ti-common-color-icon-info: var(--ti-base-color-icon-info);
+  --ti-common-color-line-normal: var(--ti-base-color-common-2);
+  --ti-common-color-line-hover: var(--ti-base-color-common-5);
+  --ti-common-color-line-active: var(--ti-base-color-brand-6);
+  --ti-common-color-line-disabled: var(--ti-base-color-common-1);
+  --ti-common-color-line-dividing: var(--ti-base-color-common-1);
+  --ti-common-color-dash-line-normal: var(--ti-base-color-common-5);
+  --ti-common-color-dash-line-hover: var(--ti-base-color-brand-7);
+  --ti-common-color-bg-normal: var(--ti-base-color-bg-6);
+  --ti-common-color-bg-emphasize: var(--ti-base-color-brand-6);
+  --ti-common-color-bg-disabled: var(--ti-base-color-bg-5);
+  --ti-common-color-bg-hover: var(--ti-base-color-brand-8);
+  --ti-common-color-bg-gray: var(--ti-base-color-bg-4);
+  --ti-common-color-bg-secondary: var(--ti-base-color-common-2);
+  --ti-common-bg-primary: var(--ti-base-color-bg-8);
+  --ti-common-bg-primary-hover: var(--ti-base-color-bg-7);
+  --ti-common-bg-primary-active: var(--ti-base-color-bg-9);
+  --ti-common-bg-minor: var(--ti-base-color-bg-2);
+  --ti-common-bg-minor-hover: var(--ti-base-color-bg-1);
+  --ti-common-bg-minor-active: var(--ti-base-color-bg-3);
+  --ti-common-color-bg-white-normal: var(--ti-base-color-white);
+  --ti-common-color-bg-white-emphasize: var(--ti-base-color-brand-1);
+  --ti-common-color-bg-light-normal: var(--ti-base-color-brand-2);
+  --ti-common-color-bg-light-emphasize: var(--ti-base-color-brand-3);
+  --ti-common-color-bg-dark-normal: var(--ti-base-color-common-6);
+  --ti-common-color-bg-dark-emphasize: var(--ti-base-color-common-4);
+  --ti-common-color-bg-dark-active: var(--ti-common-color-bg-normal);
+  --ti-common-color-bg-dark-deep: var(--ti-base-color-common-6);
+  --ti-common-color-bg-dark-disabled: var(--ti-base-color-common-1);
+  --ti-common-color-bg-navigation: var(--ti-base-color-common-8);
+  --ti-common-color-bg-dark-select: var(--ti-base-color-common-9);
+  --ti-common-color-data-1: var(--ti-base-color-success-3);
+  --ti-common-color-data-2: var(--ti-base-color-icon-info);
+  --ti-common-color-data-3: var(--ti-base-color-data-3);
+  --ti-common-color-data-4: var(--ti-base-color-data-4);
+  --ti-common-color-data-5: var(--ti-base-color-data-5);
+  --ti-common-color-data-6: var(--ti-base-color-warn-3);
+  --ti-common-color-data-7: var(--ti-base-color-warn-4);
+  --ti-common-color-data-8: var(--ti-base-color-error-3);
+  --ti-common-color-transparent: var(--ti-base-color-transparent);
+  --ti-common-border-radius-normal: 2px;
+  --ti-common-border-radius-0: 0px;
+  --ti-common-border-radius-1: 4px;
+  --ti-common-border-radius-2: 8px;
+  --ti-common-border-radius-3: 50%;
+  --ti-common-font-size-base: 12px;
+  --ti-common-font-size-1: 14px;
+  --ti-common-font-size-2: 16px;
+  --ti-common-font-size-3: 18px;
+  --ti-common-font-size-4: 20px;
+  --ti-common-font-size-5: 24px;
+  --ti-common-font-size-6: 32px;
+  --ti-common-font-size-7: 36px;
+  --ti-common-line-height-number: 1.5;
+  --ti-common-space-base: 4px;
+  --ti-common-space-2x: calc(var(--ti-common-space-base) * 2);
+  --ti-common-space-3x: calc(var(--ti-common-space-base) * 3);
+  --ti-common-space-4x: calc(var(--ti-common-space-base) * 4);
+  --ti-common-space-5x: calc(var(--ti-common-space-base) * 5);
+  --ti-common-space-6x: calc(var(--ti-common-space-base) * 6);
+  --ti-common-space-7x: calc(var(--ti-common-space-base) * 7);
+  --ti-common-space-8x: calc(var(--ti-common-space-base) * 8);
+  --ti-common-space-9x: calc(var(--ti-common-space-base) * 9);
+  --ti-common-space-10x: calc(var(--ti-common-space-base) * 10);
+  --ti-common-space-0: 0px;
+  --ti-common-space-1: 1px;
+  --ti-common-space-6: 6px;
+  --ti-common-space-10: 10px;
+  --ti-common-shadow-1-up: 0 -1px 4px 0 rgba(0, 0, 0, 0.1);
+  --ti-common-shadow-1-down: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
+  --ti-common-shadow-1-left: -1px 0px 4px 0 rgba(0, 0, 0, 0.1);
+  --ti-common-shadow-1-right: 1px 0px 4px 0 rgba(0, 0, 0, 0.1);
+  --ti-common-shadow-2-up: 0 -2px 8px 0 rgba(0, 0, 0, 0.2);
+  --ti-common-shadow-2-down: 0 2px 8px 0 rgba(0, 0, 0, 0.2);
+  --ti-common-shadow-2-left: -2px 0 8px 0 rgba(238, 10, 10, 0.2);
+  --ti-common-shadow-2-right: 2px 0 8px 0 rgba(252, 5, 5, 0.2);
+  --ti-common-shadow-3-up: 0 -4px 16px 0 rgba(0, 0, 0, 0.2);
+  --ti-common-shadow-3-down: 0 4px 16px 0 rgba(0, 0, 0, 0.2);
+  --ti-common-shadow-3-left: -4px 0 16px 0 rgba(0, 0, 0, 0.2);
+  --ti-common-shadow-3-right: 4px 0 16px 0 rgba(0, 0, 0, 0.2);
+  --ti-common-shadow-4-up: 0 -8px 40px 0 rgba(0, 0, 0, 0.2);
+  --ti-common-shadow-4-down: 0 8px 40px 0 rgba(0, 0, 0, 0.2);
+  --ti-common-shadow-4-left: -8px 0 40px 0 rgba(0, 0, 0, 0.2);
+  --ti-common-shadow-4-right: 8px 0 40px 0 rgba(0, 0, 0, 0.2);
+  --ti-common-shadow-error: 0 1px 3px 0 rgba(199, 54, 54, 0.25);
+  --ti-common-shadow-warn: 0 1px 3px 0 rgba(204, 100, 20, 0.25);
+  --ti-common-shadow-prompt: 0 1px 3px 0 rgba(70, 94, 184, 0.25);
+  --ti-common-shadow-success: 0 1px 3px 0 rgba(39, 176, 128, 0.25);
+  --ti-common-font-family: 'Helvetica', 'Arial', 'PingFangSC-Regular', 'Hiragino Sans GB', 'Microsoft YaHei', '\5fae\8f6f\96c5\9ed1', 'Microsoft JhengHei';
+  --ti-common-font-weight-1: 100;
+  --ti-common-font-weight-2: 200;
+  --ti-common-font-weight-3: 300;
+  --ti-common-font-weight-4: normal;
+  --ti-common-font-weight-5: 500;
+  --ti-common-font-weight-6: 600;
+  --ti-common-font-weight-7: bold;
+  --ti-common-font-weight-8: 800;
+  --ti-common-font-weight-9: 900;
+  --ti-common-border-weight-normal: 1px;
+  --ti-common-border-weight-1: 2px;
+  --ti-common-border-weight-2: 3px;
+  --ti-common-border-style-dashed: dashed;
+  --ti-common-border-style-dotted: dotted;
+  --ti-common-border-style-solid: solid;
+  --ti-common-size-base: 4px;
+  --ti-common-size-2x: calc(var(--ti-common-size-base) * 2);
+  --ti-common-size-3x: calc(var(--ti-common-size-base) * 3);
+  --ti-common-size-4x: calc(var(--ti-common-size-base) * 4);
+  --ti-common-size-5x: calc(var(--ti-common-size-base) * 5);
+  --ti-common-size-6x: calc(var(--ti-common-size-base) * 6);
+  --ti-common-size-7x: calc(var(--ti-common-size-base) * 7);
+  --ti-common-size-8x: calc(var(--ti-common-size-base) * 8);
+  --ti-common-size-9x: calc(var(--ti-common-size-base) * 9);
+  --ti-common-size-10x: calc(var(--ti-common-size-base) * 10);
+  --ti-common-size-11x: calc(var(--ti-common-size-base) * 11);
+  --ti-common-size-12x: calc(var(--ti-common-size-base) * 12);
+  --ti-common-size-13x: calc(var(--ti-common-size-base) * 13);
+  --ti-common-size-14x: calc(var(--ti-common-size-base) * 14);
+  --ti-common-size-15x: calc(var(--ti-common-size-base) * 15);
+  --ti-common-size-16x: calc(var(--ti-common-size-base) * 16);
+  --ti-common-size-17x: calc(var(--ti-common-size-base) * 17);
+  --ti-common-size-18x: calc(var(--ti-common-size-base) * 18);
+  --ti-common-size-19x: calc(var(--ti-common-size-base) * 19);
+  --ti-common-size-20x: calc(var(--ti-common-size-base) * 20);
+  --ti-common-size-21x: calc(var(--ti-common-size-base) * 21);
+  --ti-common-size-22x: calc(var(--ti-common-size-base) * 22);
+  --ti-common-size-23x: calc(var(--ti-common-size-base) * 23);
+  --ti-common-size-24x: calc(var(--ti-common-size-base) * 24);
+  --ti-common-size-25x: calc(var(--ti-common-size-base) * 25);
+  --ti-common-size-26x: calc(var(--ti-common-size-base) * 26);
+  --ti-common-size-27x: calc(var(--ti-common-size-base) * 27);
+  --ti-common-size-28x: calc(var(--ti-common-size-base) * 28);
+  --ti-common-size-29x: calc(var(--ti-common-size-base) * 29);
+  --ti-common-size-30x: calc(var(--ti-common-size-base) * 30);
+  --ti-common-size-31x: calc(var(--ti-common-size-base) * 31);
+  --ti-common-size-32x: calc(var(--ti-common-size-base) * 32);
+  --ti-common-size-33x: calc(var(--ti-common-size-base) * 33);
+  --ti-common-size-34x: calc(var(--ti-common-size-base) * 34);
+  --ti-common-size-35x: calc(var(--ti-common-size-base) * 35);
+  --ti-common-size-36x: calc(var(--ti-common-size-base) * 36);
+  --ti-common-size-37x: calc(var(--ti-common-size-base) * 37);
+  --ti-common-size-38x: calc(var(--ti-common-size-base) * 38);
+  --ti-common-size-39x: calc(var(--ti-common-size-base) * 39);
+  --ti-common-size-40x: calc(var(--ti-common-size-base) * 40);
+  --ti-common-size-41x: calc(var(--ti-common-size-base) * 41);
+  --ti-common-size-42x: calc(var(--ti-common-size-base) * 42);
+  --ti-common-size-43x: calc(var(--ti-common-size-base) * 43);
+  --ti-common-size-44x: calc(var(--ti-common-size-base) * 44);
+  --ti-common-size-45x: calc(var(--ti-common-size-base) * 45);
+  --ti-common-size-46x: calc(var(--ti-common-size-base) * 46);
+  --ti-common-size-47x: calc(var(--ti-common-size-base) * 47);
+  --ti-common-size-48x: calc(var(--ti-common-size-base) * 48);
+  --ti-common-size-49x: calc(var(--ti-common-size-base) * 49);
+  --ti-common-size-50x: calc(var(--ti-common-size-base) * 50);
+  --ti-common-size-0: 0px;
+  --ti-common-size-auto: auto;
+}
+html {
+  font-size: var(--ti-common-font-size-base);
+}
+.demo-text-warn {
+  color: #e37d29;
+}
+.demo-code {
+  font-family: Consolas;
+  color: #de504e;
+  background-color: #fbe5e1;
+  padding: 2px 4px;
+  border-radius: 4px;
+}
+.demo-link {
+  color: var(--ti-common-color-text-link);
+  text-decoration: none;
+}
+.demo-link:hover {
+  color: var(--ti-common-color-text-link-hover);
+  text-decoration: underline;
+}
+.current-value-container {
+  margin-top: 0.75rem;
+  padding: 1rem;
+  border: 1px solid #eee;
+  border-radius: 0.25rem;
+  line-height: 1.5rem;
+}
+.placehoder {
+  color: #adb0b8;
+}
+.min-w-48 {
+  min-width: 200px;
+}
+.min-h-24 {
+  min-height: 100px;
+}
+.link {
+  text-decoration: none;
+  color: var(--ti-common-color-text-link);
+}
+.link:hover {
+  color: var(--ti-common-color-text-link-hover);
+}
+.absolute {
+  position: absolute;
+}
+.relative {
+  position: relative;
+}
+.fixed {
+  position: fixed;
+}
+.top-3 {
+  top: 0.75rem;
+}
+.top-10 {
+  top: 2.5rem;
+}
+.top-12 {
+  top: 3rem;
+}
+.top-40 {
+  top: 10rem;
+}
+.right-3 {
+  right: 0.75rem;
+}
+.left-10 {
+  left: 2.5rem;
+}
+.left-24 {
+  left: 6rem;
+}
+.left-28 {
+  left: 7rem;
+}
+.float-right {
+  float: right;
+}
+.float-left {
+  float: left;
+}
+.clear-both {
+  clear: both;
+}
+.m-4 {
+  margin: 1rem;
+}
+.m-6 {
+  margin: 1.5rem;
+}
+.m-20 {
+  margin: 5rem;
+}
+.my-2 {
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+}
+.my-3 {
+  margin-top: 0.75rem;
+  margin-bottom: 0.75rem;
+}
+.my-4 {
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+}
+.my-7 {
+  margin-top: 1.75rem;
+  margin-bottom: 1.75rem;
+}
+.mx-1 {
+  margin-left: 0.25rem;
+  margin-right: 0.25rem;
+}
+.mt-3 {
+  margin-top: 0.75rem;
+}
+.mt-4 {
+  margin-top: 1rem;
+}
+.mt-5 {
+  margin-top: 1.25rem;
+}
+.mt-32 {
+  margin-top: 8rem;
+}
+.mr-1 {
+  margin-right: 0.25rem;
+}
+.mr-2 {
+  margin-right: 0.5rem;
+}
+.mr-3 {
+  margin-right: 0.75rem;
+}
+.mr-4 {
+  margin-right: 1rem;
+}
+.mr-5 {
+  margin-right: 1.25rem;
+}
+.mr-7 {
+  margin-right: 1.75rem;
+}
+.mb-3 {
+  margin-bottom: 0.75rem;
+}
+.mb-4 {
+  margin-bottom: 1rem;
+}
+.mb-8 {
+  margin-bottom: 2rem;
+}
+.mb-12 {
+  margin-bottom: 3rem;
+}
+.ml-3 {
+  margin-left: 0.75rem;
+}
+.ml-4 {
+  margin-left: 1rem;
+}
+.ml-32 {
+  margin-left: 8rem;
+}
+.inline-block {
+  display: inline-block;
+}
+.flex {
+  display: flex;
+}
+.h-4 {
+  height: 1rem;
+}
+.h-5 {
+  height: 1.25rem;
+}
+.h-10 {
+  height: 2.5rem;
+}
+.h-24 {
+  height: 6rem;
+}
+.h-48 {
+  height: 12rem;
+}
+.h-80 {
+  height: 20rem;
+}
+.h-96 {
+  height: 24rem;
+}
+.h-full {
+  height: 100%;
+}
+.max-h-48 {
+  max-height: 12rem;
+}
+.w-4 {
+  width: 1rem;
+}
+.w-5 {
+  width: 1.25rem;
+}
+.w-7 {
+  width: 1.75rem;
+}
+.w-16 {
+  width: 4rem;
+}
+.w-32 {
+  width: 8rem;
+}
+.w-40 {
+  width: 10rem;
+}
+.w-48 {
+  width: 12rem;
+}
+.w-52 {
+  width: 13rem;
+}
+.w-60 {
+  width: 15rem;
+}
+.w-64 {
+  width: 16rem;
+}
+.w-96 {
+  width: 24rem;
+}
+.w-auto {
+  width: auto;
+}
+.w-2\/5 {
+  width: 40%;
+}
+.w-4\/5 {
+  width: 80%;
+}
+.w-full {
+  width: 100%;
+}
+.max-w-xs {
+  max-width: 20rem;
+}
+.max-w-xl {
+  max-width: 36rem;
+}
+.max-w-screen-md {
+  max-width: 768px;
+}
+.cursor-pointer {
+  cursor: pointer;
+}
+.cursor-move {
+  cursor: move;
+}
+.justify-between {
+  justify-content: space-between;
+}
+.rounded {
+  border-radius: 0.25rem;
+}
+.border {
+  border-width: 1px;
+}
+.border-solid {
+  border-style: solid;
+}
+.border-bottom-solid {
+  border-bottom-style: solid;
+}
+.border-gray-300 {
+  --tw-border-opacity: 1;
+  border-color: rgba(209, 213, 219, var(--tw-border-opacity));
+}
+.bg-gray-300 {
+  --tw-bg-opacity: 1;
+  background-color: rgba(209, 213, 219, var(--tw-bg-opacity));
+}
+.bg-gray-800 {
+  --tw-bg-opacity: 1;
+  background-color: rgba(31, 41, 55, var(--tw-bg-opacity));
+}
+.bg-yellow-200 {
+  --tw-bg-opacity: 1;
+  background-color: rgba(253, 230, 138, var(--tw-bg-opacity));
+}
+.bg-dark {
+  background-color: #464c59;
+}
+.bg-opacity-70 {
+  --tw-bg-opacity: 0.7;
+}
+.p-1 {
+  padding: 0.25rem;
+}
+.p-2 {
+  padding: 0.5rem;
+}
+.p-4 {
+  padding: 1rem;
+}
+.px-0 {
+  padding-left: 0;
+  padding-right: 0;
+}
+.pr-2 {
+  padding-right: 0.5rem;
+}
+.pl-2 {
+  padding-left: 0.5rem;
+}
+.text-center {
+  text-align: center;
+}
+.align-middle {
+  vertical-align: middle;
+}
+.align-bottom {
+  vertical-align: bottom;
+}
+.leading-6 {
+  line-height: 1.5rem;
+}
+.leading-10 {
+  line-height: 2.5rem;
+}
+.leading-none {
+  line-height: 1;
+}
+.text-red-500 {
+  --tw-text-opacity: 1;
+  color: rgba(239, 68, 68, var(--tw-text-opacity));
+}
+.text-yellow-400 {
+  --tw-text-opacity: 1;
+  color: rgba(251, 191, 36, var(--tw-text-opacity));
+}
+.text-yellow-500 {
+  --tw-text-opacity: 1;
+  color: rgba(245, 158, 11, var(--tw-text-opacity));
+}
+.text-blue-500 {
+  --tw-text-opacity: 1;
+  color: rgba(59, 130, 246, var(--tw-text-opacity));
+}
+.text-blue-600 {
+  --tw-text-opacity: 1;
+  color: rgba(37, 99, 235, var(--tw-text-opacity));
+}
+.no-underline {
+  text-decoration: none;
+}
+.overflow-auto {
+  overflow: auto;
+}
+.text-xl {
+  font-size: 1.25rem;
+  line-height: 1.75rem;
+}
+.font-bold {
+  font-weight: 700;
+}
+pre {
+  white-space: pre-wrap;
+  word-wrap: break-word;
+}
diff --git a/packages/toolkits/docs/template/vue/components.d.ts b/packages/toolkits/docs/template/vue/components.d.ts
index 218452a1..5daae4ce 100644
--- a/packages/toolkits/docs/template/vue/components.d.ts
+++ b/packages/toolkits/docs/template/vue/components.d.ts
@@ -1,26 +1,26 @@
 // generated by unplugin-vue-components
 // We suggest you to commit this file into source control
 // Read more: https://github.com/vuejs/core/pull/3399
-import '@vue/runtime-core'
+import '@vue/runtime-core';
 
 declare module '@vue/runtime-core' {
   export interface GlobalComponents {
-    NAnchor: typeof import('naive-ui')['NAnchor']
-    NAnchorLink: typeof import('naive-ui')['NAnchorLink']
-    NCard: typeof import('naive-ui')['NCard']
-    NCode: typeof import('naive-ui')['NCode']
-    NConfigProvider: typeof import('naive-ui')['NConfigProvider']
-    NDataTable: typeof import('naive-ui')['NDataTable']
-    NInput: typeof import('naive-ui')['NInput']
-    NLayout: typeof import('naive-ui')['NLayout']
-    NLayoutSider: typeof import('naive-ui')['NLayoutSider']
-    NMenu: typeof import('naive-ui')['NMenu']
-    NTabPane: typeof import('naive-ui')['NTabPane']
-    NTabs: typeof import('naive-ui')['NTabs']
-    NTooltip: typeof import('naive-ui')['NTooltip']
-    RouterLink: typeof import('vue-router')['RouterLink']
-    RouterView: typeof import('vue-router')['RouterView']
+    NAnchor: typeof import('naive-ui')['NAnchor'];
+    NAnchorLink: typeof import('naive-ui')['NAnchorLink'];
+    NCard: typeof import('naive-ui')['NCard'];
+    NCode: typeof import('naive-ui')['NCode'];
+    NConfigProvider: typeof import('naive-ui')['NConfigProvider'];
+    NDataTable: typeof import('naive-ui')['NDataTable'];
+    NInput: typeof import('naive-ui')['NInput'];
+    NLayout: typeof import('naive-ui')['NLayout'];
+    NLayoutSider: typeof import('naive-ui')['NLayoutSider'];
+    NMenu: typeof import('naive-ui')['NMenu'];
+    NTabPane: typeof import('naive-ui')['NTabPane'];
+    NTabs: typeof import('naive-ui')['NTabs'];
+    NTooltip: typeof import('naive-ui')['NTooltip'];
+    RouterLink: typeof import('vue-router')['RouterLink'];
+    RouterView: typeof import('vue-router')['RouterView'];
   }
 }
 
-export {}
+export {};
diff --git a/packages/toolkits/pro/src/index.ts b/packages/toolkits/pro/src/index.ts
index 7b3d375a..4cb21d46 100644
--- a/packages/toolkits/pro/src/index.ts
+++ b/packages/toolkits/pro/src/index.ts
@@ -19,5 +19,5 @@ export default {
   build,
   init,
   help,
-  default: help
+  default: help,
 };
diff --git a/packages/toolkits/pro/src/lib/build.ts b/packages/toolkits/pro/src/lib/build.ts
index 73fe0fee..49f535ce 100644
--- a/packages/toolkits/pro/src/lib/build.ts
+++ b/packages/toolkits/pro/src/lib/build.ts
@@ -3,11 +3,11 @@ import { logs } from '@opentiny/cli-devkit';
 
 const log = logs('tiny-toolkit-pro');
 
-export default function() {
+export default function () {
   log.info('项目打包中...');
   spawn('npm', ['run', 'build'], {
-    stdio: 'inherit'
-  }).on('close', code => {
+    stdio: 'inherit',
+  }).on('close', (code) => {
     if (code) {
       log.error('build失败');
     }
diff --git a/packages/toolkits/pro/src/lib/help.ts b/packages/toolkits/pro/src/lib/help.ts
index de6eb395..2bc0ca65 100644
--- a/packages/toolkits/pro/src/lib/help.ts
+++ b/packages/toolkits/pro/src/lib/help.ts
@@ -1,7 +1,7 @@
 import chalk from 'chalk';
 import { cliConfig } from '@opentiny/cli-devkit';
 
-export default function() {
+export default function () {
   const tool = cliConfig.getBinName();
   const help = `
 tiny-toolkit-pro Toolkit help info:  ${tool} [command] [option]
diff --git a/packages/toolkits/pro/src/lib/start.ts b/packages/toolkits/pro/src/lib/start.ts
index a3845ffc..4c8d2daf 100644
--- a/packages/toolkits/pro/src/lib/start.ts
+++ b/packages/toolkits/pro/src/lib/start.ts
@@ -5,7 +5,7 @@ import { logs, fs } from '@opentiny/cli-devkit';
 const log = logs('tiny-toolkit-pro');
 const cwd = process.cwd();
 
-export default function() {
+export default function () {
   if (!fs.existsSync(path.resolve(cwd, 'node_modules'))) {
     log.info('项目中不存在 node_modules 目录, 开始自动安装项目依赖，请稍后...');
     spawn.sync('npm', ['install'], { stdio: 'inherit' });
diff --git a/packages/toolkits/pro/src/lib/utils.ts b/packages/toolkits/pro/src/lib/utils.ts
index 7da88c3c..97310349 100644
--- a/packages/toolkits/pro/src/lib/utils.ts
+++ b/packages/toolkits/pro/src/lib/utils.ts
@@ -4,7 +4,7 @@ import { modules, cache } from '@opentiny/cli-devkit';
 const cwd = process.cwd();
 
 function firstUpperCase(str: string) {
-  return str.replace(/^\S/, s => s.toUpperCase());
+  return str.replace(/^\S/, (s) => s.toUpperCase());
 }
 
 /**
@@ -38,10 +38,7 @@ export function generateNames(name: string) {
     className: camelTrans(name, true),
 
     // 全大写
-    constName: name
-      .split('-')
-      .join('')
-      .toUpperCase()
+    constName: name.split('-').join('').toUpperCase(),
   };
 }
 
@@ -70,7 +67,7 @@ export function setModuleCache(name: string) {
   // 写一下缓存，避免未发布时一直去线上拉数据
   const cacheKey = `${modules.utils.UPDATE_CHECK_PRE}${name}`;
   cache.set(cacheKey, true, {
-    expires: modules.utils.NO_TIP_PERIOD * 10
+    expires: modules.utils.NO_TIP_PERIOD * 10,
   });
 }
 
@@ -78,5 +75,5 @@ export default {
   getDistPath,
   getTemplatePath,
   generateNames,
-  setModuleCache
+  setModuleCache,
 };
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@core/module-import-guard.ts b/packages/toolkits/pro/template/tinyng/src/app/@core/module-import-guard.ts
index eb87efcf..445640c4 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@core/module-import-guard.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@core/module-import-guard.ts
@@ -1,7 +1,5 @@
 export function throwIfAlreadyLoaded(parentModule: any, moduleName: string) {
   if (parentModule) {
-    throw new Error(
-      `${moduleName} has already been loaded. Import Core modules in the AppModule only.`
-    );
+    throw new Error(`${moduleName} has already been loaded. Import Core modules in the AppModule only.`);
   }
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@core/services/auth-guard-service.guard.ts b/packages/toolkits/pro/template/tinyng/src/app/@core/services/auth-guard-service.guard.ts
index cb1d5da3..497c48e0 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@core/services/auth-guard-service.guard.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@core/services/auth-guard-service.guard.ts
@@ -9,17 +9,9 @@ import { AuthService } from './auth.service';
 export class AuthGuardService implements CanActivate {
   i18nValues: any;
 
-  constructor(
-    private router: Router,
-    private authService: AuthService,
-    private translate: TranslateService,
-    private tiMessageService: TiMessageService
-  ) {}
+  constructor(private router: Router, private authService: AuthService, private translate: TranslateService, private tiMessageService: TiMessageService) {}
 
-  canActivate(
-    route: ActivatedRouteSnapshot,
-    state: RouterStateSnapshot
-  ): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
     if (!this.authService.isUserLoggedIn()) {
       this.router.navigate(['pages/login']);
       setTimeout(() => {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@core/services/contracts.service.ts b/packages/toolkits/pro/template/tinyng/src/app/@core/services/contracts.service.ts
index c425b1db..99222a00 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@core/services/contracts.service.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@core/services/contracts.service.ts
@@ -1,33 +1,33 @@
-import { HwcClientService } from './hwcClient.service';
-import { ApigInfo } from '@shared/tiny-pro';
-
-const contractApigInfo: ApigInfo = {
-  apigName: 'apig_contract',
-  apigGroupName: 'group_contract',
-};
-
-export class ContractsService {
-  async getContractsData(params: { query: string; field: string }) {
-    const result = await HwcClientService.apiRequest('getContracts', params, contractApigInfo);
-
-    return result?.data;
-  }
-
-  async getContractsByPage(params: { query: string; field: string; pagesize: number; pagenum: number }) {
-    const result = await HwcClientService.apiRequest('getContractsByPage', params, contractApigInfo);
-
-    return result?.data;
-  }
-
-  createContracts(params: { name: string; customer: string; description: string }) {
-    return HwcClientService.apiRequest('addContract', params, contractApigInfo);
-  }
-
-  editContracts(params: { id: string; name: string; customer: string; description: string }) {
-    return HwcClientService.apiRequest('editContract', params, contractApigInfo);
-  }
-
-  delContracts(params: { id: string }) {
-    return HwcClientService.apiRequest('delContract', params, contractApigInfo);
-  }
-}
+import { HwcClientService } from './hwcClient.service';
+import { ApigInfo } from '@shared/tiny-pro';
+
+const contractApigInfo: ApigInfo = {
+  apigName: 'apig_contract',
+  apigGroupName: 'group_contract',
+};
+
+export class ContractsService {
+  async getContractsData(params: { query: string; field: string }) {
+    const result = await HwcClientService.apiRequest('getContracts', params, contractApigInfo);
+
+    return result?.data;
+  }
+
+  async getContractsByPage(params: { query: string; field: string; pagesize: number; pagenum: number }) {
+    const result = await HwcClientService.apiRequest('getContractsByPage', params, contractApigInfo);
+
+    return result?.data;
+  }
+
+  createContracts(params: { name: string; customer: string; description: string }) {
+    return HwcClientService.apiRequest('addContract', params, contractApigInfo);
+  }
+
+  editContracts(params: { id: string; name: string; customer: string; description: string }) {
+    return HwcClientService.apiRequest('editContract', params, contractApigInfo);
+  }
+
+  delContracts(params: { id: string }) {
+    return HwcClientService.apiRequest('delContract', params, contractApigInfo);
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@core/services/custom-theme.service.ts b/packages/toolkits/pro/template/tinyng/src/app/@core/services/custom-theme.service.ts
index e7c6add3..32493474 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@core/services/custom-theme.service.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@core/services/custom-theme.service.ts
@@ -6,16 +6,10 @@ export class CustomThemeService {
   changeCustomTheme(color: string, isDark: boolean) {
     if (isDark) {
       setTimeout(() => {
-        TiTheme.loadCss(
-          `${ThemeAddrPrefix}/tiny-dark-theme.css`,
-          'tiny3theme'
-        );
+        TiTheme.loadCss(`${ThemeAddrPrefix}/tiny-dark-theme.css`, 'tiny3theme');
       });
     } else {
-      TiTheme.loadCss(
-        `${ThemeAddrPrefix}/tiny-hws-theme.css`,
-        'tiny3theme'
-      );
+      TiTheme.loadCss(`${ThemeAddrPrefix}/tiny-hws-theme.css`, 'tiny3theme');
     }
 
     for (const style of CustomStyle) {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@core/services/hwcClient.service.ts b/packages/toolkits/pro/template/tinyng/src/app/@core/services/hwcClient.service.ts
index a2d51fca..6325520a 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@core/services/hwcClient.service.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@core/services/hwcClient.service.ts
@@ -1,17 +1,17 @@
-import { HwcClient } from '@opentiny/hwc-client';
-import { ApigInfo, BaseUtils } from '@shared/tiny-pro';
-
-export class HwcClientService {
-  public static async apiRequest(fnName: string, params: any, apigInfo: ApigInfo) {
-    try {
-      const response = await HwcClient.apigClient.exec(apigInfo.apigGroupName, apigInfo.apigName, {
-        query: { fn_name: fnName },
-        body: JSON.stringify(params),
-      });
-
-      return response?.json();
-    } catch (error) {
-      return BaseUtils.getErrorMessage(error);
-    }
-  }
-}
+import { HwcClient } from '@opentiny/hwc-client';
+import { ApigInfo, BaseUtils } from '@shared/tiny-pro';
+
+export class HwcClientService {
+  public static async apiRequest(fnName: string, params: any, apigInfo: ApigInfo) {
+    try {
+      const response = await HwcClient.apigClient.exec(apigInfo.apigGroupName, apigInfo.apigName, {
+        query: { fn_name: fnName },
+        body: JSON.stringify(params),
+      });
+
+      return response?.json();
+    } catch (error) {
+      return BaseUtils.getErrorMessage(error);
+    }
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@core/services/obs.service.ts b/packages/toolkits/pro/template/tinyng/src/app/@core/services/obs.service.ts
index 20587c8e..ad7f1bc0 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@core/services/obs.service.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@core/services/obs.service.ts
@@ -1,88 +1,88 @@
-import { HwcClient } from '@opentiny/hwc-client';
-import { Bucket, BucketUpload } from '@shared/tiny-pro';
-import hwcConfig from '../../../../hwc-exports.json';
-
-// obs接口文档:https://support.huaweicloud.com/api-obs_browserjs_sdk_api_zh/obs_34_0301.html
-// 配置桶跨域：https://support.huaweicloud.com/sdk-browserjs-devg-obs/obs_24_0201.html
-export class ObsService {
-  private getBucketMetadata(bucket: Bucket) {
-    HwcClient.obsClient.getBucketMetadata(
-      {
-        Bucket: bucket.bucketName,
-      },
-      (err: any, result: any) => {
-        if (err) {
-          console.error('Error-->' + err);
-        } else {
-          if (result.CommonMsg.Status < 300 && result.InterfaceResult) {
-            bucket.storage = result.InterfaceResult.StorageClass;
-            bucket.region = result.InterfaceResult.Location;
-            bucket.version = result.InterfaceResult.ObsVersion;
-          }
-        }
-      }
-    );
-  }
-
-  private getBucketStorageInfo(bucket: Bucket) {
-    HwcClient.obsClient.getBucketStorageInfo(
-      {
-        Bucket: bucket.bucketName,
-      },
-      (err: any, result: any) => {
-        if (err) {
-          console.error('Error-->' + err);
-        } else {
-          if (result.CommonMsg.Status < 300 && result.InterfaceResult) {
-            bucket.objects = result.InterfaceResult.ObjectNumber;
-            bucket.capaticity = result.InterfaceResult.Size;
-          }
-        }
-      }
-    );
-  }
-
-  public async uploadUsingFile(bucketUpload: BucketUpload): Promise<any> {
-    return HwcClient.obsClient
-      .putObject({
-        Bucket: bucketUpload.bucketName,
-        Key: bucketUpload.objectName,
-        SourceFile: bucketUpload.sourceFile,
-      })
-      .then((result: any) => {
-        if (result.CommonMsg.Status < 300) {
-          console.info('ObsService Upload File Succeed');
-        } else {
-          console.info('ObsService Upload File Message:' + result.CommonMsg.Message);
-        }
-
-        return result;
-      })
-      .catch((err: any) => {
-        console.error('ObsService Upload File Error:' + err);
-
-        return err;
-      });
-  }
-
-  getObsTableData() {
-    let data: Array<Bucket> = [];
-
-    const {
-      hwcConfig: {
-        obs: { bucketsList },
-      },
-    } = JSON.parse(JSON.stringify(hwcConfig));
-
-    if (bucketsList.length) {
-      data = bucketsList.map((item: Bucket) => {
-        this.getBucketMetadata(item);
-        this.getBucketStorageInfo(item);
-
-        return item;
-      });
-    }
-
-    return data;
-  }
-}
+import { HwcClient } from '@opentiny/hwc-client';
+import { Bucket, BucketUpload } from '@shared/tiny-pro';
+import hwcConfig from '../../../../hwc-exports.json';
+
+// obs接口文档:https://support.huaweicloud.com/api-obs_browserjs_sdk_api_zh/obs_34_0301.html
+// 配置桶跨域：https://support.huaweicloud.com/sdk-browserjs-devg-obs/obs_24_0201.html
+export class ObsService {
+  private getBucketMetadata(bucket: Bucket) {
+    HwcClient.obsClient.getBucketMetadata(
+      {
+        Bucket: bucket.bucketName,
+      },
+      (err: any, result: any) => {
+        if (err) {
+          console.error('Error-->' + err);
+        } else {
+          if (result.CommonMsg.Status < 300 && result.InterfaceResult) {
+            bucket.storage = result.InterfaceResult.StorageClass;
+            bucket.region = result.InterfaceResult.Location;
+            bucket.version = result.InterfaceResult.ObsVersion;
+          }
+        }
+      }
+    );
+  }
+
+  private getBucketStorageInfo(bucket: Bucket) {
+    HwcClient.obsClient.getBucketStorageInfo(
+      {
+        Bucket: bucket.bucketName,
+      },
+      (err: any, result: any) => {
+        if (err) {
+          console.error('Error-->' + err);
+        } else {
+          if (result.CommonMsg.Status < 300 && result.InterfaceResult) {
+            bucket.objects = result.InterfaceResult.ObjectNumber;
+            bucket.capaticity = result.InterfaceResult.Size;
+          }
+        }
+      }
+    );
+  }
+
+  public async uploadUsingFile(bucketUpload: BucketUpload): Promise<any> {
+    return HwcClient.obsClient
+      .putObject({
+        Bucket: bucketUpload.bucketName,
+        Key: bucketUpload.objectName,
+        SourceFile: bucketUpload.sourceFile,
+      })
+      .then((result: any) => {
+        if (result.CommonMsg.Status < 300) {
+          console.info('ObsService Upload File Succeed');
+        } else {
+          console.info('ObsService Upload File Message:' + result.CommonMsg.Message);
+        }
+
+        return result;
+      })
+      .catch((err: any) => {
+        console.error('ObsService Upload File Error:' + err);
+
+        return err;
+      });
+  }
+
+  getObsTableData() {
+    let data: Array<Bucket> = [];
+
+    const {
+      hwcConfig: {
+        obs: { bucketsList },
+      },
+    } = JSON.parse(JSON.stringify(hwcConfig));
+
+    if (bucketsList.length) {
+      data = bucketsList.map((item: Bucket) => {
+        this.getBucketMetadata(item);
+        this.getBucketStorageInfo(item);
+
+        return item;
+      });
+    }
+
+    return data;
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@core/services/personalize.service.ts b/packages/toolkits/pro/template/tinyng/src/app/@core/services/personalize.service.ts
index c36bf02e..1f20b768 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@core/services/personalize.service.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@core/services/personalize.service.ts
@@ -1,11 +1,6 @@
 import { Injectable } from '@angular/core';
 import { TiTheme } from '@opentiny/ng';
-import {
-  TinyThemeConfigItems,
-  DefaultTheme,
-  ThemeAddrPrefix,
-  ThemeType,
-} from 'src/app/@shared/models/theme';
+import { TinyThemeConfigItems, DefaultTheme, ThemeAddrPrefix, ThemeType } from 'src/app/@shared/models/theme';
 import { CustomStyle } from '@config/tiny-pro';
 import { CustomThemeService } from './custom-theme.service';
 
@@ -26,9 +21,7 @@ export class PersonalizeService {
     this.addTinyTheme();
 
     // 主题设置
-    const theme = localStorage.getItem('t-pro-theme')
-      ? JSON.parse(localStorage.getItem('t-pro-theme')!)
-      : DefaultTheme;
+    const theme = localStorage.getItem('t-pro-theme') ? JSON.parse(localStorage.getItem('t-pro-theme')!) : DefaultTheme;
 
     if (theme.id === DefaultTheme.id) {
       this.setDefaultThemeStorage(theme);
@@ -42,10 +35,7 @@ export class PersonalizeService {
       this.customThemeService.changeCustomTheme(brand, isDark);
     } else {
       setTimeout(() => {
-        TiTheme.loadCss(
-          `${ThemeAddrPrefix}/${theme.id}.css`,
-          'tiny3theme'
-        );
+        TiTheme.loadCss(`${ThemeAddrPrefix}/${theme.id}.css`, 'tiny3theme');
       });
     }
   }
@@ -85,9 +75,7 @@ export class PersonalizeService {
       document.body.style.setProperty('--ti-leftmenu-item-selected-border-left-color', '');
     }
 
-    const theme = localStorage.getItem('t-pro-theme')
-      ? JSON.parse(localStorage.getItem('t-pro-theme')!)
-      : DefaultTheme;
+    const theme = localStorage.getItem('t-pro-theme') ? JSON.parse(localStorage.getItem('t-pro-theme')!) : DefaultTheme;
 
     // 需要保存之前设置过的自定义主题相关配置
     this.setDefaultThemeStorage(theme);
@@ -100,9 +88,6 @@ export class PersonalizeService {
     }
 
     const { brand, isDark } = theme.custom;
-    localStorage.setItem(
-      't-pro-theme',
-      JSON.stringify({ id: themeId, custom: { brand, isDark } })
-    );
+    localStorage.setItem('t-pro-theme', JSON.stringify({ id: themeId, custom: { brand, isDark } }));
   }
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@core/services/util.service.ts b/packages/toolkits/pro/template/tinyng/src/app/@core/services/util.service.ts
index 6dccd210..9bebd751 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@core/services/util.service.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@core/services/util.service.ts
@@ -1,52 +1,44 @@
-import { UNITS } from '@shared/tiny-pro';
-
-export class LogicUtilService {
-  public static getFileSize(insize: string) {
-    // 运算前先转换成浮点数
-    let size: number = parseFloat(insize);
-    if (size) {
-      let unitIndex = 0;
-      let fractionDigit = 2;
-      const units = [UNITS.BYTES, UNITS.KIB, UNITS.MIB, UNITS.GIB, UNITS.TIB, UNITS.PIB];
-      const indexMax = units.length - 1;
-      while (size >= 1024.0 && unitIndex < indexMax) {
-        size = size / 1024.0;
-        unitIndex++;
-      }
-      let unit = units[unitIndex];
-      // 0或1字节改为byte
-      if (unitIndex === 0) {
-        fractionDigit = 0;
-        if (size <= 1) {
-          unit = UNITS.BYTE;
-        }
-      }
-
-      return `${size.toFixed(fractionDigit)} ${unit}`;
-    } else {
-      return `0 ${UNITS.BYTE}`;
-    }
-  }
-}
-
-
-export class TimeUtilService{
-  // 转化中国标准时间
-  public static formatDate(d: Date) {
-    let date = new Date(d);
-    let YY = date.getFullYear() + '-';
-    let MM =
-      (date.getMonth() + 1 < 10
-        ? '0' + (date.getMonth() + 1)
-        : date.getMonth() + 1) + '-';
-    let DD = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
-    let hh =
-      (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
-    let mm =
-      (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) +
-      ':';
-    let ss =
-      date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
-    return YY + MM + DD + ' ' + hh + mm + ss;
-  }
-}
+import { UNITS } from '@shared/tiny-pro';
+
+export class LogicUtilService {
+  public static getFileSize(insize: string) {
+    // 运算前先转换成浮点数
+    let size: number = parseFloat(insize);
+    if (size) {
+      let unitIndex = 0;
+      let fractionDigit = 2;
+      const units = [UNITS.BYTES, UNITS.KIB, UNITS.MIB, UNITS.GIB, UNITS.TIB, UNITS.PIB];
+      const indexMax = units.length - 1;
+      while (size >= 1024.0 && unitIndex < indexMax) {
+        size = size / 1024.0;
+        unitIndex++;
+      }
+      let unit = units[unitIndex];
+      // 0或1字节改为byte
+      if (unitIndex === 0) {
+        fractionDigit = 0;
+        if (size <= 1) {
+          unit = UNITS.BYTE;
+        }
+      }
+
+      return `${size.toFixed(fractionDigit)} ${unit}`;
+    } else {
+      return `0 ${UNITS.BYTE}`;
+    }
+  }
+}
+
+export class TimeUtilService {
+  // 转化中国标准时间
+  public static formatDate(d: Date) {
+    let date = new Date(d);
+    let YY = date.getFullYear() + '-';
+    let MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
+    let DD = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
+    let hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
+    let mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
+    let ss = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
+    return YY + MM + DD + ' ' + hh + mm + ss;
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/common/constants.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/common/constants.ts
index 75c434ed..91855df0 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/common/constants.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/common/constants.ts
@@ -1,35 +1,35 @@
-export const SupportUrlPrefix = 'https://support.huaweicloud.com/';
-export const NoticeUrl = 'https://www.huaweicloud.com/notice.html';
-export const TurorialI18nPrefix = 'consoleHome.beginner.';
-export const NoticeI18nPrefix = 'consoleHome.announcement.';
-export const MapI18nPrefix = 'serviceOverview.growthMap.';
-export const CreationI18nPrefix = 'serviceOverview.creation.';
-export const RegionI18nPrefix = 'servicePurchase.regionSelect.';
-export const ImageI18nPrefix = 'servicePurchase.image.';
-export const ImgAddrPrefix = 'https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/tinyUI-admin/img';
-export const ConfigurationI18nPrefix = 'servicePurchase.configuration.';
-export const PurSettingsI18nPrefix = 'servicePurchase.settings.';
-export const BucketListHeadI18nPrefix = 'serviceList.buckets.guideHead.';
-export const BucketDetailTableI18nPrefix = 'serviceList.buckets.detailTable.';
-export const ContractsListHeadI18nPrefix = 'serviceList.contracts.guideHead.';
-export const ContractsDetailTableI18nPrefix = 'serviceList.contracts.detailTable.';
-export const HeaderNoticeI18nPrefix = 'notice.mockData.';
-
-export const UNITS = {
-  BYTE: 'byte',
-  BYTES: 'bytes',
-  KIB: 'KB',
-  MIB: 'MB',
-  GIB: 'GB',
-  TIB: 'TB',
-  PIB: 'PB',
-};
-
-export interface ApigInfo {
-  apigName: string,
-  apigGroupName: string,
-}
-
-export type CommonError = {
-  message: string;
-};
+export const SupportUrlPrefix = 'https://support.huaweicloud.com/';
+export const NoticeUrl = 'https://www.huaweicloud.com/notice.html';
+export const TurorialI18nPrefix = 'consoleHome.beginner.';
+export const NoticeI18nPrefix = 'consoleHome.announcement.';
+export const MapI18nPrefix = 'serviceOverview.growthMap.';
+export const CreationI18nPrefix = 'serviceOverview.creation.';
+export const RegionI18nPrefix = 'servicePurchase.regionSelect.';
+export const ImageI18nPrefix = 'servicePurchase.image.';
+export const ImgAddrPrefix = 'https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/tinyUI-admin/img';
+export const ConfigurationI18nPrefix = 'servicePurchase.configuration.';
+export const PurSettingsI18nPrefix = 'servicePurchase.settings.';
+export const BucketListHeadI18nPrefix = 'serviceList.buckets.guideHead.';
+export const BucketDetailTableI18nPrefix = 'serviceList.buckets.detailTable.';
+export const ContractsListHeadI18nPrefix = 'serviceList.contracts.guideHead.';
+export const ContractsDetailTableI18nPrefix = 'serviceList.contracts.detailTable.';
+export const HeaderNoticeI18nPrefix = 'notice.mockData.';
+
+export const UNITS = {
+  BYTE: 'byte',
+  BYTES: 'bytes',
+  KIB: 'KB',
+  MIB: 'MB',
+  GIB: 'GB',
+  TIB: 'TB',
+  PIB: 'PB',
+};
+
+export interface ApigInfo {
+  apigName: string;
+  apigGroupName: string;
+}
+
+export type CommonError = {
+  message: string;
+};
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/common/index.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/common/index.ts
index 33bca645..a51bde1d 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/common/index.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/common/index.ts
@@ -1,2 +1,2 @@
-export * from './constants';
-export * from './sideMenu';
\ No newline at end of file
+export * from './constants';
+export * from './sideMenu';
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/common/sideMenu.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/common/sideMenu.ts
index 1f7eab22..468b42da 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/common/sideMenu.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/common/sideMenu.ts
@@ -1,4 +1,4 @@
-export const SIZE = {
-    OPEN_WIDTH: 250,
-    CLOSE_WIDTH: 0
-}
\ No newline at end of file
+export const SIZE = {
+  OPEN_WIDTH: 250,
+  CLOSE_WIDTH: 0,
+};
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/footer/footer.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/footer/footer.component.scss
index 0b5e5d0c..8a8554db 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/footer/footer.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/footer/footer.component.scss
@@ -8,7 +8,7 @@
     align-items: center;
     justify-content: center;
     font-size: 14px;
-    
+
     .t-pro-production-name {
       a {
         color: var(--ti-base-color-common-5);
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header-collapsed-button/header-collapsed-button.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header-collapsed-button/header-collapsed-button.component.scss
index e4a942ed..b3523272 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header-collapsed-button/header-collapsed-button.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header-collapsed-button/header-collapsed-button.component.scss
@@ -27,14 +27,14 @@
     margin: 3px 0;
   }
 
-  .ti3-leftmenu-level1-active-item:before, .ti3-leftmenu-level2-active:before {
+  .ti3-leftmenu-level1-active-item:before,
+  .ti3-leftmenu-level2-active:before {
     background-color: var(--ti-base-color-brand-6);
   }
 
   ::ng-deep .ti3-leftmenu-panel {
     color: var(--ti-common-color-text-primary);
     font-size: 14px;
-    
   }
 
   ::ng-deep .ti3-leftmenu-level1-item.ti3-leftmenu-level1-active-item {
@@ -87,4 +87,4 @@
     width: 1.3em;
     height: 1.3em;
   }
-}
\ No newline at end of file
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header-collapsed-button/header-collapsed-button.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header-collapsed-button/header-collapsed-button.component.ts
index a8d05b30..e9848bbc 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header-collapsed-button/header-collapsed-button.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header-collapsed-button/header-collapsed-button.component.ts
@@ -3,10 +3,9 @@ import { TiLeftmenuItem } from '@opentiny/ng';
 @Component({
   selector: 't-pro-header-collapsed-button',
   templateUrl: './header-collapsed-button.component.html',
-  styleUrls: ['./header-collapsed-button.component.scss']
+  styleUrls: ['./header-collapsed-button.component.scss'],
 })
 export class HeaderCollapsedButtonComponent {
-
   @Input() menu: any;
   @Input() hideLogo: boolean = false;
   public active: TiLeftmenuItem;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-left-menu/header-left-menu.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-left-menu/header-left-menu.component.scss
index 2b19f006..5fd4be0b 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-left-menu/header-left-menu.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-left-menu/header-left-menu.component.scss
@@ -1,43 +1,42 @@
-.console-home {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  color: inherit;
-  fill: currentColor;
-  line-height: 10px;
-  cursor: pointer;
-  
-  ::ng-deep .ti3-overflow-padding {
-    font-size: 14px;
-    color: #575d6c;
-  }
-}
-
-
-.divide-line {
-  height: 18px;
-  padding-left: 28px;
-  border-left: 1px solid #dfe1e6;
-}
-
-.console-text {
-  font-size: 14px;
-  color: #202e54;
-  min-width: 42px;
-  margin-right: 10px;
-}
-
-.region-select {
-  width: 180px;
-  height: 32px;
-  line-height: 32px;
-  padding: 0 8px 0 2px;
-  border-radius: 16px;
-  border: none;
-  background-color: #eff2f8 !important;
-}
-
-.region-icon {
-  color: var(--ti-common-color-icon-normal);
-  margin-right: var(--ti-common-space-base);
-}
+.console-home {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  color: inherit;
+  fill: currentColor;
+  line-height: 10px;
+  cursor: pointer;
+
+  ::ng-deep .ti3-overflow-padding {
+    font-size: 14px;
+    color: #575d6c;
+  }
+}
+
+.divide-line {
+  height: 18px;
+  padding-left: 28px;
+  border-left: 1px solid #dfe1e6;
+}
+
+.console-text {
+  font-size: 14px;
+  color: #202e54;
+  min-width: 42px;
+  margin-right: 10px;
+}
+
+.region-select {
+  width: 180px;
+  height: 32px;
+  line-height: 32px;
+  padding: 0 8px 0 2px;
+  border-radius: 16px;
+  border: none;
+  background-color: #eff2f8 !important;
+}
+
+.region-icon {
+  color: var(--ti-common-color-icon-normal);
+  margin-right: var(--ti-common-space-base);
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-logo/header-logo.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-logo/header-logo.component.scss
index 9ba4eded..666d76ea 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-logo/header-logo.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-logo/header-logo.component.scss
@@ -40,7 +40,7 @@
     padding-left: 32px;
     border-left: 1px solid #dfe1e6;
   }
-  
+
   .t-pro-logo-text {
     margin: 0 32px 0 12px;
     line-height: 32px;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-notice/header-notice.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-notice/header-notice.component.scss
index 3aa0c8e5..58e54c10 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-notice/header-notice.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-notice/header-notice.component.scss
@@ -9,7 +9,7 @@ ti-halfmodal {
   margin-right: 34px;
   overflow: hidden;
   border-radius: 8px;
-  box-shadow: 0px 0px 30px 15px rgba(37,43,58,0.15); 
+  box-shadow: 0px 0px 30px 15px rgba(37, 43, 58, 0.15);
 }
 
 // 覆盖组件行内样式
@@ -45,14 +45,14 @@ ti-halfmodal {
     color: #86909c;
   }
 
-  >a {
+  > a {
     color: var(--ti-base-color-brand-7);
     height: 16px;
     text-decoration: none;
     margin: 0;
   }
 
-  >a:not(:last-of-type) {
+  > a:not(:last-of-type) {
     border-right: 1px solid #ccc;
   }
 }
@@ -128,4 +128,4 @@ ti-halfmodal {
   font-size: 14px;
   color: #2f5bea;
   line-height: 20px;
-}
\ No newline at end of file
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-notice/header-notice.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-notice/header-notice.component.ts
index 87f30821..072deda0 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-notice/header-notice.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-notice/header-notice.component.ts
@@ -1,6 +1,6 @@
 import { Component, EventEmitter, OnInit, Input, Output, ViewChild, SimpleChanges, ElementRef, ViewChildren, QueryList } from '@angular/core';
 import { TranslateService } from '@ngx-translate/core';
-import { TiHalfmodalComponent, TiTipDirective  } from '@opentiny/ng';
+import { TiHalfmodalComponent, TiTipDirective } from '@opentiny/ng';
 import { TProTranslatePipe } from '@shared/tiny-pro';
 import { Notification } from 'src/app/@core/data/noticeData';
 import { NoticeDataService } from 'src/app/@core/mock/notice-data.service';
@@ -21,14 +21,10 @@ export class HeaderNoticeComponent implements OnInit {
 
   notifications: Notification[] = [];
   public tipSwitch: boolean = false;
-  public textEnd:string = this.translate.instant('notice.extend');
+  public textEnd: string = this.translate.instant('notice.extend');
   public modalStatus: boolean = true;
 
-  constructor(
-    private noticeService: NoticeDataService,
-    private translate: TranslateService,
-    private tProTrans: TProTranslatePipe,
-  ) { }
+  constructor(private noticeService: NoticeDataService, private translate: TranslateService, private tProTrans: TProTranslatePipe) {}
 
   ngOnInit() {
     this.noticeService.getNotifications().subscribe((notifications) => {
@@ -40,18 +36,18 @@ export class HeaderNoticeComponent implements OnInit {
     });
   }
 
-  onMouseAction(index:number): void {
-    this.tipDirective.forEach((v:any,i:number) => {
+  onMouseAction(index: number): void {
+    this.tipDirective.forEach((v: any, i: number) => {
       if (index === i) {
         if (this.tipSwitch) {
-          this.tipSwitch= false;
+          this.tipSwitch = false;
           v.hide();
-          setTimeout(()=>{
-            this.toParentStatus(this.tipSwitch)
-          })
+          setTimeout(() => {
+            this.toParentStatus(this.tipSwitch);
+          });
         } else {
-          this.tipSwitch= true;
-          this.toParentStatus(this.tipSwitch)
+          this.tipSwitch = true;
+          this.toParentStatus(this.tipSwitch);
           v.show();
         }
       }
@@ -73,7 +69,7 @@ export class HeaderNoticeComponent implements OnInit {
   }
 
   toParentStatus(status: boolean) {
-    this.showStatus.emit(status)
+    this.showStatus.emit(status);
   }
 
   ngOnChanges(changes: SimpleChanges): void {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-operation.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-operation.component.ts
index c5915ab3..95de2e35 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-operation.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/header-operation/header-operation.component.ts
@@ -22,7 +22,7 @@ export class HeaderOperationComponent implements OnInit {
   isLeaveModal: boolean = false;
   helpCenter: string = '/ng-pro/docs/';
 
-  constructor(private route: Router, private authService: AuthService, private translate: TranslateService) { }
+  constructor(private route: Router, private authService: AuthService, private translate: TranslateService) {}
 
   ngOnInit(): void {
     if (localStorage.getItem('userinfo')) {
@@ -78,8 +78,7 @@ export class HeaderOperationComponent implements OnInit {
   showNoticeModal(isShow: boolean) {
     if (isShow) {
       this.isShowNoticeModal = true;
-    } 
-    else if (!isShow && !this.isLeaveModal) {
+    } else if (!isShow && !this.isLeaveModal) {
       this.isShowNoticeModal = false;
     }
   }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/navbar/navbar.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/navbar/navbar.component.ts
index 2b7ee3c1..54b186bf 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/navbar/navbar.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/header/navbar/navbar.component.ts
@@ -2,7 +2,7 @@ import { AfterViewInit, Component, ElementRef, HostListener, Input, OnInit, Rend
 import { NavigationEnd, Router } from '@angular/router';
 import { ConnectedPosition } from '@angular/cdk/overlay';
 
-export type AppendToBodyDirection= 'rightDown'| 'rightUp' | 'leftUp'| 'leftDown' | 'centerDown' | 'centerUp';
+export type AppendToBodyDirection = 'rightDown' | 'rightUp' | 'leftUp' | 'leftDown' | 'centerDown' | 'centerUp';
 
 @Component({
   selector: 't-pro-navbar',
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/helptip/helptip.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/helptip/helptip.component.ts
index 72ffdeef..94a5c3b6 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/helptip/helptip.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/helptip/helptip.component.ts
@@ -3,7 +3,7 @@ import { Component, Input } from '@angular/core';
 @Component({
   selector: 't-pro-helptip',
   templateUrl: './helptip.component.html',
-  styleUrls: ['./helptip.component.scss']
+  styleUrls: ['./helptip.component.scss'],
 })
 export class HelpTipComponent {
   // 待解释的的文本内容
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/default-layout.config.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/default-layout.config.ts
index d73106fc..918ee394 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/default-layout.config.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/default-layout.config.ts
@@ -1,4 +1,4 @@
-import { TProLayoutConfig } from "./layout.type";
+import { TProLayoutConfig } from './layout.type';
 
 export const DEFAULT_LAYOUT_CONFIG: TProLayoutConfig = {
   id: 'leftRight',
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/layout.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/layout.component.scss
index fe756307..cb6b3836 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/layout.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/layout.component.scss
@@ -19,7 +19,7 @@
     top: 20px;
     width: 16px;
     height: 36px;
-    box-shadow: 0px 4px 12px 0px rgba(0 ,0 ,0 ,.10); 
+    box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
     border: 1px solid #ebebeb;
     background-color: #fff;
     border-radius: 0 8px 8px 0;
@@ -35,7 +35,7 @@
 
     &::after {
       display: block;
-      content: "";
+      content: '';
       position: relative;
       width: 0;
       height: 0;
@@ -101,7 +101,7 @@
 
     .t-pro-layout-header {
       background-color: var(--ti-base-color-white);
-      box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, .20); 
+      box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.2);
     }
 
     &.t-pro-basic-no-sec-header .t-pro-layout-header {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/layout.module.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/layout.module.ts
index 3533dd4b..b796b9d4 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/layout.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/layouts/layout.module.ts
@@ -8,7 +8,7 @@ import {
   TProLayoutSecHeaderComponent,
   TProLayoutSecSidebarComponent,
   TProLayoutSidebarComponent,
-  TProLayoutSidebarToolsComponent
+  TProLayoutSidebarToolsComponent,
 } from './layout.component';
 import { TProBaseLayoutModule } from '../../modules/layout/layout.module';
 
@@ -20,7 +20,7 @@ import { TProBaseLayoutModule } from '../../modules/layout/layout.module';
     TProLayoutSecHeaderComponent,
     TProLayoutSecSidebarComponent,
     TProLayoutSidebarComponent,
-    TProLayoutSidebarToolsComponent
+    TProLayoutSidebarToolsComponent,
   ],
   imports: [CommonModule, TProBaseLayoutModule, TiIconModule],
   exports: [
@@ -30,7 +30,7 @@ import { TProBaseLayoutModule } from '../../modules/layout/layout.module';
     TProLayoutSecHeaderComponent,
     TProLayoutSecSidebarComponent,
     TProLayoutSidebarComponent,
-    TProLayoutSidebarToolsComponent
-  ]
+    TProLayoutSidebarToolsComponent,
+  ],
 })
 export class TProLayoutModule {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/login/login.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/login/login.component.ts
index 2225a9da..7a14d92e 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/login/login.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/login/login.component.ts
@@ -115,9 +115,7 @@ export class LoginComponent implements OnInit {
   }
 
   onClick(tabId: string | number) {
-    const errors: ValidationErrors | null = TiValidators.check(
-      tabId === 'accountTab' ? this.userNameForm : this.emailForm
-    );
+    const errors: ValidationErrors | null = TiValidators.check(tabId === 'accountTab' ? this.userNameForm : this.emailForm);
     // 整体校验后如果需要聚焦到第一个校验不通过元素，请参考以下代码
     if (errors) {
       // 注意：要保证fb.group时各个FormControl的顺序与对应表单元素dom放置顺序一致
@@ -126,12 +124,8 @@ export class LoginComponent implements OnInit {
       return;
     }
 
-    const account =
-      tabId === 'accountTab' ? this.userNameForm.controls.userAccount.value : this.emailForm.controls.userEmail.value;
-    const password =
-      tabId === 'accountTab'
-        ? this.userNameForm.controls.userAccountPassword.value
-        : this.emailForm.controls.userEmailPassword.value;
+    const account = tabId === 'accountTab' ? this.userNameForm.controls.userAccount.value : this.emailForm.controls.userEmail.value;
+    const password = tabId === 'accountTab' ? this.userNameForm.controls.userAccountPassword.value : this.emailForm.controls.userEmailPassword.value;
 
     this.authService.login(account, password).subscribe(
       (res) => {
@@ -139,10 +133,7 @@ export class LoginComponent implements OnInit {
         this.router.navigate(['/']);
       },
       (error) => {
-        this.toastMessage =
-          tabId === 'accountTab'
-            ? this.i18nValues['noticeMessage']['accountContent']
-            : this.i18nValues['noticeMessage']['emailContent'];
+        this.toastMessage = tabId === 'accountTab' ? this.i18nValues['noticeMessage']['accountContent'] : this.i18nValues['noticeMessage']['emailContent'];
         this.typePrompt = 'error';
         this.alertOpen = true;
       }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/multi-settings/multi-settings.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/multi-settings/multi-settings.component.ts
index 76980883..e5caf06f 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/multi-settings/multi-settings.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/multi-settings/multi-settings.component.ts
@@ -5,14 +5,12 @@ import { SideSettingsComponent } from '@shared/tiny-pro';
 @Component({
   selector: 't-pro-multi-settings',
   templateUrl: './multi-settings.component.html',
-  styleUrls: ['./multi-settings.component.scss']
+  styleUrls: ['./multi-settings.component.scss'],
 })
 export class MultiSettingsComponent implements OnInit {
+  constructor(private tiHalfmodalservice: TiHalfmodalService) {}
 
-  constructor(private tiHalfmodalservice: TiHalfmodalService) { }
-
-  ngOnInit(): void {
-  }
+  ngOnInit(): void {}
 
   openSettingDrawer() {
     this.tiHalfmodalservice.open(SideSettingsComponent, {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/multi-settings/side-settings/side-settings.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/multi-settings/side-settings/side-settings.component.scss
index d345529b..a7744066 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/multi-settings/side-settings/side-settings.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/multi-settings/side-settings/side-settings.component.scss
@@ -1,7 +1,7 @@
-::ng-deep ti-halfmodalcontainer.ti3-halfmodal-layout-container{
+::ng-deep ti-halfmodalcontainer.ti3-halfmodal-layout-container {
   padding: 30px;
 }
-  
+
 ::ng-deep ti-icon.ti3-halfmodal-close {
   margin-right: 10px;
   z-index: 100;
@@ -24,11 +24,11 @@
 
     > h3 {
       padding: 10px 0 20px;
-      color: #202E54;
+      color: #202e54;
       font-size: 18px;
       line-height: 25px;
     }
-    &:nth-child(n+2) {
+    &:nth-child(n + 2) {
       margin-top: 30px;
     }
     &:nth-child(3) {
@@ -150,7 +150,6 @@
     }
 
     .t-pro-option-multiple {
-
       .t-pro-multiple-item {
         display: flex;
         justify-content: space-between;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/personalize/personalize.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/personalize/personalize.component.scss
index f548576c..0715abd4 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/personalize/personalize.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/personalize/personalize.component.scss
@@ -87,11 +87,10 @@
     border-radius: var(--ti-common-border-radius-normal);
     cursor: pointer;
     margin-left: 12px;
-    transition: box-shadow 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
-      transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+    transition: box-shadow 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
 
     &:hover {
-      box-shadow: var(--ti-common-shadow-3-down) ;
+      box-shadow: var(--ti-common-shadow-3-down);
     }
     &:first-child {
       margin-left: 0;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/personalize/personalize.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/personalize/personalize.component.ts
index fa333f35..689fd7c1 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/personalize/personalize.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/personalize/personalize.component.ts
@@ -17,15 +17,10 @@ export class PersonalizeComponent implements OnInit {
   public themeColors: any = ThemeColors;
 
   public currentValue: any = {
-    themes: localStorage.getItem('t-pro-theme')
-      ? JSON.parse(localStorage.getItem('t-pro-theme')!)
-      : DefaultTheme,
+    themes: localStorage.getItem('t-pro-theme') ? JSON.parse(localStorage.getItem('t-pro-theme')!) : DefaultTheme,
   };
 
-  constructor(
-    private personalizeService: PersonalizeService,
-    private customThemeService: CustomThemeService
-  ) {
+  constructor(private personalizeService: PersonalizeService, private customThemeService: CustomThemeService) {
     this.customColor = DefaultTheme.brand;
     this.customDark = DefaultTheme.isDark;
   }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/register/register.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/register/register.component.scss
index a33c4a88..99f72e90 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/register/register.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/register/register.component.scss
@@ -1,4 +1,3 @@
-
 :host {
   display: block;
   height: 100vh;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/register/register.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/register/register.component.ts
index c8474d5d..a1286c1f 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/register/register.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/register/register.component.ts
@@ -30,10 +30,10 @@ export class RegisterComponent implements OnInit {
   };
   registerForm: FormGroup;
   validationBlur: TiValidationConfig = {
-    type: 'blur'
+    type: 'blur',
   };
   validationPwd: TiValidationConfig = {
-    type: 'password'
+    type: 'password',
   };
 
   constructor(
@@ -46,16 +46,20 @@ export class RegisterComponent implements OnInit {
   ) {
     this.registerForm = this.fb.group({
       userEmail: new FormControl(this.formData.userEmail, [TiValidators.required, TiValidators.email]),
-      password: new FormControl('', [TiValidators.password({
-        notEqualPosRev: () => {
-          return this.registerForm.get('userEmail') as AbstractControl;
-        }
-      })]),
-      confirmPassword: new FormControl('', [TiValidators.password({
-        notEqualPosRev: () => {
-          return this.registerForm.get('userEmail') as AbstractControl;
-        }
-      })]),
+      password: new FormControl('', [
+        TiValidators.password({
+          notEqualPosRev: () => {
+            return this.registerForm.get('userEmail') as AbstractControl;
+          },
+        }),
+      ]),
+      confirmPassword: new FormControl('', [
+        TiValidators.password({
+          notEqualPosRev: () => {
+            return this.registerForm.get('userEmail') as AbstractControl;
+          },
+        }),
+      ]),
     });
   }
 
@@ -82,8 +86,7 @@ export class RegisterComponent implements OnInit {
     if (errors) {
       // 注意：要保证fb.group时各个FormControl的顺序与对应表单元素dom放置顺序一致
       const firstError: any = Object.keys(errors)[0];
-      this.elementRef.nativeElement.querySelector(`[formControlName=${firstError}]`)
-        .focus();
+      this.elementRef.nativeElement.querySelector(`[formControlName=${firstError}]`).focus();
       return;
     }
 
@@ -97,7 +100,7 @@ export class RegisterComponent implements OnInit {
       title: this.i18nValues.resultMessage.title,
       content: this.i18nValues.resultMessage.content,
       context: {
-        contentName: this.i18nValues.resultMessage.content
+        contentName: this.i18nValues.resultMessage.content,
       },
       okButton: {
         show: true, // 是否显示, 默认是true
@@ -110,11 +113,12 @@ export class RegisterComponent implements OnInit {
           // 使用按钮自定义click时，需要显式调用close或者dismiss
           this.goToLogin(results);
           // 在这里也可以添加你的业务代码
-        }
+        },
+      },
+      cancelButton: {
+        // 取消按钮的设置和okbutton的属性设置是一致的，参考okbutton设置即可。
+        show: false, // 是否显示，默认是true
       },
-      cancelButton: { // 取消按钮的设置和okbutton的属性设置是一致的，参考okbutton设置即可。
-        show: false // 是否显示，默认是true
-      }
     });
   }
 
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/side-menu/side-menu.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/side-menu/side-menu.component.scss
index c74b60a6..2ab8a11a 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/components/side-menu/side-menu.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/components/side-menu/side-menu.component.scss
@@ -6,7 +6,8 @@
     margin: 3px 0;
   }
 
-  .ti3-leftmenu-level1-active-item:before, .ti3-leftmenu-level2-active:before {
+  .ti3-leftmenu-level1-active-item:before,
+  .ti3-leftmenu-level2-active:before {
     background-color: var(--ti-base-color-brand-6);
   }
 
@@ -52,7 +53,7 @@
     height: 28px;
     border-radius: 50%;
     background-color: #fff;
-    box-shadow: 0px 4px 12px 0px rgba(0 ,0 ,0 ,.10); 
+    box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
   }
 
   .menu-item {
@@ -73,4 +74,4 @@
     width: 1.3em;
     height: 1.3em;
   }
-}
\ No newline at end of file
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/index.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/index.ts
index d5b63c76..ba880c1d 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/index.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/index.ts
@@ -5,4 +5,3 @@ export * from './models';
 export * from './locale';
 export * from './common';
 export * from './utils';
-
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/locale/t-pro-translate.pipe.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/locale/t-pro-translate.pipe.ts
index f90ee5eb..499c22d4 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/locale/t-pro-translate.pipe.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/locale/t-pro-translate.pipe.ts
@@ -1,29 +1,29 @@
-import { Pipe, PipeTransform } from '@angular/core';
-import { TranslateService } from '@ngx-translate/core';
-
-@Pipe({
-  name: 'tProTranslate',
-})
-export class TProTranslatePipe implements PipeTransform {
-  constructor(private translate: TranslateService) {}
-
-  transform(items: any): any {
-    const prop = ['label', 'text', 'displayName', 'title', 'name', 'time'];
-
-    items.forEach((item: any) => {
-      for (const key in item) {
-        if (Object.prototype.hasOwnProperty.call(item, key)) {
-          if (prop.includes(key)) {
-            item[key] = this.translate.instant(item[key]);
-          }
-          if (item.options) {
-            item.options.forEach((option: any) => {
-              option.label = this.translate.instant(option.label);
-            });
-          }
-        }
-      }
-    });
-    return items;
-  }
-}
+import { Pipe, PipeTransform } from '@angular/core';
+import { TranslateService } from '@ngx-translate/core';
+
+@Pipe({
+  name: 'tProTranslate',
+})
+export class TProTranslatePipe implements PipeTransform {
+  constructor(private translate: TranslateService) {}
+
+  transform(items: any): any {
+    const prop = ['label', 'text', 'displayName', 'title', 'name', 'time'];
+
+    items.forEach((item: any) => {
+      for (const key in item) {
+        if (Object.prototype.hasOwnProperty.call(item, key)) {
+          if (prop.includes(key)) {
+            item[key] = this.translate.instant(item[key]);
+          }
+          if (item.options) {
+            item.options.forEach((option: any) => {
+              option.label = this.translate.instant(option.label);
+            });
+          }
+        }
+      }
+    });
+    return items;
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/models/obs.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/models/obs.ts
index 1a1c5610..1ac7890d 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/models/obs.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/models/obs.ts
@@ -1,34 +1,34 @@
-import { TiFileItem } from '@opentiny/ng';
-
-enum StorageClass {
-  STANDARD = 'STANDARD',
-  WARM = 'WARM',
-  COLD = 'COLD',
-}
-
-export enum ObsStorageClass {
-  STANDARD = 'serviceList.buckets.detailTable.standard',
-  WARM = 'serviceList.buckets.detailTable.infrequentAccess',
-  COLD = 'serviceList.buckets.detailTable.archive',
-}
-
-export interface Bucket {
-  bucketName: string; // 桶名
-  storage?: StorageClass; // 桶存储类型
-  region?: string; // 桶区域位置
-  capaticity?: string; // 桶的空间大小
-  objects?: number; // 桶内对象个数
-  version?: string; // OBS服务端版本
-}
-
-export interface BucketUpload {
-  bucketName: string; // 桶名
-  objectName: string; // 对象名
-  sourceFile: Blob | File; // 待上传的文件
-}
-
-export interface CancelFileItems {
-  fileItems: TiFileItem[];
-  response: string;
-  status: number;
-}
+import { TiFileItem } from '@opentiny/ng';
+
+enum StorageClass {
+  STANDARD = 'STANDARD',
+  WARM = 'WARM',
+  COLD = 'COLD',
+}
+
+export enum ObsStorageClass {
+  STANDARD = 'serviceList.buckets.detailTable.standard',
+  WARM = 'serviceList.buckets.detailTable.infrequentAccess',
+  COLD = 'serviceList.buckets.detailTable.archive',
+}
+
+export interface Bucket {
+  bucketName: string; // 桶名
+  storage?: StorageClass; // 桶存储类型
+  region?: string; // 桶区域位置
+  capaticity?: string; // 桶的空间大小
+  objects?: number; // 桶内对象个数
+  version?: string; // OBS服务端版本
+}
+
+export interface BucketUpload {
+  bucketName: string; // 桶名
+  objectName: string; // 对象名
+  sourceFile: Blob | File; // 待上传的文件
+}
+
+export interface CancelFileItems {
+  fileItems: TiFileItem[];
+  response: string;
+  status: number;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/models/theme.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/models/theme.ts
index c67ba02e..e5bb58ab 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/models/theme.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/models/theme.ts
@@ -51,30 +51,12 @@ export const ThemeColors = [
   {
     name: 'Light',
     isDark: false,
-    colors: [
-      '#343a40',
-      '#24316c',
-      '#673AB7',
-      '#4f7dff',
-      '#4caf78',
-      '#5faa15',
-      '#ff6a0d',
-      '#f36b7f',
-    ],
+    colors: ['#343a40', '#24316c', '#673AB7', '#4f7dff', '#4caf78', '#5faa15', '#ff6a0d', '#f36b7f'],
   },
   {
     name: 'Dark',
     isDark: true,
-    colors: [
-      '#343a40',
-      '#24316c',
-      '#673AB7',
-      '#4f7dff',
-      '#4caf78',
-      '#5faa15',
-      '#ff6a0d',
-      '#f36b7f',
-    ],
+    colors: ['#343a40', '#24316c', '#673AB7', '#4f7dff', '#4caf78', '#5faa15', '#ff6a0d', '#f36b7f'],
   },
 ];
 
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/avatar/avatar.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/avatar/avatar.component.ts
index 9f10b6c1..e9bd8b96 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/avatar/avatar.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/avatar/avatar.component.ts
@@ -11,8 +11,8 @@ export class TProBaseAvatarComponent implements OnChanges, OnInit {
   isNobody = true;
   isErrorImg = false;
   /**
-  * 自定义头像显示文字
-  */
+   * 自定义头像显示文字
+   */
   @Input() gender: 'male' | 'female' | string;
   /**
    * avatar宽度
@@ -33,8 +33,8 @@ export class TProBaseAvatarComponent implements OnChanges, OnInit {
    */
   @Input() imgSrc: string;
   /**
- * 用户名称
- */
+   * 用户名称
+   */
   @Input() name: string;
   /**
    * 自定义头像显示文字
@@ -44,18 +44,19 @@ export class TProBaseAvatarComponent implements OnChanges, OnInit {
   fontSize = 12;
   code: number;
   nameDisplay: string;
-  constructor() { }
+  constructor() {}
 
   ngOnInit(): void {
     this.calcValues(this.customText ? this.customText : this.name);
   }
 
   ngOnChanges(changes: SimpleChanges): void {
-    if (changes['width'] && !changes['width'].isFirstChange()
-      || changes['customText'] && !changes['customText'].isFirstChange()
-      || changes['gender'] && !changes['gender'].isFirstChange()
-      || changes['height'] && !changes['height'].isFirstChange()
-      || changes['name'] && !changes['name'].isFirstChange()
+    if (
+      (changes['width'] && !changes['width'].isFirstChange()) ||
+      (changes['customText'] && !changes['customText'].isFirstChange()) ||
+      (changes['gender'] && !changes['gender'].isFirstChange()) ||
+      (changes['height'] && !changes['height'].isFirstChange()) ||
+      (changes['name'] && !changes['name'].isFirstChange())
     ) {
       this.calcValues(this.customText ? this.customText : this.name);
     }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/avatar/avatar.module.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/avatar/avatar.module.ts
index a097568e..72c8c149 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/avatar/avatar.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/avatar/avatar.module.ts
@@ -4,15 +4,8 @@ import { FormsModule } from '@angular/forms';
 import { TProBaseAvatarComponent } from './avatar.component';
 
 @NgModule({
-  imports: [
-    CommonModule,
-    FormsModule
-  ],
-  exports: [
-    TProBaseAvatarComponent,
-  ],
-  declarations: [
-    TProBaseAvatarComponent,
-  ]
+  imports: [CommonModule, FormsModule],
+  exports: [TProBaseAvatarComponent],
+  declarations: [TProBaseAvatarComponent],
 })
 export class TProBaseAvatarModule {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.component.scss
index 1482909d..67455765 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.component.scss
@@ -1,4 +1,4 @@
-@import "~@opentiny/ng/themes/theme-default.css";
+@import '~@opentiny/ng/themes/theme-default.css';
 
 .t-pro-base-backtop {
   width: 40px;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.component.ts
index 5b8321aa..c1d3fb3f 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.component.ts
@@ -1,7 +1,18 @@
 import { DOCUMENT } from '@angular/common';
 import {
-  ChangeDetectionStrategy, ChangeDetectorRef, Component,
-  ElementRef, EventEmitter, Inject, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges, TemplateRef
+  ChangeDetectionStrategy,
+  ChangeDetectorRef,
+  Component,
+  ElementRef,
+  EventEmitter,
+  Inject,
+  Input,
+  OnChanges,
+  OnDestroy,
+  OnInit,
+  Output,
+  SimpleChanges,
+  TemplateRef,
 } from '@angular/core';
 import { fromEvent, Subscription } from 'rxjs';
 import { debounceTime } from 'rxjs/operators';
@@ -19,7 +30,7 @@ export class TProBaseBackTopComponent implements OnInit, OnChanges, OnDestroy {
   @Input() bottom: string = '50px';
   @Input() right: string = '30px';
   @Input() scrollTarget: HTMLElement;
-  @Output() backTopEvent =  new EventEmitter<boolean>();
+  @Output() backTopEvent = new EventEmitter<boolean>();
 
   currScrollTop = 0;
   isVisible = false;
@@ -67,9 +78,9 @@ export class TProBaseBackTopComponent implements OnInit, OnChanges, OnDestroy {
   }
 
   showButton() {
-    this.currScrollTop = this.target === window ?
-      (window.pageYOffset || this.document.documentElement.scrollTop || this.document.body.scrollTop) : this.scrollTarget.scrollTop;
-    if (this.isVisible !== (this.currScrollTop >= this.visibleHeight)) {
+    this.currScrollTop =
+      this.target === window ? window.pageYOffset || this.document.documentElement.scrollTop || this.document.body.scrollTop : this.scrollTarget.scrollTop;
+    if (this.isVisible !== this.currScrollTop >= this.visibleHeight) {
       this.isVisible = !this.isVisible;
     }
   }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.module.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.module.ts
index 9c50b01a..787752f3 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/back-top/back-top.module.ts
@@ -3,11 +3,8 @@ import { NgModule } from '@angular/core';
 import { TProBaseBackTopComponent } from './back-top.component';
 
 @NgModule({
-  imports: [
-    CommonModule
-  ],
+  imports: [CommonModule],
   exports: [TProBaseBackTopComponent],
-  declarations: [TProBaseBackTopComponent]
+  declarations: [TProBaseBackTopComponent],
 })
-export class TProBaseBackTopModule {
-}
+export class TProBaseBackTopModule {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.component.scss
index 4901bc6a..629be29c 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.component.scss
@@ -1,4 +1,4 @@
-@import "~@opentiny/ng/themes/theme-default.css";
+@import '~@opentiny/ng/themes/theme-default.css';
 
 @mixin status-color {
   &-danger {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.component.ts
index ab3cba4d..0dad1ac6 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.component.ts
@@ -1,18 +1,10 @@
-import {
-  AfterViewInit,
-  ChangeDetectorRef,
-  Component,
-  ElementRef,
-  Input,
-  ViewChild
-} from '@angular/core';
+import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, Input, ViewChild } from '@angular/core';
 import { TProBaseBadgePositionType, TProBaseBadgeStatusType } from './badge.types';
 
-
 @Component({
   selector: 't-pro-base-badge',
   templateUrl: './badge.component.html',
-  styleUrls: ['./badge.component.scss']
+  styleUrls: ['./badge.component.scss'],
 })
 export class TProBaseBadgeComponent implements AfterViewInit {
   hasContent = true;
@@ -49,7 +41,7 @@ export class TProBaseBadgeComponent implements AfterViewInit {
   }
 
   parseCountToNumber() {
-    if(typeof(this.count) === 'number') {
+    if (typeof this.count === 'number') {
       return this.count;
     } else {
       const parseNumber = parseInt(this.count, 10);
@@ -57,13 +49,10 @@ export class TProBaseBadgeComponent implements AfterViewInit {
     }
   }
 
-  constructor(
-    private cdr: ChangeDetectorRef,
-  ) { }
+  constructor(private cdr: ChangeDetectorRef) {}
 
   ngAfterViewInit() {
     this.hasContentProjection();
     this.cdr.detectChanges();
   }
-
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.module.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.module.ts
index 7a0f172e..c3dc0c96 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/badge/badge.module.ts
@@ -3,10 +3,8 @@ import { NgModule } from '@angular/core';
 import { TProBaseBadgeComponent } from './badge.component';
 
 @NgModule({
-  imports: [
-    CommonModule,
-  ],
+  imports: [CommonModule],
   exports: [TProBaseBadgeComponent],
-  declarations: [TProBaseBadgeComponent]
+  declarations: [TProBaseBadgeComponent],
 })
-export class TProBaseBadgeModule { }
+export class TProBaseBadgeModule {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown-menu.directive.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown-menu.directive.ts
index f9bbade6..5f08dff3 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown-menu.directive.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown-menu.directive.ts
@@ -21,11 +21,17 @@ export class TProBaseDropDownMenuDirective implements OnInit, OnDestroy {
   keydownEscapeSub: Subscription;
   popDirectionCache: 'top' | 'bottom';
   private currentValue: any = false;
-  constructor(@Host() private dropdown: TProBaseDropDownDirective, private el: ElementRef, private render: Renderer2,
-              private windowRef: TProBaseWindowRef, private builder: AnimationBuilder, @Inject(DOCUMENT) private doc: any) {
+  constructor(
+    @Host() private dropdown: TProBaseDropDownDirective,
+    private el: ElementRef,
+    private render: Renderer2,
+    private windowRef: TProBaseWindowRef,
+    private builder: AnimationBuilder,
+    @Inject(DOCUMENT) private doc: any
+  ) {
     this.keydownEscapeEvent$ = fromEvent(this.doc.body, 'keydown').pipe(
       // chrome 为 Escape , ie 11为Esc
-      filter(event => (<KeyboardEvent>event).key === 'Escape' || (<KeyboardEvent>event).key === 'Esc')
+      filter((event) => (<KeyboardEvent>event).key === 'Escape' || (<KeyboardEvent>event).key === 'Esc')
     );
   }
 
@@ -48,7 +54,8 @@ export class TProBaseDropDownMenuDirective implements OnInit, OnDestroy {
           this.render.setStyle(this.el.nativeElement, 'display', 'block'); // 立马生效不等host binding绑定
           this.display = 'block';
         }
-        if (this.player) { // 此处保留一个防止点击过快
+        if (this.player) {
+          // 此处保留一个防止点击过快
           this.player.finish();
         }
         if (this.dropdown.showAnimation) {
@@ -116,21 +123,24 @@ export class TProBaseDropDownMenuDirective implements OnInit, OnDestroy {
   @HostListener('mouseleave', ['$event'])
   public mouseLeave(event: MouseEvent) {
     event.stopPropagation();
-    if ((this.dropdown.appendToBody && this.dropdown.trigger === 'hover')
-      || (this.dropdown.trigger === 'click' && this.dropdown.closeOnMouseLeaveMenu)) {
-      if (this.dropdown.toggleEl?.nativeElement.contains(event.relatedTarget)
-        || this.dropdown.dropdownChildren.some(children =>
-          children.menuEl !== this.el
-            && children.menuEl?.nativeElement.parentElement?.contains(event.relatedTarget))) {
+    if ((this.dropdown.appendToBody && this.dropdown.trigger === 'hover') || (this.dropdown.trigger === 'click' && this.dropdown.closeOnMouseLeaveMenu)) {
+      if (
+        this.dropdown.toggleEl?.nativeElement.contains(event.relatedTarget) ||
+        this.dropdown.dropdownChildren.some(
+          (children) => children.menuEl !== this.el && children.menuEl?.nativeElement.parentElement?.contains(event.relatedTarget)
+        )
+      ) {
         return;
       } else {
         if (this.dropdown.trigger === 'hover') {
           this.dropdown.simulateEventDispatch(event);
         } else {
           const relatedTarget = (event as any)['originEvent'] && (event as any)['originEvent'].relatedTarget;
-          if (relatedTarget && (this.dropdown.toggleEl?.nativeElement.contains(relatedTarget) ||
-            this.dropdown.dropdownChildren.some(children => children.menuEl?.nativeElement.contains(relatedTarget))
-          )) {
+          if (
+            relatedTarget &&
+            (this.dropdown.toggleEl?.nativeElement.contains(relatedTarget) ||
+              this.dropdown.dropdownChildren.some((children) => children.menuEl?.nativeElement.contains(relatedTarget)))
+          ) {
             return;
           }
           this.dropdown.isOpen = false;
@@ -142,19 +152,17 @@ export class TProBaseDropDownMenuDirective implements OnInit, OnDestroy {
 
   private fadeIn(direction: any): AnimationMetadata[] {
     switch (direction) {
-    case 'top':
-      return [
-        style({transform: 'scaleY(0.8) translateY(4px)', opacity: 0.8, transformOrigin: '0% 100%'}),
-        animate(`200ms ${AnimationCurves.EASE_IN}`,
-          style({transform: 'scaleY(0.9999) translateY(0)', opacity: 1, transformOrigin: '0% 100%'})),
-      ];
-    case 'bottom':
-    default:
-      return [
-        style({transform: 'scaleY(0.8)  translateY(-4px)', opacity: 0.8, transformOrigin: '0% 0%'}),
-        animate(`200ms ${AnimationCurves.EASE_OUT}`,
-          style({transform: 'scaleY(0.9999)  translateY(0)', opacity: 1, transformOrigin: '0% 0%'})),
-      ];
+      case 'top':
+        return [
+          style({ transform: 'scaleY(0.8) translateY(4px)', opacity: 0.8, transformOrigin: '0% 100%' }),
+          animate(`200ms ${AnimationCurves.EASE_IN}`, style({ transform: 'scaleY(0.9999) translateY(0)', opacity: 1, transformOrigin: '0% 100%' })),
+        ];
+      case 'bottom':
+      default:
+        return [
+          style({ transform: 'scaleY(0.8)  translateY(-4px)', opacity: 0.8, transformOrigin: '0% 0%' }),
+          animate(`200ms ${AnimationCurves.EASE_OUT}`, style({ transform: 'scaleY(0.9999)  translateY(0)', opacity: 1, transformOrigin: '0% 0%' })),
+        ];
     }
   }
 
@@ -164,19 +172,23 @@ export class TProBaseDropDownMenuDirective implements OnInit, OnDestroy {
 
   private fadeOut(direction: any): AnimationMetadata[] {
     switch (direction) {
-    case 'top':
-      return [
-        style({transform: 'scaleY(0.9999)  translateY(0)', opacity: 1, transformOrigin: '0% 100%'}),
-        animate(`${AnimationDuration.BASE} ${AnimationCurves.EASE_IN}`,
-          style({transform: 'scaleY(0.8)  translateY(4px)', opacity: 0.8, transformOrigin: '0% 100%'}))
-      ];
-    case 'bottom':
-    default:
-      return [
-        style({transform: 'scaleY(0.9999)  translateY(0)', opacity: 1, transformOrigin: '0% 0%'}),
-        animate(`${AnimationDuration.BASE} ${AnimationCurves.EASE_IN}`,
-          style({transform: 'scaleY(0.8)  translateY(-4px)', opacity: 0.8, transformOrigin: '0% 0%'}))
-      ];
+      case 'top':
+        return [
+          style({ transform: 'scaleY(0.9999)  translateY(0)', opacity: 1, transformOrigin: '0% 100%' }),
+          animate(
+            `${AnimationDuration.BASE} ${AnimationCurves.EASE_IN}`,
+            style({ transform: 'scaleY(0.8)  translateY(4px)', opacity: 0.8, transformOrigin: '0% 100%' })
+          ),
+        ];
+      case 'bottom':
+      default:
+        return [
+          style({ transform: 'scaleY(0.9999)  translateY(0)', opacity: 1, transformOrigin: '0% 0%' }),
+          animate(
+            `${AnimationDuration.BASE} ${AnimationCurves.EASE_IN}`,
+            style({ transform: 'scaleY(0.8)  translateY(-4px)', opacity: 0.8, transformOrigin: '0% 0%' })
+          ),
+        ];
     }
   }
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown-toggle.directive.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown-toggle.directive.ts
index 57877451..e7d8c4b9 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown-toggle.directive.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown-toggle.directive.ts
@@ -21,7 +21,7 @@ export class TProBaseDropDownToggleDirective implements OnInit, AfterViewInit {
   @Input() autoFocus = false;
   isMouseEvent = false;
 
-  constructor(@Host() private dropdown: TProBaseDropDownDirective, private el: ElementRef) { }
+  constructor(@Host() private dropdown: TProBaseDropDownDirective, private el: ElementRef) {}
 
   ngOnInit() {
     this.dropdown.dropDownToggle = this;
@@ -58,7 +58,9 @@ export class TProBaseDropDownToggleDirective implements OnInit, AfterViewInit {
   }
   @HostListener('keydown.enter', ['$event'])
   public toggle(event: any) {
-    if (this.disabled || this.dropdown.trigger === 'manually' || event.defaultPrevented) {return; }
+    if (this.disabled || this.dropdown.trigger === 'manually' || event.defaultPrevented) {
+      return;
+    }
     this.dropdown.toggle();
   }
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.component.scss
index 3c89a9ae..b70801b6 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.component.scss
@@ -1,5 +1,3 @@
-
-
 .cdk-overlay-container,
 .cdk-global-overlay-wrapper {
   pointer-events: none;
@@ -147,15 +145,15 @@
   outline: none;
 }
 
-.open>.t-pro-base-dropdown-menu {
+.open > .t-pro-base-dropdown-menu {
   display: block;
 }
 
-.t-pro-base-dropdown-menu>li {
+.t-pro-base-dropdown-menu > li {
   position: relative;
 }
 
-.t-pro-base-dropdown-menu>li>a {
+.t-pro-base-dropdown-menu > li > a {
   height: 36px;
   padding: 0 10px;
   cursor: pointer;
@@ -164,17 +162,17 @@
   text-decoration: none;
 }
 
-.t-pro-base-dropdown-menu li>input {
+.t-pro-base-dropdown-menu li > input {
   margin: 0 10px;
 }
 
-.t-pro-base-dropdown-menu>.disabled>a {
+.t-pro-base-dropdown-menu > .disabled > a {
   color: #adb0b8;
   cursor: not-allowed;
 }
 
-.t-pro-base-dropdown-menu>.disabled>a:hover,
-.t-pro-base-dropdown-menu>.disabled>a:focus {
+.t-pro-base-dropdown-menu > .disabled > a:hover,
+.t-pro-base-dropdown-menu > .disabled > a:focus {
   cursor: not-allowed;
 }
 
@@ -198,7 +196,7 @@
   color: var(--ti-base-color-brand-7);
 }
 
-.cdk-overlay-pane>div>.t-pro-base-dropdown-menu {
+.cdk-overlay-pane > div > .t-pro-base-dropdown-menu {
   position: relative;
   top: 0; // initial; ie11不认识initial
   left: 0; //initial;
@@ -206,7 +204,6 @@
 }
 
 .t-pro-base-dropdown span {
-
   &.icon-chevron-down,
   &.icon-select-arrow {
     display: inline-block;
@@ -215,7 +212,6 @@
 }
 
 .t-pro-base-dropdown-animation span {
-
   &.icon-chevron-down,
   &.icon-select-arrow {
     transition: transform 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
@@ -223,7 +219,6 @@
 }
 
 .t-pro-base-dropdown.open span {
-
   &.icon-chevron-down,
   &.icon-select-arrow {
     transform: rotate(180deg);
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.component.ts
index 42fe7fb5..75062f8a 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.component.ts
@@ -1,6 +1,4 @@
-import {
-  CdkConnectedOverlay, CdkOverlayOrigin, ConnectedOverlayPositionChange, ConnectedPosition, VerticalConnectionPos
-} from '@angular/cdk/overlay';
+import { CdkConnectedOverlay, CdkOverlayOrigin, ConnectedOverlayPositionChange, ConnectedPosition, VerticalConnectionPos } from '@angular/cdk/overlay';
 import { Component, ElementRef, Host, Input, OnChanges, OnInit, SimpleChanges, ViewChild, ViewEncapsulation } from '@angular/core';
 import { AppendToBodyDirection, AppendToBodyDirectionsConfig } from '../../utils/cdk-overlay-config.type';
 import { fadeInOut } from '../../utils/animations/fade-in-out';
@@ -11,23 +9,22 @@ import { TProBaseDropDownDirective } from './dropdown.directive';
   selector: '[tProBaseDropDown][appendToBody]',
   template: `
     <ng-content></ng-content>
-    <ng-template cdk-connected-overlay
+    <ng-template
+      cdk-connected-overlay
       [cdkConnectedOverlayOrigin]="origin || dropDown.cdkConnectedOverlayOrigin"
       [cdkConnectedOverlayOpen]="dropDown.isOpen"
       [cdkConnectedOverlayPositions]="positions"
-      (backdropClick)="dropDown.isOpen=false"
-      (positionChange)="onPositionChange($event)">
-      <div [@fadeInOut]="dropDown.startAnimation ? menuPosition : 'void'" #dropDownWrapper
-        [@.disabled]="!dropDown.showAnimation">
+      (backdropClick)="dropDown.isOpen = false"
+      (positionChange)="onPositionChange($event)"
+    >
+      <div [@fadeInOut]="dropDown.startAnimation ? menuPosition : 'void'" #dropDownWrapper [@.disabled]="!dropDown.showAnimation">
         <ng-content select="[tProBaseDropDownMenu]"></ng-content>
       </div>
     </ng-template>
   `,
   styleUrls: ['dropdown.component.scss'],
   encapsulation: ViewEncapsulation.None,
-  animations: [
-    fadeInOut
-  ],
+  animations: [fadeInOut],
   preserveWhitespaces: false,
 })
 export class TProBaseDropDownAppendToBodyComponent implements OnInit, OnChanges {
@@ -37,9 +34,7 @@ export class TProBaseDropDownAppendToBodyComponent implements OnInit, OnChanges
   @ViewChild('dropDownWrapper') dropDownWrapper: ElementRef;
   @ViewChild(CdkConnectedOverlay, { static: true }) overlay: CdkConnectedOverlay;
   @Input() alignOrigin: ElementRef<any>;
-  @Input() appendToBodyDirections: Array<AppendToBodyDirection | ConnectedPosition> = [
-    'rightDown', 'leftDown', 'rightUp', 'leftUp'
-  ];
+  @Input() appendToBodyDirections: Array<AppendToBodyDirection | ConnectedPosition> = ['rightDown', 'leftDown', 'rightUp', 'leftUp'];
   constructor(@Host() public dropDown: TProBaseDropDownDirective) {
     this.dropDown.appendToBody = true;
   }
@@ -65,13 +60,15 @@ export class TProBaseDropDownAppendToBodyComponent implements OnInit, OnChanges
   }
   setPositions() {
     if (this.appendToBodyDirections && this.appendToBodyDirections.length > 0) {
-      this.positions = this.appendToBodyDirections.map(position => {
-        if (typeof position === 'string') {
-          return AppendToBodyDirectionsConfig[position];
-        } else {
-          return position;
-        }
-      }).filter(position => position !== undefined);
+      this.positions = this.appendToBodyDirections
+        .map((position) => {
+          if (typeof position === 'string') {
+            return AppendToBodyDirectionsConfig[position];
+          } else {
+            return position;
+          }
+        })
+        .filter((position) => position !== undefined);
     } else {
       this.positions = undefined;
     }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.directive.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.directive.ts
index dd494ac1..58565173 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.directive.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.directive.ts
@@ -1,9 +1,22 @@
 import { CdkOverlayOrigin } from '@angular/cdk/overlay';
 import { DOCUMENT } from '@angular/common';
 import {
-  AfterContentInit, ChangeDetectorRef, ContentChildren, Directive, ElementRef, EventEmitter, HostBinding, Inject, Input,
-  OnChanges, OnDestroy, Optional, Output, QueryList, SimpleChanges,
-  SkipSelf
+  AfterContentInit,
+  ChangeDetectorRef,
+  ContentChildren,
+  Directive,
+  ElementRef,
+  EventEmitter,
+  HostBinding,
+  Inject,
+  Input,
+  OnChanges,
+  OnDestroy,
+  Optional,
+  Output,
+  QueryList,
+  SimpleChanges,
+  SkipSelf,
 } from '@angular/core';
 import { addClassToOrigin, formWithDropDown, removeClassFromOrigin } from '../../utils/cdk-origin-handler';
 import { DevConfigService, WithConfig } from '../../utils/globalConfig';
@@ -14,16 +27,17 @@ import { TProBaseDropDownService } from './dropdown.service';
 @Directive({
   selector: '[tProBaseDropDown]',
   exportAs: 't-pro-base-dropdown',
-  providers: [TProBaseDropDownService]
+  providers: [TProBaseDropDownService],
 })
 export class TProBaseDropDownDirective implements OnDestroy, OnChanges, AfterContentInit {
-  @ContentChildren(TProBaseDropDownDirective, {descendants: true}) dropdownChildren: QueryList<TProBaseDropDownDirective>;
+  @ContentChildren(TProBaseDropDownDirective, { descendants: true }) dropdownChildren: QueryList<TProBaseDropDownDirective>;
   private hoverSubscription: Subscription | null;
   /**
    * 控制是否打开dropdown，绑定一个t-pro-base-dropdown-open class
    */
   @HostBinding('class.t-pro-base-dropdown-open')
-  @Input() set isOpen(value) {
+  @Input()
+  set isOpen(value) {
     this._isOpen = !!value;
     if (this.disabled) {
       return;
@@ -54,7 +68,9 @@ export class TProBaseDropDownDirective implements OnDestroy, OnChanges, AfterCon
   @HostBinding('class.t-pro-base-dropdown') addClass = true;
   @Input() disabled = false;
   @HostBinding('class.t-pro-base-dropdown-animation')
-  @Input() @WithConfig() showAnimation = true;
+  @Input()
+  @WithConfig()
+  showAnimation = true;
   /**
    * dropdown触发方式
    */
@@ -82,7 +98,7 @@ export class TProBaseDropDownDirective implements OnDestroy, OnChanges, AfterCon
   document: Document;
 
   public set appendToBody(bool: boolean) {
-    this._appendToBody = (bool === true);
+    this._appendToBody = bool === true;
     this.updateCdkConnectedOverlayOrigin();
   }
   public get appendToBody() {
@@ -112,7 +128,7 @@ export class TProBaseDropDownDirective implements OnDestroy, OnChanges, AfterCon
   }
 
   ngOnChanges(changes: SimpleChanges) {
-    if (Object.prototype.hasOwnProperty.call(changes,'trigger')) {
+    if (Object.prototype.hasOwnProperty.call(changes, 'trigger')) {
       this.handleHoverSubscriptionIfTriggerIsHover();
     }
   }
@@ -128,7 +144,7 @@ export class TProBaseDropDownDirective implements OnDestroy, OnChanges, AfterCon
 
   public toggle(): boolean {
     // eslint-disable-next-line no-return-assign
-    return this.isOpen = !this.isOpen;
+    return (this.isOpen = !this.isOpen);
   }
 
   public focusToggleElement() {
@@ -139,9 +155,7 @@ export class TProBaseDropDownDirective implements OnDestroy, OnChanges, AfterCon
 
   updateCdkConnectedOverlayOrigin() {
     if (this.toggleEl && this.appendToBody === true) {
-      this.cdkConnectedOverlayOrigin = new CdkOverlayOrigin(
-        formWithDropDown(this.toggleEl) || this.toggleEl.nativeElement
-      );
+      this.cdkConnectedOverlayOrigin = new CdkOverlayOrigin(formWithDropDown(this.toggleEl) || this.toggleEl.nativeElement);
     } else {
       this.cdkConnectedOverlayOrigin = undefined;
     }
@@ -149,9 +163,7 @@ export class TProBaseDropDownDirective implements OnDestroy, OnChanges, AfterCon
 
   subscribeHoverAction(observable: Observable<boolean>): void {
     if (!this.hoverSubscription) {
-      this.hoverSubscription = observable.pipe(
-        debounceTime(50),
-      ).subscribe(isOpen => {
+      this.hoverSubscription = observable.pipe(debounceTime(50)).subscribe((isOpen) => {
         if (!this.disabled && this.isOpen !== isOpen) {
           this.isOpen = isOpen;
         }
@@ -166,7 +178,7 @@ export class TProBaseDropDownDirective implements OnDestroy, OnChanges, AfterCon
     }
   }
 
-  handleHoverSubscriptionIfTriggerIsHover () {
+  handleHoverSubscriptionIfTriggerIsHover() {
     if (this.trigger === 'hover') {
       const states: Observable<boolean> = merge(
         fromEvent(this.el.nativeElement, 'mouseenter').pipe(mapTo(true)),
@@ -177,28 +189,30 @@ export class TProBaseDropDownDirective implements OnDestroy, OnChanges, AfterCon
               // menu（子） -> toggle（父） 冒泡模拟的用于离开菜单的时候判断不判断overlay的div层，即只判断menuEl.nativeElement
               // toggle（父） -> menu（子） 离开元素本身的需要判断是否落入了overlay的div层，即只判断menuEl.nativeElement.parentElement
               const relatedTarget = event.relatedTarget || ((event as any)['originEvent'] && (event as any)['originEvent'].relatedTarget);
-              return  !(this.menuEl?.nativeElement && relatedTarget &&
-                  (this.menuEl?.nativeElement.parentElement?.contains(event.relatedTarget)
-                  || this.menuEl?.nativeElement.parentElement?.parentElement?.contains(event.relatedTarget) // 套了两层div增加判断
-                  || this.menuEl?.nativeElement.contains(relatedTarget)
-                  || this.dropdownChildren.some(
-                    children =>
-                      children !== this
+              return !(
+                this.menuEl?.nativeElement &&
+                relatedTarget &&
+                (this.menuEl?.nativeElement.parentElement?.contains(event.relatedTarget) ||
+                  this.menuEl?.nativeElement.parentElement?.parentElement?.contains(event.relatedTarget) || // 套了两层div增加判断
+                  this.menuEl?.nativeElement.contains(relatedTarget) ||
+                  this.dropdownChildren.some(
+                    (children) =>
+                      children !== this &&
                       // appendToBody的时候可能会没有实例化不在document上需要做判断有没有parentElement
-                      && (children.menuEl?.nativeElement.parentElement?.contains(event.relatedTarget)
-                      || children.menuEl?.nativeElement.contains(relatedTarget))
+                      (children.menuEl?.nativeElement.parentElement?.contains(event.relatedTarget) || children.menuEl?.nativeElement.contains(relatedTarget))
                   ))
               );
             } else {
               return true;
             }
           }),
-          tap(event => {
+          tap((event) => {
             if (this.parentDropdown) {
               this.simulateEventDispatch(event, this.parentDropdown.el.nativeElement);
             }
           }),
-          mapTo(false))
+          mapTo(false)
+        )
       );
       this.subscribeHoverAction(states);
     } else {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.moudule.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.moudule.ts
index f9155de1..a71e6253 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.moudule.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.moudule.ts
@@ -7,23 +7,8 @@ import { TProBaseDropDownAppendToBodyComponent } from './dropdown.component';
 import { TProBaseDropDownDirective } from './dropdown.directive';
 
 @NgModule({
-  imports: [
-    CommonModule,
-    OverlayModule,
-  ],
-  exports: [
-    TProBaseDropDownDirective,
-    TProBaseDropDownMenuDirective,
-    TProBaseDropDownToggleDirective,
-    TProBaseDropDownAppendToBodyComponent
-  ],
-  declarations: [
-    TProBaseDropDownDirective,
-    TProBaseDropDownMenuDirective,
-    TProBaseDropDownToggleDirective,
-    TProBaseDropDownAppendToBodyComponent
-  ],
-
+  imports: [CommonModule, OverlayModule],
+  exports: [TProBaseDropDownDirective, TProBaseDropDownMenuDirective, TProBaseDropDownToggleDirective, TProBaseDropDownAppendToBodyComponent],
+  declarations: [TProBaseDropDownDirective, TProBaseDropDownMenuDirective, TProBaseDropDownToggleDirective, TProBaseDropDownAppendToBodyComponent],
 })
-export class TProBaseDropDownModule {
-}
+export class TProBaseDropDownModule {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.service.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.service.ts
index 67e81aa8..1b9dfc77 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.service.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/dropdown/dropdown.service.ts
@@ -36,12 +36,14 @@ export class TProBaseDropDownService {
       return;
     }
     const menuEl = this.openScope.menuEl?.nativeElement;
-    if (event && this.openScope.menuEl &&
-      ((/input|textarea/i.test((<any>event.target).tagName) && menuEl.contains(event.target))
-        || this.openScope.closeScope === 'none'
-        || (menuEl.contains(event.target) && this.openScope.closeScope === 'blank')
-        || (this.openScope.dropdownChildren.some(children => children.toggleEl.nativeElement.contains(event.target)))
-      )) {
+    if (
+      event &&
+      this.openScope.menuEl &&
+      ((/input|textarea/i.test((<any>event.target).tagName) && menuEl.contains(event.target)) ||
+        this.openScope.closeScope === 'none' ||
+        (menuEl.contains(event.target) && this.openScope.closeScope === 'blank') ||
+        this.openScope.dropdownChildren.some((children) => children.toggleEl.nativeElement.contains(event.target)))
+    ) {
       return;
     }
     this.openScope.isOpen = false;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/col.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/col.component.ts
index 7ad3d7cc..eef9e4f6 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/col.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/col.component.ts
@@ -5,14 +5,14 @@ import { TProBaseResponseParameter } from './layout.types';
 @Component({
   selector: 't-pro-base-col',
   changeDetection: ChangeDetectionStrategy.OnPush,
-  template: `
-    <ng-content></ng-content>
-  `,
-  styles: [`
-    :host.t-pro-base-col {
-      padding: 0;
-    }
-  `]
+  template: ` <ng-content></ng-content> `,
+  styles: [
+    `
+      :host.t-pro-base-col {
+        padding: 0;
+      }
+    `,
+  ],
 })
 export class TProBaseColComponent implements OnInit, OnChanges {
   @HostBinding('class.t-pro-base-col') tProBaseCol = true;
@@ -20,10 +20,7 @@ export class TProBaseColComponent implements OnInit, OnChanges {
   @Input() tProBaseSpan: TProBaseResponseParameter<number | 'auto'> = 'auto';
   @Input() tProBaseOffset: TProBaseResponseParameter<number>;
 
-  constructor(
-    private elementRef: ElementRef,
-    private renderer: Renderer2,
-  ) { }
+  constructor(private elementRef: ElementRef, private renderer: Renderer2) {}
 
   ngOnInit(): void {
     updateClassList(this, this.elementRef, this.renderer);
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/layout-utils.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/layout-utils.ts
index 9c3f7998..911c0b85 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/layout-utils.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/layout-utils.ts
@@ -4,7 +4,7 @@ import { TProBaseBreakpoint, TProBaseBreakpoints, TProBaseResponseParameter } fr
 function isResponseValue(value: TProBaseResponseParameter<any>) {
   let flag = false;
   if (typeof value === 'object') {
-    TProBaseBreakpoints.forEach(point => {
+    TProBaseBreakpoints.forEach((point) => {
       if (value[point]) {
         flag = true;
       }
@@ -16,7 +16,7 @@ function isResponseValue(value: TProBaseResponseParameter<any>) {
 function runResponse(value: TProBaseResponseParameter<any>, func: (point: TProBaseBreakpoint, value: any) => void) {
   if (value || value === 0) {
     if (isResponseValue(value)) {
-      TProBaseBreakpoints.forEach(point => {
+      TProBaseBreakpoints.forEach((point) => {
         if (value[point] || value[point] === 0) {
           func(point, value[point]);
         }
@@ -64,14 +64,14 @@ function pointAndValueMapToClassName(paramName: string, classList: Array<string>
 
 export function updateClassList(context: any, elementRef: ElementRef, renderer: Renderer2) {
   /**
-    * [tProBaseCols]作用在t-pro-base-row
-    * [tProBaseSpan]、[tProBaseOffset]作用在t-pro-base-col
-    * [tProBaseAlign]、[tProBaseJustify]、[tProBaseAlignSelf]、[tProBaseOrder]作用在[tProBaseFlex]
+   * [tProBaseCols]作用在t-pro-base-row
+   * [tProBaseSpan]、[tProBaseOffset]作用在t-pro-base-col
+   * [tProBaseAlign]、[tProBaseJustify]、[tProBaseAlignSelf]、[tProBaseOrder]作用在[tProBaseFlex]
    */
   const classParamsName = ['tProBaseCols', 'tProBaseSpan', 'tProBaseOffset', 'tProBaseAlign', 'tProBaseJustify', 'tProBaseAlignSelf', 'tProBaseOrder'];
 
   const tempClassList: Array<string> = [];
-  classParamsName.forEach(paramName => {
+  classParamsName.forEach((paramName) => {
     if (context[paramName] || context[paramName] === 0) {
       runResponse(context[paramName], pointAndValueMapToClassName.bind(context, paramName, tempClassList));
     }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/layout.types.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/layout.types.ts
index 8698db25..7388b9c3 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/layout.types.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/layout.types.ts
@@ -15,14 +15,16 @@ export const TProBaseBreakpointsMap = {
   xl: 1920,
 };
 
-export type TProBaseResponseParameter<T> = T | {
-  ss?: T;
-  ms?: T;
-  mm?: T;
-  ml?: T;
-  xs?: T;
-  sm?: T;
-  md?: T;
-  lg?: T;
-  xl?: T;
-};
+export type TProBaseResponseParameter<T> =
+  | T
+  | {
+      ss?: T;
+      ms?: T;
+      mm?: T;
+      ml?: T;
+      xs?: T;
+      sm?: T;
+      md?: T;
+      lg?: T;
+      xl?: T;
+    };
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/row.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/row.component.ts
index f2265d8f..7a711d66 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/row.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/row.component.ts
@@ -1,29 +1,20 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  ElementRef,
-  HostBinding,
-  Input,
-  OnChanges,
-  OnInit,
-  Renderer2
-} from '@angular/core';
+import { ChangeDetectionStrategy, Component, ElementRef, HostBinding, Input, OnChanges, OnInit, Renderer2 } from '@angular/core';
 import { updateClassList } from './layout-utils';
 import { TProBaseResponseParameter } from './layout.types';
 
 @Component({
   selector: 't-pro-base-row',
   changeDetection: ChangeDetectionStrategy.OnPush,
-  template: `
-    <ng-content></ng-content>
-  `,
-  styles: [`
-    :host.t-pro-base-row {
-      margin: 0;
-      padding: 0;
-    }
-  `],
-  preserveWhitespaces: false
+  template: ` <ng-content></ng-content> `,
+  styles: [
+    `
+      :host.t-pro-base-row {
+        margin: 0;
+        padding: 0;
+      }
+    `,
+  ],
+  preserveWhitespaces: false,
 })
 export class TProBaseRowComponent implements OnInit, OnChanges {
   @HostBinding('class.row') row = true;
@@ -32,10 +23,7 @@ export class TProBaseRowComponent implements OnInit, OnChanges {
 
   @Input() tProBaseCols: TProBaseResponseParameter<number>; // number只能是[0 - 12]
 
-  constructor(
-    private elementRef: ElementRef,
-    private renderer: Renderer2,
-  ) { }
+  constructor(private elementRef: ElementRef, private renderer: Renderer2) {}
 
   ngOnInit(): void {
     updateClassList(this, this.elementRef, this.renderer);
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/style/config.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/style/config.scss
index 8293cd01..a035b155 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/style/config.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/grid/style/config.scss
@@ -12,7 +12,7 @@ $grid-breakpoints: (
   sm: 1440px,
   md: 1600px,
   lg: 1760px,
-  xl: 1920px
+  xl: 1920px,
 );
 
 @include _assert-ascending($grid-breakpoints, '$grid-breakpoints');
@@ -30,7 +30,7 @@ $container-max-widths: (
   sm: 1400px,
   md: 1560px,
   lg: 1760px,
-  xl: 1880px
+  xl: 1880px,
 );
 
 @include _assert-ascending($container-max-widths, '$container-max-widths');
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/aside.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/aside.component.ts
index 8f2be403..aa2da546 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/aside.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/aside.component.ts
@@ -6,10 +6,9 @@ import { Component, HostBinding } from '@angular/core';
   template: '<ng-content></ng-content>',
   styles: [
     `
-    :host.t-pro-basic-aside {
-
-    }
-    `
+      :host.t-pro-basic-aside {
+      }
+    `,
   ],
 })
 export class AsideComponent {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/content.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/content.component.ts
index 9ad654b4..874dc61b 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/content.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/content.component.ts
@@ -6,12 +6,12 @@ import { Component, HostBinding } from '@angular/core';
   template: '<ng-content></ng-content>',
   styles: [
     `
-    :host.t-pro-basic-content {
-      flex: auto;
-      min-height: 0;
-    }
-    `
-  ]
+      :host.t-pro-basic-content {
+        flex: auto;
+        min-height: 0;
+      }
+    `,
+  ],
 })
 export class ContentComponent {
   @HostBinding('class.t-pro-basic-content') default = true;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/footer.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/footer.component.ts
index c917191e..ab45fcc8 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/footer.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/footer.component.ts
@@ -6,12 +6,12 @@ import { Component, HostBinding } from '@angular/core';
   template: '<ng-content></ng-content>',
   styles: [
     `
-    :host.t-pro-basic-footer {
-      text-align: center;
-      line-height: 1.5;
-    }
-    `
-  ]
+      :host.t-pro-basic-footer {
+        text-align: center;
+        line-height: 1.5;
+      }
+    `,
+  ],
 })
 export class FooterBasicComponent {
   @HostBinding('class.t-pro-basic-footer') default = true;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/header.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/header.component.ts
index 62985916..3af45a72 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/header.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/elements/header.component.ts
@@ -6,10 +6,10 @@ import { Component, HostBinding } from '@angular/core';
   template: '<ng-content></ng-content>',
   styles: [
     `
-    :host.t-pro-basic-header {
-      flex: 0 0 auto;
-    }
-    `
+      :host.t-pro-basic-header {
+        flex: 0 0 auto;
+      }
+    `,
   ],
 })
 export class HeaderBasicComponent {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/layout.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/layout.component.ts
index aa2cfacf..51dcf45f 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/layout.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/layout.component.ts
@@ -6,16 +6,16 @@ import { AsideComponent } from './elements/aside.component';
   template: '<ng-content></ng-content>',
   styles: [
     `
-    :host.t-pro-basic-layout {
-      display: flex;
-      flex: auto;
-      flex-direction: column;
+      :host.t-pro-basic-layout {
+        display: flex;
+        flex: auto;
+        flex-direction: column;
 
-      &-aside {
-        flex-direction: row;
+        &-aside {
+          flex-direction: row;
+        }
       }
-    }
-    `
+    `,
   ],
 })
 export class LayoutComponent {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/layout.module.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/layout.module.ts
index dc792f84..d7323464 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/layout.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/layout/layout.module.ts
@@ -7,20 +7,8 @@ import { FooterBasicComponent } from './elements/footer.component';
 import { HeaderBasicComponent } from './elements/header.component';
 
 @NgModule({
-  declarations: [
-    LayoutComponent,
-    AsideComponent,
-    ContentComponent,
-    FooterBasicComponent,
-    HeaderBasicComponent,
-  ],
+  declarations: [LayoutComponent, AsideComponent, ContentComponent, FooterBasicComponent, HeaderBasicComponent],
   imports: [CommonModule],
-  exports: [
-    LayoutComponent,
-    AsideComponent,
-    ContentComponent,
-    FooterBasicComponent,
-    HeaderBasicComponent,
-  ],
+  exports: [LayoutComponent, AsideComponent, ContentComponent, FooterBasicComponent, HeaderBasicComponent],
 })
 export class TProBaseLayoutModule {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.component.scss
index 2c7cb704..5734828b 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.component.scss
@@ -1,4 +1,4 @@
-@import "~@opentiny/ng/themes/theme-default.css";
+@import '~@opentiny/ng/themes/theme-default.css';
 
 :host {
   display: block;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.component.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.component.ts
index b7360e3d..731b5368 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.component.ts
@@ -1,12 +1,4 @@
-import {
-  Component,
-  ContentChild,
-  Input,
-  OnChanges,
-  OnInit,
-  SimpleChanges,
-  TemplateRef
-} from '@angular/core';
+import { Component, ContentChild, Input, OnChanges, OnInit, SimpleChanges, TemplateRef } from '@angular/core';
 
 @Component({
   selector: 't-pro-base-progress',
@@ -14,7 +6,7 @@ import {
   styleUrls: ['./progress.component.scss'],
   preserveWhitespaces: false,
 })
-export class TProBaseProgressComponent implements OnInit , OnChanges {
+export class TProBaseProgressComponent implements OnInit, OnChanges {
   @Input() percentage = 0;
   @Input() percentageText: string;
   @Input() strokeColor: string;
@@ -26,9 +18,7 @@ export class TProBaseProgressComponent implements OnInit , OnChanges {
   strokePath: { [key: string]: string };
   pathString: string;
 
-  constructor() {
-
-  }
+  constructor() {}
 
   ngOnInit(): void {
     if (this.type === 'circle') {
@@ -59,13 +49,13 @@ export class TProBaseProgressComponent implements OnInit , OnChanges {
     this.trailPath = {
       strokeDasharray: `${len}px ${len}px`,
       strokeDashoffset: `0`,
-      transition: 'stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s'
+      transition: 'stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s',
     };
     this.strokePath = {
       stroke: this.strokeColor || (null as any),
-      strokeDasharray: `${(this.percentage / 100) * len }px ${len}px`,
+      strokeDasharray: `${(this.percentage / 100) * len}px ${len}px`,
       strokeDashoffset: `0`,
-      transition: 'stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s'
+      transition: 'stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s',
     };
   }
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.module.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.module.ts
index 149ddd88..5b7642a0 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/progress/progress.module.ts
@@ -9,5 +9,4 @@ import { TProBaseProgressComponent } from './progress.component';
   declarations: [TProBaseProgressComponent],
   providers: [],
 })
-export class TProBaseProgressModule {
-}
+export class TProBaseProgressModule {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/tags/tag.component.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/tags/tag.component.scss
index aa36698a..e736f147 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/tags/tag.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/tags/tag.component.scss
@@ -1,4 +1,4 @@
-@import "~@opentiny/ng/themes/theme-default.css";
+@import '~@opentiny/ng/themes/theme-default.css';
 
 :host {
   display: inline-block;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/tags/tags.module.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/tags/tags.module.ts
index f4b486d0..4d040224 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/tags/tags.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/tags/tags.module.ts
@@ -4,17 +4,8 @@ import { FormsModule } from '@angular/forms';
 import { TProBaseTagComponent } from './tag.component';
 import { TProBaseTagsComponent } from './tags.component';
 @NgModule({
-  imports: [
-    CommonModule,
-    FormsModule
-  ],
-  exports: [
-    TProBaseTagsComponent,
-    TProBaseTagComponent
-  ],
-  declarations: [
-    TProBaseTagsComponent,
-    TProBaseTagComponent
-  ]
+  imports: [CommonModule, FormsModule],
+  exports: [TProBaseTagsComponent, TProBaseTagComponent],
+  declarations: [TProBaseTagsComponent, TProBaseTagComponent],
 })
-export class TProBaseTagsModule { }
+export class TProBaseTagsModule {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/document-ref.service.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/document-ref.service.ts
index f3477de7..cfec8e56 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/document-ref.service.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/document-ref.service.ts
@@ -3,9 +3,7 @@ import { Inject, Injectable } from '@angular/core';
 
 @Injectable()
 export class TProBaseDocumentRef {
-
-  constructor(@Inject(DOCUMENT) private doc: any) {
-  }
+  constructor(@Inject(DOCUMENT) private doc: any) {}
 
   get document(): any {
     return this.doc;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/window-ref.module.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/window-ref.module.ts
index 8dbf441a..1a8c9dc1 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/window-ref.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/window-ref.module.ts
@@ -3,10 +3,6 @@ import { TProBaseDocumentRef } from './document-ref.service';
 import { TProBaseWindowRef } from './window-ref.service';
 
 @NgModule({
-  providers: [
-    TProBaseWindowRef,
-    TProBaseDocumentRef,
-  ],
+  providers: [TProBaseWindowRef, TProBaseDocumentRef],
 })
-export class TProBaseWindowRefModule {
-}
+export class TProBaseWindowRefModule {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/window-ref.service.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/window-ref.service.ts
index bbee49f3..bed640ab 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/window-ref.service.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/modules/window-ref/window-ref.service.ts
@@ -3,9 +3,7 @@ import { TProBaseDocumentRef } from './document-ref.service';
 
 @Injectable()
 export class TProBaseWindowRef {
-
-  constructor(private documentRef: TProBaseDocumentRef) {
-  }
+  constructor(private documentRef: TProBaseDocumentRef) {}
 
   get window(): Window | null {
     return this.document.defaultView;
@@ -38,5 +36,4 @@ export class TProBaseWindowRef {
   getBoundingClientRect(elementRef: ElementRef) {
     return elementRef.nativeElement && elementRef.nativeElement.getBoundingClientRect();
   }
-
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/shared.module.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/shared.module.ts
index 7325b8fe..3b002c53 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/shared.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/shared.module.ts
@@ -51,7 +51,7 @@ import {
   TiTreeselectModule,
   TiUploadModule,
   TiValidationModule,
-  TiHalfmodalModule
+  TiHalfmodalModule,
 } from '@opentiny/ng';
 
 import {
@@ -63,7 +63,7 @@ import {
   TProBaseBadgeModule,
   TProBaseProgressModule,
   TProBaseDropDownModule,
-  TProBaseWindowRefModule
+  TProBaseWindowRefModule,
 } from './modules';
 import {
   PersonalizeConfigComponent,
@@ -81,7 +81,7 @@ import {
   SideMenuComponent,
   RegisterComponent,
   HeaderNoticeComponent,
-  HelpTipComponent
+  HelpTipComponent,
 } from './components';
 
 import { TProTranslatePipe } from './locale/t-pro-translate.pipe';
@@ -102,7 +102,7 @@ const COMPONENTS = [
   RegisterComponent,
   SideMenuComponent,
   SideSettingsComponent,
-  HelpTipComponent
+  HelpTipComponent,
 ];
 
 // 引入Tiny3相关module
@@ -153,7 +153,7 @@ const TINY_MODULES = [
   TiIntroServiceModule,
   TiLoadingModule,
   TiIconModule,
-  TiHalfmodalModule
+  TiHalfmodalModule,
 ];
 
 const PIPES = [TProTranslatePipe];
@@ -176,7 +176,7 @@ const PIPES = [TProTranslatePipe];
     TProBaseLayoutModule,
     TProBaseGridModule,
     TProBaseTagsModule,
-    ...TINY_MODULES
+    ...TINY_MODULES,
   ],
   exports: [
     CommonModule,
@@ -197,15 +197,15 @@ const PIPES = [TProTranslatePipe];
     TProBaseTagsModule,
     ...TINY_MODULES,
     ...COMPONENTS,
-    ...PIPES
+    ...PIPES,
   ],
-  providers: [...PIPES]
+  providers: [...PIPES],
 })
 export class SharedModule {
   static forRoot(): ModuleWithProviders<SharedModule> {
     return {
       ngModule: SharedModule,
-      providers: []
+      providers: [],
     };
   }
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/styles/common.scss b/packages/toolkits/pro/template/tinyng/src/app/@shared/styles/common.scss
index a9d5d48b..f14392f9 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/styles/common.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/styles/common.scss
@@ -26,7 +26,7 @@
 
 @mixin t-pro-product-card {
   padding: 20px 20px;
-  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, .05); 
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
   border-radius: 8px;
   background: var(--ti-common-color-bg-white-normal);
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/animations/animationParameters.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/animations/animationParameters.ts
index c1380a58..f03a1b95 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/animations/animationParameters.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/animations/animationParameters.ts
@@ -1,4 +1,3 @@
-
 export class AnimationDuration {
   static SLOW = '0.3s';
   static BASE = '0.2s';
@@ -11,8 +10,8 @@ export class AnimationCurves {
   static EASE_IN_OUT = 'cubic-bezier(0.5, 0.05, 0.5, 0.95)';
   static LINEAR = 'cubic-bezier(0, 0, 1, 1)';
   /**
-     * @deprecated 'EASE_IN_SMOOTH' does not match the actual bezier curve,replaced with 'EASE_IN_OUT_SMOOTH'
-     */
+   * @deprecated 'EASE_IN_SMOOTH' does not match the actual bezier curve,replaced with 'EASE_IN_OUT_SMOOTH'
+   */
   static EASE_IN_SMOOTH = 'cubic-bezier(0.645, 0.045, 0.355, 1)';
   static EASE_IN_OUT_SMOOTH = 'cubic-bezier(0.645, 0.045, 0.355, 1)';
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/animations/fade-in-out.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/animations/fade-in-out.ts
index f4a47f68..23ee6549 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/animations/fade-in-out.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/animations/fade-in-out.ts
@@ -8,18 +8,15 @@ export const fadeInOut: AnimationTriggerMetadata = trigger('fadeInOut', [
   state('void', style({ transform: 'scaleY(0) translateY(-4px)', opacity: 0, transformOrigin: '0 0%', display: 'block' })),
   state('bottom', style({ transform: 'scaleY(0.9999) translateY(0)', opacity: 1, transformOrigin: '0 0%', display: 'block' })),
   state('top', style({ transform: 'scaleY(0.9999) translateY(0)', opacity: 1, transformOrigin: '0 100%', display: 'block' })),
-  transition('void => bottom', [
-    style({ opacity: 0.8, transform: 'scaleY(0.8) translateY(-4px)' }),
-    animate(`${duration} ${easeOut}`)
-  ]),
+  transition('void => bottom', [style({ opacity: 0.8, transform: 'scaleY(0.8) translateY(-4px)' }), animate(`${duration} ${easeOut}`)]),
   transition('bottom => void', [
-    animate(`${duration} ${easeIn}`,
-      style({ transform: 'scaleY(0.8) translateY(-4px)', opacity: 0, transformOrigin: '0 0%', display: 'none' })),
+    animate(`${duration} ${easeIn}`, style({ transform: 'scaleY(0.8) translateY(-4px)', opacity: 0, transformOrigin: '0 0%', display: 'none' })),
   ]),
   transition('void => top', [
     style({ transform: 'scaleY(0.8) translateY(4px)', opacity: 0.8, transformOrigin: '0 100%', display: 'block' }),
-    animate(`${duration} ${easeOut}`)]),
+    animate(`${duration} ${easeOut}`),
+  ]),
   transition('top => void', [
-    animate(`${duration} ${easeIn}`,
-      style({ transform: 'scaleY(0.8) translateY(4px)', opacity: 0, transformOrigin: '0 100%', display: 'none' }))
-  ])]);
+    animate(`${duration} ${easeIn}`, style({ transform: 'scaleY(0.8) translateY(4px)', opacity: 0, transformOrigin: '0 100%', display: 'none' })),
+  ]),
+]);
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/base-utils.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/base-utils.ts
index 5b51d032..9a6d79bc 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/base-utils.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/base-utils.ts
@@ -1,12 +1,7 @@
-import { CommonError} from '@shared/tiny-pro';
+import { CommonError } from '@shared/tiny-pro';
 
 export function isCommonError(error: unknown): error is CommonError {
-  return (
-    typeof error === 'object' &&
-    error !== null &&
-    'message' in error &&
-    typeof (error as Record<string, unknown>).message === 'string'
-  );
+  return typeof error === 'object' && error !== null && 'message' in error && typeof (error as Record<string, unknown>).message === 'string';
 }
 
 export class BaseUtils {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/cdk-overlay-config.type.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/cdk-overlay-config.type.ts
index 01eb0e5d..a982cc03 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/cdk-overlay-config.type.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/cdk-overlay-config.type.ts
@@ -1,43 +1,43 @@
 import { ConnectedPosition } from '@angular/cdk/overlay';
 
-export type AppendToBodyDirection= 'rightDown'| 'rightUp' | 'leftUp'| 'leftDown' | 'centerDown' | 'centerUp';
+export type AppendToBodyDirection = 'rightDown' | 'rightUp' | 'leftUp' | 'leftDown' | 'centerDown' | 'centerUp';
 export const AppendToBodyDirectionsConfig: {
-  [p in AppendToBodyDirection]: ConnectedPosition
+  [p in AppendToBodyDirection]: ConnectedPosition;
 } = {
-  'rightDown': {
+  rightDown: {
     originX: 'start',
     originY: 'bottom',
     overlayX: 'start',
-    overlayY: 'top'
+    overlayY: 'top',
   },
-  'rightUp': {
+  rightUp: {
     originX: 'start',
     originY: 'top',
     overlayX: 'start',
-    overlayY: 'bottom'
+    overlayY: 'bottom',
   },
-  'leftUp': {
+  leftUp: {
     originX: 'end',
     originY: 'top',
     overlayX: 'end',
-    overlayY: 'bottom'
+    overlayY: 'bottom',
   },
-  'leftDown': {
+  leftDown: {
     originX: 'end',
     originY: 'bottom',
     overlayX: 'end',
-    overlayY: 'top'
+    overlayY: 'top',
   },
-  'centerDown': {
+  centerDown: {
     originX: 'center',
     originY: 'bottom',
     overlayX: 'center',
-    overlayY: 'top'
+    overlayY: 'top',
   },
-  'centerUp': {
+  centerUp: {
     originX: 'center',
     originY: 'top',
     overlayX: 'center',
-    overlayY: 'bottom'
-  }
+    overlayY: 'bottom',
+  },
 };
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/globalConfig/config.service.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/globalConfig/config.service.ts
index 37df344a..9fae630e 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/globalConfig/config.service.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/globalConfig/config.service.ts
@@ -32,7 +32,6 @@ export class DevConfigService {
   set<T extends TProBaseGlobalConfigKey>(componentName: T, value: TProBaseGlobalConfig[T]): void {
     this.config[componentName] = { ...this.config[componentName], ...value };
     this.configUpdated$.next(componentName);
-
   }
 }
 
diff --git a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/globalConfig/config.ts b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/globalConfig/config.ts
index 012ad6f6..aca4c77a 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/globalConfig/config.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/@shared/utils/globalConfig/config.ts
@@ -52,7 +52,6 @@ export interface TProBaseGlobalConfig {
   global?: GlobalConfig;
 }
 
-
 export type TProBaseGlobalConfigKey = keyof TProBaseGlobalConfig;
 export type TProBaseGlobalInsideConfigKey = keyof TProBaseGlobalConfig['global'];
 
diff --git a/packages/toolkits/pro/template/tinyng/src/app/app-routing.module.ts b/packages/toolkits/pro/template/tinyng/src/app/app-routing.module.ts
index 7d6b721e..4566c8de 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/app-routing.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/app-routing.module.ts
@@ -7,8 +7,7 @@ import { MarketplaceComponent } from './pages/console-home/widgets/marketplace/m
 const routes: Routes = [
   {
     path: 'pages',
-    loadChildren: () =>
-      import('./pages/pages.module').then((m) => m.PagesModule),
+    loadChildren: () => import('./pages/pages.module').then((m) => m.PagesModule),
     canActivate: [AuthGuardService],
   },
   {
@@ -32,7 +31,6 @@ const routes: Routes = [
     path: '**',
     redirectTo: 'pages',
   },
-
 ];
 
 @NgModule({
diff --git a/packages/toolkits/pro/template/tinyng/src/app/app.component.ts b/packages/toolkits/pro/template/tinyng/src/app/app.component.ts
index 947cc924..e1e19bd6 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/app.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/app.component.ts
@@ -4,7 +4,7 @@ import { TiLocale, TiIconComponent } from '@opentiny/ng';
 import { DEFAULT_LANG, I18N_LANGUAGES } from '@config/tiny-pro';
 @Component({
   selector: 't-pro-app',
-  template: `<router-outlet></router-outlet>`
+  template: `<router-outlet></router-outlet>`,
 })
 export class AppComponent {
   currentLang = localStorage.getItem('lang') || window.navigator.language.toLowerCase() || DEFAULT_LANG;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/console-home.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/console-home.component.scss
index dcbc1042..986f697c 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/console-home.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/console-home.component.scss
@@ -1,21 +1,19 @@
-@import 'src/app/@shared/styles/common.scss';
-
-.resource-groups {
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169,174,184,0.05); 
-  background: var(--ti-common-color-bg-white-normal);
-}
-
-.marketplace-content {
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169,174,184,0.05); 
-  background: var(--ti-common-color-bg-white-normal);
-}
-
-.recommendation-ad {
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169,174,184,0.05); 
-  background: var(--ti-common-color-bg-white-normal);
-}
-
-
+@import 'src/app/@shared/styles/common.scss';
+
+.resource-groups {
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+  background: var(--ti-common-color-bg-white-normal);
+}
+
+.marketplace-content {
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+  background: var(--ti-common-color-bg-white-normal);
+}
+
+.recommendation-ad {
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+  background: var(--ti-common-color-bg-white-normal);
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/console-home.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/console-home.component.ts
index e5ca8e19..3f19a625 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/console-home.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/console-home.component.ts
@@ -5,5 +5,4 @@ import { Component } from '@angular/core';
   templateUrl: './console-home.component.html',
   styleUrls: ['./console-home.component.scss'],
 })
-export class ConsoleHomeComponent {
-}
+export class ConsoleHomeComponent {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/beginner-guide/beginner-guide.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/beginner-guide/beginner-guide.component.scss
index 6db37e1a..a105d9ae 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/beginner-guide/beginner-guide.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/beginner-guide/beginner-guide.component.scss
@@ -1,64 +1,64 @@
-.beginner {
-  padding: 20px 20px;
-  margin-top: 20px;
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169,174,184,0.05); 
-  background: var(--ti-common-color-bg-white-normal);
-  width: 100%;
-
-  a {
-    text-decoration: none;
-  }
-
-  .beginner-title {
-    height: 20px;
-    line-height: 20px;
-    margin-bottom: 20px;
-    position: relative;
-
-    .title {
-      font-size: 16px;
-      color: var(--ti-common-color-text-primary);
-      font-weight: bold;
-    }
-
-    .beginner-more {
-      position: absolute;
-      right: 0;
-      top: 0;
-
-      a {
-        font-size: 14px;
-      }
-    }
-  }
-
-  .beginner-content {
-    a {
-      font-size: 12px;
-      color: var(--ti-common-color-text-primary);
-    }
-
-    a span:last-of-type:hover {
-      color: var(--ti-common-color-bg-hover);
-    }
-
-    > li:not(:last-of-type) {
-      margin-bottom: 18px;
-    }
-    li {
-      a {
-        cursor: pointer;
-        font-size: 14px;
-      }
-    }
-
-    .beginner-icon {
-      font-size: 14px;
-      position: absolute;
-      left: 0;
-      top: 2px;
-      color: var(--ti-base-color-common-2);
-    }
-  }
-}
+.beginner {
+  padding: 20px 20px;
+  margin-top: 20px;
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+  background: var(--ti-common-color-bg-white-normal);
+  width: 100%;
+
+  a {
+    text-decoration: none;
+  }
+
+  .beginner-title {
+    height: 20px;
+    line-height: 20px;
+    margin-bottom: 20px;
+    position: relative;
+
+    .title {
+      font-size: 16px;
+      color: var(--ti-common-color-text-primary);
+      font-weight: bold;
+    }
+
+    .beginner-more {
+      position: absolute;
+      right: 0;
+      top: 0;
+
+      a {
+        font-size: 14px;
+      }
+    }
+  }
+
+  .beginner-content {
+    a {
+      font-size: 12px;
+      color: var(--ti-common-color-text-primary);
+    }
+
+    a span:last-of-type:hover {
+      color: var(--ti-common-color-bg-hover);
+    }
+
+    > li:not(:last-of-type) {
+      margin-bottom: 18px;
+    }
+    li {
+      a {
+        cursor: pointer;
+        font-size: 14px;
+      }
+    }
+
+    .beginner-icon {
+      font-size: 14px;
+      position: absolute;
+      left: 0;
+      top: 2px;
+      color: var(--ti-base-color-common-2);
+    }
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/beginner-guide/beginner-guide.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/beginner-guide/beginner-guide.component.ts
index 13fdcb2f..cf364184 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/beginner-guide/beginner-guide.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/beginner-guide/beginner-guide.component.ts
@@ -25,6 +25,6 @@ export class BeginnerGuideComponent {
     {
       href: `${SupportUrlPrefix}qs-vpc/zh-cn_topic_0017816228.html`,
       text: `${TurorialI18nPrefix}internetTutorial`,
-    }
+    },
   ];
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/marketplace/constants.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/marketplace/constants.ts
index e58c1026..b5a13ed5 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/marketplace/constants.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/marketplace/constants.ts
@@ -1,123 +1,123 @@
-import { ImgAddrPrefix } from '@shared/tiny-pro';
-export const MarketplaceUrl = 'https://marketplace.huaweicloud.com/';
-const MarketI18nPrefix = 'consoleHome.marketplace.';
-
-export enum CateMenu {
-  BASIC_SOFTWARE = 'basicSoftware',
-  WEBSITE = 'networkConstruction',
-  BUSINESS_SOFTWARE = 'enterpriseApplication',
-  SECURITY = 'security',
-  INTERNET = 'internetThings',
-  AI = 'artificialIntelligence',
-  PROFESSIONAL_SERVICES = 'services',
-  SOLUTION = 'industrySolutions',
-}
-
-export const MarketplaceMenus = [
-  {
-    name: `${MarketI18nPrefix}purchasedItems`,
-  },
-  {
-    name: `${MarketI18nPrefix}orderList`,
-  },
-  {
-    name: `${MarketI18nPrefix}billableAmount`,
-  },
-  {
-    name: `${MarketI18nPrefix}discountToBeUsed`,
-  },
-];
-
-export const CateContent = [
-  {
-    id: CateMenu.BASIC_SOFTWARE,
-    title: MarketI18nPrefix + CateMenu.BASIC_SOFTWARE,
-    content: `${MarketI18nPrefix}basicSoftwareContent`,
-    url: `${MarketplaceUrl}search/basicSoftware/`,
-  },
-  {
-    id: CateMenu.WEBSITE,
-    title: MarketI18nPrefix + CateMenu.WEBSITE,
-    content: `${MarketI18nPrefix}networkConstructionContent`,
-    url: `${MarketplaceUrl}search/website/`,
-  },
-  {
-    id: CateMenu.BUSINESS_SOFTWARE,
-    title: MarketI18nPrefix + CateMenu.BUSINESS_SOFTWARE,
-    content: `${MarketI18nPrefix}enterpriseApplicationContent`,
-    url: `${MarketplaceUrl}search/businessSoftware/`,
-  },
-  {
-    id: CateMenu.SECURITY,
-    title: MarketI18nPrefix + CateMenu.SECURITY,
-    content: `${MarketI18nPrefix}securityContent`,
-    url: `${MarketplaceUrl}search/security/`,
-  },
-  {
-    id: CateMenu.INTERNET,
-    title: MarketI18nPrefix + CateMenu.INTERNET,
-    content: `${MarketI18nPrefix}internetThingsContent`,
-    url: `${MarketplaceUrl}search/internet/`,
-  },
-  {
-    id: CateMenu.AI,
-    title: MarketI18nPrefix + CateMenu.AI,
-    content: `${MarketI18nPrefix}artificialIntelligenceContent`,
-    url: `${MarketplaceUrl}search/ai/`,
-  },
-  {
-    id: CateMenu.PROFESSIONAL_SERVICES,
-    title: MarketI18nPrefix + CateMenu.PROFESSIONAL_SERVICES,
-    content: `${MarketI18nPrefix}servicesContent`,
-    url: `${MarketplaceUrl}search/professionalServices/`,
-  },
-  {
-    id: CateMenu.SOLUTION,
-    title: MarketI18nPrefix + CateMenu.SOLUTION,
-    content: `${MarketI18nPrefix}industrySolutionsContent`,
-    url: `${MarketplaceUrl}search/solution/`,
-  },
-];
-
-export const MarketContent = [
-  {
-    title: `${MarketI18nPrefix}cloudMail`,
-    content: `${MarketI18nPrefix}cloudMailContent`,
-    url: `${MarketplaceUrl}activity/mail`,
-    imgWidth: 41,
-    imgHeight: 43,
-    imgX: -3,
-    imgY: 0,
-    imgUrl: `${ImgAddrPrefix}/speed-mail.png`,
-  },
-  {
-    title: `${MarketI18nPrefix}cloudDisk`,
-    content: `${MarketI18nPrefix}cloudDiskContent`,
-    url: `${MarketplaceUrl}activity/cloudbox/`,
-    imgWidth: 53,
-    imgHeight: 54,
-    imgX: -13,
-    imgY: -7,
-    imgUrl: `${ImgAddrPrefix}/speed-disk.png`,
-  },
-  {
-    title: `${MarketI18nPrefix}cloudDeployment`,
-    content: `${MarketI18nPrefix}cloudDeploymentContent`,
-    url: `${MarketplaceUrl}activity/customedsite/index.html`,
-    imgWidth: 35,
-    imgHeight: 43,
-    imgX: 0,
-    imgY: -6,
-    imgUrl: `${ImgAddrPrefix}/speed-station.png`,
-  },
-  {
-    title: `${MarketI18nPrefix}trademarkRegistration`,
-    content: `${MarketI18nPrefix}trademarkRegistrationContent`,
-    url: `https://www.huaweicloud.com/product/trademark.html`,
-    imgWidth: 40,
-    imgHeight: 45,
-    imgX: -2,
-    imgY: -6,
-    imgUrl: `${ImgAddrPrefix}/trademark-registration.png`,
-  },
-];
+import { ImgAddrPrefix } from '@shared/tiny-pro';
+export const MarketplaceUrl = 'https://marketplace.huaweicloud.com/';
+const MarketI18nPrefix = 'consoleHome.marketplace.';
+
+export enum CateMenu {
+  BASIC_SOFTWARE = 'basicSoftware',
+  WEBSITE = 'networkConstruction',
+  BUSINESS_SOFTWARE = 'enterpriseApplication',
+  SECURITY = 'security',
+  INTERNET = 'internetThings',
+  AI = 'artificialIntelligence',
+  PROFESSIONAL_SERVICES = 'services',
+  SOLUTION = 'industrySolutions',
+}
+
+export const MarketplaceMenus = [
+  {
+    name: `${MarketI18nPrefix}purchasedItems`,
+  },
+  {
+    name: `${MarketI18nPrefix}orderList`,
+  },
+  {
+    name: `${MarketI18nPrefix}billableAmount`,
+  },
+  {
+    name: `${MarketI18nPrefix}discountToBeUsed`,
+  },
+];
+
+export const CateContent = [
+  {
+    id: CateMenu.BASIC_SOFTWARE,
+    title: MarketI18nPrefix + CateMenu.BASIC_SOFTWARE,
+    content: `${MarketI18nPrefix}basicSoftwareContent`,
+    url: `${MarketplaceUrl}search/basicSoftware/`,
+  },
+  {
+    id: CateMenu.WEBSITE,
+    title: MarketI18nPrefix + CateMenu.WEBSITE,
+    content: `${MarketI18nPrefix}networkConstructionContent`,
+    url: `${MarketplaceUrl}search/website/`,
+  },
+  {
+    id: CateMenu.BUSINESS_SOFTWARE,
+    title: MarketI18nPrefix + CateMenu.BUSINESS_SOFTWARE,
+    content: `${MarketI18nPrefix}enterpriseApplicationContent`,
+    url: `${MarketplaceUrl}search/businessSoftware/`,
+  },
+  {
+    id: CateMenu.SECURITY,
+    title: MarketI18nPrefix + CateMenu.SECURITY,
+    content: `${MarketI18nPrefix}securityContent`,
+    url: `${MarketplaceUrl}search/security/`,
+  },
+  {
+    id: CateMenu.INTERNET,
+    title: MarketI18nPrefix + CateMenu.INTERNET,
+    content: `${MarketI18nPrefix}internetThingsContent`,
+    url: `${MarketplaceUrl}search/internet/`,
+  },
+  {
+    id: CateMenu.AI,
+    title: MarketI18nPrefix + CateMenu.AI,
+    content: `${MarketI18nPrefix}artificialIntelligenceContent`,
+    url: `${MarketplaceUrl}search/ai/`,
+  },
+  {
+    id: CateMenu.PROFESSIONAL_SERVICES,
+    title: MarketI18nPrefix + CateMenu.PROFESSIONAL_SERVICES,
+    content: `${MarketI18nPrefix}servicesContent`,
+    url: `${MarketplaceUrl}search/professionalServices/`,
+  },
+  {
+    id: CateMenu.SOLUTION,
+    title: MarketI18nPrefix + CateMenu.SOLUTION,
+    content: `${MarketI18nPrefix}industrySolutionsContent`,
+    url: `${MarketplaceUrl}search/solution/`,
+  },
+];
+
+export const MarketContent = [
+  {
+    title: `${MarketI18nPrefix}cloudMail`,
+    content: `${MarketI18nPrefix}cloudMailContent`,
+    url: `${MarketplaceUrl}activity/mail`,
+    imgWidth: 41,
+    imgHeight: 43,
+    imgX: -3,
+    imgY: 0,
+    imgUrl: `${ImgAddrPrefix}/speed-mail.png`,
+  },
+  {
+    title: `${MarketI18nPrefix}cloudDisk`,
+    content: `${MarketI18nPrefix}cloudDiskContent`,
+    url: `${MarketplaceUrl}activity/cloudbox/`,
+    imgWidth: 53,
+    imgHeight: 54,
+    imgX: -13,
+    imgY: -7,
+    imgUrl: `${ImgAddrPrefix}/speed-disk.png`,
+  },
+  {
+    title: `${MarketI18nPrefix}cloudDeployment`,
+    content: `${MarketI18nPrefix}cloudDeploymentContent`,
+    url: `${MarketplaceUrl}activity/customedsite/index.html`,
+    imgWidth: 35,
+    imgHeight: 43,
+    imgX: 0,
+    imgY: -6,
+    imgUrl: `${ImgAddrPrefix}/speed-station.png`,
+  },
+  {
+    title: `${MarketI18nPrefix}trademarkRegistration`,
+    content: `${MarketI18nPrefix}trademarkRegistrationContent`,
+    url: `https://www.huaweicloud.com/product/trademark.html`,
+    imgWidth: 40,
+    imgHeight: 45,
+    imgX: -2,
+    imgY: -6,
+    imgUrl: `${ImgAddrPrefix}/trademark-registration.png`,
+  },
+];
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/marketplace/marketplace.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/marketplace/marketplace.component.scss
index 657277d7..eb77f4a2 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/marketplace/marketplace.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/marketplace/marketplace.component.scss
@@ -1,127 +1,127 @@
-.content-services {
-  margin-top: 20px;
-  padding: 20px 20px 10px 0;
-  position: relative;
-
-  .marketplace-content-services {
-    overflow: hidden;
-
-    .marketplace-title {
-      margin-bottom: 20px;
-      font-size: 16px;
-      margin-left: 20px;
-      line-height: 20px;
-      color: var(--ti-base-color-common-7);
-      font-weight: bold;
-
-      .access-font-set {
-        line-height: 20px;
-        font-size: 14px;
-        color: var(--ti-common-color-text-highlight);
-        font-weight: normal;
-        cursor: pointer;
-
-        &:hover {
-          color: var(--ti-common-color-text-link-hover);
-        }
-      }
-
-      .pull-right {
-        float: right !important;
-      }
-    }
-
-    .marketplace-list {
-      .column {
-        margin-bottom: 20px;
-        width: 25%;
-        float: left;
-
-        .marketplace-instance-item {
-          background-color: var(--ti-common-color-bg-light-normal);
-          color: var(--ti-common-color-text-highlight);
-          line-height: 46px;
-          height: 46px;
-          cursor: pointer;
-          margin-left: 20px;
-
-          .marketplace-name-font-set {
-            padding-left: 25px;
-            height: 46px;
-            text-overflow: ellipsis;
-            overflow: hidden;
-            white-space: nowrap;
-            font-family: normal;
-            font-size: 14px;
-            &:hover {
-              background-color: var(--ti-base-color-brand-4);
-              color: var(--ti-common-color-text-white);
-            }
-          }
-        }
-      }
-    }
-  }
-
-  .marketplace-cate {
-    display: flex;
-    flex-wrap: wrap;
-
-    .cate-card {
-      width: 25%;
-      margin-bottom: 20px;
-
-      .cate-content {
-        width: calc(100% - 20px);
-        margin-left: 20px;
-        height: 68px;
-        border: 1px solid #e9edfa;
-        box-sizing: border-box;
-        position: relative;
-        cursor: pointer;
-
-        &:hover {
-          border: 1px solid var(--ti-base-color-brand-5);
-        }
-
-        .cate-svg {
-          position: absolute;
-          top: var(--ti-common-space-4x);
-          left: 27px;
-        }
-
-        .cate-title,
-        .cate-sub-title {
-          font-size: 14px;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-          word-break: break-all;
-          max-width: calc(100% - 88px);
-        }
-
-        .cate-title {
-          position: absolute;
-          top: 12px;
-          left: 80px;
-        }
-
-        .cate-sub-title {
-          position: absolute;
-          top: var(--ti-common-space-8x);
-          color: #aaa;
-          font-size: 14px;
-          line-height: 22px;
-          left: 80px;
-        }
-      }
-    }
-  }
-
-  .nav {
-    position: absolute;
-    right: var(--ti-common-space-10x);
-    top: 30px;
-    font-size: var(--ti-common-space-3x);
-  }
-}
+.content-services {
+  margin-top: 20px;
+  padding: 20px 20px 10px 0;
+  position: relative;
+
+  .marketplace-content-services {
+    overflow: hidden;
+
+    .marketplace-title {
+      margin-bottom: 20px;
+      font-size: 16px;
+      margin-left: 20px;
+      line-height: 20px;
+      color: var(--ti-base-color-common-7);
+      font-weight: bold;
+
+      .access-font-set {
+        line-height: 20px;
+        font-size: 14px;
+        color: var(--ti-common-color-text-highlight);
+        font-weight: normal;
+        cursor: pointer;
+
+        &:hover {
+          color: var(--ti-common-color-text-link-hover);
+        }
+      }
+
+      .pull-right {
+        float: right !important;
+      }
+    }
+
+    .marketplace-list {
+      .column {
+        margin-bottom: 20px;
+        width: 25%;
+        float: left;
+
+        .marketplace-instance-item {
+          background-color: var(--ti-common-color-bg-light-normal);
+          color: var(--ti-common-color-text-highlight);
+          line-height: 46px;
+          height: 46px;
+          cursor: pointer;
+          margin-left: 20px;
+
+          .marketplace-name-font-set {
+            padding-left: 25px;
+            height: 46px;
+            text-overflow: ellipsis;
+            overflow: hidden;
+            white-space: nowrap;
+            font-family: normal;
+            font-size: 14px;
+            &:hover {
+              background-color: var(--ti-base-color-brand-4);
+              color: var(--ti-common-color-text-white);
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .marketplace-cate {
+    display: flex;
+    flex-wrap: wrap;
+
+    .cate-card {
+      width: 25%;
+      margin-bottom: 20px;
+
+      .cate-content {
+        width: calc(100% - 20px);
+        margin-left: 20px;
+        height: 68px;
+        border: 1px solid #e9edfa;
+        box-sizing: border-box;
+        position: relative;
+        cursor: pointer;
+
+        &:hover {
+          border: 1px solid var(--ti-base-color-brand-5);
+        }
+
+        .cate-svg {
+          position: absolute;
+          top: var(--ti-common-space-4x);
+          left: 27px;
+        }
+
+        .cate-title,
+        .cate-sub-title {
+          font-size: 14px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          word-break: break-all;
+          max-width: calc(100% - 88px);
+        }
+
+        .cate-title {
+          position: absolute;
+          top: 12px;
+          left: 80px;
+        }
+
+        .cate-sub-title {
+          position: absolute;
+          top: var(--ti-common-space-8x);
+          color: #aaa;
+          font-size: 14px;
+          line-height: 22px;
+          left: 80px;
+        }
+      }
+    }
+  }
+
+  .nav {
+    position: absolute;
+    right: var(--ti-common-space-10x);
+    top: 30px;
+    font-size: var(--ti-common-space-3x);
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/constants.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/constants.ts
index 2c5ee9ce..8e4aa8d1 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/constants.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/constants.ts
@@ -1,46 +1,46 @@
-import { ImgAddrPrefix } from '@shared/tiny-pro';
-export const RecommendUrl = 'https://marketplace.huaweicloud.com/';
-const RecommendI18nPrefix = 'consoleHome.recommendation.';
-
-export const recommendObj = [
-  {
-    title: `${RecommendI18nPrefix}cloudMail`,
-    content: `${RecommendI18nPrefix}cloudMailContent`,
-    url: `${RecommendUrl}activity/mail`,
-    imgWidth: 41,
-    imgHeight: 43,
-    imgX: -3,
-    imgY: 0,
-    imgUrl: `${ImgAddrPrefix}/speed-mail.png`,
-  },
-  {
-    title: `${RecommendI18nPrefix}cloudDisk`,
-    content: `${RecommendI18nPrefix}cloudDiskContent`,
-    url: `${RecommendUrl}activity/cloudbox/`,
-    imgWidth: 53,
-    imgHeight: 54,
-    imgX: -13,
-    imgY: -7,
-    imgUrl: `${ImgAddrPrefix}/speed-disk.png`,
-  },
-  {
-    title: `${RecommendI18nPrefix}cloudDeployment`,
-    content: `${RecommendI18nPrefix}cloudDeploymentContent`,
-    url: `${RecommendUrl}activity/customedsite/index.html`,
-    imgWidth: 35,
-    imgHeight: 43,
-    imgX: 0,
-    imgY: -6,
-    imgUrl: `${ImgAddrPrefix}/speed-station.png`,
-  },
-  {
-    title: `${RecommendI18nPrefix}trademarkRegistration`,
-    content: `${RecommendI18nPrefix}trademarkRegistrationContent`,
-    url: `https://www.huaweicloud.com/product/trademark.html`,
-    imgWidth: 40,
-    imgHeight: 45,
-    imgX: -2,
-    imgY: -6,
-    imgUrl: `${ImgAddrPrefix}/trademark-registration.png`,
-  },
-];
+import { ImgAddrPrefix } from '@shared/tiny-pro';
+export const RecommendUrl = 'https://marketplace.huaweicloud.com/';
+const RecommendI18nPrefix = 'consoleHome.recommendation.';
+
+export const recommendObj = [
+  {
+    title: `${RecommendI18nPrefix}cloudMail`,
+    content: `${RecommendI18nPrefix}cloudMailContent`,
+    url: `${RecommendUrl}activity/mail`,
+    imgWidth: 41,
+    imgHeight: 43,
+    imgX: -3,
+    imgY: 0,
+    imgUrl: `${ImgAddrPrefix}/speed-mail.png`,
+  },
+  {
+    title: `${RecommendI18nPrefix}cloudDisk`,
+    content: `${RecommendI18nPrefix}cloudDiskContent`,
+    url: `${RecommendUrl}activity/cloudbox/`,
+    imgWidth: 53,
+    imgHeight: 54,
+    imgX: -13,
+    imgY: -7,
+    imgUrl: `${ImgAddrPrefix}/speed-disk.png`,
+  },
+  {
+    title: `${RecommendI18nPrefix}cloudDeployment`,
+    content: `${RecommendI18nPrefix}cloudDeploymentContent`,
+    url: `${RecommendUrl}activity/customedsite/index.html`,
+    imgWidth: 35,
+    imgHeight: 43,
+    imgX: 0,
+    imgY: -6,
+    imgUrl: `${ImgAddrPrefix}/speed-station.png`,
+  },
+  {
+    title: `${RecommendI18nPrefix}trademarkRegistration`,
+    content: `${RecommendI18nPrefix}trademarkRegistrationContent`,
+    url: `https://www.huaweicloud.com/product/trademark.html`,
+    imgWidth: 40,
+    imgHeight: 45,
+    imgX: -2,
+    imgY: -6,
+    imgUrl: `${ImgAddrPrefix}/trademark-registration.png`,
+  },
+];
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.scss
index fae98964..e2e3e81c 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.scss
@@ -1,75 +1,75 @@
-.recommend-content {
-    margin-top: 20px;
-    padding: 20px 20px 30px 20px;
-}
-
-.recommend-content-services {
-    overflow: hidden;
-    .recommend-title {
-      margin-bottom: 17px;
-      line-height: 20px;
-      color: var(--ti-base-color-common-7);
-      font-size: 16px;
-      font-weight: bold;
-    }
-
-    .recommend-list {
-      .recommend-column {
-        width: 25%;
-        float: left;
-
-        .recommend-wrap {
-          height: 86px;
-          max-height: 86px;
-          padding: 12px 8px 4px 8px;
-          border: 1px solid transparent;
-
-          &:hover {
-            cursor: pointer;
-            border: 1px solid #bbc8fa;
-          }
-
-          .recommend-img {
-            float: left;
-            width: 60px;
-            height: 60px;
-          }
-
-          .recommend-right {
-            float: left;
-            max-width: calc(100% - 70px);
-
-            .side-href-title {
-              display: inline-block;
-              font-size: 14px;
-              line-height: 14px;
-              color: #41424b;
-              text-decoration: none;
-              margin-left: var(--ti-common-space-3x);
-              width: 100%;
-              overflow: hidden;
-              text-overflow: ellipsis;
-              white-space: nowrap;
-              word-break: break-all;
-
-              &:hover {
-                color: #5e7ce0;
-              }
-            }
-
-            .side-href-content {
-              font-size: 14px;
-              line-height: 22px;
-              color: #8a8e99;
-              margin-left: var(--ti-common-space-3x);
-              overflow: hidden;
-              text-overflow: ellipsis;
-              display: -webkit-box;
-              -webkit-line-clamp: 2;
-              -webkit-box-orient: vertical;
-            }
-          }
-        }
-      }
-    }
-}
\ No newline at end of file
+.recommend-content {
+  margin-top: 20px;
+  padding: 20px 20px 30px 20px;
+}
+
+.recommend-content-services {
+  overflow: hidden;
+  .recommend-title {
+    margin-bottom: 17px;
+    line-height: 20px;
+    color: var(--ti-base-color-common-7);
+    font-size: 16px;
+    font-weight: bold;
+  }
+
+  .recommend-list {
+    .recommend-column {
+      width: 25%;
+      float: left;
+
+      .recommend-wrap {
+        height: 86px;
+        max-height: 86px;
+        padding: 12px 8px 4px 8px;
+        border: 1px solid transparent;
+
+        &:hover {
+          cursor: pointer;
+          border: 1px solid #bbc8fa;
+        }
+
+        .recommend-img {
+          float: left;
+          width: 60px;
+          height: 60px;
+        }
+
+        .recommend-right {
+          float: left;
+          max-width: calc(100% - 70px);
+
+          .side-href-title {
+            display: inline-block;
+            font-size: 14px;
+            line-height: 14px;
+            color: #41424b;
+            text-decoration: none;
+            margin-left: var(--ti-common-space-3x);
+            width: 100%;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            word-break: break-all;
+
+            &:hover {
+              color: #5e7ce0;
+            }
+          }
+
+          .side-href-content {
+            font-size: 14px;
+            line-height: 22px;
+            color: #8a8e99;
+            margin-left: var(--ti-common-space-3x);
+            overflow: hidden;
+            text-overflow: ellipsis;
+            display: -webkit-box;
+            -webkit-line-clamp: 2;
+            -webkit-box-orient: vertical;
+          }
+        }
+      }
+    }
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.spec.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.spec.ts
index 82007d13..923bdfdd 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.spec.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.spec.ts
@@ -8,9 +8,8 @@ describe('RecommendationComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [ RecommendationComponent ]
-    })
-    .compileComponents();
+      declarations: [RecommendationComponent],
+    }).compileComponents();
 
     fixture = TestBed.createComponent(RecommendationComponent);
     component = fixture.componentInstance;
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.ts
index 03c23afb..2c1023f4 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/recommendation/recommendation.component.ts
@@ -3,11 +3,11 @@ import { recommendObj } from './constants';
 @Component({
   selector: 't-pro-recommendation',
   templateUrl: './recommendation.component.html',
-  styleUrls: ['./recommendation.component.scss']
+  styleUrls: ['./recommendation.component.scss'],
 })
 export class RecommendationComponent {
   public recommendObj = recommendObj;
-  constructor() { }
+  constructor() {}
 
   openUrl(url: string) {
     const win = window.open(url);
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/resource-groups/resource-groups.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/resource-groups/resource-groups.component.scss
index 9a388b27..821e295b 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/resource-groups/resource-groups.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/resource-groups/resource-groups.component.scss
@@ -1,153 +1,153 @@
-.home-content-services {
-  padding: 20px 20px 20px 0;
-}
-
-.my-resource-title {
-  font-size: 14px;
-  margin-left: 20px;
-  color: var(--ti-common-color-text-primary);
-  line-height: 20px;
-  .title {
-    font-size: 16px;
-    color: var(--ti-common-color-text-primary);
-    font-weight: bold;
-  }
-  .cloud-regionName {
-    font-size: 12px;
-    color: var(--ti-common-color-text-weaken);
-    line-height: 20px;
-  }
-  .my-resources-view-resources-font-set {
-    font-size: 14px;
-    color: var(--ti-common-color-text-highlight);
-    cursor: pointer;
-    &:hover {
-      color: var(--ti-common-color-text-link-hover);
-    }
-  }
-}
-
-.pull-right {
-  float: right !important;
-}
-
-.my-resource-list {
-  min-height: 40px;
-  overflow-y: auto;
-  &::after {
-    content: '';
-    display: table;
-    clear: both;
-  }
-}
-
-.pull-left {
-  float: left !important;
-}
-
-.my-resource-instance-item {
-  background-color: var(--ti-common-color-bg-light-normal);
-  color: var(--ti-common-color-text-highlight);
-  line-height: 46px;
-  height: 46px;
-  cursor: pointer;
-  margin-left: 20px;
-  &:hover {
-    color: var(--ti-common-color-text-white);
-    background-color: var(--ti-base-color-brand-4);
-  }
-  .my-resource-name-font-set {
-    display: inline-block;
-    padding-left: 20px;
-    height: 46px;
-    max-width: calc(100%);
-    text-overflow: ellipsis;
-    overflow: hidden;
-    white-space: nowrap;
-    word-break: normal !important;
-    word-wrap: normal !important;
-    font-size: 14px;
-  }
-  .my-resource-instance-number-position {
-    float: right;
-    right: 15px;
-    margin-right: 15px;
-    line-height: 38px;
-    color: var(--ti-base-color-common-7);
-    font-size: 18px;
-  }
-}
-
-.my-resource-list-add {
-  display: block;
-  margin-top: 20px;
-  width: calc(20% - 20px);
-  min-width: 140px;
-  .my-resource-list-button {
-    height: 46px;
-    width: 100%;
-    margin-left: 20px;
-    text-align: left;
-    border: 1px solid #e9edfa;
-    position: relative;
-    background-color: var(--ti-common-color-bg-white-normal);
-    .my-resource-list-button-icon {
-      transition: color 0.15s;
-      font-size: 15px;
-      margin: 0 6px 0 14px;
-      color: var(--ti-common-color-text-highlight);
-    }
-    .my-resource-name-font-set {
-      font-size: 14px;
-      position: relative;
-      top: -2px;
-      color: var(--ti-common-color-text-highlight);
-    }
-    .my-resource-list-button-text {
-      position: absolute;
-      top: 50px;
-      left: 0px;
-      color: var(--ti-common-color-text-highlight);
-    }
-  }
-}
-
-.column {
-  margin-top: 20px;
-  height: 46px;
-  min-width: 160px;
-  width: 20%;
-}
-
-.home-content-recent-service-new-title {
-  font-weight: 700;
-  font-size: 16px;
-  line-height: 20px;
-  margin: 30px 0 20px 20px;
-  .home-content-service-new-text {
-    font-size: 14px;
-    color: var(--ti-common-color-text-primary);
-    font-weight: bold;
-  }
-}
-
-.home-content-recent-service-list-service {
-  display: inline-block;
-  padding: 16px 0 16px 20px;
-  width: calc(20% - 20px);
-  font-size: 14px;
-  line-height: 14px;
-  color: var(--ti-common-color-text-highlight);
-  cursor: pointer;
-  background: var(--ti-common-color-bg-light-normal);
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
-  margin-left: 20px;
-  min-width: 140px;
-
-  &:hover {
-    color: var(--ti-common-color-text-white);
-    background-color: var(--ti-base-color-brand-4);
-  }
-}
+.home-content-services {
+  padding: 20px 20px 20px 0;
+}
+
+.my-resource-title {
+  font-size: 14px;
+  margin-left: 20px;
+  color: var(--ti-common-color-text-primary);
+  line-height: 20px;
+  .title {
+    font-size: 16px;
+    color: var(--ti-common-color-text-primary);
+    font-weight: bold;
+  }
+  .cloud-regionName {
+    font-size: 12px;
+    color: var(--ti-common-color-text-weaken);
+    line-height: 20px;
+  }
+  .my-resources-view-resources-font-set {
+    font-size: 14px;
+    color: var(--ti-common-color-text-highlight);
+    cursor: pointer;
+    &:hover {
+      color: var(--ti-common-color-text-link-hover);
+    }
+  }
+}
+
+.pull-right {
+  float: right !important;
+}
+
+.my-resource-list {
+  min-height: 40px;
+  overflow-y: auto;
+  &::after {
+    content: '';
+    display: table;
+    clear: both;
+  }
+}
+
+.pull-left {
+  float: left !important;
+}
+
+.my-resource-instance-item {
+  background-color: var(--ti-common-color-bg-light-normal);
+  color: var(--ti-common-color-text-highlight);
+  line-height: 46px;
+  height: 46px;
+  cursor: pointer;
+  margin-left: 20px;
+  &:hover {
+    color: var(--ti-common-color-text-white);
+    background-color: var(--ti-base-color-brand-4);
+  }
+  .my-resource-name-font-set {
+    display: inline-block;
+    padding-left: 20px;
+    height: 46px;
+    max-width: calc(100%);
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    word-break: normal !important;
+    word-wrap: normal !important;
+    font-size: 14px;
+  }
+  .my-resource-instance-number-position {
+    float: right;
+    right: 15px;
+    margin-right: 15px;
+    line-height: 38px;
+    color: var(--ti-base-color-common-7);
+    font-size: 18px;
+  }
+}
+
+.my-resource-list-add {
+  display: block;
+  margin-top: 20px;
+  width: calc(20% - 20px);
+  min-width: 140px;
+  .my-resource-list-button {
+    height: 46px;
+    width: 100%;
+    margin-left: 20px;
+    text-align: left;
+    border: 1px solid #e9edfa;
+    position: relative;
+    background-color: var(--ti-common-color-bg-white-normal);
+    .my-resource-list-button-icon {
+      transition: color 0.15s;
+      font-size: 15px;
+      margin: 0 6px 0 14px;
+      color: var(--ti-common-color-text-highlight);
+    }
+    .my-resource-name-font-set {
+      font-size: 14px;
+      position: relative;
+      top: -2px;
+      color: var(--ti-common-color-text-highlight);
+    }
+    .my-resource-list-button-text {
+      position: absolute;
+      top: 50px;
+      left: 0px;
+      color: var(--ti-common-color-text-highlight);
+    }
+  }
+}
+
+.column {
+  margin-top: 20px;
+  height: 46px;
+  min-width: 160px;
+  width: 20%;
+}
+
+.home-content-recent-service-new-title {
+  font-weight: 700;
+  font-size: 16px;
+  line-height: 20px;
+  margin: 30px 0 20px 20px;
+  .home-content-service-new-text {
+    font-size: 14px;
+    color: var(--ti-common-color-text-primary);
+    font-weight: bold;
+  }
+}
+
+.home-content-recent-service-list-service {
+  display: inline-block;
+  padding: 16px 0 16px 20px;
+  width: calc(20% - 20px);
+  font-size: 14px;
+  line-height: 14px;
+  color: var(--ti-common-color-text-highlight);
+  cursor: pointer;
+  background: var(--ti-common-color-bg-light-normal);
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+  margin-left: 20px;
+  min-width: 140px;
+
+  &:hover {
+    color: var(--ti-common-color-text-white);
+    background-color: var(--ti-base-color-brand-4);
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-advertise/side-advertise.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-advertise/side-advertise.component.scss
index 17db6c53..81e57470 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-advertise/side-advertise.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-advertise/side-advertise.component.scss
@@ -1,33 +1,33 @@
-.home-side-advertising-banner {
-  position: relative;
-  width: 100%;
-}
-
-.home-side-advertising-content {
-  width: 100%;
-  left: 0;
-  top: 0;
-  overflow: hidden;
-  height: 100%;
-
-  >div {
-    position: relative;
-    height: 100%;
-    width: 100%;
-    margin: 0;
-    padding: 0;
-
-    a {
-      position: absolute;
-      width: 100%;
-      height: 100%;
-      left: 0;
-      top: 0;
-    }
-  }
-  .banner-img {
-    padding-top: 20px;
-    width: 100%;
-    height: 126px;
-  }
-}
+.home-side-advertising-banner {
+  position: relative;
+  width: 100%;
+}
+
+.home-side-advertising-content {
+  width: 100%;
+  left: 0;
+  top: 0;
+  overflow: hidden;
+  height: 100%;
+
+  > div {
+    position: relative;
+    height: 100%;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+
+    a {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      left: 0;
+      top: 0;
+    }
+  }
+  .banner-img {
+    padding-top: 20px;
+    width: 100%;
+    height: 126px;
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-advertise/side-advertise.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-advertise/side-advertise.component.ts
index 971d3b5c..5326e8d6 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-advertise/side-advertise.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-advertise/side-advertise.component.ts
@@ -8,6 +8,5 @@ import { Component } from '@angular/core';
 export class SideAdvertiseComponent {
   // 广告位链接 && 图片地址
   public href: string = 'https://www.huaweicloud.com/mobile_app/hwapp.html?channel=console_banner&ggw_hd';
-  public src: string =
-    'https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/advertisement/Smart/49APP/1630378504659009954.png';
+  public src: string = 'https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/advertisement/Smart/49APP/1630378504659009954.png';
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-announcement/side-announcement.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-announcement/side-announcement.component.scss
index 3600c41a..3c9356eb 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-announcement/side-announcement.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/side-announcement/side-announcement.component.scss
@@ -1,97 +1,96 @@
-.side-annoucement-container {
-  font-size: 12px;
-  padding: 20px 20px 13px 15px;
-  margin-top: 20px;
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169,174,184,0.05); 
-  background: var(--ti-common-color-bg-white-normal);
-  width: 100%;
-
-  .side-annoucement-title {
-    height: 20px;
-    margin-bottom: 30px;
-    line-height: 20px;
-    position: relative;
-
-    .title {
-      font-size: 16px;
-      color: var(--ti-common-color-text-primary);
-      font-weight: bold;
-      padding-left: 6px;
-    }
-
-    .side-links {
-      position: absolute;
-      right: 0px;
-      font-size: 14px;
-      cursor: pointer;
-      text-decoration: none;
-
-      &:hover {
-        color: var(--ti-common-color-bg-hover);
-        text-decoration: underline;
-      }
-    }
-  }
-
-  .side-href {
-    display: block;
-    color: #252b3a;
-    word-break: keep-all;
-    height: 14px;
-    margin-bottom: 24px;
-    line-height: 14px;
-    font-size: 14px;
-    font-family: PingFang SC, PingFang SC-PingFang SC;
-    font-weight: normal;
-
-    span:first-of-type {
-      float: left;
-      color: var(--ti-common-color-icon-normal);
-    }
-
-    .notice-time {
-      float: right;
-      font-size: 14px;
-      color: #8a8e99;
-    }
-
-    &:hover,
-    &:active {
-      color: var(--ti-common-color-dash-line-hover);
-      text-decoration: none;
-    }
-
-    &:link,
-    &:visited {
-      text-decoration: none;
-    }
-
-
-    & .side-title {
-      display: inline-block;
-      width: 55%;
-      text-overflow: ellipsis;
-      overflow: hidden;
-      white-space: nowrap;
-    }
-  }
-}
-
-@media screen and (max-width: 1637px) {
-  .notice-time {
-    display: none;
-  }
-  .side-title {
-    width: calc(100% - 85px) !important;
-  }
-}
-
-@media screen and (max-width: 1439px) {
-  .notice-time {
-    display: inline-block;
-  }
-  .side-title {
-    width: calc(100% - 130px) !important;
-  }
-}
+.side-annoucement-container {
+  font-size: 12px;
+  padding: 20px 20px 13px 15px;
+  margin-top: 20px;
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+  background: var(--ti-common-color-bg-white-normal);
+  width: 100%;
+
+  .side-annoucement-title {
+    height: 20px;
+    margin-bottom: 30px;
+    line-height: 20px;
+    position: relative;
+
+    .title {
+      font-size: 16px;
+      color: var(--ti-common-color-text-primary);
+      font-weight: bold;
+      padding-left: 6px;
+    }
+
+    .side-links {
+      position: absolute;
+      right: 0px;
+      font-size: 14px;
+      cursor: pointer;
+      text-decoration: none;
+
+      &:hover {
+        color: var(--ti-common-color-bg-hover);
+        text-decoration: underline;
+      }
+    }
+  }
+
+  .side-href {
+    display: block;
+    color: #252b3a;
+    word-break: keep-all;
+    height: 14px;
+    margin-bottom: 24px;
+    line-height: 14px;
+    font-size: 14px;
+    font-family: PingFang SC, PingFang SC-PingFang SC;
+    font-weight: normal;
+
+    span:first-of-type {
+      float: left;
+      color: var(--ti-common-color-icon-normal);
+    }
+
+    .notice-time {
+      float: right;
+      font-size: 14px;
+      color: #8a8e99;
+    }
+
+    &:hover,
+    &:active {
+      color: var(--ti-common-color-dash-line-hover);
+      text-decoration: none;
+    }
+
+    &:link,
+    &:visited {
+      text-decoration: none;
+    }
+
+    & .side-title {
+      display: inline-block;
+      width: 55%;
+      text-overflow: ellipsis;
+      overflow: hidden;
+      white-space: nowrap;
+    }
+  }
+}
+
+@media screen and (max-width: 1637px) {
+  .notice-time {
+    display: none;
+  }
+  .side-title {
+    width: calc(100% - 85px) !important;
+  }
+}
+
+@media screen and (max-width: 1439px) {
+  .notice-time {
+    display: inline-block;
+  }
+  .side-title {
+    width: calc(100% - 130px) !important;
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/user-info/user-info-head/user-info-head.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/user-info/user-info-head/user-info-head.component.scss
index 58386261..206ae216 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/user-info/user-info-head/user-info-head.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/user-info/user-info-head/user-info-head.component.scss
@@ -1,85 +1,85 @@
-@import 'src/app/@shared/styles/common.scss';
-
-.user-panel-head {
-  position: relative;
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169,174,184,0.05); 
-  background: var(--ti-common-color-bg-white-normal);
-  padding: 30px 25px 22px 30px;
-}
-
-.user-info-head {
-  float: left;
-  cursor: pointer;
-  background-image: url('../../../../../../assets/img/avatar.png');
-  background-repeat: no-repeat;
-  background-size: 52px;
-  height: 52px;
-  width: 52px;
-  border-radius: 50%;
-}
-
-.user-info-name-and-auth {
-  position: relative;
-  margin-left: 48px;
-  width: auto;
-  font-size: 12px;
-  color: var(--ti-common-color-text-primary);
-  line-height: 16px;
-}
-
-.user-info-expense-center {
-  position: absolute;
-  right: 0px;
-  display: inline-block;
-  
-  & > a {
-    color: var(--ti-common-color-text-highlight);
-  }
-}
-
-.user-info-name {
-  margin: 4px 0;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-
-.user-info-status-ok {
-  color: var(--ti-common-color-success);
-}
-
-.auth-status-style {
-  position: relative;
-  padding: 8px 10px 5px 20px;
-  font-size: 14px;
-  line-height: 20px;
-  text-align: left;
-  height: 16px;
-
-  .real-name {
-    position: absolute;
-    top: 8px;
-    left: 70px;
-    background-image: url('../../../../../../assets/img/real-name.png');
-    background-repeat: no-repeat;
-    height: 16px;
-    width: 54px;
-  }
-
-  > a {
-    color: var(--ti-common-color-icon-normal);
-    margin-right: 8px;
-  }
-
-  a.auth-status-warn {
-    color: var(--ti-common-color-error);
-    text-decoration: underline;
-  }
-}
-
-.hello-lable {
-  color: #86909c;
-  margin: 12px 0 0 20px;
-  line-height: 20px;
-  font-size: 14px;
-}
+@import 'src/app/@shared/styles/common.scss';
+
+.user-panel-head {
+  position: relative;
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+  background: var(--ti-common-color-bg-white-normal);
+  padding: 30px 25px 22px 30px;
+}
+
+.user-info-head {
+  float: left;
+  cursor: pointer;
+  background-image: url('../../../../../../assets/img/avatar.png');
+  background-repeat: no-repeat;
+  background-size: 52px;
+  height: 52px;
+  width: 52px;
+  border-radius: 50%;
+}
+
+.user-info-name-and-auth {
+  position: relative;
+  margin-left: 48px;
+  width: auto;
+  font-size: 12px;
+  color: var(--ti-common-color-text-primary);
+  line-height: 16px;
+}
+
+.user-info-expense-center {
+  position: absolute;
+  right: 0px;
+  display: inline-block;
+
+  & > a {
+    color: var(--ti-common-color-text-highlight);
+  }
+}
+
+.user-info-name {
+  margin: 4px 0;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+.user-info-status-ok {
+  color: var(--ti-common-color-success);
+}
+
+.auth-status-style {
+  position: relative;
+  padding: 8px 10px 5px 20px;
+  font-size: 14px;
+  line-height: 20px;
+  text-align: left;
+  height: 16px;
+
+  .real-name {
+    position: absolute;
+    top: 8px;
+    left: 70px;
+    background-image: url('../../../../../../assets/img/real-name.png');
+    background-repeat: no-repeat;
+    height: 16px;
+    width: 54px;
+  }
+
+  > a {
+    color: var(--ti-common-color-icon-normal);
+    margin-right: 8px;
+  }
+
+  a.auth-status-warn {
+    color: var(--ti-common-color-error);
+    text-decoration: underline;
+  }
+}
+
+.hello-lable {
+  color: #86909c;
+  margin: 12px 0 0 20px;
+  line-height: 20px;
+  font-size: 14px;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/user-info/user-info-panel/user-info-panel.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/user-info/user-info-panel/user-info-panel.component.scss
index bc185f84..62e53ef1 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/user-info/user-info-panel/user-info-panel.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/console-home/widgets/user-info/user-info-panel/user-info-panel.component.scss
@@ -1,54 +1,54 @@
-.user-info-panel {
-  bottom: 0px;
-  width: 100%;
-  height: 80px;
-  display: flex;
-  flex-direction: row;
-
-  a {
-    text-decoration: none;
-  }
-}
-
-.panel-content-common {
-  flex: 1;
-  overflow: hidden;
-  height: 85px;
-  position: relative;
-}
-
-.panel-last-with-no-line::after {
-  border-right: none;
-}
-
-.panel-number-common {
-  font-size: 24px;
-  color: #202e54;
-  text-align: left;
-  padding: 26px 30px 8px 15px;
-  line-height: 28px;
-}
-
-@mixin panel-dash-line {
-  content: '';
-  position: absolute;
-  top: 45%;
-  right: 7px;
-  height: 27%;
-  border-right: 1px solid #979797;
-  opacity: 0.2;
-}
-
-.user-info-panel .panel-content-common:not(:last-child)::after {
-  @include panel-dash-line;
-}
-
-.panel-text-common {
-  color: #86909c;
-  font-size: 14px;
-  text-align: left;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  padding-left: 15px;
-}
+.user-info-panel {
+  bottom: 0px;
+  width: 100%;
+  height: 80px;
+  display: flex;
+  flex-direction: row;
+
+  a {
+    text-decoration: none;
+  }
+}
+
+.panel-content-common {
+  flex: 1;
+  overflow: hidden;
+  height: 85px;
+  position: relative;
+}
+
+.panel-last-with-no-line::after {
+  border-right: none;
+}
+
+.panel-number-common {
+  font-size: 24px;
+  color: #202e54;
+  text-align: left;
+  padding: 26px 30px 8px 15px;
+  line-height: 28px;
+}
+
+@mixin panel-dash-line {
+  content: '';
+  position: absolute;
+  top: 45%;
+  right: 7px;
+  height: 27%;
+  border-right: 1px solid #979797;
+  opacity: 0.2;
+}
+
+.user-info-panel .panel-content-common:not(:last-child)::after {
+  @include panel-dash-line;
+}
+
+.panel-text-common {
+  color: #86909c;
+  font-size: 14px;
+  text-align: left;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  padding-left: 15px;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/menu.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/menu.ts
index aa0ae285..f860d2fa 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/menu.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/menu.ts
@@ -3,50 +3,50 @@ export default function (values: any) {
     {
       title: values['consoleHome'],
       router: ['./console-home'],
-      menuIcon: 'home-outline'
+      menuIcon: 'home-outline',
     },
     {
       title: values['serviceOverview'],
       router: ['./service-overview'],
-      menuIcon: 'laptop-outline'
+      menuIcon: 'laptop-outline',
     },
     {
       title: values['servicePurchase'],
       router: ['./service-purchase'],
-      menuIcon: 'gift-outline'
+      menuIcon: 'gift-outline',
     },
     {
       title: values['result']['title'],
       children: [
         {
           title: values['result']['success'],
-          router: ['./result/success']
+          router: ['./result/success'],
         },
         {
           title: values['result']['failure'],
-          router: ['./result/failure']
-        }
+          router: ['./result/failure'],
+        },
       ],
-      menuIcon: 'bag-check-outline'
+      menuIcon: 'bag-check-outline',
     },
     {
       title: values['nonSupportRegion'],
       router: ['./non-support-region'],
-      menuIcon: 'information-circle-outline'
+      menuIcon: 'information-circle-outline',
     },
     {
       title: values['serviceList']['title'],
       children: [
         {
           title: values['serviceList']['buckets'],
-          router: ['./service-list/buckets']
+          router: ['./service-list/buckets'],
         },
         {
           title: values['serviceList']['contracts'],
-          router: ['./service-list/contracts']
-        }
+          router: ['./service-list/contracts'],
+        },
       ],
-      menuIcon: 'cloud-outline'
-    }
+      menuIcon: 'cloud-outline',
+    },
   ];
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-content/non-support-content.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-content/non-support-content.component.scss
index 4a195149..8b224935 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-content/non-support-content.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-content/non-support-content.component.scss
@@ -1,100 +1,100 @@
-@import 'src/app/@shared/styles/common.scss';
-
-.non-support-container {
-  @include t-pro-product-card;
-  height: 800px;
-}
-
-.non-support-content {
-  display: flex;
-  margin: 140px auto 0;
-  line-height: 1.5;
-  justify-content: center;
-}
-
-.non-support-content-container{
-  padding-left: 30%;
-}
-
-.non-supportregion-image {
-  display: inline-block;
-  width: 240px;
-  height: 240px;
-  background: url('/assets/img/background/nonsupportregion.png') no-repeat;
-  background-size: 100%;
-  margin-left: 30px;
-  margin-bottom: 20px;
-}
-
-.non-supportregion-label {
-  color: #252b3a;
-  font-size: 24px;
-  padding-bottom: 8px;
-  font-weight: normal;
-  line-height: 36px;
-  font-family: PingFang SC, PingFang SC-PingFang SC;
-}
-
-.support-regionlist-container {
-  width: 78%;
-  margin-bottom: 40px;
-  line-height: var(--ti-common-line-height-number);
-}
-
-.support-regionlist-label {
-  width: 336px;
-  font-size: 14px;
-  font-family: PingFang SC, PingFang SC-PingFang SC;
-  color: #4e5969;
-  line-height: 20px;
-}
-
-.support-regionlist-regions {
-  display:flex;
-  flex-wrap: wrap;
-}
-
-.support-regionlist-project {
-  width: 150px;
-  background: #e9edfa;
-  border-radius: 2px 0px 0px 2px;
-  margin-bottom: var(--ti-common-space-base);
-  color: #252b3a;
-  text-align: center;
-  line-height: 28px;
-  font-size: 14px;
-  margin-right: 10px;
-  margin-top: 20px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  cursor: pointer;
-  word-break: break-word;
-  &:hover {
-    background: #5e7ce0;
-      color: #ffffff;
-      section:after {
-          border-top-color: var(--ti-common-color-text-link-hover);
-      }
-  }
-}
-
-.support-regionlist-icon {
-  display: inline-block;
-  padding-left: var(--ti-common-space-2x);
-  &:after{
-      content: '';
-      width: 0;
-      height: 0;
-      border-left: 4px solid transparent;
-      border-right: 4px solid transparent;
-      border-top: 5px solid var(--ti-common-color-text-link);
-      cursor: pointer;
-      display: inline-block;
-      vertical-align: middle;
-  }
-}
-
-.support-regionlist-icon-transform:after{
-  transform: rotate(180deg);
-}
+@import 'src/app/@shared/styles/common.scss';
+
+.non-support-container {
+  @include t-pro-product-card;
+  height: 800px;
+}
+
+.non-support-content {
+  display: flex;
+  margin: 140px auto 0;
+  line-height: 1.5;
+  justify-content: center;
+}
+
+.non-support-content-container {
+  padding-left: 30%;
+}
+
+.non-supportregion-image {
+  display: inline-block;
+  width: 240px;
+  height: 240px;
+  background: url('/assets/img/background/nonsupportregion.png') no-repeat;
+  background-size: 100%;
+  margin-left: 30px;
+  margin-bottom: 20px;
+}
+
+.non-supportregion-label {
+  color: #252b3a;
+  font-size: 24px;
+  padding-bottom: 8px;
+  font-weight: normal;
+  line-height: 36px;
+  font-family: PingFang SC, PingFang SC-PingFang SC;
+}
+
+.support-regionlist-container {
+  width: 78%;
+  margin-bottom: 40px;
+  line-height: var(--ti-common-line-height-number);
+}
+
+.support-regionlist-label {
+  width: 336px;
+  font-size: 14px;
+  font-family: PingFang SC, PingFang SC-PingFang SC;
+  color: #4e5969;
+  line-height: 20px;
+}
+
+.support-regionlist-regions {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.support-regionlist-project {
+  width: 150px;
+  background: #e9edfa;
+  border-radius: 2px 0px 0px 2px;
+  margin-bottom: var(--ti-common-space-base);
+  color: #252b3a;
+  text-align: center;
+  line-height: 28px;
+  font-size: 14px;
+  margin-right: 10px;
+  margin-top: 20px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  cursor: pointer;
+  word-break: break-word;
+  &:hover {
+    background: #5e7ce0;
+    color: #ffffff;
+    section:after {
+      border-top-color: var(--ti-common-color-text-link-hover);
+    }
+  }
+}
+
+.support-regionlist-icon {
+  display: inline-block;
+  padding-left: var(--ti-common-space-2x);
+  &:after {
+    content: '';
+    width: 0;
+    height: 0;
+    border-left: 4px solid transparent;
+    border-right: 4px solid transparent;
+    border-top: 5px solid var(--ti-common-color-text-link);
+    cursor: pointer;
+    display: inline-block;
+    vertical-align: middle;
+  }
+}
+
+.support-regionlist-icon-transform:after {
+  transform: rotate(180deg);
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-content/non-support-content.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-content/non-support-content.component.ts
index 9d1bc441..34ba2edd 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-content/non-support-content.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-content/non-support-content.component.ts
@@ -21,10 +21,7 @@ export class NonSupportContentComponent implements OnInit {
       { displayName: `${RegionI18nPrefix}cnSouthwest2` },
     ],
   };
-  constructor(
-    private translate: TranslateService,
-    private tProTrans: TProTranslatePipe
-  ) {}
+  constructor(private translate: TranslateService, private tProTrans: TProTranslatePipe) {}
 
   ngOnInit(): void {
     this.tProTrans.transform(this.regionData.supportRegions);
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-region.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-region.component.scss
index 7f822268..3c38375a 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-region.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/non-support-region/non-support-region.component.scss
@@ -1 +1 @@
-@import 'src/app/@shared/styles/common.scss';
+@import 'src/app/@shared/styles/common.scss';
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/pages.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/pages.component.scss
index 9fb15ba1..f5afbf93 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/pages.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/pages.component.scss
@@ -1,5 +1,3 @@
-
-
 t-pro-layout-header {
   display: flex;
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-failure/payment-failure.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-failure/payment-failure.component.scss
index 7f822268..3c38375a 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-failure/payment-failure.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-failure/payment-failure.component.scss
@@ -1 +1 @@
-@import 'src/app/@shared/styles/common.scss';
+@import 'src/app/@shared/styles/common.scss';
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-failure/payment-failure.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-failure/payment-failure.component.ts
index a3b106e9..1ae91c96 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-failure/payment-failure.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-failure/payment-failure.component.ts
@@ -5,5 +5,4 @@ import { Component } from '@angular/core';
   templateUrl: './payment-failure.component.html',
   styleUrls: ['./payment-failure.component.scss'],
 })
-export class PaymentFailureComponent {
-}
+export class PaymentFailureComponent {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-success/payment-success.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-success/payment-success.component.scss
index 7f822268..3c38375a 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-success/payment-success.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/result/payment-success/payment-success.component.scss
@@ -1 +1 @@
-@import 'src/app/@shared/styles/common.scss';
+@import 'src/app/@shared/styles/common.scss';
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/result/result.module.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/result/result.module.ts
index 51896219..26b0fa20 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/result/result.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/result/result.module.ts
@@ -10,14 +10,7 @@ import { RecommendActivityComponent } from './widget/recommend-activity/recommen
 import { ResultFailureComponent } from './widget/result-failure/result-failure.component';
 
 @NgModule({
-  declarations: [
-    ResultComponent,
-    PaymentSuccessComponent,
-    PaymentFailureComponent,
-    ResultSuccessComponent,
-    RecommendActivityComponent,
-    ResultFailureComponent,
-  ],
+  declarations: [ResultComponent, PaymentSuccessComponent, PaymentFailureComponent, ResultSuccessComponent, RecommendActivityComponent, ResultFailureComponent],
   imports: [SharedModule, TProLayoutModule, CommonModule, ResultRoutingModule],
 })
 export class ResultModule {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/constants.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/constants.ts
index 0311f14d..3ba4ad24 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/constants.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/constants.ts
@@ -1,3 +1,3 @@
-export const ActivityHWCloudUrl = 'https://activity.huaweicloud.com';
-export const HWCloudUrl = 'https://www.huaweicloud.com';
-export const AdvertiseUrlPrefix = 'https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cx-guanggao/';
+export const ActivityHWCloudUrl = 'https://activity.huaweicloud.com';
+export const HWCloudUrl = 'https://www.huaweicloud.com';
+export const AdvertiseUrlPrefix = 'https://res-static.hc-cdn.cn/cloudbu-site/china/zh-cn/cx-guanggao/';
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/recommend-activity/recommend-activity.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/recommend-activity/recommend-activity.component.scss
index 73f70eeb..f1db04ee 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/recommend-activity/recommend-activity.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/recommend-activity/recommend-activity.component.scss
@@ -1,53 +1,52 @@
-@import 'src/app/@shared/styles/common.scss';
-
-.recommend-activity {
-  margin-top: 30px;
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169,174,184,.05);
-  height: 240px;
-  @include t-pro-product-card;
-}
-
-.section-title {
-  position: relative;
-  width: 100%;
-  color: #252b3a;
-  padding-bottom: 30px;
-  font-size: 16px;
-  line-height: 16px;
-  font-family: PingFang SC, PingFang SC-PingFang SC;
-}
-
-
-.smart-recommends-wrapper {
-  display: flex;
-  flex-wrap: wrap;
-  text-align: left;
-  width: 100%;
-  justify-content: space-between;
-}
-
-.smart-recommends-col {
-  box-sizing: border-box;
-  width: 33.3%;
-  padding: 0 8px;
-  min-width: 0;
-  max-width: 600px;
-}
-
-.smart-recommends-card {
-  box-sizing: border-box;
-  display: block;
-  position: relative;
-  height: 100%;
-  padding: 0;
-  font-size: 0;
-  color: #575d6c;
-  text-decoration: none;
-  transition: box-shadow 0.2s;
-}
-
-.smart-recommends-card-img {
-  width: 100%;
-  box-shadow: 0px 1px 4px 0px rgb(0 0 0 / 6%);
-}
+@import 'src/app/@shared/styles/common.scss';
+
+.recommend-activity {
+  margin-top: 30px;
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+  height: 240px;
+  @include t-pro-product-card;
+}
+
+.section-title {
+  position: relative;
+  width: 100%;
+  color: #252b3a;
+  padding-bottom: 30px;
+  font-size: 16px;
+  line-height: 16px;
+  font-family: PingFang SC, PingFang SC-PingFang SC;
+}
+
+.smart-recommends-wrapper {
+  display: flex;
+  flex-wrap: wrap;
+  text-align: left;
+  width: 100%;
+  justify-content: space-between;
+}
+
+.smart-recommends-col {
+  box-sizing: border-box;
+  width: 33.3%;
+  padding: 0 8px;
+  min-width: 0;
+  max-width: 600px;
+}
+
+.smart-recommends-card {
+  box-sizing: border-box;
+  display: block;
+  position: relative;
+  height: 100%;
+  padding: 0;
+  font-size: 0;
+  color: #575d6c;
+  text-decoration: none;
+  transition: box-shadow 0.2s;
+}
+
+.smart-recommends-card-img {
+  width: 100%;
+  box-shadow: 0px 1px 4px 0px rgb(0 0 0 / 6%);
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/result-failure/result-failure.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/result-failure/result-failure.component.scss
index b104e1c7..5cad861e 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/result-failure/result-failure.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/result-failure/result-failure.component.scss
@@ -1,57 +1,57 @@
-@import "src/app/@shared/styles/common.scss";
-
-.result-failure {
-  @include t-pro-product-card;
-  text-align: center;
-  height: 620px;
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
-}
-
-.pay-failure-icon-container {
-  .pay-failure-icon-bg {
-    margin: 150px auto 0;
-    width: 84px;
-    height: 84px;
-    background: #ffd5d4;
-    border-radius: 50%;
-    .pay-failure-icon {
-      font-size: 84px;
-      color: #f66f6a;
-      display: inline-block;
-    }
-  }
-}
-
-.pay-failure-text-container {
-  margin-bottom: 20px;
-  .pay-failure-text {
-    font-size: 24px;
-    margin-top: 30px;
-    line-height: 36px;
-  }
-}
-
-.tip {
-  font-size: 14px;
-  margin: 25px 0;
-}
-
-.tip-price {
-  color: #de504e;
-}
-
-.re-payments {
-  margin-right: 8px;
-}
-
-.view-order {
-  margin-top: 16px;
-}
-
-.pay-failure-button {
-  width: 124px;
-  height: 36px;
-  border-radius: 4px;
-  margin-top: 10px;
-}
+@import 'src/app/@shared/styles/common.scss';
+
+.result-failure {
+  @include t-pro-product-card;
+  text-align: center;
+  height: 620px;
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+}
+
+.pay-failure-icon-container {
+  .pay-failure-icon-bg {
+    margin: 150px auto 0;
+    width: 84px;
+    height: 84px;
+    background: #ffd5d4;
+    border-radius: 50%;
+    .pay-failure-icon {
+      font-size: 84px;
+      color: #f66f6a;
+      display: inline-block;
+    }
+  }
+}
+
+.pay-failure-text-container {
+  margin-bottom: 20px;
+  .pay-failure-text {
+    font-size: 24px;
+    margin-top: 30px;
+    line-height: 36px;
+  }
+}
+
+.tip {
+  font-size: 14px;
+  margin: 25px 0;
+}
+
+.tip-price {
+  color: #de504e;
+}
+
+.re-payments {
+  margin-right: 8px;
+}
+
+.view-order {
+  margin-top: 16px;
+}
+
+.pay-failure-button {
+  width: 124px;
+  height: 36px;
+  border-radius: 4px;
+  margin-top: 10px;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/result-success/result-success.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/result-success/result-success.component.scss
index 5bd6ddef..9938b85f 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/result-success/result-success.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/result/widget/result-success/result-success.component.scss
@@ -1,49 +1,49 @@
-@import "src/app/@shared/styles/common.scss";
-
-.result-success {
-  @include t-pro-product-card;
-  text-align: center;
-  height: 620px;
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
-}
-
-.pay-succeed-icon-container {
-  position: relative;
-  .pay-succeed-icon-bg {
-    margin: 150px auto 0;
-    width: 84px;
-    height: 84px;
-    background: #cffcee;
-    border-radius: 50%;
-    .pay-succeed-icon {
-      font-size: 84px;
-      color: #50d4ab;
-      display: inline-block;
-    }
-  }
-}
-
-.pay-succeed-text-container {
-  margin-bottom: 20px;
-  .pay-succeed-text {
-    font-size: 24px;
-    margin-top: 30px;
-    line-height: 36px;
-  }
-
-  .pay-succeed-detail {
-    font-size: 14px;
-    margin: 25px 0;
-  }
-  .amount-money {
-    color: #de504e;
-  }
-}
-
-.pay-succeed-button {
-  width: 124px;
-  height: 36px;
-  border-radius: 4px;
-  margin-top: 10px;
-}
+@import 'src/app/@shared/styles/common.scss';
+
+.result-success {
+  @include t-pro-product-card;
+  text-align: center;
+  height: 620px;
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+}
+
+.pay-succeed-icon-container {
+  position: relative;
+  .pay-succeed-icon-bg {
+    margin: 150px auto 0;
+    width: 84px;
+    height: 84px;
+    background: #cffcee;
+    border-radius: 50%;
+    .pay-succeed-icon {
+      font-size: 84px;
+      color: #50d4ab;
+      display: inline-block;
+    }
+  }
+}
+
+.pay-succeed-text-container {
+  margin-bottom: 20px;
+  .pay-succeed-text {
+    font-size: 24px;
+    margin-top: 30px;
+    line-height: 36px;
+  }
+
+  .pay-succeed-detail {
+    font-size: 14px;
+    margin: 25px 0;
+  }
+  .amount-money {
+    color: #de504e;
+  }
+}
+
+.pay-succeed-button {
+  width: 124px;
+  height: 36px;
+  border-radius: 4px;
+  margin-top: 10px;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/bucket-list/bucket-list.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/bucket-list/bucket-list.component.scss
index cbebc50f..bec4ccde 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/bucket-list/bucket-list.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/bucket-list/bucket-list.component.scss
@@ -1,19 +1,19 @@
-@import 'src/app/@shared/styles/common.scss';
-
-.service-list {
-  @include t-pro-product-card;
-}
-
-.obs-list {
-  @include t-pro-product-card;
-  margin-bottom: 24px;
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169,174,184,.05); 
-  height: 720px;
-}
-
-.alert-head {
-  margin-top: 20px;
-  width: 100%;
-  display: block;
-}
+@import 'src/app/@shared/styles/common.scss';
+
+.service-list {
+  @include t-pro-product-card;
+}
+
+.obs-list {
+  @include t-pro-product-card;
+  margin-bottom: 24px;
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+  height: 720px;
+}
+
+.alert-head {
+  margin-top: 20px;
+  width: 100%;
+  display: block;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/bucket-list/bucket-list.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/bucket-list/bucket-list.component.ts
index 3e0f7b31..32ec185f 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/bucket-list/bucket-list.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/bucket-list/bucket-list.component.ts
@@ -6,48 +6,48 @@ import { BucketListHeadI18nPrefix } from '@shared/tiny-pro';
 @Component({
   selector: 't-pro-bucket-list',
   templateUrl: './bucket-list.component.html',
-  styleUrls: ['./bucket-list.component.scss']
+  styleUrls: ['./bucket-list.component.scss'],
 })
 export class BucketListComponent {
   public bucketConfig: GuideheadConfig = {
     helptip: {
       label: '',
-      iconTip: ''
+      iconTip: '',
     },
     buttons: [
       {
         id: '1',
         label: this.translate.instant(`${BucketListHeadI18nPrefix}creatBucket`),
-        color: 'danger'
+        color: 'danger',
       },
       {
         id: '2',
-        label: this.translate.instant(`${BucketListHeadI18nPrefix}buyPackages`)
-      }
-    ]
+        label: this.translate.instant(`${BucketListHeadI18nPrefix}buyPackages`),
+      },
+    ],
   };
 
   public feedbackList: Array<any> = [
     {
       icon: 'information-circle-outline',
-      label: `${BucketListHeadI18nPrefix}openSourceNotice`
+      label: `${BucketListHeadI18nPrefix}openSourceNotice`,
     },
     {
       icon: 'happy-outline',
-      label: `${BucketListHeadI18nPrefix}evaluate`
+      label: `${BucketListHeadI18nPrefix}evaluate`,
     },
     {
       icon: 'paper-plane-outline',
-      label: `${BucketListHeadI18nPrefix}processFlow`
+      label: `${BucketListHeadI18nPrefix}processFlow`,
     },
     {
       icon: 'book-outline',
-      label: `${BucketListHeadI18nPrefix}help`
+      label: `${BucketListHeadI18nPrefix}help`,
     },
     {
       icon: 'list-outline',
-      label: `${BucketListHeadI18nPrefix}taskManage`
-    }
+      label: `${BucketListHeadI18nPrefix}taskManage`,
+    },
   ];
 
   public flag: string = 'buckets';
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/contracts/contracts.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/contracts/contracts.component.scss
index e63d0f31..1e4ec2ec 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/contracts/contracts.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/contracts/contracts.component.scss
@@ -1,29 +1,29 @@
-@import "src/app/@shared/styles/common.scss";
-
-.service-list {
-  @include t-pro-product-card;
-}
-
-.contracts {
-  @include t-pro-product-card;
-  margin-bottom: 24px;
-  border-radius: 8px;
-  box-shadow: 0px 0px 8px 8px rgba(169,174,184,.05); 
-  height: 780px;
-}
-
-::ng-deep .ti3-modal-content{
-  width: 589px;
-  border-radius: 8px !important;
-  box-shadow: 0px 0px 30px 15px rgba(37,43,58,.15) !important; 
-}
-
-.alert {
-  position: fixed;
-  display: block;
-  z-index: 1400;
-  width: 400px;
-  height: auto;
-  left: 40%;
-  top: 70px;
-}
+@import 'src/app/@shared/styles/common.scss';
+
+.service-list {
+  @include t-pro-product-card;
+}
+
+.contracts {
+  @include t-pro-product-card;
+  margin-bottom: 24px;
+  border-radius: 8px;
+  box-shadow: 0px 0px 8px 8px rgba(169, 174, 184, 0.05);
+  height: 780px;
+}
+
+::ng-deep .ti3-modal-content {
+  width: 589px;
+  border-radius: 8px !important;
+  box-shadow: 0px 0px 30px 15px rgba(37, 43, 58, 0.15) !important;
+}
+
+.alert {
+  position: fixed;
+  display: block;
+  z-index: 1400;
+  width: 400px;
+  height: auto;
+  left: 40%;
+  top: 70px;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/contracts/contracts.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/contracts/contracts.component.ts
index 0342bea9..6a512848 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/contracts/contracts.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/contracts/contracts.component.ts
@@ -27,7 +27,7 @@ export class ContractsComponent {
         label: this.translate.instant(`${ContractsListHeadI18nPrefix}createContract`),
         color: 'danger',
         click: (): void => {
-          this.showModal(this.modal)
+          this.showModal(this.modal);
           this.operation = 'create';
           this.isRefreshTable = false;
         },
@@ -47,20 +47,17 @@ export class ContractsComponent {
   public rowData: any;
   public showModal(content: TemplateRef<any>): void {
     this.tiModal.open(content, {
-      id: 'modal'
+      id: 'modal',
     });
   }
-  
-  constructor(
-    private translate: TranslateService, 
-    private tiModal: TiModalService
-  ) {}
+
+  constructor(private translate: TranslateService, private tiModal: TiModalService) {}
 
   public openHalfModal($event: any): void {
     this.rowData = $event;
     this.operation = 'edit';
     this.isRefreshTable = false;
-    this.showModal(this.modal)
+    this.showModal(this.modal);
   }
 
   public openAlert(): void {
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/service-list.module.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/service-list.module.ts
index 6ea9c3ee..b95a5bb4 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/service-list.module.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/service-list.module.ts
@@ -26,5 +26,5 @@ import { ContractsComponent } from './contracts/contracts.component';
   ],
   imports: [CommonModule, SharedModule, ServiceListRoutingModule],
 })
-export class ServiceListModule { }
+export class ServiceListModule {}
 export { GuideheadConfig } from './widgets/list-guide-head/list-guide-head.component';
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/bucket-info/bucket-info.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/bucket-info/bucket-info.component.scss
index e4adc374..9372d35b 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/bucket-info/bucket-info.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/bucket-info/bucket-info.component.scss
@@ -1,26 +1,26 @@
-.basic-info-title {
-  color: var(--ti-common-color-text-primary);
-  font-size: var(--ti-common-font-size-1);
-}
-
-.basic-info-content {
-  padding: var(--ti-common-space-4x) var(--ti-common-space-5x) var(--ti-common-space-4x) 0;
-}
-
-::ng-deep .ti3-form-label{
-  font-size: 14px !important;
-  text-align: end !important;
-  width: 70px !important;
-  color: #8a8e99 !important;
-  padding-bottom: 10px !important;
-}
-
-::ng-deep .ti3-form-content{
-  font-size: 14px;
-  padding-bottom: 10px !important;
-  padding-left: 10px !important;
-}
-
-::ng-deep .ti3-form-label .ti3-text-form-label .ng-star-inserted{
-  width: 100px;
-}
\ No newline at end of file
+.basic-info-title {
+  color: var(--ti-common-color-text-primary);
+  font-size: var(--ti-common-font-size-1);
+}
+
+.basic-info-content {
+  padding: var(--ti-common-space-4x) var(--ti-common-space-5x) var(--ti-common-space-4x) 0;
+}
+
+::ng-deep .ti3-form-label {
+  font-size: 14px !important;
+  text-align: end !important;
+  width: 70px !important;
+  color: #8a8e99 !important;
+  padding-bottom: 10px !important;
+}
+
+::ng-deep .ti3-form-content {
+  font-size: 14px;
+  padding-bottom: 10px !important;
+  padding-left: 10px !important;
+}
+
+::ng-deep .ti3-form-label .ti3-text-form-label .ng-star-inserted {
+  width: 100px;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/bucket-info/bucket-info.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/bucket-info/bucket-info.component.ts
index 1f02bbdb..221df370 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/bucket-info/bucket-info.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/bucket-info/bucket-info.component.ts
@@ -12,5 +12,5 @@ export class BucketInfoComponent {
   };
 
   public obsStorageClass: any = ObsStorageClass;
-  public none: string = '--'
+  public none: string = '--';
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-modal/contracts-modal.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-modal/contracts-modal.component.scss
index b9b75bff..c7d4eda6 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-modal/contracts-modal.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-modal/contracts-modal.component.scss
@@ -1,52 +1,52 @@
-.input {
-  width: 360px;
-  height: 36px !important;
-  font-size: 14px !important;
-  margin-bottom: 15px;
-}
-
-.main-content {
-  margin-left: 20px;
-}
-
-.ti3-form-label {
-  font-size: 14px !important;
-  padding-right: 40px !important;
-}
-.ti3-form-content{
-  margin-left: 30px;
-}
-.name-format {
-  width: 360px;
-  color: #a9aeb8;
-  font-size: var(--ti-common-font-size-base);
-}
-
-.description {
-  width: 360px;
-  height: 100px;
-}
-
-.ti3-textarea-container>textarea{
-  font-size: 14px !important;
-}
-
-.modal-footer {
-  height: 120px;
-}
-
-.bottom-buttons {
-  button {
-    width: 100px;
-    height: 36px;
-    border-radius: 4px;
-    font-size: 14px;
-  }
-  position: absolute;
-  bottom: 60px;
-  left: 148px;
-}
-
-.confirm-button {
-  margin-right: 10px;
-}
+.input {
+  width: 360px;
+  height: 36px !important;
+  font-size: 14px !important;
+  margin-bottom: 15px;
+}
+
+.main-content {
+  margin-left: 20px;
+}
+
+.ti3-form-label {
+  font-size: 14px !important;
+  padding-right: 40px !important;
+}
+.ti3-form-content {
+  margin-left: 30px;
+}
+.name-format {
+  width: 360px;
+  color: #a9aeb8;
+  font-size: var(--ti-common-font-size-base);
+}
+
+.description {
+  width: 360px;
+  height: 100px;
+}
+
+.ti3-textarea-container > textarea {
+  font-size: 14px !important;
+}
+
+.modal-footer {
+  height: 120px;
+}
+
+.bottom-buttons {
+  button {
+    width: 100px;
+    height: 36px;
+    border-radius: 4px;
+    font-size: 14px;
+  }
+  position: absolute;
+  bottom: 60px;
+  left: 148px;
+}
+
+.confirm-button {
+  margin-right: 10px;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-table/contracts-table.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-table/contracts-table.component.scss
index 7a6642c3..60e50456 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-table/contracts-table.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-table/contracts-table.component.scss
@@ -1,75 +1,75 @@
-.list-content {
-  padding: 20px 9px 0 0;
-  background-color: var(--ti-common-color-bg-white-normal);
-}
-
-.current-modal-container {
-  display: flex;
-  font-size: 14px;
-  input {
-    width: 360px;
-    height: 36px !important;
-    margin-bottom: 10px;
-  }
-  label {
-    color: red;
-  }
-  button {
-    width: 100px;
-    height: 34px;
-    border-radius: 4px;
-    margin-right: 28px;
-    margin-top: 10px;
-  }
-}
-
-.delete-warning-icon {
-  font-size: 35px;
-  color: #faad14;
-  margin: -1px 40px 0px 22px;
-}
-
-.delete-warning {
-  font-size: 24px;
-  color: #202e54;
-}
-
-.constract-name{
-  font-size: 16px;
-  color: #4e5969;
-  margin: 20px 0;
-}
-
-.input-prompt{
-  margin: 10px 0;
-  color: #4e5969;;
-}
-
-.input-alert{
-  height: 20px;
-  color: red;
-  margin-bottom: 10px;
-  span {
-    margin-left: 10px;
-  }
-  ti-icon {
-    font-size: 20px;
-    vertical-align: middle;
-  }
-}
-
-.loadPosition {
-  height: 430px;
-  margin-left: 36%;
-  margin-top: 10%;
-  text-align: center;
-  position: absolute;
-}
-
-.delete-modal-class {
-  .ti3-modal-content {
-    width: 558px;
-    border-radius: 8px !important;
-    box-shadow: 0px 0px 30px 15px rgba(37, 43, 58, 0.15) !important;
-  }
-}
+.list-content {
+  padding: 20px 9px 0 0;
+  background-color: var(--ti-common-color-bg-white-normal);
+}
+
+.current-modal-container {
+  display: flex;
+  font-size: 14px;
+  input {
+    width: 360px;
+    height: 36px !important;
+    margin-bottom: 10px;
+  }
+  label {
+    color: red;
+  }
+  button {
+    width: 100px;
+    height: 34px;
+    border-radius: 4px;
+    margin-right: 28px;
+    margin-top: 10px;
+  }
+}
+
+.delete-warning-icon {
+  font-size: 35px;
+  color: #faad14;
+  margin: -1px 40px 0px 22px;
+}
+
+.delete-warning {
+  font-size: 24px;
+  color: #202e54;
+}
+
+.constract-name {
+  font-size: 16px;
+  color: #4e5969;
+  margin: 20px 0;
+}
+
+.input-prompt {
+  margin: 10px 0;
+  color: #4e5969;
+}
+
+.input-alert {
+  height: 20px;
+  color: red;
+  margin-bottom: 10px;
+  span {
+    margin-left: 10px;
+  }
+  ti-icon {
+    font-size: 20px;
+    vertical-align: middle;
+  }
+}
+
+.loadPosition {
+  height: 430px;
+  margin-left: 36%;
+  margin-top: 10%;
+  text-align: center;
+  position: absolute;
+}
+
+.delete-modal-class {
+  .ti3-modal-content {
+    width: 558px;
+    border-radius: 8px !important;
+    box-shadow: 0px 0px 30px 15px rgba(37, 43, 58, 0.15) !important;
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-table/contracts-table.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-table/contracts-table.component.ts
index f85b6876..fbc336ff 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-table/contracts-table.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/contracts-table/contracts-table.component.ts
@@ -86,10 +86,7 @@ export class ContractsTableComponent implements OnInit {
     return function (pre: { [x: string]: any }, next: { [x: string]: any }) {
       const valuePre = pre[property];
       const valueNext = next[property];
-      return (
-        new Date(JSON.parse(JSON.stringify(valueNext))).getTime() -
-        new Date(JSON.parse(JSON.stringify(valuePre))).getTime()
-      );
+      return new Date(JSON.parse(JSON.stringify(valueNext))).getTime() - new Date(JSON.parse(JSON.stringify(valuePre))).getTime();
     };
   }
 
@@ -108,7 +105,7 @@ export class ContractsTableComponent implements OnInit {
     this.totalNumber = data?.count ?? 0;
     this.loading = false;
   }
-  
+
   async onUpdateSrcDate(params: { query: string; field: string }) {
     let interfaceData = await this.contractsService.getContractsData(params);
     let sortData = interfaceData.sort(this.sortTime('updatedAt') as any);
@@ -194,9 +191,9 @@ export class ContractsTableComponent implements OnInit {
           } else {
             modalRef.destroy(reason);
           }
-      },
+        },
         close: (modalRef: TiModalRef): void => {},
-        
+
         dismiss: (modalRef: TiModalRef): void => {},
       });
     }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-file-drop/obs-file-drop.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-file-drop/obs-file-drop.component.scss
index 56fa5116..2029c532 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-file-drop/obs-file-drop.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-file-drop/obs-file-drop.component.scss
@@ -1,30 +1,30 @@
-.basic-info-title {
-  color: var(--ti-common-color-text-primary);
-  font-size: var(--ti-common-font-size-1);
-}
-
-.common-color-number {
-  color: var(--ti-common-color-error-text);
-  margin: var(--ti-common-space-6) 0;
-  font-size: 14px;
-}
-
-.basic-info-content {
-  padding: var(--ti-common-space-2x) var(--ti-common-space-5x) var(--ti-common-space-4x) 0;
-}
-
-::ng-deep .ti3-picture-card-item-not-img {
-  display: none;
-}
-
-.upload {
-  margin-top: 10px;
-}
-
-.upload-alert {
-  height: 20px;
-  font-size: 14px;
-  color: #adb0b8;
-  margin-top: 20px;
-  margin-bottom: 30px;
-}
+.basic-info-title {
+  color: var(--ti-common-color-text-primary);
+  font-size: var(--ti-common-font-size-1);
+}
+
+.common-color-number {
+  color: var(--ti-common-color-error-text);
+  margin: var(--ti-common-space-6) 0;
+  font-size: 14px;
+}
+
+.basic-info-content {
+  padding: var(--ti-common-space-2x) var(--ti-common-space-5x) var(--ti-common-space-4x) 0;
+}
+
+::ng-deep .ti3-picture-card-item-not-img {
+  display: none;
+}
+
+.upload {
+  margin-top: 10px;
+}
+
+.upload-alert {
+  height: 20px;
+  font-size: 14px;
+  color: #adb0b8;
+  margin-top: 20px;
+  margin-bottom: 30px;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-table/obs-table.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-table/obs-table.component.scss
index d8aa691d..1e7dbd16 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-table/obs-table.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-table/obs-table.component.scss
@@ -1,28 +1,28 @@
-.list-content {
-  padding: 20px 9px 0 0;
-  background-color: var(--ti-common-color-bg-white-normal);
-}
-
-.obs-common-mr8 {
-  color: #5e7ce0;
-  margin-right: 15px;
-}
-
-.icon-list {
-  font-size: 16px;
-  font-family: var(--ti-default-font-family);
-}
-
-.obs-halfmodal {
-  top: 60px !important;
-}
-
-.obs-pagination {
-  margin-top: 10px;
-}
-
-::ng-deep .ti3-modal-content {
-  width: 589px;
-  border-radius: 8px !important;
-  box-shadow: 0px 0px 30px 15px rgba(37, 43, 58, 0.15) !important;
-}
+.list-content {
+  padding: 20px 9px 0 0;
+  background-color: var(--ti-common-color-bg-white-normal);
+}
+
+.obs-common-mr8 {
+  color: #5e7ce0;
+  margin-right: 15px;
+}
+
+.icon-list {
+  font-size: 16px;
+  font-family: var(--ti-default-font-family);
+}
+
+.obs-halfmodal {
+  top: 60px !important;
+}
+
+.obs-pagination {
+  margin-top: 10px;
+}
+
+::ng-deep .ti3-modal-content {
+  width: 589px;
+  border-radius: 8px !important;
+  box-shadow: 0px 0px 30px 15px rgba(37, 43, 58, 0.15) !important;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-table/obs-table.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-table/obs-table.component.ts
index ab37a55c..ecc12ffb 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-table/obs-table.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-detail-content/obs-table/obs-table.component.ts
@@ -1,19 +1,7 @@
 import { Component, OnInit, ViewChild, TemplateRef } from '@angular/core';
 import { TranslateService } from '@ngx-translate/core';
-import {
-  TiActionmenuItem,
-  TiTableColumns,
-  TiTableRowData,
-  TiTableSrcData,
-  TiHalfmodalComponent,
-  TiModalService
-} from '@opentiny/ng';
-import {
-  BucketDetailTableI18nPrefix,
-  TProTranslatePipe,
-  Bucket,
-  ObsStorageClass,
-} from '@shared/tiny-pro';
+import { TiActionmenuItem, TiTableColumns, TiTableRowData, TiTableSrcData, TiHalfmodalComponent, TiModalService } from '@opentiny/ng';
+import { BucketDetailTableI18nPrefix, TProTranslatePipe, Bucket, ObsStorageClass } from '@shared/tiny-pro';
 import { ObsService } from 'src/app/@core/services/obs.service';
 import { LogicUtilService } from 'src/app/@core/services/util.service';
 
@@ -41,7 +29,7 @@ export class ObsTableComponent implements OnInit {
       tip: `${BucketDetailTableI18nPrefix}imageProcessing`,
     },
   ];
-  public none : string = '--'
+  public none: string = '--';
   public currentPage: number = 1;
   public totalNumber: number = 0;
   public pageSize: { options: Array<number>; size: number } = {
@@ -95,12 +83,7 @@ export class ObsTableComponent implements OnInit {
 
   public obsStorageClass: any = ObsStorageClass;
 
-  constructor(
-    private translate: TranslateService,
-    private tProTrans: TProTranslatePipe,
-    private obsService: ObsService,
-    private tiModal: TiModalService
-  ) {}
+  constructor(private translate: TranslateService, private tProTrans: TProTranslatePipe, private obsService: ObsService, private tiModal: TiModalService) {}
 
   ngOnInit(): void {
     this.columns = this.tProTrans.transform(this.columns);
@@ -119,14 +102,10 @@ export class ObsTableComponent implements OnInit {
     this.srcData.data = this.obsService.getObsTableData();
   }
 
-  public dataToItemsFn: (data: any) => Array<TiActionmenuItem> = (
-    data: any
-  ) => {
+  public dataToItemsFn: (data: any) => Array<TiActionmenuItem> = (data: any) => {
     const items: Array<TiActionmenuItem> = [
       {
-        label: this.translate.instant(
-          `${BucketDetailTableI18nPrefix}createStorage`
-        ),
+        label: this.translate.instant(`${BucketDetailTableI18nPrefix}createStorage`),
       },
       {
         label: this.translate.instant(`${BucketDetailTableI18nPrefix}delete`),
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-guide-head/list-guide-head.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-guide-head/list-guide-head.component.scss
index 7efc1778..324eadd3 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-guide-head/list-guide-head.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-guide-head/list-guide-head.component.scss
@@ -1,104 +1,104 @@
-.guide-head {
-  justify-content: flex-end;
-  display: flex;
-  align-items: center;
-  border-right: 1px solid #DFE1E6;
-  margin-right: 20px;
-  div {
-    padding-right: 20px;
-  }
-}
-.contracts-guide-head{
-  justify-content: space-between;
-}
-
-.contracts-select{
-  margin-right: 20px;
-}
-
-.list-guide-head-container{
-  display: flex
-}
-
-.guide-head-content{
-  flex: 1; 
-  align-self: center
-}
-
-.guide-head-button {
-  margin-right:10px;
-  border-radius: 4px;
-}
-
-.guide-head-expand {
-  align-items: center;
-}
-
-.common-link {
-  margin-left: var(--ti-common-space-5x);
-  font-weight: 700;
-}
-
-.alert-head {
-  margin-top: 10px;
-  width: 100%;
-  display: block;
-}
-
-.feedback-container {
-  cursor: pointer;
-  :hover {
-    color: var(--ti-common-color-text-highlight);
-  }
-}
-
-.mr5 {
-  margin-right: 5px;
-  font-size: 16px;
-  vertical-align: middle;
-}
-
-.link {
-  color: #7693f5;
-  text-decoration: none;
-  cursor: pointer;
-}
-
-.link:hover {
-  color: #96adfa;
-  text-decoration: underline;
-}
-
-.guide-head-container {
-  display: flex;
-  align-items: center;
-  min-height: 32px;
-
-  .guide-head-right {
-    display: flex;
-    flex-grow: 1;
-    flex-direction: column;
-  }
-
-  .guide-head-helptip-label {
-    line-height: 1.5;
-    display: inline-block;
-    font-size: 16px;
-    font-weight: 700;
-  }
-
-  .guide-head-helptip-icon {
-    font-size: 18px;
-    color: #575d6c;
-    margin-left: 6px;
-    margin-top: 3px;
-    cursor: help;
-    &:hover {
-      color: #5e7ce0;
-    }
-  }
-
-  .guide-head-button-left-space {
-    margin-left: 8px;
-  }
-}
+.guide-head {
+  justify-content: flex-end;
+  display: flex;
+  align-items: center;
+  border-right: 1px solid #dfe1e6;
+  margin-right: 20px;
+  div {
+    padding-right: 20px;
+  }
+}
+.contracts-guide-head {
+  justify-content: space-between;
+}
+
+.contracts-select {
+  margin-right: 20px;
+}
+
+.list-guide-head-container {
+  display: flex;
+}
+
+.guide-head-content {
+  flex: 1;
+  align-self: center;
+}
+
+.guide-head-button {
+  margin-right: 10px;
+  border-radius: 4px;
+}
+
+.guide-head-expand {
+  align-items: center;
+}
+
+.common-link {
+  margin-left: var(--ti-common-space-5x);
+  font-weight: 700;
+}
+
+.alert-head {
+  margin-top: 10px;
+  width: 100%;
+  display: block;
+}
+
+.feedback-container {
+  cursor: pointer;
+  :hover {
+    color: var(--ti-common-color-text-highlight);
+  }
+}
+
+.mr5 {
+  margin-right: 5px;
+  font-size: 16px;
+  vertical-align: middle;
+}
+
+.link {
+  color: #7693f5;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.link:hover {
+  color: #96adfa;
+  text-decoration: underline;
+}
+
+.guide-head-container {
+  display: flex;
+  align-items: center;
+  min-height: 32px;
+
+  .guide-head-right {
+    display: flex;
+    flex-grow: 1;
+    flex-direction: column;
+  }
+
+  .guide-head-helptip-label {
+    line-height: 1.5;
+    display: inline-block;
+    font-size: 16px;
+    font-weight: 700;
+  }
+
+  .guide-head-helptip-icon {
+    font-size: 18px;
+    color: #575d6c;
+    margin-left: 6px;
+    margin-top: 3px;
+    cursor: help;
+    &:hover {
+      color: #5e7ce0;
+    }
+  }
+
+  .guide-head-button-left-space {
+    margin-left: 8px;
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-guide-head/list-guide-head.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-guide-head/list-guide-head.component.ts
index e91895cc..8f65fbaf 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-guide-head/list-guide-head.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/list-guide-head/list-guide-head.component.ts
@@ -1,15 +1,5 @@
-import {
-  Component,
-  Input,
-  OnInit,
-  TemplateRef,
-  ViewChild,
-  Output,
-} from '@angular/core';
-import {
-  ContractsDetailTableI18nPrefix,
-  TProTranslatePipe,
-} from '@shared/tiny-pro';
+import { Component, Input, OnInit, TemplateRef, ViewChild, Output } from '@angular/core';
+import { ContractsDetailTableI18nPrefix, TProTranslatePipe } from '@shared/tiny-pro';
 import { TiPositionType } from '@opentiny/ng';
 import { TranslateService } from '@ngx-translate/core';
 import { Filter } from '../service-list-filter';
@@ -56,15 +46,9 @@ export class ListGuideHeadComponent implements OnInit {
     },
   ];
 
-  public placeholder: string = this.translate.instant(
-    'serviceList.contracts.modal.namePlaceholder'
-  );
+  public placeholder: string = this.translate.instant('serviceList.contracts.modal.namePlaceholder');
 
-  constructor(
-    private filter: Filter,
-    private tProTrans: TProTranslatePipe,
-    private translate: TranslateService
-  ) {}
+  constructor(private filter: Filter, private tProTrans: TProTranslatePipe, private translate: TranslateService) {}
 
   ngOnInit(): void {
     this.tableOptions = this.tProTrans.transform(this.tableOptions);
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/service-list-filter.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/service-list-filter.ts
index a1aa2066..2c36b990 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/service-list-filter.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-list/widgets/service-list-filter.ts
@@ -1,11 +1,11 @@
 import { EventEmitter, Injectable } from '@angular/core';
 import { Subject } from 'rxjs';
- 
+
 export class filterInterface {
   type: '' | undefined;
   value: '' | undefined;
 }
- 
+
 @Injectable({
   providedIn: 'root',
 })
@@ -13,4 +13,4 @@ export class Filter {
   defaultFilter: filterInterface = { type: '', value: '' };
   FilterEventer: EventEmitter<filterInterface> = new EventEmitter();
   constructor() {}
-}
\ No newline at end of file
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/service-overview.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/service-overview.component.scss
index 7f822268..3c38375a 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/service-overview.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/service-overview.component.scss
@@ -1 +1 @@
-@import 'src/app/@shared/styles/common.scss';
+@import 'src/app/@shared/styles/common.scss';
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/service-overview.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/service-overview.component.ts
index 90d9d1d5..53ca3303 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/service-overview.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/service-overview.component.ts
@@ -5,5 +5,4 @@ import { Component } from '@angular/core';
   templateUrl: './service-overview.component.html',
   styleUrls: ['./service-overview.component.scss'],
 })
-export class ServiceOverviewComponent {
-}
+export class ServiceOverviewComponent {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/growth-map/growth-map.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/growth-map/growth-map.component.scss
index c7766c62..dbabe776 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/growth-map/growth-map.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/growth-map/growth-map.component.scss
@@ -1,77 +1,77 @@
-@import 'src/app/@shared/styles/common.scss';
-.growth-map {
-  min-height: 600px;
-  @include t-pro-product-card;
-}
-
-::ng-deep .ti3-tab-li {
-  // 覆盖组件行内样式
-  margin: 0 27px 0 0 !important;
-}
-
-.box-title {
-  color: #252b3a;
-  font-size: 16px;
-  font-weight: 500;
-  line-height: 16px;
-  text-align: left;
-}
-
-.mb12 {
-  margin-bottom: 26px;
-}
-
-.tab-desc {
-  margin-top: 8px;
-  font-size: 14px;
-  color: #8a8e99;
-  line-height: 24px;
-}
-
-.mt16 {
-  margin: 20px 0 116px;
-}
-
-.mt12 {
-  margin-top: 11px;
-}
-
-.overview_label_text {
-  font-size: 14px;
-  font-weight: 500;
-  color: #202e54;
-  line-height: 24px;
-}
-
-.overview_label_text:nth-child(n+2) {
-  margin-top: 10px;
-}
-
-.link-flex-box {
-  font-size: 14px;
-  display: flex;
-  justify-content: flex-start;
-  align-items: center;
-  
-  .round-box {
-    width: 4px;
-    height: 4px;
-    border-radius: 50%;
-    display: inline-block;
-    margin-right: 6px;
-    background-color: #252b3a;
-  }
-
-  > a {
-    color: #252b3a;
-  }
-
-  &:hover {
-    .round-box {
-      background-color: #5e7ce0;
-    }
-    > a {
-      color: #5e7ce0;
-    }
-  }
-}
+@import 'src/app/@shared/styles/common.scss';
+.growth-map {
+  min-height: 600px;
+  @include t-pro-product-card;
+}
+
+::ng-deep .ti3-tab-li {
+  // 覆盖组件行内样式
+  margin: 0 27px 0 0 !important;
+}
+
+.box-title {
+  color: #252b3a;
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 16px;
+  text-align: left;
+}
+
+.mb12 {
+  margin-bottom: 26px;
+}
+
+.tab-desc {
+  margin-top: 8px;
+  font-size: 14px;
+  color: #8a8e99;
+  line-height: 24px;
+}
+
+.mt16 {
+  margin: 20px 0 116px;
+}
+
+.mt12 {
+  margin-top: 11px;
+}
+
+.overview_label_text {
+  font-size: 14px;
+  font-weight: 500;
+  color: #202e54;
+  line-height: 24px;
+}
+
+.overview_label_text:nth-child(n + 2) {
+  margin-top: 10px;
+}
+
+.link-flex-box {
+  font-size: 14px;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+
+  .round-box {
+    width: 4px;
+    height: 4px;
+    border-radius: 50%;
+    display: inline-block;
+    margin-right: 6px;
+    background-color: #252b3a;
+  }
+
+  > a {
+    color: #252b3a;
+  }
+
+  &:hover {
+    .round-box {
+      background-color: #5e7ce0;
+    }
+    > a {
+      color: #5e7ce0;
+    }
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/service-creation/service-creation.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/service-creation/service-creation.component.scss
index 66af8ed3..93cab045 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/service-creation/service-creation.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/service-creation/service-creation.component.scss
@@ -1,95 +1,95 @@
-@import 'src/app/@shared/styles/common.scss';
-
-.service-creation {
-  height: 100%;
-  @include t-pro-product-card;
-}
-
-.new-user-content {
-  margin-bottom: 30px;
-
-  .content-head {
-    font-size: 24px;
-    font-weight: 400;
-    text-align: left;
-    color: #252b3a;
-    line-height: 33px;
-  }
-
-  .content-des {
-    text-align: left;
-    line-height: 25px;
-    font-size: 16px;
-    padding-top: 10px;
-    color: #86909c;
-  }
-}
-
-.content-item-box {
-  display: flex;
-  flex-wrap: wrap;
-
-  .content-item {
-    width: calc((100% - 20px) / 2);
-    padding: var(--ti-common-space-5x) 30px 30px;
-    background-color: rgba($color: #eff2f8, $alpha: 0.5);
-    border-radius: 8px;
-
-    .content-item-head {
-      display: flex;
-      align-items: center;
-
-      .head-left {
-        margin-right: 7px;
-        width: 32px;
-        height: 32px;
-      }
-
-      .head-title {
-        font-size: 18px;
-        font-weight: 500;
-        color: #202e54;
-        line-height: 25px;
-      }
-
-      .create-csbs-icon {
-        background: url('../../../../../assets/img/service-overview/create_icon_csbs.png') 0 0 no-repeat;
-      }
-
-      .create-vbs-icon {
-        background: url('../../../../../assets/img/service-overview/create_icon_vbs.png') 0 0 no-repeat;
-      }
-
-      .create-sfs-icon {
-        background: url('../../../../../assets/img/service-overview/create_icon_sfs.png') 0 0 no-repeat;
-      }
-
-      .create-vmware-icon {
-        background: url('../../../../../assets/img/service-overview/create_icon_vmware.png') 0 0 no-repeat;
-      }
-    }
-    .content-down-box {
-      height: 110px;
-      display: flex;
-      flex-direction: column;
-      justify-content: space-between;
-
-      .content-item-des {
-        padding: 10px 0 20px;
-        color: #86909c;
-        font-size: 14px;
-        line-height: 20px;
-        line-height: 18px;
-        overflow: hidden;
-      }
-    }
-  }
-}
-
-.mr12 {
-  margin-right: var(--ti-common-space-5x);
-}
-
-.mt12 {
-  margin-top: var(--ti-common-space-5x);
-}
+@import 'src/app/@shared/styles/common.scss';
+
+.service-creation {
+  height: 100%;
+  @include t-pro-product-card;
+}
+
+.new-user-content {
+  margin-bottom: 30px;
+
+  .content-head {
+    font-size: 24px;
+    font-weight: 400;
+    text-align: left;
+    color: #252b3a;
+    line-height: 33px;
+  }
+
+  .content-des {
+    text-align: left;
+    line-height: 25px;
+    font-size: 16px;
+    padding-top: 10px;
+    color: #86909c;
+  }
+}
+
+.content-item-box {
+  display: flex;
+  flex-wrap: wrap;
+
+  .content-item {
+    width: calc((100% - 20px) / 2);
+    padding: var(--ti-common-space-5x) 30px 30px;
+    background-color: rgba($color: #eff2f8, $alpha: 0.5);
+    border-radius: 8px;
+
+    .content-item-head {
+      display: flex;
+      align-items: center;
+
+      .head-left {
+        margin-right: 7px;
+        width: 32px;
+        height: 32px;
+      }
+
+      .head-title {
+        font-size: 18px;
+        font-weight: 500;
+        color: #202e54;
+        line-height: 25px;
+      }
+
+      .create-csbs-icon {
+        background: url('../../../../../assets/img/service-overview/create_icon_csbs.png') 0 0 no-repeat;
+      }
+
+      .create-vbs-icon {
+        background: url('../../../../../assets/img/service-overview/create_icon_vbs.png') 0 0 no-repeat;
+      }
+
+      .create-sfs-icon {
+        background: url('../../../../../assets/img/service-overview/create_icon_sfs.png') 0 0 no-repeat;
+      }
+
+      .create-vmware-icon {
+        background: url('../../../../../assets/img/service-overview/create_icon_vmware.png') 0 0 no-repeat;
+      }
+    }
+    .content-down-box {
+      height: 110px;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+
+      .content-item-des {
+        padding: 10px 0 20px;
+        color: #86909c;
+        font-size: 14px;
+        line-height: 20px;
+        line-height: 18px;
+        overflow: hidden;
+      }
+    }
+  }
+}
+
+.mr12 {
+  margin-right: var(--ti-common-space-5x);
+}
+
+.mt12 {
+  margin-top: var(--ti-common-space-5x);
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/service-introduce/service-introduce.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/service-introduce/service-introduce.component.scss
index cc95d656..466140f9 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/service-introduce/service-introduce.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-overview/widgets/service-introduce/service-introduce.component.scss
@@ -1,32 +1,32 @@
-@import 'src/app/@shared/styles/common.scss';
-
-.new-user-head {
-  @include t-pro-product-card;
-  padding-right: 13px;
-  width: 100%;
-  display: flex;
-  justify-content: space-between;
-
-  .head-text {
-    width: 72%;
-
-    .head-text-title {
-      font-size: 24px;
-      font-weight: 400;
-      line-height: 33px;
-    }
-
-    .head-text-des {
-      line-height: 25px;
-      font-size: 16px;
-      padding-top: 30px;
-      color: #86909c;
-    }
-  }
-
-  .head-image {
-    width: 390px;
-    height: 160px;
-    background: url('../../../../../assets/img/service-overview/overview_image.svg') 0 0 no-repeat;
-  }
-}
+@import 'src/app/@shared/styles/common.scss';
+
+.new-user-head {
+  @include t-pro-product-card;
+  padding-right: 13px;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+
+  .head-text {
+    width: 72%;
+
+    .head-text-title {
+      font-size: 24px;
+      font-weight: 400;
+      line-height: 33px;
+    }
+
+    .head-text-des {
+      line-height: 25px;
+      font-size: 16px;
+      padding-top: 30px;
+      color: #86909c;
+    }
+  }
+
+  .head-image {
+    width: 390px;
+    height: 160px;
+    background: url('../../../../../assets/img/service-overview/overview_image.svg') 0 0 no-repeat;
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/service-purchase.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/service-purchase.component.scss
index 7cb47393..a9826848 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/service-purchase.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/service-purchase.component.scss
@@ -1,20 +1,20 @@
-@import 'src/app/@shared/styles/common.scss';
-
-.purchase-box {
-    @include t-pro-product-card;
-    padding: 40px 30px 10px;
-
-    ::ng-deep .ti3-form .ti3-form-label {
-        font-size: 14px !important;
-    }
-}
-
-.buy-box {
-    @include t-pro-product-card;
-    margin-top: 20px;
-    padding: 30px 30px;
-}
-
-::ng-deep .ti3-form .ti3-form-content {
-    padding-bottom: 20px !important; 
-}
\ No newline at end of file
+@import 'src/app/@shared/styles/common.scss';
+
+.purchase-box {
+  @include t-pro-product-card;
+  padding: 40px 30px 10px;
+
+  ::ng-deep .ti3-form .ti3-form-label {
+    font-size: 14px !important;
+  }
+}
+
+.buy-box {
+  @include t-pro-product-card;
+  margin-top: 20px;
+  padding: 30px 30px;
+}
+
+::ng-deep .ti3-form .ti3-form-content {
+  padding-bottom: 20px !important;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/service-purchase.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/service-purchase.component.ts
index 7918cf80..2883d507 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/service-purchase.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/service-purchase.component.ts
@@ -4,6 +4,4 @@ import { Component, OnInit } from '@angular/core';
   templateUrl: './service-purchase.component.html',
   styleUrls: ['./service-purchase.component.scss'],
 })
-export class ServicePurchaseComponent  {
-
-}
+export class ServicePurchaseComponent {}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/buy-layer/buy-layer.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/buy-layer/buy-layer.component.scss
index 8d0ae53c..4c6bc348 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/buy-layer/buy-layer.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/buy-layer/buy-layer.component.scss
@@ -1,58 +1,58 @@
-.buy-layer {
-  width: 100%;
-  height: 50px;
-}
-
-.buy-layer-left {
-  width: calc(100% - 400px);
-  min-width: 225px;
-  float: left;
-  height: 100%;
-  position: relative;
-  z-index: 1;
-}
-
-.buyLayer-vertical-middle {
-  position: absolute;
-  top: 50%;
-  width: 100%;
-}
-
-.buyLayer-price-item {
-  padding-right: 4px;
-  font-size: 14px;
-  color: #575d6c;
-}
-
-.buyLayer-label {
-  margin-right: 6px;
-}
-
-.buyLayer-price-num {
-  font-size: 20px;
-  color: #de504e;
-  display: inline-block;
-}
-
-.msg-top {
-  margin-top: 4px;
-  line-height: 18px;
-  font-size: 14px;
-  color: #575d6c;
-
-  > span {
-    margin-right: 10px;
-  }
-}
-
-.buy-layer-right {
-  text-align: right;
-  float: right;
-  height: 100%;
-
-  > button {
-    margin-top: 9px;
-    width: 96px;
-    font-size: 14px;
-  }
-}
+.buy-layer {
+  width: 100%;
+  height: 50px;
+}
+
+.buy-layer-left {
+  width: calc(100% - 400px);
+  min-width: 225px;
+  float: left;
+  height: 100%;
+  position: relative;
+  z-index: 1;
+}
+
+.buyLayer-vertical-middle {
+  position: absolute;
+  top: 50%;
+  width: 100%;
+}
+
+.buyLayer-price-item {
+  padding-right: 4px;
+  font-size: 14px;
+  color: #575d6c;
+}
+
+.buyLayer-label {
+  margin-right: 6px;
+}
+
+.buyLayer-price-num {
+  font-size: 20px;
+  color: #de504e;
+  display: inline-block;
+}
+
+.msg-top {
+  margin-top: 4px;
+  line-height: 18px;
+  font-size: 14px;
+  color: #575d6c;
+
+  > span {
+    margin-right: 10px;
+  }
+}
+
+.buy-layer-right {
+  text-align: right;
+  float: right;
+  height: 100%;
+
+  > button {
+    margin-top: 9px;
+    width: 96px;
+    font-size: 14px;
+  }
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/purchase-settings/purchase-settings.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/purchase-settings/purchase-settings.component.scss
index 2dda1282..0bb8bc9f 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/purchase-settings/purchase-settings.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/purchase-settings/purchase-settings.component.scss
@@ -1,40 +1,40 @@
-@import 'src/app/@shared/styles/common.scss';
-
-:host {
-  ::ng-deep button.ti3-btn-item.ti3-btn-item-radio {
-    padding: 0 20px;
-    font-size: 14px;
-  }
-}
-
-.buttongroup-discount-icon {
-  background-color: #fa9841;
-  border-radius: 2px;
-}
-
-.auto-reneualfee {
-  margin-top: 18px;
-
-  .reneualfee-explain {
-    line-height: 14px;
-    font-size: 14px;
-    margin-left: 4px;
-    color: #8a8e99;
-  }
-}
-
-.help-tip {
-  display: inline-block;
-  vertical-align: middle;
-}
-
-.purchase-count {
-  margin-top: 20px;
-}
-
-.unit-tai {
-  line-height: 28px;
-  height: 28px;
-  margin-left: 10px;
-  font-size: 14px;
-}
+@import 'src/app/@shared/styles/common.scss';
+
+:host {
+  ::ng-deep button.ti3-btn-item.ti3-btn-item-radio {
+    padding: 0 20px;
+    font-size: 14px;
+  }
+}
+
+.buttongroup-discount-icon {
+  background-color: #fa9841;
+  border-radius: 2px;
+}
+
+.auto-reneualfee {
+  margin-top: 18px;
+
+  .reneualfee-explain {
+    line-height: 14px;
+    font-size: 14px;
+    margin-left: 4px;
+    color: #8a8e99;
+  }
+}
+
+.help-tip {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.purchase-count {
+  margin-top: 20px;
+}
+
+.unit-tai {
+  line-height: 28px;
+  height: 28px;
+  margin-left: 10px;
+  font-size: 14px;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/region-select/region-select.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/region-select/region-select.component.scss
index b1409e50..370c3023 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/region-select/region-select.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/region-select/region-select.component.scss
@@ -1,14 +1,14 @@
-@import 'src/app/@shared/styles/common.scss';
-
-:host {
-  ::ng-deep button.ti3-btn-item {
-    font-size: 14px;
-    width: 192px;
-  }
-}
-
-.recommend-icon {
-  color: #fa9841;
-  display: inline-block;
-  margin-right: 4px;
-}
+@import 'src/app/@shared/styles/common.scss';
+
+:host {
+  ::ng-deep button.ti3-btn-item {
+    font-size: 14px;
+    width: 192px;
+  }
+}
+
+.recommend-icon {
+  color: #fa9841;
+  display: inline-block;
+  margin-right: 4px;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/region-select/region-select.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/region-select/region-select.component.ts
index ba623133..43e1ee2c 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/region-select/region-select.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/region-select/region-select.component.ts
@@ -32,5 +32,4 @@ export class RegionSelectComponent {
   ];
 
   public selectedRegion: TiButtonItem = this.regionOptions[0];
-
 }
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-configuration/service-configuration.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-configuration/service-configuration.component.scss
index cad7af2b..e0877d05 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-configuration/service-configuration.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-configuration/service-configuration.component.scss
@@ -31,7 +31,7 @@
 
       &.color-card-active-bg {
         background-color: var(--ti-base-color-brand-6);
-        color: var(--ti-base-color-white);;
+        color: var(--ti-base-color-white);
       }
     }
 
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-image/service-image.component.scss b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-image/service-image.component.scss
index 00075a63..6f4ebedc 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-image/service-image.component.scss
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-image/service-image.component.scss
@@ -1,148 +1,145 @@
-@import 'src/app/@shared/styles/common.scss';
-
-:host {
-  ::ng-deep button.ti3-btn-item {
-    font-size: 14px;
-    width: 192px;
-  }
-}
-
-.image-box {
-  width: 192px;
-  height: auto;
-}
-
-.item-hover:hover {
-  border: 1px solid var(--ti-common-color-bg-emphasize);
-  box-shadow: 0 2px 8px 0 rgb(94 124 224 / 30%);
-}
-
-.select-item-box {
-  display: inline-block;
-  cursor: pointer;
-  padding: 9px 9px 9px 16px;
-  border-radius: 2px;
-  box-sizing: border-box;
-  margin-right: 12px;
-  position: relative;
-  box-shadow: none;
-  margin-top: 20px;
-}
-
-.select-item-unChecked {
-  border: 1px solid #adb0b8;
-}
-
-.select-item-checked {
-  background-color: var(--ti-common-color-bg-light-normal);
-  ti-select{
-  --ti-input-bg-color: var(--ti-common-color-bg-light-normal);
-}
-  border: 1px solid var(--ti-base-color-brand-4);
-  box-shadow: 0 2px 8px 0 rgb(94 124 224 / 30%);
-}
-
-
-.light-image-icon {
-  position: relative;
-  height: 30px;
-  width: 30px;
-}
-
-.select-item-lefticon {
-  float: left;
-  margin-right: 12px;
-}
-
-.select-item-right {
-  line-height: 30px;
-  float: left;
-  width: calc(100% - 50px);
-}
-
-.select-item-title {
-  font-size: 14px;
-}
-
-.select-group-dominator {
-  width: 189px;
-  position: relative;
-  left: -8px;
-  bottom: -4.5px;
-}
-
-.ti-select-dominator-container-focused {
-  border: 1px solid var(--ti-base-color-brand-2);
-}
-
-.ti-select-dominator-container {
-  width: 198px;
-  margin-left: 1px;
-  border-radius: 0;
-  border-color: #dfe1e6 transparent transparent;
-  background: transparent;
-}
-
-.select-container-border {
-  border-top: 1px solid var(--ti-common-color-line-normal);
-  border-left: none;
-  border-right: none;
-  border-bottom: none;
-}
-
-.select-hover:hover {
-  border-top: 1px solid var(--ti-common-color-line-normal);
-}
-
-
-
-.ti-select-wrapper {
-  display: inline-block;
-  width: 192px;
-  line-height: normal;
-}
-
-.ti-select-dominator-wrapper {
-  display: inline-block;
-  width: 100%;
-}
-
-.public-image {
-  margin-top: 20px;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-}
-
-.help-tip {
-  display: inline-block;
-  vertical-align: middle;
-  height: 20px;
-}
-
-.common-color-number {
-  color: #de504e;
-  font-size: 14px;
-  line-height: 16px;
-  padding-left: 10px;
-}
-
-.security-service {
-  display: flex;
-  align-items: center;
-  margin-right: 24px;
-  font-size: 14px;
-  vertical-align: middle;
-}
-
-.click-alarm {
-  display: flex;
-  align-items: center;
-  margin-right: 24px;
-  font-size: 14px;
-  vertical-align: middle;
-}
-
-::ng-deep .ti3-checkbox-label {
-  font-size: 14px !important;
-}
+@import 'src/app/@shared/styles/common.scss';
+
+:host {
+  ::ng-deep button.ti3-btn-item {
+    font-size: 14px;
+    width: 192px;
+  }
+}
+
+.image-box {
+  width: 192px;
+  height: auto;
+}
+
+.item-hover:hover {
+  border: 1px solid var(--ti-common-color-bg-emphasize);
+  box-shadow: 0 2px 8px 0 rgb(94 124 224 / 30%);
+}
+
+.select-item-box {
+  display: inline-block;
+  cursor: pointer;
+  padding: 9px 9px 9px 16px;
+  border-radius: 2px;
+  box-sizing: border-box;
+  margin-right: 12px;
+  position: relative;
+  box-shadow: none;
+  margin-top: 20px;
+}
+
+.select-item-unChecked {
+  border: 1px solid #adb0b8;
+}
+
+.select-item-checked {
+  background-color: var(--ti-common-color-bg-light-normal);
+  ti-select {
+    --ti-input-bg-color: var(--ti-common-color-bg-light-normal);
+  }
+  border: 1px solid var(--ti-base-color-brand-4);
+  box-shadow: 0 2px 8px 0 rgb(94 124 224 / 30%);
+}
+
+.light-image-icon {
+  position: relative;
+  height: 30px;
+  width: 30px;
+}
+
+.select-item-lefticon {
+  float: left;
+  margin-right: 12px;
+}
+
+.select-item-right {
+  line-height: 30px;
+  float: left;
+  width: calc(100% - 50px);
+}
+
+.select-item-title {
+  font-size: 14px;
+}
+
+.select-group-dominator {
+  width: 189px;
+  position: relative;
+  left: -8px;
+  bottom: -4.5px;
+}
+
+.ti-select-dominator-container-focused {
+  border: 1px solid var(--ti-base-color-brand-2);
+}
+
+.ti-select-dominator-container {
+  width: 198px;
+  margin-left: 1px;
+  border-radius: 0;
+  border-color: #dfe1e6 transparent transparent;
+  background: transparent;
+}
+
+.select-container-border {
+  border-top: 1px solid var(--ti-common-color-line-normal);
+  border-left: none;
+  border-right: none;
+  border-bottom: none;
+}
+
+.select-hover:hover {
+  border-top: 1px solid var(--ti-common-color-line-normal);
+}
+
+.ti-select-wrapper {
+  display: inline-block;
+  width: 192px;
+  line-height: normal;
+}
+
+.ti-select-dominator-wrapper {
+  display: inline-block;
+  width: 100%;
+}
+
+.public-image {
+  margin-top: 20px;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+}
+
+.help-tip {
+  display: inline-block;
+  vertical-align: middle;
+  height: 20px;
+}
+
+.common-color-number {
+  color: #de504e;
+  font-size: 14px;
+  line-height: 16px;
+  padding-left: 10px;
+}
+
+.security-service {
+  display: flex;
+  align-items: center;
+  margin-right: 24px;
+  font-size: 14px;
+  vertical-align: middle;
+}
+
+.click-alarm {
+  display: flex;
+  align-items: center;
+  margin-right: 24px;
+  font-size: 14px;
+  vertical-align: middle;
+}
+
+::ng-deep .ti3-checkbox-label {
+  font-size: 14px !important;
+}
diff --git a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-image/service-image.component.ts b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-image/service-image.component.ts
index 2fa9e274..3cd3b9ff 100644
--- a/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-image/service-image.component.ts
+++ b/packages/toolkits/pro/template/tinyng/src/app/pages/service-purchase/widgets/service-image/service-image.component.ts
@@ -35,7 +35,7 @@ export class ServiceImageComponent {
           label: '8.0 64bit',
         },
       ],
-      value: '8.2 64bit'
+      value: '8.2 64bit',
     },
     {
       title: 'Ubuntu',
@@ -49,7 +49,7 @@ export class ServiceImageComponent {
           label: '16.04 server 64bit',
         },
       ],
-      value: '18.04 server 64bit'
+      value: '18.04 server 64bit',
     },
     {
       title: 'Windows',
@@ -63,7 +63,7 @@ export class ServiceImageComponent {
           label: '16.04 server 64bit',
         },
       ],
-      value: '18.04 server 64bit'
+      value: '18.04 server 64bit',
     },
   ];
 
@@ -74,10 +74,9 @@ export class ServiceImageComponent {
   public alarmLabel: string = 'servicePurchase.image.oneClickAlarm';
 
   public imageClick(image: any) {
-  
     // 配置只支持单选
     for (let i = 0; i < this.imageModel.length; i++) {
-        this.imageModel[i].isChecked = false;
+      this.imageModel[i].isChecked = false;
     }
     image.isChecked = !image.isChecked;
   }
diff --git a/packages/toolkits/pro/template/tinyng/src/config/custom-theme.ts b/packages/toolkits/pro/template/tinyng/src/config/custom-theme.ts
index a56d7ab9..178ac51c 100644
--- a/packages/toolkits/pro/template/tinyng/src/config/custom-theme.ts
+++ b/packages/toolkits/pro/template/tinyng/src/config/custom-theme.ts
@@ -16,8 +16,4 @@ export const CustomStyle = [
 ];
 
 // 自定义主题下部分显示字体颜色设置为#fff
-export const textWhiteStyle = [
-  '--ti-button-default-color-active',
-  '--ti-leftmenu-item-selected-text-color',
-  '--ti-leftmenu-item-text-color-hover',
-];
+export const textWhiteStyle = ['--ti-button-default-color-active', '--ti-leftmenu-item-selected-text-color', '--ti-leftmenu-item-text-color-hover'];
diff --git a/packages/toolkits/pro/template/tinyng/src/environments/environment.prod.ts b/packages/toolkits/pro/template/tinyng/src/environments/environment.prod.ts
index 3612073b..c9669790 100644
--- a/packages/toolkits/pro/template/tinyng/src/environments/environment.prod.ts
+++ b/packages/toolkits/pro/template/tinyng/src/environments/environment.prod.ts
@@ -1,3 +1,3 @@
 export const environment = {
-  production: true
+  production: true,
 };
diff --git a/packages/toolkits/pro/template/tinyng/src/environments/environment.ts b/packages/toolkits/pro/template/tinyng/src/environments/environment.ts
index 30d7bccb..31cb7855 100644
--- a/packages/toolkits/pro/template/tinyng/src/environments/environment.ts
+++ b/packages/toolkits/pro/template/tinyng/src/environments/environment.ts
@@ -3,7 +3,7 @@
 // The list of file replacements can be found in `angular.json`.
 
 export const environment = {
-  production: false
+  production: false,
 };
 
 /*
diff --git a/packages/toolkits/pro/template/tinyng/src/polyfills.ts b/packages/toolkits/pro/template/tinyng/src/polyfills.ts
index 67581db7..7338712a 100644
--- a/packages/toolkits/pro/template/tinyng/src/polyfills.ts
+++ b/packages/toolkits/pro/template/tinyng/src/polyfills.ts
@@ -55,8 +55,7 @@
 /***************************************************************************************************
  * Zone JS is required by default for Angular itself.
  */
-import 'zone.js';  // Included with Angular CLI.
-
+import 'zone.js'; // Included with Angular CLI.
 
 /***************************************************************************************************
  * APPLICATION IMPORTS
diff --git a/packages/toolkits/pro/template/tinyng/src/styles.scss b/packages/toolkits/pro/template/tinyng/src/styles.scss
index 21820d6b..a235fae9 100644
--- a/packages/toolkits/pro/template/tinyng/src/styles.scss
+++ b/packages/toolkits/pro/template/tinyng/src/styles.scss
@@ -47,5 +47,3 @@ body {
     max-width: 400px !important;
   }
 }
-
-
diff --git a/packages/toolkits/pro/template/tinyng/src/test.ts b/packages/toolkits/pro/template/tinyng/src/test.ts
index 20423564..0fc6e7bd 100644
--- a/packages/toolkits/pro/template/tinyng/src/test.ts
+++ b/packages/toolkits/pro/template/tinyng/src/test.ts
@@ -2,23 +2,21 @@
 
 import 'zone.js/testing';
 import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
+import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
 
 declare const require: {
-  context(path: string, deep?: boolean, filter?: RegExp): {
+  context(
+    path: string,
+    deep?: boolean,
+    filter?: RegExp
+  ): {
     keys(): string[];
     <T>(id: string): T;
   };
 };
 
 // First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
+getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
 // Then we find all the tests.
 const context = require.context('./', true, /\.spec\.ts$/);
 // And load the modules.