Dashboard

Signed-off-by: zsnmwy <szlszl35622@gmail.com>

pkg/web/.editorconfig

@@ -0,0 +1,13 @@
+# indicate this is the root of the project
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

pkg/web/.eslintignore

@@ -1,3 +1,5 @@
-.d.ts
-.env.example
-.eslintrc.js
+build
+mock
+config
+public
+scripts

pkg/web/.eslintrc.js

@@ -1,31 +1,60 @@
 module.exports = {
-  env: {
-    browser: true,
-    es2021: true
-  },
+  root: true,
   extends: [
-    'plugin:react/recommended',
-    'google',
+    'airbnb-base',
     'prettier',
-    'plugin:react/jsx-runtime',
-    'plugin:react-hooks/recommended'
+    'plugin:react/recommended',
+    'plugin:import/typescript',
+    'plugin:@typescript-eslint/recommended',
   ],
+  plugins: ['eslint-plugin-prettier'],
   parser: '@typescript-eslint/parser',
-  parserOptions: {
-    ecmaFeatures: {
-      jsx: true
+  env: {
+    jest: true,
+  },
+  settings: {
+    react: {
+      version: 'detect',
     },
-    ecmaVersion: 'latest',
-    sourceType: 'module'
   },
-  plugins: ['react', '@typescript-eslint'],
   rules: {
-    'react/display-name': [0],
-    'no-unused-vars': [1],
-    'valid-jsdoc': [0],
-    'require-jsdoc': [0],
-    'guard-for-in': [1],
-    'prefer-spread': [1],
-    'react/jsx-sort-props': [2, { callbacksLast: true }]
-  }
+    'no-shadow': 'off',
+    'no-param-reassign': ['error', { props: false }],
+    'no-console': 'off',
+    'no-plusplus': [
+      'error',
+      {
+        allowForLoopAfterthoughts: true,
+      },
+    ],
+    'react/display-name': 'off',
+    // jsx 单引号
+    'jsx-quotes': [2, 'prefer-single'],
+    'import/no-cycle': 'off', // TODO: remove
+    'import/extensions': 'off',
+    'import/no-unresolved': 'off',
+    'import/order': 'off',
+    'import/prefer-default-export': 'off',
+    'import/no-extraneous-dependencies': ['error', { devDependencies: true }],
+    // 关闭variable必须全部大写规则
+    '@typescript-eslint/naming-convention': [
+      'error',
+      {
+        selector: 'variable',
+        modifiers: ['const'],
+        format: null,
+      },
+    ],
+    '@typescript-eslint/no-empty-function': 'off',
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/ban-types': 'off',
+    // 统一eslint prettier配置
+    'prettier/prettier': [
+      'warn',
+      {},
+      {
+        usePrettierrc: true,
+      },
+    ],
+  },
 };

pkg/web/.prettierignore → pkg/web/.gitignore

@@ -2,22 +2,22 @@
 
 # dependencies
 /node_modules
-/.pnp
-.pnp.js
-
-# testing
 /coverage
 
 # production
-/build
+/dist
 
 # misc
 .DS_Store
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
+.idea
+.VSCodeCounter
 
+# log
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+
+
+
+# code editor setting
+/.vscode

pkg/web/.prettierrc.js

@@ -0,0 +1,22 @@
+module.exports = {
+  printWidth: 120,
+  tabWidth: 2,
+  useTabs: false,
+  semi: true,
+  singleQuote: true,
+  quoteProps: 'as-needed',
+  jsxSingleQuote: true,
+  trailingComma: 'all',
+  bracketSpacing: true,
+  jsxBracketSameLine: false,
+  arrowParens: 'always',
+  rangeStart: 0,
+  rangeEnd: null,
+  requirePragma: false,
+  insertPragma: false,
+  proseWrap: 'preserve',
+  htmlWhitespaceSensitivity: 'css',
+  vueIndentScriptAndStyle: false,
+  endOfLine: 'lf',
+  embeddedLanguageFormatting: 'auto',
+};

pkg/web/Dockerfile

@@ -12,16 +12,9 @@ RUN npm run build
 # -- RELEASE --
 FROM nginx:stable-alpine as release
 
-COPY --from=build /usr/src/app/build /usr/share/nginx/html
-# copy .env.example as .env to the relase build
-COPY --from=build /usr/src/app/.env.example /usr/share/nginx/html/.env
-
-RUN apk add --update nodejs
-RUN apk add --update npm
-RUN npm i -g runtime-env-cra@0.2.0
+COPY --from=build /usr/src/app/dist /usr/share/nginx/html
 
 WORKDIR /usr/share/nginx/html
 EXPOSE 9090
 
-# CMD ["/bin/sh", "-c", "runtime-env-cra && nginx -g \"daemon off;\""]
-CMD ["/bin/sh", "-c", "nginx -g \"daemon off;\""]
+CMD ["/bin/sh", "-c", "nginx -g \"daemon off;\""]

pkg/web/README.md

@@ -1,2 +1,45 @@
-# crane-dashboard
-
+# Crane Dashboard
+
+### Api Docs
+
+https://www.postman.com/gocrane/workspace/public/collection/14940923-8559deb0-9af9-4ace-bc64-14da3dd0c8f8?ctx=documentation
+
+
+### 开发
+
+开发前，请参考[指南](https://tdesign.tencent.com/starter/docs/react/develop)。
+
+```bash
+## 安装依赖
+npm install
+
+## 启动项目
+npm run dev
+
+## mock方式启动项目
+npm run dev:mock
+```
+
+### 构建
+
+```bash
+## 构建正式环境
+npm run build
+
+## 构建测试环境
+npm run build:test
+```
+
+### 其他
+
+```bash
+## 预览构建产物
+npm run preview
+
+## 代码格式检查
+npm run lint
+
+## 代码格式检查与自动修复
+npm run lint:fix
+
+```

pkg/web/i18next-scanner.config.js

@@ -7,7 +7,7 @@ module.exports = {
     debug: true,
     func: {
       list: ['t', 'i18n.t'],
-      extensions: ['.js', '.jsx', '.ts', '.tsx']
+      extensions: ['.js', '.jsx', '.ts', '.tsx'],
     },
     lngs: ['zh'],
     ns: ['translation'],
@@ -17,17 +17,17 @@ module.exports = {
       loadPath: 'src/i18n/resources/{{lng}}/{{ns}}.json',
       savePath: 'src/i18n/resources/{{lng}}/{{ns}}.json',
       jsonIndent: 2,
-      lineEnding: '\n'
+      lineEnding: '\n',
     },
     nsSeparator: false, // namespace separator
     keySeparator: false, // key separator
     interpolation: {
       prefix: '{{',
-      suffix: '}}'
-    }
+      suffix: '}}',
+    },
   },
   transform: function customTransform(file, enc, done) {
-    const parser = this.parser;
+    const { parser } = this;
     const content = fs.readFileSync(file.path, enc);
 
     parser.parseFuncFromString(content, (key, options) => {
@@ -36,5 +36,5 @@ module.exports = {
     });
 
     done();
-  }
+  },
 };

pkg/web/index.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Crane Dashboard</title>
+    <meta name="description" content="React UI Component" />
+    <meta name="theme-color" content="#ffffff" />
+    <link rel="icon" href="/favicon.ico" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png" sizes="180x180" />
+    <meta name="msapplication-TileColor" content="#FFFFFF" />
+    <link rel="mask-icon" href="/favicon.svg" color="#FFFFFF" />
+    <!--[if IE]>
+      <style>
+        #app {
+          display: none;
+        }
+      </style>
+    <![endif]-->
+  </head>
+
+  <body>
+    <!--[if IE]>
+      <h1 style="position: absolute; width: 100%; text-align: center; top: 45%">
+        建议使用 <a href="https://www.google.cn/chrome/">Chrome</a>
+      </h1>
+    <![endif]-->
+    <td-horizon></td-horizon>
+    <td-aegis></td-aegis>
+    <div id="app"></div>
+    <script type="module" src="/src/main.tsx"></script>
+    <script>
+      if (window.Cypress) {
+        window.__REACT_DEVTOOLS_GLOBAL_HOOK__ = window.parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
+      }
+    </script>
+  </body>
+</html>

pkg/web/mock/index.js

@@ -0,0 +1 @@
+export default [];