fix: UI调试

This commit is contained in:
zdl
2025-11-27 18:27:44 +08:00
parent 589e1c20f9
commit 34338373cd
3 changed files with 92 additions and 59 deletions

View File

@@ -826,8 +826,8 @@ const TransmissionChainAnalysis = ({ eventId }) => {
<Modal isOpen={isModalOpen} onClose={handleCloseModal} size="xl">
<ModalOverlay />
<ModalContent maxH="80vh" bg={modalBgColor}>
<ModalHeader borderBottom="1px solid" borderColor={modalBorderColor}>
<HStack justify="space-between">
<ModalHeader borderBottom="1px solid" borderColor={modalBorderColor} pr={12}>
<HStack justify="space-between" pr={2}>
<Text color={PROFESSIONAL_COLORS.text.primary}>{selectedNode ? '节点详情' : '传导链分析'}</Text>
{selectedNode && (
<Badge
@@ -841,7 +841,10 @@ const TransmissionChainAnalysis = ({ eventId }) => {
)}
</HStack>
</ModalHeader>
<ModalCloseButton />
<ModalCloseButton
color={PROFESSIONAL_COLORS.text.secondary}
_hover={{ bg: 'rgba(255, 255, 255, 0.1)' }}
/>
<ModalBody overflowY="auto">
{selectedNode ? (
@@ -1084,11 +1087,15 @@ const TransmissionChainAnalysis = ({ eventId }) => {
prefix="机制:"
prefixStyle={{ fontSize: 12, color: PROFESSIONAL_COLORS.text.secondary, fontWeight: 'bold' }}
textColor={PROFESSIONAL_COLORS.text.primary}
containerStyle={{ marginTop: 8 }}
containerStyle={{
marginTop: 8,
backgroundColor: 'transparent',
padding: 0,
}}
showAIBadge={false}
/>
) : parent.transmission_mechanism ? (
<Text fontSize="xs" color="gray.600">
<Text fontSize="xs" color={PROFESSIONAL_COLORS.text.secondary}>
机制: {parent.transmission_mechanism}AI合成
</Text>
) : null}
@@ -1105,23 +1112,42 @@ const TransmissionChainAnalysis = ({ eventId }) => {
{/* 影响输出 */}
{(() => {
const targetsFromAPI = nodeDetail && nodeDetail.children && nodeDetail.children.length > 0;
if (targetsFromAPI) {
return (
<Box>
<Text fontWeight="bold" mb={2} color="blue.600">
影响输出 ({nodeDetail.children.length})
<Text fontWeight="bold" mb={2} color={PROFESSIONAL_COLORS.gold[500]}>
影响输出 ({nodeDetail.children.length})AI合成
</Text>
<List spacing={2}>
{nodeDetail.children.map((child, index) => (
<ListItem key={index} p={2} bg="gray.50" borderRadius="md" borderLeft="3px solid" borderColor="orange.300" position="relative">
<ListItem
key={index}
p={2}
bg={PROFESSIONAL_COLORS.background.secondary}
borderRadius="md"
borderLeft="3px solid"
borderColor="#FB923C"
position="relative"
>
{child.direction && (
<Box position="absolute" top={2} right={2} zIndex={1}>
<Badge
colorScheme={
child.direction === 'positive' ? 'green' :
child.direction === 'negative' ? 'red' :
'gray'
bg={
child.direction === 'positive' ? 'rgba(16, 185, 129, 0.15)' :
child.direction === 'negative' ? 'rgba(239, 68, 68, 0.15)' :
'rgba(107, 114, 128, 0.15)'
}
color={
child.direction === 'positive' ? '#10B981' :
child.direction === 'negative' ? '#EF4444' :
'#6B7280'
}
borderWidth="1px"
borderColor={
child.direction === 'positive' ? '#10B981' :
child.direction === 'negative' ? '#EF4444' :
'#6B7280'
}
size="sm"
>
@@ -1132,7 +1158,7 @@ const TransmissionChainAnalysis = ({ eventId }) => {
</Box>
)}
<VStack align="stretch" spacing={1}>
<Text fontWeight="bold" fontSize="sm" pr={child.direction ? 20 : 0}>{child.name}</Text>
<Text fontWeight="bold" fontSize="sm" color={PROFESSIONAL_COLORS.text.primary} pr={child.direction ? 20 : 0}>{child.name}</Text>
{child.transmission_mechanism?.data ? (
<CitedContent
data={child.transmission_mechanism}
@@ -1140,11 +1166,15 @@ const TransmissionChainAnalysis = ({ eventId }) => {
prefix="机制:"
prefixStyle={{ fontSize: 12, color: PROFESSIONAL_COLORS.text.secondary, fontWeight: 'bold' }}
textColor={PROFESSIONAL_COLORS.text.primary}
containerStyle={{ marginTop: 8 }}
containerStyle={{
marginTop: 8,
backgroundColor: 'transparent',
padding: 0,
}}
showAIBadge={false}
/>
) : child.transmission_mechanism ? (
<Text fontSize="xs" color="gray.600">
<Text fontSize="xs" color={PROFESSIONAL_COLORS.text.secondary}>
机制: {child.transmission_mechanism}AI合成
</Text>
) : null}
@@ -1169,7 +1199,14 @@ const TransmissionChainAnalysis = ({ eventId }) => {
</ModalBody>
<ModalFooter borderTop="1px solid" borderColor={modalBorderColor}>
<Button onClick={handleCloseModal}>关闭</Button>
<Button
onClick={handleCloseModal}
variant="ghost"
color={PROFESSIONAL_COLORS.text.secondary}
_hover={{ bg: 'rgba(255, 255, 255, 0.1)' }}
>
关闭
</Button>
</ModalFooter>
</ModalContent>
</Modal>