<template>
  <navbar-back title="盘点明细"></navbar-back>
  <uni-section type="line" :title="checkItemInfo.name" titleFontSize="15px"> </uni-section>
  <view class="p4">
    <scroll-view style="height: 85vh" scroll-y scroll-with-animation @scrolltolower="handleScrolltolower">
      <view class="x-bc border-b" v-for="(item, index) in listData">
        <view class="data-item">
          <view
            >批次号：<text>{{ item.batchNo }}</text></view
          >
          <view
            >物料编号：<text>{{ item.infomationCode }}</text></view
          >
          <view
            >存放位置：<text>{{ item.locationCode }}</text></view
          >
        </view>
        <u-icon v-if="item.present" class="mark"  size="30" color="#5ac725" name="checkbox-mark"></u-icon>
      </view>
      <up-loadmore v-if="listData.length > 0" :status="loadStatus" />
      <up-empty v-else mode="data" text="暂无数据" marginTop="50"> </up-empty>
    </scroll-view>
  </view>
</template>

<script setup>
import { computed, ref, watch } from 'vue'
import { onLoad, onShow } from '@dcloudio/uni-app'
import { useListData } from '@/nx/hooks/usePageListData'
import nx from '@/nx'
let checkItemInfo = ref({})
const searchParams = computed(() => {
  return {
    checkId: checkItemInfo.value. checkId,
    itemId: checkItemInfo.value.itemId
  }
})
const { listData, scrollToLower, loadStatus, getInitData } = useListData({
  searchParams,
  api: nx.$api.material.inventoryCheckDetails
})
function handleScrolltolower() {
  scrollToLower()
}
onLoad(async options => {
  checkItemInfo.value.itemId = options.itemId
  checkItemInfo.value.checkId = options.checkId
  checkItemInfo.value.name = options.name
  getInitData()
})
</script>

<style lang="scss" scoped>
.data-item {
  padding: 8px;
  border-bottom: 1px solid #eee;
  color: #909399;
  text {
    color: #000;
  }
  
}
</style>
