Browse Source

精简布局元素,去掉card,card不再作为中间填充元素

sw 1 week ago
parent
commit
488e4677df
1 changed files with 190 additions and 199 deletions
  1. 190 199
      src/pages/exam/ContentAreaLarge.tsx

+ 190 - 199
src/pages/exam/ContentAreaLarge.tsx

@@ -1,7 +1,6 @@
 import {
   Row,
   Col,
-  Card,
   Select,
   InputNumber,
   Button,
@@ -81,216 +80,208 @@ const ContentAreaLarge = () => {
   return (
     <Row>
       <Col span={16}>
-        <Card>
-          <Row gutter={16}>
-            <Col span={6}>
-              <BodyPositionList layout="vertical"></BodyPositionList>
-            </Col>
-            <Col span={18}>
-              <Card>
-                <BodyPositionDetail />
-              </Card>
-            </Col>
-          </Row>
-        </Card>
+        <Row gutter={16}>
+          <Col span={6}>
+            <BodyPositionList layout="vertical"></BodyPositionList>
+          </Col>
+          <Col span={18}>
+            <BodyPositionDetail />
+          </Col>
+        </Row>
       </Col>
       <Col span={8}>
-        <Card>
-          <Row gutter={16} align="middle">
-            <Col span={9}>
-              <Select
-                placeholder="选择体型"
-                style={{ width: '100%', marginBottom: 8 }}
-                value={bodysize}
-                onChange={handleBodysizeChange}
-              >
-                {Object.entries(patientSizes).map(
-                  ([key, value]: [string, string]) => (
-                    <Select.Option key={key} value={key}>
-                      <FormattedMessage id={value} />
-                    </Select.Option>
-                  )
-                )}
-              </Select>
-            </Col>
-            <Col span={15}>
-              <Select
-                placeholder="选择工作位"
-                style={{ width: '100%', marginBottom: 8 }}
-                value={workstation}
-                onChange={handleWorkstationChange}
-              >
-                {Object.entries(WorkstationTypeLabels).map(
-                  ([key, value]: [string, string]) => (
-                    <Select.Option key={key} value={value}>
-                      <FormattedMessage
-                        id={`workstation.${key.toLowerCase()}`}
-                      />
-                    </Select.Option>
-                  )
-                )}
-              </Select>
-            </Col>
-          </Row>
-          <div>
-            <InputNumber
-              placeholder="mA"
+        <Row gutter={16} align="middle">
+          <Col span={9}>
+            <Select
+              placeholder="选择体型"
               style={{ width: '100%', marginBottom: 8 }}
-              value={aprConfig.mA ?? undefined}
-              onChange={(value) =>
-                dispatch(setAprConfig({ ...aprConfig, mA: value ?? 0 }))
-              }
-            />
-            <InputNumber
-              placeholder="ms"
-              style={{ width: '100%', marginBottom: 8 }}
-              value={aprConfig.ms ?? undefined}
-              onChange={(value) =>
-                dispatch(setAprConfig({ ...aprConfig, ms: value ?? 0 }))
-              }
-            />
-            <InputNumber
-              placeholder="mAs"
+              value={bodysize}
+              onChange={handleBodysizeChange}
+            >
+              {Object.entries(patientSizes).map(
+                ([key, value]: [string, string]) => (
+                  <Select.Option key={key} value={key}>
+                    <FormattedMessage id={value} />
+                  </Select.Option>
+                )
+              )}
+            </Select>
+          </Col>
+          <Col span={15}>
+            <Select
+              placeholder="选择工作位"
               style={{ width: '100%', marginBottom: 8 }}
-              value={aprConfig.mAs ?? undefined}
-              onChange={(value) =>
-                dispatch(setAprConfig({ ...aprConfig, mAs: value ?? 0 }))
-              }
+              value={workstation}
+              onChange={handleWorkstationChange}
+            >
+              {Object.entries(WorkstationTypeLabels).map(
+                ([key, value]: [string, string]) => (
+                  <Select.Option key={key} value={value}>
+                    <FormattedMessage id={`workstation.${key.toLowerCase()}`} />
+                  </Select.Option>
+                )
+              )}
+            </Select>
+          </Col>
+        </Row>
+        <div>
+          <InputNumber
+            placeholder="mA"
+            style={{ width: '100%', marginBottom: 8 }}
+            value={aprConfig.mA ?? undefined}
+            onChange={(value) =>
+              dispatch(setAprConfig({ ...aprConfig, mA: value ?? 0 }))
+            }
+          />
+          <InputNumber
+            placeholder="ms"
+            style={{ width: '100%', marginBottom: 8 }}
+            value={aprConfig.ms ?? undefined}
+            onChange={(value) =>
+              dispatch(setAprConfig({ ...aprConfig, ms: value ?? 0 }))
+            }
+          />
+          <InputNumber
+            placeholder="mAs"
+            style={{ width: '100%', marginBottom: 8 }}
+            value={aprConfig.mAs ?? undefined}
+            onChange={(value) =>
+              dispatch(setAprConfig({ ...aprConfig, mAs: value ?? 0 }))
+            }
+          />
+          <InputNumber
+            placeholder="KV"
+            style={{ width: '100%', marginBottom: 8 }}
+            value={aprConfig.kV ?? undefined}
+            onChange={(value) =>
+              dispatch(setAprConfig({ ...aprConfig, kV: value ?? 0 }))
+            }
+          />
+          <InputNumber
+            placeholder="density"
+            style={{ width: '100%', marginBottom: 8 }}
+            value={aprConfig.AECDensity ?? undefined}
+            onChange={(value) =>
+              dispatch(setAprConfig({ ...aprConfig, AECDensity: value ?? 0 }))
+            }
+          />
+        </div>
+        <Row gutter={16} align="middle">
+          <Col span={12}>
+            <Select
+              placeholder="选择曝光模式"
+              style={{ width: '100%' }}
+              value={currentExposureMode}
+              onChange={handleExposureModeChange}
+            >
+              <Select.Option value="mAs">mAs</Select.Option>
+              <Select.Option value="time">time</Select.Option>
+            </Select>
+          </Col>
+          <Col span={9}>
+            <Switch
+              checkedChildren="开启AEC"
+              unCheckedChildren="关闭AEC"
+              checked={isAECEnabled}
+              onChange={handleAECChange}
             />
-            <InputNumber
-              placeholder="KV"
-              style={{ width: '100%', marginBottom: 8 }}
-              value={aprConfig.kV ?? undefined}
-              onChange={(value) =>
-                dispatch(setAprConfig({ ...aprConfig, kV: value ?? 0 }))
-              }
+          </Col>
+          <Col span={3}>
+            <Button
+              type="primary"
+              style={{ width: '100%' }}
+              icon={<DeleteOutlined />}
+              title="重置参数"
             />
-            <InputNumber
-              placeholder="density"
-              style={{ width: '100%', marginBottom: 8 }}
-              value={aprConfig.AECDensity ?? undefined}
-              onChange={(value) =>
-                dispatch(setAprConfig({ ...aprConfig, AECDensity: value ?? 0 }))
-              }
-            />
-          </div>
-          <Row gutter={16} align="middle">
-            <Col span={12}>
-              <Select
-                placeholder="选择曝光模式"
-                style={{ width: '100%' }}
-                value={currentExposureMode}
-                onChange={handleExposureModeChange}
-              >
-                <Select.Option value="mAs">mAs</Select.Option>
-                <Select.Option value="time">time</Select.Option>
-              </Select>
-            </Col>
-            <Col span={9}>
-              <Switch
-                checkedChildren="开启AEC"
-                unCheckedChildren="关闭AEC"
-                checked={isAECEnabled}
-                onChange={handleAECChange}
-              />
-            </Col>
-            <Col span={3}>
+          </Col>
+        </Row>
+        <Divider />
+        <Row gutter={16} align="middle">
+          <Col span={4}>
+            <Tooltip title="删除选择的体位">
               <Button
                 type="primary"
                 style={{ width: '100%' }}
                 icon={<DeleteOutlined />}
-                title="重置参数"
-              />
-            </Col>
-          </Row>
-          <Divider />
-          <Row gutter={16} align="middle">
-            <Col span={4}>
-              <Tooltip title="删除选择的体位">
-                <Button
-                  type="primary"
-                  style={{ width: '100%' }}
-                  icon={<DeleteOutlined />}
-                  onClick={async () => {
-                    const selectedBodyPosition =
-                      store.getState().bodyPositionList.selectedBodyPosition;
-                    console.log(
-                      `选中的体位:${JSON.stringify(selectedBodyPosition)}`
-                    );
-                    if (
-                      selectedBodyPosition &&
-                      selectedBodyPosition.sop_instance_uid
-                    ) {
-                      try {
-                        await deleteBodyPosition(
+                onClick={async () => {
+                  const selectedBodyPosition =
+                    store.getState().bodyPositionList.selectedBodyPosition;
+                  console.log(
+                    `选中的体位:${JSON.stringify(selectedBodyPosition)}`
+                  );
+                  if (
+                    selectedBodyPosition &&
+                    selectedBodyPosition.sop_instance_uid
+                  ) {
+                    try {
+                      await deleteBodyPosition(
+                        selectedBodyPosition.sop_instance_uid
+                      );
+                      dispatch(
+                        removeBodyPositionBySopInstanceUid(
                           selectedBodyPosition.sop_instance_uid
-                        );
-                        dispatch(
-                          removeBodyPositionBySopInstanceUid(
-                            selectedBodyPosition.sop_instance_uid
-                          )
-                        );
-                        dispatch(setByIndex(0));
-                      } catch (error) {
-                        console.error('Error deleting body position:', error);
-                        message.error('Failed to delete body position');
-                      }
+                        )
+                      );
+                      dispatch(setByIndex(0));
+                    } catch (error) {
+                      console.error('Error deleting body position:', error);
+                      message.error('Failed to delete body position');
                     }
-                  }}
-                />
-              </Tooltip>
-            </Col>
-            <Col span={4}>
-              <Tooltip title="复制选择的体位">
-                <Button
-                  type="primary"
-                  style={{ width: '100%' }}
-                  icon={<CopyOutlined />}
-                  onClick={() => {
-                    const instanceUid =
-                      store.getState().bodyPositionList.selectedBodyPosition
-                        ?.study_instance_uid ?? '';
-                    console.log(
-                      'Copying position for instance UID:',
-                      instanceUid
-                    );
-                    console.log(
-                      `${store.getState().bodyPositionList.selectedBodyPosition}`
-                    );
-                    dispatch(copyPositionThunk({ instanceUid }));
-                  }}
-                />
-              </Tooltip>
-            </Col>
-            <Col span={4}>
-              <Tooltip title="保存参数">
-                <Button
-                  type="primary"
-                  style={{ width: '100%' }}
-                  icon={<SaveOutlined />}
-                />
-              </Tooltip>
-            </Col>
-            <Col span={4}>
-              <Tooltip title="打开/关闭摄像头">
-                <Button
-                  type="primary"
-                  style={{ width: '100%' }}
-                  icon={<CameraOutlined />}
-                />
-              </Tooltip>
-            </Col>
-            <Col span={4}>
-              <Tooltip title="拒绝">
-                <Button
-                  type="primary"
-                  style={{ width: '100%' }}
-                  icon={<CloseOutlined />}
-                />
-              </Tooltip>
-            </Col>
-          </Row>
-        </Card>
+                  }
+                }}
+              />
+            </Tooltip>
+          </Col>
+          <Col span={4}>
+            <Tooltip title="复制选择的体位">
+              <Button
+                type="primary"
+                style={{ width: '100%' }}
+                icon={<CopyOutlined />}
+                onClick={() => {
+                  const instanceUid =
+                    store.getState().bodyPositionList.selectedBodyPosition
+                      ?.study_instance_uid ?? '';
+                  console.log(
+                    'Copying position for instance UID:',
+                    instanceUid
+                  );
+                  console.log(
+                    `${store.getState().bodyPositionList.selectedBodyPosition}`
+                  );
+                  dispatch(copyPositionThunk({ instanceUid }));
+                }}
+              />
+            </Tooltip>
+          </Col>
+          <Col span={4}>
+            <Tooltip title="保存参数">
+              <Button
+                type="primary"
+                style={{ width: '100%' }}
+                icon={<SaveOutlined />}
+              />
+            </Tooltip>
+          </Col>
+          <Col span={4}>
+            <Tooltip title="打开/关闭摄像头">
+              <Button
+                type="primary"
+                style={{ width: '100%' }}
+                icon={<CameraOutlined />}
+              />
+            </Tooltip>
+          </Col>
+          <Col span={4}>
+            <Tooltip title="拒绝">
+              <Button
+                type="primary"
+                style={{ width: '100%' }}
+                icon={<CloseOutlined />}
+              />
+            </Tooltip>
+          </Col>
+        </Row>
       </Col>
     </Row>
   );