附件管理在教育管理系统中的价值，在于统一管理上传文件、文件地址、类型筛选、预览和下载任务。模块需要和现有接口、权限、页面状态保持一致，不能只写成普通后台表格。
本文基于 系统功能/系统数据_附件管理 对应源码，把业务目标拆成模型字段、接口规则、页面交互和验收标准，形成 Codex 可执行的项目代码生成任务。
文章目录
设计与需求
附件管理不能只按普通 CRUD 理解。源码范围包括 server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue，这些文件共同决定页面入口、字段保存、接口动作、权限边界和验收口径。交给 Codex 的任务需要明确业务字段、接口前缀、页面回显和异常处理，避免后端字段、前端表单和 PDD 文档相互脱节。
#mermaid-svg-HkycuvoTfnZVB0od{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-HkycuvoTfnZVB0od .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-HkycuvoTfnZVB0od .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-HkycuvoTfnZVB0od .error-icon{fill:#552222;}#mermaid-svg-HkycuvoTfnZVB0od .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-HkycuvoTfnZVB0od .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-HkycuvoTfnZVB0od .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-HkycuvoTfnZVB0od .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-HkycuvoTfnZVB0od .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-HkycuvoTfnZVB0od .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-HkycuvoTfnZVB0od .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-HkycuvoTfnZVB0od .marker{fill:#333333;stroke:#333333;}#mermaid-svg-HkycuvoTfnZVB0od .marker.cross{stroke:#333333;}#mermaid-svg-HkycuvoTfnZVB0od svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-HkycuvoTfnZVB0od p{margin:0;}#mermaid-svg-HkycuvoTfnZVB0od .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#mermaid-svg-HkycuvoTfnZVB0od .cluster-label text{fill:#333;}#mermaid-svg-HkycuvoTfnZVB0od .cluster-label span{color:#333;}#mermaid-svg-HkycuvoTfnZVB0od .cluster-label span p{background-color:transparent;}#mermaid-svg-HkycuvoTfnZVB0od .label text,#mermaid-svg-HkycuvoTfnZVB0od span{fill:#333;color:#333;}#mermaid-svg-HkycuvoTfnZVB0od .node rect,#mermaid-svg-HkycuvoTfnZVB0od .node circle,#mermaid-svg-HkycuvoTfnZVB0od .node ellipse,#mermaid-svg-HkycuvoTfnZVB0od .node polygon,#mermaid-svg-HkycuvoTfnZVB0od .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-HkycuvoTfnZVB0od .rough-node .label text,#mermaid-svg-HkycuvoTfnZVB0od .node .label text,#mermaid-svg-HkycuvoTfnZVB0od .image-shape .label,#mermaid-svg-HkycuvoTfnZVB0od .icon-shape .label{text-anchor:middle;}#mermaid-svg-HkycuvoTfnZVB0od .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-HkycuvoTfnZVB0od .rough-node .label,#mermaid-svg-HkycuvoTfnZVB0od .node .label,#mermaid-svg-HkycuvoTfnZVB0od .image-shape .label,#mermaid-svg-HkycuvoTfnZVB0od .icon-shape .label{text-align:center;}#mermaid-svg-HkycuvoTfnZVB0od .node.clickable{cursor:pointer;}#mermaid-svg-HkycuvoTfnZVB0od .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-HkycuvoTfnZVB0od .arrowheadPath{fill:#333333;}#mermaid-svg-HkycuvoTfnZVB0od .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-HkycuvoTfnZVB0od .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-HkycuvoTfnZVB0od .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-HkycuvoTfnZVB0od .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-HkycuvoTfnZVB0od .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-HkycuvoTfnZVB0od .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-HkycuvoTfnZVB0od .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-HkycuvoTfnZVB0od .cluster text{fill:#333;}#mermaid-svg-HkycuvoTfnZVB0od .cluster span{color:#333;}#mermaid-svg-HkycuvoTfnZVB0od div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-HkycuvoTfnZVB0od .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-HkycuvoTfnZVB0od rect.text{fill:none;stroke-width:0;}#mermaid-svg-HkycuvoTfnZVB0od .icon-shape,#mermaid-svg-HkycuvoTfnZVB0od .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-HkycuvoTfnZVB0od .icon-shape p,#mermaid-svg-HkycuvoTfnZVB0od .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-HkycuvoTfnZVB0od .icon-shape .label rect,#mermaid-svg-HkycuvoTfnZVB0od .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-HkycuvoTfnZVB0od .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-HkycuvoTfnZVB0od .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-HkycuvoTfnZVB0od :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}#mermaid-svg-HkycuvoTfnZVB0od .input>*{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-HkycuvoTfnZVB0od .input span{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-HkycuvoTfnZVB0od .input tspan{fill:#1D39C4!important;}#mermaid-svg-HkycuvoTfnZVB0od .design>*{fill:#F6FFED!important;stroke:#52C41A!important;color:#237804!important;stroke-width:1.2px!important;}#mermaid-svg-HkycuvoTfnZVB0od .design span{fill:#F6FFED!important;stroke:#52C41A!important;color:#237804!important;stroke-width:1.2px!important;}#mermaid-svg-HkycuvoTfnZVB0od .design tspan{fill:#237804!important;}#mermaid-svg-HkycuvoTfnZVB0od .process>*{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-HkycuvoTfnZVB0od .process span{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-HkycuvoTfnZVB0od .process tspan{fill:#AD4E00!important;}#mermaid-svg-HkycuvoTfnZVB0od .check>*{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-HkycuvoTfnZVB0od .check span{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-HkycuvoTfnZVB0od .check tspan{fill:#531DAB!important;}#mermaid-svg-HkycuvoTfnZVB0od .output>*{fill:#E6FFFB!important;stroke:#13C2C2!important;color:#006D75!important;stroke-width:1.2px!important;}#mermaid-svg-HkycuvoTfnZVB0od .output span{fill:#E6FFFB!important;stroke:#13C2C2!important;color:#006D75!important;stroke-width:1.2px!important;}#mermaid-svg-HkycuvoTfnZVB0od .output tspan{fill:#006D75!important;} 生成阶段
设计阶段
输入阶段
教育需求
附件管理
页面结构
数据模型
接口规则
权限验收
读取源码
生成代码
验收修复
| 需求层描述 | 设计层转换 | Codex 代码生成方向 |
|---|---|---|
| 业务目标 | 统一管理上传文件、文件地址、类型筛选、预览和下载任务。 | 生成模块入口、页面结构和业务说明 |
| 数据模型 | name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人） | 生成序列化、字段校验、查询筛选和保存回显 |
| 页面结构 | server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue | 生成列表、筛选区、表单、详情、预览或自定义操作区 |
| 接口规则 | /api/system/file/、/api/system/file/create_download_task/ | 保持 GetList、GetObj、AddObj、UpdateObj、DelObj、CreateDownloadTask、get_all、rehost_remote_image、create_download_task 与页面调用一致 |
| 权限验收 | 按钮权限、接口权限、用户数据范围、异常响应 | 在 PDD 中列出角色、接口和越权用例 |
| 扩展能力 | 数据联动、文件管理、资源预览、异步任务 | 只实现源码中真实存在的扩展入口和服务边界 |
更适合交给 Codex 的需求说明，应覆盖源码路径、字段、接口和验收口径。附件管理的重点是把 FileList 与前端接口封装、列表配置、表单状态或自定义页面逻辑合并成一个可测试的模块任务。
可以直接使用下面的Prompt进行模块功能的设计
text
请 Codex 基于教育管理系统真实源码设计"附件管理"模块。
业务说明：统一管理上传文件、文件地址、类型筛选、预览和下载任务。
源码范围：server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue
接口范围：/api/system/file/、/api/system/file/create_download_task/
字段范围：name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）、create_datetime（创建时间）
已有动作：GetList、GetObj、AddObj、UpdateObj、DelObj、CreateDownloadTask、get_all、rehost_remote_image、create_download_task
扩展能力边界：数据联动、文件管理、资源预览、异步任务
请输出模块页面结构、数据模型、接口规则、权限验收、测试用例和 Codex 代码生成任务。只允许使用源码中存在的字段、接口和页面状态。后端设计
附件管理的后端设计重点不是堆 CRUD 接口，而是建立可复用的数据底座。当前后端范围包括 server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py。Codex 需要识别模型字段、序列化器、ViewSet、筛选逻辑和自定义 action，并让接口返回结构稳定服务前端。
源码中可识别的模型或查询对象为 FileList，核心字段覆盖 name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）。接口动作包含 GetList、GetObj、AddObj、UpdateObj、DelObj、CreateDownloadTask、get_all、rehost_remote_image、create_download_task，查询参数关注 system（system）、url（文件地址）、source（source）、file_name（文件名）、relative_dir（relative_dir）、upload_dir（upload_dir）、upload_scene（upload_scene）、category（category）、group（group）、id（ID），这些内容需要和前端封装保持同名语义，避免页面有按钮但后端没有对应能力。
| 后端设计项 | 设计重点 | Codex 生成方向 |
|---|---|---|
| 核心字段 | name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型） | 生成序列化、查询筛选、表单回显和保存校验 |
| 补充字段 | size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人） | 处理状态、时间、JSON、资源或关联字段的格式转换 |
| 接口视图 | server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py | 按 /api/system/file/、/api/system/file/create_download_task/ 注册列表、详情、保存、删除和已有 action |
| 查询筛选 | system（system）、url（文件地址）、source（source）、file_name（文件名）、relative_dir（relative_dir）、upload_dir（upload_dir）、upload_scene（upload_scene）、category（category）、group（group）、id（ID） | 生成 filterset、SearchFilter 或自定义查询参数 |
| 权限控制 | 后端接口承担真实访问边界，前端按钮只做入口展示 | 生成权限判断、异常响应和越权测试 |
| 扩展服务 | 数据联动、文件管理、资源预览、异步任务 | 按真实源码补齐服务函数、异步任务或状态回写 |
可以直接使用下面的Prompt进行后端代码的设计
text
请 Codex 按"附件管理"业务从源码上下文设计或补齐后端代码。
后端源码范围：server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py
模型或查询对象：FileList
模型字段范围：name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）、create_datetime（创建时间）
接口前缀：/api/system/file/、/api/system/file/create_download_task/
已有接口动作：GetList、GetObj、AddObj、UpdateObj、DelObj、CreateDownloadTask、get_all、rehost_remote_image、create_download_task
查询参数：system（system）、url（文件地址）、source（source）、file_name（文件名）、relative_dir（relative_dir）、upload_dir（upload_dir）、upload_scene（upload_scene）、category（category）、group（group）、id（ID）
需要生成或修正数据模型、序列化规则、接口视图、路由注册、筛选查询、权限控制和基础校验。同时补齐 数据联动、文件管理、资源预览、异步任务 对应的后端接口或服务边界。
输出时列出涉及文件、字段校验、接口返回结构和需要执行的测试。前端设计
附件管理的前端设计重点不是把字段堆到页面上，而是让用户能按业务路径完成查询、编辑、状态处理和结果确认。当前前端范围包括 server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue，其中 api.ts 负责接口封装，crud.tsx 或 index.vue 负责列表、表单、自定义布局和按钮交互。
页面需要围绕 name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人） 组织筛选、表单和详情。保存前要处理字段格式转换，保存后刷新列表或回显详情；存在扩展能力时，还要把 数据联动、文件管理、资源预览、异步任务 的入口、状态和结果纳入同一套页面状态。
| 前端设计项 | 设计重点 | Codex 生成方向 |
|---|---|---|
| 页面结构 | server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue | 生成列表、筛选区、表单、详情抽屉、弹窗或自定义操作区 |
| 接口封装 | /api/system/file/、/api/system/file/create_download_task/ | 统一封装查询、详情、保存、删除和 GetList、GetObj、AddObj、UpdateObj、DelObj、CreateDownloadTask、get_all、rehost_remote_image、create_download_task 等动作 |
| 字段回显 | name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人） | 处理下拉、树形、JSON、状态、时间和资源字段回显 |
| 权限按钮 | 根据 auth、按钮权限或后端权限结果展示操作入口 | 生成新增、编辑、删除、处理、下载或预览按钮 |
| 扩展交互 | 数据联动、文件管理、资源预览、异步任务 | 生成入口按钮、加载状态、结果回填、人工确认和异常提示 |
可以直接使用下面的Prompt进行前端代码的设计
text
请 Codex 按"附件管理"业务生成或补齐前端页面代码。
前端源码范围：server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue
接口范围：/api/system/file/、/api/system/file/create_download_task/
字段范围：name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）、create_datetime（创建时间）
已有动作：GetList、GetObj、AddObj、UpdateObj、DelObj、CreateDownloadTask、get_all、rehost_remote_image、create_download_task
需要生成页面结构、列表查询、筛选区域、新增编辑表单、详情预览、权限按钮、保存回显和接口调用；源码已有批量入口时再接入批量操作。涉及扩展交互时只实现源码已有的 数据联动、文件管理、资源预览、异步任务，包括入口按钮、状态提示、结果回填和保存回显。
输出时说明字段转换、表单初始化、异常提示和刷新策略。扩展功能
附件管理的扩展能力来自源码中的字段结构、接口动作或页面组件，不属于单纯 CRUD。它们的价值在于把教育管理系统中的生成、识别、统计、文件、审批、任务或批量流程接入真实业务数据。
| 扩展功能 | 主要用途 | 落地重点 |
|---|---|---|
| 数据联动 | 把筛选条件、树节点、状态字段、远程下拉和表单回显组织成稳定数据流。 | 字段变化要同步查询参数、保存载荷和回显结构，避免页面临时状态与后端字段脱节。 |
| 文件管理 | 把上传、下载、附件地址、音视频或资源文件保存到业务记录。 | 文件地址与业务字段分开校验，前端只展示有权限访问的资源。 |
| 资源预览 | 把图片、音频、视频、PDF、Markdown、HTML 或业务结果以预览方式展示。 | 预览内容来自已保存字段或生成结果，保存前保留人工校对。 |
| 异步任务 | 把耗时生成、导出、下载或后台执行动作交给任务中心跟踪。 | 接口返回任务 ID、状态和错误信息，页面轮询或刷新展示结果。 |
数据联动
源码中的 name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）、接口参数和页面状态之间存在联动关系。Codex 生成时需要把查询条件、表单选择、字段转换和详情回显串成一条数据流，不能把每个下拉框或状态开关写成互不关联的临时变量。
#mermaid-svg-5zHrsNDymY0MG4Ep{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-5zHrsNDymY0MG4Ep .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-5zHrsNDymY0MG4Ep .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-5zHrsNDymY0MG4Ep .error-icon{fill:#552222;}#mermaid-svg-5zHrsNDymY0MG4Ep .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-5zHrsNDymY0MG4Ep .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-5zHrsNDymY0MG4Ep .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-5zHrsNDymY0MG4Ep .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-5zHrsNDymY0MG4Ep .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-5zHrsNDymY0MG4Ep .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-5zHrsNDymY0MG4Ep .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-5zHrsNDymY0MG4Ep .marker{fill:#333333;stroke:#333333;}#mermaid-svg-5zHrsNDymY0MG4Ep .marker.cross{stroke:#333333;}#mermaid-svg-5zHrsNDymY0MG4Ep svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-5zHrsNDymY0MG4Ep p{margin:0;}#mermaid-svg-5zHrsNDymY0MG4Ep .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#mermaid-svg-5zHrsNDymY0MG4Ep .cluster-label text{fill:#333;}#mermaid-svg-5zHrsNDymY0MG4Ep .cluster-label span{color:#333;}#mermaid-svg-5zHrsNDymY0MG4Ep .cluster-label span p{background-color:transparent;}#mermaid-svg-5zHrsNDymY0MG4Ep .label text,#mermaid-svg-5zHrsNDymY0MG4Ep span{fill:#333;color:#333;}#mermaid-svg-5zHrsNDymY0MG4Ep .node rect,#mermaid-svg-5zHrsNDymY0MG4Ep .node circle,#mermaid-svg-5zHrsNDymY0MG4Ep .node ellipse,#mermaid-svg-5zHrsNDymY0MG4Ep .node polygon,#mermaid-svg-5zHrsNDymY0MG4Ep .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-5zHrsNDymY0MG4Ep .rough-node .label text,#mermaid-svg-5zHrsNDymY0MG4Ep .node .label text,#mermaid-svg-5zHrsNDymY0MG4Ep .image-shape .label,#mermaid-svg-5zHrsNDymY0MG4Ep .icon-shape .label{text-anchor:middle;}#mermaid-svg-5zHrsNDymY0MG4Ep .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-5zHrsNDymY0MG4Ep .rough-node .label,#mermaid-svg-5zHrsNDymY0MG4Ep .node .label,#mermaid-svg-5zHrsNDymY0MG4Ep .image-shape .label,#mermaid-svg-5zHrsNDymY0MG4Ep .icon-shape .label{text-align:center;}#mermaid-svg-5zHrsNDymY0MG4Ep .node.clickable{cursor:pointer;}#mermaid-svg-5zHrsNDymY0MG4Ep .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-5zHrsNDymY0MG4Ep .arrowheadPath{fill:#333333;}#mermaid-svg-5zHrsNDymY0MG4Ep .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-5zHrsNDymY0MG4Ep .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-5zHrsNDymY0MG4Ep .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-5zHrsNDymY0MG4Ep .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-5zHrsNDymY0MG4Ep .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-5zHrsNDymY0MG4Ep .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-5zHrsNDymY0MG4Ep .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-5zHrsNDymY0MG4Ep .cluster text{fill:#333;}#mermaid-svg-5zHrsNDymY0MG4Ep .cluster span{color:#333;}#mermaid-svg-5zHrsNDymY0MG4Ep div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-5zHrsNDymY0MG4Ep .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-5zHrsNDymY0MG4Ep rect.text{fill:none;stroke-width:0;}#mermaid-svg-5zHrsNDymY0MG4Ep .icon-shape,#mermaid-svg-5zHrsNDymY0MG4Ep .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-5zHrsNDymY0MG4Ep .icon-shape p,#mermaid-svg-5zHrsNDymY0MG4Ep .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-5zHrsNDymY0MG4Ep .icon-shape .label rect,#mermaid-svg-5zHrsNDymY0MG4Ep .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-5zHrsNDymY0MG4Ep .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-5zHrsNDymY0MG4Ep .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-5zHrsNDymY0MG4Ep :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}#mermaid-svg-5zHrsNDymY0MG4Ep .input>*{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .input span{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .input tspan{fill:#1D39C4!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .process>*{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .process span{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .process tspan{fill:#AD4E00!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .check>*{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .check span{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .check tspan{fill:#531DAB!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .output>*{fill:#E6FFFB!important;stroke:#13C2C2!important;color:#006D75!important;stroke-width:1.2px!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .output span{fill:#E6FFFB!important;stroke:#13C2C2!important;color:#006D75!important;stroke-width:1.2px!important;}#mermaid-svg-5zHrsNDymY0MG4Ep .output tspan{fill:#006D75!important;} 结果阶段
处理阶段
输入阶段
筛选条件
表单选择
参数转换
接口请求
字段回显
列表刷新
状态更新
交给 Codex 生成时，边界要限定在 server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue 内。字段变化要同步查询参数、保存载荷和回显结构，避免页面临时状态与后端字段脱节。 同时需要补齐权限判断、异常提示、保存回显和测试用例。
可以直接使用下面的Prompt进行数据联动设计
text
请 Codex 基于真实源码补齐"附件管理"的数据联动能力。
模块源码范围：server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue
接口范围：/api/system/file/、/api/system/file/create_download_task/
字段范围：name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）、create_datetime（创建时间）
功能用途：把筛选条件、树节点、状态字段、远程下拉和表单回显组织成稳定数据流。
落地边界：字段变化要同步查询参数、保存载荷和回显结构，避免页面临时状态与后端字段脱节。
要求只使用源码中已经存在的字段、接口和页面状态，不新增未确认的业务能力。输出接口设计、前端交互、权限约束、异常处理和验收清单。文件管理
文件管理能力用于把上传、下载、附件地址、音视频或资源文件保存到业务记录。交给 Codex 生成时，边界要限定在 server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue 内，重点是文件地址与业务字段分开校验，前端只展示有权限访问的资源。
#mermaid-svg-SK2zGKzb6yQc8Byh{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-SK2zGKzb6yQc8Byh .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-SK2zGKzb6yQc8Byh .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-SK2zGKzb6yQc8Byh .error-icon{fill:#552222;}#mermaid-svg-SK2zGKzb6yQc8Byh .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-SK2zGKzb6yQc8Byh .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-SK2zGKzb6yQc8Byh .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-SK2zGKzb6yQc8Byh .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-SK2zGKzb6yQc8Byh .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-SK2zGKzb6yQc8Byh .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-SK2zGKzb6yQc8Byh .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-SK2zGKzb6yQc8Byh .marker{fill:#333333;stroke:#333333;}#mermaid-svg-SK2zGKzb6yQc8Byh .marker.cross{stroke:#333333;}#mermaid-svg-SK2zGKzb6yQc8Byh svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-SK2zGKzb6yQc8Byh p{margin:0;}#mermaid-svg-SK2zGKzb6yQc8Byh .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#mermaid-svg-SK2zGKzb6yQc8Byh .cluster-label text{fill:#333;}#mermaid-svg-SK2zGKzb6yQc8Byh .cluster-label span{color:#333;}#mermaid-svg-SK2zGKzb6yQc8Byh .cluster-label span p{background-color:transparent;}#mermaid-svg-SK2zGKzb6yQc8Byh .label text,#mermaid-svg-SK2zGKzb6yQc8Byh span{fill:#333;color:#333;}#mermaid-svg-SK2zGKzb6yQc8Byh .node rect,#mermaid-svg-SK2zGKzb6yQc8Byh .node circle,#mermaid-svg-SK2zGKzb6yQc8Byh .node ellipse,#mermaid-svg-SK2zGKzb6yQc8Byh .node polygon,#mermaid-svg-SK2zGKzb6yQc8Byh .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-SK2zGKzb6yQc8Byh .rough-node .label text,#mermaid-svg-SK2zGKzb6yQc8Byh .node .label text,#mermaid-svg-SK2zGKzb6yQc8Byh .image-shape .label,#mermaid-svg-SK2zGKzb6yQc8Byh .icon-shape .label{text-anchor:middle;}#mermaid-svg-SK2zGKzb6yQc8Byh .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-SK2zGKzb6yQc8Byh .rough-node .label,#mermaid-svg-SK2zGKzb6yQc8Byh .node .label,#mermaid-svg-SK2zGKzb6yQc8Byh .image-shape .label,#mermaid-svg-SK2zGKzb6yQc8Byh .icon-shape .label{text-align:center;}#mermaid-svg-SK2zGKzb6yQc8Byh .node.clickable{cursor:pointer;}#mermaid-svg-SK2zGKzb6yQc8Byh .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-SK2zGKzb6yQc8Byh .arrowheadPath{fill:#333333;}#mermaid-svg-SK2zGKzb6yQc8Byh .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-SK2zGKzb6yQc8Byh .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-SK2zGKzb6yQc8Byh .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-SK2zGKzb6yQc8Byh .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-SK2zGKzb6yQc8Byh .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-SK2zGKzb6yQc8Byh .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-SK2zGKzb6yQc8Byh .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-SK2zGKzb6yQc8Byh .cluster text{fill:#333;}#mermaid-svg-SK2zGKzb6yQc8Byh .cluster span{color:#333;}#mermaid-svg-SK2zGKzb6yQc8Byh div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-SK2zGKzb6yQc8Byh .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-SK2zGKzb6yQc8Byh rect.text{fill:none;stroke-width:0;}#mermaid-svg-SK2zGKzb6yQc8Byh .icon-shape,#mermaid-svg-SK2zGKzb6yQc8Byh .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-SK2zGKzb6yQc8Byh .icon-shape p,#mermaid-svg-SK2zGKzb6yQc8Byh .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-SK2zGKzb6yQc8Byh .icon-shape .label rect,#mermaid-svg-SK2zGKzb6yQc8Byh .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-SK2zGKzb6yQc8Byh .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-SK2zGKzb6yQc8Byh .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-SK2zGKzb6yQc8Byh :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}#mermaid-svg-SK2zGKzb6yQc8Byh .input>*{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .input span{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .input tspan{fill:#1D39C4!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .process>*{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .process span{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .process tspan{fill:#AD4E00!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .check>*{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .check span{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .check tspan{fill:#531DAB!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .output>*{fill:#E6FFFB!important;stroke:#13C2C2!important;color:#006D75!important;stroke-width:1.2px!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .output span{fill:#E6FFFB!important;stroke:#13C2C2!important;color:#006D75!important;stroke-width:1.2px!important;}#mermaid-svg-SK2zGKzb6yQc8Byh .output tspan{fill:#006D75!important;} 结果阶段
处理阶段
输入阶段
选择文件
业务记录
上传保存
地址校验
权限检查
资源展示
下载访问
交给 Codex 生成时，边界要限定在 server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue 内。文件地址与业务字段分开校验，前端只展示有权限访问的资源。 同时需要补齐权限判断、异常提示、保存回显和测试用例。
可以直接使用下面的Prompt进行文件管理功能设计
text
请 Codex 基于真实源码补齐"附件管理"的文件管理能力。
模块源码范围：server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue
接口范围：/api/system/file/、/api/system/file/create_download_task/
字段范围：name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）、create_datetime（创建时间）
功能用途：把上传、下载、附件地址、音视频或资源文件保存到业务记录。
落地边界：文件地址与业务字段分开校验，前端只展示有权限访问的资源。
要求只使用源码中已经存在的字段、接口和页面状态，不新增未确认的业务能力。输出接口设计、前端交互、权限约束、异常处理和验收清单。资源预览
资源预览能力用于把图片、音频、视频、PDF、Markdown、HTML 或业务结果以预览方式展示。交给 Codex 生成时，边界要限定在 server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue 内，重点是预览内容来自已保存字段或生成结果，保存前保留人工校对。
#mermaid-svg-fi4mw5lCZq82uZcx{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-fi4mw5lCZq82uZcx .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-fi4mw5lCZq82uZcx .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-fi4mw5lCZq82uZcx .error-icon{fill:#552222;}#mermaid-svg-fi4mw5lCZq82uZcx .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-fi4mw5lCZq82uZcx .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-fi4mw5lCZq82uZcx .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-fi4mw5lCZq82uZcx .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-fi4mw5lCZq82uZcx .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-fi4mw5lCZq82uZcx .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-fi4mw5lCZq82uZcx .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-fi4mw5lCZq82uZcx .marker{fill:#333333;stroke:#333333;}#mermaid-svg-fi4mw5lCZq82uZcx .marker.cross{stroke:#333333;}#mermaid-svg-fi4mw5lCZq82uZcx svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-fi4mw5lCZq82uZcx p{margin:0;}#mermaid-svg-fi4mw5lCZq82uZcx .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#mermaid-svg-fi4mw5lCZq82uZcx .cluster-label text{fill:#333;}#mermaid-svg-fi4mw5lCZq82uZcx .cluster-label span{color:#333;}#mermaid-svg-fi4mw5lCZq82uZcx .cluster-label span p{background-color:transparent;}#mermaid-svg-fi4mw5lCZq82uZcx .label text,#mermaid-svg-fi4mw5lCZq82uZcx span{fill:#333;color:#333;}#mermaid-svg-fi4mw5lCZq82uZcx .node rect,#mermaid-svg-fi4mw5lCZq82uZcx .node circle,#mermaid-svg-fi4mw5lCZq82uZcx .node ellipse,#mermaid-svg-fi4mw5lCZq82uZcx .node polygon,#mermaid-svg-fi4mw5lCZq82uZcx .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-fi4mw5lCZq82uZcx .rough-node .label text,#mermaid-svg-fi4mw5lCZq82uZcx .node .label text,#mermaid-svg-fi4mw5lCZq82uZcx .image-shape .label,#mermaid-svg-fi4mw5lCZq82uZcx .icon-shape .label{text-anchor:middle;}#mermaid-svg-fi4mw5lCZq82uZcx .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-fi4mw5lCZq82uZcx .rough-node .label,#mermaid-svg-fi4mw5lCZq82uZcx .node .label,#mermaid-svg-fi4mw5lCZq82uZcx .image-shape .label,#mermaid-svg-fi4mw5lCZq82uZcx .icon-shape .label{text-align:center;}#mermaid-svg-fi4mw5lCZq82uZcx .node.clickable{cursor:pointer;}#mermaid-svg-fi4mw5lCZq82uZcx .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-fi4mw5lCZq82uZcx .arrowheadPath{fill:#333333;}#mermaid-svg-fi4mw5lCZq82uZcx .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-fi4mw5lCZq82uZcx .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-fi4mw5lCZq82uZcx .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-fi4mw5lCZq82uZcx .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-fi4mw5lCZq82uZcx .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-fi4mw5lCZq82uZcx .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-fi4mw5lCZq82uZcx .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-fi4mw5lCZq82uZcx .cluster text{fill:#333;}#mermaid-svg-fi4mw5lCZq82uZcx .cluster span{color:#333;}#mermaid-svg-fi4mw5lCZq82uZcx div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-fi4mw5lCZq82uZcx .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-fi4mw5lCZq82uZcx rect.text{fill:none;stroke-width:0;}#mermaid-svg-fi4mw5lCZq82uZcx .icon-shape,#mermaid-svg-fi4mw5lCZq82uZcx .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-fi4mw5lCZq82uZcx .icon-shape p,#mermaid-svg-fi4mw5lCZq82uZcx .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-fi4mw5lCZq82uZcx .icon-shape .label rect,#mermaid-svg-fi4mw5lCZq82uZcx .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-fi4mw5lCZq82uZcx .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-fi4mw5lCZq82uZcx .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-fi4mw5lCZq82uZcx :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}#mermaid-svg-fi4mw5lCZq82uZcx .input>*{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-fi4mw5lCZq82uZcx .input span{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-fi4mw5lCZq82uZcx .input tspan{fill:#1D39C4!important;}#mermaid-svg-fi4mw5lCZq82uZcx .process>*{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-fi4mw5lCZq82uZcx .process span{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-fi4mw5lCZq82uZcx .process tspan{fill:#AD4E00!important;}#mermaid-svg-fi4mw5lCZq82uZcx .check>*{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-fi4mw5lCZq82uZcx .check span{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-fi4mw5lCZq82uZcx .check tspan{fill:#531DAB!important;}#mermaid-svg-fi4mw5lCZq82uZcx .output>*{fill:#E6FFFB!important;stroke:#13C2C2!important;color:#006D75!important;stroke-width:1.2px!important;}#mermaid-svg-fi4mw5lCZq82uZcx .output span{fill:#E6FFFB!important;stroke:#13C2C2!important;color:#006D75!important;stroke-width:1.2px!important;}#mermaid-svg-fi4mw5lCZq82uZcx .output tspan{fill:#006D75!important;} 结果阶段
处理阶段
输入阶段
资源地址
预览入口
类型判断
权限校验
渲染组件
预览展示
异常提示
交给 Codex 生成时，边界要限定在 server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue 内。预览内容来自已保存字段或生成结果，保存前保留人工校对。 同时需要补齐权限判断、异常提示、保存回显和测试用例。
可以直接使用下面的Prompt进行资源预览功能设计
text
请 Codex 基于真实源码补齐"附件管理"的资源预览能力。
模块源码范围：server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue
接口范围：/api/system/file/、/api/system/file/create_download_task/
字段范围：name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）、create_datetime（创建时间）
功能用途：把图片、音频、视频、PDF、Markdown、HTML 或业务结果以预览方式展示。
落地边界：预览内容来自已保存字段或生成结果，保存前保留人工校对。
要求只使用源码中已经存在的字段、接口和页面状态，不新增未确认的业务能力。输出接口设计、前端交互、权限约束、异常处理和验收清单。异步任务
异步任务能力用于把耗时生成、导出、下载或后台执行动作交给任务中心跟踪。交给 Codex 生成时，边界要限定在 server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue 内，重点是接口返回任务 ID、状态和错误信息，页面轮询或刷新展示结果。
#mermaid-svg-p084lRlXoIuT1J0w{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-p084lRlXoIuT1J0w .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-p084lRlXoIuT1J0w .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-p084lRlXoIuT1J0w .error-icon{fill:#552222;}#mermaid-svg-p084lRlXoIuT1J0w .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-p084lRlXoIuT1J0w .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-p084lRlXoIuT1J0w .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-p084lRlXoIuT1J0w .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-p084lRlXoIuT1J0w .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-p084lRlXoIuT1J0w .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-p084lRlXoIuT1J0w .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-p084lRlXoIuT1J0w .marker{fill:#333333;stroke:#333333;}#mermaid-svg-p084lRlXoIuT1J0w .marker.cross{stroke:#333333;}#mermaid-svg-p084lRlXoIuT1J0w svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-p084lRlXoIuT1J0w p{margin:0;}#mermaid-svg-p084lRlXoIuT1J0w .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#mermaid-svg-p084lRlXoIuT1J0w .cluster-label text{fill:#333;}#mermaid-svg-p084lRlXoIuT1J0w .cluster-label span{color:#333;}#mermaid-svg-p084lRlXoIuT1J0w .cluster-label span p{background-color:transparent;}#mermaid-svg-p084lRlXoIuT1J0w .label text,#mermaid-svg-p084lRlXoIuT1J0w span{fill:#333;color:#333;}#mermaid-svg-p084lRlXoIuT1J0w .node rect,#mermaid-svg-p084lRlXoIuT1J0w .node circle,#mermaid-svg-p084lRlXoIuT1J0w .node ellipse,#mermaid-svg-p084lRlXoIuT1J0w .node polygon,#mermaid-svg-p084lRlXoIuT1J0w .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-p084lRlXoIuT1J0w .rough-node .label text,#mermaid-svg-p084lRlXoIuT1J0w .node .label text,#mermaid-svg-p084lRlXoIuT1J0w .image-shape .label,#mermaid-svg-p084lRlXoIuT1J0w .icon-shape .label{text-anchor:middle;}#mermaid-svg-p084lRlXoIuT1J0w .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-p084lRlXoIuT1J0w .rough-node .label,#mermaid-svg-p084lRlXoIuT1J0w .node .label,#mermaid-svg-p084lRlXoIuT1J0w .image-shape .label,#mermaid-svg-p084lRlXoIuT1J0w .icon-shape .label{text-align:center;}#mermaid-svg-p084lRlXoIuT1J0w .node.clickable{cursor:pointer;}#mermaid-svg-p084lRlXoIuT1J0w .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-p084lRlXoIuT1J0w .arrowheadPath{fill:#333333;}#mermaid-svg-p084lRlXoIuT1J0w .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-p084lRlXoIuT1J0w .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-p084lRlXoIuT1J0w .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-p084lRlXoIuT1J0w .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-p084lRlXoIuT1J0w .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-p084lRlXoIuT1J0w .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-p084lRlXoIuT1J0w .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-p084lRlXoIuT1J0w .cluster text{fill:#333;}#mermaid-svg-p084lRlXoIuT1J0w .cluster span{color:#333;}#mermaid-svg-p084lRlXoIuT1J0w div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-p084lRlXoIuT1J0w .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-p084lRlXoIuT1J0w rect.text{fill:none;stroke-width:0;}#mermaid-svg-p084lRlXoIuT1J0w .icon-shape,#mermaid-svg-p084lRlXoIuT1J0w .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-p084lRlXoIuT1J0w .icon-shape p,#mermaid-svg-p084lRlXoIuT1J0w .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-p084lRlXoIuT1J0w .icon-shape .label rect,#mermaid-svg-p084lRlXoIuT1J0w .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-p084lRlXoIuT1J0w .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-p084lRlXoIuT1J0w .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-p084lRlXoIuT1J0w :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}#mermaid-svg-p084lRlXoIuT1J0w .input>*{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-p084lRlXoIuT1J0w .input span{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-p084lRlXoIuT1J0w .input tspan{fill:#1D39C4!important;}#mermaid-svg-p084lRlXoIuT1J0w .process>*{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-p084lRlXoIuT1J0w .process span{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-p084lRlXoIuT1J0w .process tspan{fill:#AD4E00!important;}#mermaid-svg-p084lRlXoIuT1J0w .check>*{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-p084lRlXoIuT1J0w .check span{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-p084lRlXoIuT1J0w .check tspan{fill:#531DAB!important;}#mermaid-svg-p084lRlXoIuT1J0w .output>*{fill:#E6FFFB!important;stroke:#13C2C2!important;color:#006D75!important;stroke-width:1.2px!important;}#mermaid-svg-p084lRlXoIuT1J0w .output span{fill:#E6FFFB!important;stroke:#13C2C2!important;color:#006D75!important;stroke-width:1.2px!important;}#mermaid-svg-p084lRlXoIuT1J0w .output tspan{fill:#006D75!important;} 结果阶段
处理阶段
输入阶段
任务输入
执行入口
参数校验
后台执行
状态回写
结果展示
异常处理
交给 Codex 生成时，边界要限定在 server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue 内。接口返回任务 ID、状态和错误信息，页面轮询或刷新展示结果。 同时需要补齐权限判断、异常提示、保存回显和测试用例。
可以直接使用下面的Prompt进行异步任务设计
text
请 Codex 基于真实源码补齐"附件管理"的异步任务能力。
模块源码范围：server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue
接口范围：/api/system/file/、/api/system/file/create_download_task/
字段范围：name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）、create_datetime（创建时间）
功能用途：把耗时生成、导出、下载或后台执行动作交给任务中心跟踪。
落地边界：接口返回任务 ID、状态和错误信息，页面轮询或刷新展示结果。
要求只使用源码中已经存在的字段、接口和页面状态，不新增未确认的业务能力。输出接口设计、前端交互、权限约束、异常处理和验收清单。Codex开发标准
使用 Codex 开发 附件管理 时，不能直接让它随意写代码。需求边界、PDD、SOP、接口权限规则和验收标准需要同时约束后端、前端和扩展能力，让生成结果能回到项目源码中运行。
#mermaid-svg-rtTA5Pdjn8OOKcoc{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#mermaid-svg-rtTA5Pdjn8OOKcoc .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#mermaid-svg-rtTA5Pdjn8OOKcoc .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#mermaid-svg-rtTA5Pdjn8OOKcoc .error-icon{fill:#552222;}#mermaid-svg-rtTA5Pdjn8OOKcoc .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-rtTA5Pdjn8OOKcoc .edge-thickness-normal{stroke-width:1px;}#mermaid-svg-rtTA5Pdjn8OOKcoc .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-rtTA5Pdjn8OOKcoc .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-rtTA5Pdjn8OOKcoc .edge-thickness-invisible{stroke-width:0;fill:none;}#mermaid-svg-rtTA5Pdjn8OOKcoc .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-rtTA5Pdjn8OOKcoc .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-rtTA5Pdjn8OOKcoc .marker{fill:#333333;stroke:#333333;}#mermaid-svg-rtTA5Pdjn8OOKcoc .marker.cross{stroke:#333333;}#mermaid-svg-rtTA5Pdjn8OOKcoc svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-rtTA5Pdjn8OOKcoc p{margin:0;}#mermaid-svg-rtTA5Pdjn8OOKcoc .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#mermaid-svg-rtTA5Pdjn8OOKcoc .cluster-label text{fill:#333;}#mermaid-svg-rtTA5Pdjn8OOKcoc .cluster-label span{color:#333;}#mermaid-svg-rtTA5Pdjn8OOKcoc .cluster-label span p{background-color:transparent;}#mermaid-svg-rtTA5Pdjn8OOKcoc .label text,#mermaid-svg-rtTA5Pdjn8OOKcoc span{fill:#333;color:#333;}#mermaid-svg-rtTA5Pdjn8OOKcoc .node rect,#mermaid-svg-rtTA5Pdjn8OOKcoc .node circle,#mermaid-svg-rtTA5Pdjn8OOKcoc .node ellipse,#mermaid-svg-rtTA5Pdjn8OOKcoc .node polygon,#mermaid-svg-rtTA5Pdjn8OOKcoc .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-rtTA5Pdjn8OOKcoc .rough-node .label text,#mermaid-svg-rtTA5Pdjn8OOKcoc .node .label text,#mermaid-svg-rtTA5Pdjn8OOKcoc .image-shape .label,#mermaid-svg-rtTA5Pdjn8OOKcoc .icon-shape .label{text-anchor:middle;}#mermaid-svg-rtTA5Pdjn8OOKcoc .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#mermaid-svg-rtTA5Pdjn8OOKcoc .rough-node .label,#mermaid-svg-rtTA5Pdjn8OOKcoc .node .label,#mermaid-svg-rtTA5Pdjn8OOKcoc .image-shape .label,#mermaid-svg-rtTA5Pdjn8OOKcoc .icon-shape .label{text-align:center;}#mermaid-svg-rtTA5Pdjn8OOKcoc .node.clickable{cursor:pointer;}#mermaid-svg-rtTA5Pdjn8OOKcoc .root .anchor path{fill:#333333!important;stroke-width:0;stroke:#333333;}#mermaid-svg-rtTA5Pdjn8OOKcoc .arrowheadPath{fill:#333333;}#mermaid-svg-rtTA5Pdjn8OOKcoc .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-rtTA5Pdjn8OOKcoc .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-rtTA5Pdjn8OOKcoc .edgeLabel{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-rtTA5Pdjn8OOKcoc .edgeLabel p{background-color:rgba(232,232,232, 0.8);}#mermaid-svg-rtTA5Pdjn8OOKcoc .edgeLabel rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-rtTA5Pdjn8OOKcoc .labelBkg{background-color:rgba(232, 232, 232, 0.5);}#mermaid-svg-rtTA5Pdjn8OOKcoc .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-rtTA5Pdjn8OOKcoc .cluster text{fill:#333;}#mermaid-svg-rtTA5Pdjn8OOKcoc .cluster span{color:#333;}#mermaid-svg-rtTA5Pdjn8OOKcoc div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-rtTA5Pdjn8OOKcoc .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333;}#mermaid-svg-rtTA5Pdjn8OOKcoc rect.text{fill:none;stroke-width:0;}#mermaid-svg-rtTA5Pdjn8OOKcoc .icon-shape,#mermaid-svg-rtTA5Pdjn8OOKcoc .image-shape{background-color:rgba(232,232,232, 0.8);text-align:center;}#mermaid-svg-rtTA5Pdjn8OOKcoc .icon-shape p,#mermaid-svg-rtTA5Pdjn8OOKcoc .image-shape p{background-color:rgba(232,232,232, 0.8);padding:2px;}#mermaid-svg-rtTA5Pdjn8OOKcoc .icon-shape .label rect,#mermaid-svg-rtTA5Pdjn8OOKcoc .image-shape .label rect{opacity:0.5;background-color:rgba(232,232,232, 0.8);fill:rgba(232,232,232, 0.8);}#mermaid-svg-rtTA5Pdjn8OOKcoc .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#mermaid-svg-rtTA5Pdjn8OOKcoc .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#mermaid-svg-rtTA5Pdjn8OOKcoc :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;}#mermaid-svg-rtTA5Pdjn8OOKcoc .input>*{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .input span{fill:#EEF4FF!important;stroke:#5B8FF9!important;color:#1D39C4!important;stroke-width:1.2px!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .input tspan{fill:#1D39C4!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .design>*{fill:#F6FFED!important;stroke:#52C41A!important;color:#237804!important;stroke-width:1.2px!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .design span{fill:#F6FFED!important;stroke:#52C41A!important;color:#237804!important;stroke-width:1.2px!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .design tspan{fill:#237804!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .dev>*{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .dev span{fill:#FFF7E6!important;stroke:#FA8C16!important;color:#AD4E00!important;stroke-width:1.2px!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .dev tspan{fill:#AD4E00!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .check>*{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .check span{fill:#F9F0FF!important;stroke:#722ED1!important;color:#531DAB!important;stroke-width:1.2px!important;}#mermaid-svg-rtTA5Pdjn8OOKcoc .check tspan{fill:#531DAB!important;} 验收交付
Codex开发
模块设计
输入约束
需求边界
PDD设计
SOP目录
接口权限
后端设计
前端设计
扩展功能
读取上下文
生成后端
生成前端
补齐扩展
功能自检
PDD验收
问题修复
模块交付
SOP 标准
SOP 用于约束代码目录、文件职责和开发顺序。Codex 在动手写代码前，需要先确认目录结构和文档位置，再按后端、前端、联动、验收的顺序推进。
text
docs/modules/附件管理/
├── pdd.md
├── api.md
├── test-cases.md
└── codex-sop.md
server_backend/
└── dvadmin/system/models.py
└── dvadmin/system/views/file_list.py
server_vue3/
└── src/views/system/SystemData/FileList/api.ts
└── src/views/system/SystemData/FileList/crud.tsx
└── src/views/system/SystemData/FileList/index.vue| 开发阶段 | Codex 执行目标 | 输出结果 |
|---|---|---|
| 模块设计 | 读取源码、确认字段、接口和页面入口 | 输出模块边界和设计说明 |
| 目录规划 | 规划后端、前端和 docs/modules 文档 | 输出目录结构和文件职责 |
| 后端实现 | 补齐模型、序列化、ViewSet、路由和权限 | 输出可调用接口和基础校验 |
| 前端实现 | 补齐 api.ts、crud.tsx、index.vue 或自定义组件 | 输出可操作页面和保存回显 |
| 数据联动或功能补齐 | 校验筛选、下拉、状态、详情和异常提示 | 输出联动说明和修复记录 |
| 扩展功能 | 按源码补齐 数据联动、文件管理、资源预览、异步任务 | 输出扩展接口、交互和边界测试 |
| 验收修复 | 按 PDD 和测试用例检查模块 | 输出验收结果和问题修复 |
可以直接使用下面的Prompt进行SOP撰写
text
请 Codex 按教育管理系统模块开发 SOP，从零实现或补齐"附件管理"。
源码范围：server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue
接口范围：/api/system/file/、/api/system/file/create_download_task/
字段范围：name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）、create_datetime（创建时间）
执行要求：
1. 先输出目录结构，不要直接写代码。
2. 先生成 docs/modules/附件管理/pdd.md、api.md、test-cases.md 和 codex-sop.md。
3. 再根据文档生成后端代码、前端代码、接口封装、权限控制和测试用例。
4. 开发阶段需要包含 数据联动、文件管理、资源预览、异步任务，但只能写源码真实存在的能力。
5. 每个阶段输出涉及文件、修改目标和验收方式。PDD 标准
PDD 是 附件管理 的设计与验收文档，用于约束 Codex 输出是否符合真实业务。验收不能只看页面能否打开，还要检查字段、接口、权限、异常、回显和扩展功能是否与源码一致。
| 验收维度 | 验收重点 | 通过标准 |
|---|---|---|
| 业务目标 | 统一管理上传文件、文件地址、类型筛选、预览和下载任务 | 页面和接口围绕该目标闭环 |
| 页面结构 | server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue | 列表、表单、详情或自定义操作区可用 |
| 数据模型 | name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人） | 字段保存、查询、回显和校验一致 |
| 接口规则 | /api/system/file/、/api/system/file/create_download_task/ | GetList、GetObj、AddObj、UpdateObj、DelObj、CreateDownloadTask、get_all、rehost_remote_image、create_download_task 能被前端正确调用 |
| 权限控制 | 按角色、按钮和接口权限检查 | 越权访问有后端拦截和错误响应 |
| 测试用例 | 覆盖新增、编辑、删除、查询、异常和回显 | 测试记录包含输入、输出和修复位置 |
| 数据联动 | 把筛选条件、树节点、状态字段、远程下拉和表单回显组织成稳定数据流。 | 字段变化要同步查询参数、保存载荷和回显结构，避免页面临时状态与后端字段脱节。 |
| 文件管理 | 把上传、下载、附件地址、音视频或资源文件保存到业务记录。 | 文件地址与业务字段分开校验，前端只展示有权限访问的资源。 |
| 资源预览 | 把图片、音频、视频、PDF、Markdown、HTML 或业务结果以预览方式展示。 | 预览内容来自已保存字段或生成结果，保存前保留人工校对。 |
| 异步任务 | 把耗时生成、导出、下载或后台执行动作交给任务中心跟踪。 | 接口返回任务 ID、状态和错误信息，页面轮询或刷新展示结果。 |
可以直接使用下面的Prompt进行PDD 验收
text
请 Codex 根据 docs/modules/附件管理/pdd.md 对"附件管理"进行验收。
源码范围：server_backend/dvadmin/system/models.py、server_backend/dvadmin/system/views/file_list.py、server_vue3/src/views/system/SystemData/FileList/api.ts、server_vue3/src/views/system/SystemData/FileList/crud.tsx、server_vue3/src/views/system/SystemData/FileList/index.vue
接口范围：/api/system/file/、/api/system/file/create_download_task/
字段范围：name（名称）、url（文件地址）、file_url（文件地址）、engine（引擎）、mime_type（Mime类型）、size（文件大小）、md5sum（文件md5）、upload_method（上传方式）、file_type（文件类型）、creator_name（上传人）、create_datetime（创建时间）
验收范围必须包含 数据联动、文件管理、资源预览、异步任务。
请输出验收结果表，标记通过、未通过和需要修复的文件位置。不要只给结论，需要指出具体问题、影响范围和修复建议。总结
附件管理的开发价值在于统一管理上传文件、文件地址、类型筛选、预览和下载任务。它把核心字段、接口规则和页面状态连成业务闭环，避免模块停留在普通列表维护。
Codex 开发该模块时，PDD 定义业务边界和验收标准，SOP 约束目录结构和开发顺序，Prompt 把页面、模型、接口、权限和扩展功能 分阶段交给 Codex 实现。