Explorar el Código

添加首选项-工作流组件

dengdx hace 4 semanas
padre
commit
dce2130ad3

+ 411 - 0
src/pages/system/SettingsModal/sections/Preferences/Workflow.tsx

@@ -0,0 +1,411 @@
+/**
+ * 工作流 - 工作流设置组件
+ */
+import React, { useState } from 'react';
+import { Form, Card, Switch, Input, InputNumber, Radio, Checkbox, Table, Button, Space, Divider } from 'antd';
+import { SPACING } from '../../constants';
+
+const { Group: RadioGroup } = Radio;
+
+// 字段配置数据类型
+interface FieldConfig {
+  key: string;
+  field: string;
+  visible: boolean;
+}
+
+/**
+ * 工作流组件
+ * 实现图像采集、多任务管理、APR编辑等设置功能
+ */
+const Workflow: React.FC = () => {
+  const [form] = Form.useForm();
+
+  // 任务清单显示配置数据
+  const [taskListConfig, setTaskListConfig] = useState<FieldConfig[]>([
+    { key: '1', field: '动物ID', visible: true },
+    { key: '2', field: '动物名称', visible: true },
+    { key: '3', field: '动物类型', visible: true },
+    { key: '4', field: '性别', visible: true },
+    { key: '5', field: '年龄', visible: true },
+    { key: '6', field: '检查描述', visible: true },
+    { key: '7', field: '检查时间', visible: true },
+    { key: '8', field: '主人', visible: true },
+    { key: '9', field: '登记号', visible: true },
+  ]);
+
+  // 历史清单显示配置数据
+  const [historyListConfig, setHistoryListConfig] = useState<FieldConfig[]>([
+    { key: '1', field: '动物ID', visible: true },
+    { key: '2', field: '动物名称', visible: true },
+    { key: '3', field: '动物类型', visible: true },
+    { key: '4', field: '性别', visible: true },
+    { key: '5', field: '年龄', visible: true },
+  ]);
+
+  // 表格列配置
+  const getTableColumns = (onChange: (key: string, visible: boolean) => void) => [
+    {
+      title: '可见',
+      dataIndex: 'visible',
+      key: 'visible',
+      width: 80,
+      render: (visible: boolean, record: FieldConfig) => (
+        <Checkbox
+          checked={visible}
+          onChange={(e) => onChange(record.key, e.target.checked)}
+        />
+      ),
+    },
+    {
+      title: '列',
+      dataIndex: 'field',
+      key: 'field',
+    },
+  ];
+
+  // 处理任务清单配置变更
+  const handleTaskListConfigChange = (key: string, visible: boolean) => {
+    setTaskListConfig(prev =>
+      prev.map(config =>
+        config.key === key ? { ...config, visible } : config
+      )
+    );
+  };
+
+  // 处理历史清单配置变更
+  const handleHistoryListConfigChange = (key: string, visible: boolean) => {
+    setHistoryListConfig(prev =>
+      prev.map(config =>
+        config.key === key ? { ...config, visible } : config
+      )
+    );
+  };
+
+  // 处理保存
+  const handleSave = () => {
+    form.validateFields().then(values => {
+      console.log('保存设置:', {
+        ...values,
+        taskListConfig,
+        historyListConfig
+      });
+      // TODO: 调用API保存设置
+    });
+  };
+
+  // 处理取消
+  const handleCancel = () => {
+    form.resetFields();
+    // 重置任务清单配置到初始状态
+    setTaskListConfig([
+      { key: '1', field: '动物ID', visible: true },
+      { key: '2', field: '动物名称', visible: true },
+      { key: '3', field: '动物类型', visible: true },
+      { key: '4', field: '性别', visible: true },
+      { key: '5', field: '年龄', visible: true },
+      { key: '6', field: '检查描述', visible: true },
+      { key: '7', field: '检查时间', visible: true },
+      { key: '8', field: '主人', visible: true },
+      { key: '9', field: '登记号', visible: true },
+    ]);
+    // 重置历史清单配置到初始状态
+    setHistoryListConfig([
+      { key: '1', field: '动物ID', visible: true },
+      { key: '2', field: '动物名称', visible: true },
+      { key: '3', field: '动物类型', visible: true },
+      { key: '4', field: '性别', visible: true },
+      { key: '5', field: '年龄', visible: true },
+    ]);
+  };
+
+  return (
+    <div style={{ height: '100%', display: 'flex', flexDirection: 'column' }}>
+      {/* 主内容区 - 分割视图 */}
+      <div style={{ flex: 1, display: 'flex', gap: SPACING.LG, padding: SPACING.LG }}>
+        {/* 左侧面板 - 表单设置 */}
+        <div style={{ flex: 1, display: 'flex', flexDirection: 'column', gap: SPACING.MD, overflowY: 'auto' }}>
+          <Form
+            form={form}
+            layout="vertical"
+            initialValues={{
+              autoJumpToNextView: false,
+              autoExposureCountdown: false,
+              jumpDelaySeconds: 0,
+              suggestAPRTable: false,
+              allowMergeTasks: false,
+              allowEditAfterAcquisition: false,
+              requireRejectionReason: false,
+              showRejectedImages: false,
+              smallAnimalExposureMode: 'bodyThickness',
+              generatorPower: false,
+              tubePower: false,
+              generatorTemp: false,
+              detectorPower: false,
+              detectorWifi: false,
+              detectorTemp: false,
+              showRealImage: false,
+              showAnatomyImage: false,
+              exposureStatusEnabled: false,
+              exportPathMode: 'default',
+              exportCustomPath: '',
+              doseAdjustmentEnabled: false,
+            }}
+          >
+            {/* 图像采集设置 */}
+            <Card title="图像采集设置" size="small">
+              <Space direction="vertical" style={{ width: '100%' }}>
+                <Form.Item
+                  label="是否自动跳转到下个视图"
+                  name="autoJumpToNextView"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+
+                <Form.Item
+                  label="是否开启倒计时自动曝光"
+                  name="autoExposureCountdown"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+
+                <Form.Item
+                  label="自动跳转到下个视图延迟时间(秒)"
+                  name="jumpDelaySeconds"
+                  rules={[
+                    { type: 'number', min: 0, max: 60, message: '延迟时间必须在0-60秒之间' }
+                  ]}
+                >
+                  <InputNumber min={0} max={60} style={{ width: '100%' }} />
+                </Form.Item>
+
+                <Form.Item
+                  label="提供建议的曝光APR表"
+                  name="suggestAPRTable"
+                  valuePropName="checked"
+                >
+                  <Checkbox />
+                </Form.Item>
+              </Space>
+            </Card>
+
+            {/* 多个任务设置 */}
+            <Card title="多个任务设置" size="small">
+              <Form.Item
+                label="允许同一患者的多个任务合并开始检查"
+                name="allowMergeTasks"
+                valuePropName="checked"
+              >
+                <Checkbox />
+              </Form.Item>
+            </Card>
+
+            {/* 编辑APR设置 */}
+            <Card title="编辑APR设置" size="small">
+              <Form.Item
+                label="图像采集后在检查中允许编辑曝光信息如APR、DAP"
+                name="allowEditAfterAcquisition"
+                valuePropName="checked"
+              >
+                <Checkbox />
+              </Form.Item>
+            </Card>
+
+            {/* 拒绝图像设置 */}
+            <Card title="拒绝图像设置" size="small">
+              <Space direction="vertical" style={{ width: '100%' }}>
+                <Form.Item
+                  label="当拒绝图片时需输入拒绝原因"
+                  name="requireRejectionReason"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+
+                <Form.Item
+                  label="是否显示拒绝图像"
+                  name="showRejectedImages"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+              </Space>
+            </Card>
+
+            {/* 小动物默认曝光参数 */}
+            <Card title="小动物默认曝光参数" size="small">
+              <Form.Item
+                label="曝光参数计算方式"
+                name="smallAnimalExposureMode"
+              >
+                <RadioGroup>
+                  <Radio value="bodyThickness">根据体厚计算</Radio>
+                  <Radio value="bodyType">根据体型获取</Radio>
+                </RadioGroup>
+              </Form.Item>
+            </Card>
+
+            {/* 状态栏图标 */}
+            <Card title="状态栏图标" size="small">
+              <Space direction="vertical" style={{ width: '100%' }}>
+                <Form.Item
+                  label="发生器电量"
+                  name="generatorPower"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+
+                <Form.Item
+                  label="球管管电量"
+                  name="tubePower"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+
+                <Form.Item
+                  label="发生器温度"
+                  name="generatorTemp"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+
+                <Form.Item
+                  label="探测器电量"
+                  name="detectorPower"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+
+                <Form.Item
+                  label="探测器Wi-Fi"
+                  name="detectorWifi"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+
+                <Form.Item
+                  label="探测器温度"
+                  name="detectorTemp"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+              </Space>
+            </Card>
+
+            {/* 辅助定位 */}
+            <Card title="辅助定位" size="small">
+              <Space direction="vertical" style={{ width: '100%' }}>
+                <Form.Item
+                  label="是否显示真实效果图"
+                  name="showRealImage"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+
+                <Form.Item
+                  label="是否显示解剖图"
+                  name="showAnatomyImage"
+                  valuePropName="checked"
+                >
+                  <Switch />
+                </Form.Item>
+              </Space>
+            </Card>
+
+            {/* 曝光状态显示 */}
+            <Card title="曝光状态显示" size="small">
+              <Form.Item
+                label="是否开启曝光状态显示"
+                name="exposureStatusEnabled"
+                valuePropName="checked"
+              >
+                <Switch />
+              </Form.Item>
+            </Card>
+
+            {/* 导出图像路径 */}
+            <Card title="导出图像路径" size="small">
+              <Space direction="vertical" style={{ width: '100%' }}>
+                <Form.Item
+                  label="路径选择"
+                  name="exportPathMode"
+                >
+                  <RadioGroup>
+                    <Radio value="default">默认路径</Radio>
+                    <Radio value="lastUsed">上一次导出路径</Radio>
+                  </RadioGroup>
+                </Form.Item>
+
+                <Form.Item
+                  label="上一次导出路径"
+                  name="exportCustomPath"
+                >
+                  <Input placeholder="请输入导出路径" />
+                </Form.Item>
+              </Space>
+            </Card>
+
+            {/* 剂量调整设置 */}
+            <Card title="剂量调整设置" size="small">
+              <Form.Item
+                label="是否启用剂量调整功能"
+                name="doseAdjustmentEnabled"
+                valuePropName="checked"
+              >
+                <Switch />
+              </Form.Item>
+            </Card>
+          </Form>
+        </div>
+
+        {/* 右侧面板 - 表格配置 */}
+        <div style={{ flex: 1, display: 'flex', flexDirection: 'column', gap: SPACING.MD }}>
+          {/* 任务清单显示配置 */}
+          <Card title="任务清单显示配置" size="small" style={{ flex: 1 }}>
+            <Table
+              columns={getTableColumns(handleTaskListConfigChange)}
+              dataSource={taskListConfig}
+              pagination={false}
+              size="small"
+              scroll={{ y: 300 }}
+            />
+          </Card>
+
+          {/* 历史清单显示配置 */}
+          <Card title="历史清单显示配置" size="small" style={{ flex: 1 }}>
+            <Table
+              columns={getTableColumns(handleHistoryListConfigChange)}
+              dataSource={historyListConfig}
+              pagination={false}
+              size="small"
+              scroll={{ y: 200 }}
+            />
+          </Card>
+        </div>
+      </div>
+
+      {/* 底部操作区 */}
+      <div style={{
+        padding: SPACING.LG,
+        borderTop: '1px solid #f0f0f0',
+        display: 'flex',
+        justifyContent: 'flex-end',
+        gap: SPACING.MD
+      }}>
+        <Button onClick={handleCancel}>取消</Button>
+        <Button type="primary" onClick={handleSave}>保存</Button>
+      </div>
+    </div>
+  );
+};
+
+export default Workflow;

