kaiyuanshe.github.io icon indicating copy to clipboard operation
kaiyuanshe.github.io copied to clipboard

活动邀请函模板编辑器

Open TechQuery opened this issue 2 years ago • 1 comments

业务逻辑

  1. 活动组织者在活动页面上看到编辑入口按钮,鉴权代码参考:

https://github.com/kaiyuanshe/kaiyuanshe.github.io/blob/e948952ef7c8c8e731b3a4b6c05c90d08ef672be/models/Activity/Agenda.ts#L126-L132

  1. 拉取某个议程的数据,以其数据对象字段名为组件名罗列可拖拽组件

    • URL 显示为二维码
    • 其余显示为纯文本
  2. 点击画布空白处上传背景图到对象存储,并在模板 JSON 中记录图片 URL

  3. 点击拖拽组件后加入画布,并可在其中拖拽移动,其尺寸、位置均以画布尺寸百分比为单位记录在模板 JSON

  4. 将模板 JSON 存入活动记录的 cardTemplate 字段

  5. 邀请函生成页面读取模板、议程数据后渲染

参考代码

  • 拖拽:https://codepen.io/tech_query/pen/bGmJaYr
  • 画布:https://codepen.io/tech_query/pen/mGJzbK

TechQuery avatar Oct 11 '23 20:10 TechQuery

现在可以用 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

TechQuery avatar Oct 27 '24 08:10 TechQuery