修改订单管理交互逻辑

zkqy-ui/src/views/orderMange/components/dialogForm/OutStock.vue

@@ -271,7 +271,7 @@ export default {
           ...this.queryParams,
           saleOrderNo: saleNo,
         };
-        let fun = outboundDetails;
+        let fun = outboundDetails; //销售单零售单  同一个接口
         if (row.oldInventoryState == 2 && !flag) {
           fun = listOldRecord;
         }

zkqy-ui/src/views/orderMange/components/dialogForm/OutStockDetail.vue

@@ -0,0 +1,412 @@
+<template>
+  <div class="table-container">
+    <div style="float: right; margin: 0px; padding: 0px">
+      <el-button
+        @click="exportOutInfo"
+        v-show="oldInventoryState != 2"
+        type="success"
+        icon="el-icon-download"
+        >导出明细</el-button
+      >
+    </div>
+    <div style="clear: both"></div>
+    <el-row :gutter="20" class="mb10">
+      <el-col :span="8">
+        <div class="title_item">
+          <span class="label">合同号：</span>
+          <span class="label">{{ row.saleNo }}</span>
+        </div>
+      </el-col>
+      <el-col :span="8">
+        <div class="title_item">
+          <span class="label">日期：</span>
+          <span class="label">{{ row.saleDate }}</span>
+        </div>
+      </el-col>
+      <el-col :span="8">
+        <div class="title_item">
+          <span class="label">客户名称：</span>
+          <span class="label">{{ row.customName }}</span>
+        </div>
+      </el-col>
+      <el-col :span="8">
+        <div class="title_item">
+          <span class="label">批次：</span>
+          <span class="label"
+            ><el-select
+              size="mini"
+              v-model="batchNumber"
+              clearable
+              filterable
+              @change="batchChangeHandler"
+            >
+              <el-option
+                v-for="item in batchOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option> </el-select
+          ></span>
+        </div>
+      </el-col>
+    </el-row>
+    <!-- show-summary :summary-method="getSummaries" -->
+    <el-table
+      ref="tableRef"
+      :data="tableData"
+      border
+      stripe
+      row-key="productNo"
+      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+      @expand-change="getDetail"
+    >
+      <el-table-column type="expand">
+        <template slot-scope="props">
+          <el-table :data="props.row.children" border stripe>
+            <el-table-column type="index" width="50" />
+            <el-table-column
+              v-for="col in columns"
+              :key="col.id"
+              :prop="col.prop"
+              :label="col.label"
+            >
+            </el-table-column>
+            <el-table-column label="操作" v-if="row.status != 6">
+              <template slot-scope="scope">
+                <el-button
+                  v-show="oldInventoryState != 2"
+                  size="mini"
+                  type="danger"
+                  @click="handleDelete(scope.$index, scope.row)"
+                  >删除</el-button
+                >
+              </template>
+            </el-table-column>
+          </el-table>
+        </template>
+      </el-table-column>
+      <el-table-column type="index" width="50" />
+      <el-table-column label="名称" prop="productName"></el-table-column>
+      <el-table-column
+        label="规格"
+        prop="productSpecifications"
+      ></el-table-column>
+      <el-table-column label="批号" prop="lotNumber"></el-table-column>
+      <el-table-column label="等级" prop="productLevel"></el-table-column>
+      <el-table-column label="单位" prop="unit">
+        <!-- <template slot-scope="scope">
+          <el-input
+            v-model="scope.row.unit"
+            placeholder=""
+            size="normal"
+            clearable
+          ></el-input>
+        </template> -->
+      </el-table-column>
+      <el-table-column label="数量" prop="productNumber"></el-table-column>
+      <el-table-column label="单价" prop="productUnitPrice"></el-table-column>
+      <el-table-column label="金额" prop="productAmounts"></el-table-column>
+      <el-table-column label="批次状态" prop="batchState">
+        <template slot-scope="scope">
+          {{ scope.row.batchState == 0 ? "正常" : "撤销登账" }}
+        </template>
+      </el-table-column>
+
+      <!-- <el-table-column prop="productName" label="品名"></el-table-column>
+      <el-table-column prop="productSpecifications" label="规格">
+      </el-table-column>
+      <el-table-column prop="productColor" label="颜色"></el-table-column>
+      <el-table-column prop="lotNum" label="批号"></el-table-column>
+      <el-table-column prop="levels" label="等级"></el-table-column>
+      <el-table-column prop="grossWeight" label="毛重"></el-table-column>
+      <el-table-column prop="suttle" label="净重"></el-table-column>
+      <el-table-column prop="qrCode" label="码单号"></el-table-column>
+      <el-table-column prop="boxNum" label="箱号"></el-table-column> -->
+    </el-table>
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getOutStockDetail(row)"
+    />
+  </div>
+</template>
+
+<script>
+import { printOutsourceOrderList } from "@/api/tablelist/commonTable";
+import { outboundDetails } from "@/api/system/retailMange.js";
+import { listOldRecord } from "@/api/system/oldRecord.js";
+import moment from "moment";
+import { removeErrorOutboundRecord } from "@/api/system/ProductWarehousingRecord";
+
+export default {
+  name: "OutStockDetail",
+  props: [],
+  components: {},
+  data() {
+    return {
+      batchNumber: "",
+      allTableData: [], //所有表格数据
+      batchOptions: [], //批号选项数据
+      oldInventoryState: 0,
+      tableData: [],
+      row: {},
+      orderRow: {},
+      // 分页相关
+      total: 0,
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+      columns: [],
+      productColumns: [],
+    };
+  },
+  computed: {},
+  created() {
+    this.orderRow = {};
+  },
+  methods: {
+    // 获取详情回调
+    async getDetail(tree) {
+      console.log(1111);
+      let res = await outboundDetails({
+        saleOrderNo: tree.saleNo,
+        productNo: tree.productNo,
+        isEnablePaging: false,
+      });
+      if (res.code == 200) {
+        tree.children = res.rows;
+      } else {
+        tree.children = [];
+        this.$message.error(res.msg);
+      }
+    },
+    //删除回滚对应产品的库存
+    handleDelete(index, row) {
+      this.$confirm(
+        "是否删除名称为 “" + row.productName + "” 出库明细数据",
+        "提示",
+        { type: "warning" }
+      ).then(() => {
+        removeErrorOutboundRecord(row.id).then((res) => {
+          if (res.code == 200) {
+            this.$message.success("删除成功");
+            this.getOutStockDetail(this.orderRow);
+          } else {
+            this.$message.error("删除失败");
+            throw Error("删除失败");
+          }
+        });
+      });
+      //出库
+      console.log("删除出库产品、回滚库存", row);
+    },
+    exportOutInfo() {
+      if (this.tableData.length == 0) {
+        this.$message.warning("没有出库数据！");
+        return;
+      }
+      let { saleNo } = this.row;
+      // 出库明细导出
+      this.download(
+        "system/ProductOutboundRecord/importDataOutboundDetails",
+        {
+          saleOrderNo: saleNo,
+          isEnablePaging: false,
+        },
+        `${saleNo}_出库明细_${new Date().getTime()}.xlsx`
+      );
+    },
+    // 自定义的小计计算方法
+    getSummaries(param) {
+      if (this.oldInventoryState != 2) {
+        //原来的计算方法
+        return this.getSummary(param);
+      } else {
+        //旧库存计算方法
+        return this.getSummaryOld(param);
+      }
+    },
+    getSummary(param) {
+      const { columns, data } = param;
+      const sums = [];
+      columns.forEach((column, index) => {
+        if (index === 5) {
+          sums[index] = "小计:";
+          return;
+        }
+        const values = data.map((item) => Number(item[column.property]));
+        if (
+          index === 0 ||
+          index === 1 ||
+          index === 2 ||
+          index === 3 ||
+          index === 4 ||
+          index === 8 ||
+          index === 9 ||
+          index === 10
+        ) {
+          sums[index] = "";
+        } else if (!values.every((value) => isNaN(value))) {
+          sums[index] = values
+            .reduce((prev, curr) => {
+              const value = Number(curr);
+              if (!isNaN(value)) {
+                return prev + curr;
+              } else {
+                return prev;
+              }
+            }, 0)
+            ?.toFixed(2);
+          console.log(sums[index], index);
+        } else {
+          sums[index] = "N/A";
+        }
+      });
+
+      return sums;
+    },
+    getSummaryOld(param) {
+      const { columns, data } = param;
+      const sums = [];
+      columns.forEach((column, index) => {
+        if (index === 2) {
+          sums[index] = "小计:";
+          return;
+        }
+        const values = data.map((item) => Number(item[column.property]));
+        if (index === 0 || index === 1 || index === 2) {
+          sums[index] = "";
+        } else if (!values.every((value) => isNaN(value))) {
+          sums[index] = values
+            .reduce((prev, curr) => {
+              const value = Number(curr);
+              if (!isNaN(value)) {
+                return prev + curr;
+              } else {
+                return prev;
+              }
+            }, 0)
+            ?.toFixed(2);
+          console.log(sums[index], index);
+        } else {
+          sums[index] = "N/A";
+        }
+      });
+
+      return sums;
+    },
+    // 事件格式化工具
+    formatTime(time) {
+      // typeof time === "string" ? (time = new Date(time)) : time;
+      return moment(time).format("YYYY-MM-DD");
+    },
+    // 设置新的列
+    getColumns() {
+      if (this.oldInventoryState == 2) {
+        this.columns = [
+          { prop: "productName", label: "品名" },
+          { prop: "productSpecifications", label: "规格" },
+          { prop: "productColor", label: "颜色" },
+          { prop: "orderWeight", label: "订单重量" },
+          { prop: "actualWeight", label: "实际出库重量" },
+          { prop: "actualBoxnum", label: "实际出库箱数" },
+        ];
+      } else {
+        this.columns = [
+          { prop: "productName", label: "品名" },
+          { prop: "productSpecifications", label: "规格" },
+          { prop: "productColor", label: "颜色" },
+          { prop: "lotNum", label: "批号" },
+          { prop: "levels", label: "等级" },
+          { prop: "grossWeight", label: "毛重" },
+          { prop: "suttle", label: "净重" },
+          { prop: "qrCode", label: "码单号" },
+          { prop: "boxNum", label: "箱号" },
+        ];
+      }
+      this.$nextTick(() => {
+        this.$refs.tableRef.doLayout();
+      });
+    },
+    // 获取出库详情
+    async getOutStockDetail(row, flag = true) {
+      //flag: true 零售  false 订单
+      console.log(row);
+      this.orderRow = row;
+      let { saleNo } = row;
+      this.row = row;
+      console.log(this.row.status, "ddddd");
+      try {
+        let payLoad = {
+          // ...this.queryParams,
+          saleNo: saleNo,
+        };
+        let fun = printOutsourceOrderList; //采用打印出库单的接口
+        if (row.oldInventoryState == 2 && !flag) {
+          fun = listOldRecord;
+        }
+        this.oldInventoryState = row.oldInventoryState;
+        this.getColumns();
+        let res = await fun(payLoad);
+        if (res.code == 200) {
+          this.getBatchOptions(res.data); //获取批号选项数据
+
+          this.tableData = res.data.map((item) => {
+            let productAmounts = 0;
+            if (Number(item.productUnitPrice) && Number(item.productNumber)) {
+              productAmounts = (
+                Number(item.productNumber) * Number(item.productUnitPrice)
+              ).toFixed(2);
+            }
+            return {
+              ...item,
+              children: [],
+              hasChildren: true,
+              productAmounts,
+            };
+          });
+          this.allTableData = JSON.parse(JSON.stringify(this.tableData));
+          this.batchChangeHandler(""); //默认显示当前批次数据
+        } else {
+          this.$message.error(res.msg);
+        }
+      } catch (error) {
+        console.log(error);
+      }
+    },
+    // 批次改变回调
+    batchChangeHandler(val) {
+      this.tableData = JSON.parse(
+        JSON.stringify(
+          this.allTableData.filter((v) => v.batchNumber == val) || []
+        )
+      );
+    },
+    // 获取批号选项数据
+    getBatchOptions(rows) {
+      let batchOptions = [];
+      rows.forEach((row) => {
+        if (
+          !batchOptions.find((item) => item.value == row.batchNumber)?.value
+        ) {
+          batchOptions.push({
+            value: row.batchNumber,
+            label: row.batchNumber,
+          });
+        }
+      });
+      batchOptions.push({
+        value: "",
+        label: "当前批次",
+      });
+      this.batchOptions = batchOptions;
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss"></style>