{
  "$schema": "https://ai.syncfusion.com/schema/registry-item.json",
  "name": "gantt-exporting",
  "framework": "vue",
  "type": "registry:component",
  "component": "Gantt",
  "variant": "exporting",
  "dependencies": [
    "@syncfusion/ej2-vue-gantt"
  ],
  "description": "Gantt chart with toolbar buttons that export the chart as an Excel or PDF document.",
  "meta": {
    "essentialStudioRelease": "2026 Volume 2 (v34.1.29)",
    "license": "commercial-or-community",
    "licenseNote": "The Syncfusion package is licensed. The composition in this file is source you own and edit. See https://ai.syncfusion.com/licensing.md",
    "requiresLicenseKey": true,
    "requiresServerEndpoint": false,
    "platformIndex": "https://ai.syncfusion.com/vue/llms.txt",
    "skillPack": "syncfusion/vue-ui-components-skills",
    "docs": "https://ai.syncfusion.com/gallery/vue/gantt-exporting.md"
  },
  "files": [
    {
      "target": "src/components/gantt-exporting/Gantt.vue",
      "content": "<template>\n  <div>\n    <div class=\"control-section\">\n      <div class=\"content-wrapper\">\n        <ejs-gantt ref=\"gantt\" id=\"GanttExport\" :dataSource=\"data\" :dateFormat=\"dateFormat\" :taskFields=\"taskFields\"\n          :toolbar=\"toolbar\" :allowSelection=\"true\" :allowExcelExport=\"true\" :gridLines=\"gridLines\" :height=\"height\"\n          :rowHeight=\"46\" :taskbarHeight=\"25\" :treeColumnIndex=\"1\" :toolbarClick=\"toolbarClick\"\n          :resourceFields=\"resourceFields\" :resources=\"resources\" :highlightWeekends=\"true\"\n          :timelineSettings=\"timelineSettings\" :labelSettings=\"labelSettings\" :projectStartDate=\"projectStartDate\"\n          :projectEndDate=\"projectEndDate\" :columns=\"columns\" :allowPdfExport=\"true\" :holidays=\"holidays\"\n          :eventMarkers=\"eventMarkers\" :splitterSettings=\"splitterSettings\">\n        </ejs-gantt>\n      </div>\n    </div>\n\n\n  </div>\n</template>\n<script>\nimport { GanttComponent, Selection, Toolbar, ExcelExport, PdfExport, DayMarkers } from \"@syncfusion/ej2-vue-gantt\";\n\n\nconst editingResources = [\n    { resourceId: 1, resourceName: 'Martin Tamer' },\n    { resourceId: 2, resourceName: 'Rose Fuller' },\n    { resourceId: 3, resourceName: 'Margaret Buchanan' },\n    { resourceId: 4, resourceName: 'Fuller King' },\n    { resourceId: 5, resourceName: 'Davolio Fuller' },\n    { resourceId: 6, resourceName: 'Van Jack' },\n    { resourceId: 7, resourceName: 'Fuller Buchanan' },\n    { resourceId: 8, resourceName: 'Jack Davolio' },\n    { resourceId: 9, resourceName: 'Tamer Vinet' },\n    { resourceId: 10, resourceName: 'Vinet Fuller' },\n    { resourceId: 11, resourceName: 'Bergs Anton' },\n    { resourceId: 12, resourceName: 'Construction Supervisor' }\n];\n\nconst editingData = [\n    { TaskID: 1, TaskName: \"Planning and permits\", StartDate: new Date(\"04/02/2025\"), EndDate: new Date(\"04/10/2025\"), Duration: 7, Progress: 100, resources: [1, 2, 3] },\n    { TaskID: 2, TaskName: \"Site evaluation\", StartDate: new Date(\"04/02/2025\"), EndDate: new Date(\"04/04/2025\"), Duration: 2, Progress: 100, ParentId: 1, resources: [1] },\n    { TaskID: 3, TaskName: \"Obtain permits\", StartDate: new Date(\"04/07/2025\"), EndDate: new Date(\"04/09/2025\"), Duration: 3, Progress: 100, ParentId: 1, Predecessor: \"2\", resources: [2, 4] },\n    { TaskID: 4, TaskName: \"Finalize planning\", StartDate: new Date(\"04/10/2025\"), EndDate: new Date(\"04/11/2025\"), Duration: 2, Progress: 100, ParentId: 1, Predecessor: \"3\", resources: [3] },\n    { TaskID: 5, TaskName: \"Site preparation\", StartDate: new Date(\"04/14/2025\"), EndDate: new Date(\"04/18/2025\"), Duration: 5, Progress: 100, resources: [5, 6, 12] },\n    { TaskID: 6, TaskName: \"Site clearing\", StartDate: new Date(\"04/14/2025\"), Duration: 0, Progress: 100, ParentId: 5, Predecessor: \"4\", resources: [5] },\n    { TaskID: 7, TaskName: \"Grading and excavation\", StartDate: new Date(\"04/15/2025\"), EndDate: new Date(\"04/17/2025\"), Duration: 3, Progress: 100, ParentId: 5, Predecessor: \"6\", resources: [6, 7] },\n    { TaskID: 8, TaskName: \"Foundation work\", StartDate: new Date(\"04/18/2025\"), EndDate: new Date(\"04/21/2025\"), Duration: 4, Progress: 100, ParentId: 5, Predecessor: \"7\", resources: [12] },\n    { TaskID: 9, TaskName: \"Foundation and basement\", StartDate: new Date(\"04/22/2025\"), EndDate: new Date(\"04/28/2025\"), Duration: 5, Progress: 100, ParentId: 5, resources: [8, 9, 10] },\n    { TaskID: 10, TaskName: \"Pour foundation\", StartDate: new Date(\"04/22/2025\"), EndDate: new Date(\"04/23/2025\"), Duration: 2, Progress: 100, ParentId: 9, Predecessor: \"8\", resources: [8] },\n    { TaskID: 11, TaskName: \"Cure foundation\", StartDate: new Date(\"04/24/2025\"), EndDate: new Date(\"04/25/2025\"), Duration: 2, Progress: 100, ParentId: 9, Predecessor: \"10\", resources: [9] },\n    { TaskID: 12, TaskName: \"Basement walls\", StartDate: new Date(\"04/28/2025\"), EndDate: new Date(\"04/30/2025\"), Duration: 3, Progress: 100, ParentId: 9, Predecessor: \"11\", resources: [10, 11] },\n    { TaskID: 13, TaskName: \"Framing\", StartDate: new Date(\"05/01/2025\"), EndDate: new Date(\"05/07/2025\"), Duration: 5, Progress: 100, resources: [11, 12, 1] },\n    { TaskID: 14, TaskName: \"Frame floors\", StartDate: new Date(\"05/01/2025\"), EndDate: new Date(\"05/02/2025\"), Duration: 2, Progress: 100, ParentId: 13, Predecessor: \"12\", resources: [11] },\n    { TaskID: 15, TaskName: \"Frame walls\", StartDate: new Date(\"05/05/2025\"), EndDate: new Date(\"05/06/2025\"), Duration: 2, Progress: 100, ParentId: 13, Predecessor: \"14\", resources: [12] },\n    { TaskID: 16, TaskName: \"Install trusses\", StartDate: new Date(\"05/07/2025\"), EndDate: new Date(\"05/08/2025\"), Duration: 2, Progress: 100, ParentId: 13, Predecessor: \"15\", resources: [1, 2] },\n    { TaskID: 17, TaskName: \"Roofing\", StartDate: new Date(\"05/09/2025\"), EndDate: new Date(\"05/13/2025\"), Duration: 3, Progress: 100, Predecessor: \"16\", resources: [3, 4] },\n    { TaskID: 18, TaskName: \"Mechanical, electrical, plumbing\", StartDate: new Date(\"05/14/2025\"), EndDate: new Date(\"05/24/2025\"), Duration: 9, Progress: 50, resources: [5, 6, 7] },\n    { TaskID: 19, TaskName: \"HVAC installation\", StartDate: new Date(\"05/14/2025\"), EndDate: new Date(\"05/16/2025\"), Duration: 3, Progress: 100, ParentId: 18, Predecessor: \"17\", resources: [5] },\n    { TaskID: 20, TaskName: \"Plumbing installation\", StartDate: new Date(\"05/19/2025\"), EndDate: new Date(\"05/21/2025\"), Duration: 3, Progress: 50, ParentId: 18, Predecessor: \"19\", resources: [6] }\n];\n\nexport default {\n  components: {\n    \"ejs-gantt\": GanttComponent,\n  },\n  data: function () {\n    return {\n      data: editingData,\n      dateFormat: \"MMM dd, y\",\n      taskFields: {\n        id: \"TaskID\",\n        name: \"TaskName\",\n        startDate: \"StartDate\",\n        endDate: \"EndDate\",\n        duration: \"Duration\",\n        progress: \"Progress\",\n        dependency: \"Predecessor\",\n        parentID: 'ParentId',\n        resourceInfo: \"resources\"\n      },\n      toolbar: [\"ExcelExport\", \"CsvExport\", \"PdfExport\"],\n      gridLines: \"Both\",\n      height: \"650px\",\n      resourceFields: {\n        id: \"resourceId\",\n        name: \"resourceName\"\n      },\n      resources: editingResources,\n      timelineSettings: {\n        topTier: {\n          unit: \"Week\",\n          format: \"MMM dd, y\"\n        },\n        bottomTier: {\n          unit: \"Day\"\n        },\n      },\n      labelSettings: {\n        leftLabel: \"TaskName\"\n      },\n      projectStartDate: new Date('03/26/2025'),\n      projectEndDate: new Date('09/01/2025'),\n      columns: [\n        { field: \"TaskID\" },\n        { field: \"TaskName\", width: \"250\" }\n      ],\n      splitterSettings: {\n        columnIndex: 2\n      }\n    };\n  },\n  provide: {\n    gantt: [Selection, Toolbar, ExcelExport, PdfExport, DayMarkers]\n  },\n  methods: {\n    toolbarClick: function (args) {\n      if (args.item.id === \"GanttExport_excelexport\") {\n        this.$refs.gantt.ej2Instances.excelExport();\n      } else if (args.item.id === \"GanttExport_csvexport\") {\n        this.$refs.gantt.ej2Instances.csvExport();\n      } else if (args.item.id === \"GanttExport_pdfexport\") {\n        this.$refs.gantt.ej2Instances.pdfExport();\n      }\n    }\n  },\n};\n</script>\n\n<style scoped>\n.fluent2 #gantt-export1 ::v-deep,\n.fluent2-dark #gantt-export1 ::v-deep {\n  margin: 6px 5px 0px 0px;\n}\n</style>"
    },
    {
      "target": "src/components/gantt-exporting/GanttView.vue",
      "content": "<template>\n  <Gantt />\n</template>\n\n<script setup>\nimport Gantt from '../../components/Gantt.vue'\n</script>"
    }
  ]
}