54 lines
1.3 KiB
TypeScript
54 lines
1.3 KiB
TypeScript
|
import { useEffect, useState } from "react";
|
||
|
|
import { InfoRounded } from "@mui/icons-material";
|
||
|
|
import { ClickAwayListener, Tooltip } from "@mui/material";
|
||
|
|
import { getSystemProxy } from "../services/cmds";
|
||
|
|
|
||
|
|
const SysproxyTooltip = () => {
|
||
|
|
const [open, setOpen] = useState(false);
|
||
|
|
const [info, setInfo] = useState<any>({});
|
||
|
|
|
||
|
|
const onShow = async () => {
|
||
|
|
const data = await getSystemProxy();
|
||
|
|
console.log(data);
|
||
|
|
setInfo(data ?? {});
|
||
|
|
setOpen(true);
|
||
|
|
};
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
if (!open) return;
|
||
|
|
const timer = setTimeout(() => setOpen(false), 2000);
|
||
|
|
return () => clearTimeout(timer);
|
||
|
|
}, [open]);
|
||
|
|
|
||
|
|
// todo: add error info
|
||
|
|
const showTitle = (
|
||
|
|
<div>
|
||
|
|
<div>Enable: {(!!info.enable).toString()}</div>
|
||
|
|
<div>Server: {info.server}</div>
|
||
|
|
<div>Bypass: {info.bypass}</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<ClickAwayListener onClickAway={() => setOpen(false)}>
|
||
|
|
<Tooltip
|
||
|
|
PopperProps={{
|
||
|
|
disablePortal: true,
|
||
|
|
}}
|
||
|
|
onClose={() => setOpen(false)}
|
||
|
|
open={open}
|
||
|
|
disableFocusListener
|
||
|
|
disableHoverListener
|
||
|
|
disableTouchListener
|
||
|
|
placement="top"
|
||
|
|
title={showTitle}
|
||
|
|
arrow
|
||
|
|
>
|
||
|
|
<InfoRounded fontSize="small" onClick={onShow} />
|
||
|
|
</Tooltip>
|
||
|
|
</ClickAwayListener>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default SysproxyTooltip;
|