storeList.vue 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. <template>
  2. <a-select
  3. show-search
  4. label-in-value
  5. :value="dealerName"
  6. placeholder="请输入名称搜索"
  7. style="width: 100%"
  8. :filter-option="false"
  9. :not-found-content="fetching ? undefined : null"
  10. @search="fetchUser"
  11. @change="handleChange"
  12. allowClear
  13. >
  14. <a-spin v-if="fetching" slot="notFoundContent" size="small" />
  15. <a-select-option v-for="item in data" :key="item.sn" :value="item.sn">
  16. {{ item.name }}
  17. </a-select-option>
  18. </a-select>
  19. </template>
  20. <script>
  21. import debounce from 'lodash/debounce'
  22. import { getStoreList } from '@/api/power-superUser'
  23. export default {
  24. name: 'StoreList',
  25. props: {
  26. },
  27. data () {
  28. this.lastFetchId = 0
  29. this.fetchUser = debounce(this.fetchUser, 800)
  30. return {
  31. data: [],
  32. dealerName: [],
  33. fetching: false
  34. }
  35. },
  36. methods: {
  37. fetchUser (dealerName) {
  38. console.log('fetching user', dealerName)
  39. if (dealerName == '') return
  40. this.lastFetchId += 1
  41. const fetchId = this.lastFetchId
  42. this.data = []
  43. this.fetching = true
  44. getStoreList({ 'name': dealerName, pageNo: 1, pageSize: 20 }).then(res => {
  45. if (fetchId !== this.lastFetchId) {
  46. return
  47. }
  48. this.data = res.data.list || []
  49. this.fetching = false
  50. })
  51. },
  52. handleChange (value) {
  53. Object.assign(this, {
  54. dealerName: value,
  55. data: [],
  56. fetching: false
  57. })
  58. this.$emit('change', value)
  59. },
  60. resetForm () {
  61. this.dealerName = []
  62. },
  63. getInfo (con) {
  64. this.dealerName = [{ key: con.key, label: con.name }]
  65. },
  66. // 查询详细
  67. getDetail (sn) {
  68. // dealerFindUpdateInfoBySn({ sn: sn }).then(res => {
  69. // this.$emit('dealerDetail', res.data || null)
  70. // })
  71. }
  72. }
  73. }
  74. </script>