logisticsPoint.js 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. import { pickUpPointList } from '@/api/pickUp'
  2. const LogisticsPoint = {
  3. template: `
  4. <a-select
  5. allowClear
  6. :size="size"
  7. mode="combobox"
  8. :value="defaultVal"
  9. show-search
  10. :placeholder="placeholder"
  11. option-filter-prop="children"
  12. style="width: 100%"
  13. :filter-option="filterOption"
  14. :dropdownMatchSelectWidth="false"
  15. @change="onChange"
  16. @blur="onBlur"
  17. @focus="open=true"
  18. @select="open=false"
  19. :open="open"
  20. >
  21. <a-select-option v-for="item in list" :key="item" :value="item">
  22. {{ item }}
  23. </a-select-option>
  24. </a-select>
  25. `,
  26. props: {
  27. value: {
  28. type: String,
  29. defatut: ''
  30. },
  31. id: {
  32. type: String,
  33. default: ''
  34. },
  35. placeholder: {
  36. type: String,
  37. default: '请输入物流点(最多50字符)'
  38. },
  39. defLoad:{
  40. type: Boolean,
  41. default: true
  42. },
  43. size: {
  44. type: String,
  45. default: 'default'
  46. }
  47. },
  48. data() {
  49. return {
  50. defaultVal: this.value,
  51. list: [],
  52. open: false,
  53. };
  54. },
  55. mounted() {
  56. if(this.defLoad){
  57. this.getList()
  58. }
  59. },
  60. watch: {
  61. value(newValue, oldValue) {
  62. this.defaultVal = newValue
  63. },
  64. },
  65. methods: {
  66. filterOption (input, option) {
  67. return (
  68. option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
  69. )
  70. },
  71. onChange(value) {
  72. const ret = value?value.substr(0,50):''
  73. this.defaultVal = ret;
  74. this.$emit('change', ret);
  75. this.$emit('input', ret);
  76. },
  77. onBlur(value){
  78. this.open = false;
  79. this.$emit('blur', value);
  80. },
  81. getList (data) {
  82. if(!data){
  83. pickUpPointList({}).then(res => {
  84. if (res.status == 200) {
  85. this.list = res.data
  86. } else {
  87. this.list = []
  88. }
  89. })
  90. }else{
  91. this.list = data
  92. }
  93. },
  94. clearData(){
  95. this.list = []
  96. }
  97. },
  98. };
  99. export default LogisticsPoint