diff --git a/.gitignore b/.gitignore index 75fc0c65e04..9e7921db485 100644 --- a/.gitignore +++ b/.gitignore @@ -46,3 +46,4 @@ nul .claude /deployment-materials/ /install.bat +/linkis-web/tests/ diff --git "a/docs/dev-2.0.0/design/\351\205\215\347\275\256\345\217\202\346\225\260\345\210\240\351\231\244\345\212\237\350\203\275_\350\256\276\350\256\241.md" "b/docs/dev-2.0.0/design/\351\205\215\347\275\256\345\217\202\346\225\260\345\210\240\351\231\244\345\212\237\350\203\275_\350\256\276\350\256\241.md" new file mode 100644 index 00000000000..dd642689785 --- /dev/null +++ "b/docs/dev-2.0.0/design/\351\205\215\347\275\256\345\217\202\346\225\260\345\210\240\351\231\244\345\212\237\350\203\275_\350\256\276\350\256\241.md" @@ -0,0 +1,856 @@ +# 配置参数删除功能 设计文档 + +## 文档信息 + +| 项目 | 内容 | +|------|------| +| **需求ID** | REQ-ENHANCE-001 | +| **设计ID** | DES-ENHANCE-001 | +| **需求名称** | 配置参数删除功能 | +| **设计类型** | 功能增强设计 | +| **目标模块** | linkis-web setting模块 | +| **创建时间** | 2026-05-28 | +| **分支** | dev-2.0.0 | +| **优先级** | P1 | + +--- + +## 一、设计概述 + +### 1.1 设计目标 + +为Linkis配置管理(Setting)模块新增单个配置参数删除功能,实现: +- **精细化管理**:支持Key-Value级别的配置删除 +- **权限安全**:仅管理员可执行删除操作 +- **用户友好**:提供清晰的确认对话框和操作反馈 + +### 1.2 设计范围 + +| 包含内容 | 不包含内容 | +|---------|-----------| +| ✅ 前端删除按钮UI实现 | ❌ 批量删除功能 | +| ✅ 权限控制(管理员校验) | ❌ 删除历史记录功能 | +| ✅ 删除确认对话框 | ❌ 配置参数回收站 | +| ✅ 后端API接口定义 | ❌ 配置导出/导入功能 | +| ✅ 前后端联调逻辑 | ❌ | + +### 1.3 技术选型 + +| 技术项 | 选型 | 版本 | +|--------|------|------| +| 前端框架 | Vue.js | 2.x | +| UI组件库 | iView | - | +| 状态管理 | Vuex | - | +| HTTP客户端 | axios | - | +| 后端框架 | Spring Boot | 2.7.12 | +| 数据库 | MySQL | - | + +--- + +## 二、架构设计 + +### 2.1 系统架构图 + +``` +┌─────────────────────────────────────────────────────────┐ +│ 前端层 (Vue.js) │ +├─────────────────────────────────────────────────────────┤ +│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │ +│ │ Setting │───▶│ Variable │───▶│ Delete │ │ +│ │ Component │ │ Component │ │ Handler │ │ +│ └─────────────┘ └─────────────┘ └─────────────┘ │ +│ │ │ │ +│ │ ┌─────────────┐ │ │ +│ └────────▶│ Permission │◀─────────────┘ │ +│ │ Check │ │ +│ └─────────────┘ │ +└─────────────────────────────────────────────────────────┘ + │ + ▼ +┌─────────────────────────────────────────────────────────┐ +│ 后端层 (Spring Boot) │ +├─────────────────────────────────────────────────────────┤ +│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │ +│ │ ConfigRest │───▶│ ConfigSvc │───▶│ ConfigDAO │ │ +│ │ fulApi │ │ │ │ │ │ +│ └─────────────┘ └─────────────┘ └─────────────┘ │ +│ │ │ │ +│ │ ┌─────────────┐ │ │ +│ └────────▶│ Permission │◀─────────────┘ │ +│ │ Validator │ │ +│ └─────────────┘ │ +└─────────────────────────────────────────────────────────┘ + │ + ▼ +┌─────────────────────────────────────────────────────────┐ +│ 数据层 (MySQL) │ +├─────────────────────────────────────────────────────────┤ +│ linkis_ps_configuration_config_key │ +│ linkis_ps_configuration_key_value │ +└─────────────────────────────────────────────────────────┘ +``` + +### 2.2 组件交互时序图 + +``` +用户 Setting组件 Variable组件 确认对话框 后端API + │ │ │ │ │ + │─ 点击删除 ─▶ │ │ │ │ + │ │ │ │ │ + │ │─ 权限校验 ─▶ │ │ │ + │ │◀──── isLogAdmin │ │ + │ │ │ │ │ + │ │ │─ 显示确认 ─▶ │ │ + │ │ │ │ │ + │─ 确认删除 ──│─────────────│─────────────│ │ + │ │ │ │ │ + │ │─ 删除事件 ──│─────────────│──────────▶│ + │ │ │ │ DELETE │ + │ │ │ │ /keyvalue │ + │ │ │ │ │ + │ │ │ │◀── 成功 ──│ + │ │ │ │ │ + │ │─ 移除配置项 ─│ │ │ + │ │◀── 成功提示─│ │ │ + │◀─ 显示成功 ─│ │ │ │ +``` + +--- + +## 三、前端详细设计 + +### 3.1 组件结构设计 + +#### 3.1.1 组件层次结构 + +``` +Setting (linkis-web/src/apps/linkis/module/setting/setting.vue) +│ +├── Variable (linkis-web/src/apps/linkis/components/variable/index.vue) +│ ├── 配置项名称显示 +│ ├── 配置Key显示 +│ ├── 配置值输入框 +│ └── 🗑️ 删除按钮 (新增) +│ +├── 确认对话框 (iView Modal) +│ +└── Message提示 (iView Message) +``` + +#### 3.1.2 数据流设计 + +``` +┌─────────────────────────────────────────────────────────┐ +│ 数据流向 │ +├─────────────────────────────────────────────────────────┤ +│ │ +│ sessionStorage Variable组件 │ +│ ┌──────────────┐ ┌──────────────┐ │ +│ │ isLogAdmin │──────────────▶│ v-show控制 │ │ +│ │ (true/false)│ │ 删除按钮显示 │ │ +│ └──────────────┘ └──────────────┘ │ +│ │ │ +│ ▼ │ +│ ┌──────────────┐ ┌──────────────┐ │ +│ │ fullTree数据 │◀──────────────│ handleDelete │ │ +│ │ (配置列表) │ │ Config事件 │ │ +│ └──────────────┘ └──────────────┘ │ +│ │ │ +│ ▼ │ +│ ┌──────────────┐ ┌──────────────┐ │ +│ │ 后端API响应 │──────────────▶│ splice移除 │ │ +│ │ (成功/失败) │ │ 配置项 │ │ +│ └──────────────┘ └──────────────┘ │ +│ │ +└─────────────────────────────────────────────────────────┘ +``` + +### 3.2 核心组件设计 + +#### 3.2.1 Variable组件改造 + +**文件路径**: `linkis-web/src/apps/linkis/components/variable/index.vue` + +**新增数据字段**: +```javascript +data() { + return { + // 新增:管理员权限标识 + isLogAdmin: storage.get('isLogAdmin', 'session') + } +} +``` + +**新增UI元素**: +```vue +