物流数据导出excel

src/views/WDLY/outInBound/logistics/index.vue

@@ -7,11 +7,17 @@
           //element talbe事件都能传
           select: select,
         }" :action-list="[
+           {
+            text: '导出Excel',
+            action: () => deriveExcel(),
+          },
           {
             text: '添加物流数据',
             action: () => openModal('add'),
           },
+
         ]" @get-list="getList">
+
         <template #one="{ item }">
           <div style="cursor: pointer; color: #409eff" @click="handleClickArrivalStatus(item)">
             {{ item.businessCode }}
@@ -22,6 +28,31 @@
             {{ item.code }}
           </div>
         </template>
+
+        <template #SKU="{ item }">
+          <div style="width:100%">
+            <div v-for="row in item.logisticsProductInfoList" :key="row.id">
+              {{ row.productCode }}
+            </div>
+          </div>
+        </template>
+
+        <template #spec="{ item }">
+          <div style="width:100%">
+            <div v-for="row in item.logisticsProductInfoList" :key="row.id">
+              {{ row.productSpec }}
+            </div>
+          </div>
+        </template>
+
+        <template #cQuantity="{ item }">
+          <div style="width:100%">
+            <div v-for="row in item.logisticsProductInfoList" :key="row.id">
+              {{ row.quantity }}
+            </div>
+          </div>
+        </template>
+
       </byTable>
     </div>
     <el-dialog :title="
@@ -88,6 +119,20 @@
         <el-button @click="dialogVisibleThree = false" size="large">取 消</el-button>
       </template>
     </el-dialog>
+
+    <el-dialog v-model="openExcel" title="导出Excel" width="500" append-to-body>
+      <div v-loading="excelLoading">
+        <div style="color:red;margin-bottom:5px">请选择日期区间（限7天）</div>
+        <el-date-picker v-model="beginTime" type="date" placeholder="开始日期" value-format="YYYY-MM-DD" />
+        <div></div>
+        <el-date-picker v-model="endTime" type="date" placeholder="结束日期" value-format="YYYY-MM-DD" :disabled="!beginTime" :disabled-date="disabledFn"
+                        style="margin-top:20px" />
+      </div>
+      <template #footer>
+        <el-button @click="openExcel = false" size="large">取 消</el-button>
+        <el-button type="primary" @click="exportExcel()" size="large">导出</el-button>
+      </template>
+    </el-dialog>
   </div>
 </template>
   
@@ -100,6 +145,8 @@ import { computed, defineComponent, ref } from "vue";
 import useUserStore from "@/store/modules/user";
 import SelectProduct from "@/components/WDLY/product/SelectProduct";
 import ArrivalDetails from "@/views/WDLY/purchaseManage/com/ArrivalDetails.vue";
+import moment from "moment";
+
 const route = useRoute();
 const loading = ref(false);
 const submitLoading = ref(false);
@@ -284,6 +331,27 @@ const config = computed(() => {
         "min-width": 150,
       },
     },
+    {
+      attrs: {
+        label: "SKU",
+        slot: "SKU",
+        width: 130,
+      },
+    },
+    {
+      attrs: {
+        label: "货物型号",
+        slot: "spec",
+        width: 160,
+      },
+    },
+    {
+      attrs: {
+        label: "采购实发数量",
+        slot: "cQuantity",
+        width: 110,
+      },
+    },
 
     {
       attrs: {
@@ -743,6 +811,76 @@ const handleClickArrivalStatus = (row) => {
   currnetPurchaseRow.value = obj;
   dialogVisibleThree.value = true;
 };
+
+const openExcel = ref(false);
+const excelLoading = ref(false);
+const beginTime = ref("");
+const endTime = ref("");
+const deriveExcel = () => {
+  beginTime.value = "";
+  endTime.value = "";
+  excelLoading.value = false;
+  openExcel.value = true;
+};
+
+const exportData = (res, name) => {
+  const content = res;
+  const blob = new Blob([content], { type: "application/ms-excel" });
+  const fileName = name;
+  if ("download" in document.createElement("a")) {
+    // 非IE下载
+    const elink = document.createElement("a");
+    elink.download = fileName;
+    elink.style.display = "none";
+    elink.href = URL.createObjectURL(blob);
+    document.body.appendChild(elink);
+    elink.click();
+    URL.revokeObjectURL(elink.href); // 释放URL 对象
+    document.body.removeChild(elink);
+  } else {
+    navigator.msSaveBlob(blob, fileName);
+  }
+};
+
+const exportExcel = () => {
+  excelLoading.value = true;
+  if (beginTime.value && endTime.value) {
+    proxy
+      .postTwo("/logisticsInfos/exportExcel", {
+        ...sourceList.value.pagination,
+        beginTime: beginTime.value,
+        endTime: endTime.value,
+      })
+      .then(
+        (res) => {
+          exportData(res, "物流数据.xlsx");
+          openExcel.value = false;
+        },
+        (err) => {
+          ElMessage({
+            message: "联系管理员",
+            type: "info",
+          });
+          openExcel.value = false;
+        }
+      );
+  } else {
+    ElMessage({
+      message: "请选择导出范围",
+      type: "info",
+    });
+  }
+};
+
+const disabledFn = (date) => {
+  // 当前日期
+  let current = moment(date).format("yyyy-MM-DD");
+  // 禁用已选日期和比当前日期小的
+  return (
+    moment(beginTime.value).isAfter(current) ||
+    moment(beginTime.value).add(6, "day").isBefore(current)
+  );
+};
 </script>
   
 <style lang="scss" scoped>