更新Company页面的UI为FUI风格
This commit is contained in:
@@ -635,27 +635,8 @@ const [currentMode, setCurrentMode] = useState('vertical');
|
||||
mx={0}
|
||||
display="flex"
|
||||
flexDirection="column"
|
||||
overflowX={mode === 'mainline' ? 'auto' : 'visible'}
|
||||
overflowY="visible"
|
||||
overflow="visible"
|
||||
zIndex={1}
|
||||
css={mode === 'mainline' ? {
|
||||
"&::-webkit-scrollbar": {
|
||||
height: "10px",
|
||||
background: "#2d3748",
|
||||
},
|
||||
"&::-webkit-scrollbar-track": {
|
||||
background: "#2d3748",
|
||||
borderRadius: "5px",
|
||||
},
|
||||
"&::-webkit-scrollbar-thumb": {
|
||||
background: "linear-gradient(90deg, #718096, #8a9bb0)",
|
||||
borderRadius: "5px",
|
||||
border: "2px solid #2d3748",
|
||||
},
|
||||
"&::-webkit-scrollbar-thumb:hover": {
|
||||
background: "linear-gradient(90deg, #a0aec0, #b8c5d4)",
|
||||
},
|
||||
} : undefined}
|
||||
>
|
||||
{/* 内容区域 - 撑满剩余高度 */}
|
||||
<Box flex="1" minH={0} position="relative">
|
||||
|
||||
@@ -62,7 +62,7 @@ const EventScrollList = React.memo(
|
||||
return (
|
||||
<Box
|
||||
ref={scrollContainerRef}
|
||||
overflow={mode === "mainline" ? "visible" : "hidden"}
|
||||
overflow="visible"
|
||||
h="100%"
|
||||
pt={0}
|
||||
pb={mode === "mainline" ? 0 : 4}
|
||||
|
||||
@@ -784,8 +784,7 @@ const MainlineTimelineViewComponent = forwardRef(
|
||||
return (
|
||||
<Box
|
||||
display={display}
|
||||
w="max-content"
|
||||
minW="100%"
|
||||
w="100%"
|
||||
bg={COLORS.containerBg}
|
||||
>
|
||||
{/* 顶部统计栏 - 固定不滚动 */}
|
||||
@@ -935,37 +934,61 @@ const MainlineTimelineViewComponent = forwardRef(
|
||||
</HStack>
|
||||
</Flex>
|
||||
|
||||
{/* 主线卡片横向排列容器 */}
|
||||
<HStack
|
||||
spacing={3}
|
||||
p={3}
|
||||
align="stretch"
|
||||
w="max-content"
|
||||
{/* 横向滚动容器 - 滚动条在卡片上方 */}
|
||||
<Box
|
||||
overflowX="auto"
|
||||
overflowY="visible"
|
||||
pb={2}
|
||||
css={{
|
||||
"&::-webkit-scrollbar": {
|
||||
height: "10px",
|
||||
},
|
||||
"&::-webkit-scrollbar-track": {
|
||||
background: COLORS.scrollbarTrackBg,
|
||||
borderRadius: "5px",
|
||||
},
|
||||
"&::-webkit-scrollbar-thumb": {
|
||||
background: COLORS.scrollbarThumbBg,
|
||||
borderRadius: "5px",
|
||||
},
|
||||
"&::-webkit-scrollbar-thumb:hover": {
|
||||
background: COLORS.scrollbarThumbHoverBg,
|
||||
},
|
||||
}}
|
||||
>
|
||||
{mainlines.map((mainline) => {
|
||||
const groupId =
|
||||
mainline.group_id ||
|
||||
mainline.lv2_id ||
|
||||
mainline.lv1_id ||
|
||||
"ungrouped";
|
||||
const groupName =
|
||||
mainline.group_name ||
|
||||
mainline.lv2_name ||
|
||||
mainline.lv1_name ||
|
||||
"其他";
|
||||
return (
|
||||
<MainlineCard
|
||||
key={groupId}
|
||||
mainline={mainline}
|
||||
colorScheme={getColorScheme(groupName)}
|
||||
isExpanded={expandedGroups[groupId]}
|
||||
onToggle={() => toggleGroup(groupId)}
|
||||
selectedEvent={selectedEvent}
|
||||
onEventSelect={onEventSelect}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</HStack>
|
||||
{/* 主线卡片横向排列容器 */}
|
||||
<HStack
|
||||
spacing={3}
|
||||
p={3}
|
||||
pt={1}
|
||||
align="stretch"
|
||||
w="max-content"
|
||||
>
|
||||
{mainlines.map((mainline) => {
|
||||
const groupId =
|
||||
mainline.group_id ||
|
||||
mainline.lv2_id ||
|
||||
mainline.lv1_id ||
|
||||
"ungrouped";
|
||||
const groupName =
|
||||
mainline.group_name ||
|
||||
mainline.lv2_name ||
|
||||
mainline.lv1_name ||
|
||||
"其他";
|
||||
return (
|
||||
<MainlineCard
|
||||
key={groupId}
|
||||
mainline={mainline}
|
||||
colorScheme={getColorScheme(groupName)}
|
||||
isExpanded={expandedGroups[groupId]}
|
||||
onToggle={() => toggleGroup(groupId)}
|
||||
selectedEvent={selectedEvent}
|
||||
onEventSelect={onEventSelect}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</HStack>
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user