[Programme WeChat Mini] Exportez des rapports Excel et partagez-les, utilisez la bibliothèque xlsx pour générer Excel, utilisez echars pour insérer des graphiques et utilisez pdfmake pour exporter vers des fichiers PDF

Générer EXCEL

Pour exporter et partager un rapport Excel dans l'applet WeChat, vous pouvez utiliser une bibliothèque tierce xlsxpour générer un fichier Excel, utiliser wx.saveFilela méthode pour enregistrer le fichier localement, puis utiliser wx.shareFilela méthode pour partager le fichier.

Voici un exemple de code qui montre comment exporter et partager un rapport Excel dans l'applet WeChat :

  1. Tout d’abord, installez les bibliothèques dépendantes xlsx, vous pouvez utiliser npm pour installer :
npm install xlsx
  1. Introduisez la bibliothèque dans la page de l'applet xlsxet définissez une méthode pour exporter les rapports Excel :
// 引入依赖库
const XLSX = require('xlsx');

// 定义导出 Excel 报表的方法
function exportExcel(data, filename) {
    
    
  const workbook = XLSX.utils.book_new();
  const sheet = XLSX.utils.aoa_to_sheet(data);

  XLSX.utils.book_append_sheet(workbook, sheet, 'Sheet1');

  const excelBuffer = XLSX.write(workbook, {
    
     bookType: 'xlsx', type: 'array' });
  const filePath = `${
      
      wx.env.USER_DATA_PATH}/${
      
      filename}.xlsx`;

  wx.saveFile({
    
    
    tempFilePath: filePath,
    filePath: filePath,
    success: function(res) {
    
    
      const savedFilePath = res.savedFilePath;

      wx.shareFile({
    
    
        filePath: savedFilePath,
        success: function(res) {
    
    
          console.log('分享成功');
        },
        fail: function(error) {
    
    
          console.log('分享失败', error);
        }
      });
    },
    fail: function(error) {
    
    
      console.log('保存文件失败', error);
    }
  });
}

Dans l'exemple de code ci-dessus, nous requireavons introduit xlsxla bibliothèque via l'instruction. Ensuite, une méthode nommée est définie exportExcel, qui accepte deux paramètres : datales données à exporter et filenamele nom du fichier exporté.

Dans exportExcella méthode, nous utilisons xlsxla bibliothèque pour convertir les données au format Excel et utilisons XLSX.writela méthode pour écrire le classeur dans un tableau. Ensuite, utilisez wx.saveFilela méthode pour enregistrer le tableau dans un fichier local et wx.shareFilela méthode pour partager le fichier.

Ensuite, vous pouvez appeler exportExcella méthode pour exporter le rapport Excel et partager le fichier :

// 示例数据
const data = [
  ['姓名', '年龄', '性别'],
  ['张三', 25, '男'],
  ['李四', 30, '女'],
  ['王五', 28, '男']
];

// 调用导出 Excel 报表的方法
exportExcel(data, '报表');

Dans l'exemple ci-dessus, nous avons défini un datatableau nommé qui contient les données à exporter. Ensuite, appelez exportExcella méthode pour exporter le rapport Excel et spécifiez le nom du fichier '报表'.

Veuillez noter que l'exemple de code ci-dessus est uniquement à titre de référence et que l'implémentation spécifique devra peut-être être ajustée en fonction de vos besoins réels.

Insérer des résumés et des graphiques

Utilisez echartsla bibliothèque pour générer des graphiques.

Voici un exemple de code qui montre comment exporter un rapport Excel et insérer un graphique dans le résumé de l'applet WeChat :

  1. Tout d’abord, installez les bibliothèques dépendantes xlsxet echartsvous pouvez utiliser npm pour installer :
npm install xlsx echarts
  1. xlsxIntroduisez la bibliothèque et dans la page de l'applet echartset définissez une méthode pour générer des données graphiques :
// 引入依赖库
const XLSX = require('xlsx');
const echarts = require('echarts');

// 定义生成图表数据的方法
function generateChartData() {
    
    
  const xAxisData = ['张三', '李四', '王五', '赵六'];
  const seriesData = [85, 90, 95, 80];

  return {
    
    
    xAxis: {
    
    
      type: 'category',
      data: xAxisData
    },
    yAxis: {
    
    
      type: 'value'
    },
    series: [{
    
    
      data: seriesData,
      type: 'bar'
    }]
  };
}

