feat: 首页revenue spent加上导出表格功能

src/views/Dashboard/src/components/RevenueChart.vue

@@ -82,6 +82,85 @@ const isShowTooltips = computed(() => {
   return bar_data.value?.isShowTooltips
 })
 
+const downloadName = computed(() => {
+  return bar_data.value?.download_name
+})
+const exportData = ({ filename }: any) => {
+  $api
+    .RevenueDownload({
+      date_start: props.RevenueStartDate,
+      date_end: props.RevenueEndDate
+    })
+    .then((res: any) => {
+      if (res.code === 200) {
+        let header: any = []
+        let data: any = []
+        let sheetname: any = []
+        let filterA = res.data.r2_cloumn.map((el: any) => {
+          return el.dataIndex
+        })
+        let titleA = res.data.r2_cloumn.map((el: any) => {
+          return el.title
+        })
+        let filterB = res.data.r3_cloumn.map((el: any) => {
+          return el.dataIndex
+        })
+        let titleB = res.data.r3_cloumn.map((el: any) => {
+          return el.title
+        })
+        let result: any = [
+          {
+            tHeader: titleA,
+            filterVal: filterA,
+            tableDatas: res.data.r2,
+            sheetName: res.data.r2_title
+          },
+          {
+            tHeader: titleB,
+            filterVal: filterB,
+            tableDatas: res.data.r3,
+            sheetName: res.data.r3_title
+          }
+        ]
+        let formatJson = (filterVal: any, jsonData: any = []) => {
+          console.log(filterVal, jsonData, 'value')
+          return jsonData?.map((v: any) => filterVal.map((j: any) => v[j]))
+        }
+        for (var i in result) {
+          header.push(result[i].tHeader)
+          sheetname.push(result[i].sheetName)
+          data.push(formatJson(result[i].filterVal, result[i].tableDatas))
+        }
+        // 将表头插入数据数组中
+        for (let i = 0; i < header.length; i++) {
+          data[i]?.unshift(header[i])
+        }
+        let ws_name = sheetname
+        // 创建工作簿对象
+        let wb = XLSX.utils.book_new()
+        let ws: any = []
+        // 创建每个工作表并设置列宽
+        for (let j = 0; j < header.length; j++) {
+          ws.push(XLSX.utils.aoa_to_sheet(data[j]))
+          let arr: any = []
+          header[j].forEach((val: any) => {
+            arr.push({
+              wpx: 120
+            })
+          })
+          ws[j]['!cols'] = arr
+        }
+        // 将工作表对象添加到工作簿中
+        for (let k = 0; k < header.length; k++) {
+          wb.SheetNames.push(ws_name[k])
+          wb.Sheets[ws_name[k]] = ws[k]
+        }
+        XLSX.writeFile(wb, filename + '.xlsx') // 导出文件
+      }
+    })
+    .finally(() => {})
+}
+
 // 数额
 const initOption = reactive({
   //标题
@@ -215,16 +294,20 @@ const initOption = reactive({
     top: 6,
     right: 8,
     feature: {
-      saveAsImage: { show: true, name: 'Revenue Spent', type: 'png', backgroundColor: '#fff' }
-      // myTool1: {
-      //   show: true,
-      //   title: 'update',
-      //   icon: 'image://' + updateIcon,
-      //   onclick: function () {
-      //     let filename = 'Revenue Spent Details ' + barName.value[0] + '-' + barName.value[barName.value.length - 1]
-      //     exportData({ filename: filename })
-      //   }
-      // }
+      saveAsImage: { show: true, name: downloadName.value, pixelRatio: 2 },
+      myTool1: {
+        show: true,
+        title: 'update',
+        icon: 'image://' + updateIcon,
+        onclick: function () {
+          let filename =
+            'Revenue Spent Details ' +
+            barName.value[0] +
+            '-' +
+            barName.value[barName.value.length - 1]
+          exportData({ filename: filename })
+        }
+      }
     },
     showTitle: false
   }