forked from 77media/video-flow
152 lines
3.5 KiB
Plaintext
152 lines
3.5 KiB
Plaintext
@startuml RoleService Hook 架构图
|
|
|
|
!theme plain
|
|
skinparam backgroundColor #FFFFFF
|
|
skinparam componentStyle rectangle
|
|
|
|
' 主要模块
|
|
package "RoleService Hook" as RoleServiceHook {
|
|
component "响应式状态管理" as StateManagement
|
|
component "计算属性" as ComputedProps
|
|
component "角色操作方法" as RoleOperations
|
|
component "文本操作方法" as TextOperations
|
|
component "标签操作方法" as TagOperations
|
|
component "分镜操作方法" as ShotOperations
|
|
}
|
|
|
|
' API层
|
|
package "API接口层" as APILayer {
|
|
component "角色相关API" as RoleAPI {
|
|
[regenerateRole()]
|
|
[applyRoleToShots()]
|
|
[getRoleShots()]
|
|
}
|
|
|
|
component "文本相关API" as TextAPI {
|
|
[updateText()]
|
|
}
|
|
|
|
component "标签相关API" as TagAPI {
|
|
[updateTag()]
|
|
}
|
|
}
|
|
|
|
' UseCase层
|
|
package "UseCase层" as UseCaseLayer {
|
|
component "RoleEditUseCase" as RoleEditUseCase {
|
|
[AIgenerateRole(prompt, tags)]
|
|
[applyRole(shotIds)]
|
|
}
|
|
|
|
component "TextEditUseCase" as TextEditUseCase {
|
|
[updateText(content)]
|
|
[getOptimizedContent()]
|
|
}
|
|
|
|
component "TagEditUseCase" as TagEditUseCase {
|
|
[updateTag(content)]
|
|
}
|
|
}
|
|
|
|
' Domain层
|
|
package "Domain层" as DomainLayer {
|
|
component "实体定义" as Entities {
|
|
[RoleEntity]
|
|
[AITextEntity]
|
|
[TagEntity]
|
|
[ShotEntity]
|
|
}
|
|
|
|
component "可编辑项" as Items {
|
|
[RoleItem]
|
|
[TextItem]
|
|
[TagItem]
|
|
[ShotItem]
|
|
}
|
|
}
|
|
|
|
' React Hook
|
|
package "React Hook" as ReactHook {
|
|
component "useState" as UseState
|
|
component "useCallback" as UseCallback
|
|
component "useMemo" as UseMemo
|
|
}
|
|
|
|
' 依赖关系
|
|
' Hook内部依赖
|
|
RoleServiceHook --> StateManagement : 管理状态
|
|
RoleServiceHook --> ComputedProps : 计算属性
|
|
RoleServiceHook --> RoleOperations : 角色操作
|
|
RoleServiceHook --> TextOperations : 文本操作
|
|
RoleServiceHook --> TagOperations : 标签操作
|
|
RoleServiceHook --> ShotOperations : 分镜操作
|
|
|
|
' 操作方法依赖UseCase
|
|
RoleOperations --> RoleEditUseCase : 调用
|
|
TextOperations --> TextEditUseCase : 调用
|
|
TagOperations --> TagEditUseCase : 调用
|
|
ShotOperations --> RoleEditUseCase : 调用
|
|
|
|
' UseCase依赖API
|
|
RoleEditUseCase --> RoleAPI : 调用
|
|
TextEditUseCase --> TextAPI : 调用
|
|
TagEditUseCase --> TagAPI : 调用
|
|
|
|
' 状态管理依赖Domain
|
|
StateManagement --> Items : 使用
|
|
ComputedProps --> Entities : 计算
|
|
RoleOperations --> Items : 操作
|
|
TextOperations --> Items : 操作
|
|
TagOperations --> Items : 操作
|
|
ShotOperations --> Items : 操作
|
|
|
|
' React Hook依赖
|
|
RoleServiceHook --> UseState : 状态管理
|
|
RoleServiceHook --> UseCallback : 方法优化
|
|
RoleServiceHook --> UseMemo : 计算优化
|
|
|
|
' 数据流
|
|
note right of StateManagement
|
|
响应式状态:
|
|
- roleList: 角色列表
|
|
- selectedRole: 当前选中角色
|
|
- currentRoleText: 当前AI文本
|
|
- currentRoleTags: 当前标签列表
|
|
- shotSelectionList: 分镜选择列表
|
|
end note
|
|
|
|
note right of ComputedProps
|
|
计算属性:
|
|
- roleImageUrl: 角色图片URL
|
|
- isAllShotsSelected: 是否全选
|
|
- selectedShotsCount: 选中数量
|
|
end note
|
|
|
|
note right of RoleOperations
|
|
角色操作:
|
|
- selectRole: 选择角色
|
|
- regenerateRole: 重新生成
|
|
end note
|
|
|
|
note right of TextOperations
|
|
文本操作:
|
|
- optimizeRoleText: 优化文本
|
|
- updateRoleText: 修改文本
|
|
end note
|
|
|
|
note right of TagOperations
|
|
标签操作:
|
|
- updateTagContent: 修改标签
|
|
end note
|
|
|
|
note right of ShotOperations
|
|
分镜操作:
|
|
- fetchRoleShots: 获取分镜列表
|
|
- selectAllShots: 全选
|
|
- invertShotSelection: 反选
|
|
- toggleShotSelection: 切换选择
|
|
- applyRoleToSelectedShots: 应用角色
|
|
end note
|
|
|
|
@enduml
|