<template>
    <el-cascader ref="labelScopes"
                 v-model="value"
                 :options="options"
                 :props="propertys.props"
                 :show-all-levels="false"
                 collapse-tags
                 clearable
                 filterable
                 @change="onChange"
                 @visible-change="visibleChange"
    ></el-cascader>

</template>

<script>
    /**
     *
     *
     * <item @getData="getData" @change="change" :model.sync="model"></item>
     *  parent.$refs.item.init(model);
     */
    export default {
        name: "wxcode",
        data() {
            return {
                value: [],
                options: [],
                propertys:{},
            };
        },
        props: {
            model: {
                type: Array,
                default: ()=>[]
            },
            getData: {
                type: Function,
            },
            property: {//整个组件的可配置属性
                type: Object,
                default:  ()=>{}
            }
        },
        created() {
            this.getData().then(data => {
                this.options = data
            });
            MapUtil.setDftValue(this.propertys, {
                props: {
                    expandTrigger: 'hover',
                    checkStrictly: false,
                    label: 'label',
                    value: 'id',
                    children: 'children',
                },
                ...this.property
            });
            this.propertys.props.multiple = true;
            this.propertys.props.emitPath = false;
        },
        mounted() {


        },
        methods: {
            visibleChange(flag) {
                if (flag) {
                    this.$emit('focus')
                }
            },
            init(value) {
                let vm = this;
                vm.value = value;
                vm.oldValue = value;
                vm.isFocus = true;//当前组件获取到焦点
                vm.$nextTick(function () {
                    vm.$refs.labelScopes.toggleDropDownVisible(true)
                })
            },
            onChange() {
                this.$emit("update:model", this.value);
                this.$emit("change", this.value);
            },
            limitNum() {
                let vm = this;
                this.value = this.value.replace(/[^\d]/g, "");
            },
            /**
             * 组件数据提交
             */
            submit() {
                let vm = this;
                vm.$emit("submit", {
                    sucess: () => {
                    },
                    error: (obj) => {//obj 错误信息
                        this.$message(obj.msg)
                    }
                });
            },
            keyup() {
                this.submit();
            }
        }
    };
</script>
