<template>
  <div class="moonCakePostReport">
    <!-- <div class="title">业绩达成报表(含退货)-产品确认单</div> -->
    <!-- stripe -->
    <el-table
      :data="tableData"
      v-loading="loading"
      border
      :max-height="maxHeight"
      :size="'mini'"
      style="width: 100%"
    >
      <el-table-column prop="itemName" label="部门" fixed="left" min-width="120">
      </el-table-column>
      <el-table-column prop="sale_price" label="价格(元)" min-width="120">
      </el-table-column>

      <el-table-column show-overflow-tooltip label="备库数量" min-width="60">
        <template slot-scope="scope">
          <span>{{ scope.row.num | toThousandFilter }}</span>
        </template>
      </el-table-column>

      <el-table-column show-overflow-tooltip label="金额(万元)" min-width="120">
        <template slot-scope="scope">
          <span>{{ scope.row.total | toThousandFilter }}</span>
        </template>
      </el-table-column>
      <el-table-column show-overflow-tooltip label="剩余库存数量" min-width="120">
        <template slot-scope="scope">
          <span>{{ scope.row.usable_stock | toThousandFilter }}</span>
        </template>
      </el-table-column>
      <el-table-column show-overflow-tooltip prop="spuCode" label="商品编号" fixed="left" min-width="160" />
      <el-table-column show-overflow-tooltip prop="good_name" label="商品名称" fixed="left" min-width="120" />
    </el-table>
  </div>
</template>

<script>
import asyncRequest from "@/api/index";
import setHeight from "@/mixins/index";
export default {
  name: "moonCakePostReport",
  mixins: [setHeight],
  watch: {
    date: function (val) {
      this.dataTime = val;
      if (val) {
        this.searchList();
      }
    },
  },
  data() {
    return {
      dataTime: this.date,
      loading: false,
      maxHeight: "0",
      tableData: [],
    };
  },
  async created() {
    window.onresize = () => {
      this.getHeight();
    };
  },
  mounted() {
    this.$nextTick(() => {
      this.getHeight();
    });
    this.searchList();
  },
  methods: {
    async searchList() {
      this.loading = true;
      this.tableData = [];
      const { code, data } = await asyncRequest.bkreport({});
      if (code === 0) {
        this.tableData = data;
      } else {
        this.tableData = [];
      }
      this.getHeight();
      this.loading = false;
    },
  },
};
</script>

<style lang="scss" scoped>
.moonCakePostReport {
}
</style>
