From 5419435d188f709f628b084e5787c4f5c6a52957 Mon Sep 17 00:00:00 2001 From: tianweiweiliang <875658254@qq.com> Date: Thu, 23 Nov 2023 15:59:39 +0800 Subject: [PATCH 1/4] =?UTF-8?q?fix:=20=E4=BB=A3=E7=A0=81=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/RightContent/index.less | 9 +++++++++ src/components/RightContent/index.tsx | 4 ++++ src/pages/Agent/AgentList/index.tsx | 3 ++- src/pages/Agent/Module/DeployModal.less | 18 ++++++++++++++++++ src/pages/Agent/Module/DeployModal.tsx | 13 ++++++++++--- src/pages/Agent/index.tsx | 11 +++++++++-- src/pages/Agent/locales/en-US.ts | 1 + src/pages/Agent/locales/zh-CN.ts | 1 + src/pages/Agent/service.ts | 8 ++++++++ src/pages/Token/Table/index.tsx | 15 ++++++++++++--- src/pages/Version/VersionList/index.tsx | 17 +++++++++++++---- 11 files changed, 87 insertions(+), 13 deletions(-) create mode 100644 src/pages/Agent/Module/DeployModal.less diff --git a/src/components/RightContent/index.less b/src/components/RightContent/index.less index fb2df6b..7889db1 100644 --- a/src/components/RightContent/index.less +++ b/src/components/RightContent/index.less @@ -17,6 +17,15 @@ height: 48px; margin-left: auto; overflow: hidden; + .help_document { + padding: 0 2px; + > a { color: rgba(0, 0, 0, 0.85); } + > a:hover { + color: #1890ff; + cursor: pointer; + } + } + .action { display: flex; align-items: center; diff --git a/src/components/RightContent/index.tsx b/src/components/RightContent/index.tsx index 576893f..62b0a9d 100644 --- a/src/components/RightContent/index.tsx +++ b/src/components/RightContent/index.tsx @@ -32,6 +32,10 @@ const GlobalHeaderRight: React.FC = () => { return ( + + 帮助文档 + + {currentUser.username ? : } {/* {REACT_APP_ENV && ( {REACT_APP_ENV} diff --git a/src/pages/Agent/AgentList/index.tsx b/src/pages/Agent/AgentList/index.tsx index 717b926..7f82b5f 100644 --- a/src/pages/Agent/AgentList/index.tsx +++ b/src/pages/Agent/AgentList/index.tsx @@ -160,11 +160,12 @@ const ProductList = ({ data, loading, onChange, onRow, filterCallBack, editCallB columns = columns.concat([ { title: , - onCell: () => ({ style: { maxWidth: 100 } }), + onCell: () => ({ style: { minWidth: 160 } }), align: 'center', render: (text: any, record: any) => { return (
+ editCallBack('heartbeat', record)}> editCallBack('edit', record)}> { filterOption={(input, option:any) => option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0 }> - {data.map((item: any) => ( - {item.version} - ))} + {data.map((item: any) => { + // const { is_new, is_stable } = record + const tagState = item.is_new ? 'new': (item.is_stable ? 'stable': null) + return ( + + {item.version}（{item.os} | {item.arch}）{tagState &&
{tagState}
} + + )} + )} diff --git a/src/pages/Agent/index.tsx b/src/pages/Agent/index.tsx index eec792d..f20511f 100644 --- a/src/pages/Agent/index.tsx +++ b/src/pages/Agent/index.tsx @@ -6,7 +6,7 @@ import { getLimitAuthority } from '@/utils/utilsHelp'; import AddModal from './Module/AddModal' import DeployModal from './Module/DeployModal' import AgentList from './AgentList'; -import { queryList, agentDelete } from './service'; +import { queryList, agentDelete, heartbeat } from './service'; import styles from './index.less' /** 机器管理 */ @@ -54,7 +54,7 @@ const List = (props: any) => { } // 新增机器 - const addOrEditCallBack = (type: string, info: any) => { + const addOrEditCallBack = async (type: string, info: any) => { // console.log('data:', type, info) if (type === 'add') { detailsModal.current?.show({ detailData: {} }); @@ -62,6 +62,13 @@ const List = (props: any) => { detailsModal.current?.show({ detailData: info }); } else if (type === 'delete') { deleteAgentClick(info) + } else if (type === 'heartbeat') { + const res = await heartbeat({id: info.id}) + if (res?.code === 200) { + getTableData({ page_num: data.page_num, page_size: data.page_size }) + } else { + message.error(res.msg || formatMessage({ id: 'request.data.failed'})); + } } } diff --git a/src/pages/Agent/locales/en-US.ts b/src/pages/Agent/locales/en-US.ts index 37000ad..d37e06c 100644 --- a/src/pages/Agent/locales/en-US.ts +++ b/src/pages/Agent/locales/en-US.ts @@ -13,6 +13,7 @@ export default { 'agent.table.Heartbeat': 'Heartbeat', 'agent.table.Mode.Tooltip': 'ToneAgent operates in two modes, Active Mode and Passive Mode. Active mode refers to the mode in which the agent communicates with the server actively (similar to push mode), while passive mode refers to the mode in which the server communicates with the agent actively (similar to pull mode).', 'agent.table.description': 'Description', + 'agent.table.heartbeat.test': 'Heartbeat test', 'hearBeat.hours': ' hours', 'hearBeat.hours.ago': ' hours ago', 'hearBeat.minutes.ago': ' minutes ago', diff --git a/src/pages/Agent/locales/zh-CN.ts b/src/pages/Agent/locales/zh-CN.ts index 051a63e..27bbb42 100644 --- a/src/pages/Agent/locales/zh-CN.ts +++ b/src/pages/Agent/locales/zh-CN.ts @@ -13,6 +13,7 @@ export default { 'agent.table.Heartbeat': '心跳', 'agent.table.Mode.Tooltip': 'ToneAgent分两种运行模式：主动模式(active)和被动模式(passive), 主动模式指的是agent主动连server进行通信的方式(类似push模式)，被动模式指的是server主动连agent进行通信的模式(类似pull模式)。', 'agent.table.description': '描述', + 'agent.table.heartbeat.test': '心跳测试', 'hearBeat.hours': '小时', 'hearBeat.hours.ago': '小时之前', 'hearBeat.minutes.ago': '分钟之前', diff --git a/src/pages/Agent/service.ts b/src/pages/Agent/service.ts index 7c1e412..86121e0 100644 --- a/src/pages/Agent/service.ts +++ b/src/pages/Agent/service.ts @@ -45,3 +45,11 @@ export async function agentDelete(params: any) { }, }); } + +// 心跳测试 +export async function heartbeat(params: any) { + return request(`/v1/agent/heartbeat`, { + method: 'GET', + params, + }); +} diff --git a/src/pages/Token/Table/index.tsx b/src/pages/Token/Table/index.tsx index 84d3262..e5633eb 100644 --- a/src/pages/Token/Table/index.tsx +++ b/src/pages/Token/Table/index.tsx @@ -1,7 +1,7 @@ import React, { useState, useEffect } from 'react'; -import { Popover, Tooltip, Space } from 'antd'; +import { Popover, Tooltip, Space, Popconfirm } from 'antd'; import { QuestionCircleOutlined, FilterFilled, EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons' -import { FormattedMessage } from 'umi'; +import { FormattedMessage, useIntl } from 'umi'; import CommonTable from '@/components/Public/CommonTable'; import PopoverEllipsis from '@/components/Public/PopoverEllipsis'; import SearchInput from '@/components/Public/SearchInput'; @@ -9,6 +9,7 @@ import SelectStatus from '@/components/Public/SelectStatus'; import styles from './style.less'; const ProductList = ({ data, loading, onChange, onRow, filterCallBack, editCallBack= ()=> {}, }:any) => { + const { formatMessage } = useIntl(); const [dataSource, setDataSource] = useState([]); // const [autoFocus, setFocus] = useState(true); @@ -122,7 +123,15 @@ const ProductList = ({ data, loading, onChange, onRow, filterCallBack, editCallB editCallBack('edit', record)}> editCallBack('reset', record)}> - editCallBack('delete', record)}> + editCallBack('delete', record)} + okText={formatMessage({ id: 'btn.ok' })} + cancelText={formatMessage({ id: 'btn.close' })} + > + + ) diff --git a/src/pages/Version/VersionList/index.tsx b/src/pages/Version/VersionList/index.tsx index 9767b06..7c26abd 100644 --- a/src/pages/Version/VersionList/index.tsx +++ b/src/pages/Version/VersionList/index.tsx @@ -1,7 +1,7 @@ -import { FormattedMessage } from 'umi'; import React, { useState, useEffect } from 'react'; -import { Popover, Tooltip, Space } from 'antd'; +import { Popover, Tooltip, Space, Popconfirm } from 'antd'; import { FilterFilled, CopyOutlined } from '@ant-design/icons'; +import { FormattedMessage, useIntl } from 'umi'; import CommonTable from '@/components/Public/CommonTable'; import PopoverEllipsis from '@/components/Public/PopoverEllipsis'; import SearchInput from '@/components/Public/SearchInput'; @@ -11,7 +11,8 @@ import SelectStatus from '@/components/Public/SelectStatus'; import styles from './style.less'; const ProductList = ({ data, loading, onChange, filterCallBack, editCallBack= ()=> {}, onRow= ()=> {} }:any) => { - const [autoFocus, setFocus] = useState(true); + const { formatMessage } = useIntl(); + const [autoFocus, setFocus] = useState(true); const [version, setVersion] = useState(); const [arch, setArch] = useState(); // 权限 @@ -104,7 +105,15 @@ const ProductList = ({ data, loading, onChange, filterCallBack, editCallBack= ()
editCallBack('edit', record)}> - editCallBack('delete', record)}> + editCallBack('delete', record)} + okText={formatMessage({ id: 'btn.ok' })} + cancelText={formatMessage({ id: 'btn.close' })} + > + +
) -- Gitee From 2496a8e24b8a0f963194053a2fb124aa68c2c76a Mon Sep 17 00:00:00 2001 From: tianweiweiliang <875658254@qq.com> Date: Thu, 23 Nov 2023 17:47:44 +0800 Subject: [PATCH 2/4] =?UTF-8?q?fix:=20=E5=BF=83=E8=B7=B3=E6=A3=80=E6=B5=8B?= =?UTF-8?q?=E6=B7=BB=E5=8A=A0loading=E5=8F=8A=E5=BC=B9=E7=AA=97=E7=BB=93?= =?UTF-8?q?=E6=9E=9C=E6=98=BE=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/Agent/AgentList/index.tsx | 8 +++++--- src/pages/Agent/index.tsx | 16 ++++++++++++---- 2 files changed, 17 insertions(+), 7 deletions(-) diff --git a/src/pages/Agent/AgentList/index.tsx b/src/pages/Agent/AgentList/index.tsx index 7f82b5f..35fde8a 100644 --- a/src/pages/Agent/AgentList/index.tsx +++ b/src/pages/Agent/AgentList/index.tsx @@ -1,5 +1,5 @@ import React, { useState, useEffect } from 'react'; -import { Popover, Tooltip, Space, Badge, Popconfirm } from 'antd'; +import { Popover, Tooltip, Space, Badge, Popconfirm, Spin } from 'antd'; import { QuestionCircleOutlined, FilterFilled } from '@ant-design/icons' import { FormattedMessage, useIntl } from 'umi'; import CommonTable from '@/components/Public/CommonTable'; @@ -9,7 +9,7 @@ import SelectStatus from '@/components/Public/SelectStatus'; import { getLimitAuthority } from '@/utils/utilsHelp'; import styles from './style.less'; -const ProductList = ({ data, loading, onChange, onRow, filterCallBack, editCallBack, rowSelectionCallBack= {} }:any) => { +const ProductList = ({ data, loading, onChange, onRow, filterCallBack, editCallBack, rowSelectionCallBack= {}, heartbeatLoading }:any) => { const { formatMessage } = useIntl(); const { selectedRowKeys = [], onSelectChange } = rowSelectionCallBack // @@ -165,7 +165,9 @@ const ProductList = ({ data, loading, onChange, onRow, filterCallBack, editCallB render: (text: any, record: any) => { return (
- editCallBack('heartbeat', record)}> + + editCallBack('heartbeat', record)}> + editCallBack('edit', record)}> { success_servers: [], fail_servers: [], // [{ip: '111.2322.2342', msg: 'dfefefe'}, {ip: '111.2322.2342', msg: 'dfefefe'},{ip: '111.2322.2342', msg: 'dfefefe'}] }); // Agent部署的结果提示 + const [heartbeatLoading, setHeartbeatLoading] = useState(false) // 1.请求数据 const getTableData = async (query: any) => { @@ -63,11 +64,17 @@ const List = (props: any) => { } else if (type === 'delete') { deleteAgentClick(info) } else if (type === 'heartbeat') { - const res = await heartbeat({id: info.id}) + setHeartbeatLoading(true) + const res = await heartbeat({id: info.id}).catch(()=> setHeartbeatLoading(false)) + setHeartbeatLoading(false) if (res?.code === 200) { - getTableData({ page_num: data.page_num, page_size: data.page_size }) - } else { - message.error(res.msg || formatMessage({ id: 'request.data.failed'})); + const reactNode = res?.data?.info?.split('\n')?.map((item: any)=>
{item}
) + if (res.data.heartbeat === 'ok') { + message.success(ok {reactNode}); + getTableData({ page_num: data.page_num, page_size: data.page_size }) + } else if (res.data.heartbeat === 'fail') { + message.error(fail {reactNode}); + } } } } @@ -173,6 +180,7 @@ const List = (props: any) => { filterCallBack={filterCallBack} editCallBack={addOrEditCallBack} rowSelectionCallBack={{ selectedRowKeys: selectedRowId, onSelectChange: onSelectChange }} + heartbeatLoading={heartbeatLoading} /> -- Gitee From 9943ee0fd33cdfaf6b58d9465d757320b6ddfaa1 Mon Sep 17 00:00:00 2001 From: tianweiweiliang <875658254@qq.com> Date: Fri, 24 Nov 2023 11:04:04 +0800 Subject: [PATCH 3/4] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9loading?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/Agent/AgentList/HeartbeatBtn.tsx | 32 ++++++++++++++++++++++ src/pages/Agent/AgentList/index.tsx | 7 ++--- src/pages/Agent/index.tsx | 17 ++---------- src/pages/Agent/service.ts | 2 +- 4 files changed, 38 insertions(+), 20 deletions(-) create mode 100644 src/pages/Agent/AgentList/HeartbeatBtn.tsx diff --git a/src/pages/Agent/AgentList/HeartbeatBtn.tsx b/src/pages/Agent/AgentList/HeartbeatBtn.tsx new file mode 100644 index 0000000..ffb748e --- /dev/null +++ b/src/pages/Agent/AgentList/HeartbeatBtn.tsx @@ -0,0 +1,32 @@ +import React, { useState, useEffect } from 'react'; +import { Popover, Tooltip, Space, Badge, message, Spin } from 'antd'; +import { FormattedMessage } from 'umi'; +import { agentHeartbeat } from '../service'; + +export default ({ callBack, record }) => { + const [heartbeatLoading, setHeartbeatLoading] = useState(false) + + const heartbeat = async (info)=> { + setHeartbeatLoading(true) + const res = await agentHeartbeat({ id: info.id}).catch(()=> setHeartbeatLoading(false)) + setHeartbeatLoading(false) + if (res?.code === 200) { + const reactNode = res?.data?.info?.split('\n')?.map((item: any)=>
{item}
) + if (res.data.heartbeat === 'ok') { + message.success(ok {reactNode}); + callBack('heartbeat', {}) + } else if (res.data.heartbeat === 'fail') { + message.error(fail {reactNode}); + } + } else { + message.error(res.msg || formatMessage({ id: 'request.data.failed'}) ); + } + } + + return ( + + heartbeat(record)}> + + ) + +} \ No newline at end of file diff --git a/src/pages/Agent/AgentList/index.tsx b/src/pages/Agent/AgentList/index.tsx index 35fde8a..dff1d67 100644 --- a/src/pages/Agent/AgentList/index.tsx +++ b/src/pages/Agent/AgentList/index.tsx @@ -7,9 +7,10 @@ import { PopoverEllipsis, HearBeat } from '@/components/Public'; import SearchInput from '@/components/Public/SearchInput'; import SelectStatus from '@/components/Public/SelectStatus'; import { getLimitAuthority } from '@/utils/utilsHelp'; +import HeartbeatBtn from './HeartbeatBtn'; import styles from './style.less'; -const ProductList = ({ data, loading, onChange, onRow, filterCallBack, editCallBack, rowSelectionCallBack= {}, heartbeatLoading }:any) => { +const ProductList = ({ data, loading, onChange, onRow, filterCallBack, editCallBack, rowSelectionCallBack= {} }:any) => { const { formatMessage } = useIntl(); const { selectedRowKeys = [], onSelectChange } = rowSelectionCallBack // @@ -165,9 +166,7 @@ const ProductList = ({ data, loading, onChange, onRow, filterCallBack, editCallB render: (text: any, record: any) => { return (
- - editCallBack('heartbeat', record)}> - + editCallBack('edit', record)}> { success_servers: [], fail_servers: [], // [{ip: '111.2322.2342', msg: 'dfefefe'}, {ip: '111.2322.2342', msg: 'dfefefe'},{ip: '111.2322.2342', msg: 'dfefefe'}] }); // Agent部署的结果提示 - const [heartbeatLoading, setHeartbeatLoading] = useState(false) // 1.请求数据 const getTableData = async (query: any) => { @@ -64,18 +63,7 @@ const List = (props: any) => { } else if (type === 'delete') { deleteAgentClick(info) } else if (type === 'heartbeat') { - setHeartbeatLoading(true) - const res = await heartbeat({id: info.id}).catch(()=> setHeartbeatLoading(false)) - setHeartbeatLoading(false) - if (res?.code === 200) { - const reactNode = res?.data?.info?.split('\n')?.map((item: any)=>
{item}
) - if (res.data.heartbeat === 'ok') { - message.success(ok {reactNode}); - getTableData({ page_num: data.page_num, page_size: data.page_size }) - } else if (res.data.heartbeat === 'fail') { - message.error(fail {reactNode}); - } - } + getTableData({ page_num: data.page_num, page_size: data.page_size }) } } @@ -180,7 +168,6 @@ const List = (props: any) => { filterCallBack={filterCallBack} editCallBack={addOrEditCallBack} rowSelectionCallBack={{ selectedRowKeys: selectedRowId, onSelectChange: onSelectChange }} - heartbeatLoading={heartbeatLoading} /> diff --git a/src/pages/Agent/service.ts b/src/pages/Agent/service.ts index 86121e0..84da456 100644 --- a/src/pages/Agent/service.ts +++ b/src/pages/Agent/service.ts @@ -47,7 +47,7 @@ export async function agentDelete(params: any) { } // 心跳测试 -export async function heartbeat(params: any) { +export async function agentHeartbeat(params: any) { return request(`/v1/agent/heartbeat`, { method: 'GET', params, -- Gitee From 03932e09668e0df0c1aafa5e186f23dad4bee196 Mon Sep 17 00:00:00 2001 From: tianweiweiliang <875658254@qq.com> Date: Fri, 24 Nov 2023 14:17:56 +0800 Subject: [PATCH 4/4] =?UTF-8?q?fix:=20=E4=B8=8D=E6=98=BE=E7=A4=BA=E5=B8=AE?= =?UTF-8?q?=E5=8A=A9=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/RightContent/index.tsx | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/components/RightContent/index.tsx b/src/components/RightContent/index.tsx index 62b0a9d..576893f 100644 --- a/src/components/RightContent/index.tsx +++ b/src/components/RightContent/index.tsx @@ -32,10 +32,6 @@ const GlobalHeaderRight: React.FC = () => { return ( - - 帮助文档 - - {currentUser.username ? : } {/* {REACT_APP_ENV && ( {REACT_APP_ENV} -- Gitee