kaiyuanshe.github.io
kaiyuanshe.github.io copied to clipboard
活动邀请函模板编辑器
业务逻辑
- 活动组织者在活动页面上看到编辑入口按钮,鉴权代码参考:
https://github.com/kaiyuanshe/kaiyuanshe.github.io/blob/e948952ef7c8c8e731b3a4b6c05c90d08ef672be/models/Activity/Agenda.ts#L126-L132
-
拉取某个议程的数据,以其数据对象字段名为组件名罗列可拖拽组件:
- URL 显示为二维码
- 其余显示为纯文本
-
点击画布空白处上传背景图到对象存储,并在模板 JSON 中记录图片 URL
-
点击拖拽组件后加入画布,并可在其中拖拽移动,其尺寸、位置均以画布尺寸百分比为单位记录在模板 JSON
-
将模板 JSON 存入活动记录的
cardTemplate字段 -
邀请函生成页面读取模板、议程数据后渲染
参考代码
- 拖拽:https://codepen.io/tech_query/pen/bGmJaYr
- 画布:https://codepen.io/tech_query/pen/mGJzbK
现在可以用 gpt-4-vision-preview 模型从 issue 中的图片生成代码发 pull request,拖拽式编辑器就不需要做了:
- https://github.com/alexanmtz/AIPR
- https://github.com/mirrajabi/aider-github-workflows/blob/main/docs/issue-to-pr.md
界面参考:https://github.com/Yuyz0112/dewhale