<template>
    <div>
        <el-autocomplete
            v-model="brand"
            :fetch-suggestions="querySearchAsync"
            placeholder="请选择电梯品牌"
            @select="handleSelect"
            :disabled="disabled === 0"
        ></el-autocomplete>
    </div>
</template>
<script>
export default {
    props: {
        brandName: {
            default: '',
        },
        disabled: {
            default: null,
        },
    },
    created() {},
    data() {
        return {
            brand: `${this.brandName}`,
        };
    },
    methods: {
        async queryBrandList(data) {
            let companyArr = [];
            let dataForm = [];
            dataForm = await this.$common.allBrandList(data);
            console.log(dataForm);
            if (dataForm.data.records && dataForm.data.records.length === 0) {
                console.log('error');
                this.$emit('brandEmpty');
            }
            dataForm.data.records.forEach(item => {
                let companyItem = {
                    value: item.name,
                    id: item.id,
                };
                companyArr.push(companyItem);
            });
            return companyArr;
        },
        async querySearchAsync(queryString, cb) {
            let data;
            data = await this.queryBrandList(queryString);
            cb(data);
        },
        handleSelect(item) {
            console.log(item);
            this.$emit('brandChange', item);
        },
        // 重置按钮弹框清空数据
        reset() {
            this.brand = null;
        },
    },
    watch: {
        brand(val) {
            if (val === '') {
                this.$emit('brandEmpty');
            }
        },
        brandName(val) {
            this.brand = val;
        },
    },
};
</script>
