/**
 * 联想输入
 * 1. 支持前端搜索
 * 2. 支持后端搜索
 * 3.支持 datSource mixin
 * @author xiufu.wang
 */
import ElAutocomplete from 'element-ui/packages/autocomplete';
import dataSource from 'mars-pro/src/pro/mixins/dataSource';
import BaseMixin from 'mars-pro/packages/pro-input/src/mixins/base';
import Locale from 'mars-pro/src/mixins/locale';

export default {
    name: 'ProInputAutocomplete',
    componentName: 'ProInputAutocomplete',
    mixins: [BaseMixin, dataSource('selectDataSource', '', { multipleVm: true }), Locale],
    props: {
        dataSource: [String, Array, Object],
        remoteFilter: {
            type: Boolean,
            default: true
        }
    },
    components: {
        ElAutocomplete
    },
    created() {
        if (this.dataSource && typeof this.dataSource === 'string') {
            this.selectDataSource.updateOption(this.$attrs, this.dataSource)
        }
    },
    computed: {
        //原始数据
        realDataSource() {
            if (this.dataSource && this.dataSource.isDataSource === true) {
                return this.dataSource
            }
            if (typeof this.dataSource === 'string') {
                return this.selectDataSource
            }
            return this.dataSource
        },
        selectDatas() {
            return this.realDataSource && this.realDataSource.isDataSource ? this.realDataSource.formatDatas : this.realDataSource
        }
    },
    render() {
        const _datas = {
            props: {
                value: this.value,
                fetchSuggestions: this.realDataSource && this.realDataSource.isDataSource === true ? this.realDataSource.fetchSuggestions : undefined,
                ...this.$attrs,
                popperClass: `pro-input-autocomplete-popper ${this.$attrs.popperClass}`
            },
            attrs: this.$attrs,
            on: this.$listeners,
            'class': {
                'pro-input-autocomplete': true
            },
            scopedSlots: this.$scopedSlots
        }
        return (
            <ElAutocomplete {..._datas}>
                {this.renderSlots()}
            </ElAutocomplete>
        )
    }
}