diff --git a/frontend/packages/common/src/components/aoplatform/TableBtnWithPermission.tsx b/frontend/packages/common/src/components/aoplatform/TableBtnWithPermission.tsx index f84b21bb..b6087974 100644 --- a/frontend/packages/common/src/components/aoplatform/TableBtnWithPermission.tsx +++ b/frontend/packages/common/src/components/aoplatform/TableBtnWithPermission.tsx @@ -37,6 +37,8 @@ const TableIconName = { const TableBtnWithPermission = ({ btnTitle, access, tooltip, disabled, navigateTo, onClick, className, btnType }: TableBtnWithPermissionProps) => { const [btnAccess, setBtnAccess] = useState(false) + const [btnStatus, setBtnStatus] = useState(false) + const [closeToolTip, setCloseToolTip] = useState(false) const { accessData, checkPermission, accessInit } = useGlobalContext() const navigate = useNavigate() const lastAccess = useMemo(() => { @@ -52,16 +54,27 @@ const TableBtnWithPermission = ({ btnTitle, access, tooltip, disabled, navigateT const handleClick = useCallback((e: React.MouseEvent) => { e.stopPropagation() + setTimeout(() => { + setBtnStatus(false) + setCloseToolTip(true) + }) + navigateTo ? navigate(navigateTo) : onClick?.() }, [navigateTo, navigate, onClick]) - + const changeTooltipStatus = (open: boolean) => { + setBtnStatus(open) + if (closeToolTip) { + setBtnStatus(false) + setCloseToolTip(false) + } + } return (<>{ !btnAccess || (disabled && tooltip) ? : - + diff --git a/frontend/packages/common/src/components/aoplatform/TimeRangeSelector.tsx b/frontend/packages/common/src/components/aoplatform/TimeRangeSelector.tsx index 2ee576ef..9908f023 100644 --- a/frontend/packages/common/src/components/aoplatform/TimeRangeSelector.tsx +++ b/frontend/packages/common/src/components/aoplatform/TimeRangeSelector.tsx @@ -26,9 +26,11 @@ type TimeRangeSelectorProps = { onTimeButtonChange: (time: TimeRangeButton) => void labelSize?: 'small' | 'default' bindRef?: any + hideBtns?: TimeRangeButton[] + defaultTimeButton?: TimeRangeButton } const TimeRangeSelector = (props: TimeRangeSelectorProps) => { - const { initialTimeButton, initialDatePickerValue, onTimeRangeChange, hideTitle, onTimeButtonChange, labelSize = 'default', bindRef } = props + const { initialTimeButton, initialDatePickerValue, onTimeRangeChange, hideTitle, onTimeButtonChange, labelSize = 'default', bindRef, hideBtns = [], defaultTimeButton = 'hour' } = props const [timeButton, setTimeButton] = useState(initialTimeButton || ''); const [datePickerValue, setDatePickerValue] = useState(initialDatePickerValue || [null, null]); useEffect(() => { @@ -37,7 +39,7 @@ const TimeRangeSelector = (props: TimeRangeSelectorProps) => { } }, [bindRef]) // 根据选择的时间范围计算开始和结束时间 - const calculateTimeRange = (curBtn: 'hour' | 'day' | 'threeDays' | 'sevenDays') => { + const calculateTimeRange = (curBtn: TimeRangeButton) => { const currentSecond = Math.floor(Date.now() / 1000); // 当前秒级时间戳 let startMin = currentSecond - 60 * 60 switch (curBtn) { @@ -75,15 +77,15 @@ const TimeRangeSelector = (props: TimeRangeSelectorProps) => { calculateTimeRange(e.target.value); }; const reset = () => { - setTimeButton('hour') - calculateTimeRange('hour') + setTimeButton(defaultTimeButton) + calculateTimeRange(defaultTimeButton) setDatePickerValue(null) } // 处理日期选择器的变化 const handleDatePickerChange = (dates: RangeValue) => { - setTimeButton(dates ? '' : 'hour') - onTimeButtonChange?.(dates ? '' : 'hour') + setTimeButton(dates ? '' : defaultTimeButton) + onTimeButtonChange?.(dates ? '' : defaultTimeButton) setDatePickerValue(dates); if (dates && Array.isArray(dates) && dates.length === 2) { const [startDate, endDate] = dates; @@ -94,7 +96,7 @@ const TimeRangeSelector = (props: TimeRangeSelectorProps) => { } } if (!dates) { - calculateTimeRange('hour') + calculateTimeRange(defaultTimeButton) } }; @@ -109,10 +111,10 @@ const TimeRangeSelector = (props: TimeRangeSelectorProps) => {
{!hideTitle && } - {$t('近1小时')} - {$t('近24小时')} - {$t('近3天')} - {$t('近7天')} + {hideBtns?.length && hideBtns.includes('hour') ? null : {$t('近1小时')}} + {hideBtns?.length && hideBtns.includes('day') ? null : {$t('近24小时')}} + {hideBtns?.length && hideBtns.includes('threeDays') ? null : {$t('近3天')}} + {hideBtns?.length && hideBtns.includes('sevenDays') ? null : {$t('近7天')}} [] = [ filters: true, onFilter: false , ellipsis: true, - width: 140, + width: 110, valueEnum: new Map( Object.keys(StrategyStatusEnum).map(key=> [key, @@ -40,6 +40,7 @@ export const DATA_MASKING_TABLE_COLUMNS: PageProColumns[] = [ filters: true, onFilter: false , ellipsis: true, + width: 90, valueEnum: { false: { text: {$t('启用')} }, true: { text: {$t('禁用')} } @@ -53,7 +54,8 @@ export const DATA_MASKING_TABLE_COLUMNS: PageProColumns[] = [ { title: ('处理数'), dataIndex: 'processedTotal', - ellipsis: true + ellipsis: true, + width: 80, }, { title: ('更新者'), diff --git a/frontend/packages/core/src/pages/policy/dataMasking/DataMaskingLogModal.tsx b/frontend/packages/core/src/pages/policy/dataMasking/DataMaskingLogModal.tsx index fdab84a4..50980da7 100644 --- a/frontend/packages/core/src/pages/policy/dataMasking/DataMaskingLogModal.tsx +++ b/frontend/packages/core/src/pages/policy/dataMasking/DataMaskingLogModal.tsx @@ -21,7 +21,7 @@ const DataMaskingLogModal = (props: any) => { const [datePickerValue, setDatePickerValue] = useState(); const currentSecond = Math.floor(Date.now() / 1000); // 当前秒级时间戳 const [queryData, setQueryData] = useState({ - start: currentSecond - 60 * 60, + start: currentSecond - 24 * 60 * 60, end: currentSecond }) /** @@ -43,7 +43,7 @@ const DataMaskingLogModal = (props: any) => { /** * 时间按钮 */ - const [timeButton, setTimeButton] = useState<'' | 'hour' | 'day' | 'threeDays' | 'sevenDays'>('hour'); + const [timeButton, setTimeButton] = useState<'' | 'hour' | 'day' | 'threeDays' | 'sevenDays'>('day'); /** * 绑定时间范围组件 * @param instance @@ -84,7 +84,7 @@ const DataMaskingLogModal = (props: any) => { const columns = useMemo(() => { const res = DATA_MASKING_TABLE_LOG_COLUMNS.map(x => { if (x.dataIndex === 'url') { - x.render = (text: any, record: any) => <>{record.method} {text} + x.render = (text: any, record: any) => <>
{record.method} {text}
} return { ...x, @@ -161,6 +161,8 @@ const DataMaskingLogModal = (props: any) => {