# Change: 优化流程详情页面布局

## Why

当前流程详情页面 ([`ruoyi-ui/src/views/loanPricing/workflow/detail.vue`](../../ruoyi-ui/src/views/loanPricing/workflow/detail.vue)) 采用简单的标签页布局，所有信息平铺展示，缺乏信息层次感。用户需要在不同标签页之间切换才能查看关键信息，无法快速获取最重要的数据概览。页面视觉层次不够清晰，信息利用率不高。

## What Changes

- **页面布局重构**: 采用信息密集型两栏布局
  - 左侧（约 30% 宽度）：展示关键信息摘要卡片（业务方流水号、客户名称、申请金额、贷款利率等核心字段）
  - 右侧（约 70% 宽度）：保留现有标签页，展示完整的流程详细信息
- **页面头部简化**: 移除 `el-page-header`，使用简洁的页面标题，返回按钮移至页面右上角
- **样式优化**:
  - 为左侧摘要卡片添加适当的阴影和圆角
  - 优化卡片内部间距和字体大小
  - 保持现有的简洁数据展示风格（不添加图标或额外的高亮效果）
- **响应式支持**: 在小屏幕设备上自动调整为单栏垂直布局

## Impact

- 受影响的规范: `loan-pricing-workflow-ui`
- 受影响的代码: [`ruoyi-ui/src/views/loanPricing/workflow/detail.vue`](../../ruoyi-ui/src/views/loanPricing/workflow/detail.vue)
- 破坏性变更: 无（仅改变 UI 布局，不影响功能和 API）