## 文档概述

本文档基于**ECode 插件能力**，针对**数据列表 - 可编辑表格模式**，提供**单元格动态编辑权限控制**的示例代码和自定义修改指南。

核心能力：根据表格当前行其他字段的值，动态控制指定列的单元格「可编辑 / 只读」状态。

---

## 一、适用场景

1. 系统中使用**数据列表 - 可编辑表格模式**组件；
2. 需要**动态控制**单元格编辑权限（不使用固定的只读 / 可编辑配置）；
3. 控制规则：依据当前行的**其他字段值**作为判断条件，动态切换目标列的编辑状态。

---

## 二、前置准备（必须获取 3 个关键 ID）

使用前需获取以下 3 个唯一标识，**仅替换 ID 值，不修改变量命名**：

表格

| **参数名称** | **含义** | **获取方式** |
| --- | --- | --- |
| comId | 可编辑表格组件唯一 ID | 打开设计器 → 复制组件 ID |
| 目标控制列 ID | 需要设置可编辑 / 只读的列字段 ID | 表单 - 字段管理 - ID |
| 判断条件列 ID | 作为控制依据的列字段 ID | 表单 - 字段管理 - ID |

---

## 三、ecode完整React示例代码

```javascript
// ====================== 示例：【需要调整的配置区】仅修改ID/值，不修改变量名 ======================
// 固定语义标识符：可编辑表格组件ID（仅替换值，禁止修改变量名comId）
const comId = 'd1d7bf5de3e14a84b88ea24753760e4c';
// 需要控制编辑状态的目标列字段ID
const targetColumnId = '1241944137966362663';
// 作为判断条件的列字段ID
const conditionColumnId = '1241944137966362664';
// 条件匹配值（满足该值时，目标列允许编辑）
const matchValue = '0';
// ==================================================================================

import { eventEmitter } from '@weapp/utils';

/**
 * 可编辑表格编辑权限控制插件
 * 固定插件格式，无需修改结构
 */
class DemoPlugin {
  // 插件唯一标识，固定格式，依赖comId生成
  name = `DemoPlugin_${comId}`;

  /**
   * 表格单元格编辑状态控制钩子，具体业务逻辑要自行调整，目前实现仅为示例！！！
   * @param {boolean} editable - 系统默认编辑状态
   * @param {object} opts - 上下文参数 { columnName: 当前列ID, rowData: 当前行数据 }
   * @returns {boolean[]} 最终编辑状态 [true=可编辑, false=只读]
   */
  getExcelTableCellEditStatus(editable, opts) {
    // 初始化最终编辑状态
    let finalEditable = editable;
    const { columnName, rowData } = opts;
    console.log(columnName,rowData);
    // 自定义控制逻辑：仅对目标列生效
    if (columnName === targetColumnId) {
      // 条件判断：兼容数组类型字段（下拉/人员/关联组件等），可选链避免空值报错
      if (rowData[conditionColumnId]?.[0]?.id === matchValue) {
        finalEditable = true;
      }
    }

    // 固定返回格式：必须返回布尔值数组,true为可编辑，false为不可编辑
    return [finalEditable];
  }
}

// 插件注册：监听表格就绪事件，自动挂载插件
eventEmitter.on('@weapp/designer', `plugin_center.ready.${comId}`, ({ registerPlugin }) => {
  registerPlugin(DemoPlugin);
});
```

---

## 四、核心代码逻辑说明

1. **插件注册**
  
  通过 `eventEmitter` 监听表格插件就绪事件，完成自定义插件的注册；
2. **核心钩子**
  
  `getExcelTableCellEditStatus` 是固定标准方法，专门用于控制可编辑表格的单元格状态；
  
  通过修改该函数的返回值的逻辑，来实现自定义控制编辑/只读
3. **判断逻辑**
  
  ① 校验当前列是否为目标控制列
  
  ② 读取当前行条件列的值，匹配成功则允许编辑
  
  ③ 兼容数组类型字段，使用可选链 `?.` 防止空值报错；
4. **返回规则**
  
  必须返回 `\[布尔值\]` 格式，是框架固定要求。

---

## 五、自定义修改指南

### 1. 反向控制（满足条件 → 设置只读）

直接修改赋值逻辑：

javascript

运行

```
if (rowData[conditionColumnId]?.[0]?.id === matchValue) {
  finalEditable = false; // 满足条件只读
}
```

### 2. 控制多个列

javascript

运行

```
// 配置多个目标列ID
const targetColumnIds = ['列ID1', '列ID2', '列ID3'];
// 判断逻辑
if (targetColumnIds.includes(columnName)) {
  // 执行统一控制逻辑
}
```

### 3. 普通字段（非数组）判断

文本 / 数字 / 日期等普通字段，直接取值：

javascript

运行

```
if (rowData[conditionColumnId] === matchValue) {
  finalEditable = true;
}
```

### 4. 多条件组合判断

javascript

运行

```
// 示例：条件列值=0 且 另一列值=100
if (rowData[conditionColumnId]?.[0]?.id === '0' && rowData['其他列ID'] === 100) {
  finalEditable = true;
}
```

---

## 六、常见问题

1. **代码不生效？**
  
  - 检查 `comId`（表格组件 ID）是否正确
  - 检查目标列 / 条件列字段 ID 是否匹配
  - 确认 ECode 代码已保存
2. **控制台报错？**
  
  - 空值导致：补充可选链 `?.` 兼容
3. **单元格状态不符合预期？**
  
  - 检查条件判断逻辑、匹配值是否正确
