vue dhtmlxgantt 导出

dhtmlxGantt 是一个流行的 JavaScript Gantt 图表库，用于在 Web 应用程序中显示和编辑计划和进度。如果您想将 dhtmlxGantt 中的数据导出为 Excel 或 CSV 格式，可以使用以下步骤：

1. 安装 js-xlsx 库，这是将数据转换为 Excel 或 CSV 格式的库。

npm install xlsx

2. 创建一个函数来获取 Gantt 数据。

function getGanttData() {
  var tasks = gantt.serialize().data;
  var data = [];

  tasks.forEach(function(task) {
    data.push({
      id: task.id,
      text: task.text,
      start_date: task.start_date,
      end_date: task.end_date,
      duration: task.duration,
      progress: task.progress
    });
  });

  return data;
}

3. 创建一个函数来将数据导出为 Excel 或 CSV 格式。

function exportData(type) {
  var data = getGanttData();
  var ws = XLSX.utils.json_to_sheet(data);

  if (type === 'excel') {
    var wb = XLSX.utils.book_new();
    XLSX.utils.book_append_sheet(wb, ws, 'Gantt Data');
    XLSX.writeFile(wb, 'gantt_data.xlsx');
  } else if (type === 'csv') {
    var csv = XLSX.utils.sheet_to_csv(ws);
    var blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' });
    var url = URL.createObjectURL(blob);
    var link = document.createElement('a');
    link.setAttribute('href', url);
    link.setAttribute('download', 'gantt_data.csv');
    link.style.visibility = 'hidden';
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
  } else {
    alert('Invalid export type!');
  }
}

4. 在 HTML 中创建两个按钮，一个用于将数据导出为 Excel，另一个用于将数据导出为 CSV。

<button onclick="exportData('excel')">Export to Excel</button>
<button onclick="exportData('csv')">Export to CSV</button>

现在，当用户单击这些按钮时，将调用 exportData() 函数并导出 dhtmlxGantt 中的数据。