byte-sailing-mobile/src/views/procurementManagement/receipt/index.vue

<template>
  <van-nav-bar
    :title="$t('receipt.name')"
    left-text=""
    left-arrow
    @click-left="onClickLeft"
    @click-right="onClickRight"
  >
    <template #right> {{ $t("receipt.mergePurchase") }} </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="getList"
        style="margin-bottom: 60px"
      >
        <commonList
          :data="listData"
          @onClick="toDtl"
          :config="listConfig"
          :isCheckbox="true"
          @onCheck="handleSelectData"
          optionalKey="contractId"
        >
        </commonList>
      </van-list>
    </div>
  </van-pull-refresh>
</template>
<script setup>
import { ref, getCurrentInstance } from "vue";
import commonList from "@/components/common-list.vue";
import { showSuccessToast, showFailToast } from "vant";

const proxy = getCurrentInstance().proxy;
const onClickLeft = () => proxy.$router.push("/main/working");
const req = ref({
  pageNum: 1,
  keyword: null,
  status: "15",
});
const finished = ref(false);
const onRefresh = () => {
  req.value.pageNum = 1;
  finished.value = false;
  getList("refresh");
};
const loading = ref(false);
const listData = ref([]);
const statusData = ref([
  {
    label: "草稿",
    value: 0,
  },
  {
    label: "审批中",
    value: 10,
  },
  {
    label: "驳回",
    value: 20,
  },
  {
    label: "审批通过",
    value: 30,
  },
  {
    label: "终止",
    value: 99,
  },
]);
const payStatusData = ref([]);
const getDict = () => {
  proxy.getDictOne(["pay_status"]).then((res) => {
    payStatusData.value = res["pay_status"].data.map((x) => ({
      label: x.dictValue,
      value: x.dictKey,
    }));
  });
};
getDict();
const getList = (type) => {
  loading.value = true;
  proxy
    .post("/contractProduct/page", req.value)
    .then((res) => {
      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(() => {
      loading.value = false;
    });
};
const toDtl = (row) => {};
const onClickRight = () => {
  if (ids && ids.length > 0) {
    proxy.$router.push({
      path: "/main/processDtl",
      query: {
        isReceipt: true,
        flowKey: "purchase_flow",
        ids: JSON.stringify(ids),
        contractId: selectData.value[0].contractId,
      },
    });
  } else {
    return showFailToast(proxy.t("procureList.pleaseCheckTheData"));
  }
};
const listConfig = ref([
  {
    label: proxy.t("receipt.belongToCompany"),
    prop: "corporationName",
  },
  {
    label: proxy.t("receipt.contractCode"),
    prop: "contractCode",
  },
  {
    label: proxy.t("receipt.orderTime"),
    prop: "contractTime",
  },
  {
    label: proxy.t("receipt.productName"),
    prop: "productName",
  },
  {
    label: proxy.t("receipt.pendingProcessing"),
    prop: "expendQuantity",
  },
]);
let ids = [];
let selectData = ref([]);
const handleSelectData = (row) => {
  ids = [];
  selectData.value = row;
  row.map((i) => {
    ids.push(i.id);
  });
};
</script>

<style lang="scss" scoped>
.list {
  min-height: 70vh;
}
</style>