Dans l'exemple de code ci-dessus, nous requireavons introduit xlsxles echartsbibliothèques et via l'instruction. generateChartDataEnsuite, une méthode appelée est définie , qui est utilisée pour générer les données du graphique.

Dans generateChartDatala méthode, nous définissons les tableaux xAxisDataet seriesData, qui représentent respectivement les données des axes x et y du graphique. Ces données sont ensuite assemblées dans un objet contenant les informations de configuration du graphique.

Ensuite, vous pouvez utiliser echartsla bibliothèque pour générer le graphique et insérer les données du graphique dans le résumé du fichier Excel :

// 定义导出 Excel 报表的方法
function exportExcel(data, filename) {
    
    
  const workbook = XLSX.utils.book_new();
  const sheet = XLSX.utils.aoa_to_sheet(data);

  // 生成图表数据
  const chartData = generateChartData();

  // 创建 chart sheet
  const chartSheet = XLSX.utils.aoa_to_sheet([
    ['姓名', '成绩'],
    ['张三', chartData.series[0].data[0]],
    ['李四', chartData.series[0].data[1]],
    ['王五', chartData.series[0].data[2]],
    ['赵六', chartData.series[0].data[3]],
  ]);

  // 在 chart sheet 中插入图表
  const chart = echarts.init(document.createElement('canvas'), null, {
    
    
    devicePixelRatio: 2
  });
  const option = chartData;
  chart.setOption(option);
  const chartImage = new Image();
  chartImage.src = chart.getDataURL({
    
    
    type: 'png',
    pixelRatio: 2
  });
  XLSX.utils.sheet_add_image(chartSheet, chartImage, {
    
    
    tl: {
    
     col: 0, row: 6 },
    br: {
    
     col: 5, row: 18 }
  });

  // 添加 sheets 到 workbook
  XLSX.utils.book_append_sheet(workbook, sheet, '数据');
  XLSX.utils.book_append_sheet(workbook, chartSheet, '汇总');

  // 生成 Excel 文件
  const excelBuffer = XLSX.write(workbook, {
    
     bookType: 'xlsx', type: 'array' });
  const filePath = `${
      
      wx.env.USER_DATA_PATH}/${
      
      filename}.xlsx`;

  // 保存文件并分享
  wx.saveFile({
    
    
    tempFilePath: filePath,
    filePath: filePath,
    success: function(res) {
    
    
      const savedFilePath = res.savedFilePath;

      wx.shareFile({
    
    
        filePath: savedFilePath,
        success: function(res) {
    
    
          console.log('分享成功');
        },
        fail: function(error) {
    
    
          console.log('分享失败', error);
        }
      });
    },
    fail: function(error) {
    
    
      console.log('保存文件失败', error);
    }
  });
}

Dans l'exemple de code ci-dessus, nous exportExcelavons ajouté une logique supplémentaire dans la méthode pour générer les données du graphique et insérer le graphique dans le résumé du fichier Excel.

Tout d’abord, nous avons créé une chartSheetfeuille graphique nommée et utilisé XLSX.utils.aoa_to_sheetla méthode pour convertir les données du graphique en données de feuille. Ensuite, utilisez echartsla bibliothèque pour créer une instance de graphique et définir les éléments de configuration du graphique. Ensuite, utilisez chart.getDataURLla méthode pour convertir le graphique en image et utilisez XLSX.utils.sheet_add_imagela méthode pour insérer l’image du graphique dans la feuille graphique.

Enfin, nous ajoutons la feuille de données et la feuille graphique au classeur, et XLSX.writeécrivons le classeur dans un tableau via la méthode. Ensuite, utilisez wx.saveFilela méthode pour enregistrer le tableau dans un fichier local et wx.shareFilela méthode pour partager le fichier.

Ensuite, vous pouvez appeler exportExcella méthode pour exporter le rapport Excel et partager le fichier :

// 示例数据
const data = [
  ['姓名', '年龄', '性别'],
  ['张三', 25, '男'],
  ['李四', 30, '女'],
  ['王五', 28, '男']
];

// 调用导出 Excel 报表的方法
exportExcel(data, '报表');

Dans l'exemple ci-dessus, nous avons défini un datatableau nommé qui contient les données à exporter. Ensuite, appelez exportExcella méthode pour exporter le rapport Excel et spécifiez le nom du fichier '报表'.

