文章和AI聊天增加展示流程图功能

flowchart TD
    A[开始] --> B{条件判断}
    B -->|是| C[执行操作1]
    B -->|否| D[执行操作2]
    C --> E[结束]
    D --> E

sequenceDiagram
    participant A as 用户
    participant B as 系统
    participant C as 数据库
    
    A->>B: 登录请求
    B->>C: 验证用户信息
    C-->>B: 返回验证结果
    B-->>A: 显示登录结果

classDiagram
    class Animal {
        +String name
        +int age
        +eat()
        +sleep()
    }
    
    class Dog {
        +String breed
        +bark()
    }
    
    class Cat {
        +String color
        +meow()
    }
    
    Animal <|-- Dog
    Animal <|-- Cat

stateDiagram-v2
    [*] --> 待机
    待机 --> 运行中: 启动
    运行中 --> 暂停: 暂停按钮
    暂停 --> 运行中: 继续按钮
    运行中 --> 完成: 任务结束
    完成 --> [*]

gantt
    title 项目开发计划
    dateFormat YYYY-MM-DD
    
    section 设计阶段
    需求分析 :done, des1, 2024-01-01, 7d
    系统设计 :active, des2, after des1, 10d
    
    section 开发阶段
    前端开发 :dev1, after des2, 15d
    后端开发 :dev2, after des2, 20d

pie title 编程语言使用比例
    "JavaScript" : 35
    "Python" : 25
    "Java" : 20
    "其他" : 20

journey
    title 用户购物旅程
    section 浏览商品
      查看商品列表: 5: 用户
      查看商品详情: 4: 用户
    section 下单支付
      添加到购物车: 5: 用户
      完成支付: 3: 用户
    section 收货评价
      确认收货: 4: 用户
      进行评价: 2: 用户

erDiagram
    CUSTOMER ||--o{ ORDER : places
    ORDER ||--|{ LINE-ITEM : contains
    PRODUCT ||--|{ LINE-ITEM : includes
    CUSTOMER {
        string name
        string email
        int customerId
    }
    ORDER {
        int orderId
        date orderDate
    }