管理平台功能升级

src/components/mainPage/monitoring.vue

@@ -216,6 +216,11 @@
       operateLabel="删除系统记录"
       @requestOperate="requestOperate"
     />
+    <DownloadData
+      ref="downloadDataRef"
+      operateLabel="导出系统记录数据"
+      @downloadData="executeDownloadData"
+    />
   </div>
 </template>
 
@@ -231,6 +236,7 @@ import SelectSearch from "../search/selectSearch.vue";
 import DateTimePicker from "../search/dateTimePicker.vue";
 import Pagination from "../search/pagination.vue";
 import PasswordOauth from "../operate/passwordOauth.vue";
+import DownloadData from "../operate/downloadData.vue";
 
 import monitoringActiveStore from "../../stores/monitoring";
 
@@ -242,6 +248,7 @@ import $url from "../../api/url";
 import { encrypt } from "../../utils/aes";
 import { judgment } from "../../utils/judgment.js";
 import { hasNullOrEmptyPropertyWithTypeof } from "../../utils/hasNullOrEmptyPropertyWithTypeof.js";
+import { downloadData } from "../../utils/downloadData.js";
 
 const monitoringMsgActive = monitoringActiveStore();
 
@@ -261,6 +268,7 @@ const SearchNameKeyRef = ref(null);
 const createdDateTimePickerRef = ref(null);
 const createdSortDateTimeRef = ref(null);
 const PaginationRef = ref(null);
+const downloadDataRef = ref(null);
 const delPasswordOauthRef = ref(null);
 const dialogSearchVisible = ref(false);
 const dialogSortVisible = ref(false);
@@ -386,6 +394,9 @@ const showTools = (operateType) => {
       dialogOperationVisible.value = !dialogOperationVisible.value;
       monitoringMsgActive.dialogOperationVisible = dialogOperationVisible.value;
       break;
+    case "downloadData":
+      downloadDataRef.value.downloadDataDialogVisible = true;
+      break;
     default:
       break;
   }
@@ -532,6 +543,68 @@ const requestOperate = () => {
   });
 };
 
+const executeDownloadData = (form) => {
+  // 根据数据量大小来决定在前端还是后端导出数据
+  if (
+    tableData.value == [] ||
+    tableData.value == undefined ||
+    PaginationRef.value.dataCount == 0 ||
+    PaginationRef.value.dataCount == null
+  ) {
+    ElMessage.error("暂无数据！");
+    return;
+  }
+  let dataClone = JSON.parse(JSON.stringify(tableData.value));
+  dataClone.forEach((item) => {
+    delete item.origin_time;
+  });
+  const dataHeaders = [
+    "操作名称",
+    "操作描述",
+    "危险等级",
+    "执行状态",
+    "影响到的数据数目",
+    "操作者uid",
+    "操作者姓名",
+    "行为记录时间"
+  ];
+  downloadData(form, dataClone, dataHeaders);
+  if (PaginationRef.value.dataCount <= PaginationRef.value.limit) {
+    downloadData(form, dataClone, dataHeaders);
+  } else {
+    const data = {
+      form,
+      searchMsg: {
+        searchOptions: searchOptions,
+        sortOptions: sortOptions,
+      },
+      dataHeaders,
+    };
+    $http.post($url.downloadMonitoring, data).then((res) => {
+      if (res.data.code === 200) {
+        ElMessage({
+          message: "数据导出成功！",
+          type: "success",
+        });
+        // 创建一个隐藏的<a>标签
+        const link = document.createElement("a");
+        link.style.display = "none";
+        link.href = res.data.fileUrl;
+        // 设置下载的文件名
+        link.download = res.data.fileName;
+        // 触发点击事件来下载文件
+        document.body.appendChild(link);
+        link.click();
+        // 清理
+        document.body.removeChild(link);
+        URL.revokeObjectURL(link.href);
+      } else {
+        ElMessage.error("数据导出失败！");
+      }
+    });
+  }
+};
+
 defineExpose({ monitoringMsg });
 
 watch(searchOptions, (value) => {