index.vue 4.44 KB
<template>
  <div class="ExtDxProductWorkUnitSelect">
    <el-select
      :value="selVal"
      :loading="loading"
      filterable
      remote
      :remote-method="remoteMethod"
      :disabled="disabled"
      loading-text="数据正在加载中..."
      :placeholder="!options.length?'至少输入三位进行查询':'暂无数据'"
      @change="change"
    >
      <el-option
        v-for="item in options"
        :key="item.key"
        :label="item.label"
        :value="item.value"
      />
    </el-select>
  </div>
</template>

<script>

export default {
  name: 'ExtDxProductWorkUnitSelect',
  componentName: '远程搜索库位',
  props: {
    value: {
      type: [String, Number],
      default: ''
    },
    basicData: {
      type: Object,
      default: () => ({})
    },
    form: {
      type: Object,
      default: () => {}
    },
    scope: {
      type: Object,
      default: () => {}
    },
    disabled: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      loading: false,
      options: [],
      remoteFlag: true,
      storageZoneId: '',
      selVal: ''
    }
  },
  computed: {},
  watch: {
    value: {
      immediate: true,
      handler(val) {
        if (val) {
          this.selVal = val
        }
      }
    },
    'scope.row': {
      immediate: true,
      deep: true,
      handler: function(val) {
        val && (this.storageZoneId = val.storageZoneId)
        const inventoryJobResponses = val.inventoryJobResponses
        let targetObject = null
        if (inventoryJobResponses && inventoryJobResponses.length) {
          targetObject = inventoryJobResponses.find(item => item.subTypeName === 'JobResponseInEntry')
        }
        if (targetObject && targetObject.extWorkUnit && !this.value) {
          this.selVal = targetObject.extWorkUnit.extcode
        }
      }
    }
  },
  methods: {
    remoteMethod(query, id) {
      if (!this.storageZoneId) return this.$utils.showMessageWarning('缺少库房信息!')
      if ((!query || query.length < 3) && !id) return
      if (this.remoteFlag) {
        this.remoteFlag = false
        const params = {
          'pageFrom': 1,
          'pageSize': 10,
          'searchItems': {
            'items': [
              {
                'fieldName': 'extCenterId', 'operator': 'EQ', 'value': this.storageZoneId
              },
              {
                'fieldName': 'extcode', 'operator': 'LIKE', 'value': query
              }
            ]
          },
          'openProps': []
        }
        this.loading = true
        this.options = []
        this.$api.searchApi('ExtDxProductWorkUnit', params).then(res => {
          if (res.items && res.items.content.length) {
            this.options = res.items.content.map((item) => {
              return {
                label: item.extcode,
                value: `${item.id}+${item.extcode}`
              }
            })
          } else {
            this.locationList = []
          }
        })
          .catch((err) => console.log(err))
          .finally(() => {
            this.loading = false
            this.remoteFlag = true
          })
      } else {
        this.$utils.showMessageWarning('上一步请求正在查询中,请稍后')
      }
    },
    change(val) {
      // this.$emit('input', val)
      this.save(val)
    },
    save(val) {
      if (!val) this.$utils.showMessageWarning('请选择库位')
      const idValue = val.split('+')[0]
      const codeValue = val.split('+')[1]
      // this.selVal = codeValue
      this.$emit('input', codeValue)
      this.saveExtWorkUnit(idValue)
    },
    saveExtWorkUnit(resValue) {
      let targetObject = null
      const inventoryJobResponses = this.scope.row.inventoryJobResponses
      if (inventoryJobResponses && inventoryJobResponses.length) {
        targetObject = inventoryJobResponses.find(item => item.subTypeName === 'JobResponseInEntry')
      }
      if (!targetObject || !targetObject.id) return this.$utils.showMessageWarning('该条数据下无响应数据')

      if (!resValue) return this.$utils.showMessageWarning('请选择库位')
      const params = {
        id: targetObject.id,
        operator: 'MODIFY',
        extWorkUnitId: resValue,
        extWorkUnitIdType: 'ExtDxProductWorkUnit'
      }
      this.$api.recursion('JobResponseInStorage', params).then(res => {
        this.$utils.showMessageSuccess('保存成功')
        this.$bus.$emit('refreshUseItemConfirm')
      })
    }
  }
}
</script>

<style lang="scss">

</style>