diff --git a/threadpool/console-new/package.json b/threadpool/console-new/package.json index cef35383..7175c79d 100644 --- a/threadpool/console-new/package.json +++ b/threadpool/console-new/package.json @@ -13,6 +13,8 @@ "antd": "^5.4.7", "classnames": "^2.3.2", "dayjs": "^1.11.9", + "echarts": "^5.4.3", + "echarts-for-react": "^3.0.2", "i18next": "^23.5.1", "i18next-browser-languagedetector": "^7.1.0", "lodash": "^4.17.21", diff --git a/threadpool/console-new/src/App.tsx b/threadpool/console-new/src/App.tsx index 3dba11da..52ecb4b8 100644 --- a/threadpool/console-new/src/App.tsx +++ b/threadpool/console-new/src/App.tsx @@ -1,3 +1,4 @@ +// import { Suspense } from 'react'; import LayoutCom from './components/layout-com'; import { Routes, Route, Link } from 'react-router-dom'; import routeList from './route'; @@ -18,6 +19,26 @@ const App = () => { { label: {useTran(STR_MAP.THREAD_POOL)}, key: '/thread-poll/index' }, ], }, + { + label: {useTran(STR_MAP.TENANT_MANAGE)}, + key: STR_MAP.TENANT_MANAGE, + icon: , + }, + { + label: {useTran(STR_MAP.PROJECT_MANAGE)}, + key: STR_MAP.PROJECT_MANAGE, + icon: , + }, + { + label: {useTran(STR_MAP.USER_MANAGE)}, + key: STR_MAP.USER_MANAGE, + icon: , + }, + { + label: {useTran(STR_MAP.LOG_MANAGE)}, + key: STR_MAP.LOG_MANAGE, + icon: , + }, ]; return ( diff --git a/threadpool/console-new/src/config/i18n/locales/constants.ts b/threadpool/console-new/src/config/i18n/locales/constants.ts index 84fe02d5..1fb4e69c 100644 --- a/threadpool/console-new/src/config/i18n/locales/constants.ts +++ b/threadpool/console-new/src/config/i18n/locales/constants.ts @@ -1,4 +1,5 @@ export enum STR_MAP { + GLOBAL_TITLE = 'globalTitle', DYNAMIC_THREAD_POOL = 'dynamicThreadPool', THREAD_POOL_MANAGE = 'threadPoolManage', PROJECT = 'project', @@ -15,6 +16,17 @@ export enum STR_MAP { EXECUTION_TIMEOUT = 'executionTimeout', ALARM_OR_NOT = 'alarmOrNot', CREATION_TIME = 'creationTime', - UPDATE_TIME = 'update time', + UPDATE_TIME = 'updateTime', EDIT = 'edit', + TENANT_MANAGE = 'tenantManage', + LOG_MANAGE = 'logManage', + PROJECT_MANAGE = 'projectManage', + USER_MANAGE = 'userManage', + LOGIN_SUCCESSFUL = 'loginSuccessful', + USER_INPUT_MESSAGE = 'userInputMessage', + USRE_NAME = 'username', + PASSWORD_INPUT_MESSAGE = 'passwordInputMessage', + REMERBER_PASSWORD = 'rememberPassWord', + FORGOT_PASSWORD = 'forgotPassword', + ACCOUNT_PASSWORD_LOGIN = 'accountPasswordLogin', } diff --git a/threadpool/console-new/src/config/i18n/locales/en.ts b/threadpool/console-new/src/config/i18n/locales/en.ts index ab05675d..d1cd416c 100644 --- a/threadpool/console-new/src/config/i18n/locales/en.ts +++ b/threadpool/console-new/src/config/i18n/locales/en.ts @@ -19,6 +19,18 @@ const enTranslationMap: { [key: string]: string } = { [STR_MAP.CREATION_TIME]: 'creation time', [STR_MAP.UPDATE_TIME]: 'update time', [STR_MAP.EDIT]: 'edit', + [STR_MAP.TENANT_MANAGE]: 'tenant management', + [STR_MAP.PROJECT_MANAGE]: 'project management', + [STR_MAP.USER_MANAGE]: 'user management', + [STR_MAP.LOG_MANAGE]: 'log management', + [STR_MAP.LOGIN_SUCCESSFUL]: 'login successful', + [STR_MAP.USER_INPUT_MESSAGE]: 'please enter your username', + [STR_MAP.USRE_NAME]: 'username', + [STR_MAP.PASSWORD_INPUT_MESSAGE]: 'please enter password', + [STR_MAP.REMERBER_PASSWORD]: 'remember the password', + [STR_MAP.FORGOT_PASSWORD]: 'forgot password', + [STR_MAP.ACCOUNT_PASSWORD_LOGIN]: 'account password login', + [STR_MAP.GLOBAL_TITLE]: `The world's best thread pool management tool`, }; export default enTranslationMap; diff --git a/threadpool/console-new/src/config/i18n/locales/zh.ts b/threadpool/console-new/src/config/i18n/locales/zh.ts index 05544c3b..3916ab32 100644 --- a/threadpool/console-new/src/config/i18n/locales/zh.ts +++ b/threadpool/console-new/src/config/i18n/locales/zh.ts @@ -19,6 +19,18 @@ const zhTranslationMap: { [key: string]: string } = { [STR_MAP.CREATION_TIME]: '创建时间', [STR_MAP.UPDATE_TIME]: '更新时间', [STR_MAP.EDIT]: '操作', + [STR_MAP.TENANT_MANAGE]: '租户管理', + [STR_MAP.PROJECT_MANAGE]: '项目管理', + [STR_MAP.USER_MANAGE]: '用户管理', + [STR_MAP.LOG_MANAGE]: '日志管理', + [STR_MAP.LOGIN_SUCCESSFUL]: '登录成功', + [STR_MAP.USER_INPUT_MESSAGE]: '请输入用户名', + [STR_MAP.USRE_NAME]: '用户名', + [STR_MAP.PASSWORD_INPUT_MESSAGE]: '请输入密码', + [STR_MAP.REMERBER_PASSWORD]: '记住密码', + [STR_MAP.FORGOT_PASSWORD]: '忘记密码', + [STR_MAP.ACCOUNT_PASSWORD_LOGIN]: '账号密码登录', + [STR_MAP.GLOBAL_TITLE]: `全球最好用的线程池管理工具`, }; export default zhTranslationMap; diff --git a/threadpool/console-new/src/config/theme/default-algnorithm.ts b/threadpool/console-new/src/config/theme/default-algnorithm.ts index b22cbcaf..bcb8e6b9 100644 --- a/threadpool/console-new/src/config/theme/default-algnorithm.ts +++ b/threadpool/console-new/src/config/theme/default-algnorithm.ts @@ -25,12 +25,12 @@ export const defaultAlgorithm = { // paddingContentVerticalLG: 4, }, Modal: { - borderRadiusLG: 2, - borderRadiusSM: 2, - colorText: lightDefaultTheme.fontColor.fc3, - borderRadius: 2, - paddingContentHorizontalLG: 0, - paddingMD: 0, + // borderRadiusLG: 2, + // borderRadiusSM: 2, + // colorText: lightDefaultTheme.fontColor.fc3, + // borderRadius: 2, + // paddingContentHorizontalLG: 0, + // paddingMD: 0, }, Menu: { itemBg: lightDefaultTheme.backgroundColor.bg1, diff --git a/threadpool/console-new/src/index.tsx b/threadpool/console-new/src/index.tsx index 682dd7f7..f46fb217 100644 --- a/threadpool/console-new/src/index.tsx +++ b/threadpool/console-new/src/index.tsx @@ -1,10 +1,11 @@ -import React from 'react'; +import React, { Suspense } from 'react'; import ReactDOM from 'react-dom/client'; import App from './App'; import { BrowserRouter } from 'react-router-dom'; import { MyStore } from './context'; import './config/i18n'; import 'antd/dist/reset.css'; +import { Spin } from 'antd'; const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement); @@ -14,7 +15,9 @@ root.render( {/* theme context */} {/* theme config context */} - + }> + + diff --git a/threadpool/console-new/src/page/item/create.tsx b/threadpool/console-new/src/page/item/create.tsx new file mode 100644 index 00000000..860aef60 --- /dev/null +++ b/threadpool/console-new/src/page/item/create.tsx @@ -0,0 +1,33 @@ +import { useRequest } from 'ahooks'; +import { Form, Modal, Input, Select } from 'antd'; +import React from 'react'; +import { fetchTenantList } from '../tenant/service'; + +const ItemCreate: React.FC<{ + type: string; + data: any; + visible: boolean; + onClose: () => void; +}> = props => { + const { visible, onClose, data, type } = props; + const { data: tenant } = useRequest(fetchTenantList); + console.log('tenant', tenant); + + return ( + +
+ + {/* */} + + + + + + + +
+ + ); +}; + +export default ItemCreate; diff --git a/threadpool/console-new/src/page/item/index.tsx b/threadpool/console-new/src/page/item/index.tsx index 8684894a..ea506206 100644 --- a/threadpool/console-new/src/page/item/index.tsx +++ b/threadpool/console-new/src/page/item/index.tsx @@ -1,27 +1,37 @@ import { useAntdTable } from 'ahooks'; -import { Button, Form, Input, Row, Space, Table, Col } from 'antd'; +import { Button, Form, Input, Row, Space, Table, Col, Modal } from 'antd'; import { SearchOutlined, EditOutlined } from '@ant-design/icons'; import React, { useState } from 'react'; import { fetchItemList } from './service'; import { useUrlSet } from '@/hooks/useUrlSet'; import style from './index.module.less'; +import ItemCreate from './create'; const baseColumns = [ { title: '序号', dataIndex: 'index', + with: 200, }, { title: '租户', dataIndex: 'tenantId', + with: 200, + }, + { + title: '项目', + dataIndex: 'itemId', + with: 200, }, { title: '项目名称', dataIndex: 'itemName', + with: 200, }, { title: '负责人', dataIndex: 'owner', + with: 200, }, { title: '修改时间', @@ -32,37 +42,44 @@ const baseColumns = [ const Tenant: React.FC = () => { const [editVisible, setEditVisible] = useState(false); const [type, setType] = useState('add'); + const [curItem, setCurItem] = useState({}); const [form] = Form.useForm(); const { setUrl } = useUrlSet({ form }); const { tableProps, search } = useAntdTable(fetchItemList, { form }); // const {run: delete} = useRequest(fetchDeleteTenant, { manual: true }); + const handleSearch = () => { + setUrl(); + search.submit(); + }; + const handleDelete = (item: any) => { + Modal.confirm({ + title: `此操作将删除${item.itemName}, 是否继续?`, + onOk: () => { + search.submit(); + }, + }); + }; const actions = (type: string, item?: any) => { switch (type) { case 'add': + setType('add'); setEditVisible(true); break; case 'edit': + setType('edit'); + setCurItem(item); setEditVisible(true); break; case 'delete': - // handleDelete(); + handleDelete(item); break; default: break; } }; - const handleSearch = () => { - setUrl(); - search.submit(); + const handleClose = () => { + setEditVisible(false); }; - // const handleDelete = (item: any) => { - // Modal.confirm({ - // title: `此操作将删除${item.tenantName}, 是否继续?`, - // onOk: () => { - // search.submit(); - // }, - // }); - // }; return (
@@ -93,6 +110,7 @@ const Tenant: React.FC = () => { {...tableProps} bordered rowKey="index" + scroll={{ x: 1000 }} columns={[ ...baseColumns, { @@ -104,7 +122,7 @@ const Tenant: React.FC = () => { - @@ -113,6 +131,7 @@ const Tenant: React.FC = () => { }, ]} /> +
); }; diff --git a/threadpool/console-new/src/page/item/service.ts b/threadpool/console-new/src/page/item/service.ts index cd426860..babf4216 100644 --- a/threadpool/console-new/src/page/item/service.ts +++ b/threadpool/console-new/src/page/item/service.ts @@ -6,12 +6,6 @@ const fetchItemList = async ( ): Promise<{ total: number; list: Array }> => { const res: any = await request('/hippo4j/v1/cs/item/query/page', { method: 'POST', - headers: { - Authorization: - 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiI3LGJhb3hpbnlpX2FkbWluIiwiaXNzIjoiYWRtaW4iLCJleHAiOjE2OTUzOTg4NDksImlhdCI6MTY5NDc5NDA0OSwicm9sIjoiUk9MRV9BRE1JTiJ9.syRDshKpd-xETsSdeMPRtk956f4BJkPt4utVsUl4smgH71Woj8SUq4w2RX1YtGTC4aTZRJYdKOfkTqwK0g_dHQ', - cookie: - 'Admin-Token=Bearer%20eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiI3LGJhb3hpbnlpX2FkbWluIiwiaXNzIjoiYWRtaW4iLCJleHAiOjE2OTUzOTg4NDksImlhdCI6MTY5NDc5NDA0OSwicm9sIjoiUk9MRV9BRE1JTiJ9.syRDshKpd-xETsSdeMPRtk956f4BJkPt4utVsUl4smgH71Woj8SUq4w2RX1YtGTC4aTZRJYdKOfkTqwK0g_dHQ; userName=baoxinyi_admin', - }, body: { ...formData, current: pageProps.current, diff --git a/threadpool/console-new/src/page/log/detail.tsx b/threadpool/console-new/src/page/log/detail.tsx new file mode 100644 index 00000000..fd753f20 --- /dev/null +++ b/threadpool/console-new/src/page/log/detail.tsx @@ -0,0 +1,33 @@ +import { Descriptions, Modal } from 'antd'; +import React from 'react'; + +const LogDetail: React.FC<{ + data: any; + visible: boolean; + onClose: () => void; +}> = props => { + const { visible, onClose, data } = props; + return ( + + + + {data.category} + + + {data.bizNo} + + + {data.operator} + + + {data.createTime} + + + {data.action} + + + + ); +}; + +export default LogDetail; diff --git a/threadpool/console-new/src/page/log/index.tsx b/threadpool/console-new/src/page/log/index.tsx index a7c0b23f..0bcfcde4 100644 --- a/threadpool/console-new/src/page/log/index.tsx +++ b/threadpool/console-new/src/page/log/index.tsx @@ -1,85 +1,90 @@ import { useAntdTable } from 'ahooks'; -import { Button, Form, Input, Row, Space, Table, Col, Modal } from 'antd'; -import { SearchOutlined, EditOutlined } from '@ant-design/icons'; +import { Button, Form, Input, Row, Space, Table, Col } from 'antd'; +import { SearchOutlined, RedoOutlined } from '@ant-design/icons'; import React, { useState } from 'react'; -import { fetchTenantList } from './service'; +import { fetchLogList } from './service'; import { useUrlSet } from '@/hooks/useUrlSet'; import style from './index.module.less'; +import LogDetail from './detail'; const baseColumns = [ { title: '序号', dataIndex: 'id', + width: 100, + // fixed: 'left', }, { - title: '租户', - dataIndex: 'tenantId', + title: '业务类型', + dataIndex: 'category', + width: 200, }, { - title: '租户名称', - dataIndex: 'tenantName', + title: '业务标识', + dataIndex: 'bizNo', + width: 380, }, { - title: '负责人', - dataIndex: 'owner', + title: '日志内容', + dataIndex: 'action', + width: 380, }, { - title: '修改时间', - dataIndex: 'gmtModified', + title: '操作人', + dataIndex: 'operator', + width: 100, + }, + { + title: '操作时间', + dataIndex: 'createTime', + width: 200, }, ]; const Tenant: React.FC = () => { - const [editVisible, setEditVisible] = useState(false); - const [type, setType] = useState('add'); + const [visible, setVisible] = useState(false); const [form] = Form.useForm(); const { setUrl } = useUrlSet({ form }); - const { tableProps, search } = useAntdTable(fetchTenantList, { form }); - // const {run: delete} = useRequest(fetchDeleteTenant, { manual: true }); - const actions = (type: string, item?: any) => { - switch (type) { - case 'add': - setEditVisible(true); - break; - case 'edit': - setEditVisible(true); - break; - case 'delete': - // handleDelete(); - break; - default: - break; - } - }; + const { tableProps, search } = useAntdTable(fetchLogList, { form }); + const [curItems, setCurItems] = useState({}); const handleSearch = () => { setUrl(); search.submit(); }; - // const handleDelete = (item: any) => { - // Modal.confirm({ - // title: `此操作将删除${item.tenantName}, 是否继续?`, - // onOk: () => { - // search.submit(); - // }, - // }); - // }; + const handleDetail = (item: any) => { + setVisible(!visible); + setCurItems(item); + }; + const handleClose = () => { + setVisible(false); + }; return (
- - - + + + - + + + + + + + + + + + - @@ -93,26 +98,25 @@ const Tenant: React.FC = () => { {...tableProps} bordered rowKey="id" + scroll={{ x: 1000 }} columns={[ ...baseColumns, { + fixed: 'right', + width: 100, title: '操作', key: 'action', render: (text: string, record: any) => { return ( - - - - + ); }, }, ]} /> +
); }; diff --git a/threadpool/console-new/src/page/log/service.ts b/threadpool/console-new/src/page/log/service.ts index 2fab1ef7..d135380c 100644 --- a/threadpool/console-new/src/page/log/service.ts +++ b/threadpool/console-new/src/page/log/service.ts @@ -1,79 +1,24 @@ import request from '@/utils'; -const fetchTenantList = async ( +const fetchLogList = async ( pageProps: { current: number; pageSize: number }, - formData: { tencent: string | number } + formData: { category: string | number; bizNo: string; operator: string } ): Promise<{ total: number; list: Array }> => { - const res: any = await request('/hippo4j/v1/cs/tenant/query/page', { + const res: any = await request('/hippo4j/v1/cs/log/query/page', { method: 'POST', - headers: { - Authorization: - 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiI3LGJhb3hpbnlpX2FkbWluIiwiaXNzIjoiYWRtaW4iLCJleHAiOjE2OTUzOTg4NDksImlhdCI6MTY5NDc5NDA0OSwicm9sIjoiUk9MRV9BRE1JTiJ9.syRDshKpd-xETsSdeMPRtk956f4BJkPt4utVsUl4smgH71Woj8SUq4w2RX1YtGTC4aTZRJYdKOfkTqwK0g_dHQ', - cookie: - 'Admin-Token=Bearer%20eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiI3LGJhb3hpbnlpX2FkbWluIiwiaXNzIjoiYWRtaW4iLCJleHAiOjE2OTUzOTg4NDksImlhdCI6MTY5NDc5NDA0OSwicm9sIjoiUk9MRV9BRE1JTiJ9.syRDshKpd-xETsSdeMPRtk956f4BJkPt4utVsUl4smgH71Woj8SUq4w2RX1YtGTC4aTZRJYdKOfkTqwK0g_dHQ; userName=baoxinyi_admin', - }, body: { ...formData, current: pageProps.current, size: pageProps.pageSize, - desc: true, }, }); if (res && res.success) { return { total: res.data.total, - list: res.data.records, + list: res.data.records.map((item: any, index: number) => ({ id: index + 1, ...item })), }; } throw new Error(res.msg || '服务器开小差啦~'); }; -const fetchAddTenant = async (id: string) => { - const res = await request('/hippo4j/v1/cs/tenant/save', { - method: 'POST', - params: { id }, - }); - - if (res && res.success) { - return res; - } - throw new Error(res.msg || '服务器开小差啦~'); -}; - -const fetchDeleteTenant = async (id: string) => { - const res = await request('/tenants', { - method: 'POST', - params: { id }, - }); - - if (res && res.success) { - return res; - } - throw new Error(res.msg || '服务器开小差啦~'); -}; - -const fetchUpdateTenant = async (id: string) => { - const res = await request('hippo4j/v1/cs/tenant/update', { - method: 'POST', - params: { id }, - }); - - if (res && res.success) { - return res; - } - throw new Error(res.msg || '服务器开小差啦~'); -}; - -const fetchTenantDetail = async (id: string) => { - const res = await request('/tenants', { - method: 'POST', - params: { id }, - }); - - if (res && res.success) { - return res; - } - throw new Error(res.msg || '服务器开小差啦~'); -}; - -export { fetchTenantList, fetchAddTenant, fetchDeleteTenant, fetchUpdateTenant, fetchTenantDetail }; +export { fetchLogList }; diff --git a/threadpool/console-new/src/page/login/index.tsx b/threadpool/console-new/src/page/login/index.tsx index 60348ad0..667d05cb 100644 --- a/threadpool/console-new/src/page/login/index.tsx +++ b/threadpool/console-new/src/page/login/index.tsx @@ -93,7 +93,7 @@ const Login = () => { > 记住密码 - + 忘记密码 diff --git a/threadpool/console-new/src/page/tenant/index.tsx b/threadpool/console-new/src/page/tenant/index.tsx index 0d80beff..71e93db1 100644 --- a/threadpool/console-new/src/page/tenant/index.tsx +++ b/threadpool/console-new/src/page/tenant/index.tsx @@ -4,7 +4,6 @@ import { Button, Form, Input, Row, Space, Table, Col, Modal } from 'antd'; import { SearchOutlined, EditOutlined } from '@ant-design/icons'; import { useUrlSet } from '@/hooks/useUrlSet'; import { fetchTenantList } from './service'; - import style from './index.module.less'; const baseColumns = [ @@ -37,6 +36,19 @@ const Tenant: React.FC = () => { const { setUrl } = useUrlSet({ form }); const { tableProps, search } = useAntdTable(fetchTenantList, { form }); // const {run: delete} = useRequest(fetchDeleteTenant, { manual: true }); + const handleSearch = () => { + setUrl(); + search.submit(); + }; + const handleDelete = (item: any) => { + Modal.confirm({ + title: '提示', + content: `此操作将删除${item.tenantName}，是否继续？`, + onOk: () => { + search.submit(); + }, + }); + }; const actions = (type: string, item?: any) => { switch (type) { case 'add': @@ -46,24 +58,12 @@ const Tenant: React.FC = () => { setEditVisible(true); break; case 'delete': - // handleDelete(); + handleDelete(item); break; default: break; } }; - const handleSearch = () => { - setUrl(); - search.submit(); - }; - // const handleDelete = (item: any) => { - // Modal.confirm({ - // title: `此操作将删除${item.tenantName}, 是否继续?`, - // onOk: () => { - // search.submit(); - // }, - // }); - // }; return (
@@ -105,7 +105,7 @@ const Tenant: React.FC = () => { - diff --git a/threadpool/console-new/src/page/tenant/service.ts b/threadpool/console-new/src/page/tenant/service.ts index 2fab1ef7..181163e4 100644 --- a/threadpool/console-new/src/page/tenant/service.ts +++ b/threadpool/console-new/src/page/tenant/service.ts @@ -6,12 +6,6 @@ const fetchTenantList = async ( ): Promise<{ total: number; list: Array }> => { const res: any = await request('/hippo4j/v1/cs/tenant/query/page', { method: 'POST', - headers: { - Authorization: - 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiI3LGJhb3hpbnlpX2FkbWluIiwiaXNzIjoiYWRtaW4iLCJleHAiOjE2OTUzOTg4NDksImlhdCI6MTY5NDc5NDA0OSwicm9sIjoiUk9MRV9BRE1JTiJ9.syRDshKpd-xETsSdeMPRtk956f4BJkPt4utVsUl4smgH71Woj8SUq4w2RX1YtGTC4aTZRJYdKOfkTqwK0g_dHQ', - cookie: - 'Admin-Token=Bearer%20eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiI3LGJhb3hpbnlpX2FkbWluIiwiaXNzIjoiYWRtaW4iLCJleHAiOjE2OTUzOTg4NDksImlhdCI6MTY5NDc5NDA0OSwicm9sIjoiUk9MRV9BRE1JTiJ9.syRDshKpd-xETsSdeMPRtk956f4BJkPt4utVsUl4smgH71Woj8SUq4w2RX1YtGTC4aTZRJYdKOfkTqwK0g_dHQ; userName=baoxinyi_admin', - }, body: { ...formData, current: pageProps.current, diff --git a/threadpool/console-new/src/page/thread-pool-monitor/index.module.less b/threadpool/console-new/src/page/thread-pool-monitor/index.module.less new file mode 100644 index 00000000..e69de29b diff --git a/threadpool/console-new/src/page/thread-pool-monitor/index.tsx b/threadpool/console-new/src/page/thread-pool-monitor/index.tsx new file mode 100644 index 00000000..ee7f0f2b --- /dev/null +++ b/threadpool/console-new/src/page/thread-pool-monitor/index.tsx @@ -0,0 +1,34 @@ +import * as echarts from 'echarts/core'; +import { GridComponent } from 'echarts/components'; +import { LineChart } from 'echarts/charts'; +import { UniversalTransition } from 'echarts/features'; +import { CanvasRenderer } from 'echarts/renderers'; +import { useEffect } from 'react'; +echarts.use([GridComponent, LineChart, CanvasRenderer, UniversalTransition]); + +const ThreadPoolMonitor = () => { + useEffect(() => { + let chartDom = document.getElementById('main'); + let myChart = echarts.init(chartDom); + let option; + option = { + xAxis: { + type: 'category', + data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], + }, + yAxis: { + type: 'value', + }, + series: [ + { + data: [150, 230, 224, 218, 135, 147, 260], + type: 'line', + }, + ], + }; + option && myChart.setOption(option); + }); + return
; +}; + +export default ThreadPoolMonitor; diff --git a/threadpool/console-new/src/page/thread-pool-monitor/router.ts b/threadpool/console-new/src/page/thread-pool-monitor/router.ts new file mode 100644 index 00000000..13e1e53b --- /dev/null +++ b/threadpool/console-new/src/page/thread-pool-monitor/router.ts @@ -0,0 +1,11 @@ +import { IRouterList } from '@/typings'; +import ThreadPoolMonitor from '.'; + +const routerList: IRouterList[] = [ + { + path: '/echarts', + component: ThreadPoolMonitor, + }, +]; + +export default routerList; diff --git a/threadpool/console-new/src/page/thread-pool/index.tsx b/threadpool/console-new/src/page/thread-pool/index.tsx index 813e31d7..d8239795 100644 --- a/threadpool/console-new/src/page/thread-pool/index.tsx +++ b/threadpool/console-new/src/page/thread-pool/index.tsx @@ -4,7 +4,8 @@ import { STR_MAP } from '@/config/i18n/locales/constants'; import { ColumnProps } from 'antd/es/table'; import { SearchButton, AddButton } from '@/components/with-button'; import { useAntdTable } from 'ahooks'; -import service, { Result, ThreadPoolTableBody } from './service'; +import service from './service'; +import { Result } from './type'; const { Title } = Typography; const { Item } = Form; const paramsType = { project: 0, thpool: 0 }; @@ -73,7 +74,7 @@ const ThreadPoll = () => { }); }; - const { tableProps, search } = useAntdTable(getTableData, { + const { tableProps, search } = useAntdTable(getTableData, { defaultPageSize: 5, form: form, }); diff --git a/threadpool/console-new/src/page/thread-pool/service.ts b/threadpool/console-new/src/page/thread-pool/service.ts index 528a36ea..c1fd99c4 100644 --- a/threadpool/console-new/src/page/thread-pool/service.ts +++ b/threadpool/console-new/src/page/thread-pool/service.ts @@ -1,4 +1,5 @@ import request from '@/utils'; +import { Result, ThreadPoolTableBody, ThreadPoolTableRes } from './type'; const fetchThreadPoolTable = async (body: ThreadPoolTableBody): Promise => { const { data } = await request('/hippo4j/v1/cs/thread/pool/query/page', { diff --git a/threadpool/console-new/src/page/thread-pool/type.ts b/threadpool/console-new/src/page/thread-pool/type.ts index f7288bfc..a7493fe4 100644 --- a/threadpool/console-new/src/page/thread-pool/type.ts +++ b/threadpool/console-new/src/page/thread-pool/type.ts @@ -1,7 +1,7 @@ import { Params } from 'ahooks/lib/useAntdTable/types'; // body -export interface ThreadPoolTableBody extends Params { +export interface ThreadPoolTableBody { /** * current page */ diff --git a/threadpool/console-new/src/route/index.tsx b/threadpool/console-new/src/route/index.tsx index 54d9f987..082299a4 100644 --- a/threadpool/console-new/src/route/index.tsx +++ b/threadpool/console-new/src/route/index.tsx @@ -4,9 +4,20 @@ import aboutRouter from '@/page/about/router'; import ThreadPoolRouter from '@/page/thread-pool/router'; import tenantRouter from '@/page/tenant/router'; import LoginRouter from '@/page/login/router'; -// import itemRouter from '@/page/item/router'; -// import userRouter from '@/page/user/router'; -// import logRouter from '@/page/log/router'; +import itemRouter from '@/page/item/router'; +import userRouter from '@/page/user/router'; +import logRouter from '@/page/log/router'; +import ThreadPoolMonitorRouter from '@/page/thread-pool-monitor/router'; -const routerList: IRouterList[] = [...homeRouter, ...aboutRouter, ...tenantRouter, ...ThreadPoolRouter, ...LoginRouter]; +const routerList: IRouterList[] = [ + ...homeRouter, + ...aboutRouter, + ...tenantRouter, + ...ThreadPoolRouter, + ...LoginRouter, + ...itemRouter, + ...userRouter, + ...logRouter, + ...ThreadPoolMonitorRouter, +]; export default routerList; diff --git a/threadpool/console-new/src/utils/common/index.ts b/threadpool/console-new/src/utils/common/index.ts index 8ae65582..a087d7f4 100644 --- a/threadpool/console-new/src/utils/common/index.ts +++ b/threadpool/console-new/src/utils/common/index.ts @@ -49,9 +49,19 @@ const isPlainObject = (obj: { [key: string]: any }): boolean => { }; const setToken = (token: string) => { + localStorage.setItem(TokenKey, token); Cookie.set(TokenKey, token); }; +const removeToken = () => { + localStorage.removeItem(TokenKey); + Cookie.remove(TokenKey); +}; + +const getToken = () => { + return localStorage.getItem(TokenKey) || Cookie.get(TokenKey); +}; + /** * @description 忽略 object 中 value 为空的元素 * @param obj @@ -79,4 +89,4 @@ const isEmpty = (value: any) => { return typeof value === 'object' ? _.isEmpty(value) : isNilValue(value); }; -export { isPlainObject, isEmpty, filterEmptyField, setToken }; +export { isPlainObject, isEmpty, filterEmptyField, setToken, removeToken, getToken }; diff --git a/threadpool/console-new/src/utils/request/index.ts b/threadpool/console-new/src/utils/request/index.ts index 314c7aa1..14b244a8 100644 --- a/threadpool/console-new/src/utils/request/index.ts +++ b/threadpool/console-new/src/utils/request/index.ts @@ -1,4 +1,4 @@ -import { isPlainObject } from '../common'; +import { getToken, isPlainObject } from '../common'; import { notification, message } from 'antd'; import Qs from 'qs'; @@ -40,10 +40,6 @@ const inital: RequestOptions = { body: null, headers: { 'Content-Type': 'application/json', - Authorization: - 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiIxMCxiYW94aW55aV91c2VyIiwiaXNzIjoiYWRtaW4iLCJleHAiOjE2OTU4MjY1ODQsImlhdCI6MTY5NTIyMTc4NCwicm9sIjoiUk9MRV9VU0VSIn0.HQx33P1hlZK2-0omlUt58kpa77OxiGdW-jLV4GWbbLIFf86y8-0IOdeu8gzMwMWUTRtrwp2_YWMl_05TVlDJbA', - cookie: - 'Admin-Token=Bearer%20eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiI3LGJhb3hpbnlpX2FkbWluIiwiaXNzIjoiYWRtaW4iLCJleHAiOjE2OTUzOTg4NDksImlhdCI6MTY5NDc5NDA0OSwicm9sIjoiUk9MRV9BRE1JTiJ9.syRDshKpd-xETsSdeMPRtk956f4BJkPt4utVsUl4smgH71Woj8SUq4w2RX1YtGTC4aTZRJYdKOfkTqwK0g_dHQ; userName=baoxinyi_admin', }, // headers, credentials: true, @@ -88,8 +84,11 @@ function request(url: string, config: RequestOptions): Promise> { } if (config.headers && isPlainObject(config.headers)) { config.headers = Object.assign({}, inital.headers, config.headers); + if (!config.headers?.Authorization) { + config.headers.Authorization = getToken(); + } } else { - config.headers = inital.headers; + config.headers = { Authorization: getToken(), 'Content-Type': 'application/json' }; } let { method, params, body, headers, credentials, responseType } = Object.assign({}, inital, config) as any; diff --git a/threadpool/console-new/yarn.lock b/threadpool/console-new/yarn.lock index 9bebc0fc..9b911014 100644 --- a/threadpool/console-new/yarn.lock +++ b/threadpool/console-new/yarn.lock @@ -4468,6 +4468,22 @@ eastasianwidth@^0.2.0: resolved "https://registry.npmmirror.com/eastasianwidth/-/eastasianwidth-0.2.0.tgz#696ce2ec0aa0e6ea93a397ffcf24aa7840c827cb" integrity sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA== +echarts-for-react@^3.0.2: + version "3.0.2" + resolved "https://registry.npmmirror.com/echarts-for-react/-/echarts-for-react-3.0.2.tgz#ac5859157048a1066d4553e34b328abb24f2b7c1" + integrity sha512-DRwIiTzx8JfwPOVgGttDytBqdp5VzCSyMRIxubgU/g2n9y3VLUmF2FK7Icmg/sNVkv4+rktmrLN9w22U2yy3fA== + dependencies: + fast-deep-equal "^3.1.3" + size-sensor "^1.0.1" + +echarts@^5.4.3: + version "5.4.3" + resolved "https://registry.npmmirror.com/echarts/-/echarts-5.4.3.tgz#f5522ef24419164903eedcfd2b506c6fc91fb20c" + integrity sha512-mYKxLxhzy6zyTi/FaEbJMOZU1ULGEQHaeIeuMR5L+JnJTpz+YR03mnnpBhbR4+UYJAgiXgpyTVLffPAjOTLkZA== + dependencies: + tslib "2.3.0" + zrender "5.4.4" + ee-first@1.1.1: version "1.1.1" resolved "https://registry.npmmirror.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d" @@ -9647,6 +9663,11 @@ sisteransi@^1.0.5: resolved "https://registry.npmmirror.com/sisteransi/-/sisteransi-1.0.5.tgz#134d681297756437cc05ca01370d3a7a571075ed" integrity sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg== +size-sensor@^1.0.1: + version "1.0.2" + resolved "https://registry.npmmirror.com/size-sensor/-/size-sensor-1.0.2.tgz#b8f8da029683cf2b4e22f12bf8b8f0a1145e8471" + integrity sha512-2NCmWxY7A9pYKGXNBfteo4hy14gWu47rg5692peVMst6lQLPKrVjhY+UTEsPI5ceFRJSl3gVgMYaUi/hKuaiKw== + slash@^2.0.0: version "2.0.0" resolved "https://registry.npmmirror.com/slash/-/slash-2.0.0.tgz#de552851a1759df3a8f206535442f5ec4ddeab44" @@ -10318,6 +10339,11 @@ tsconfig-paths@^3.14.2: minimist "^1.2.6" strip-bom "^3.0.0" +tslib@2.3.0: + version "2.3.0" + resolved "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz#803b8cdab3e12ba581a4ca41c8839bbb0dacb09e" + integrity sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg== + tslib@^1.8.1: version "1.14.1" resolved "https://registry.npmmirror.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00" @@ -11152,3 +11178,10 @@ yocto-queue@^0.1.0: version "0.1.0" resolved "https://registry.npmmirror.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b" integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q== + +zrender@5.4.4: + version "5.4.4" + resolved "https://registry.npmmirror.com/zrender/-/zrender-5.4.4.tgz#8854f1d95ecc82cf8912f5a11f86657cb8c9e261" + integrity sha512-0VxCNJ7AGOMCWeHVyTrGzUgrK4asT4ml9PEkeGirAkKNYXYzoPJCLvmyfdoOXcjTHPs10OZVMfD1Rwg16AZyYw== + dependencies: + tslib "2.3.0"