<template>
    <div id="cascaderMap">
        <span class="buildFloor" style="margin-right: 12px">设备类别</span>
        <el-cascader
            ref="cascader"
            v-model="value"
            placeholder="请选择"
            filterable
            clearable
            :props="props"
            :options="options"
            :style="isWidth ? '' : 'width:160px;'"
            size="small"
            @change="changeVal"
            popper-class="equip-cascader"
        >
        </el-cascader>
    </div>
</template>
<script>
import { mapGetters } from "vuex";
import { getEquipLkSys } from "@/api/dict";

export default {
    name: "getCode",
    props: {
        isWidth: {
            type: Boolean,
            default: true,
        },
        all: {
            type: Boolean,
            default: false,
        },
    },
    computed: {
        ...mapGetters("layout", ["projectId"]),
    },
    data() {
        return {
            value: [],
            options: [],
            props: {
                value: "code",
                label: "name",
                children: "children",
            },
        };
    },
    created() {
        this.getData();
    },
    watch: {
        projectId() {
            this.value = "";
            this.getData();
        },
    },
    methods: {
        setValue(val) {
            let flag = true;
            this.options.forEach((sys) => {
                sys.children.forEach((eq) => {
                    if (eq.code === val) {
                        flag = false;
                        this.value = [sys.code, eq.code];
                    }
                });
            });
            // 如果未找到对应的设备类，则置空
            if (flag) this.value = [];
        },
        //修改val
        changeVal(val) {
            let value = {};
            if (val && val[1]) {
                this.options.forEach((sys) => {
                    sys.children.forEach((eq) => {
                        if (eq.code === val[1]) {
                            value.facility = eq.name;
                            value.code = eq.code;
                        }
                    });
                });
            }
            this.$emit("change", value);
        },
        //获取当前项目下的设备类型(只拿到编码-需要过滤)
        getData(val) {
            let params = {
                distinct: true,
                pageNumber: 1,
                pageSize: 1000,
                projection: ["classCode"],
            };
            if (val && val[0] != "all") {
                params.filters = "";
                if (val[0] == "noKnow") {
                    params.filters += `;buildingId isNull`;
                } else if (val[0] && val[0] != "all") {
                    params.filters += `;buildingId='${val[0]}'`;
                }
                if (val[1] == "noKnow") {
                    params.filters += `;floorId isNull`;
                } else if (val[1] && val[1] != "all") {
                    params.filters += `;floorId='${val[1]}'`;
                }
                params.filters = params.filters.slice(1);
            }
            getEquipLkSys(params, (res) => {
                if (res.content) {
                    this.options = res.content;
                } else {
                    this.options = [];
                }
            });
        },
    },
};
</script>
<style lang="less">
.equip-cascader {
    .el-cascader-menu__wrap {
        height: 550px;
    }
}
</style>
<style lang="less" scoped>
#cascaderMap {
    float: left;
    margin-left: 10px;

    .buildFloor {
        color: #999999;
        font-size: 14px;
    }

    /deep/ .el-scrollbar__wrap {
        height: 563px;
    }
}
</style>
