# 设备拓扑图完整显示 Spec ## Why 设备拓扑图(勘察明细页中间栏、台账详情弹窗「勘察明细拓扑图」)当前固定容器尺寸且未启用拖拽缩放,设备节点多时树形图超出容器,底部/右侧节点被截断,无法查看完整拓扑。 ## What Changes - 台账详情弹窗「勘察明细拓扑图」(`views/dispatch/survey/index.vue`):ECharts tree 系列启用 `roam: true`(拖拽平移 + 滚轮缩放),全部节点可缩放查看;适当放大容器高度并压缩边距,减少初始截断 - 勘察明细页中间栏设备拓扑图(`views/dispatch/survey/detail.vue`):ECharts tree 系列启用 `roam: true`;微调边距/容器高度,配合已有 ResizeObserver 自适应 - 两处均保持 `initialTreeDepth: -1`(默认全展开),配合缩放查看全部层级 ## Impact - Affected specs: 勘察派单重构(rework-survey-equipment-tree)交付的拓扑图展示能力 - Affected code: - `client/src/views/dispatch/survey/detail.vue`(treeOption 系列配置 + 中间栏容器 CSS) - `client/src/views/dispatch/survey/index.vue`(renderDetailTopo 系列配置 + detail-topo-wrap CSS) ## ADDED Requirements ### Requirement: 拓扑图可缩放查看全部节点 两处设备拓扑图 SHALL 支持拖拽平移与缩放(`roam`),使设备树所有节点在超出容器时仍可完整查看。 #### Scenario: 设备节点多(3 级以上/大量同层节点) - **WHEN** 用户在勘察明细页或台账详情弹窗查看拓扑图,节点超出容器被截断 - **THEN** 用户可通过拖拽平移、滚轮/按钮缩放查看全部节点,无节点被永久裁切 ## MODIFIED Requirements ### Requirement: 拓扑图容器与边距 - 台账详情弹窗拓扑容器高度由 340px 适当增大;tree 系列 `top/left/bottom/right` 边距压缩,扩大有效绘制区 - 勘察明细页中间栏拓扑图保持页面自适应,边距压缩以容纳更多节点 ## REMOVED Requirements ### Requirement: 无 —— 仅增强现有拓扑图交互与展示 **Reason**: 无移除 **Migration**: 无