添加体位列表及图像视图组件，并整合到大屏幕页面上

src/pages/exam/ContentAreaLarge.tsx

@@ -19,6 +19,7 @@ import {
 import { patientSizes } from '../../states/patientSize';
 import { WorkstationTypeLabels } from '../../states/workstation';
 import { FormattedMessage } from 'react-intl';
+import BodyPositionList from './components/BodyPositionList';
 
 const ContentAreaLarge = () => {
   return (
@@ -27,7 +28,7 @@ const ContentAreaLarge = () => {
         <Card>
           <Row gutter={16}>
             <Col span={6}>
-              <Card>体位列表</Card>
+              <BodyPositionList layout="vertical"></BodyPositionList>
             </Col>
             <Col span={18}>
               <Card>体位详情</Card>

src/pages/exam/components/BodyPositionList.tsx

@@ -0,0 +1,31 @@
+import React, { useState } from 'react';
+import { Button } from 'antd';
+import { PlusOutlined } from '@ant-design/icons';
+import ImageViewer from './ImageViewer';
+
+interface BodyPositionListProps {
+  layout: 'horizontal' | 'vertical';
+}
+
+const BodyPositionList: React.FC<BodyPositionListProps> = ({ layout }) => {
+  const [images, setImages] = useState<string[]>([]);
+
+  const addImage = () => {
+    setImages([...images, 'https://via.placeholder.com/150']);
+  };
+
+  return (
+    <div className={`body-position-list ${layout}`}>
+      {images.map((src, index) => (
+        <ImageViewer key={index} src={src} className="image-viewer-item" />
+      ))}
+      <Button
+        icon={<PlusOutlined />}
+        onClick={addImage}
+        className="add-button"
+      />
+    </div>
+  );
+};
+
+export default BodyPositionList;

src/pages/exam/components/ImageViewer.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import { Image } from 'antd';
+
+interface ImageViewerProps {
+  src: string;
+  alt?: string;
+  className?: string;
+}
+
+const ImageViewer: React.FC<ImageViewerProps> = ({ src, alt, className }) => {
+  return (
+    <div className={`image-viewer ${className}`}>
+      <Image src={src} alt={alt} />
+    </div>
+  );
+};
+
+export default ImageViewer;