待出库批量导入

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

@@ -6,7 +6,11 @@
                :selectConfig="selectConfig" :table-events="{
           //element talbe事件都能传
           select: select,
-        }" :action-list="[]" @get-list="getList">
+        }" :action-list="[ {
+            text: 'Excel导入',
+            action: () => openExcelOne(),
+            disabled: false,
+          },]" @get-list="getList">
         <template #slotName="{ item }">
           {{ item.createTime }}
         </template>
@@ -114,6 +118,69 @@
         </span>
       </template> -->
     </el-dialog>
+
+    <el-dialog title="Excel导入" v-model="openExcelDialog" width="500">
+      <div v-loading="excelLoading">
+        <div>
+          <div style="margin-bottom: 10px">上传附件</div>
+          <el-upload :action="actionUrl + '/jdOrder/getBatchOutExcelInfo'" :headers="headers"
+                     :before-upload="useImportExcelStore().updateRequestHeaders" :on-success="handleSuccessOne" :on-progress="handleProgressOne"
+                     :show-file-list="false" :on-error="handleErrorOne" accept=".xls, .xlsx">
+            <el-button type="primary">选择</el-button>
+          </el-upload>
+        </div>
+      </div>
+      <template #footer>
+        <el-button @click="openExcelDialog = false">取 消</el-button>
+      </template>
+    </el-dialog>
+
+    <el-dialog title="出库信息输入" v-model="outBoundInfo" width="80%">
+      <div v-loading="excelLoading">
+        <div style="margin-bottom: 10px">导入前请先选择仓库</div>
+        <el-select v-model="importData.warehouseId" placeholder="请选择仓库">
+          <el-option v-for="item in warehouseList" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+        <div style="margin: 20px 0" v-show="importData.warehouseId">
+          <div style="margin-bottom: 10px">上传附件</div>
+          <el-upload :action="actionUrl + '/jdOrder/batchOutStock'" :data="importData" :headers="headers" :before-upload="beforeUploadFn"
+                     :on-success="handleSuccessTwo" :on-progress="handleProgressOne" :show-file-list="false" :on-error="handleErrorTwo"
+                     accept=".xls, .xlsx">
+            <el-button type="primary">选择</el-button>
+          </el-upload>
+        </div>
+        <el-form label-position="top" style="width:100%">
+          <div v-for="row in submitArr" :key="row" style="width:100%">
+            <div style="margin-bottom:10px;font-weight:700">
+              {{'订单号：'+row}}
+            </div>
+            <el-row style="width:100%" :gutter="10">
+              <el-col :span="8">
+                <el-form-item label="预计送达时间">
+                  <el-date-picker v-model="submitData[row].deliveryTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择"
+                                  style="width:100%" />
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="物流/快递公司">
+                  <el-select v-model="submitData[row].logisticsCompanyCode" placeholder="请选择" style="width:100%">
+                    <el-option v-for="item in logisticsData" :key="item.value" :label="item.label" :value="item.value" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="物流/快递单号" style="width:100%">
+                  <el-input v-model="submitData[row].logisticsCode" placeholder="请输入" style="width:100%"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div>
+        </el-form>
+      </div>
+      <template #footer>
+        <el-button @click="outBoundInfo = false">取 消</el-button>
+      </template>
+    </el-dialog>
   </div>
 </template>
   
@@ -1227,6 +1294,104 @@ const handleError = (err) => {
   openExcel.value = false;
   excelLoading.value = false;
 };
+
+const openExcelDialog = ref(false);
+const importData = ref({});
+const submitData = ref({});
+const openExcelOne = () => {
+  submitData.value = {};
+  importData.value = {
+    warehouseId: "",
+    outInfo: "",
+  };
+  openExcelDialog.value = true;
+};
+
+const handleProgressOne = () => {
+  excelLoading.value = true;
+};
+
+const handleErrorOne = (err) => {
+  ElMessage({
+    message: `${err}，请重试！`,
+    type: "info",
+  });
+  openExcelDialog.value = false;
+  excelLoading.value = false;
+};
+
+const submitArr = ref([]);
+const handleSuccessOne = (res) => {
+  if (res.code != 200) {
+    return ElMessage({
+      message: `${res.msg}，请重试！`,
+      type: "info",
+    });
+  } else {
+    // ElMessage({
+    //   message: "导入成功！",
+    //   type: "success",
+    // });
+    excelLoading.value = false;
+    outBoundInfo.value = true;
+    if (res && res.data) {
+      submitArr.value = res.data;
+      for (let i = 0; i < res.data.length; i++) {
+        const key = res.data[i];
+        submitData.value[key] = {
+          deliveryTime: "",
+          logisticsCompanyCode: "",
+          logisticsCode: "",
+        };
+      }
+    }
+  }
+};
+
+const outBoundInfo = ref(false);
+
+const beforeUploadFn = () => {
+  useImportExcelStore().updateRequestHeaders();
+  for (const key in submitData.value) {
+    let obj = submitData.value[key];
+    for (const sonKey in obj) {
+      if (!obj[sonKey]) {
+        ElMessage({
+          message: `订单号为${key}的相关数据未填完整`,
+          type: "info",
+        });
+        return false;
+      }
+    }
+  }
+  importData.value.outInfo = JSON.stringify(submitData.value);
+  // importData.value.outInfo = submitData.value;
+};
+
+const handleErrorTwo = (err) => {
+  ElMessage({
+    message: `${err}，请重试！`,
+    type: "info",
+  });
+  excelLoading.value = false;
+};
+
+const handleSuccessTwo = (res) => {
+  if (res.code != 200) {
+    return ElMessage({
+      message: `${res.msg}，请重试！`,
+      type: "info",
+    });
+  } else {
+    ElMessage({
+      message: "导入成功！",
+      type: "success",
+    });
+    excelLoading.value = false;
+    outBoundInfo.value = true;
+    openExcelDialog.value = false;
+  }
+};
 </script>
   
 <style lang="scss" scoped>