zgty-mas-m/pages/material/inventoryCheck/check.vue

<template>
  <navbar-back title="库存盘点"></navbar-back>
  <view class="pl8 pr8 pt8">
    <uni-section type="line" title="盘点信息" titleFontSize="15px">
      <view class="x-f p4">
        <view>盘点库：</view><text>{{ formData.warehouseName }}</text>
      </view>
      <view class="x-f p4">
        <view>库管员：</view><text>{{ checkInfo.operatorName }}</text>
      </view>
      <view class="p4 x-f">
        <view>标题：</view><text>{{ checkInfo.title }}</text>
      </view>
    </uni-section>
    <uni-section v-if="checkList.length > 0" type="line" title="盘点任务" titleFontSize="15px">
      <up-input
        v-if="showAction"
        border="bottom"
        v-model="materialCode"
        placeholder="请扫描物料标签"
        prefixIcon="scan"
        fontSize="16"
        prefixIconStyle="font-size: 30px;"
        @confirm="handleScan()"
      >
      </up-input>
      <scroll-view style="height: 52vh" scroll-y scroll-with-animation>
        <uni-card margin="5px" padding="0" v-for="(item, index) in checkList" @click="handleDetail(item)">
          <view class="mt4">
            <view
              >物料名称：<text class="black">{{ item.productName }}</text></view
            >
          </view>
          <view class="mt4"
            >规格：<text class="black">{{ item.productSpecification }}</text></view
          >
          <view class="mt4"
            >型号：<text class="black">{{ item.productModelNo }}</text></view
          >
          <view class="mt4"
            >单位：<text class="black">{{ item.unit }}</text></view
          >
          <view class="mt4">
            <view
              >库存数量：<text class="black">{{ item.expected }}</text></view
            >
          </view>
          <view class="mt4">
            <view
              >实际数量：<text class="black">{{ item.actual }}</text></view
            >
          </view>
        </uni-card>
      </scroll-view>
      <up-button
        v-if="showAction"
        class="mt10"
        type="primary"
        :loading="btnLoading"
        style="width: 50%"
        text="提交"
        @click="handleSubmit"
      ></up-button>
    </uni-section>
  </view>
</template>

<script setup>
import { computed, ref, toRefs, watch, onMounted } from 'vue'
import { debounce } from 'lodash'
import nx from '@/nx'
import { onLoad, onShow } from '@dcloudio/uni-app'

const btnLoading = ref(false)
let materialCode = ref('')

let checkList = ref([])

let checkInfo = ref({})
const formData = ref({})

const showAction = ref(true)
const { scanQRInfo } = toRefs(nx.$store('biz'))
watch(scanQRInfo, newVal => {
  debouncedHandleScan(newVal)
})
const debouncedHandleScan = debounce(val => {
  if (!val) return
  scanQRInfo.value = ''
  if (nx.$router.getCurrentPage().route !== 'pages/material/inventoryCheck/check') return
  try {
    const {code} = JSON.parse(val)
    materialCode.value = code
    handleScan()
  } catch (error) {
    uni.showToast({
      title: '请扫描正确的物料编码',
      icon: 'none'
    })
  }
}, 300)
onShow(() => {
  scanQRInfo.value = ''
})
async function handleScan() {
  const info = await getMaterialInfo()
  if (info) {
    await nx.$api.material.inventoryCheckInf({ checkId: checkInfo.value.id, infomationId: info.id })
    setTimeout(() => {
      uni.showToast({
        title: '成功',
        icon: 'none'
      })
    }, 10)
    getCheckInfo(checkInfo.value.id)
  }
}
async function getMaterialInfo() {
  if (materialCode.value === '') return
  let params = {
    code: materialCode.value,
    businessType: 'inventory_check'
  }
  const data = await nx.$api.material.queryMaterialInfo(params)
  if (!data)
    return uni.showToast({
      title: '未查询到该物料信息',
      icon: 'none'
    })
  return data
}
onLoad(async options => {
  if (options.current == 1) showAction.value = false
  getCheckInfo(options.id)
})
async function getCheckInfo(checkId) {
  const data = await nx.$api.material.getLifecycleDetail({
    id: checkId
  })
  checkList.value = data.checkItems
  checkInfo.value = data
  if (data.formData) {
    formData.value = JSON.parse(data.formData)
  }
}
async function handleSubmit() {
  uni.showModal({
    title: '提示',
    content: '确定提交吗？',
    success: async function (res) {
      if (res.confirm) {
        btnLoading.value = true
        await nx.$api.material.submitInventoryCheck({ id: checkInfo.value.id }).finally(() => {
          btnLoading.value = false
        })
        uni.showToast({
          title: '提交成功',
          icon: 'none'
        })
        uni.navigateBack()
      } else if (res.cancel) {
        console.log('用户点击取消')
      }
    }
  })
}
function handleDetail(item) {
  nx.$router.go('/pages/material/inventoryCheck/detailList', { itemId: item.id, name: item.productName,checkId:checkInfo.value.id})
}
onMounted(async () => {})
</script>

<style lang="scss" scoped>
:deep(.uni-select__input-placeholder) {
  font-size: 16px;
}
</style>