From fbcd43d01f116b36cf43df80c0466ada08acffe3 Mon Sep 17 00:00:00 2001 From: yikai Date: Sun, 24 Sep 2023 22:00:50 +0800 Subject: [PATCH] feat: login en and happy work --- threadpool/console-new/package.json | 1 + threadpool/console-new/src/App.tsx | 22 ++-- .../src/components/header/index.tsx | 2 +- .../src/config/i18n/locales/constants.ts | 4 + .../console-new/src/config/i18n/locales/en.ts | 4 + .../console-new/src/config/i18n/locales/zh.ts | 4 + .../src/config/theme/dark-algorithm.ts | 2 +- .../src/config/theme/default-algnorithm.ts | 2 +- .../console-new/src/page/item/index.tsx | 1 - .../console-new/src/page/login/index.tsx | 27 ++-- .../console-new/src/page/tenant/index.tsx | 1 - .../src/page/thread-pool/constants.ts | 23 ++++ .../src/page/thread-pool/index.tsx | 121 ++++++++++++++---- .../console-new/src/page/thread-pool/type.ts | 2 +- .../console-new/src/page/user/index.tsx | 1 - threadpool/console-new/yarn.lock | 16 ++- .../src/views/hippo4j/instance/index.vue | 1 - 17 files changed, 178 insertions(+), 56 deletions(-) create mode 100644 threadpool/console-new/src/page/thread-pool/constants.ts diff --git a/threadpool/console-new/package.json b/threadpool/console-new/package.json index 7175c79d..3a166404 100644 --- a/threadpool/console-new/package.json +++ b/threadpool/console-new/package.json @@ -4,6 +4,7 @@ "private": true, "dependencies": { "@ahooksjs/use-url-state": "^3.5.1", + "@ant-design/happy-work-theme": "^1.0.0", "@ant-design/icons": "^5.2.6", "@tanem/react-nprogress": "^5.0.51", "@testing-library/jest-dom": "^5.16.5", diff --git a/threadpool/console-new/src/App.tsx b/threadpool/console-new/src/App.tsx index 08f5e2b3..7ac3dc57 100644 --- a/threadpool/console-new/src/App.tsx +++ b/threadpool/console-new/src/App.tsx @@ -6,6 +6,7 @@ import { MenuProps } from 'antd'; import { useTran } from './hooks'; import { STR_MAP } from './config/i18n/locales/constants'; import IconFont from './components/icon'; +import { HappyProvider } from '@ant-design/happy-work-theme'; type MenuItem = Required['items'][number]; @@ -16,7 +17,10 @@ const App = () => { key: STR_MAP.DYNAMIC_THREAD_POOL, icon: , children: [ - { label: {useTran(STR_MAP.THREAD_POOL)}, key: '/thread-poll/index' }, + { + label: {useTran(STR_MAP.THREAD_POOL_MANAGE)}, + key: '/thread-poll/index', + }, ], }, { @@ -42,13 +46,15 @@ const App = () => { ]; return ( - - - {routeList.map(item => ( - - ))} - - + + + + {routeList.map(item => ( + + ))} + + + ); }; diff --git a/threadpool/console-new/src/components/header/index.tsx b/threadpool/console-new/src/components/header/index.tsx index fdea38d5..8f90676a 100644 --- a/threadpool/console-new/src/components/header/index.tsx +++ b/threadpool/console-new/src/components/header/index.tsx @@ -39,7 +39,7 @@ const HeaderChild = () => { return (
navigate('/home')}> - +
diff --git a/threadpool/console-new/src/config/i18n/locales/constants.ts b/threadpool/console-new/src/config/i18n/locales/constants.ts index 1fb4e69c..613fda9d 100644 --- a/threadpool/console-new/src/config/i18n/locales/constants.ts +++ b/threadpool/console-new/src/config/i18n/locales/constants.ts @@ -29,4 +29,8 @@ export enum STR_MAP { REMERBER_PASSWORD = 'rememberPassWord', FORGOT_PASSWORD = 'forgotPassword', ACCOUNT_PASSWORD_LOGIN = 'accountPasswordLogin', + PASSWOR = 'password', + LOGIN = 'login', + PHONE_LOGIN = 'phoneLogin', + ALARM_EDITING_SUCCESS = 'alarmEditingSuccess', } diff --git a/threadpool/console-new/src/config/i18n/locales/en.ts b/threadpool/console-new/src/config/i18n/locales/en.ts index d1cd416c..978f5e0b 100644 --- a/threadpool/console-new/src/config/i18n/locales/en.ts +++ b/threadpool/console-new/src/config/i18n/locales/en.ts @@ -31,6 +31,10 @@ const enTranslationMap: { [key: string]: string } = { [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`, + [STR_MAP.PASSWOR]: 'password', + [STR_MAP.LOGIN]: 'login', + [STR_MAP.PHONE_LOGIN]: 'Mobile login', + [STR_MAP.ALARM_EDITING_SUCCESS]: 'alarm editing success', }; 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 3916ab32..32539d2c 100644 --- a/threadpool/console-new/src/config/i18n/locales/zh.ts +++ b/threadpool/console-new/src/config/i18n/locales/zh.ts @@ -31,6 +31,10 @@ const zhTranslationMap: { [key: string]: string } = { [STR_MAP.FORGOT_PASSWORD]: '忘记密码', [STR_MAP.ACCOUNT_PASSWORD_LOGIN]: '账号密码登录', [STR_MAP.GLOBAL_TITLE]: `全球最好用的线程池管理工具`, + [STR_MAP.PASSWOR]: '密码', + [STR_MAP.LOGIN]: '登录', + [STR_MAP.PHONE_LOGIN]: '手机号登录', + [STR_MAP.ALARM_EDITING_SUCCESS]: '报警编辑成功', }; export default zhTranslationMap; diff --git a/threadpool/console-new/src/config/theme/dark-algorithm.ts b/threadpool/console-new/src/config/theme/dark-algorithm.ts index 054da61e..dcd15994 100644 --- a/threadpool/console-new/src/config/theme/dark-algorithm.ts +++ b/threadpool/console-new/src/config/theme/dark-algorithm.ts @@ -22,7 +22,7 @@ export const darkAlgorithm = { // padding: 10, // paddingXS: 5, // margin: 0, - // fontSize: 14, + // cellFontSize: 12, // colorBorderSecondary: darkDefaultTheme.borderColor.bl1, // paddingContentVerticalLG: 4, }, diff --git a/threadpool/console-new/src/config/theme/default-algnorithm.ts b/threadpool/console-new/src/config/theme/default-algnorithm.ts index bcb8e6b9..f9c6e766 100644 --- a/threadpool/console-new/src/config/theme/default-algnorithm.ts +++ b/threadpool/console-new/src/config/theme/default-algnorithm.ts @@ -20,7 +20,7 @@ export const defaultAlgorithm = { // padding: 10, // paddingXS: 5, // margin: 0, - // fontSize: 14, + // cellFontSize: 12, // colorBorderSecondary: lightDefaultTheme.borderColor.bl1, // paddingContentVerticalLG: 4, }, diff --git a/threadpool/console-new/src/page/item/index.tsx b/threadpool/console-new/src/page/item/index.tsx index ea506206..70077384 100644 --- a/threadpool/console-new/src/page/item/index.tsx +++ b/threadpool/console-new/src/page/item/index.tsx @@ -108,7 +108,6 @@ const Tenant: React.FC = () => { { const navigate = useNavigate(); const { validateFields } = form; const [remenberMe, setRemenberMe] = useState(0); + const { t } = useTranslation(); const { run, loading } = useRequest(service.fetchLogin, { manual: true, onSuccess: res => { if (res) { - message.success('登陆成功'); + message.success(t(STR_MAP.LOGIN_SUCCESSFUL)); navigate('/thread-poll/index'); setToken(res?.data); } @@ -54,12 +57,12 @@ const Login = () => { rules={[ { required: true, - message: '请输入用户名!', + message: t(STR_MAP.USER_INPUT_MESSAGE), }, ]} > } size="large" allowClear @@ -71,12 +74,12 @@ const Login = () => { rules={[ { required: true, - message: '请输入密码！', + message: t(STR_MAP.PASSWORD_INPUT_MESSAGE), }, ]} > } size="large" allowClear @@ -91,9 +94,9 @@ const Login = () => { setRemenberMe(e.target.checked ? 1 : 0); }} > - 记住密码 + {t(STR_MAP.REMERBER_PASSWORD)} - 忘记密码 + {t(STR_MAP.FORGOT_PASSWORD)} @@ -105,23 +108,23 @@ const Login = () => { onClick={handleLogin} loading={loading} > - 登陆 + {t(STR_MAP.LOGIN)} ), - [form, loading, handleLogin] + [form, loading, handleLogin, t] ); const items: TabsProps['items'] = [ { key: TABS_KEY.LOGIN, - label: '账号密码登陆', + label: t(STR_MAP.ACCOUNT_PASSWORD_LOGIN), children: formNode, }, { key: TABS_KEY.PHONE, - label: '手机号登陆', + label: t(STR_MAP.PHONE_LOGIN), children: formNode, }, ]; @@ -132,7 +135,7 @@ const Login = () => {
- 全球最好用的线程池管理工具 + {t(STR_MAP.GLOBAL_TITLE)}
diff --git a/threadpool/console-new/src/page/tenant/index.tsx b/threadpool/console-new/src/page/tenant/index.tsx index 71e93db1..983f246c 100644 --- a/threadpool/console-new/src/page/tenant/index.tsx +++ b/threadpool/console-new/src/page/tenant/index.tsx @@ -92,7 +92,6 @@ const Tenant: React.FC = () => {
{ const [form] = Form.useForm(); - const { handleSetUrlState } = useFormStateToUrl<{ project: number; thpool: number }>(form, paramsType); - const columns: ColumnProps[] = [ + const { t } = useTranslation(); + + const columns: ColumnProps[] = [ { title: useTran(STR_MAP.SERIAL_NUMBER), - dataIndex: 'order', + dataIndex: '', + render: (col, num, index) => { + return index + 1; + }, + fixed: 'left', + width: 80, }, { title: useTran(STR_MAP.PROJECT), - dataIndex: 'project', + dataIndex: 'tenantId', + width: 150, }, { - title: useTran(STR_MAP.TENANTRY), - dataIndex: 'tenantry', + title: useTran(STR_MAP.THREAD_POOL), + dataIndex: 'tpId', + width: 150, }, { - title: useTran(STR_MAP.THREAD_POOL), - dataIndex: 'thread_pool', + title: useTran(STR_MAP.CORE_THREAD), + dataIndex: 'coreSize', + render: col => {col}, + width: 100, }, { title: useTran(STR_MAP.MAXIMUM_THREAD), - dataIndex: 'maximum_thread', + dataIndex: 'maxSize', + render: col => {col}, + width: 100, }, { title: useTran(STR_MAP.QUEUE_TYPE), - dataIndex: 'queue_type', + dataIndex: 'queueType', + render: (col: number) => QUEUE_TYPE_MAP[String(col)], + width: 150, + }, + { + title: useTran(STR_MAP.QUEUE_CAPACITY), + dataIndex: 'capacity', + width: 150, }, { title: useTran(STR_MAP.REJECTION_STRATEGY), - dataIndex: 'tenantry', + dataIndex: 'rejectedType', + render: (col: number) => REJECT_TYPE_MAP[String(col)] ?? 'CustomRejectedPolicy_' + col, + width: 150, }, { title: useTran(STR_MAP.EXECUTION_TIMEOUT), - dataIndex: 'tenantry', + dataIndex: 'executeTimeOut', + render: (col: number) => col ?? 0, + width: 100, }, { title: useTran(STR_MAP.ALARM_OR_NOT), - dataIndex: 'allowCoreThreadTimeOut', + dataIndex: 'isAlarm', + render: (col: number, row) => ( + handleAlarm({ id: row?.id, alarm: Number(!col) })} /> + ), + width: 100, }, { title: useTran(STR_MAP.CREATION_TIME), - dataIndex: 'tenantry', + dataIndex: 'gmtCreate', + width: 150, + align: 'center', }, { title: useTran(STR_MAP.UPDATE_TIME), - dataIndex: 'tenantry', + dataIndex: 'gmtModified', + width: 150, + align: 'center', }, { title: useTran(STR_MAP.EDIT), - dataIndex: 'tenantry', + dataIndex: 'eidt', + fixed: 'right', + width: 150, + render: () => ( + <> + + + + ), }, ]; - const getTableData = (): Promise => { + const getTableData = (params: CustomTableParams): Promise => { + const { pageSize, current } = params; return service.fetchThreadPoolTable({ - current: 1, - size: 10, + current, + size: pageSize, tpId: '', itemId: '', }); }; - const { tableProps, search } = useAntdTable(getTableData, { + const { tableProps, search } = useAntdTable(getTableData, { defaultPageSize: 5, form: form, }); const { submit } = search; + const handleAlarm = async (params: { id: string; alarm: number }) => { + const { id, alarm } = params; + request(`/hippo4j/v1/cs/thread/pool/alarm/enable/${id}/${alarm}`, { + method: 'post', + }) + .then(res => { + if (res.success) { + message.success(t(STR_MAP.ALARM_EDITING_SUCCESS)); + submit(); + } + }) + .catch(err => { + console.log('err:::', err); + }); + }; + return ( - - {useTran(STR_MAP.THREAD_POOL)} + + {useTran(STR_MAP.THREAD_POOL_MANAGE)}
@@ -110,7 +179,7 @@ const ThreadPoll = () => { -
+
); }; diff --git a/threadpool/console-new/src/page/thread-pool/type.ts b/threadpool/console-new/src/page/thread-pool/type.ts index a7493fe4..2be9b23b 100644 --- a/threadpool/console-new/src/page/thread-pool/type.ts +++ b/threadpool/console-new/src/page/thread-pool/type.ts @@ -56,7 +56,7 @@ export interface Record { /** * ID */ - id?: string; + id: string; /** * 是否报警 */ diff --git a/threadpool/console-new/src/page/user/index.tsx b/threadpool/console-new/src/page/user/index.tsx index fb2504fd..1749e9e6 100644 --- a/threadpool/console-new/src/page/user/index.tsx +++ b/threadpool/console-new/src/page/user/index.tsx @@ -91,7 +91,6 @@ const Tenant: React.FC = () => { -