怎么将StockMeterBaseStatistics文件中ECharts生成的图表，在使用或添加JeecgListMixin.js中实现存储四个图标到本地的一个新excel文件中

要在 `StockMeterBaseStatistics` 中使用 `JeecgListMixin` 实现将 ECharts 生成的图表存储到本地的新 Excel 文件中，可以按照以下步骤进行：

### 1. 导出 ECharts 图表为图像
首先，你需要将 ECharts 图表导出为图片格式（如 PNG 或 JPEG），然后将这些图片嵌入到 Excel 文件中。可以使用 ECharts 的 `getDataURL` 方法来获取图表的图像数据 URL。

### 2. 使用 XLSX 库生成 Excel 文件
你可以使用 JavaScript 的 `xlsx` 库来生成 Excel 文件，并将图片嵌入到其中。

### 3. 修改 `StockMeterBaseStatistics.vue`
在 `StockMeterBaseStatistics.vue` 中添加一个新的方法来导出图表到 Excel。

#### 添加依赖
确保你已经安装了 `xlsx` 库：

npm install xlsx

#### 修改 `StockMeterBaseStatistics.vue`
在 `methods` 中添加一个新的方法 `exportChartsToExcel`：

import { saveAs } from 'file-saver';
import XLSX from 'xlsx';

// ... existing imports ...

methods: {
    // ... existing methods ...

    async exportChartsToExcel() {
        const workbook = XLSX.utils.book_new();

        // Get charts by their IDs
        const charts = [
            echarts.getInstanceByDom(document.getElementById('chart-1')),
            echarts.getInstanceByDom(document.getElementById('chart-2')),
            echarts.getInstanceByDom(document.getElementById('chart-3')),
            echarts.getInstanceByDom(document.getElementById('chart-4'))
        ];

        // Create worksheet for each chart
        charts.forEach((chart, index) => {
            if (chart) {
                // Get the chart image as a Data URL
                const imageDataURL = chart.getDataURL({
                    pixelRatio: 2,
                    backgroundColor: '#ffffff'
                });

                // Convert the Data URL to a Blob
                fetch(imageDataURL)
                    .then(res => res.blob())
                    .then(blob => {
                        const ws = XLSX.utils.json_to_sheet([{}]); // Create an empty sheet
                        const worksheetName = `Chart ${index + 1}`;

                        // Add the image to the worksheet
                        const imgRelId = workbook.Workbook.Relationships.push({
                            Type: `http://schemas.openxmlformats.org/officeDocument/2006/relationships/image`,
                            Target: `/xl/media/image${index + 1}.png`
                        }).attr({ Id: `rId${index + 1}` });

                        workbook.FileBuffers[imgRelId.attr.Id] = blob;

                        // Insert the image into the worksheet
                        const worksheetRelationship = {
                            Type: `http://schemas.openxmlformats.org/officeDocument/2006/relationships/drawing`,
                            Target: `/xl/drawings/drawing.xml`
                        };
                        const worksheetRelationships = [];
                        worksheetRelationships.push(worksheetRelationship);

                        const worksheetDrawing = `
                            <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
                            <cdr:wsDr xmlns:cdw="http://schemas.openxmlformats.org/drawingml/2006/chartDrawing" 
                                      xmlns:a="http://schemas.openxmlformats.org/drawingml/2006/main"
                                      xmlns:cdr="http://schemas.openxmlformats.org/drawingml/2006/spreadsheetDrawing">
                                <cdr:twoCellAnchor editAs="oneCell">
                                    <cdr:from>
                                        <cdr:col>${0}</cdr:col>
                                        <cdr:colOff>${0}</cdr:colOff>
                                        <cdr:row>${0}</cdr:row>
                                        <cdr:rowOff>${0}</cdr:rowOff>
                                    </cdr:from>
                                    <cdr:to>
                                        <cdr:col>${2}</cdr:col>
                                        <cdr:colOff>${Math.floor(960 * 9525)}</cdr:colOff>
                                        <cdr:row>${20}</cdr:row>
                                        <cdr:rowOff>${Math.floor(540 * 737)}</cdr:rowOff>
                                    </cdr:to>
                                    <cdr:pic>
                                        <cdr:nvPicPr>
                                            <cdr:cNvPr id="${index + 1}" name="Picture ${index + 1}"/>
                                            <cdr:cNvPicPr>
                                                <cdr:blipFill>
                                                    <a:blip r:embed="${imgRelId}">
                                                        <a:ext cx="100000" cy="100000"/>
                                                    </a:blip>
                                                    <a:stretch>
                                                        <a:fillRect/>
                                                    </a:stretch>
                                                </cdr:blipFill>
                                                <cdr:spPr bwMode="auto">
                                                    <a:xfrm>
                                                        <a:off x="${0}" y="${0}"/>
                                                        <a:ext cx="${960 * 10000}" cy="${540 * 10000}"/>
                                                    </a:xfrm>
                                                    <a:prstGeom prst="rect">
                                                        <a:avLst/>
                                                    </a:prstGeom>
                                                </cdr:spPr>
                                            </cdr:nvPicPr>
                                            <cdr:spPr>
                                                <a:xfrm>
                                                    <a:off x="0" y="0"/>
                                                    <a:ext cx="1905000" cy="1016000"/>
                                                </a:xfrm>
                                                <a:prstGeom prst="rect">
                                                    <a:avLst/>
                                                </a:prstGeom>
                                            </cdr:spPr>
                                        </cdr:nvPicPr>
                                    </cdr:pic>
                                    <cdr:clientData/>
                                </cdr:twoCellAnchor>
                            </cdr:wsDr>
                        `;

                        ws["!rels"] = worksheetRelationships;
                        ws["drawing"] = worksheetDrawing;

                        // Add the worksheet to the workbook
                        XLSX.utils.book_append_sheet(workbook, ws, worksheetName);
                    });
            }
        });

        // Write the workbook to a file and trigger the download
        XLSX.writeFile(workbook, 'charts.xlsx');
    },
},

### 4. 添加导出按钮
在 `template` 中添加一个按钮来触发导出操作：

<a-button type="primary" icon="download" @click="exportChartsToExcel">导出图表</a-button>

### 5. 调整 CSS 样式
如果你需要调整样式，可以在 `style` 部分添加相应的 CSS 规则。

### 6. 运行项目
保存所有的更改后，运行你的项目并测试新的导出功能。点击“导出图表”按钮应该会生成一个包含所有 ECharts 图表的新 Excel 文件。

通过以上步骤，你可以实现将 ECharts 生成的图表存储到本地的一个新 Excel 文件中。