Browse Source

为体位详情组件添加注释,微调第二行,使第二行包含的三部分内容变成横向排列

dengdx 1 month ago
parent
commit
066751c56c
1 changed files with 12 additions and 4 deletions
  1. 12 4
      src/pages/exam/components/BodyPositionDetail.tsx

+ 12 - 4
src/pages/exam/components/BodyPositionDetail.tsx

@@ -9,16 +9,21 @@ const BodyPositionDetail: React.FC = () => {
   return (
     <Card className="p-4">
       <Row gutter={[16, 16]}>
-        <Col span={24}>
+        {/* 第一行 : 患者姓名*/}
+        <Col span={24} className="text-center">
           <Title level={4}>Patient Name</Title>
         </Col>
-        <Col span={24}>
+        {/* 第二行 :患者id,登记号,study描述*/}
+        <Col span={8}>
           <Text>Patient ID: 12345</Text>
-          <br />
+        </Col>
+        <Col span={8}>
           <Text>Registration Number: 67890</Text>
-          <br />
+        </Col>
+        <Col span={8}>
           <Text>Study Description: Example Study</Text>
         </Col>
+        {/* 第三行 :体位示意图*/}
         <Col span={24}>
           <div className="flex justify-center">
             <img
@@ -28,9 +33,11 @@ const BodyPositionDetail: React.FC = () => {
             />
           </div>
         </Col>
+        {/* 第四行 :体位描述*/}
         <Col span={24}>
           <Text>View Description: Example View</Text>
         </Col>
+        {/* 第五行 :设备信息*/}
         <Col span={24}>
           <div className="flex items-center">
             <Image src={CollimatorIcon} alt="Logo" height={'100%'} />
@@ -39,6 +46,7 @@ const BodyPositionDetail: React.FC = () => {
             <Text>Collimator Width: 50mm</Text>
           </div>
         </Col>
+        {/* 第六行 */}
         <Col span={24}>
           <div className="flex items-center">
             <Image src={SidIcon} alt="Logo" className="mr-2" height={'100%'} />