import { pickUpPointList } from '@/api/pickUp'
const LogisticsPoint = {
  template: `
      <a-select
          allowClear
          :size="size"
          mode="combobox"
          :value="defaultVal"
          show-search
          :placeholder="placeholder"
          option-filter-prop="children"
          style="width: 100%"
          :filter-option="filterOption"
          :dropdownMatchSelectWidth="false"
          @change="onChange"
          @blur="onBlur"
          @focus="open=true"
          @select="open=false"
          :open="open"
        >
          <a-select-option v-for="item in list" :key="item" :value="item">
            {{ item }}
          </a-select-option>
        </a-select>
    `,
  props: {
    value: {
      type: String,
      defatut: ''
    },
    id: {
      type: String,
      default: ''
    },
    placeholder: {
      type: String,
      default: '请选择或输入物流点(最多50字符)'
    },
    defLoad:{
      type: Boolean,
      default: true
    },
    size: {
      type: String,
      default: 'default'
    }
  },
  data() {
    return {
      defaultVal: this.value,
      list: [],
      open: false,
    };
  },
  mounted() {
    if(this.defLoad){
      this.getList()
    }
  },
  watch: {
    value(newValue, oldValue) {
      this.defaultVal = newValue
    },
  },
  methods: {
    filterOption (input, option) {
      return (
        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      )
    },
    onChange(value) {
      const ret = value?value.substr(0,50):''
      this.defaultVal = ret;
      this.$emit('change', ret);
      this.$emit('input', ret);
    },
    onBlur(value){
      this.open = false;
      this.$emit('blur', value);
    },
    getList (data) {
      if(!data){
        pickUpPointList({}).then(res => {
          if (res.status == 200) {
            this.list = res.data
          } else {
            this.list = []
          }
        })
      }else{
        this.list = data
      }
    },
    clearData(){
      this.list = []
    }
  },
};

export default LogisticsPoint