sfms3.0-uniapp/src/pages/query/pack.vue

<!-- 基于z-paging封装个性化分页组件演示(vue) -->
<template>
  <view class="uni-flex" style="flex-direction: column">
    <itemFilter ref="filter" @onConfirmClick="confirm"> </itemFilter>
    <view class="top" style="">
      <com-blank-view @goScan="openScanPopup" v-if="packingNumber == ''"></com-blank-view>
      <z-tabs v-if="packingNumber" :list="tabList" @change="tabChange" />
    </view>

    <view style="padding-top: 100rpx; width: 100%">
      <view v-if="totalCount > 0" style="margin: 10rpx; font-size: 35rpx; font-weight: bold">总数 : {{ totalCount }} </view>
      <view v-for="(item, index) in dataList" style="width: 100%" :key="index">
        <view class="uni-flex uni-row" style="align-items: center; background-color: #fff; border-radius: 10rpx; margin: 10rpx">
          <view class="" style="font-size: 35rpx"> ({{ index + 1 }}) </view>
          <comPackDetailCard :isShowPack="false" :dataContent="item" style="margin: 10rpx"> </comPackDetailCard>
        </view>
      </view>
      <uni-load-more :status="loadingType" v-if="dataList.length > 0" />
    </view>

    <win-scan-button @goScan="openScanPopup" v-if="packingNumber != ''"></win-scan-button>

    <win-scan-pack ref="scanPopup" @getResult="getScanResult" headerType="HPQ,HMQ"></win-scan-pack>
    <com-message ref="comMessageRef" />
  </view>
</template>

<script setup lang="ts">
import { ref, getCurrentInstance, nextTick, onMounted, watch } from 'vue'
import { onLoad, onShow, onNavigationBarButtonTap, onReady, onBackPress, onReachBottom, onPullDownRefresh } from '@dcloudio/uni-app'
import { getExpectoutByItemcode, getExpectinByItemcode, getBalanceByItemCode, getBasicItemByCode, getBalanceSummary } from '@/api/request2.js'
import { goHome } from '@/common/basic.js'
import itemInfo from '@/mycomponents/item/itemInfo.vue'
import comBlankView from '@/mycomponents/common/comBlankView.vue'
import winScanPack from '@/mycomponents/scan/winScanPack.vue'
import winScanButton from '@/mycomponents/scan/winScanButton.vue'
import comPackDetailCard from '@/pages/query/coms/comPackDetailCard.vue'
import itemFilter from '@/mycomponents/item/itemFilter.vue'
import comEmptyView from '@/mycomponents/common/comEmptyView.vue'

const dataList = ref([])
const tabList = ref(['库存余额', '预计出'])
const tabIndex = ref(0)
const packingNumber = ref('')
const itemDetail = ref(undefined)
const balances = ref([])
const loadingType = ref('nomore')
const totalCount = ref(0)
const locationCode = ref('')
const inventoryStatus = ref('')
const pageSize = ref(10)
const filter = ref()
const paging = ref()
const scanPopup = ref()
const comMessageRef = ref()

// 返回首页
onNavigationBarButtonTap((e) => {
  if (e.index === 0) {
    goHome()
  } else if (e.index == 1) {
    filter.value.openFilter()
  }
})

onReachBottom(() => {
  console.log('底部')
  // 避免多次触发
  if (loadingType.value == 'loading' || loadingType.value == 'nomore') {
    return
  }
  getContentByTab(tabIndex.value, pageNo.value, pageSize.value, 'more')
})
onLoad((option) => {
  uni.setNavigationBarTitle({
    title: option.title
  })
})
onMounted(() => {
  openScanPopup()
})
onPullDownRefresh(() => {
  getContentByTab(tabIndex.value, pageNo.value, pageSize.value, 'refresh')
})
const openScanPopup = () => {
  scanPopup.value.openScanPopup()
}
const closeScanPopup = () => {
  scanPopup.value.closeScanPopup()
}
const getScanResult = (result) => {
  if (!result.label.packingNumber) {
    showMessage('包装号不能为空')
    return
  }
  packingNumber.value = result.label.packingNumber
  closeScanPopup()
  tabChange(0)
}
const getItemInfo = (code) => {
  uni.showLoading({
    title: '正在查询物料信息...',
    mask: true
  })

  getBasicItemByCode(code)
    .then((res) => {
      uni.hideLoading()
      if (res.data.list.length > 0) {
        closeScanPopup()
        packingNumber.value = res.data.list[0].code
        itemDetail.value = res.data.list[0]
        tabChange(0)
      } else {
        showMessage(`未查找到物料【${code}】`)
      }
    })
    .catch((error) => {
      uni.hideLoading()
      packingNumber.value = ''
      showMessage(error)
    })
}

