<template>
  <div>
    <!-- 列表 -->
    <el-table
      v-loading="loading"
      :data="list"
      show-summary
      :summary-method="getSummaries"
      border
    >
      <el-table-column
        label="单据编号"
        align="center"
        prop="returnNo"
        min-width="130"
        show-overflow-tooltip
        fixed="left"
      />
      <el-table-column
        label="退料方式"
        align="center"
        prop="returnWay"
        width="100"
      >
        <!-- <template #default="{ row }">
          <dict-tag :type="DICT_TYPE.RETURN_WAY" :value="row.returnWay" />
        </template> -->
      </el-table-column>
      <el-table-column
        label="退料类型"
        align="center"
        prop="returnType"
        width="100"
      >
        <!-- <template #default="{ row }">
          <dict-tag :type="DICT_TYPE.RETURN_TYPE" :value="row.returnType" />
        </template> -->
      </el-table-column>
      <el-table-column
        label="部门编号"
        align="center"
        prop="departmentNo"
        width="100"
      />
      <el-table-column
        label="部门名称"
        align="center"
        prop="departmentName"
        width="110"
        show-overflow-tooltip
      />
      <el-table-column
        label="备注"
        align="center"
        prop="note"
        width="120"
        show-overflow-tooltip
      />
      <el-table-column
        label="退料时间"
        align="center"
        prop="returnTime"
        width="170"
      >
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.returnTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="源单编号"
        align="center"
        prop="parentNo"
        width="100"
      />

      <el-table-column
        label="操作人"
        align="center"
        prop="creator"
        width="100"
      />
      <el-table-column
        label="数量"
        align="center"
        prop="qty"
        width="80"
        show-overflow-tooltip
      />
      <el-table-column
        label="客户"
        align="center"
        prop="customer"
        width="120"
        show-overflow-tooltip
      />
      <el-table-column
        label="库存组织"
        align="center"
        prop="storageOrganization"
        width="100"
        show-overflow-tooltip
      />
      <el-table-column
        label="物料名称"
        align="center"
        prop="materialName"
        width="100"
        show-overflow-tooltip
      />
      <el-table-column
        label="物料编码"
        align="center"
        prop="materialCode"
        width="110"
        show-overflow-tooltip
      />
      <el-table-column
        label="条码"
        align="center"
        prop="qrCode"
        min-width="120"
        show-overflow-tooltip
      />
      <el-table-column
        label="创建时间"
        align="center"
        prop="createTime"
        width="170"
      >
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.createTime) }}</span>
        </template>
      </el-table-column>
    </el-table>

    <!-- 分页组件 -->
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNo"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
  </div>
</template>

<script>
import { getOutSourceReturnPage } from "@/api/wms/base/outSourceReturn";
import OtherIssue from "./OtherIssue.vue";

export default {
  name: "OtherIssueDocument",
  components: {
    OtherIssue,
  },
  inject: ["paramsQuery"],
  data() {
    return {
      // 遮罩层
      loading: true,
      // 总条数
      total: 0,
      // 列表
      list: [],
      // 查询参数
      queryParams: {
        pageNo: 1,
        pageSize: 10,
        type: null,
        materialNo: null,
        qty: null,
        createTime: [],
      },
      // 高级
      advParams: {},
    };
  },
  created() {
    this.getList();
  },
  methods: {
    /** 查询列表 */
    getList() {
      this.loading = true;
      // 执行查询
      const params = {
        ...this.queryParams,
        ...this.paramsQuery,
        ...this.advParams,
      };
      getOutSourceReturnPage(params)
        .then((response) => {
          this.list = response.data.list;
          this.total = response.data.total;
        })
        .finally(() => {
          this.loading = false;
        });
    },

    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNo = 1;
      this.getList();
    },
    // 小数点问题处理
    getHandleNumber(val) {
      return Math.round(parseFloat(val) * 100000000) / 100000000;
    },
    // 总计
    getSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "总计";
          return;
        }

        const values = data.map((item) => Number(item[column.property]));
        if (column.property === "qty") {
          sums[index] = values.reduce((acc, cur) => {
            const value = Number(cur);
            if (!isNaN(value)) {
              return this.getHandleNumber(acc + cur);
            } else {
              return acc;
            }
          }, 0);
          sums[index];
        }
      });
      return sums;
    },
    // 出库发料
    handleIssue() {
      this.$refs.otherIssue.open = true;
    },
  },
};
</script>
