# 流量运营表格 Tip + 弹窗 Select 误伤修复

日期：2026-09-01  
状态：已确认（待实现计划）

## 背景

1. **流量运营表格**：使用 TDesign `t-table`。组件对 `column.ellipsis = true` 的单元格自带溢出检测 + Tooltip；当前多数长文本列未开启，用户悬停看不到完整内容。
2. **弹窗下拉像禁用**：TDesign `t-select` 在不允许手输时，内部 `t-input` 会带 `t-is-readonly`（仍可点开选择）。全局样式

```css
.add-dock-dialog .t-input.t-is-readonly,
.add-dock-dialog .t-input.t-is-readonly .t-input__inner {
  color: #77838d;
  background: #f2f4f6;
  cursor: not-allowed;
}
```

把弹窗内所有 Select 染成禁用灰，但功能仍可改，造成误导。该 class 被流量运营/固件/任务/机巢等弹窗共用。

## 目标

- 流量运营三表：可能被截断的列开启组件自带 ellipsis tip，悬停显示完整内容。
- 弹窗内可编辑 Select 恢复正常可点样式；真正只读输入（如机巢 SN）仍保持灰样式。

## 非目标

- 不改表格组件库、不引入第三方 tip 库
- 不给短字段（状态点、操作列、价格等紧凑列）强开 tip
- 不重做整套弹窗视觉 / 不更换 dialog class 体系
- 本轮不顺手改其它页面表格 ellipsis（除非与同一 CSS 修复自然受益）

## 方案

### A. 表格：补齐内置 `ellipsis`

文件：`src/views/TrafficOpsView/TrafficOpsView.vue`

对下列列设置 `ellipsis: true`（已有则保持）：

| Tab | 列 |
|---|---|
| 套餐 | `code`, `name` |
| 采购 | `batchNo`, `provider`, `remark`（`remark` 已有） |
| 流水 | `amountText`, `balanceText`, `sourceType`, `sourceId`, `idempotencyKey`（后两者已有） |

说明：

- Tip 内容由 TDesign 默认取单元格渲染结果；仅在检测到文本溢出时展示。
- 不额外写原生 `title` / 自定义 slot tip。
- 状态、操作、排序、短枚举列不开。

### B. Select：收窄 readonly 灰样式

文件：`src/styles/prototype.css`（约 L722）

现有规则会把所有带 `t-is-readonly` 的输入染成灰。TDesign Select 内部 input 默认带该 class，但并非禁用。

落地写法：保留原灰样式，再追加一条更高优先级覆盖，仅恢复 `.t-select` 内 input 的可交互外观：

```css
.add-dock-dialog .t-input.t-is-readonly,
.add-dock-dialog .t-input.t-is-readonly .t-input__inner {
  color: #77838d;
  background: #f2f4f6;
  cursor: not-allowed;
}

/* Select 内部 input 默认 readonly，但不是禁用；恢复可交互外观 */
.add-dock-dialog .t-select .t-input.t-is-readonly,
.add-dock-dialog .t-select .t-input.t-is-readonly .t-input__inner {
  color: var(--ink);
  background: #fff;
  cursor: pointer;
}
```

真 `disabled` 的 Select / Input 仍走 TDesign `.t-is-disabled`，不受影响。  
`DockEditModal` 等对 SN/ICCID 使用的独立 `t-input readonly` 继续吃第一条灰规则。

## 验收

1. 流量运营：长编码/名称/备注/幂等键等溢出后悬停出现 tip；未溢出不无故弹空 tip。
2. 新建/编辑套餐、固件、任务等弹窗：状态等 `t-select` 不再呈现禁用灰，可正常展开选择。
3. 机巢编辑弹窗 SN/ICCID 只读输入仍为灰色不可编辑外观。
4. `npm run build` 通过；按既有流程部署（若用户要求上线）。

## 风险

- 百分比列宽下，偶发「视觉截断但 scrollWidth 未判定溢出」→ tip 不出现；属组件溢出检测特性。若验收仍不满意，再单开任务改固定 `minWidth` 或兜底 title。
- 覆盖 Select readonly 样式时需确认未误伤 `allowInput` 可输入型 Select（本项目弹窗筛选多为不可手输）。