sfms3.0-uniapp/src/mycomponents/detail/comRequestDetailCard.vue

<template>
  <view class="" style="background-color: #fff">
    <u-collapse ref="collapse">
      <u-collapse-item :open="true">
        <template v-slot:title>
          <item-compare-qty :dataContent="dataContent" :handleQty="Number(dataContent.handleQty)" :isShowStdPack="false" style="flex: 1"> </item-compare-qty>
        </template>
        <u-swipe-action :show="item.show" :index="index" v-for="(item, index) in dataContent.subList" :key="index" :options="item.scaned ? scanOptions : detailOptions" bg-color="rgba(255,255,255,0)" @click="(...event) => swipeClick(event, item)">
          <recommend :detail="item" :record="item.record" :isShowPack="isShowPack" :isShowBatch="isShowBatch" :isShowFromLocation="isShowLocation"></recommend>
        </u-swipe-action>
      </u-collapse-item>
    </u-collapse>
    <balance-qty-edit ref="qtyEdit" :settingParam="settingParam" @confirm="confirm"></balance-qty-edit>
    <com-message ref="comMessageRef" />
  </view>
</template>

<script setup lang="ts">
import { ref, getCurrentInstance, onMounted, watch, nextTick } from 'vue'
import itemCompareQty from '@/mycomponents/item/itemCompareQty.vue'
import recommend from '@/mycomponents/recommend/recommend.vue'
import balanceQtyEdit from '@/mycomponents/qty/balanceQtyEdit.vue'
import comReturnRequestInfo from '@/pages/productionReturn/coms/comReturnRequestInfo.vue'
import { getDetailOption, getDetailEditRemoveOption, getDetailRemoveOption } from '@/common/array.js'

const props = defineProps({
  dataContent: {
    type: Object,
    default: {}
  },
  settingParam: {
    type: Object,
    default: {}
  },
  isShowPack: {
    type: Boolean,
    default: true
  },
  isShowBatch: {
    type: Boolean,
    default: true
  },
  isShowLocation: {
    type: Boolean,
    default: true
  }
})
const option = ref([])
const showItem = ref({})
const editItem = ref({
  record: {}
})
const detailOptions = ref([])
const scanOptions = ref([])
const requestItem = ref({})
const qtyEdit = ref()
const comMessageRef = ref()
const dataContent = ref([])
const collapse = ref()
dataContent.value = props.dataContent
dataContent.value.subList.forEach((item) => {
  item.show = false
})
onMounted(() => {
  if (detailOptions.value.length == 0) {
    detailOptions.value = getDetailOption()
  }
  if (scanOptions.value.length == 0) {
    scanOptions.value = getDetailEditRemoveOption()
  }
})
// 监视属性
watch(
  () => props.dataContent,
  (val) => {
    requestItem.value = val.subList[0]
    dataContent.value = val
    dataContent.value.subList.forEach((item) => {
      item.show = false
    })
    nextTick(() => {
      collapse.value.init()
    })
  },
  {
    immediate: true,
    deep: true
  }
)
const swipeClick = (params, item) => {
  let text = ''
  if (item.scaned) {
    text = scanOptions.value[params[1]].text
  } else {
    text = detailOptions.value[params[1]].text
  }
  if (text == '详情') {
    detail(item)
  } else if (text == '编辑') {
    edit(item)
  } else if (text == '移除') {
    remove(item)
  }
}
const edit = (item) => {
  editItem.value = item
  qtyEdit.value.openEditPopup(item.balance, item.record.qty)
}
const detail = (item) => {
  emit('openDetail', item)
}
const remove = (item) => {
  comMessageRef.value.showQuestionMessage('确定移除扫描信息?', (res) => {
    if (res) {
      item.scaned = false
      item.record = {}
      item.balance = {}
      item.inventoryStatus = item.RecommendInventoryStatus
      emit('remove', item)
    }
  })
}
const confirm = (qty) => {
  editItem.value.record.qty = qty
  emit('updateData')
}
// 传递给父类
const emit = defineEmits(['openDetail', 'remove', 'updateData'])
</script>

<style>
::v-deep .u-arrow-down-icon {
  margin-right: 0px !important;
}
</style>