// 汇总

const getSummary = (pageNo, pageSize, type) => {
  uni.showLoading({
    title: '加载中...',
    mask: true
  })
  loadingType.value = 'loading'
  if (type === 'refresh') {
    pageNo.value = 1
    dataList.value = []
  }

  const filters = []
  filters.push({
    column: 'packingNumber',
    action: '==',
    value: packingNumber.value
  })
  if (locationCode.value) {
    filters.push({
      column: 'locationCode',
      action: '==',
      value: locationCode.value
    })
  }

  if (inventoryStatus.value) {
    filters.push({
      column: 'inventoryStatus',
      action: 'in',
      value: inventoryStatus.value
    })
  }

  const params = {
    filters,
    pageNo: pageNo.value,
    pageSize,
    sorts:[{sort:"createTime",by:"ASC"},{sort:"locationCode",by:"ASC"} ,{sort:"id",by:"DESC"}]
  }
  getBalanceByItemCode(params)
    .then((res) => {
      uni.hideLoading()

      if (type === 'refresh') {
        uni.stopPullDownRefresh()
      }
      const { list } = res.data
      totalCount.value = res.data.total
      loadingType.value = 'loadmore'
      if (list == null || list.length == 0) {
        loadingType.value = 'nomore'
        return
      }

      dataList.value = type === 'refresh' ? list : dataList.value.concat(list)
      pageNo.value++
    })
    .catch((error) => {
      paging.value.complete(false)
      uni.hideLoading()
      showMessage(error)
    })
}
// 明细

const getDetailList = (pageNo, pageSize, type) => {
  uni.showLoading({
    title: '加载中...',
    mask: true
  })
  loadingType.value = 'loading'
  if (type === 'refresh') {
    pageNo.value = 1
    dataList.value = []
  }

  const filters = []
  filters.push({
    column: 'packingNumber',
    action: '==',
    value: packingNumber.value
  })
  if (locationCode.value) {
    filters.push({
      column: 'locationCode',
      action: '==',
      value: locationCode.value
    })
  }

  if (inventoryStatus.value) {
    filters.push({
      column: 'inventoryStatus',
      action: 'in',
      value: inventoryStatus.value
    })
  }

  const params = {
    filters,
    pageNo: pageNo.value,
    pageSize,
    sorts:[{sort:"createTime",by:"ASC"},{sort:"locationCode",by:"ASC"} ,{sort:"id",by:"DESC"}]
  }
  getBalanceByItemCode(params)
    .then((res) => {
      uni.hideLoading()

      if (type === 'refresh') {
        uni.stopPullDownRefresh()
      }
      const { list } = res.data
      totalCount.value = res.data.total
      loadingType.value = 'loadmore'
      if (list == null || list.length == 0) {
        loadingType.value = 'nomore'
        return
      }
      dataList.value = type === 'refresh' ? list : dataList.value.concat(list)
      pageNo.value++
    })
    .catch((error) => {
      uni.hideLoading()
      showMessage(error)
    })
}

const getContentByTab = (index, pageNo, pageSize, type) => {
  if (index === 0) getDetailList(pageNo, pageSize, type)
  else if (index === 1) getExpectout(pageNo, pageSize, type)
  else if (index === 2) {
    // this.getExpectout(pageNo, pageSize, type);
  }
}
// 预计入

