<template>
    <div :class="b()">

        <eye-field  ref="searchInput"
                    label="货品分类"
                    maxLength="30"
                    @input="onKeywordHandler">
        </eye-field>


        <div :class="b('body')" class="eye-scroll">


            <eye-renderer ref="searchRenderer"
                          :visible.sync="currentVisible"
                          :dataProviderLoader="keywordDataProviderLoader"
                          v-model="currentValue"
                          :params="form"
                          labelField="text"
                          valueField="id"
                          itemClass="search__item"
                          @itemChange="onItemClick"
                          @dataProviderChange="onDataProviderChange">
            </eye-renderer>




        </div>

    </div>

</template>

<script type="text/babel">

  import  { Component,Core,Field }  from 'eye-core';
  import CategoryService from 'eye-com/src/services/common/CategoryService';

  export default Component({

    name: 'search',

    mixins:[ Field ],

    services: [ CategoryService ],

    props: {

    },

    data() {
      return {
          form:{}
      }
    },

    methods: {


        onKeywordHandler(e) {
            this.clearTimeDelay && clearTimeout(this.clearTimeDelay)
            this.clearTimeDelay = setTimeout(() => {
                this.form = {
                    keyword : e
                }
            },50)
        },


        keywordDataProviderLoader(e) {
            return this.$service.category.findKeyword(e.keyword)
        },

        onItemClick(e) {
            this.$emit('itemClick',e)
        },

        onDataProviderChange(e) {
            this.$emit('dataProviderChange',e)
        },

        onReset() {

            let searchInput = this.$refs.searchInput;
            let searchRenderer = this.$refs.searchRenderer;

            searchInput &&
                searchInput.clearCurrnetValue(),
                searchInput.pushFocus();

            searchRenderer &&
                searchRenderer.clearCurrnetValue();
        }


    }

  });
</script>

