<template>
  <van-nav-bar :title="'入库多货明细'" left-text="" left-arrow @click-left="onClickLeft">
    <!-- <template #right> 添加 </template> -->
  </van-nav-bar>
  <van-search v-model="req.keyword" :placeholder="$t('common.pleaseEnterKeywords')" @search="onRefresh" />
  <van-pull-refresh v-model="loading" @refresh="onRefresh">
    <div class="list">
      <van-list v-model:loading="loading" :finished="finished" :finished-text="$t('common.noMore')" @load="onLoad" style="margin-bottom: 60px">
        <commonList :data="listData" @onClick="toDtl" :config="listConfig" :showMore="false">
          <template #businessType="{row}">
            <div style="width:100%">
              {{dictValueLabel(row.businessType,businessType)}}
            </div>
          </template>
          <template #logistics="{row}">
            <div style="width:100%">
              {{ row.logisticsCompanyName }} (
              <span style="cursor: pointer; color: #409eff"> {{ row.logisticsCode }} </span>
              )
            </div>
          </template>

          <template #processingMethod="{row}">
            <div style="width:100%">
              <span> {{dictValueLabel(row.processingMethod,statusData)}}</span>
            </div>
          </template>

        </commonList>
        <div></div>
      </van-list>
    </div>
  </van-pull-refresh>
</template>
<script setup>
import { ref, getCurrentInstance, onMounted } from "vue";
import commonList from "@/components/common-list.vue";
import { useRoute } from "vue-router";
import { showSuccessToast, showConfirmDialog } from "vant";

const loading = ref(false);
const router = useRoute();
const req = ref({
  pageNum: 1,
  keyword: null,
});
const finished = ref(false);
const proxy = getCurrentInstance().proxy;
const listData = ref([]);

const listConfig = ref([
  {
    label: "入库单",
    prop: "businessCode",
  },
  {
    type: "slot",
    slotName: "logistics",
    label: "物流/快递信息",
  },
  {
    label: "物品编码",
    prop: "productCustomCode",
  },
  {
    label: "物品名称",
    prop: "productName",
  },
  {
    label: "物品规格",
    prop: "productSpec",
  },
  {
    label: "数量",
    prop: "quantity",
  },
  {
    type: "slot",
    slotName: "processingMethod",
    label: "处理结果",
  },
]);
const onRefresh = () => {
  req.value.pageNum = 1;
  finished.value = false;
  getList("refresh");
};
const onLoad = () => {
  getList();
};

const onClickLeft = () => proxy.$router.push("/main/working");

const onClickRight = () => {
  proxy.$router.push("/main/manualInboundAdd");
};

const toDtl = (row) => {
  return;
  proxy.$router.push({
    path: "waitInboundAdd",
    query: {
      id: row.id,
    },
  });
};
const businessType = ref([
  { label: "线边回仓", value: "1" },
  { label: "完工入库", value: "2" },
  { label: "采购到货", value: "3" },
  { label: "退货出库", value: "4" },
]);

const statusData = ref([
  {
    label: "未处理",
    value: "0",
  },
  {
    label: "退货",
    value: "10",
  },
  {
    label: "入库",
    value: "20",
  },
  {
    label: "申购",
    value: "30",
  },
]);

const getList = (type) => {
  loading.value = true;
  proxy
    .post("/excessGoodsDetails/page", req.value)
    .then((res) => {
      // res.data.rows = res.data.rows.map((x) => ({
      //   ...x,
      //   ...JSON.parse(x.victoriatouristJson),
      // }));
      listData.value =
        type === "refresh"
          ? res.data.rows
          : listData.value.concat(res.data.rows);
      if (req.value.pageNum * 10 >= res.data.total) {
        finished.value = true;
      }
      req.value.pageNum++;
      loading.value = false;
    })
    .catch((err) => {
      loading.value = false;
    });
};
getList();

const handleEndInbound = (row) => {
  showConfirmDialog({
    title: "提示",
    message: `您确定结束入库吗?`,
  })
    .then(() => {
      proxy
        .post("/stockWait/endInStock", {
          id: row.id,
        })
        .then((res) => {
          showSuccessToast("操作成功");
          onRefresh();
        });
    })
    .catch(() => {
      return;
    });
};
</script>

<style lang="scss" scoped>
.list {
  min-height: 70vh;
}
.aa {
  background: #fa9841;
  border-radius: 2px;
  color: #fff;
  padding: 4px;
}
</style>