<!-- 功能库房 -待索取  -->
<template>
  <div class="tab0">
    <!-- 商品详情 -->
    <itemDetail ref="detailItem" :itemId="itemId" />
    <p-grid-form ref="search" :span="8" :label-col="{ span: 9 }" :items="items0" @submit="handlerSubmit" />
    <p-table
      :columns="columns"
      :data-source="data"
      :has-row-count="true"
      rowKey="pickTaskDId"
      auto-width
      dragle
      rowSelectFixed
      :scroll="{ x: true }"
      :rowSelectType="2"
      hasRowSelectCheck
      :loading="loading"
      bordered
    >
      <!-- @change='paginationChange'
      :pagination='pagination' -->
      <template slot="printStatus" slot-scope="text"> {{ text == "1" ? "已打印" : "未打印" }}</template>
      <template slot="status" slot-scope="text, rows, index">
        {{ text | statusFilter }}
      </template>
      <template v-slot:operation="text, rows, index">
        <a @click="checkItem(rows)">详情</a>
      </template>
    </p-table>
  </div>
</template>

<script>
// 商品详情
import itemDetail from "@/views/kzyWMS/components/itemDetail";
import { sorter } from "@/views/kzyWMS/utils/sort.js";
// 设置默认仓库
import { setwarehouse } from "@/views/kzyWMS/SearchModal/mixins_warehouse.js";
import { items0, columns } from "../config/stockPicking.js";
import { page_waitpicktask } from "../../config/api.js";

export default {
  components: { itemDetail },
  mixins: [setwarehouse],
  filters: {
    statusFilter(value) {
      if (value === "0") return "待拣选";
      if (value === "1") return "待确认";
      if (value === "2") return "待复核";
      if (value === "3") return "已完成";
      return "";
    },
  },
  data() {
    return {
      columns: sorter(columns),
      items0: items0(this),
      data: [],
      itemId: null,
      loading: false,
      pagination: {
        total: 0,
        pageSize: 10, //每页中显示10条数据
        current: 1,
        showSizeChanger: true,
        pageSizeOptions: ["10", "15", "20"], //每页中显示的数据
        showTotal: (total) => `共有 ${total} 条数据`, //分页中显示总的数据
      },
    };
  },
  methods: {
    getData(params) {
      params = {
        pageNum: this.pagination.current, // 当前页码
        pageSize: this.pagination.pageSize, // 每页数量
        ...params,
      };
      this.loading = true;
      page_waitpicktask(params)
        .then((res) => {
          if (res.success) {
            this.data = res.data.list;
            // 扫描监管码数据
            // this.$emit('emitData',[...this.data]);
            this.pagination.total = Number(res.data.totalCount);
          } else {
            this.$exception(res);
          }
        })
        .finally(() => {
          this.loading = false;
        });
    },
    paginationChange(pagination) {
      this.pagination = pagination;
      this.pagination.pageNum = pagination.current;
      this.getData({ pickTaskType: 2, ...this.$refs.search.form.getFieldsValue() });
    },
    // 索取 提交
    handlerSubmit(event, form) {
      event.preventDefault();
      // console.log("getFieldsValue:",form.getFieldsValue());
      // this.getData(form.getFieldsValue())
      this.$refs.search.form.validateFields((err, values) => {
        if (!err) {
          console.log("验证通过: ", values);
          this.getData(values);
        }
      });
    },
    // 重置
    hanlderRest(event, form) {
      this.$refs.search.form.resetFields();
    },
    // 商品详情
    checkItem(item) {
      this.itemId = item.itemId;
      this.$refs.detailItem.open();
    },
  }, //methods
  mounted() {
    this.$refs.search.form.setFieldsValue({ pickTaskType: "2" });
    for (let index in this.columns) {
      if (this.columns[index].dataIndex == "saleRedQty") {
        this.columns[index].hidden = true;
        console.log("找到的红冲数量字段隐藏：", this.columns[index]);
      }
    }

    // 	待索取任务分页查询(整件/功能库房)：
    // "pickTaskType", value = "任务类型（0-整件/2-整散合一）
    // this.getData({pickTaskType:2});
    // this.getData({pickTaskType:2,...this.$refs.search.form.getFieldsValue()});
  },
};
</script>

<style scoped="scoped" lang="less">
.tab0 {
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;

  ::v-deep {
    .className {
      .ant-table-column-title {
        color: #2b80ff;
      }
    }

    .ant-btn {
      border-radius: 2px;
    }

    .p-table-edit .ant-table-body {
      min-height: 0;
    }

    .p-table-edit .ant-table-body ~ .ant-table-placeholder {
      min-height: 150px;
    }
  }
}
</style>