Veuillez noter que l'exemple de code ci-dessus est uniquement à titre de référence et que l'implémentation spécifique devra peut-être être ajustée en fonction de vos besoins réels.

Exporter au format PDF

Pour convertir le fichier Excel généré au format PDF, vous pouvez utiliser des bibliothèques tierces xlsxet pdfmake. Tout d’abord, utilisez xlsxpour lire le fichier Excel en tant que données, puis utilisez pour pdfmakeconvertir les données au format PDF.

Voici un exemple de code qui montre comment convertir le fichier Excel généré en PDF :

  1. Tout d’abord, installez les bibliothèques dépendantes xlsxet pdfmakevous pouvez utiliser npm pour installer :
npm install xlsx pdfmake
  1. xlsxIntroduisez la bibliothèque et dans la page de l'applet pdfmakeet définissez une méthode pour convertir les fichiers Excel en PDF :
// 引入依赖库
const XLSX = require('xlsx');
const pdfMake = require('pdfmake/build/pdfmake');
const pdfFonts = require('pdfmake/build/vfs_fonts');

// 注册字体
pdfMake.vfs = pdfFonts.pdfMake.vfs;

// 定义将 Excel 文件转换为 PDF 的方法
function convertToPDF(filePath, callback) {
    
    
  // 读取 Excel 文件
  const wb = XLSX.readFile(filePath);

  // 将 Excel 数据转换为 JSON 对象
  const sheetName = wb.SheetNames[0];
  const worksheet = wb.Sheets[sheetName];
  const jsonData = XLSX.utils.sheet_to_json(worksheet, {
    
     header: 1 });

  // 将 JSON 对象转换为 PDF
  const docDefinition = {
    
    
    content: [
      {
    
    
        table: {
    
    
          body: jsonData
        }
      }
    ]
  };

  const pdfDocGenerator = pdfMake.createPdf(docDefinition);
  pdfDocGenerator.getBlob((blob) => {
    
    
    if (typeof callback === 'function') {
    
    
      callback(blob);
    }
  });
}

Dans l'exemple de code ci-dessus, nous requireavons introduit xlsxles pdfmakebibliothèques et via l'instruction. Ensuite, nous avons enregistré les fichiers de polices à utiliser lors de la génération de PDF.

Ensuite, une méthode nommée est définie convertToPDF, qui accepte un paramètre filePathindiquant le chemin du fichier Excel à convertir. Dans la méthode, nous xlsxlisons le fichier Excel en tant que données à l'aide de la méthode et XLSX.utils.sheet_to_jsonconvertissons les données en un objet JSON à l'aide de la méthode.

Nous utilisons ensuite pdfmakepour convertir l'objet JSON en PDF. Nous créons un docDefinitionobjet dont contentles propriétés définissent la structure du contenu PDF. Dans cet exemple, nous utilisons un tableau pour afficher des données Excel.

Enfin, nous pdfMake.createPdfcréons un générateur de document PDF via la méthode et utilisons getBlobla méthode pour convertir le PDF généré en un objet Blob et le renvoyer via la fonction de rappel.

Ensuite, vous pouvez utiliser convertToPDFla méthode pour convertir le fichier Excel généré en PDF et effectuer d'autres opérations, telles que l'enregistrer localement ou le partager :

// 调用将 Excel 文件转换为 PDF 的方法
convertToPDF('path/to/excel.xlsx', (pdfBlob) => {
    
    
  // 在这里可以进行进一步的操作,比如保存到本地或分享
});

Dans l’exemple ci-dessus, nous avons appelé convertToPDFla méthode et transmis le chemin d’accès au fichier Excel. Dans la fonction de rappel, vous pouvez effectuer d'autres opérations sur l'objet PDF Blob généré, comme l'enregistrer localement ou le partager.

Veuillez noter que l'exemple de code ci-dessus est uniquement à titre de référence et que l'implémentation spécifique devra peut-être être ajustée en fonction de vos besoins réels. De plus, le mini-programme peut avoir des restrictions sur les opérations du système de fichiers et peut ne pas être en mesure d'enregistrer et de partager directement des fichiers PDF. Vous devrez peut-être effectuer des ajustements en fonction de la situation réelle.

Je suppose que tu aimes

Origine blog.csdn.net/gao511147456/article/details/132009965
conseillé
Classement