fix: date picker (#6325)

This commit is contained in:
Archer
2026-01-27 13:43:06 +08:00
committed by GitHub
parent 1788b80015
commit ee69cecf31
3 changed files with 45 additions and 16 deletions

View File

@@ -40,5 +40,6 @@ curl --location --request POST 'https://{{host}}/api/admin/initv4146' \
## 🐛 修复
1. 系统工具工具集设置系统密钥后,子工具无法读取到设置的系统密钥
2. 日期选择器溢出问题,增加了动态位置适配。
## 插件

View File

@@ -123,7 +123,7 @@
"document/content/docs/upgrading/4-14/4143.mdx": "2025-11-26T20:52:05+08:00",
"document/content/docs/upgrading/4-14/4144.mdx": "2025-12-16T14:56:04+08:00",
"document/content/docs/upgrading/4-14/4145.mdx": "2026-01-18T23:59:15+08:00",
"document/content/docs/upgrading/4-14/41451.mdx": "2026-01-19T19:10:54+08:00",
"document/content/docs/upgrading/4-14/41451.mdx": "2026-01-20T11:53:27+08:00",
"document/content/docs/upgrading/4-14/4146.mdx": "2026-01-19T19:10:54+08:00",
"document/content/docs/upgrading/4-8/40.mdx": "2025-08-02T19:38:37+08:00",
"document/content/docs/upgrading/4-8/41.mdx": "2025-08-02T19:38:37+08:00",

View File

@@ -35,20 +35,49 @@ const DateTimePicker = ({
}, [selectedDateTime]);
useEffect(() => {
if (showSelected && containerRef.current) {
const rect = containerRef.current.getBoundingClientRect();
if (popPosition === 'top') {
setPosition({
top: rect.top - 4,
left: rect.left
});
} else {
setPosition({
top: rect.bottom + 4,
left: rect.left
});
if (!showSelected) return;
const updatePosition = () => {
const rect = containerRef.current?.getBoundingClientRect();
const popoverRect = popoverRef.current?.getBoundingClientRect();
if (!rect || !popoverRect) return;
const padding = 8;
const topBottom = rect.bottom + 4;
const topTop = rect.top - 4 - popoverRect.height;
const maxTop = window.innerHeight - popoverRect.height - padding;
const maxLeft = window.innerWidth - popoverRect.width - padding;
let top = popPosition === 'top' ? topTop : topBottom;
if (
popPosition === 'bottom' &&
topBottom + popoverRect.height > window.innerHeight - padding &&
topTop >= padding
) {
top = topTop;
}
}
if (
popPosition === 'top' &&
topTop < padding &&
topBottom + popoverRect.height <= window.innerHeight - padding
) {
top = topBottom;
}
top = Math.min(Math.max(top, padding), Math.max(padding, maxTop));
let left = rect.left;
left = Math.min(Math.max(left, padding), Math.max(padding, maxLeft));
setPosition({ top, left });
};
const raf = requestAnimationFrame(updatePosition);
window.addEventListener('resize', updatePosition);
window.addEventListener('scroll', updatePosition, true);
return () => {
cancelAnimationFrame(raf);
window.removeEventListener('resize', updatePosition);
window.removeEventListener('scroll', updatePosition, true);
};
}, [showSelected, popPosition]);
// 点击外部关闭
@@ -99,8 +128,7 @@ const DateTimePicker = ({
<Card
ref={popoverRef}
position={'fixed'}
top={popPosition === 'top' ? 'auto' : `${position.top}px`}
bottom={popPosition === 'top' ? `${window.innerHeight - position.top}px` : 'auto'}
top={`${position.top}px`}
left={`${position.left}px`}
zIndex={1500}
css={{