vue实现一个日程表中可拖拽和复制粘贴以及编辑，有什么好的实现思路吗。求指点？

Question

需求：
1、实现一个课程规划面板 周一至 周日 1-18小时
2、每天的时间安排可以拆分多个时间段
3、时间段是可以复制粘贴（例如：周一的某一个时间段复制粘贴到周二周三），并且可以拖拽
4、在时间段内编辑文字备注

图一 课程规划面板

图二 时间段可以编辑文字备注

图三 拖拽效果

图四 单天内多个时间段

各位可有好的解决思路和实现方案，求指导。或者有先关的BOME。

Answer 1

• 数据结构上肯定是二维数组。
• 比如说选中 [1,1] 至 [4,4] 就遍历这些节点，0 认为是无占用，然后做一个累加计数id用来标记当前坐标是那个任务。
• 做个以 id 为 key 的描述 map。
• 删除的话就是把所有相同 id 的都删掉
• 基于 canvas 做起来有可能简单一点。dom 也不是不行。推荐你分层做。