const getExpectin = (pageNo, pageSize, type) => {
  uni.showLoading({
    title: '加载中...',
    mask: true
  })

  loadingType.value = 'loading'
  if (type === 'refresh') {
    pageNo.value = 1
    dataList.value = []
  }

  const filters = []
  filters.push({
    column: 'packingNumber',
    action: '==',
    value: packingNumber.value
  })
  if (locationCode.value) {
    filters.push({
      column: 'locationCode',
      action: '==',
      value: locationCode.value
    })
  }

  if (inventoryStatus.value) {
    filters.push({
      column: 'inventoryStatus',
      action: 'in',
      value: inventoryStatus.value
    })
  }

  const params = {
    filters,
    pageNo: pageNo.value,
    pageSize
  }
  getExpectinByItemcode(params)
    .then((res) => {
      uni.hideLoading()

      if (type === 'refresh') {
        uni.stopPullDownRefresh()
      }
      const { list } = res.data
      totalCount.value = res.data.total
      loadingType.value = 'loadmore'
      if (list == null || list.length == 0) {
        loadingType.value = 'nomore'
        return
      }
      dataList.value = type === 'refresh' ? list : dataList.value.concat(list)
      pageNo.value++
    })
    .catch((error) => {
      uni.hideLoading()
      showMessage(error)
    })
}

// 预计出

const getExpectout = (pageNo, pageSize, type) => {
  uni.showLoading({
    title: '加载中...',
    mask: true
  })

  loadingType.value = 'loading'
  if (type === 'refresh') {
    pageNo.value = 1
    dataList.value = []
  }

  const filters = []
  filters.push({
    column: 'packingNumber',
    action: '==',
    value: packingNumber.value
  })
  if (locationCode.value) {
    filters.push({
      column: 'locationCode',
      action: '==',
      value: locationCode.value
    })
  }

  if (inventoryStatus.value) {
    filters.push({
      column: 'inventoryStatus',
      action: 'in',
      value: inventoryStatus.value
    })
  }

  const params = {
    filters,
    pageNo: pageNo.value,
    pageSize,
    sorts:[{sort:"createTime",by:"ASC"},{sort:"locationCode",by:"ASC"} ,{sort:"id",by:"DESC"}]
  }
  getExpectoutByItemcode(params)
    .then((res) => {
      uni.hideLoading()
      if (type === 'refresh') {
        uni.stopPullDownRefresh()
      }
      const { list } = res.data
      totalCount.value = res.data.total
      loadingType.value = 'loadmore'
      if (list == null || list.length == 0) {
        loadingType.value = 'nomore'
        return
      }
      dataList.value = type === 'refresh' ? list : dataList.value.concat(list)
      pageNo.value++
    })
    .catch((error) => {
      uni.hideLoading()
      showMessage(error)
    })
}

const showMessage = (message) => {
  scanPopup.value && scanPopup.value.losefocus()
  comMessageRef.value.showErrorMessage(message, (res) => {
    if (res) {
      afterCloseMessage()
    }
  })
}

const afterCloseMessage = () => {
  if (scanPopup.value) {
    scanPopup.value.getfocus()
  }
}

const tabChange = (index) => {
  tabIndex.value = index
  getContentByTab(index, pageNo.value, pageSize.value, 'refresh')
}

const confirm = (locationCode, status) => {
  if (packingNumber.value) {
    locationCode.value = locationCode
    if (status.length > 0) {
      const arrayItems = status.join(',')
      inventoryStatus.value = arrayItems
    } else {
      inventoryStatus.value = ''
    }
    tabChange(tabIndex.value)
  } else {
    filter.value.clearData()
    showMessage('请先扫描物料')
  }
}
</script>

<style scoped lang="scss">
page {
  height: 100%;
}

.top {
  width: 100%;
  position: fixed;
  /* #ifdef APP */
  top: 0rpx;
  /* #endif */

  /* #ifdef H5 */
  top: 80rpx;
  /* #endif */

  right: 0;
}
</style>