156 lines
3.8 KiB
Markdown
156 lines
3.8 KiB
Markdown
# Diagrams (Mermaid)
|
|
|
|
> 动态架构与主要交互可视化。与文字说明对应：`architecture.md` / `image-pipeline.md` / `render-service-blueprint.md`。
|
|
|
|
## 1. 模块类图 (当前实现概览)
|
|
```mermaid
|
|
classDiagram
|
|
class NotePreview {
|
|
+renderMarkdown()
|
|
+uploadImages()
|
|
+postArticle()
|
|
+postImages()
|
|
+exportHTML()
|
|
}
|
|
class ArticleRender {
|
|
+renderMarkdown(file)
|
|
+getMetadata()
|
|
+uploadImages(appid)
|
|
+postArticle(appid,cover?)
|
|
+postImages(appid)
|
|
+exportHTML()
|
|
}
|
|
class LocalImageManager {
|
|
+setImage(path,info)
|
|
+uploadLocalImage(token,vault)
|
|
+uploadRemoteImage(root,token)
|
|
+replaceImages(root)
|
|
}
|
|
class LocalFile {
|
|
+markedExtension()
|
|
}
|
|
class AssetsManager {
|
|
+loadAssets()
|
|
+getTheme(name)
|
|
+getHighlight(name)
|
|
}
|
|
class NMPSettings {
|
|
+wxInfo
|
|
+authKey
|
|
+enableMarkdownImageToWikilink
|
|
}
|
|
class WeChatAPI {
|
|
+wxGetToken()
|
|
+wxAddDraft()
|
|
+wxUploadImage()
|
|
}
|
|
|
|
NotePreview --> ArticleRender
|
|
ArticleRender --> LocalImageManager
|
|
ArticleRender --> AssetsManager
|
|
ArticleRender --> NMPSettings
|
|
ArticleRender --> WeChatAPI
|
|
ArticleRender --> LocalFile
|
|
LocalFile --> LocalImageManager
|
|
NotePreview --> NMPSettings
|
|
NotePreview --> AssetsManager
|
|
```
|
|
|
|
## 2. 发布草稿时序图
|
|
```mermaid
|
|
sequenceDiagram
|
|
participant U as User
|
|
participant NP as NotePreview
|
|
participant AR as ArticleRender
|
|
participant WX as WeChatAPI
|
|
participant LIM as LocalImageManager
|
|
|
|
U->>NP: 点击 发草稿
|
|
NP->>AR: postArticle(appid)
|
|
AR->>WX: wxGetToken(authKey, appid)
|
|
WX-->>AR: token
|
|
AR->>AR: cachedElementsToImages()
|
|
AR->>LIM: uploadLocalImage(token)
|
|
LIM-->>AR: local media_id(s)
|
|
AR->>LIM: uploadRemoteImage(token)
|
|
LIM-->>AR: remote media_id(s)
|
|
AR->>LIM: replaceImages()
|
|
AR->>AR: resolve cover (frontmatter / first image / default)
|
|
AR->>WX: wxAddDraft(draft JSON)
|
|
WX-->>AR: media_id | err
|
|
AR-->>NP: 结果
|
|
NP-->>U: 成功 / 失败提示
|
|
```
|
|
|
|
## 3. 图片上传流程图
|
|
```mermaid
|
|
graph TD
|
|
A[Start UploadImages] --> B{AuthKey/AppId?}
|
|
B -- No --> Z[Throw Error]
|
|
B -- Yes --> C[Get Token]
|
|
C --> D[cachedElementsToImages]
|
|
D --> E[uploadLocalImage]
|
|
E --> F[uploadRemoteImage]
|
|
F --> G[replaceImages]
|
|
G --> H[Copy HTML to Clipboard]
|
|
H --> I[End]
|
|
```
|
|
|
|
## 4. 自动封面推断逻辑
|
|
```mermaid
|
|
graph TD
|
|
A[Need Cover?] -->|No| Z[Skip]
|
|
A -->|Yes| B[Strip Frontmatter]
|
|
B --> C[Scan Markdown Images]
|
|
B --> D[Scan Wikilink Images]
|
|
C --> E[Merge Candidates]
|
|
D --> E[Merge Candidates]
|
|
E --> F{Any Candidate?}
|
|
F -- No --> Z[Cover stays empty]
|
|
F -- Yes --> G[Sort by index]
|
|
G --> H[Select first -> cover wikilink]
|
|
```
|
|
|
|
## 5. 未来 RenderService Pipeline 图
|
|
```mermaid
|
|
graph LR
|
|
L[Loader] --> FM[Frontmatter]
|
|
FM --> PP[Preprocessors]
|
|
PP --> P[Parser]
|
|
P --> TR[Transformers]
|
|
TR --> RI[ResourceIndex]
|
|
RI --> R[Renderer]
|
|
R --> PO[Postprocessors]
|
|
PO --> EX[Exporters]
|
|
```
|
|
|
|
## 6. 并发上传示意 (未来优化)
|
|
```mermaid
|
|
graph TD
|
|
A[images[]] --> B[Partition into tasks]
|
|
B --> C[Promise Pool (N=4)]
|
|
C --> D[Upload Task]
|
|
D --> E{Success?}
|
|
E -- No --> R[Retry with backoff]
|
|
E -- Yes --> F[Collect media_id]
|
|
R --> C
|
|
F --> G[All Done]
|
|
```
|
|
|
|
## 7. 状态机概览 (发布按钮)
|
|
```mermaid
|
|
stateDiagram-v2
|
|
[*] --> Idle
|
|
Idle --> Uploading : 点击 上传/发布
|
|
Uploading --> Publishing : 草稿模式
|
|
Uploading --> Completed : 仅上传
|
|
Publishing --> Completed : 响应成功
|
|
Publishing --> Failed : 接口错误
|
|
Uploading --> Failed : 资源错误
|
|
Failed --> Idle : 用户重试
|
|
Completed --> Idle : 新文件切换
|
|
```
|
|
|
|
---
|
|
需要我将这些图嵌入到 README 的一个“开发者”章节吗？可以继续提出。
|