feat: add front code (#423)

front/.eslintrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  extends: require.resolve('@umijs/max/eslint'),
+};

front/.gitignore

@@ -0,0 +1,13 @@
+/node_modules
+/.env.local
+/.umirc.local.ts
+/config/config.local.ts
+/src/.umi
+/src/.umi-production
+/src/.umi-test
+/.umi
+/.umi-production
+/.umi-test
+/dist
+/.mfsu
+.swc

front/.lintstagedrc

@@ -0,0 +1,17 @@
+{
+  "*.{md,json}": [
+    "prettier --cache --write"
+  ],
+  "*.{js,jsx}": [
+    "max lint --fix --eslint-only",
+    "prettier --cache --write"
+  ],
+  "*.{css,less}": [
+    "max lint --fix --stylelint-only",
+    "prettier --cache --write"
+  ],
+  "*.ts?(x)": [
+    "max lint --fix --eslint-only",
+    "prettier --cache --parser=typescript --write"
+  ]
+}

front/.npmrc

@@ -0,0 +1,2 @@
+registry=https://registry.npmmirror.com
+

front/.prettierignore

@@ -0,0 +1,3 @@
+node_modules
+.umi
+.umi-production

front/.prettierrc

@@ -0,0 +1,8 @@
+{
+  "printWidth": 80,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "proseWrap": "never",
+  "overrides": [{ "files": ".prettierrc", "options": { "parser": "json" } }],
+  "plugins": ["prettier-plugin-organize-imports", "prettier-plugin-packagejson"]
+}

front/.stylelintrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  extends: require.resolve('@umijs/max/stylelint'),
+};

front/LEGAL.md

@@ -0,0 +1,7 @@
+Legal Disclaimer
+
+Within this source code, the comments in Chinese shall be the original, governing version. Any comment in other languages are for reference only. In the event of any conflict between the Chinese language version comments and other language version comments, the Chinese language version shall prevail.
+
+法律免责声明
+
+关于代码注释部分，中文注释为官方版本，其它语言注释仅做参考。中文注释可能与其它语言注释存在不一致，当中文注释与其它语言注释存在不一致时，请以中文注释为准。

front/README.md

