<template>
    <el-select
        :value="value"
        :placeholder="`请选择${name}`"
        clearable
        filterable
        @change="changeSelect"
        class="filter-item"
    >
        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
    </el-select>
</template>

<script>
export default {
    props: {
        value: {
            type: [Number, String],
            default: ''
        },
        flag: {
            type: Number,
            default: 1
        },
        name: {
            type: String,
            default: '类型'
        }
    },
    data() {
        return {
            options: []
        };
    },
    mounted() {
        this.$nextTick(() => {
            this.getList();
        });
    },
    methods: {
        getList() {
            this.$http
                .post('/setting/byFlag', { flag: this.flag })
                .then(res => {
                    this.options = res.map(item => {
                        return {
                            label: item.name,
                            value: item.id
                        };
                    });
                })
                .catch(e => {
                    console.log(e);
                    this.$message.error(e.error);
                });
        },
        changeSelect(val) {
            this.$emit('input', val);
        }
    }
};
</script>

<style lang="less" scoped></style>
