feat(contract-manage): 将合同详情由弹窗改为独立页面

- 新增路由 /business/contract-manage/detail,详情页共享合同管理组件
- 列表、表单、详情三分支用 isFormPage 和 isDetailPage 控制
- openDetail 方法改为跳转详情路由,initDetailPage 获取详情数据
- 新增 resetDetailState 和 closeDetailPage 方法,复用关闭逻辑
- 详情页去除弹窗高度限制,样式改为页面自滚动
- 详情页底栏使用固定位置关闭按钮,保持页面布局一致
- watch 和 created 中添加对 isDetailPage 的初始化调用和监听
This commit is contained in:
2026-09-11 12:30:05 +08:00
parent 6e5b15f203
commit 2131e99ec4
10 changed files with 189 additions and 90 deletions
+7 -2
View File
@@ -30,8 +30,13 @@
- Avue 内置弹窗 footer 真实 class 是 `.avue-dialog__footer`,须 `position:sticky; bottom:0; flex:none; background:#fff` 贴底。
### 上传证件区域尺寸(transportCapacity
- 身份证/行驶证/道路运输证等固定 **240×151px**1.586:1)。
- scoped 覆盖 `.xxx-uploader--large { width:240px }``--large .el-upload { width:100%; height:151px }`
- 身份证/行驶证/道路运输证等目标比例 **240×151px**1.586:1ship 为 248px 上限
- ⚠️ **不能写死 `width:240px`**:弹窗 `width:90%` + 列 `el-col :span=6` 是弹性的,固定 px 只在特定分辨率/系统缩放下恰好等于列宽(本机对齐、他人错位)。统一写法:
```scss
.xxx-uploader--large { display:block; width:100%; max-width:240px; flex:none; margin:0; }
.xxx-uploader--large .el-upload { width:100%; height:151px; }
```
2026-09-11 已修正 driver / vehicle / ship 三处。
### 上传图片点击放大预览
- `src/components/image-upload-field/main.vue` 用 `<el-image preview-src-list fit="contain" preview-teleported :z-index="3000" @click.stop>`,阻止冒泡到 el-upload。