const ReturnReason = {
  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: '请输入退货原因'
    },
    size: {
      type: String,
      default: 'small'
    }
  },
  data() {
    return {
      defaultVal: this.value,
      open: false,
      list: [
        '漏油或者不上油',
        '外观不良：脏污、破损、脱胶、变形等',
        '尺寸问题',
        '泄压',
        '无法安装',
        '无法或不便安装',
        '抖动或跳动',
        '噪音',
        '刮雨不干净',
        '胶条断裂、脱落',
        '喇叭无声',
        '声音嘶哑或者变音',
        '浸水',
        '伤盘',
        '摩擦块掉渣，脱落或有残渣',
        '制动不足，刹车不灵敏',
        '不耐磨',
        '冒烟',
        '缺少感应线',
        '尺寸不标准',
        '不点火，间歇式失火',
        '漏电',
        '击穿',
        '烧蚀',
        '包装型号不符',
        '整体不亮/部分能亮',
        '灯珠脱落',
        '漏电短路',
        '包装型号不符/包装破损',
        '召回'
        ]
    };
  },
  mounted() {
  },
  watch: {
    value(newValue, oldValue) {
      this.defaultVal = newValue
    },
  },
  methods: {
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      );
    },
    onChange(value) {
      console.log('onChange', value);
      this.open = true;
      this.defaultVal = value;
      this.$emit('change', value);
      this.$emit('input', value);
    },
    onBlur(value){
      this.open = false;
      this.$emit('blur', value);
    }
  },
};

export default ReturnReason