Browse Source

使已选列表区域自动出现滚动条

dengdx 2 months ago
parent
commit
553a208cba

+ 5 - 18
src/pages/patient/components/register.selected.view.list.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Card, Grid, Button, Row } from 'antd';
+import { Card, Grid, Button, Row, Flex } from 'antd';
 import { CloseOutlined } from '@ant-design/icons';
 import { FormattedMessage } from 'react-intl';
 import { useSelector } from 'react-redux';
@@ -39,7 +39,7 @@ const SelectedProtocolList: React.FC<SelectedProtocolListProps> = () => {
   };
 
   return (
-    <Row>
+    <Row className="h-full overflow-auto">
       {selectedViews.map((item: View) => (
         <Card
           key={item.internal_id}
@@ -47,22 +47,9 @@ const SelectedProtocolList: React.FC<SelectedProtocolListProps> = () => {
           style={{
             width: cardSize.width,
             height: cardSize.height,
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            position: 'relative',
-            marginBottom: 16,
-            marginRight: 16,
           }}
         >
-          <div
-            style={{
-              display: 'flex',
-              flexDirection: 'column',
-              alignItems: 'center',
-            }}
-            className="overflow-clip"
-          >
+          <Flex>
             <img
               alt="example"
               src="https://os.alipayobjects.com/rmsportal/QBnOOoLaAfKPirc.png"
@@ -72,8 +59,8 @@ const SelectedProtocolList: React.FC<SelectedProtocolListProps> = () => {
                 objectFit: 'cover',
               }}
             />
-            <span style={{ marginTop: 4 }}>{item.view_name}</span>
-          </div>
+            <span>{item.view_name}</span>
+          </Flex>
           <Button
             type="text"
             size="small"

+ 1 - 1
src/pages/patient/register.tsx

@@ -56,7 +56,7 @@ const RegisterPage: React.FC = () => {
           <Col xs={24} sm={24} md={8} lg={8} xl={8} xxl={8} className="h-full">
             <RegisterAvailableList />
           </Col>
-          <Col xs={24} sm={24} md={8} lg={8} xl={8} xxl={8}>
+          <Col xs={24} sm={24} md={8} lg={8} xl={8} xxl={8} className="h-full">
             <SelectedProtocolList />
           </Col>
         </Row>