<template>
  <navbar-back title="样品调拨"></navbar-back>
  <view class="p8">
    <up-subsection
      activeColor="#0055A2"
      mode="subsection"
      :list="list"
      :current="current"
      @change="changeTab"
    ></up-subsection>
    <scroll-view style="height: 82vh" scroll-y scroll-with-animation @scrolltolower="handleScrolltolower">
      <view class="data-item" v-for="(item, index) in listData" @click="handleDetail(item)">
        <view
          >申请人：<text class="pl20">{{ item.applyUser }}</text></view
        >
        <view
          >申请时间：<text>{{ nx.$dayjs(item.applyTime).format('YYYY-MM-DD HH:mm:ss') }}</text></view
        >
        <view
          >申请事由：<text>{{ item.applyContent }}</text></view
        >
      </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 { ref, computed } from 'vue'
import { useListData } from '@/nx/hooks/usePageListData'
import nx from '@/nx'

const list = ref(['待处理', '已处理'])

let dataList = ref([])
const current = ref(0)

function changeTab(index) {
  current.value = index
  getInitData()
}
const searchParams = computed(() => {
  if (current.value === 0) {
    return {
      finishStatus: 'pending'
    }
  } else {
    return {
      finishStatus: 'completed'
    }
  }
})
const { listData, scrollToLower, loadStatus, getInitData } = useListData({
  searchParams,
  api: nx.$api.sampleWarehouse.querySampleDispatchApply,
  needInitListData: true
})

function handleScrolltolower() {
  scrollToLower()
}
function handleDetail(item) {
  nx.$store('biz').flagInfo = item
  uni.navigateTo({
    url: '/pages/sampleWarehouse/sampleDispatchExternal/detail'
  })
}
</script>

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