custSatelliteList.vue 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. <template>
  2. <!-- 卫星仓客户 -->
  3. <a-select
  4. show-search
  5. label-in-value
  6. :value="dealerName"
  7. placeholder="请输入名称搜索"
  8. style="width: 100%"
  9. :filter-option="false"
  10. :not-found-content="fetching ? undefined : null"
  11. @search="fetchUser"
  12. @change="handleChange"
  13. allowClear
  14. >
  15. <a-spin v-if="fetching" slot="notFoundContent" size="small" />
  16. <a-select-option v-for="item in data" :key="item.customerSn" :value="item.customerSn">{{ item.customerName }}</a-select-option>
  17. </a-select>
  18. </template>
  19. <script>
  20. import debounce from 'lodash/debounce'
  21. import { custList } from '@/api/customer'
  22. export default {
  23. props: {
  24. verify: { // 当前输入客户名称是否是卫星仓客户 提示信息
  25. type: Boolean,
  26. default: false
  27. }
  28. },
  29. data () {
  30. this.lastFetchId = 0
  31. this.fetchUser = debounce(this.fetchUser, 800)
  32. return {
  33. data: [],
  34. dealerName: [],
  35. fetching: false
  36. }
  37. },
  38. methods: {
  39. fetchUser (dealerName) {
  40. console.log('fetching user', dealerName)
  41. if (dealerName == '') return
  42. this.lastFetchId += 1
  43. const fetchId = this.lastFetchId
  44. this.data = []
  45. this.fetching = true
  46. custList({ customerName: dealerName, satelliteFlag: 1, pageNo: 1, pageSize: 20 }).then(res => {
  47. if (fetchId !== this.lastFetchId) {
  48. return
  49. }
  50. this.data = res.data && res.data.list ? res.data.list : []
  51. if (this.verify && this.data.length == 0) {
  52. this.$message.info('客户不存在')
  53. }
  54. this.fetching = false
  55. })
  56. },
  57. handleChange (value) {
  58. Object.assign(this, {
  59. dealerName: value,
  60. data: [],
  61. fetching: false
  62. })
  63. this.$emit('change', value || { key: undefined, label: '' })
  64. },
  65. resetForm () {
  66. this.dealerName = []
  67. }
  68. }
  69. }
  70. </script>