+ 2 - 3
src/pages/system/SettingsModal/sections/Preferences/index.tsx

@@ -4,6 +4,7 @@
 import React from 'react';
 import PlaceholderSection from '../PlaceholderSection';
 import NewInspection from './NewInspection';
+import WorkflowComponent from './Workflow';
 
 // 通用设置
 export const GeneralSettings: React.FC = () => (
@@ -14,9 +15,7 @@ export const GeneralSettings: React.FC = () => (
 export const WorkflowInspection: React.FC = () => <NewInspection />;
 
 // 工作流
-export const Workflow: React.FC = () => (
-  <PlaceholderSection title="工作流" />
-);
+export const Workflow: React.FC = () => <WorkflowComponent />;
 
 // 用户信息
 export const UserInfo: React.FC = () => (

+ 301 - 0
src/pages/system/SettingsModal/sections/Preferences/首选项-工作流-布局与组件结构描述.md

@@ -0,0 +1,301 @@
+# 首选项-工作流-布局与组件结构描述
+
+## 页面层次结构分析
+
+### Page (页面)
+- **Layout**: Split View (分割视图) - 主内容区分为左右两个面板
+- **Header**: 顶部工具栏,包含标题和操作按钮
+- **Footer**: 底部操作区,包含取消和保存按钮
+
+### Main Content (主内容区)
+- **Left Panel (左侧面板)**: Flexbox Layout (弹性布局),垂直排列多个设置组
+  - **Container**: 表单容器,包含多个配置组
+  - **Section**: 图像采集设置组
+    - **Component**: Switch (开关) - 是否自动跳转到下个视图
+    - **Component**: Switch (开关) - 是否开启倒计时自动曝光
+    - **Component**: InputNumber (数字输入) - 自动跳转到下个视图延迟时间(秒)
+    - **Component**: Checkbox (复选框) - 提供建议的曝光APR表
+  - **Section**: 多个任务设置组
+    - **Component**: Checkbox (复选框) - 允许同一患者的多个任务合并开始检查
+  - **Section**: 编辑APR设置组
+    - **Component**: Checkbox (复选框) - 图像采集后在检查中允许编辑曝光信息如APR、DAP
+  - **Section**: 拒绝图像设置组
+    - **Component**: Switch (开关) - 当拒绝图片时需输入拒绝原因
+    - **Component**: Switch (开关) - 是否显示拒绝图像
+  - **Section**: 小动物默认曝光参数组
+    - **Component**: Radio.Group (单选组) - 根据体厚计算/根据体型获取
+  - **Section**: 状态栏图标组
+    - **Component**: Switch (开关) - 发生器电量
+    - **Component**: Switch (开关) - 球管管电量
+    - **Component**: Switch (开关) - 发生器温度
+    - **Component**: Switch (开关) - 探测器电量
+    - **Component**: Switch (开关) - 探测器Wi-Fi
+    - **Component**: Switch (开关) - 探测器温度
+  - **Section**: 辅助定位组
+    - **Component**: Switch (开关) - 是否显示真实效果图
+    - **Component**: Switch (开关) - 是否显示解剖图
+  - **Section**: 曝光状态显示组
+    - **Component**: Switch (开关) - 是否开启曝光状态显示
+  - **Section**: 导出图像路径组
+    - **Component**: Radio.Group (单选组) - 默认路径/上一次导出路径
+    - **Component**: Input (输入框) - 上一次导出路径输入框
+  - **Section**: 剂量调整设置组
+    - **Component**: Switch (开关) - 是否启用剂量调整功能
+
+- **Right Panel (右侧面板)**: 表格展示区,垂直排列
+  - **Section**: 任务清单显示配置
+    - **Component**: Table (表格) - 任务清单字段配置表
+      - **Columns**: 可见 (Checkbox), 列名 (Text)
+      - **Rows**: 9个字段配置行
+  - **Section**: 历史清单显示配置
+    - **Component**: Table (表格) - 历史清单字段配置表
+      - **Columns**: 可见 (Checkbox), 列名 (Text)
+      - **Rows**: 5个字段配置行
+
+### Footer (底部)
+- **Container**: 按钮组容器,水平排列
+- **Component**: Button (按钮) - 取消
+- **Component**: Button (按钮) - 保存
+
+## 布局类型
+- **Primary Layout**: Split View (分割视图) - 左右面板分割
+- **Left Panel**: Flexbox Layout (弹性布局) - 垂直堆叠设置组
+- **Right Panel**: Flexbox Layout (弹性布局) - 垂直堆叠表格
+- **Footer**: Flexbox Layout (弹性布局) - 水平排列按钮
+
+## 组件选择理由 (使用Ant Design组件)
+
+### 基础组件选择
+1. **Switch (开关)**: 用于布尔值设置,适合频繁切换的设置项
+   - 理由: 视觉直观,操作便捷,符合现代UI设计
+
+2. **Checkbox (复选框)**: 用于多选或独立布尔值设置
+   - 理由: 标准的多选组件,支持批量操作
+
+3. **InputNumber (数字输入)**: 用于数值输入
+   - 理由: 提供数字验证、步进控制等功能
+
+4. **Radio.Group (单选组)**: 用于互斥选项选择
+   - 理由: 清晰表达互斥关系,用户体验良好
+
+5. **Input (输入框)**: 用于文本路径输入
+   - 理由: 支持路径验证和自动完成
+
+6. **Table (表格)**: 用于字段配置展示和编辑
+   - 理由: 支持行内编辑、排序、筛选等高级功能
+
+7. **Button (按钮)**: 用于操作触发
+   - 理由: 提供多种样式,支持加载状态和禁用状态
+
+### 布局组件选择
+1. **Form (表单)**: 整体表单容器
+   - 理由: 统一管理表单状态、验证和提交
+
+2. **Card (卡片)**: 用于分组设置
+   - 理由: 提供清晰的视觉层次和分组边界
+
+3. **Space (间距)**: 用于元素间距控制
+   - 理由: 保持一致的间距系统
+
+4. **Divider (分割线)**: 用于分组间的视觉分隔
+   - 理由: 增强视觉层次结构
+
+## 页面涉及的可能功能
+
+### 核心功能
+1. **图像采集工作流设置**
+   - 自动跳转和曝光控制
+   - 延迟时间配置
+   - APR表建议开关
+
+2. **多任务管理设置**
+   - 任务合并控制
+   - 并发处理配置
+
+3. **曝光参数编辑控制**
+   - APR/DAP编辑权限
+   - 后处理编辑开关
+
+4. **图像质量控制**
+   - 拒绝原因录入
+   - 拒绝图像显示控制
+
+5. **小动物专用设置**
+   - 曝光参数计算方式
+   - 体厚/体型选择
+
+6. **状态栏显示配置**
+   - 硬件状态图标控制
+   - 实时监控开关
+
+7. **辅助功能设置**
+   - 定位图像显示
+   - 解剖图展示
+
+8. **曝光状态可视化**
+   - 曝光进度显示
+   - 状态指示器
+
+9. **导出路径管理**
+   - 默认路径配置
+   - 历史路径记忆
+
+10. **剂量安全控制**
+    - 剂量调整功能开关
+    - 安全阈值设置
+
+11. **清单显示配置**
+    - 任务清单字段控制
+    - 历史清单字段控制
+
+### 辅助功能
+1. **表单验证**: 确保数值范围和路径有效性
+2. **数据持久化**: 保存设置到后端存储
+3. **重置功能**: 恢复默认设置
+4. **批量操作**: 表格字段的批量可见性设置
+
+## 功能思考与需求描述
+
+### 用户需求分析
+1. **工作流优化**: 通过自动化设置提高检查效率
+2. **灵活配置**: 允许根据不同检查场景调整参数
+3. **质量控制**: 确保图像质量和剂量安全
+4. **状态监控**: 实时了解设备和系统状态
+5. **个性化显示**: 根据用户偏好定制界面显示
+
+### 业务场景考虑
+1. **兽医影像科**: 需要精确控制曝光参数和图像质量
+2. **多设备环境**: 支持不同设备的参数配置
+3. **合规要求**: 剂量管理和质量控制符合医疗标准
+4. **效率优先**: 自动化功能减少手动操作
+
+### 技术需求
+1. **实时同步**: 设置变更实时生效
+2. **数据验证**: 前后端双重验证关键参数
+3. **性能优化**: 大量开关控件的高效渲染
+4. **响应式设计**: 适应不同分辨率屏幕
+
+## 后续实现建议
+
+### Slice设计 (Redux Toolkit)
+```typescript
+// src/states/preferencesSlice.ts
+interface PreferencesState {
+  workflow: {
+    imageAcquisition: {
+      autoJumpToNextView: boolean;
+      autoExposureCountdown: boolean;
+      jumpDelaySeconds: number;
+      suggestAPRTable: boolean;
+    };
+    multiTask: {
+      allowMergeTasks: boolean;
+    };
+    aprEditing: {
+      allowEditAfterAcquisition: boolean;
+    };
+    imageRejection: {
+      requireReason: boolean;
+      showRejectedImages: boolean;
+    };
+    smallAnimalExposure: 'bodyThickness' | 'bodyType';
+    statusBarIcons: {
+      generatorPower: boolean;
+      tubePower: boolean;
+      generatorTemp: boolean;
+      detectorPower: boolean;
+      detectorWifi: boolean;
+      detectorTemp: boolean;
+    };
+    auxiliaryPositioning: {
+      showRealImage: boolean;
+      showAnatomyImage: boolean;
+    };
+    exposureStatus: {
+      enabled: boolean;
+    };
+    exportPath: {
+      mode: 'default' | 'lastUsed';
+      customPath: string;
+    };
+    doseAdjustment: {
+      enabled: boolean;
+    };
+    taskListConfig: Array<{
+      field: string;
+      visible: boolean;
+    }>;
+    historyListConfig: Array<{
+      field: string;
+      visible: boolean;
+    }>;
+  };
+}
+
+// Actions
+- updateImageAcquisitionSettings
+- updateMultiTaskSettings
+- updateAprEditingSettings
+- updateImageRejectionSettings
+- setSmallAnimalExposureMode
+- updateStatusBarIcons
+- updateAuxiliaryPositioning
+- setExposureStatusDisplay
+- updateExportPathSettings
+- setDoseAdjustmentEnabled
+- updateTaskListConfig
+- updateHistoryListConfig
+- saveWorkflowPreferences
+- loadWorkflowPreferences
+```
+
+### 状态结构
+```typescript
+interface WorkflowConfig {
+  // 图像采集设置
+  imageAcquisition: ImageAcquisitionSettings;
+
+  // 多任务设置
+  multiTask: MultiTaskSettings;
+
+  // APR编辑设置
+  aprEditing: AprEditingSettings;
+
+  // 图像拒绝设置
+  imageRejection: ImageRejectionSettings;
+
+  // 小动物曝光参数
+  smallAnimalExposure: ExposureCalculationMode;
+
+  // 状态栏图标
+  statusBarIcons: StatusBarIconsConfig;
+
+  // 辅助定位
+  auxiliaryPositioning: AuxiliaryPositioningConfig;
+
+  // 曝光状态显示
+  exposureStatus: ExposureStatusConfig;
+
+  // 导出路径
+  exportPath: ExportPathConfig;
+
+  // 剂量调整
+  doseAdjustment: DoseAdjustmentConfig;
+
+  // 清单配置
+  listConfigs: {
+    taskList: FieldVisibilityConfig[];
+    historyList: FieldVisibilityConfig[];
+  };
+}
+
+interface FieldVisibilityConfig {
+  key: string;
+  field: string;
+  visible: boolean;
+}
+```
+
+### 交互设计
+1. **分组展示**: 设置按功能分组,减少视觉干扰
+2. **实时反馈**: 开

+ 174 - 0
src/pages/system/SettingsModal/sections/Preferences/首选项-工作流.json

@@ -0,0 +1,174 @@
+{
+  "page": {
+    "header": {
+      "title": "Mgr",
+      "menuBar": {
+        "items": [
+          "通用设置",
+          "新建检查",
+          "工作流",
+          "四台信息",
+          "添加备注",
+          "查看和处理",
+          "报告"
+        ],
+        "active": "工作流"
+      },
+      "topRightIcons": [
+        "语言切换",
+        "退出登录"
+      ]
+    },
+    "sidebar": {
+      "sections": [
+        {
+          "title": "系统之家",
+          "icon": "home"
+        },
+        {
+          "title": "首选项",
+          "icon": "settings",
+          "active": true
+        },
+        {
+          "title": "硬件配置",
+          "icon": "hardware"
+        },
+        {
+          "title": "网络设置",
+          "icon": "network"
+        },
+        {
+          "title": "协议设置",
+          "icon": "protocol"
+        },
+        {
+          "title": "统计分析",
+          "icon": "chart"
+        }
+      ]
+    },
+    "mainContent": {
+      "section": "工作流",
+      "layout": {
+        "leftPanel": {
+          "groups": [
+            {
+              "title": "图像采集设置",
+              "fields": [
+                { "label": "是否自动跳转到下个视图", "type": "toggle" },
+                { "label": "是否开启倒计时自动曝光", "type": "toggle" },
+                { "label": "自动跳转到下个视图延迟时间(秒)", "type": "numberInput", "value": 0 },
+                { "label": "提供建议的曝光APR表", "type": "checkbox" }
+              ]
+            },
+            {
+              "title": "多个任务设置",
+              "fields": [
+                { "label": "允许同一患者的多个任务合并开始检查", "type": "checkbox" }
+              ]
+            },
+            {
+              "title": "编辑APR设置",
+              "fields": [
+                { "label": "图像采集后在检查中允许编辑曝光信息如APR、DAP", "type": "checkbox" }
+              ]
+            },
+            {
+              "title": "拒绝图像设置",
+              "fields": [
+                { "label": "当拒绝图片时需输入拒绝原因", "type": "toggle" },
+                { "label": "是否显示拒绝图像", "type": "toggle" }
+              ]
+            },
+            {
+              "title": "小动物默认曝光参数",
+              "fields": [
+                { "label": "根据体厚计算", "type": "radio" },
+                { "label": "根据体型获取", "type": "radio" }
+              ]
+            },
+            {
+              "title": "状态栏图标",
+              "fields": [
+                { "label": "发生器电量", "type": "toggle" },
+                { "label": "球管管电量", "type": "toggle" },
+                { "label": "发生器温度", "type": "toggle" },
+                { "label": "探测器电量", "type": "toggle" },
+                { "label": "探测器Wi-Fi", "type": "toggle" },
+                { "label": "探测器温度", "type": "toggle" }
+              ]
+            },
+            {
+              "title": "辅助定位",
+              "fields": [
+                { "label": "是否显示真实效果图", "type": "toggle" },
+                { "label": "是否显示解剖图", "type": "toggle" }
+              ]
+            },
+            {
+              "title": "曝光状态显示",
+              "fields": [
+                { "label": "是否开启曝光状态显示", "type": "toggle" }
+              ]
+            },
+            {
+              "title": "导出图像路径",
+              "fields": [
+                { "label": "默认路径", "type": "radio" },
+                { "label": "上一次导出路径", "type": "radio" },
+                { "label": "上一次导出路径输入框", "type": "textField" }
+              ]
+            },
+            {
+              "title": "剂量调整设置",
+              "fields": [
+                { "label": "是否启用剂量调整功能", "type": "toggle" }
+              ]
+            }
+          ]
+        },
+        "rightPanel": {
+          "sections": [
+            {
+              "title": "任务清单显示配置",
+              "table": {
+                "columns": ["可见", "列"],
+                "rows": [
+                  { "field": "动物ID", "visible": true },
+                  { "field": "动物名称", "visible": true },
+                  { "field": "动物类型", "visible": true },
+                  { "field": "性别", "visible": true },
+                  { "field": "年龄", "visible": true },
+                  { "field": "检查描述", "visible": true },
+                  { "field": "检查时间", "visible": true },
+                  { "field": "主人", "visible": true },
+                  { "field": "登记号", "visible": true }
+                ]
+              }
+            },
+            {
+              "title": "历史清单显示配置",
+              "table": {
+                "columns": ["可见", "列"],
+                "rows": [
+                  { "field": "动物ID", "visible": true },
+                  { "field": "动物名称", "visible": true },
+                  { "field": "动物类型", "visible": true },
+                  { "field": "性别", "visible": true },
+                  { "field": "年龄", "visible": true }
+                ]
+              }
+            }
+          ]
+        }
+      },
+      "footer": {
+        "buttons": [
+          { "label": "取消", "action": "cancel" },
+          { "label": "保存", "action": "save" }
+        ]
+      }
+    }
+  }
+}