baoshi-swms-app-web/src/views/inbound/takeDelivery/components/Attribute.vue

<template>
  <div class="attribute">
    <van-dialog v-model:show="attributeTrueFalseBy"
                title="维护货品属性"
                show-cancel-button
                :beforeClose="beforeClose"
                :keyboardEnabled="false"
    >
      <div>
        <van-form>
          <van-cell-group inset>
            <van-field v-if="attribute.includes('size')"
                       v-model="length"
                       name="length"
                       type="number"
                       label="长/厘米:"
                       placeholder="请输入长/厘米"
                       :label-width="70"
                       clearable
                       autocomplete="off"
            />
            <van-field v-if="attribute.includes('size')"
                       v-model="width"
                       name="width"
                       type="number"
                       label="宽/厘米:"
                       placeholder="请输入宽/厘米"
                       :label-width="70"
                       clearable
                       autocomplete="off"
            />
            <van-field v-if="attribute.includes('size')"
                       v-model="height"
                       name="height"
                       type="number"
                       label="高/厘米:"
                       placeholder="请输入高/厘米"
                       :label-width="70"
                       clearable
                       autocomplete="off"
            />
            <van-field v-if="attribute.includes('metering')"
                       v-model="weight"
                       name="weight"
                       type="number"
                       label="重量/千克:"
                       placeholder="请输入重量/千克"
                       :label-width="70"
                       clearable
                       autocomplete="off"
            />
            <van-field v-if="attribute.includes('carton')"
                       v-model="packCarton"
                       name="packCarton"
                       type="number"
                       label="每箱件数:"
                       placeholder="请输入每箱件数"
                       :label-width="70"
                       clearable
                       autocomplete="off"
            />
             <van-field v-if="attribute.includes('carton') && midPackSpecEnabled"
                       v-model="midPackSpec"
                       name="midPackSpec"
                       type="number"
                       label="每包件数:"
                       placeholder="请输入每包件数"
                       :label-width="70"
                       clearable
                       autocomplete="off"
            />
          </van-cell-group>
        </van-form>
      </div>
    </van-dialog>
  </div>
</template>
<script setup>
import { ref } from 'vue'
import { showToast } from 'vant'

const attributeTrueFalseBy = ref(false)
//长/厘米
const length = ref('')
//宽/厘米
const width = ref('')
//高/厘米
const height = ref('')
//每箱件数
const packCarton = ref('')
//重量/千克
const weight = ref('')
const packId=ref('')
const attribute = ref([])
const midPackSpec = ref('')
const midPackSpecEnabled = ref(false)
const show = (item, attributeMap) => {
  midPackSpec.value =''
  length.value =''
  width.value =''
  height.value = ''
  packCarton.value = attributeMap.packCarton
  packId.value =attributeMap.packId
  weight.value = ''
  attribute.value = item
  midPackSpecEnabled.value = attributeMap.midPackSpecEnabled
  attributeTrueFalseBy.value = true
}

const emit = defineEmits()
const beforeClose = (action) =>
  new Promise(async (resolve) => {
    if (action === 'confirm') {
      if (['size'].some(val => attribute.value.includes(val))) {
        if (!length.value || !width.value || !height.value ) {
          showToast('请输入长宽高')
          return resolve(false)
        }
      }
      if (['metering'].some(val => attribute.value.includes(val))) {
        if (!weight.value) {
          showToast('请输入重量')
          return resolve(false)
        }
      }
      if (['carton'].some(val => attribute.value.includes(val))) {
        if (!packCarton.value) {
          showToast('请输入每箱件数')
          return resolve(false)
        }
        if (midPackSpecEnabled.value && !midPackSpec.value) {
          showToast('请输入每包件数')
          return resolve(false)
        }
      }
      const data = {
        height: height.value ? height.value / 100 : undefined,
        length: length.value ? length.value / 100 : undefined,
        width: width.value ? width.value / 100 : undefined,
        packCarton: packCarton.value,
        packId: midPackSpecEnabled.value ? '1/' +midPackSpec.value+'/' + packCarton.value : packCarton.value ? '1/' + packCarton.value : 'STANDARD',
        weight: weight.value ? weight.value: undefined ,
        cube:(height.value && width.value && length.value)? (height.value / 100) * (length.value / 100) * (width.value / 100):undefined,
      }
      emit('setAttribute', data)
    }
    resolve(true)
  })
defineExpose({ show })

</script>
<style lang="scss" scoped>
</style>