空间分析导出

src/views/emergencyCommandMap/RightSection/knowledgeWarehouse.vue

@@ -50,7 +50,7 @@ const { mm_event_type } = toRefs<any>(
 );
 const queryParams = reactive({
   pageNum: 1,
-  pageSize: 7,
+  pageSize: 10,
   sortBy: 'publishDate',
   sortOrder: 'desc'
 });

src/views/globalMap/RightMenu/SpatialAnalysis.vue

@@ -29,7 +29,8 @@
         <div v-for="(item, index) in filteredList" :key="index" class="item2">{{ item.name + '(' + item.list.length + ')' }}</div>
       </div>
     </div>
-    <Dialog v-model="showDetail" title="空间分析" hide-footer>
+    <Dialog v-if="showDetail" v-model="showDetail" title="空间分析" hide-footer>
+      <div class="common-btn-primary export-btn" @click="exportData">导出</div>
       <div class="common-table">
         <div class="table-header">
           <div class="td">序号</div>
@@ -56,6 +57,7 @@
 import { validateNum } from '@/utils/ruoyi';
 import { getSpatialAnalysis } from '@/api/globalMap';
 import { deepClone } from '@/utils';
+import * as XLSX from 'xlsx';
 
 const props = defineProps({
   updateLocation: []
@@ -147,6 +149,35 @@ let showDetail = ref(false);
 const handleShowDetail = () => {
   showDetail.value = true;
 };
+// 导出
+const exportData = () => {
+  let jsonData = [];
+  const headerMap = {
+    townName: '行政镇',
+    villageName: '行政村',
+    populationSize: '常住人口(万)',
+    areaSize: '面积(km2)',
+    GDP: 'GDP(亿元)'
+  };
+  const orderedKeys = Object.keys(headerMap);
+  analysisData.value.townData.forEach((item) => {
+    const newItem = {};
+    Object.keys(item).forEach((key) => {
+      if (headerMap[key]) {
+        newItem[headerMap[key]] = item[key];
+      }
+    });
+    jsonData.push(newItem);
+  });
+  const worksheet = XLSX.utils.json_to_sheet(jsonData, {
+    header: orderedKeys.map((key) => headerMap[key]) // 按 headerMap 顺序传递中文表头
+  });
+  // 创建工作簿并添加工作表
+  const workbook = XLSX.utils.book_new();
+  XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');
+  // 导出文件
+  XLSX.writeFile(workbook, '空间分析数据.xlsx');
+};
 </script>
 
 <style lang="scss" scoped>
@@ -207,4 +238,9 @@ const handleShowDetail = () => {
   border-radius: 4px;
   margin-top: 5px;
 }
+.export-btn {
+  position: absolute;
+  right: 20px;
+  top: 55px;
+}
 </style>