update pay function

src/components/StockChart/KLineChartModal.tsx

@@ -15,6 +15,7 @@ import {
   CircularProgress,
   Alert,
   AlertIcon,
+  Portal,
 } from '@chakra-ui/react';
 import * as echarts from 'echarts';
 import { stockService } from '@services/eventService';
@@ -459,20 +460,30 @@ const KLineChartModal: React.FC<KLineChartModalProps> = ({
 
   if (!stock) return null;
 
+  // 计算实际使用的 z-index
+  const overlayZIndex = zIndex || 1400;
+  const contentZIndex = zIndex ? zIndex + 1 : 1401;
+
+  console.log('[KLineChartModal] z-index 设置:', {
+    overlayZIndex,
+    contentZIndex,
+  });
+
   return (
-    <Modal isOpen={isOpen} onClose={onClose} size={size}>
-      <ModalOverlay
-        bg="blackAlpha.700"
-        sx={zIndex ? { zIndex: zIndex } : undefined}
-      />
-      <ModalContent
-        maxW="90vw"
-        maxH="85vh"
-        bg="#1a1a1a"
-        borderColor="#404040"
-        borderWidth="1px"
-        sx={zIndex ? { zIndex: zIndex + 1 } : undefined}
-      >
+    <Portal>
+      <Modal isOpen={isOpen} onClose={onClose} size={size}>
+        <ModalOverlay
+          bg="blackAlpha.700"
+          style={{ zIndex: overlayZIndex }}
+        />
+        <ModalContent
+          maxW="90vw"
+          maxH="85vh"
+          bg="#1a1a1a"
+          borderColor="#404040"
+          borderWidth="1px"
+          style={{ zIndex: contentZIndex }}
+        >
         <ModalHeader pb={3} borderBottomWidth="1px" borderColor="#404040">
           <VStack align="flex-start" spacing={1}>
             <HStack spacing={3}>
@@ -528,6 +539,7 @@ const KLineChartModal: React.FC<KLineChartModalProps> = ({
         </ModalBody>
       </ModalContent>
     </Modal>
+    </Portal>
   );
 };