09.DeepSeek + mermaid 轻松搞定各种流程图

装上了画图能力：用 claude-mermaid 这套方案，Claude Code 能实时出 PNG / SVG / PDF，支持多种主题、浏览器实时预览。装法一行命令。

帮我生成一个mermaid图，以下是要求，背景：1、网页有一个创建任务流程，要求输入任务名称和时间，还需要管理员审核，审核后就开始执行，执行成功可以下载结果，执行失败可以查看失败原因。2、要求mermaid图用于展示此流程信息，注意清晰简洁，易于理解。同时加入配色等图片美观明了。

 

您好！帮您识别并整理了图片中的文字内容如下：

用户需求：

帮我生成一个mermaid图，以下是要求，背景：1、网页有一个创建任务流程，要求输入任务名称和时间，还需要管理员审核，审核后就开始执行，执行成功可以下载结果，执行失败可以查看失败原因。2、要求mermaid图用于展示此流程信息，注意清晰简洁，易于理解。同时加入配色等图片美观明了。

---

根据您的需求，我为您生成了对应的 Mermaid 流程图代码，包含了节点配色和样式设计：

%%{init: {'theme': 'base', 'themeVariables': { 'primaryColor': '#e1f5fe', 'edgeLabelBackground':'#ffffff', 'fontSize': '14px'}}}%%
graph TD
    %% 定义样式类
    classDef default fill:#f9f9f9,stroke:#333,stroke-width:1px;
    classDef process fill:#bbdefb,stroke:#1976d2,stroke-width:2px,color:#000;
    classDef decision fill:#fff9c4,stroke:#fbc02d,stroke-width:2px,color:#000;
    classDef endNode fill:#c8e6c9,stroke:#388e3c,stroke-width:2px,color:#000;
    classDef note fill:#e3f2fd,stroke:#1565c0,stroke-dasharray: 5 5,color:#333;

    %% 流程节点
    Start((开始)) --> Input[创建任务并输入<br/>任务名称与时间]:::process
    Input --> Audit{管理员审核}:::decision
    
    Audit -- 通过 --> Execute[开始执行任务]:::process
    Execute -- 成功 --> Success[执行成功<br/>点击下载结果]:::endNode
    
    Audit -- 驳回 --> Reject[审核驳回<br/>请修改任务信息]:::note
    Execute -- 失败 --> Fail[执行失败<br/>查看失败原因]:::note

    %% 连接线样式
    linkStyle default stroke:#666,stroke-width:2px;

图表说明：

1. 配色逻辑：
   • 蓝色系 (#bbdefb)：代表主要的操作步骤（如创建、执行）。
   • 黄色系 (#fff9c4)：代表判断节点（审核环节）。
   • 绿色系 (#c8e6c9)：代表成功的结束状态（下载结果）。
   • 浅蓝虚线 (#e3f2fd)：代表异常或辅助流程（驳回、失败查看）。
2. 流程逻辑：
   • 严格对应了您要求的“输入信息 -> 审核 -> 执行 -> 结果（成功/失败）”的闭环。
   • 增加了“审核驳回”分支，使流程更符合实际交互逻辑。 

接下来可以把这个代码加入到mermaid中进行查看

https://www.processon.com/mermaid?utm_source=baidu&utm_medium=semmermaid&utm_term=mermaidonbjq&utm_content=119071381936&uc_pagenum=1&uc_adposition=cl2&bd_vid=11936428211729458771

 

图片中的网站地址是：

app.diagrams.net/?src=about#

这是一款免费的在线绘图工具（diagrams.net），常用于绘制流程图、架构图、UML图等，支持导出多种格式。

https://drawio.htmlpage.cn/editor