添加订单导出功能

src/utils/downLoadFile.js

@@ -0,0 +1,93 @@
+import axios from 'axios'
+import qs from 'qs'
+import {
+  getToken
+} from '@/utils/auth'
+// import load from '@/utils/loading'
+import cleanDeep from 'clean-deep'
+
+/**
+ * 导出模板
+ * @param {*} params
+ * params: {
+ *      url: xxx,
+ *      params: {},
+ *      fileName: xxx.xls
+ * }
+ */
+export const Export = (that, params, message, func) => {
+  // 报表导出
+  let url = params.url
+  const options = {
+    method: params.method ? params.method : 'get',
+    headers: {
+      Authorization: getToken()
+    },
+    // params: params.params,
+    url,
+    responseType: "blob"
+  };
+  if (options.method == 'post') {
+    options.data = params.params
+  } else {
+    options.params = params.params
+  }
+  that.$confirm((message || "您确定下载模板"), "提示", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning"
+    })
+    .then(() => {
+      // load.startLoading()
+      axios(cleanDeep(options)).then(res => {
+        let blob = new Blob([res.data], {
+          // type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
+          type: "application/vnd.ms-excel;charset=utf-8"
+          //word文档为application/msword,pdf文档为application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8
+        });
+        let text = (new Response(blob)).text()
+        text.then(res => {
+          // 判断是否报错
+          if (res.indexOf('code') != -1) {
+            let json = JSON.parse(res)
+            if (json.code == 403) {
+              that.$message.error(`登录过期，请重新登录！`)
+              setTimeout(() => {
+                that.$store.dispatch('user/resetToken').then(() => {
+                  location.reload()
+                })
+              }, 1000);
+              return
+            } else if(json.code == 200){
+              that.$message.success(json.msg)
+            } else {
+              that.$message.error(json.msg)
+            }
+            if (func) {
+              func()
+            }
+          } else {
+            let objectUrl = URL.createObjectURL(blob);
+            let link = document.createElement("a");
+            let fname = params.fileName || "导出文件.xls"; //下载文件的名字
+            link.href = objectUrl;
+            link.setAttribute("download", fname);
+            document.body.appendChild(link);
+            link.click();
+
+            if (func) {
+              func()
+            }
+
+          }
+        })
+
+        // load.endLoading();
+      }).catch(error => {
+        console.log(error)
+        that.$message.error('下载失败，请联系管理员');
+        // load.endLoading();
+      });
+    })
+    .catch(() => {});
+}

src/views/oms/order/index.vue

@@ -5,8 +5,17 @@
       <div>
         <i class="el-icon-search"></i>
         <span>筛选搜索</span>
+
+        <el-button
+          style="float: right; "
+          @click="onExport()"
+          size="small"
+          type="danger"
+        >
+          导出
+        </el-button>
         <el-button
-          style="float: right"
+          style="float: right; margin-right: 15px"
           type="primary"
           @click="handleSearchList()"
           size="small"
@@ -20,6 +29,7 @@
         >
           重置
         </el-button>
+        
       </div>
       <div style="margin-top: 15px">
         <el-form
@@ -274,6 +284,7 @@
 <script>
 import { fetchList, closeOrder, deleteOrder } from "@/api/order";
 import { formatDate } from "@/utils/date";
+import { Export } from "@/utils/downLoadFile";
 import LogisticsDialog from "@/views/oms/order/components/logisticsDialog";
 const defaultListQuery = {
   pageNum: 1,
@@ -581,6 +592,18 @@ export default {
       };
       return listItem;
     },
+    onExport() {
+      Export(
+        this,
+        {
+          url: "/api-mall-admin/export/orderDetail",
+          fileName: "订单列表.xls",
+          method: "post",
+          params: { ...this.listQuery },
+        },
+        "您确定导出订单列表?"
+      );
+    },
   },
 };
 </script>