{"id":13826178,"url":"https://github.com/wuyaoxing/vue-gantt","last_synced_at":"2025-07-09T00:32:40.542Z","repository":{"id":135105684,"uuid":"86763502","full_name":"wuyaoxing/vue-gantt","owner":"wuyaoxing","description":"dhtmlxGantt with vue.js, A gantt component for Vue.js","archived":false,"fork":false,"pushed_at":"2020-01-12T03:36:27.000Z","size":1423,"stargazers_count":67,"open_issues_count":2,"forks_count":10,"subscribers_count":4,"default_branch":"master","last_synced_at":"2024-08-05T09:14:56.067Z","etag":null,"topics":["dhtmlxgantt","gantt","vue-gantt"],"latest_commit_sha":null,"homepage":"https://wuyaoxing.github.io/vue-gantt","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/wuyaoxing.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2017-03-31T01:04:02.000Z","updated_at":"2024-01-29T15:21:57.000Z","dependencies_parsed_at":"2024-01-18T04:07:17.654Z","dependency_job_id":"c9448f04-373e-4a5d-b514-1ebb48b5f112","html_url":"https://github.com/wuyaoxing/vue-gantt","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wuyaoxing%2Fvue-gantt","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wuyaoxing%2Fvue-gantt/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wuyaoxing%2Fvue-gantt/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wuyaoxing%2Fvue-gantt/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/wuyaoxing","download_url":"https://codeload.github.com/wuyaoxing/vue-gantt/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225476384,"owners_count":17480215,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dhtmlxgantt","gantt","vue-gantt"],"created_at":"2024-08-04T09:01:33.408Z","updated_at":"2024-11-20T05:30:25.493Z","avatar_url":"https://github.com/wuyaoxing.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# vue-gantt\n\n\u003e dhtmlxGantt with vue.js, A gantt component for Vue.js\n\n## Build Setup\n\n``` bash\n# install dependencies\nnpm install\n\n# serve with hot reload at localhost:9090\nnpm run dev\n\n# build for production with minification\nnpm run build\n\n```\n\n## gantt功能总结\n\n1. 按钮切换\n    - 今天\n    - 上一屏\n    - 下一屏\n\n2. 时间 marker\n    - TodayMarker\n    - 项目Marker\n\n3. 拖拽\n    - moveTask\n    - 左右拖拽task\n\n4. 任务样式\n    - 没有开始的时间\n    - 没有结束的时间\n    - 两者都没有\n\n5. 状态\n    - 未开始\n    - 进行中\n    - 已完成\n    - 逾期\n\n6. 点击显示任务弹窗\n\n7. tooltip提示信息\n\n8. 数据\n    - 过滤\n    - 筛选\n    - 格式化\n\n\n## 核心\n除去官方提供的配置和事件，主要集中在数据的聚合。一是将从接口获取的数据结构转换为gantt所需的数据结构；二是数据同步更新，我的做法是利用lodash的diff函数计算出更新前后数据的变化项，然后利用gantt提供的事件与方法逐个更新，性能方面就回到了老生常谈的话题上了，不再赘述。另外值得一提的是经过大量数据的测试dhtmlxGantt框架的性能是非常可观的，一次重新渲染的速度要大于重新排序所消耗的时间。（据说5.0以上版本再性能上还有不少提升，并且增加了更多实用的api，只是貌似暂时不对外，只能从官网例子上一睹为快了）\n \n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwuyaoxing%2Fvue-gantt","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwuyaoxing%2Fvue-gantt","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwuyaoxing%2Fvue-gantt/lists"}