Add scope select to online statistic
This commit is contained in:
4
src/global.d.ts
vendored
4
src/global.d.ts
vendored
@@ -385,3 +385,7 @@ interface OnlineInfoVo {
|
|||||||
record: string
|
record: string
|
||||||
}[]
|
}[]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface OnlineInfoGetParam {
|
||||||
|
scope: string
|
||||||
|
}
|
||||||
|
|||||||
@@ -156,6 +156,7 @@ const OnlineInfo: React.FC = () => {
|
|||||||
const onlineInfoEChartsRef = useRef<echarts.EChartsType | null>(null)
|
const onlineInfoEChartsRef = useRef<echarts.EChartsType | null>(null)
|
||||||
const [isLoading, setIsLoading] = useState(false)
|
const [isLoading, setIsLoading] = useState(false)
|
||||||
const [currentOnlineCount, setCurrentOnlineCount] = useState(-1)
|
const [currentOnlineCount, setCurrentOnlineCount] = useState(-1)
|
||||||
|
const [scope, setScope] = useState('WEAK')
|
||||||
|
|
||||||
useUpdatedEffect(() => {
|
useUpdatedEffect(() => {
|
||||||
const chartResizeObserver = new ResizeObserver(() => {
|
const chartResizeObserver = new ResizeObserver(() => {
|
||||||
@@ -173,14 +174,23 @@ const OnlineInfo: React.FC = () => {
|
|||||||
getOnlineInfo()
|
getOnlineInfo()
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
const getOnlineInfo = () => {
|
const handleOnScopeChange = (value: string) => {
|
||||||
|
setScope(value)
|
||||||
|
getOnlineInfo(value)
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleOnRefresh = () => {
|
||||||
|
getOnlineInfo()
|
||||||
|
}
|
||||||
|
|
||||||
|
const getOnlineInfo = (_scope: string = scope) => {
|
||||||
if (isLoading) {
|
if (isLoading) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
setIsLoading(true)
|
setIsLoading(true)
|
||||||
|
|
||||||
void r_sys_statistic_online().then((res) => {
|
void r_sys_statistic_online({ scope: _scope }).then((res) => {
|
||||||
const response = res.data
|
const response = res.data
|
||||||
if (response.success) {
|
if (response.success) {
|
||||||
const data = response.data
|
const data = response.data
|
||||||
@@ -224,15 +234,30 @@ const OnlineInfo: React.FC = () => {
|
|||||||
<>
|
<>
|
||||||
<FlexBox gap={10} direction={'horizontal'}>
|
<FlexBox gap={10} direction={'horizontal'}>
|
||||||
<span style={{ whiteSpace: 'nowrap' }}>在线用户</span>
|
<span style={{ whiteSpace: 'nowrap' }}>在线用户</span>
|
||||||
<AntdTag>当前 {currentOnlineCount}</AntdTag>
|
<AntdTag>
|
||||||
|
当前 {currentOnlineCount === -1 ? '获取中...' : currentOnlineCount}
|
||||||
|
</AntdTag>
|
||||||
</FlexBox>
|
</FlexBox>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
loading={isLoading}
|
loading={isLoading}
|
||||||
expand={
|
expand={
|
||||||
<AntdButton title={'刷新'} onClick={() => getOnlineInfo()}>
|
<>
|
||||||
|
<AntdSelect value={scope} onChange={handleOnScopeChange} disabled={isLoading}>
|
||||||
|
<AntdSelect.Option key={'DAY'}>今天</AntdSelect.Option>
|
||||||
|
<AntdSelect.Option key={'WEAK'}>最近7天</AntdSelect.Option>
|
||||||
|
<AntdSelect.Option key={'MONTH'}>最近30天</AntdSelect.Option>
|
||||||
|
<AntdSelect.Option key={'QUARTER'}>最近3个月</AntdSelect.Option>
|
||||||
|
<AntdSelect.Option key={'YEAR'}>最近12个月</AntdSelect.Option>
|
||||||
|
<AntdSelect.Option key={'TWO_YEARS'}>最近2年</AntdSelect.Option>
|
||||||
|
<AntdSelect.Option key={'THREE_YEARS'}>最近3年</AntdSelect.Option>
|
||||||
|
<AntdSelect.Option key={'FIVE_YEARS'}>最近5年</AntdSelect.Option>
|
||||||
|
<AntdSelect.Option key={'ALL'}>全部</AntdSelect.Option>
|
||||||
|
</AntdSelect>
|
||||||
|
<AntdButton title={'刷新'} onClick={handleOnRefresh} disabled={isLoading}>
|
||||||
<Icon component={IconFatwebRefresh} />
|
<Icon component={IconFatwebRefresh} />
|
||||||
</AntdButton>
|
</AntdButton>
|
||||||
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<FlexBox className={'card-content'} direction={'horizontal'}>
|
<FlexBox className={'card-content'} direction={'horizontal'}>
|
||||||
|
|||||||
@@ -88,4 +88,5 @@ export const r_sys_statistic_cpu = () => request.get<CpuInfoVo>(URL_SYS_STATISTI
|
|||||||
|
|
||||||
export const r_sys_statistic_storage = () => request.get<StorageInfoVo>(URL_SYS_STATISTIC_STORAGE)
|
export const r_sys_statistic_storage = () => request.get<StorageInfoVo>(URL_SYS_STATISTIC_STORAGE)
|
||||||
|
|
||||||
export const r_sys_statistic_online = () => request.get<OnlineInfoVo>(URL_SYS_STATISTIC_ONLINE)
|
export const r_sys_statistic_online = (param: OnlineInfoGetParam) =>
|
||||||
|
request.get<OnlineInfoVo>(URL_SYS_STATISTIC_ONLINE, param)
|
||||||
|
|||||||
Reference in New Issue
Block a user