sd-new-vue/src/views/group/finance/summary/printOrder.vue

<template>
  <el-card v-loading="loading">
    <div style="text-align: center; font-size: 30px; padding: 8px; font-weight: 700">{{ props.rowData.departmentName }}-胜德体育对账单</div>
    <div style="text-align: center; font-size: 18px; padding-bottom: 8px; font-weight: 700">( 对账时间: {{ props.rowData.dimensionality }} )</div>
    <div style="height: calc(100vh - 264px - 88px); overflow-y: auto; overflow-x: hidden">
      <el-auto-resizer>
        <template #default="{ height, width }">
          <el-table-v2 :columns="columns" :data="tableData" :width="width" :height="height" fixed :cache="20" :header-height="35" :row-height="35">
            <template #row="props">
              <Row v-bind="props" />
            </template>
          </el-table-v2>
        </template>
      </el-auto-resizer>
    </div>
    <div style="padding: 8px; text-align: center">
      <el-button @click="clickCancel" size="large">关 闭</el-button>
      <el-button type="primary" @click="deriveExcel()" size="large" v-preReClick>导 出</el-button>
    </div>
  </el-card>
</template>

<script setup>
import { cloneVNode } from "vue";

const { proxy } = getCurrentInstance();
const props = defineProps({
  rowData: Object,
});
const loading = ref(false);
const tableData = ref([]);
const getAggregate = (data) => {
  let total = 0;
  if (data && data.length > 0) {
    for (let i = 0; i < data.length; i++) {
      if (data[i].total) {
        total = Number(Math.round((total + data[i].total) * 100) / 100);
      }
    }
  }
  return total;
};
onMounted(() => {
  if (props.rowData && props.rowData.idGroupConcat) {
    loading.value = true;
    proxy.post("/statementOfAccountMerge/getDocumentByOrder", { idGroupConcat: props.rowData.idGroupConcat }).then(
      (res) => {
        let total = getAggregate(proxy.deepClone(res));
        let list = [];
        if (res && res.length > 0) {
          for (let i = 0; i < res.length; i++) {
            if (res[i].skuSpecList && res[i].skuSpecList.length > 0) {
              for (let j = 0; j < res[i].skuSpecList.length; j++) {
                if (res[i].skuSpecList[j].bomSpecList && res[i].skuSpecList[j].bomSpecList.length > 0) {
                  for (let y = 0; y < res[i].skuSpecList[j].bomSpecList.length; y++) {
                    let indexOne = 0;
                    if (j === 0 && y === 0) {
                      for (let z = 0; z < res[i].skuSpecList.length; z++) {
                        if (res[i].skuSpecList[z].bomSpecList && res[i].skuSpecList[z].bomSpecList.length > 0) {
                          indexOne = Number(indexOne + res[i].skuSpecList[z].bomSpecList.length);
                        }
                      }
                    }
                    let indexTwo = 0;
                    if (y === 0) {
                      indexTwo = res[i].skuSpecList[j].bomSpecList.length;
                    }
                    list.push({
                      wlnCreateTime: res[i].wlnCreateTime,
                      code: res[i].code,
                      wlnCode: res[i].wlnCode,
                      skuSpecCode: res[i].skuSpecList[j].skuSpecCode,
                      skuSpecName: res[i].skuSpecList[j].skuSpecName,
                      quantitySKU: res[i].skuSpecList[j].quantity,
                      subtotal: res[i].skuSpecList[j].subtotal,
                      bomSpecCode: res[i].skuSpecList[j].bomSpecList[y].bomSpecCode,
                      bomSpecName: res[i].skuSpecList[j].bomSpecList[y].bomSpecName,
                      quantityBOM: res[i].skuSpecList[j].bomSpecList[y].quantity,
                      unitPriceBOM: res[i].skuSpecList[j].bomSpecList[y].unitPrice,
                      laserLogoSummary: res[i].skuSpecList[j].bomSpecList[y].laserLogoSummary,
                      laserMitochondrialSummary: res[i].skuSpecList[j].bomSpecList[y].laserMitochondrialSummary,
                      lssueFeeSummary: res[i].skuSpecList[j].bomSpecList[y].lssueFeeSummary,
                      deliveryMaterialsFeeSummary: res[i].skuSpecList[j].bomSpecList[y].deliveryMaterialsFeeSummary,
                      packingLaborSummary: res[i].skuSpecList[j].bomSpecList[y].packingLaborSummary,
                      managementFeeSummary: res[i].skuSpecList[j].bomSpecList[y].managementFeeSummary,
                      unitPriceSKU: res[i].skuSpecList[j].unitPrice,
                      outerBoxPackingFee: res[i].outerBoxPackingFee,
                      total: res[i].total,
                      indexOne: indexOne,
                      indexTwo: indexTwo,
                    });
                  }
                }
              }
            }
          }
        }
        list.push({
          indexOne: 1,
          indexTwo: 1,
          total: total,
          wlnCreateTime: "总计:",
        });
        tableData.value = Object.freeze(list);
        loading.value = false;
      },
      (err) => {
        console.log(err);
        loading.value = false;
      }
    );
  }
});
const emit = defineEmits(["clickCancel"]);
const clickCancel = () => {
  emit("clickCancel", "");
};
const deriveExcel = () => {
  proxy
    .getFile("/statementOfAccountMerge/exportDocumentByOrder", {
      idGroupConcat: props.rowData.idGroupConcat,
      departmentName: props.rowData.departmentName,
      beginDate: props.rowData.dimensionality,
    })
    .then((res) => {
      proxy.downloadFile(res, "订单对账单.xlsx");
    });
};
const columns = computed(() => {
  return [
    {
      dataKey: "wlnCreateTime",
      key: "column-0",
      title: "订单时间",
      width: 150,
      rowIndex: 1,
    },
    {
      dataKey: "code",
      key: "column-1",
      title: "订单号",
      width: 160,
    },
    {
      dataKey: "wlnCode",
      key: "column-2",
      title: "万里牛单号",
      width: 140,
    },
    {
      dataKey: "skuSpecCode",
      key: "column-3",
      title: "SKU品号",
      width: 140,
    },
    {
      dataKey: "skuSpecName",
      key: "column-4",
      title: "SKU品名",
      width: 220,
    },
    {
      dataKey: "quantitySKU",
      key: "column-5",
      title: "SKU数量",
      width: 80,
    },
    {
      dataKey: "bomSpecCode",
      key: "column-6",
      title: "BOM品号",
      width: 140,
    },
    {
      dataKey: "bomSpecName",
      key: "column-7",
      title: "BOM品名",
      width: 260,
    },
    {
      dataKey: "quantityBOM",
      key: "column-8",
      title: "BOM数量",
      width: 80,
    },
    {
      dataKey: "unitPriceBOM",
      key: "column-9",
      title: "单价",
      width: 100,
    },
    {
      dataKey: "laserLogoSummary",
      key: "column-10",
      title: "激光LOGO",
      width: 100,
    },
    {
      dataKey: "laserMitochondrialSummary",
      key: "column-11",
      title: "激光体位线",
      width: 100,
    },
    {
      dataKey: "lssueFeeSummary",
      key: "column-12",
      title: "代发费",
      width: 100,
    },
    {
      dataKey: "deliveryMaterialsFeeSummary",
      key: "column-13",
      title: "快递包材费",
      width: 100,
    },
    {
      dataKey: "packingLaborSummary",
      key: "column-14",
      title: "包装人工费",
      width: 100,
    },
    {
      dataKey: "managementFeeSummary",
      key: "column-15",
      title: "管理费",
      width: 100,
    },
    {
      dataKey: "unitPriceSKU",
      key: "column-16",
      title: "SKU单价",
      width: 100,
    },
    {
      dataKey: "subtotal",
      key: "column-17",
      title: "小计",
      width: 120,
    },
    {
      dataKey: "total",
      key: "column-18",
      title: "合计",
      width: 120,
    },
  ];
});
const mergeColumnOne = [0, 1, 2, 18];
const mergeColumnTwo = [3, 4, 5, 16, 17];
const Row = ({ rowData, cells }) => {
  if (rowData.indexOne > 1) {
    for (let i = 0; i < mergeColumnOne.length; i++) {
      const cell = cells[mergeColumnOne[i]];
      const style = {
        ...cell.props.style,
        backgroundColor: "#fff",
        height: `${rowData.indexOne * 35 - 1}px`,
        alignSelf: "flex-start",
        zIndex: 1,
      };
      cells[mergeColumnOne[i]] = cloneVNode(cell, { style });
    }
  }
  if (rowData.indexTwo > 1) {
    for (let i = 0; i < mergeColumnTwo.length; i++) {
      const cell = cells[mergeColumnTwo[i]];
      const style = {
        ...cell.props.style,
        backgroundColor: "#fff",
        height: `${rowData.indexTwo * 35 - 1}px`,
        alignSelf: "flex-start",
        zIndex: 1,
      };
      cells[mergeColumnTwo[i]] = cloneVNode(cell, { style });
    }
  }
  return cells;
};
</script>

<style lang="scss" scoped>
::v-deep(.el-table-v2__header-cell) {
  background-color: #eeeeee !important;
}
</style>