@@ -0,0 +1,3 @@
+# README
+
+`@umijs/max` 模板项目，更多功能参考 [Umi Max 简介](https://umijs.org/docs/max/introduce)

front/config/config.ts

@@ -0,0 +1,43 @@
+import { defineConfig } from '@umijs/max';
+import routes from './routes';
+export default defineConfig({
+  antd: {
+    dark: true,
+  },
+  access: {},
+  model: {},
+  title: 'HoloInsight',
+  initialState: {},
+  favicons: ['../src/assets/holoinsight.png'],
+  request: {},
+  layout: {
+    menuHeaderRender: true,
+    fixHeader: true,
+    siderWidth: 256,
+    splitMenus: true,
+  },
+  externals: {
+    react: 'React',
+    'react-dom': 'ReactDOM',
+
+  },
+  headScripts: [
+    '/src/assets/react.production.min.js',
+    '/src/assets/react-dom.production.min.js',
+    '/src/assets/react-router.min.js',
+    '/src/assets/holoinsight-magi.min.js',
+  ],
+  styles: [
+
+  ],
+  proxy: {
+    '/webapi/': {
+      target: 'http://localhost:8080',
+      changeOrigin: true,
+    },
+  },
+  esbuildMinifyIIFE: true,
+  reactRouter5Compat: {},
+  routes,
+  npmClient: 'tnpm',
+});

front/config/routes.ts

@@ -0,0 +1,29 @@
+import alarmRoutes from './routes/alarmRoutes';
+import userRoutes from './routes/userRoutes';
+import infraRoutes from './routes/infraRoutes';
+import dashboardRoutes from './routes/dashboardRoutes';
+import interationRoutes from './routes/interationRoutes';
+import applicationRoutes from './routes/applicationRoutes';
+import logMonitorRoutes from './routes/logMonitorRoutes';
+
+export default [
+  {
+    path: '/console/overview',
+    name: 'overview',
+    icon: 'home',
+    component: '@/pages/overview',
+  },
+  {
+    name: '总览',
+    path: '/',
+    redirect: '/console/overview',
+  },
+  { path: '/', redirect: '/console/overview' },
+  ...userRoutes,
+  ...alarmRoutes,
+  ...infraRoutes,
+  ...dashboardRoutes,
+  ...interationRoutes,
+  ...applicationRoutes,
+  ...logMonitorRoutes,
+];

front/config/routes/alarmRoutes.ts

@@ -0,0 +1,35 @@
+export default [
+  {
+    path: '/alarm/rule',
+    component: './alarm/alarmSubscription',
+  },
+  {
+    path: '/alarms/new',
+    component: './alarm/alarmRuler/Detail',
+  },
+  { path: '/alarm/details/:id', component: './alarm/alarmDetails' },
+  {
+    path: '/alarms/new/:sourceType/:sourceId',
+    component: './alarm/alarmRuler/Detail',
+  },
+  {
+    path: '/alarm/view/:id',
+    component: './alarm/alarmRuler/Detail',
+  },
+  {
+    path: '/alarm/group',
+    component: './alarm/alarmGroup',
+  },
+  {
+    path: '/alarm/alarmRobot',
+    component: './alarm/alarmRobot',
+  },
+  {
+    path: '/alarm/history',
+    component: './alarm/alarmHistory',
+  },
+  {
+    path: '/alarm/alarmCallback',
+    component: './alarm/alarmCallback',
+  },
+];

front/config/routes/applicationRoutes.ts

@@ -0,0 +1,49 @@
+export default [
+  {
+    path: '/app/home',
+    icon: 'home',
+    component: './applicationMonitor',
+  },
+  {
+    path: '/app/callLink',
+    icon: 'home',
+    component: './applicationMonitor/callLink',
+  },
+  {
+    path: '/apm/detailLinkDetail',
+    icon: 'home',
+    component: './applicationMonitor/callLink/callLinkDetail',
+  },
+  {
+    path: '/app/overview',
+    component: './applicationMonitor/overview',
+  },
+  {
+    path: '/app/dashboard/:template',
+    component: './applicationMonitor/magiDashboard',
+  },
+  {
+    path: '/app/interfacemetric',
+    component: './applicationMonitor/APIMonitor',
+  },
+  {
+    path: '/app/servermetric',
+    component: './applicationMonitor/standAloneMonitor',
+  },
+  {
+    path: '/app/traceinfra',
+    component: '../components/App/componentMonitor',
+  },
+  {
+    path: '/app/tracedetail',
+    component: './applicationMonitor/callLink',
+  },
+  {
+    path: '/app/rule',
+    component: './applicationMonitor/rule',
+  },
+  {
+    path: '/app/logRetrieval',
+    component: './applicationMonitor/logRetrieval',
+  },
+];

front/config/routes/dashboardRoutes.ts

@@ -0,0 +1,15 @@
+export default [
+      {
+        path: "/dashboard",
+        component: './dashboard',
+      },
+      {
+        path: '/m/dashboard/create',
+        component: './dashboardMagi',
+      },
+      {
+        path: '/m/dashboard/:mode/:id',
+        component: './dashboardMagi',
+      },
+  ];
+

front/config/routes/infraRoutes.ts

@@ -0,0 +1,18 @@
+export default [
+  {
+    path: '/infra/server',
+    component: './infra',
+  },
+  {
+    path: '/infra/metric/:type/:namespace/:hostname',
+    component: './infra/Metric',
+  },
+  {
+    path: '/infra/metric/:type/:hostname',
+    component: './infra/Metric',
+  },
+  {
+    path: '/infra/agent',
+    component: './infra',
+  },
+];

front/config/routes/interationRoutes.ts

@@ -0,0 +1,17 @@
+export default [
+    {
+      path: '/integration/agent',
+      component: './integration/agent',
+    },
+    {
+      name: 'agenComp',
+      path: '/integration/agentComp',
+      component: './integration/agentComponent',
+    },
+    {
+      name: 'overview',
+      path: '/integration/dashboard/:type',
+      component: './integration/productDashboard',
+    },
+  ];
+

front/config/routes/logMonitorRoutes.ts

@@ -0,0 +1,26 @@
+export default [
+  {
+    path: '/log',
+    name: 'log',
+    icon: 'cluster',
+    component: './logMonitor',
+  },
+  {
+    path: '/log/:id',
+    name: 'log',
+    icon: 'cluster',
+    component: './logMonitor',
+  },
+  {
+    path: '/log/:type/:action/:parentId',
+    component: './logMonitor/LogMonitorEdit',
+  },
+  {
+    path: '/log/metric/:id',
+    component: './logMonitor/Metric',
+  },
+  {
+    path: '/log/:type/:action/:parentId/:id',
+    component: './logMonitor/LogMonitorEdit',
+  },
+];

front/config/routes/userRoutes.ts

@@ -0,0 +1,15 @@
+export default [
+  { path: '/user/opsLog', component: './admin/ops' },
+  {
+    path: '/user/favorite',
+    component: './admin/fav',
+  },
+  {
+    path: '/user/alarmhistory',
+    component: './alarm/alarmHistory',
+  },
+  {
+    path: '/user/alarmsub',
+    component: './alarm/alarmSubscription',
+  },
+];

front/mock/userAPI.ts

@@ -0,0 +1,20 @@
+const users = [
+  { id: 0, name: 'Umi', nickName: 'U', gender: 'MALE' },
+  { id: 1, name: 'Fish', nickName: 'B', gender: 'FEMALE' },
+];
+
+export default {
+  'GET /api/v1/queryUserList': (req: any, res: any) => {
+    res.json({
+      success: true,
+      data: { list: users },
+      errorCode: 0,
+    });
+  },
+  'PUT /api/v1/user/': (req: any, res: any) => {
+    res.json({
+      success: true,
+      errorCode: 0,
+    });
+  },
+};

front/package.json

@@ -0,0 +1,51 @@
+{
+  "private": true,
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/traas-stack/holoinsight/"
+  },
+  "author": "yuanliu",
+  "scripts": {
+    "build": "max build",
+    "dev": "max dev",
+    "format": "prettier --cache --write .",
+    "postinstall": "max setup",
+    "setup": "max setup",
+    "start": "npm run dev"
+  },
+  "dependencies": {
+    "@aligov/global-locale": "^1.0.5",
+    "@aligov/global-string-format": "^1.0.7",
+    "@ant-design/compatible": "v5-compatible-v4",
+    "@ant-design/icons": "^4.7.0",
+    "@ant-design/pro-components": "^2.0.1",
+    "@ant-design/pro-layout": "^7.10.3",
+    "@umijs/max": "^4.0.53",
+    "ahooks": "^3.7.6",
+    "antd": "^4.24.10",
+    "inversify": "6.0.1",
+    "lodash": "^4.17.21",
+    "moment": "^2.29.0",
+    "monaco-editor": "0.35.0",
+    "monaco-editor-webpack-plugin": "7.0.1",
+    "monaco-promql": "1.7.4",
+    "query-string": "^8.1.0",
+    "react-json-view": "^1.21.3",
+    "umi-request": "^1.4.0",
+    "react-monaco-editor": "0.51.0",
+    "@antv/g2plot": "^2.4.20",
+    "@antv/g6": "^4.7.10",
+    "clsx": "^1.2.1",
+    "react-copy-to-clipboard": "^5.1.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
+    "lint-staged": "^13.0.3",
+    "prettier": "^2.7.1",
+    "prettier-plugin-organize-imports": "^2",
+    "prettier-plugin-packagejson": "^2",
+    "typescript": "^4.1.2"
+  },
+  "__npminstall_done": false
+}