/**
 * 选择系统代理商等级
 */
Vue.component('select-agent-group', {
    template: `<el-select v-model="group"
                          :placeholder="placeholder"
                          :disabled="isDisabled"
                          :size="size"
                          value-key="id"
                          @change="changeGroup"
                          clearable filterable>
                    <el-option v-for="item in dataList"
                            :key="item.id"
                            :label="item.name"
                            :value="item">
                    </el-option>
                </el-select>`,
    props: {
        'groupId': {
            type: String,
            default: '',
        },//选择的代理商等级ID
        'groupName': {
            type: String,
            default: '',
        },//选择的代理商等级名称
        'isDisabled': {
            type: Boolean,
            default: false,
        },//是否禁止修改
        'placeholder': {
            type: String,
            default: '选择代理商等级'
        },
        'size': {
            type: String,
            default: 'small',
        }
    },
    data() {
        return {
            group: {
                id: '',
                name: '',
            },//已选中代理商等级
            dataList: [],// 数据
        };
    },
    methods: {
        //切换代理商等级
        changeGroup(val) {
            this.$emit('update:groupId', this.group.id);
            this.$emit('update:groupName', this.group.name);
            this.$emit('change', val);
        },
        //获取代理商等级列表
        getGroupList(callback) {
            this.dataList = [];
            this.sendRequest('Admin/Usergroup/getAgentGroup',{
                success: (res) => {
                    if (res.status == 1) {
                        this.dataList = res.data;
                        typeof callback == "function" && callback();
                    }
                },
            })
        },
        unitGroup(id, name) {
            if (!id && !name) {
                return {
                    id: '',
                    name: '',
                }
            }
            if (id && name) {
                return {
                    id: id,
                    name: name,
                }
            }
            for (let i in this.dataList) {
                if (this.dataList[i].id == id || this.dataList[i].name == name) {
                    return {
                        id: this.dataList[i].id,
                        name: this.dataList[i].name,
                    }
                }
            }
            return {
                id: '',
                name: '',
            };
        }
    },
    created() {
        this.getGroupList(() => {
            this.group = this.unitGroup(this.groupId, this.groupName);
        });
    },
    watch: {
        groupId(n) {
            if (this.group.id != n) {
                this.group = this.unitGroup(this.groupId, this.groupName);
            }
        },
        groupName(n) {
            if (this.group.name != n) {
                this.group = this.unitGroup(this.groupId, this.groupName);
            }
        }
    }
});