community增加事件详情

src/views/Community/components/HeroPanel.js

@@ -1195,30 +1195,31 @@ const DetailModal = ({ isOpen, onClose, selectedDate, ztDetail, events, loading
         </DrawerContent>
       </Drawer>
 
-      {/* 相关股票详情抽屉 */}
+      {/* 相关股票弹窗 */}
-      <Drawer
+      <Modal
         isOpen={stocksDrawerVisible}
-        placement="right"
-        size="xl"
         onClose={() => {
           setStocksDrawerVisible(false);
           setExpandedReasons({});
         }}
+        size="6xl"
+        scrollBehavior="inside"
       >
-        <DrawerOverlay bg="blackAlpha.600" />
+        <ModalOverlay bg="blackAlpha.700" backdropFilter={GLASS_BLUR.sm} />
-        <DrawerContent
+        <ModalContent
+          maxW="1100px"
+          maxH="85vh"
           bg="linear-gradient(135deg, rgba(15,15,30,0.98) 0%, rgba(25,25,50,0.98) 100%)"
-          borderLeft="1px solid rgba(255,215,0,0.2)"
+          border="1px solid rgba(255,215,0,0.2)"
-          maxW="1000px"
+          borderRadius="2xl"
         >
-          <DrawerCloseButton color="whiteAlpha.600" />
+          <ModalHeader borderBottom="1px solid rgba(255,215,0,0.2)" py={4}>
-          <DrawerHeader borderBottom="1px solid rgba(255,215,0,0.2)" color="white">
             <HStack spacing={3}>
               <StockOutlined style={{ color: '#FFD700', fontSize: '20px' }} />
               <VStack align="start" spacing={0}>
-                <Text fontSize="lg">相关股票</Text>
+                <Text fontSize="lg" color="white">相关股票</Text>
                 {selectedEventTitle && (
-                  <Text fontSize="sm" color="whiteAlpha.600" fontWeight="normal" noOfLines={1} maxW="600px">
+                  <Text fontSize="sm" color="whiteAlpha.600" fontWeight="normal" noOfLines={1} maxW="800px">
                     {selectedEventTitle}
                   </Text>
                 )}
@@ -1228,25 +1229,27 @@ const DetailModal = ({ isOpen, onClose, selectedDate, ztDetail, events, loading
               </Badge>
               {stockQuotesLoading && <Spin size="small" />}
             </HStack>
-          </DrawerHeader>
+          </ModalHeader>
-          <DrawerBody py={4} className="hero-panel-modal">
+          <ModalCloseButton color="whiteAlpha.600" />
+          <ModalBody py={4} className="hero-panel-modal">
             {selectedEventStocks && selectedEventStocks.length > 0 ? (
-              <Table
+              <Box maxH="calc(85vh - 120px)" overflowY="auto">
-                dataSource={selectedEventStocks}
+                <Table
-                columns={stockColumns}
+                  dataSource={selectedEventStocks}
-                rowKey={(record) => record.code}
+                  columns={stockColumns}
-                size="middle"
+                  rowKey={(record) => record.code}
-                pagination={false}
+                  size="middle"
-                scroll={{ y: 500 }}
+                  pagination={false}
-              />
+                />
+              </Box>
             ) : (
               <Center h="200px">
                 <Text color="whiteAlpha.500">暂无相关股票</Text>
               </Center>
             )}
-          </DrawerBody>
+          </ModalBody>
-        </DrawerContent>
+        </ModalContent>
-      </Drawer>
+      </Modal>
     </>
   );
 };